GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64) Reproducible demo link none Describe the bug I've defined my own component types with type specific drag-and-drop rules: but the configured functions are...
rozek
even with draggable and droppable set to true, I cannot drag one element into another
rozek
A first workaround which helps dropping components into other components:remove dragMode:'absolute', from grapesjs.init({...})instead, add dmode:'absolute', to model.defaults of every component type you want to be draggable (and, perhaps,...
artf
In absolute mode, there is no concept of moving components inside/outside of other components. A component in absolute mode is only updated in style position, it's not moved in the DOM, that's why draggable/droppable does not make sense to...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfiddle.net/vmeywbk8/11/ Describe the bug Just a small type issue we came across - when adding an action to the RichTextEditor, the "icon" property of RichTextEditorAction is marked a...
GJS Helper
You've accurately identified a type mismatch in GrapesJS regarding the icon property for Rich Text Editor (RTE) actions. The RichTextEditor.addAction method is indeed designed to accept both string (for SVG paths or class names) and HTMLEl...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 116 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Open the layer manager and try to move the componentIt will disable the component and show the errors in the consol...
GJS Helper
Thank you for reporting this issue. I can confirm that this is a reproducible bug in the latest version of GrapesJS, including on the official demo page (https://grapesjs.com/demo.html). This bug prevents users from reordering components u...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64)Reproducible demo link noneDescribe the bug scripts referenced by canvas.scripts can not import third-party modules based on an "import map". if the same mo...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64)Reproducible demo link noneDescribe the bug links entered into can not refer to JavaScript modules, or you may run into the following error: This makes it r...
artf
rozek
good to know, thanks
GJS Helper
The issue you're encountering, "Uncaught SyntaxError: Cannot use import statement outside a module," arises because the canvas.scripts option in GrapesJS injects script URLs using standard <script> tags. By default, browsers treat these as...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64) Reproducible demo link none Describe the bug I have a component type with a script When previewing a project using a component of this type, GrapesJS cre...
rozek
that's interesting: defining a separate function and defining the component type as described in the docs works as designed. But it still sounds strange, that an inline function produces a syntax error in the exported HTML...
artf
@rozek good catch, will fix for the next release
GJS Helper
The Uncaught SyntaxError: Unexpected token '{' you're encountering stems from how GrapesJS processes and embeds component scripts defined using the ES6 method shorthand syntax. This issue is a known behavior when the script property is def...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? latest version of Chrome Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug? <img width="1665" alt="image" src="https://github.com/GrapesJS/grapesjs/assets/114127651/657cbaf6-7e...
pittleCheung
Extended idea from https://github.com/GrapesJS/grapesjs/issues/1855
artf
Here it's explained how to create components with related styles https://grapesjs.com/docs/modules/Components.html#components-css Only in that case, it would be safe for the editor to delete related styles.
GJS Helper
The issue you're encountering, where deleting a component does not remove its corresponding styles, leading to redundant CSS, is a common challenge in web builders like GrapesJS. This behavior is by design in GrapesJS's CssComposer for sev...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 116.0.3 Reproducible demo link https://grapesjs.com/demo-mjml.html Describe the bug How to reproduce the bug?On the canvas scroll to the bottom and select a componentOpen the layersSelect a component that is at the...
GJS Helper
You've accurately identified a bug in GrapesJS where the scrollCanvas functionality fails to scroll the canvas to bring a selected component into view, particularly when selecting components from the Layers panel. This issue is reproducibl...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64)Reproducible demo link noneDescribe the bug I want the components in my editor to be moveable by dragging. After some research, I found that is needed to ac...
rozek
sorry - this was a problem on my side which became obvious within the editor only - sorry for bothering!
GJS Helper
The issue you've described with dragMode: 'absolute' causing components to appear offset is indeed a bug stemming from a fundamental HTML violation: duplicate id attributes within the DOM. Your analysis and screenshots accurately pinpoint...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64) Reproducible demo link none Describe the bug This bug is similar to issue #596 which has been locked because of a lack of conversation. This version may...
artf
Thanks @rozek the PR is always welcome, so I'll be happy to review it.
artf
Closing for now as it doesn't seem to be reproducible
GJS Helper
Thank you for reporting this issue and providing such a detailed analysis and a working solution! You've accurately identified a common UI problem where dynamically positioned elements, like a color picker, can extend beyond the viewport b...