I am building a rich-media code editor where users can insert images, video, diagrams, and more into their code. I am trying to use CM6 to achieve this, via a
StateEffects. To insert an image for exmaple, I create a transaction with the appropriate StateEffect to create the image. This transaction also inserts a character at the location to insert the image. Then, I construct a replacement widget and replace the character I just inserted. This is done so that the cursor can correctly move around the image.
The problem I am having is integrating this with CM6’s undo history. I have tried using the
invertedEffects facet to generate the appropriate inverse effect to add/remove the widget. This works somewhat, but when the widget is deleted the user must press undo twice to recover the widget. Once to undo the deleted character and once again to undo the deleted widget.
I have tested both when I insert a character to replace and when I replace an existing character in the document and the undo behaviour is the same, requiring two undos to bring back the deleted widget.
How can I remove the need to press undo twice? Is this even the right way to go about inserting widgets into the document?