Can i load data from variables, not from the server, like var datajson = editor.store(); editor.load(datajson); I've learned (https://grapesjs.com/docs/modules/Storage.html#storage-api), but still did not understand examples if they included the new logic to load the data, Thank You
artf
You can use editor.setComponents and editor.setStyle
I have created a custom component & block which is used to display/embed uploaded files. I have defined traits for this component see below. When a new file is uploaded I need to update the options of the selected-src trait so that the user can use the select in the settings panel to select the file to be displayed. A...
pouyamiralayi
Hello! you must attach a listener for the file property, so whenever it changes to a new value(file), your listener will append it to the end of the options: NOTICE here i am listening to the changes on the selected-src itself, for your ca...
artf
Yeah the key part proposed by @pouyamiralayi is here This is how you update traits at run-time (more about this here)
If styleManager is left out of the configuration, the default includes text-align with icons showing the choices. If I include a styleManager configuration and add text-align, it uses words instead. Should this be the case since it's a "built in" property, or do I still need to manually add the icons?
ramusesan
hi @benvmatheson all you have to do is include fontawesome in your project and add the class Names reference for font awesome: https://www.w3schools.com/icons/fontawesomeiconsintro.asp i.e _if you want to put your own icons also its possib...
artf
@benvmatheson I preferred not to bind the font-awesome dependency (that I still hope to remove soon) to the property factory
WARNING READ and FOLLOW next 5 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdUse the GitHub Issues EXCLUSIVELY for BUGS, FEATURE REQUESTS or QUESTIONS. Prefix the title of the issue with its context, eg. [Bug]: ....Do a quick...
smik3
Yeah, after 3-4 re-writes I've managed to get to the approach there, haha. Would it be possible for that snippet to be added to the docs? It's taken a few days of searching through issues to see that it is even possible to pass an array of...
artf
https://grapesjs.com/docs/modules/Blocks.html
smik3
I am also getting really confused about this. For example, how do you decide where to put the html markup, in the block content property or in the component view property? Also in the basic-blocks plugin it defines rows/cells as classes in...
If I drop an image that's larger than the canvas, then double click the top left anchor, the width is adjusted to the size of the canvas. Is there a way to programmatically call the same funciton, or would this need to be manually done in a listener? Is it also possible to fit to height as well, instead of just width?
MatthewMariner
Ben how did you fix this?
benvmatheson
@MatthewMariner I just had it add a max-width the size of the canvas. Wasn't able to figure out a better solution.
Behavior I use an external Javascript code that replaces some SVG elements dynamically based on their attributes. The Javascript code first checks for the type of the element to validate, that it is an SVGElement like this: document.querySelector('#someId') instanceof SVGElement The code returns True in Firefox but Fa...
artf
The code returns True in Firefox but False in Safari and Chrome although I can verify in the Chrome Properties tab, that it is indeed of type SVGElement. Weird, seems like a Chromium issue...
I wanted to add min-height and max-width to the default properties. Is it possible to add these next to max-height instead of at the end of the sector? Or will I need to just manually define the entire sector in order to manage property order? Also, I was just curious why these weren't included in the defaults? Thanks...
benvmatheson
For future reference, looks like this is a default configuration if anyone needs to use it as a base: https://github.com/artf/grapesjs/blob/dev/index.html#L89
artf
Is it possible to add these next to max-height instead of at the end of the sector? Or will I need to just manually define the entire sector in order to manage property order? Unfortunately, currently, you have to define the entire sector....
Hi, I add STATE in style manager :before and :after but all the styles are applied to the component.
artf
Do you mean during the editing? Do you see it good if you deselect the component?
abozhinov
Yes during the editing. My idea was to implement the pseudo elements. When you select component to select state like hover, but to be :after or :before. The problem is that I need to set content: '' in the css rule and all the styles are a...
artf
Ok but is it correct once you deselect the component?
I have a custom component when dropped inside a Text component (I am using a custom text component that extends the original text component) after saving and reloading the HTML/CSS I am experiencing the same problem - the text component converts to a Box. I use a custom attribute, but no matter the attribute the type...
inaLar
Hi! This is very useful information - about accessing the model this way instead the DOM. I will explore it. I still don't understand why the gjs-comp-selected class is stored in the innerHTML precisely when I drop the custom component ins...
inaLar
@pouyamiralayi, yes, I have done exactly the same and it is working, but also I've managed to use tagName (div, p, ... ) in the isComponent of an extended text component and this also works in my case. I will close the question now. Thank...