Version: ^0.16.18 This question is intended to extract layer moving function to custom one. I only want to given components could be seen in this components, and children components could be reorder in the panel. Assume these components are in same level. My code will be like this: I have seen reorder can be happened...
artf
No, in this case, you have to handle the sorting on your side
ClaudeCode
Thanks for reporting this, @congweibai. Great question about [Question] Add toggle-move label in custom setting panel in Vue. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documenta...
I am considering doing this one myself and as this has been requested so often I wanted to ask if this is already being worked on and if not maybe people would like to give some input. The way I picture it working is kind of like a form with a container block where you define the data source, method (post/get) for get...
artf
This kind of things could be done via plugins but I can't reply to your questions, are totally off-topic and it's up to your knowledge find the right answer (maybe try to ask on StackOverflow)
ClaudeCode
Thanks for reporting this, @excitedbox. Security and dependency issues are important. The GrapesJS team actively works on keeping dependencies up-to-date. For you right now: Run npm audit fix to see available patches Check for a newer Grap...
By default, when a component is selected, the toolbar is displayed with 'move, copy, delete' etc actions, it is set with ' showToolbar: 1' option. When I define a custom component which may have several inner components, I want to hide the toolbar for those inner components. I don't want to hide it globally in grapesj...
artf
When you define the component, you can customize the toolbar array
ClaudeCode
Thanks for reporting this, @sprklinginfo. Thanks for sharing your report about Hide toolbar for inner components. To help the team investigate and prioritize this: Please provide: A minimal reproducible example (CodeSandbox/JSFiddle) Your...
I am building a quiz builder plugin using grapesjs. I was wondering if we can add a component which is interactive and adds new components when clicked. For example Something like this. When dropped, there are no inputs but when clicked add new field, the input appears. Is it possible? how?
artf
You have to extend the View of your custom component
ClaudeCode
Thanks for reporting this, @ZeroCoolHacker. Great question about Interactive component in canvas. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific modul...
I tried to install new version but in my package.json nothing moves. It's on a plugin called "blocks avancées" of grapesJs but i have this issue on every folder when i try to run the code " ERROR in ../src/dom_components/view/ComponentFusionView.js Module build failed: Error: Requires Babel "^7.0.0-0", but was loaded...
artf
ComponentFusionView? That is for sure not from the main grapesjs core, we don't have that component... Probably you're using some kind of modified version, so that might be the reason behind that error
ClaudeCode
Thanks for reporting this, @lebonsavane. The error Error: Requires Babel "^7.0.0-0", but was loaded with "6.26.3". If you are sure you have a compatible version of @babel/core, it is likely that something in your build process is loading t...
What are you trying to add to GrapesJS? When a component is dropped, stay at the position of the mouse is clicked. Describe your feature request detailed I start playing with some basic blocks/components. If I drag and drop a component, e.g, a simple text input, it looks like they snap to the last active component by...
sprklinginfo
found out that is already implemented by using "dragMode: 'absolute'" . thanks.
ClaudeCode
Thanks for reporting this, @sprklinginfo. Great suggestion about FEAT: Drop a component at the position of the mouse is clicked! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Usi...
Hi, i want to have custom blocks made of grapesjs components. I found solution how to add components: https://github.com/artf/grapesjs/issues/1334#issuecomment-411519845 but i'm struggling with adding CSS (eaiher as string or as object).
artf
You should be able to do something like this:
makkaronis4e
@artf thanks it works, but i found bug there. When you drop this block on canvas it works ok, but if you delete this element from canvas or clear whole canvas, then drop this block on canvas 2nd time, it will lose css. 2nd time, 3rd time.....
artf
@makkaronis4e for such a case, I'd ask you a reproducible demo, please
I build the custom components at runtime based on a dropdown. When user changes the selection of that dropdown, related custom block will be added and non-related block will be removed. all custom blocks are group by different category name. if all blocks are removed from that category, it will show on the screen. Is...
artf
Try to re-render the block manager with a new collection of blocks
ClaudeCode
Thanks for reporting this, @zhiyuanzhang-unai. Great question about How to remove a category if no component in it. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for y...
Hi @artf, how can i add platforma collection of components and UI elements in this grapesJS any idea?
integerManual
hy @awais786327 you can try read docs on how to add blocks and components, when init grapesjs dont forget include css/javascript from platforma to the canvas
Hi, I am customizing GrapesJS by creating components/blocks my users can drag onto the canvas. A number of these blocks depend upon external libraries like Bootstrap and FontAwesome.. Is there a way to check to see if the necessary dependencies are included on a page, and if not, add them to the page? Here is what I a...
GoodPHP
Hi, If you didn't find answer here, you can contact with Devfuture Team: https://devfuture.pro/contact/ We specialise on GrapesJS.
artf
@stljeff1 the correct way is to use Component related scripts which check if the dependency exists
stljeff1
@artf Can I do that with CSS files? Nonetheless, I did manage to "solve" my problem by creating a custom type for the blocks with any kind of dependency (CSS or JS). This custom type extends the default view by adding a custom callback whe...