sonorance 0.1.0-beta.4.1

package/src/ui/active-line.mjs

@@ -0,0 +1,42 @@
+// Active-line highlight for the Tiptap surface, as a ProseMirror plugin.
+//
+// Entering edit mode should NOT draw a frame around the whole record. Instead we
+// mark just the block holding the caret with a warm amber wash — a single "you
+// are here" line, like the old live-preview `.blk.active`, but native to
+// ProseMirror. Only shown while the editor is focused and editable, and cleared
+// the moment focus leaves so nothing lingers.
+import { Plugin, PluginKey } from '@tiptap/pm/state';
+import { Decoration, DecorationSet } from '@tiptap/pm/view';
+
+export const activeLineKey = new PluginKey('sonorance-activeline');
+
+function build(state, focused) {
+  if (!focused) return DecorationSet.empty;
+  const { $head } = state.selection;
+  if (!$head || $head.depth < 1) return DecorationSet.empty;   // caret directly in doc → no textblock
+  // The nearest enclosing block of the caret (paragraph/heading/list-item body/…).
+  const from = $head.before($head.depth);
+  const to = $head.after($head.depth);
+  return DecorationSet.create(state.doc, [Decoration.node(from, to, { class: 'pm-activeline' })]);
+}
+
+export function activeLinePlugin() {
+  return new Plugin({
+    key: activeLineKey,
+    state: {
+      init: () => ({ focused: false, decos: DecorationSet.empty }),
+      apply(tr, value, _old, newState) {
+        const meta = tr.getMeta(activeLineKey);
+        const focused = meta && typeof meta.focused === 'boolean' ? meta.focused : value.focused;
+        return { focused, decos: build(newState, focused) };
+      },
+    },
+    props: {
+      decorations(state) { return activeLineKey.getState(state)?.decos; },
+      handleDOMEvents: {
+        focus(view) { view.dispatch(view.state.tr.setMeta(activeLineKey, { focused: true })); return false; },
+        blur(view) { view.dispatch(view.state.tr.setMeta(activeLineKey, { focused: false })); return false; },
+      },
+    },
+  });
+}