Void component that doesn't propagate events
See original GitHub issueI am trying to create a custom Widget
block component which renders an inline form allowing users to configure the Widget
they selected. It uses the Void
component that you provide to allow for it’s rendering within the Editor
.
I have it rendering within the Editor
at the moment, however I am having loads of issues with the editor responding to events based within my Widget
block component. I’ve tried to put event listeners in my component and fire the e.stopPropagation()
in hope that the events won’t reach the editor - but I am not having much luck.
Do you think there would be a way to isolate a Void
component so that the Editor
doesn’t respond to events from within it? Typically you are only after the clicked/selected event for Void
components right?
Issue Analytics
- State:
- Created 7 years ago
- Comments:6 (5 by maintainers)
Okay, thanks for that test case it was great!
I investigated, and realized that we should probably be not responding to events in the editor by default if they come from inside
contenteditable="false"
elements, whether they are in voids or not. So I’ve released0.8.2
which has that.I also added an
embeds
example which shows an editable Youtube embed, so that we can make sure it keeps working in the future!Let me know if you still run into issues with this. Thanks for the report!
It looks like this example stopped working: https://www.slatejs.org/#/embeds
I’m trying to embed a monaco editor for editing code blocks. I’ve recently migrated from draft.js and my solution with draft was to set the editor to read-only when the code block is focused. It looks like slate had this working without that hack but there may have been a regression recently…