Hi All, I'm getting an issue, when saving a custom HTML component (just a table), grapes JS will modify it. before save after save. Is it possible to wrap something around it so it does not get modified? The reason for the problem is that I'm using twig (a templating language) to dynamically create the table, and afte...
adamwpe
Replace with #3139
GJSBlock
Thanks for reporting this, @adamwpe. Great question about Prevent <TABLE>from being modified during saving.. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your spe...
Not getting styles of the selected element Here is my code, const model = editor.StyleManager.getModelToStyle(component); let styleObject = model.getStyle(); console.log("styles", styleObject) Version: 0.14.49 Are you able to reproduce the bug from the demo? [X] Yes [ ] No What is the expected behavior? When an elemen...
artf
First of all, you need to upgrade your grapesjs version (you're using a 2 years old one), then you have to provide a live demo of the issue.
no-response[bot]
This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take ac...
GJSBlock
Thanks for reporting this, @Asha1597. The issue with When I select an particular element I'm not getting its styles. This issue happens only with some elements. appears to be a race condition or state management timing problem. This typica...
{ "type": "text", "status": "hovered", "content": "Insert your text here", "attributes": { "id": "ixx2" }, "activeOnRender": 0, "open": false } In JSON I want add new key with object. Example data key this will have custom Traits. I want to add new object from where data can be fetch and populate the output. Can I do...
longdoan7421
Sorry I misunderstood your problem, so my previous comment was not relevant. To achieve your desire, you need create your own trait type (docs) and component type (docs). There is an easier way but it can not save all your custom data as a...
longdoan7421
I'm not sure if I get your problem. But if you set any custom attributes to component model (except some preserve keys like components, styles, ...) e.g: component.set('customTraits', yourCustomTraits);. It would be in JSON data.
vijaycreatise
I tried like this, but it is not working. I want to add data key and object in JSON, when user select form they can enter API url. Can you please check am I doing correctly?
For example, I want to add a double click event handler on the default video component to open the assets manager. My basic idea was to get the view definition of the video component and add events + handler. At last, set it back to the video component. Unfortunately, this idea failed in the first step. v.View() gives...
Joshmamroud
@archerbj here's a demo of what you're looking for: https://codesandbox.io/s/sharp-easley-3hrdn?file=/index.js You want to attach the functionality to the component type itself rather than trying to find all instances of that component and...
archerbj
@archerbj here's a demo of what you're looking for: https://codesandbox.io/s/sharp-easley-3hrdn?file=/index.jsYou want to attach the functionality to the component type itself rather than trying to find all instances of that component and...
abulka
@Joshmamroud Thanks for that running example. Yours is the only example I can find of using the extend feature mentioned in the documentation. Your example is very simple and zen - however it merely shows adding a dblclick handler to the v...
Version: 0.16.27 Are you able to reproduce the bug from the demo? [ X] Yes [ ] No What is the expected behavior? When a try to drag a component the canvas should not scroll to the top of the page. Describe the bug detailed Whenever I try to drag a component that is in the last sections of the page, the canvas scroll t...
Hi @artf , You can check it out here https://recordit.co/vn1ZVN6J1N, is not with the sections, it happens with any element but only the first time I try to drag something.
artf
Ah ok, only the first time, I've got it now on my side too π
Please could anyone guide me on how to run the basic example given in the GrapesJS website using React.. PLEASE HELP
GJSBlock
Thanks for reporting this, @BaskarMN. Great question about Getting started example in React application. The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific...
Version: 0.16.27 Are you able to reproduce the bug from the demo? [] Yes [X] No What is the expected behavior? Paste as plain text (text node) without Grapes JS wrapping pasted text in <font /> element. What is the current behavior? When I paste text as plain text into an empty Text element, the editor wraps it in a <...
Joshmamroud
@artf do you know if this is this happening in the component or the RTE or somewhere else? Could you please point me in the right direction? Any help on this would be greatly appreciated. Thanks!
artf
I can't reproduce it, but I see you're using a custom dm-text component, so that might be a reason?!
Joshmamroud
@artf I don't believe so. Here is the configuration of the dm-text component type Do you see anything here that might be causing it?
Version: 0.15.10 This question is intended to validate if there is a proper way to extend the current https://github.com/artf/grapesjs/blob/master/src/canvas/view/CanvasView.js with a custom plugin. We were specifically reviewing the render() method within this file, to slightly alter the HTML to combine the toolbar a...
artf
Hi @jenter, good question. Unfortunately, I've never focused that much on the possibility of canvas extension or its UI elements, so for sure there is no right way to do that. If anyone is willing to propose solutions I'll be glad to evalu...
jenter
@artf I will review some proposals / thoughts and add it to this thread.
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.
GJSBlock
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...
Version: 0.16.27 Are you able to reproduce the bug from the demo? [x] Yes [ ] No What is the expected behavior? When adding background-image via Style Manager it show as background-image: url(...);. What is the current behavior? Instead of background-image:url(https://grapesjs.com/docs/logo.png); you will get backgrou...
johnkeel-thork
Was about to report the same problem. Added Image as background: <img width="847" alt="Screenshot 2021-12-23 at 12 06 51" src="https://user-images.githubusercontent.com/26764290/147238562-8df3ea2a-aca7-4b08-9d64-73fd1495d699.png"> Its bein...
artf
Closing as from the same jsfiddle the issue seems to be solved
GJSBlock
Thanks for reporting this, @fq-selbach. The issue with linear-gradient CSS does weird things to background-image appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and...