So I want to add a language selector dropdown for my code blocks that is only visible when the user is within a code block (active).
I’m struggling on the best way to achieve this.
Active/not-active:
I’ve got a less than ideal way of detecting if the code block is active or when it goes to inactive (using dispatchTransaction
and then my “buttons” having a '.active()` method on them). Seems a bit hacky but it works and I think will be stable.
Custom Node UI: My real issue is setting up this UI. I could use a widget decoration to provide the UI OR I could wrap the codemirror DOM inside the UI and use a decorator to toggle a class to show/hide the UI.
In either case I’m having trouble coming up with a good way to achieve the update to the node.attrs
. First I need access to the current node and second I’ll need it’s position so that I can do the replace. (Is there another way?)
Definitely seems like updating nodes is a common struggle and node.updateAttrs
and node.updateContent
and the like would be very useful if possible.
Any guidance here would be very much appreciated!