[Question] Propagate different value

Question

Hi:

I'm trying to prevent children elements from being selected so only the top parent can be selected (so as to prevent removing children and only being able to work with whole blocks). I created a component that defines the parent with a selectable false and propagate: ['selectable']. This works ok but, of course, the parent can't be selected.

Any way I can add selectable: true to the parent and propagate a false value?

And, in a similar vein, is it possible to override propagation down the line? In the same experiment, I tried setting 'selectable: true' in a child component with no effect.

Thanks!

artf · Accepted Answer

Any way I can add selectable: true to the parent and propagate a false value?

I'd say that the only way is to create a wrapper in the middle:

<parent> <-- selectable
	<div data-gjs-selectable="false" propagate..> <-- not selectable
		<child>
		...

And, in a similar vein, is it possible to override propagation down the line?

No, you can't stop the propagation only via props

If you need, you all the stuff, about the propagation, happens here: https://github.com/artf/grapesjs/blob/dev/src/dom_components/model/Component.js#L125-L135

imanubhardwaj · Answer

I'm also facing this issue, where I have created a custom components with image wrapped inside a tag, when I click on the component, image tag click is triggered rather than tag click. Is there any solution to this?

Propagate different value

Question

Answers (2)

Related Questions and Answers

When I select an particular element I'm not getting its styles. This issue happens only with some elements.

Custom trait input not working

MultiSelect some elements and change styles only work on the last selected element

Text element not able to be selected twice after extended with events

Paid Plugins That Match This Issue

Browse Plugin Categories