@glw907/cairn-cms 0.58.0 → 0.60.0

package/dist/components/MarkdownEditor.svelte

@@ -58,6 +58,17 @@ through the adapter's render. Swapping the editor stays a one-file change.
     registerImagePlaceholders?: (api: import('./editor-placeholder.js').ImagePlaceholderApi) => void;
     /** Receives a `() => string` returning the selected text; the web link dialog reads it. */
     registerGetSelection?: (get: () => string) => void;
+    /** Receives a `() => { from, to } | null` returning the selection's document offsets, or null when
+     *  the selection is empty (a bare caret). The tidy host reads it so a selection tidy maps onto the
+     *  exact selected span, never an identical-looking passage earlier in the document. */
+    registerGetSelectionRange?: (get: () => { from: number; to: number } | null) => void;
+    /** Receives the tidy apply api (spec 2.5): the review surface drives the in-buffer decorations and
+     *  the accept/reject state machine through it. The author's original stays in the buffer until an
+     *  accept writes; a reject or reject-all leaves it byte-identical. */
+    registerTidy?: (api: import('./editor-tidy.js').TidyApi) => void;
+    /** Receives a `() => void` that undoes the last editor transaction; the "Undo tidy" chip calls it
+     *  to take the whole applied tidy back in one move (the apply lands as one history entry). */
+    registerUndo?: (undo: () => void) => void;
     /** Receives a `(kind) => void` that transforms the current selection; the host's toolbar calls it. */
     registerFormat?: (format: (kind: FormatKind) => void) => void;
     /** Reports the directive container at the caret (or null when outside any container) whenever
@@ -84,6 +95,36 @@ through the adapter's render. Swapping the editor stays a one-file change.
     /** The surface posture. Prose is the writing instrument (72ch measure, larger type, looser
      *  leading); markup is the working surface (fills the card, denser). Prose by default. */
     surface?: 'prose' | 'markup';
+    /** Spellcheck and the objective-error layer: the markdown-aware lint underlines. On by default;
+     *  when off the lint compartment reconfigures to empty (the underlines vanish, the Worker stays
+     *  idle). The footer toggle drives this. */
+    spellcheck?: boolean;
+    /** The dialect-resolved dictionary filename, e.g. "dictionary-en-us.txt", from EditData. The
+     *  source resolves it to a real asset URL and hands it to the spellcheck Worker's init. Defaults to
+     *  US English. */
+    spellcheckDictionary?: string;
+    /** The committed personal-dictionary words (spec 1.6), from EditData.siteDictionary. The lint
+     *  source seeds the spellcheck Worker's personal layer with these at init, so a word another editor
+     *  committed answers correct from the first lint. Empty by default (dialect-only). */
+    siteDictionary?: ReadonlyArray<string>;
+    /** The caller-owned pending personal-dictionary additions. When an author chooses "Add to
+     *  dictionary" the lint source adds the lowercased word here (the underline clears at once); the
+     *  host (EditPage) commits this set through the addDictionaryWord action at save time and reconciles
+     *  it against the merged response. A fresh set by default. */
+    pendingAdditions?: Set<string>;
+    /** Test-only seam for the spellcheck Worker. The real wasm and dictionary assets are resolved with
+     *  `import.meta.url` and do not load under the vitest browser dev server, so the component test
+     *  injects a deterministic fake Worker factory and asks the lint source to skip the `ready` wait.
+     *  When this is absent the production path is untouched: the real `new Worker(...)` and the real
+     *  asset resolution. Never set this outside a test. */
+    spellcheckTest?: {
+      createWorker?: () => import('./spellcheck.js').SpellWorker;
+      assumeReady?: boolean;
+    };
+    /** Tidy mode: while a tidy review is open the surface is read-only the way Preview disables the
+     *  toolbar, so the author cannot edit underneath a pending review. The host sets this when it opens
+     *  the review and clears it on apply or cancel. Off by default. */
+    tidyMode?: boolean;
   }
 
   let {
@@ -98,6 +139,9 @@ through the adapter's render. Swapping the editor stays a one-file change.
     registerFocusEditor,
     registerImagePlaceholders,
     registerGetSelection,
+    registerGetSelectionRange,
+    registerTidy,
+    registerUndo,
     registerFormat,
     onComponentAtCaret,
     onMediaImageAtCaret,
@@ -107,6 +151,12 @@ through the adapter's render. Swapping the editor stays a one-file change.
     focusMode = false,
     typewriter = false,
     surface = 'prose',
+    spellcheck = true,
+    spellcheckDictionary = 'dictionary-en-us.txt',
+    siteDictionary = [],
+    pendingAdditions = new Set<string>(),
+    spellcheckTest,
+    tidyMode = false,
   }: Props = $props();
 
   let host = $state<HTMLDivElement | null>(null);
@@ -127,6 +177,21 @@ through the adapter's render. Swapping the editor stays a one-file change.
   // module loads with the other dynamic editor modules in onMount.
   let mediaCompartment: import('@codemirror/state').Compartment | null = null;
   let mediaMod: typeof import('./editor-media.js') | null = null;
+  // The spellcheck lint source (and the objective-error layer it bundles) live in their own
+  // compartment, reconfigured to empty when the footer toggle turns spellcheck off. Both surfaces ride
+  // the one extension cairnSpellcheck returns, so one compartment gates both. The extension is built
+  // asynchronously (it lazy-imports CodeMirror and the lint modules), so it is held here once resolved
+  // and the on/off effect reconfigures against it.
+  let spellcheckCompartment: import('@codemirror/state').Compartment | null = null;
+  let spellcheckExt: import('@codemirror/state').Extension | null = null;
+  // The tidy decoration field lives in its own compartment (entering and leaving tidy is a reconfigure,
+  // not a rebuild) beside the media and fold decorations. A second compartment carries the read-only +
+  // edit-disable extension while a review is open, so the author cannot edit underneath a pending
+  // review (the same posture Preview takes on the toolbar). Both load with the other editor modules.
+  let tidyMod: typeof import('./editor-tidy.js') | null = null;
+  let tidyCompartment: import('@codemirror/state').Compartment | null = null;
+  let tidyReadonlyCompartment: import('@codemirror/state').Compartment | null = null;
+  let tidyReadonlyExt: import('@codemirror/state').Extension | null = null;
   // The posture themes, swapped through the surface compartment. Each owns its type step and
   // leading (the base theme deliberately sets neither on the content node, so the postures never
   // contest it on adoption order). Built in onMount beside the base theme.
@@ -139,12 +204,15 @@ through the adapter's render. Swapping the editor stays a one-file change.
     const markdownMod = await import('@codemirror/lang-markdown');
     const commandsMod = await import('@codemirror/commands');
     const languageMod = await import('@codemirror/language');
+    const lintMod = await import('@codemirror/lint');
     const autocompleteMod = await import('@codemirror/autocomplete');
     const highlightMod = await import('./editor-highlight.js');
     const modesMod = await import('./editor-modes.js');
     const foldingMod = await import('./editor-folding.js');
     const placeholderMod = await import('./editor-placeholder.js');
     mediaMod = await import('./editor-media.js');
+    tidyMod = await import('./editor-tidy.js');
+    const spellcheckMod = await import('./spellcheck.js');
 
     if (!host) return;
 
@@ -494,6 +562,37 @@ through the adapter's render. Swapping the editor stays a one-file change.
           '--cairn-directive-rail-3': 'var(--cairn-focus-dim-rail-3, 32%)',
           '--cairn-directive-rail-active': 'var(--cairn-focus-dim-rail-active, 36%)',
         },
+        // Tidy review decorations (spec 2.5). The author's original stays in the buffer; a deletion run
+        // strikes through in --cairn-error-ink (reserved for tidy deletions) and the proposed insertion
+        // shows as decoration content in --color-positive-ink (the locked addition token). The two are
+        // a locked pair: deletion red and insertion green never speak the same color, so the author sees
+        // exactly what tidy removes and what it adds. Both carry a non-color cue (the strike-through and
+        // the leading marker) so the change reads without hue alone.
+        '.cm-cairn-tidy-del': {
+          color: 'var(--cairn-error-ink, oklch(50% 0.19 25))',
+          textDecoration: 'line-through',
+          textDecorationThickness: '1px',
+          backgroundColor: 'color-mix(in oklab, var(--cairn-error-ink, oklch(50% 0.19 25)) 12%, transparent)',
+          borderRadius: '2px',
+        },
+        '.cm-cairn-tidy-del-marker': {
+          // A small leading wedge in the deletion ink, the non-color marker that pairs with the red.
+          display: 'inline-block',
+          width: '0',
+          borderLeft: '2px solid var(--cairn-error-ink, oklch(50% 0.19 25))',
+          height: '1em',
+          verticalAlign: '-0.15em',
+          marginRight: '1px',
+        },
+        '.cm-cairn-tidy-ins': {
+          color: 'var(--color-positive-ink, oklch(48% 0.12 150))',
+          backgroundColor: 'color-mix(in oklab, var(--color-positive-ink, oklch(48% 0.12 150)) 16%, transparent)',
+          borderRadius: '2px',
+          padding: '0 1px',
+          marginLeft: '2px',
+          // The non-color cue for an insertion: a leading caret glyph in the addition ink.
+          '&::before': { content: '"+"', fontSize: '0.8em', opacity: '0.7', marginRight: '1px' },
+        },
       },
       { dark: isDark },
     );
@@ -517,6 +616,30 @@ through the adapter's render. Swapping the editor stays a one-file change.
     typewriterCompartment = new stateMod.Compartment();
     surfaceCompartment = new stateMod.Compartment();
     mediaCompartment = new stateMod.Compartment();
+    spellcheckCompartment = new stateMod.Compartment();
+    tidyCompartment = new stateMod.Compartment();
+    tidyReadonlyCompartment = new stateMod.Compartment();
+    // The read-only posture while a tidy review is open: EditorState.readOnly bars edits, and
+    // editable: false drops the contenteditable so the surface is inert under the review (the same
+    // posture Preview takes). The compartment starts empty and the tidyMode effect swaps this in.
+    tidyReadonlyExt = [stateMod.EditorState.readOnly.of(true), viewMod.EditorView.editable.of(false)];
+    // Build the spellcheck extension once: the lint source resolves the dictionary asset URL from the
+    // dialect-resolved filename and posts it to the Worker's init. The compartment starts with the
+    // extension only when spellcheck is on, so a site that opens with it off never spins up the Worker.
+    spellcheckExt = await spellcheckMod.cairnSpellcheck({
+      dictionaryFile: spellcheckDictionary,
+      // Seed the Worker's personal layer from the committed site dictionary, and share the host's
+      // pending-additions set so an add-to-dictionary choice records here for the host to commit.
+      siteWords: siteDictionary,
+      pendingAdditions,
+      // Hand the lint source the editor's own CodeMirror module instances so its extension lands on the
+      // same copies; a separate dynamic import can resolve to a different instance and break instanceof.
+      modules: { lint: lintMod, language: languageMod, view: viewMod, state: stateMod },
+      // The test seam: a deterministic fake Worker and the skip-ready flag, both straight through to the
+      // lint source. Absent in production, where the real Worker and real asset resolution run.
+      createWorker: spellcheckTest?.createWorker,
+      assumeReady: spellcheckTest?.assumeReady,
+    });
 
     view = new EditorView({
       parent: host,
@@ -552,6 +675,14 @@ through the adapter's render. Swapping the editor stays a one-file change.
           // reconfigures it without rebuilding the editor. The chip and the atomic ranges read the
           // library; an empty library decorates nothing.
           mediaCompartment.of(mediaMod.cairnMediaDecorations(mediaLibrary)),
+          // The spellcheck and objective-error lint sources plus the locked amber underline theme, in
+          // their own compartment so the footer toggle gates both surfaces at once. Empty when off.
+          spellcheckCompartment.of(spellcheck ? spellcheckExt : []),
+          // The tidy decoration field, in its own compartment so entering and leaving a review is a
+          // reconfigure beside the media and fold decorations. The api the host drives is built below.
+          tidyCompartment.of(tidyMod.cairnTidy()),
+          // The read-only posture while a review is open, empty until the host sets tidyMode.
+          tidyReadonlyCompartment.of(tidyMode ? tidyReadonlyExt : []),
           // Paste and drop ingest: an image carried by either gesture is preventDefault'd and handed
           // to onImageIngest (the host opens the capture card with the bytes); a gesture carrying no
           // image falls through to CodeMirror's default. 2b is single-file per gesture (open risk 3),
@@ -581,7 +712,11 @@ through the adapter's render. Swapping the editor stays a one-file change.
               return true;
             },
           }),
-          EditorView.contentAttributes.of({ spellcheck: 'true', autocorrect: 'on', autocapitalize: 'sentences' }),
+          // No native text-correction override here (Task 7). The old `spellcheck: 'true'` is gone, so
+          // the content node falls back to CodeMirror's own defaults: spellcheck "false", autocorrect
+          // "off", autocapitalize "off". The cairn lint source replaces the browser's spellcheck
+          // (running both would double-underline), and autocorrect/autocapitalize stay off so a browser
+          // never silently rewrites a `media:` token, a directive name, or frontmatter.
           theme,
           surfaceCompartment.of(surface === 'prose' ? proseTheme : markupTheme),
           EditorView.updateListener.of((update) => {
@@ -606,6 +741,11 @@ through the adapter's render. Swapping the editor stays a one-file change.
     registerFocusEditor?.(focusEditor);
     registerImagePlaceholders?.(placeholderMod.imagePlaceholderApi(view));
     registerGetSelection?.(selectedText);
+    registerGetSelectionRange?.(selectedRange);
+    registerTidy?.(tidyMod.tidyApi(view));
+    registerUndo?.(() => {
+      if (view) commandsMod.undo(view);
+    });
     registerFormat?.(applyFormat);
     registerReplaceRange?.(replaceRange);
     registerSelectRange?.(selectRange);
@@ -654,6 +794,25 @@ through the adapter's render. Swapping the editor stays a one-file change.
     view.dispatch({ effects: mediaCompartment.reconfigure(mediaMod.cairnMediaDecorations(library)) });
   });
 
+  // Reconfigure the spellcheck compartment when the footer toggle flips. On restores the bundled
+  // extension (both lint sources and the theme); off swaps in an empty extension, so the underlines
+  // vanish and the Worker goes idle. Reading the prop tracks it; the guard waits for the mounted
+  // editor and the resolved extension.
+  $effect(() => {
+    const on = spellcheck;
+    if (!mounted || !view || !spellcheckCompartment || !spellcheckExt) return;
+    view.dispatch({ effects: spellcheckCompartment.reconfigure(on ? spellcheckExt : []) });
+  });
+
+  // Reconfigure the read-only posture when tidyMode flips. On makes the surface inert under the open
+  // review (no edits beneath a pending review); off restores editing on apply or cancel. Reading the
+  // prop tracks it; the guard waits for the mounted editor and the resolved extension.
+  $effect(() => {
+    const on = tidyMode;
+    if (!mounted || !view || !tidyReadonlyCompartment || !tidyReadonlyExt) return;
+    view.dispatch({ effects: tidyReadonlyCompartment.reconfigure(on ? tidyReadonlyExt : []) });
+  });
+
   // The last value handed to onComponentAtCaret, so the reporter fires only on a change. The
   // identity compared is name + markdown + from + to. A pure caret move within one block leaves all
   // four unchanged, so it does not refire; an edit inside the block changes the markdown even when
@@ -792,6 +951,14 @@ through the adapter's render. Swapping the editor stays a one-file change.
     return view.state.sliceDoc(from, to);
   }
 
+  // The selection's document offsets, for the tidy host to scope a selection tidy to the exact span.
+  // Null when the selection is empty (a bare caret), which the host reads as document scope.
+  function selectedRange(): { from: number; to: number } | null {
+    if (!view) return null;
+    const { from, to } = view.state.selection.main;
+    return from === to ? null : { from, to };
+  }
+
   // The caret's viewport coordinates, for the insert popover to anchor itself to the cursor. Null
   // before the editor mounts or when the caret has no measurable position (an unrendered line).
   function caretCoords(): { left: number; right: number; top: number; bottom: number } | null {

package/dist/components/MarkdownEditor.svelte.d.ts

@@ -46,6 +46,20 @@ interface Props {
     registerImagePlaceholders?: (api: import('./editor-placeholder.js').ImagePlaceholderApi) => void;
     /** Receives a `() => string` returning the selected text; the web link dialog reads it. */
     registerGetSelection?: (get: () => string) => void;
+    /** Receives a `() => { from, to } | null` returning the selection's document offsets, or null when
+     *  the selection is empty (a bare caret). The tidy host reads it so a selection tidy maps onto the
+     *  exact selected span, never an identical-looking passage earlier in the document. */
+    registerGetSelectionRange?: (get: () => {
+        from: number;
+        to: number;
+    } | null) => void;
+    /** Receives the tidy apply api (spec 2.5): the review surface drives the in-buffer decorations and
+     *  the accept/reject state machine through it. The author's original stays in the buffer until an
+     *  accept writes; a reject or reject-all leaves it byte-identical. */
+    registerTidy?: (api: import('./editor-tidy.js').TidyApi) => void;
+    /** Receives a `() => void` that undoes the last editor transaction; the "Undo tidy" chip calls it
+     *  to take the whole applied tidy back in one move (the apply lands as one history entry). */
+    registerUndo?: (undo: () => void) => void;
     /** Receives a `(kind) => void` that transforms the current selection; the host's toolbar calls it. */
     registerFormat?: (format: (kind: FormatKind) => void) => void;
     /** Reports the directive container at the caret (or null when outside any container) whenever
@@ -72,6 +86,36 @@ interface Props {
     /** The surface posture. Prose is the writing instrument (72ch measure, larger type, looser
      *  leading); markup is the working surface (fills the card, denser). Prose by default. */
     surface?: 'prose' | 'markup';
+    /** Spellcheck and the objective-error layer: the markdown-aware lint underlines. On by default;
+     *  when off the lint compartment reconfigures to empty (the underlines vanish, the Worker stays
+     *  idle). The footer toggle drives this. */
+    spellcheck?: boolean;
+    /** The dialect-resolved dictionary filename, e.g. "dictionary-en-us.txt", from EditData. The
+     *  source resolves it to a real asset URL and hands it to the spellcheck Worker's init. Defaults to
+     *  US English. */
+    spellcheckDictionary?: string;
+    /** The committed personal-dictionary words (spec 1.6), from EditData.siteDictionary. The lint
+     *  source seeds the spellcheck Worker's personal layer with these at init, so a word another editor
+     *  committed answers correct from the first lint. Empty by default (dialect-only). */
+    siteDictionary?: ReadonlyArray<string>;
+    /** The caller-owned pending personal-dictionary additions. When an author chooses "Add to
+     *  dictionary" the lint source adds the lowercased word here (the underline clears at once); the
+     *  host (EditPage) commits this set through the addDictionaryWord action at save time and reconciles
+     *  it against the merged response. A fresh set by default. */
+    pendingAdditions?: Set<string>;
+    /** Test-only seam for the spellcheck Worker. The real wasm and dictionary assets are resolved with
+     *  `import.meta.url` and do not load under the vitest browser dev server, so the component test
+     *  injects a deterministic fake Worker factory and asks the lint source to skip the `ready` wait.
+     *  When this is absent the production path is untouched: the real `new Worker(...)` and the real
+     *  asset resolution. Never set this outside a test. */
+    spellcheckTest?: {
+        createWorker?: () => import('./spellcheck.js').SpellWorker;
+        assumeReady?: boolean;
+    };
+    /** Tidy mode: while a tidy review is open the surface is read-only the way Preview disables the
+     *  toolbar, so the author cannot edit underneath a pending review. The host sets this when it opens
+     *  the review and clears it on apply or cancel. Off by default. */
+    tidyMode?: boolean;
 }
 /**
  * The `MarkdownEditor` seam (spec §6, seam 5): a thin wrapper over CodeMirror 6 exposing a bindable