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...
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.
Thanks for reporting this, @fahad157. Thanks for sharing your report about Single click text edit. To help the team investigate and prioritize this: Please provide: A minimal reproducible example (CodeSandbox/JSFiddle) Your GrapesJS versio...
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!
GJSBlock
Thanks for reporting this, @zachsnoek. Great question about Creating trait with Style Manager property UI. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your spe...
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.
GJSBlock
Thanks for reporting this, @KernelDeimos. The issue with Attempts to load scripts to canvas maybe breaks javascript?? appears to be a race condition or state management timing problem. This typically happens when component lifecycle events...
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?
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...
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
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...
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...
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?