GrapesJS Issues

3,464 parsed GitHub issues 370 solved · 90 open. Search, filter and explore battle-tested answers.

183 issues found

🔍 documentation
#3331Mar 10, 2021by Abhisheknanda13444634 answers
2 reactions

Custom Asset Manager

Hi @artf I followed the documentation to make new type of asset manager here ( https://codepen.io/abhi_punk81/pen/MWbWzaq) I've created new type like the same one in the docs How can i open that asset manager after dropping my custom block of icon -: At first it'll work fine but when i drop the image block after that...

Abhisheknanda1344463

@artf Achieved it and handle case-insensitive also https://user-images.githubusercontent.com/20657737/112457190-82d18980-8d81-11eb-895b-b5c42e849f3a.mov Thank you!! ❤️

Abhisheknanda1344463

Hi @artf somehow I've managed to do it On component active I called this -: It'll open my asset manager and I've added assets for this custom manager as well as you can see in the screenshot <img width="1105" alt="Screenshot 2021-03-20 at...

artf

Should be similar to what you've already done here editor.AssetManager.render(editor.AssetManager.getAll().filter(asset => asset.get('type') == 'svg-icon')); So find assets by search and update it with render

#3330Mar 10, 2021by RaresVlaiduc1 answer
0 reactions

What event is fired on component start move

Hi again! Current situation:I start editingIn the layer manager I maximized the width of the move container ( the arrows icon ) so I can drag the element by clicking anywhereI am moving fast in the editor and I accidentally move the layer instead of selecting it What I want:I want to prevent the start of the moving ev...

GJSBlock

Thanks for reporting this, @RaresVlaiduc. Great question about what event is fired on component start move. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your spec...

#3316Mar 5, 2021by am1rb4 answers
1 reactions

The editor does not remove the dead script blocks

Version: 0.16.34 Are you able to reproduce the bug from the demo? [ ] Yes [x ] No As I understand the code import dialog skips all the HTML scripts, so I can not reproduce the issue on the demo What is the expected behavior? The editor must remove dead script blocks before appending a new script block at the end of th...

Ju99ernaut

I'm unable to reproduce this, maybe you can provide more information on the custom component itself, anyway I suspect this is a storage related issue. Are you storing then loading pages from the generated html?

Andrew-Chen-Wang

Typically inline scripts go in the body at the bottom. Try putting it there maybe?

am1rb

I do not append anything by myself. The editor appends the scripts related to my components in a new script tag at the end of the generated HTML. Please take a look at this file: https://github.com/artf/grapesjs/blob/dev/src/editor/model/E...

#3313Mar 5, 2021by fahad1574 answers
2 reactions

There are lots of click required to make text editable, can we make text field editable on a single Click.

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...

Andrew-Chen-Wang

Single click can get annoying when dragging around blocks. If you've already selected a block, you still need to do a double click. If you didn't select a block, then you can just double click the block to edit the text. I think that's pre...

fahad157

@Andrew-Chen-Wang Yes that's right but in my scenario i want edit on just single click, if it is possible then plz guide.

mihir-khandekar

@fahad157 were you able to fix this?

#3303Mar 2, 2021by RutujaBadbe4 answers
1 reactions

Category order not displaying properly

Hi! I want to display the categories in block manager in certain sequence. I looked into docs and previous issues and found about order attribute. So, I tried setting order attribute. but it is not yet displaying in that order even though order attribute is getting set. Am I missing something? or doing something wrong...

Ju99ernaut

I guess you can make this a feature request, I'm not sure if something like this exists yet in grapesjs. Though the order of the blocks might be easier to manage if you split each category's blocks into different files then load those file...

Ju99ernaut

I think the order in which blocks are added is what determines category order.

RutujaBadbe

@Ju99ernaut hi! Thanks for the reply. yes. At the end I did that. but what if I want to do it dynamically? if there are many blocks, isn't it hard to maintain the order?

#3294Feb 27, 2021by server1024 answers
0 reactions

Adding options to properties list array in style manager

Hi, How can I add buildProps to properties list such that when an option is selected, the properties of that option will be displayed An example of what I am trying to achieve on the flex property.

Ju99ernaut

I believe you can move the build props out of the properties list and still achieve what you're trying, the built in flex box related properties only show when a component has display: flex. It's also important to note that buildProps are...

server102

Thank you. I tried it but the grid properties are not working. Might have to implement it manually but am not sure on how best to approach the problem.

Ju99ernaut

There's no buildProps for grid properties so you'll have to build those from scratch, unfortunately docs don't have much info on custom properties probably you'll have to piece things together from the API reference https://grapesjs.com/do...

#3289Feb 23, 2021by bgrand-ch4 answers
2 reactions

Components have lost their styles

Version: 0.16.41 Are you able to reproduce the bug from the demo? [X] Yes [ ] No What is the expected behavior? 1) Copy selected parent component (container) to the clipboard. 2) Paste selected parent component (container) from the clipboard (into the same page or an other page). 3) All components keep ID styles and i...

artf

That because you've updated original commands with your versions (incorrectly). Indeed, if I remove your plugin from the demo everything works as expected. Please check the original copy and paste command, you should clone components befor...

artf

Just check the original commands https://github.com/artf/grapesjs/blob/dev/src/commands/view/CopyComponent.js https://github.com/artf/grapesjs/blob/dev/src/commands/view/PasteComponent.js

bgrand-ch

@artf Thanks for your answer. A link or an example or more explanations please? 😅

#3287Feb 23, 2021by RaresVlaiduc4 answers
1 reactions

Wrapper styling

First of all, congrats @artf for this amazing project 💯 I am currently working on a project and I wanted to ask if I can edit the wrapper (body) like I edit other components inside it. For example I would like to edit the padding of the wrapper as I do with the background-color. I've had a look over the configs but c...

artf

Yes @kuhelbeher, now the wrapper is created post plugins, so you can entirely extend it as any other component

artf

LE: I have found a way. I am overwritting the stylable array from getWrapper() but I'm not 100% sure this is the correct way. Can you confirm this? Yeah sure it's ok, but if you need, you can change the wrapper properties on init via mainC...

kuhelbeher

you can change the wrapper properties on init via mainConfig.domComponents.wrapper optionhttps://github.com/artf/grapesjs/blob/18b2f95b7f844578dc2b28d786b126013d155d9e/src/dom_components/config/config.js#L9 Hello, I've noticed that this op...

#3280Feb 19, 2021by bgrand-ch1 answer
0 reactions

Renderless

What are you trying to add to GrapesJS? I try to styling GrapesJS and positioning its elements (panels, buttons, canvas, etc.), it's annoying to override all style elements. Describe your feature request A renderless GrapesJS.Append a specific GrapesJS element (panels, buttons, canvas, etc.) into any container in the...

GJSBlock

Thanks for reporting this, @bgrand-ch. Great suggestion about FEAT: Renderless! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using the event system: Alternative approaches: List...

#3278Feb 18, 2021by Dmurl51 answer
0 reactions

Custom component view onRender is called early

Version: Reproduced in codepen below using 0.16.34 (returned from https://unpkg.com/grapesjs) and 0.16.22 in a Preact project Describe the bug detailed A custom GrapesJS component calls its view's "onRender" function when the component is rendered to the canvas. Per the documentation: I would expect this to be called...

GJSBlock

Thanks for reporting this, @Dmurl5. The issue with Custom component view onRender is called early appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modificatio...

Browse all topics