GrapesJS Issues

Search parsed GitHub issues, see highlighted answers, and open the original discussion when needed.

3464 issues found

#3337March 12, 2021by wfcheng3 answers
0 reactions

Question: Use arrow keys to move blocks in canvas configured in absolute positioning mode

Hi, I am building a solution for students to tell their high school experiences as slides built from grapejs editor (similar to canva), and have configured the editor in 'absolute' mode, which works wonderfully. However I can't seem to find a way to move the dropped block in the editor with the arrow keys. I am aware...

artf

No, unfortunately, for such a case, the custom keymap would be the only solution. You should just get the selected component and update its style.

michaelhofer

I have found a working solution for this as follows: The commands are being added as follows: The moveSelectedElements method just does the following: However, when moving the elements with arrow keys, the canvas scrolls as well, which is...

sathudeva7

keymaps.add('ns:my-keymap', '⌘+s, ctrl+s', 'some-gjs-command', { // Prevent the default browser action prevent: true, });

#3336March 12, 2021by fahad1571 answer
0 reactions

Single click text edit

There are lots of click required to make text editable, can we make text field editable on a single Click. I know, Single click can get annoying when dragging around blocks and that's pretty standard already, but in my scenario, i want edit on just single click, if it is possible then plz guide.

artf

https://github.com/artf/grapesjs/issues/3146#issuecomment-733687439

#3335March 11, 2021by zachsnoek2 answers
0 reactions

Creating trait with Style Manager property UI

I have a component using the background-url Style Manager property: I would like to reuse this UI that is shown in the Style Manager for a background URL trait that shows up under "Settings": Is it possible to make a Style Manager property behave like a trait and show up in the "Settings" section, or would I have to c...

artf

Unfortunately, it's not yet possible, but there is a plan to add soon a new UI module that should allow the reuse of UI elements

zachsnoek

:+1: Thank you!

#3334March 11, 2021by KernelDeimos1 answer
0 reactions

BUG: Attempts to load scripts to canvas maybe breaks javascript??

Version: 0.16.44 Are you able to reproduce the bug from the demo? [ ] Yes [x] No What is the expected behavior? Legit anything else Describe the bug detailed I was attempting to load scripts into the canvas. My first attempt was scripts: [] and then I ran into the synchronization issue mentioned in this PR's thread: h...

KernelDeimos

I haven't used inline <script> tags in a while and forgot about this caveat of the HTML parser. Closing this.

#3333March 11, 2021by xinnai3 answers
1 reactions

npm start not working

Hi, I want to develop the source code but I cannot get started. I got errors when start the project. Can anybody help me? Thank you very much!!!

xinnai

@Andrew-Chen-Wang I think that must be something with my develop environment so I use another computer to install and move it to my computer , still don't know why but now it works fine. Hope no errors happen again, and thank you so much!!!

Andrew-Chen-Wang

For source code development, check out: https://github.com/artf/grapesjs#development

xinnai

@Andrew-Chen-Wang Yeah, I did that, but always get this error, what can I do?

#3332March 11, 2021by AmtechInnovarch3 answers
1 reactions

Nearly half the packages specified have high risk vulnerabilities, all have some vulnerability.

After npm i we can see that the level of vulnerabilities is unacceptable. added 646 packages from 383 contributors and audited 762 packages in 7.892s found 724 vulnerabilities (353 low, 23 moderate, 348 high) run npm audit fix to fix them, or npm audit for details I'm trying to fix the problem, at least locally. It wi...

AmtechInnovarch

This is why veteran coders with decades of experience disapprove of JS as a back-end language. Javascript is not intended to be a server side language, and these node packages create vulnerabilities that get servers hacked. This is a serio...

KernelDeimos

GrapesJS has a server-side layer?

KernelDeimos

Javascript is not intended to be a server side language, and these node packages create vulnerabilities that get servers hacked. Are you implying that Javascript is the only language where dependancies can introduce security vulnerabilitie...

#3331March 10, 2021by Abhisheknanda13444633 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

#3330March 10, 2021by RaresVlaiducNo answers
0 reactions

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

#3329March 10, 2021by imouou3 answers
0 reactions

QUESTION: How should I receive custom trait modifications in the script?

Hi, @artf, this is a great framework, thank you very much. I am now using it to create components of the mobile BUI framework, and I ran into a problem, I added a custom trait textarea, how can I make this When the data changes, it is triggered in the output script.

Ju99ernaut

You'll need to add the trait to script-props, you can read more here https://grapesjs.com/docs/modules/Components-js.html#passing-properties-to-scripts

imouou

Thanks @Ju99ernaut, If it is some built-in features, when modifying the script can receive the value of the parameter, I am currently experiencing problems: custom feature textarea, can trigger changes such as dom, but the exported script...

Ju99ernaut

You can try forcing the script to update:

#3328March 9, 2021by D-Rosa993 answers
2 reactions

How can I update the nodeValue (text value) of components by inputs forms

Hello. Grapesjs is a great tool. Thanks for it. I want to update the text value of a component by inputs, how can I do that?? if a user filled the input box with something like: TEA SITE, the title should change to it

artf

Just find the component and update it as you wish

millord

I'm also want something similar with my grapes app, but using react to update a text component via a control input. Somebody can help with that?

D-Rosa99

it works, thanks