Hi, i'm trying to make custom components composed with other components. No problem to do that. I'm facing an issue when i want to move the whole component. Here is my test component: it looks like this on the editor : my issue is when i want to move the component, i can move it when i click on the blank space after t...
Lerdouille
Thank you ;)
artf
No, it's all as defined. You're trying to drag a non-draggable component so, the behavior is correct
Lerdouille
Hi, thank you for the answer. Well, i know my "link" component is not draggable, i set it that way (to specially not drag the link outside the whole component) But it's also set as non selectable, so if i click on it, and i want to drag th...
I want to avoid some of the tags not to detect as components like 'B', 'I' etc tag. The problem is I have a component like this <p data-gjs-type="text">Insert Text Here</p> When I add Bold style to some textnode like this <p data-gjs-type="text">Insert Text <b>Here</b></p> due to its component behaviour B tag also det...
RJCAM
Hi @krishnaeverestengineering why you don't just simply use the rich text editor to make the text bold?
krishnaeverestengineering
Yes we can use it . But the problem is after saving and loading the content again makes that B tag as separate text component. That I want to avoid as another component
krishnaeverestengineering
<img width="809" alt="Screenshot 2020-09-11 at 9 10 41 AM" src="https://user-images.githubusercontent.com/55732888/92854461-ba449e00-f40e-11ea-9ca7-4e4a5dc26402.png"> See this, now bold text is now another text component
Version: 0.16.22 Are you able to reproduce the bug from the demo? [ ] Yes [ X] No - requires editing js. What is the expected behavior? wrapper component should not be droppable once droppable attribute is set to false. What is the current behavior? Nothing happens when this attribute is set. Describe the bug detailed...
RJCAM
Hi @BillTheGoat try this after init:
RJCAM
I think it's because the wrapper doesn't make part of DomComponents. DomComponents are only the components inside of the wrapper. :smile:
BillTheGoat
Hmmm. I tried this because the API docs list the DomComponents.getWrapper() as its first function, and it does apply attributes as seen in my sandbox above. It was doubly odd to me because it seems like the editor.getWrapper() function is...
Hi, Thanks for this good editor. In my project, I want to adjust classes of components using the style manager. For example, I am using bootstrap and I want the user to be able to apply classes such as bg-danger, bg-primary from a drop box instead of input the class name manually. I am aware that I can do it using tra...
artf
There is an option which allows you to indicate which target to select (classes or component-specific style) https://github.com/artf/grapesjs/pull/2474 (in your case componentFirst should be disabled) Unfortunately, the selector manager's...
Version 16.10 Are you able to reproduce the bug from the demo? [X] Yes [ ] No What is the expected behavior? That GrapesJS can support dragging & sorting interaction with custom Web Components which do not have the Shadow DOM enabled. Describe the bug Hello, we use GrapesJS extensively and integrate many of our custom...
artf
This bug/request isn't just for StencilJS, but just in general with Web Components and the Shadow DOM. Are there best practices with Grapes and Web Components with enabling or tracking events to mediate these issues? I'm not working with W...
jenter
@artf sure thing, thanks for the quick response. I have imported my custom web component library here in this Fiddle to demonstrate the issue: https://jsfiddle.net/jenter77/5btn2ao7/25/ If you reference my public repo and example "faux-gri...
artf
Hi Jason, I've tried to give a look at what is happening inside the editor and, I'm not sure how the shadow option actually affects this behavior but, the main issue I see is that dynamic <div class="delayed--wrapper"> element. Basically t...
I have the nice ckeditor 4 editor built into grapesjs with this components: grapesjs: 0.15.8 grapesjs-preset-newsletter: 0.2.20 ckeditor.js: 4 grapesjs-plugin-ckeditor - 0.0.9 My project generates newsletters (HTML + CSS) to be storage in database. This newsletter it can be edited and save it again as many times as yo...
Abhisheknanda1344463
Hi @svalenciano81 Did you try this? var cmdGetCode = cmdm.get('gjs-get-inlined-html');
svalenciano81
Hi @Abhisheknanda1344463 I need the reverse process. I have the code inline and I need to separate it into components and styles separate.
artf
To load back your templates you shouldn't use the HTML/CSS, you have to store and load the JSON https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates
Hi @artf I am trying to add new types of trait Below is my code.It's updating the values in code also but on reload link trait will set to default. Here is my code editor.DomComponents.addType('link', { model: dModel.extend({ defaults: Object.assign({}, dModel.prototype.defaults, { removable: false, traits: [ // strin...
Version: "0.16.18" Are you able to reproduce the bug from the demo? [ X] Yes [ ] No Steps to reproduce the bug in web builder demo: Open the demo and the console, enter editor.Canvas.addFrame({ name: 'Mobile home page', x: 100, // Position in canvas y: 100, width: 500, // Frame dimensions height: 600, // device: 'DEVI...
artf
Thanks @FlowingCloudRTL for the report but the multi-frame feature is still far from being complete so I'm not surprised about the issues. If anyone is interested in bringing this feature further, please let me know
Version: 0.16.18 Are you able to reproduce the bug from the demo? [X ] Yes [ ] No What is the expected behavior? I would expect that assets, components, css, html, and styles would be repopulated. Describe the bug detailed I am working on an existing system that has a database schema preventing me from using the Stora...
mitcht
Yes, I see that .load takes a callback function. I'll admit, I'm probably doing this wrong. I only started using grapesJS a few days ago. If my bug report is not truly a bug, how would one store the current state of the editor (possibly as...
mitcht
I'm investigating https://grapesjs.com/docs/modules/Storage.html#storage-api but I still would like to just be able to 'set and forget' :)
artf
There is an example which illustrates exactly what you're looking for https://grapesjs.com/docs/modules/Storage.html#define-new-storage