1 files changed, 39 insertions, 0 deletions

diff --git a/subprojects/frontend/src/editor/decorationSetExtension.ts b/subprojects/frontend/src/editor/decorationSetExtension.ts
new file mode 100644
index 00000000..2d630c20
--- /dev/null
+++ b/subprojects/frontend/src/editor/decorationSetExtension.ts
@@ -0,0 +1,39 @@
+import { StateEffect, StateField, TransactionSpec } from '@codemirror/state';
+import { EditorView, Decoration, DecorationSet } from '@codemirror/view';
+
+export type TransactionSpecFactory = (decorations: DecorationSet) => TransactionSpec;
+
+export function decorationSetExtension(): [TransactionSpecFactory, StateField<DecorationSet>] {
+  const setEffect = StateEffect.define<DecorationSet>();
+  const field = StateField.define<DecorationSet>({
+    create() {
+      return Decoration.none;
+    },
+    update(currentDecorations, transaction) {
+      let newDecorations: DecorationSet | null = null;
+      transaction.effects.forEach((effect) => {
+        if (effect.is(setEffect)) {
+          newDecorations = effect.value;
+        }
+      });
+      if (newDecorations === null) {
+        if (transaction.docChanged) {
+          return currentDecorations.map(transaction.changes);
+        }
+        return currentDecorations;
+      }
+      return newDecorations;
+    },
+    provide: (f) => EditorView.decorations.from(f),
+  });
+
+  function transactionSpecFactory(decorations: DecorationSet) {
+    return {
+      effects: [
+        setEffect.of(decorations),
+      ],
+    };
+  }
+
+  return [transactionSpecFactory, field];
+}