Following example from docs . Is there further configurtion to make new traitsa show for elements? The example using the input does not run, My id's are being picked up but not the additional attributes.
artf
I'm able to see your example properly and all the traits are working correctly. Are you able to create a reproducible demo?
no-response[bot]
This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take ac...
GJSBlock
Thanks for reporting this, @alpha2k-io. Great question about adding traits are not picked up by trait manager.. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your...
What are you trying to add to GrapesJS? Better Shadow DOM support, allowing developers to render GrapesJS inside a Shadow element without having to specifically pass in elements rather than selectors in the configuration. Describe your feature request detailed When currently using element selectors, GrapesJS simply us...
artf
Hi @AStoker I don't understand what is the real issue with your example (aside not loading GrapesJS styles inside your shadow dom). If you're attaching shadow dom, obviously, you can't do this container: '#gjs', but you're still able to pa...
AStoker
The issue is that I must pass HTML elements everywhere and cannot use selectors. This can become cumbersome to write as I must now use the shadow Dom's query selector for every panel, every element, anything that we hook into GrapesJS. Add...
AStoker
I updated the JSFiddle so you can see what we need to do to get styles within Shadow DOM. But unfortunately the CSS that's automatically added by GrapesJS exists on the body and is both polluting the global stylesheets and pointless due to...
I am new to grapes js , I am trying to make the blocks in a different style when dragging for example the image blocks 1 - when not dragged or hover takes style A . 2- when hover takes style B . 3- When dragged takes style C (when it is over the canvas). can any one help me with this issue . Thanks
ronaldohoch
Maybe with this events you can do it: https://grapesjs.com/docs/api/editor.html#blocks or https://grapesjs.com/docs/api/editor.html#canvas
artf
In such a case, probably a completely custom block manager UI is the only way (eg. rendered by your own BlockManager component in Angular). It should be possible already, but I'd prefer to take my time and update the Blocks documentation w...
hadeel94
In such a case, probably a completely custom block manager UI is the only way (eg. rendered by your own BlockManager component in Angular). It should be possible already, but I'd prefer to take my time and update the Blocks documentation w...
Version:0.17.4 The trait with type button does not call command on 0.17.4 which is used to work before 0.17.3.Expected Behaviour Clicking button invoke command defined in trait.What is happening Clicking button does nothingjsfiddle example Command working on 0.17.3 -> https://jsfiddle.net/7pmz4u1v/3/ Command not worki...
mosh-tudor
@maekawataiki This is fixed, but not yet released - https://github.com/artf/grapesjs/issues/3497
GJSBlock
Thanks for reporting this, @maekawataiki. Great question about Trait Button Command not working on 0.17.4. The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentation for your specifi...
Hey there π Love the editor! We're using traits to modify what classes a component has, but that feels a bit hacky as you have to redeclare ALL classnames for each trait selection Here a simple example: Each trait option has to have all the classes defined, because otherwise it will remove any existing classes. This...
krishnaeverestengineering
@deiga we are doing something like this.
artf
I'd attach the trait to some component property instead of the class attribute, and based on the value I'd use properly removeClass and addClass
GJSBlock
Thanks for reporting this, @deiga. Great question about [QUESTION] What is the idiomatic way to append and remove classes from components?. The recommended approach with Components is to use the event-driven API. Start here: Check the Grap...
I'm new to grapesJS ... Great tool.I have a few questions about traits. I followed this tutorial https://grapesjs.com/docs/modules/Traits.html#define-new-trait-type because I have to overwrite how href is generated. The example is great for me with few modifications. I I want to replace .... <select multiple="multiple...
artf
You can do this:
iteniel
@artf thanks Can you help with first part of the question I need something like onPostRender/afterRender to initialize the select2 component when the DOM is present somthing after createInput method
GJSBlock
Thanks for reporting this, @iteniel. Great question about [QUESTION]: Integrate select2 UI element into traits. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your...
WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdDo a quick SEARCH first, to see if someone else didn't open the same issueAll relative statements/questions have to be filled/answered, otherwise, th...
artf
Thanks @moises-flowize that will be fixed in the next release https://github.com/artf/grapesjs/commit/ac96298add119c4f4e000967ab3332f9ad711613
GJSBlock
Thanks for reporting this, @moises-flowize. The issue with Command core:component-enter not working in all the cases appears to be a race condition or state management timing problem. This typically happens when component lifecycle events...
Version: 0.17.4 Are you able to reproduce the bug from the demo?[ ] Yes[X] No What is the expected behavior?After inserting an iFrame that the src will be returned when using editor.getHTML()When loading a page that iframes will be recognized as iframe component and become editable again Describe the bug detailed Am a...
artf
I'll add iframe support in the next release
GJSBlock
Thanks for reporting this, @TheDude70. The issue with iframe does not save src / does not recognize iframes after load appears to be a race condition or state management timing problem. This typically happens when component lifecycle event...
Hi, If you for example add a 3 column block to a page, and try dragging a very wide image into each column, the content stretches and the overflow is hidden. How do we either add a vertical scrollbar or force the editor to limit the viewable size of images when dragged in. Currently if the content goes outside that ar...
artf
This is more a layout issue that you can easily fix by adding your CSS to all images, eg. img { max-width: 100%; }
GJSBlock
Thanks for reporting this, @samichamoun. Great question about Large images make area of content editor unreachable. The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentation for you...
Hello, right now grapesjs provides built in properties like margin, padding that allow user to change each property one by one (margin-top, margin-bottom, etc). It would be nice to have ability to change all these properties together. To have some lock button, for example, when it's enabled it will change all properti...
artf
Yeah, that would be cool, but unfortunately, GrapesJS doesn't have yet the proper UI module which could allow easily to build new UI components by reusing others, so StyleManager.addType is the only way but in that case, it's up to you bui...
GJSBlock
Thanks for reporting this, @kuhelbeher. Great suggestion about FEAT: Ability to change all margin, padding etc properties together! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior....