setPluginEditorPlugin(undefined)}>
- {createElement(pluginEditorPlugin.editor!, {
- node:
+ )}
+ {/* Toggle the editor's display instead of unmounting to retain its undo/redo history */}
+
+
+ onChange(e.target.value)}
+ value={value}
+ />
+
+ {textareaRef && pluginEditorPlugin && (
+
+ setPluginEditorPlugin(undefined)}>
+ {createElement(pluginEditorPlugin.editor!, {
+ node:
+ selectedNode &&
+ selectedNode.type === pluginEditorPlugin.name
+ ? selectedNode
+ : null,
+ onCancel: () => setPluginEditorPlugin(undefined),
+ onSave: markdown => {
+ if (
selectedNode &&
selectedNode.type === pluginEditorPlugin.name
- ? selectedNode
- : null,
- onCancel: () => setPluginEditorPlugin(undefined),
- onSave: markdown => {
- if (
- selectedNode &&
- selectedNode.type === pluginEditorPlugin.name
- ) {
- textareaRef.setSelectionRange(
- selectedNode.position.start.offset,
- selectedNode.position.end.offset
- );
- }
- insertText(textareaRef, {
- text: markdown,
- selectionStart: undefined,
- selectionEnd: undefined,
- });
- setPluginEditorPlugin(undefined);
- },
- })}
-
-
- )}
- >
- )}
+ ) {
+ textareaRef.setSelectionRange(
+ selectedNode.position.start.offset,
+ selectedNode.position.end.offset
+ );
+ }
+ insertText(textareaRef, {
+ text: markdown,
+ selectionStart: undefined,
+ selectionEnd: undefined,
+ });
+ setPluginEditorPlugin(undefined);
+ },
+ })}
+
+
+ )}
+
);