edytor 1.0.0 → 3.0.0

package/dist/session/navigation.js

@@ -255,21 +255,30 @@ const stopBelow = (edytor, block) => {
  * cell, a code line, a heading). Never in a view that writes nothing.
  */
 const leavesLastStop = (edytor) => {
-    const { selection, root } = edytor;
-    const { value, projection } = selection;
-    const at = projection.start;
-    const block = at && edytor.idToBlock.get(at.block);
-    if (value.kind !== 'text' || !projection.isCollapsed || !block || !root)
-        return false;
-    if (!edytor.dispatcher.permits())
+    const block = onLastLine(edytor);
+    const { root } = edytor;
+    if (!block || !root || !edytor.dispatcher.permits())
         return false;
     if (block.parent?.isRoot && block.type === edytor.defaultChild(root))
         return false;
+    return !stopBelow(edytor, block.id);
+};
+/**
+ * The block a collapsed text caret sits on the last line of (a line box
+ * where the view lays one out, else a line break), if it does: where
+ * ArrowDown leaves the block (`nav.trailing.exit`, `body.down`).
+ */
+export const onLastLine = (edytor) => {
+    const { value, projection } = edytor.selection;
+    const at = projection.start;
+    const block = at && edytor.idToBlock.get(at.block);
+    if (value.kind !== 'text' || !projection.isCollapsed || !block)
+        return;
     const text = stringOf(edytor, at.block);
     if (text.includes('\n', at.offset))
-        return false;
-    return (edytor.ports.surface.sameLine(at, { block: at.block, offset: text.length }) !== false &&
-        !stopBelow(edytor, at.block));
+        return;
+    const last = edytor.ports.surface.sameLine(at, { block: at.block, offset: text.length });
+    return last === false ? undefined : block;
 };
 /**
  * The trailing paragraph (`nav.trailing`, Notion): the caret goes to an
@@ -294,7 +303,7 @@ export const toTrailingParagraph = (edytor) => {
     const text = edytor.idToBlock.get(ids[0] ?? '')?.firstText;
     if (!text)
         return false;
-    edytor.dispatcher.caret(text, 0);
+    edytor.dispatcher.caretIn(text, 0);
     return true;
 };
 /**

package/dist/session/props.d.ts

@@ -0,0 +1,28 @@
+/**
+ * A view's property writes (`block.data`, `atom.data`, `edytor.data`): the
+ * data proxy (`crdt/props.ts`) over the view's one write path.
+ *
+ * The writes of one synchronous task are one dispatch: they queue per
+ * target and leave on the next microtask, or before any other operation
+ * this view dispatches, as the `patchData` operation of each target (more
+ * than one target: one user command, so one undo step, in one
+ * transaction). Hooks see that operation; a veto drops the burst. Until
+ * then the proxy reads its target's data with the queued patches applied
+ * (`dataPreview`), so a write reads back at once. A view that refuses
+ * writes (readonly, a read-only document) refuses an assignment at once:
+ * nothing is queued, the dispatcher records `refused`, nothing throws.
+ */
+import type { DataPatch } from '../crdt/data.js';
+import type { DataTarget } from '../crdt/doc/types.js';
+import type { Edytor } from '../edytor.svelte.js';
+export declare class DataWrites {
+    #private;
+    private readonly edytor;
+    constructor(edytor: Edytor);
+    /** The live proxy over `target`'s data; `read` is its reactive, committed source. */
+    proxy<T extends object>(target: DataTarget, read: () => Record<string, unknown>): T;
+    /** Queue `patches` on `target` for this task's dispatch (refused at once when the view refuses writes). */
+    write(target: DataTarget, patches: DataPatch[]): undefined;
+    /** Dispatch the queued writes now: before any other operation of this view, and at the end of the task. */
+    flush(): undefined;
+}

package/dist/session/props.js

@@ -0,0 +1,65 @@
+import { propsProxy } from '../crdt/props.js';
+const keyOf = (target) => JSON.stringify(target);
+export class DataWrites {
+    edytor;
+    #pending = new Map();
+    #scheduled = false;
+    constructor(edytor) {
+        this.edytor = edytor;
+    }
+    /** The live proxy over `target`'s data; `read` is its reactive, committed source. */
+    proxy(target, read) {
+        let preview;
+        const pending = () => this.#pending.get(keyOf(target));
+        const current = () => {
+            const base = read();
+            const queued = pending();
+            if (!queued)
+                return base;
+            const { version } = this.edytor.facade;
+            const count = queued.patches.length;
+            if (preview?.version !== version || preview.count !== count) {
+                const seen = this.edytor.facade.dataPreview(target, queued.patches);
+                preview = { version, count, data: seen?.data ?? null };
+            }
+            return preview.data ?? base;
+        };
+        return propsProxy(current, (patches) => this.write(target, patches), (path) => {
+            const queued = pending();
+            return queued
+                ? (this.edytor.facade.dataPreview(target, queued.patches)?.ids(path) ?? [])
+                : this.edytor.facade.dataItemIds(target, path);
+        });
+    }
+    /** Queue `patches` on `target` for this task's dispatch (refused at once when the view refuses writes). */
+    write(target, patches) {
+        const { edytor } = this;
+        if (!edytor.dispatcher.permits())
+            return void edytor.patchData(target, patches);
+        const key = keyOf(target);
+        const queued = this.#pending.get(key);
+        if (queued)
+            queued.patches.push(...patches);
+        else
+            this.#pending.set(key, { target, patches: [...patches] });
+        if (this.#scheduled)
+            return;
+        this.#scheduled = true;
+        queueMicrotask(() => {
+            this.#scheduled = false;
+            if (!edytor.destroyed)
+                this.flush();
+        });
+    }
+    /** Dispatch the queued writes now: before any other operation of this view, and at the end of the task. */
+    flush() {
+        if (this.#pending.size === 0)
+            return;
+        const all = [...this.#pending.values()];
+        this.#pending.clear();
+        const { edytor } = this;
+        if (all.length === 1)
+            return void edytor.patchData(all[0].target, all[0].patches);
+        edytor.dispatcher.run('patchData', () => edytor.transact(() => all.forEach(({ target, patches }) => edytor.patchData(target, patches))));
+    }
+}

package/dist/session/suggestions.svelte.d.ts

@@ -1,14 +1,3 @@
-/**
- * Suggestions (site `editor/suggestions`): content one view proposes at a
- * position — AI output, a completion — shown only in that view until it is
- * accepted. Session state: nothing reaches the document, its history,
- * presence, `onChange` or another view before `accept()`, which is one
- * command (`acceptSuggestion`: admission, hooks, one transaction, one undo
- * step) placing the content as a paste places it (`flow.place`, `flow.slot`,
- * `flow.inline`). A suggestion is anchored by block ids (a text range by its
- * anchors): it survives selection changes and edits elsewhere, and is dropped
- * when its block dies. The layer owns the list; the surface renders it.
- */
 import type { BlockId, DocAnchor, OpResult } from '../crdt/index.js';
 import type { Edytor } from '../edytor.svelte.js';
 import { type JSONBlock } from '../utils/json.js';

package/dist/session/suggestions.svelte.js

@@ -1,3 +1,15 @@
+/**
+ * Suggestions (site `editor/suggestions`): content one view proposes at a
+ * position — AI output, a completion — shown only in that view until it is
+ * accepted. Session state: nothing reaches the document, its history,
+ * presence, `onChange` or another view before `accept()`, which is one
+ * command (`acceptSuggestion`: admission, hooks, one transaction, one undo
+ * step) placing the content as a paste places it (`flow.place`, `flow.slot`,
+ * `flow.inline`). A suggestion is anchored by block ids (a text range by its
+ * anchors): it survives selection changes and edits elsewhere, and is dropped
+ * when its block dies. The layer owns the list; the surface renders it.
+ */
+import { DEV } from 'esm-env';
 import { REFUSED } from '../crdt/doc/plan.js';
 import { textToBlocks } from '../clipboard/textBlocks.js';
 import { selectedMembers, viewOf } from '../selection/visibility.js';
@@ -329,17 +341,17 @@ export class Suggestions {
                 resolved = { replace: { anchor: value.anchor, focus: value.focus } };
             else {
                 const block = value.kind === 'atom' ? value.blockId : projection.start?.block;
-                resolved = block ? { after: block } : fail('no selection to replace');
+                resolved = block ? { after: block } : fail(DEV ? 'no selection to replace' : '');
             }
         }
         else
             resolved = at;
         if (!this.#alive(resolved))
-            fail('the position names no shown block');
+            fail(DEV ? 'the position names no shown block' : '');
         if ('inside' in resolved) {
             const probe = edytor.facade.prepare.insertBlocks({ parent: resolved.inside, index: 0 }, []);
             if (!('writes' in probe))
-                fail(`block "${resolved.inside}" holds no children`);
+                fail(DEV ? `block "${resolved.inside}" holds no children` : '');
         }
         return resolved;
     };

package/dist/session/uploads.d.ts

@@ -0,0 +1,29 @@
+/**
+ * The view's uploads as the other layers see them: the one per view the
+ * first media plugin given an `upload` claims (`uploadHooks`), and whether it takes a
+ * file (a kind's `upload` accepts it). A file dragged over the view shows
+ * where it lands only when its uploads take it (`drop`, the plugin layer's
+ * `plugins/fileDrop.ts`, Pragmatic's external adapter); a view without uploads ignores dropped files.
+ */
+import type { Edytor } from '../edytor.svelte.js';
+import type { DropAt } from './attempt.js';
+/** Files dragged from outside over the view: where they land. */
+export interface FileDropPort {
+    /**
+     * The placement the drop of files being handled landed at, once (the
+     * plugin layer's drop target resolves it before the host's `drop`
+     * listener runs); `null` where none shows.
+     */
+    take(): DropAt | null;
+}
+/** What the view's uploads answer about a file. */
+export interface ViewUploads {
+    /** The kind that takes `file` (its record's `upload`), so a paste or a drop places it. */
+    kindOf(file: File): string | undefined;
+    /** Where dropped files land (the plugin layer's indicator). */
+    readonly drop: FileDropPort;
+}
+/** The view's uploads, when a plugin claimed them. */
+export declare const viewUploads: (edytor: Edytor | undefined) => ViewUploads | undefined;
+/** Claim the view's uploads for `uploads`: the first claim wins (`false` after it). */
+export declare const claimUploads: (edytor: Edytor, uploads: ViewUploads) => boolean;

package/dist/session/uploads.js

@@ -0,0 +1,10 @@
+const views = new WeakMap();
+/** The view's uploads, when a plugin claimed them. */
+export const viewUploads = (edytor) => edytor && views.get(edytor);
+/** Claim the view's uploads for `uploads`: the first claim wins (`false` after it). */
+export const claimUploads = (edytor, uploads) => {
+    if (views.has(edytor))
+        return false;
+    views.set(edytor, uploads);
+    return true;
+};

package/dist/surface/lines.js

@@ -18,9 +18,7 @@ export const caretBox = (text, offset, after) => {
         const [endNode, end] = domPointOf(element, from + 1);
         range.setStart(startNode, start);
         range.setEnd(endNode, end);
-        // No layout engine (a server, jsdom) lays nothing out: no box.
-        const list = typeof range.getClientRects === 'function' ? range.getClientRects() : null;
-        return [...(list ?? [])].find((r) => r.width > 0 || r.height > 0) ?? null;
+        return [...range.getClientRects()].find((r) => r.width > 0 || r.height > 0) ?? null;
     };
     const next = box(offset);
     const previous = box(offset - 1);

package/dist/surface/observer.svelte.d.ts

@@ -2,6 +2,18 @@ import type { Edytor } from '../edytor.svelte.js';
 import type { Text } from '../text/text.svelte.js';
 import { type Kind, type Owned } from './attributes.js';
 import { type Patched, type Replaced } from './cells.js';
+/**
+ * What the browser shows for `text`: its element's text nodes in order (WebKit's
+ * converted-space wrappers read as plain spaces), the empty filler and the
+ * trailing-newline marker stripped.
+ */
+export declare const readDomText: (text: Text) => string;
+export declare const getCollapsedDomTextSelection: (edytor: Edytor) => {
+    text: Text;
+    offset: number;
+} | null;
+/** A native line break (a diff inserting only newlines at `at`) runs as the key's occurrence. */
+export declare const lineBreak: (edytor: Edytor, text: Text, value: string, at: number) => Promise<void>;
 export declare class SurfaceObserver {
     #private;
     private edytor;
@@ -12,7 +24,11 @@ export declare class SurfaceObserver {
     constructor(edytor: Edytor);
     /** Observe `root` (the host): records name what to compare. */
     attach: (root: HTMLElement) => () => void;
-    /** Register an element the core rendered (an attachment); returns its release. */
+    /**
+     * Register an element the core rendered (an attachment); returns its
+     * release. A text element takes the table's attributes now (its id, its
+     * editing host inside a void).
+     */
     register: (node: Element, kind: Kind, block: string, name?: string, owned?: () => Owned) => () => void;
     /** The render anchor (`Edytor.svelte`): a registered child of the strict root. */
     anchor: (node: HTMLElement) => {

package/dist/surface/observer.svelte.js

@@ -38,7 +38,9 @@ import { diffText } from '../utils/diffText.js';
 import { jsonEquals } from '../utils/json.js';
 import { activeMarks, marksForInsertion } from '../session/editing/text.js';
 import { INTENTS } from '../session/attempt.js';
-import { getCollapsedDomTextSelection, handleNativeLineBreakTextValue, readDomText } from '../events/onInput.js';
+import { runOccurrence } from '../events/onBeforeInput.js';
+import { getDomSelectionSnapshot } from '../selection/domSelection.js';
+import { domOffsetIn } from '../selection/selection.utils.js';
 import { diverges, heal, ownedOf } from './attributes.js';
 import { getTextContentOffsetAtPoint } from '../events/domTextOffset.js';
 import { rendersMark } from './cells.js';
@@ -67,22 +69,68 @@ const textOf = (cell) => cell.runs
     .replace(ZWSP, '');
 /** Svelte's anchors: comments and empty text nodes are never input and never removed. */
 const isAnchor = (node) => node.nodeType === Node.COMMENT_NODE || (node.nodeType === Node.TEXT_NODE && !node.nodeValue);
-/** Non-empty text nodes under `node`. */
-const leaves = (node) => {
+/** The `nth` non-empty text node under `node`. */
+const textLeaf = (node, nth = 0) => {
     const walker = (node.ownerDocument ?? document).createTreeWalker(node, NodeFilter.SHOW_TEXT);
-    let count = 0;
     while (walker.nextNode())
-        if (walker.currentNode.data)
-            count++;
-    return count;
-};
-const firstLeaf = (node) => {
-    const walker = (node.ownerDocument ?? document).createTreeWalker(node, NodeFilter.SHOW_TEXT);
-    while (walker.nextNode())
-        if (walker.currentNode.data)
+        if (walker.currentNode.data && nth-- === 0)
             return walker.currentNode;
     return null;
 };
+const ZERO_WIDTH_SPACE = '\u200B';
+/**
+ * What the browser shows for `text`: its element's text nodes in order (WebKit's
+ * converted-space wrappers read as plain spaces), the empty filler and the
+ * trailing-newline marker stripped.
+ */
+export const readDomText = (text) => {
+    let value = '';
+    const node = text.node;
+    if (node) {
+        const walker = (node.ownerDocument ?? document).createTreeWalker(node, NodeFilter.SHOW_TEXT);
+        while (walker.nextNode()) {
+            const leaf = walker.currentNode;
+            value += leaf.parentElement?.closest('span.Apple-converted-space')
+                ? leaf.data.replaceAll('\u00A0', ' ')
+                : leaf.data;
+        }
+    }
+    // An empty text's filler shares its node with what the browser typed, on either side.
+    if (text.isEmpty)
+        return value.replaceAll(ZERO_WIDTH_SPACE, '');
+    if (text.endsWithNewline && value.endsWith(ZERO_WIDTH_SPACE)) {
+        value = value.slice(0, -ZERO_WIDTH_SPACE.length);
+    }
+    return value;
+};
+export const getCollapsedDomTextSelection = (edytor) => {
+    const selection = getDomSelectionSnapshot(edytor.node);
+    if (!selection?.anchorNode || !selection.isCollapsed) {
+        return null;
+    }
+    if (!edytor.node?.contains(selection.anchorNode)) {
+        return null;
+    }
+    const text = edytor.selection.getTextOfNode(selection.anchorNode);
+    if (!text?.node) {
+        return null;
+    }
+    // No model rule here: the DOM caret is read BEFORE the reconcile writes
+    // the model, so a native insertion legitimately sits past `text.length`
+    // (`selectText` clamps the final write).
+    return { text, offset: domOffsetIn(text, selection.anchorNode, selection.anchorOffset) };
+};
+/** A native line break (a diff inserting only newlines at `at`) runs as the key's occurrence. */
+export const lineBreak = async (edytor, text, value, at) => {
+    if (!text.isInDocument)
+        return;
+    const inputType = edytor.attempts.confirm()?.inputType === 'insertLineBreak' || value.includes('\n')
+        ? 'insertLineBreak'
+        : 'insertParagraph';
+    text.refreshFromModel();
+    edytor.selection.selectText(text, at);
+    await runOccurrence(edytor, { inputType, cancelable: false });
+};
 const settle = (promises) => Promise.all(promises).then(() => undefined);
 /** The collapsed DOM caret's text offset inside `nodes` (a replacement's), if it is there. */
 const caretIn = (nodes) => {
@@ -167,9 +215,16 @@ export class SurfaceObserver {
             clearTimeout(this.#window ?? undefined);
         };
     };
-    /** Register an element the core rendered (an attachment); returns its release. */
+    /**
+     * Register an element the core rendered (an attachment); returns its
+     * release. A text element takes the table's attributes now (its id, its
+     * editing host inside a void).
+     */
     register = (node, kind, block, name, owned) => {
-        this.#registry.set(node, { kind, block, name, owned });
+        const entry = { kind, block, name, owned };
+        this.#registry.set(node, entry);
+        if (kind === 'text')
+            heal(node, ownedOf(this.edytor, node, entry));
         if (kind === 'block')
             this.#blocks.set(block, node);
         else if (kind !== 'anchor' && kind !== 'preview') {
@@ -579,7 +634,7 @@ export class SurfaceObserver {
             const shown = deltas.length ? deltas : [{ text: '\u200B' }];
             for (const [i, delta] of shown.entries()) {
                 const node = nodes[i];
-                const leaf = node?.nodeType === Node.TEXT_NODE ? node : node && firstLeaf(node);
+                const leaf = node?.nodeType === Node.TEXT_NODE ? node : node && textLeaf(node);
                 if (!leaf)
                     return false;
                 if (leaf.data !== delta.text)
@@ -614,7 +669,7 @@ export class SurfaceObserver {
             const at = replaced ? replaced.caret : caret?.text === text ? caret.offset : undefined;
             const line = diffText(text.stringContent, dom);
             if (line && !line.remove && /^[\r\n]+$/.test(line.insert)) {
-                work.push(handleNativeLineBreakTextValue(edytor, text, dom));
+                work.push(lineBreak(edytor, text, dom, line.at));
                 continue;
             }
             work.push(adopt(edytor, text, dom, at));
@@ -698,7 +753,7 @@ export class SurfaceObserver {
                 if (marks.join() !== chain.join())
                     return 'mark-chain';
                 // The snippet's markup is its own, but the delta renders one text node.
-                if (leaves(node) !== 1)
+                if (!textLeaf(node) || textLeaf(node, 1))
                     return 'mark-text';
             }
         }

package/dist/surface/overlay.d.ts

@@ -50,20 +50,6 @@ export declare const pin: (host: HTMLElement) => CSSStyleDeclaration & {
     left: string;
     top: string;
 };
-/**
- * A popup's place near `rect` (client px), 8px inside the viewport: `gap`
- * below it, above it when there is no room below (`above`: above first,
- * below when there is no room above), its left edge at `rect`'s or
- * centered on it (`center`). Measured now from `box` (the host's first
- * element by default; `fallback` before it has a size), written by the
- * answer (the overlay's read-then-write pass).
- */
-export declare const placeNear: (host: HTMLElement, rect: DOMRect, fallback: readonly [width: number, height: number], { gap, above, center, box }?: {
-    gap?: number;
-    above?: boolean;
-    center?: boolean;
-    box?: Element | null;
-}) => (() => void) | void;
 export declare class Overlay {
     #private;
     /** The layer: absolutely positioned at its static place right after the host. */

package/dist/surface/overlay.js

@@ -68,31 +68,6 @@ export const sameValues = (a, b) => a === b ||
         Object.keys(a).every((key) => a[key] === b[key]));
 /** A mounted host whose chrome places itself layer-relative: pinned at the layer's origin. */
 export const pin = (host) => Object.assign(host.style, { position: 'absolute', left: '0px', top: '0px' });
-/**
- * A popup's place near `rect` (client px), 8px inside the viewport: `gap`
- * below it, above it when there is no room below (`above`: above first,
- * below when there is no room above), its left edge at `rect`'s or
- * centered on it (`center`). Measured now from `box` (the host's first
- * element by default; `fallback` before it has a size), written by the
- * answer (the overlay's read-then-write pass).
- */
-export const placeNear = (host, rect, fallback, { gap = 8, above = false, center = false, box = host.firstElementChild } = {}) => {
-    const view = host.ownerDocument.defaultView;
-    if (!view)
-        return;
-    const size = box?.getBoundingClientRect();
-    const width = size?.width || fallback[0];
-    const height = size?.height || fallback[1];
-    const x = center ? rect.left + rect.width / 2 - width / 2 : rect.left;
-    const [below, up] = [rect.bottom + gap, rect.top - gap - height];
-    const y = above
-        ? up >= 8
-            ? up
-            : below
-        : Math.max(8, below + height < view.innerHeight ? below : up);
-    const left = `${Math.max(8, Math.min(x, view.innerWidth - width - 8))}px`;
-    return () => Object.assign(host.style, { left, top: `${y}px` });
-};
 /** The band around the viewport (`near`) whose blocks' resizes are watched, in screens above and below. */
 const NEAR_SCREENS = 1;
 export class Overlay {

package/dist/surface/projector.svelte.js

@@ -467,7 +467,7 @@ export class Projector {
     };
     #write = (dom, { anchor, focus }, collapsed) => {
         this.#parking = false;
-        if (!collapsed && typeof dom.setBaseAndExtent === 'function') {
+        if (!collapsed) {
             try {
                 dom.setBaseAndExtent(anchor[0], anchor[1], focus[0], focus[1]);
                 return;

package/dist/text/text.svelte.js

@@ -1,3 +1,4 @@
+import { cleanups } from '../utils.js';
 import {} from '../utils/json.js';
 import { segmentJSON } from '../session/handles.js';
 /**
@@ -101,20 +102,9 @@ export class Text {
     attach = (node) => {
         this.node = node;
         this.edytor.nodeToText.set(node, this);
+        // Registered, it takes the attribute table's attributes (`surface/attributes.ts`).
         const release = this.edytor.surface.register(node, 'text', this.parent.id);
-        node.setAttribute('data-edytor-id', `${this.id}`);
-        node.setAttribute('data-edytor-text', `true`);
-        const pluginDestroy = this.edytor.plugins.flatMap((plugin) => {
-            const action = plugin.onTextAttached?.({ node, text: this });
-            return typeof action === 'function' ? [action] : [];
-        });
-        let insideVoid = false;
-        for (let block = this.parent; block && !insideVoid; block = block.parent)
-            insideVoid = !!block.definition.void;
-        if (insideVoid) {
-            node.setAttribute('contenteditable', 'true');
-            node.style.outline = 'none';
-        }
+        const pluginDestroy = cleanups(this.edytor.plugins, (plugin) => plugin.onTextAttached?.({ node, text: this }));
         // A display that waited for a mounted destination runs in the next pass.
         this.edytor.projector?.mounted(this);
         return {

package/dist/themes/notion.css

@@ -729,6 +729,15 @@
 }
 
 /* ── Columns ────────────────────────────────────────────────────────── */
+/* A layout and its columns reserve no inline space: a column's blocks start
+   at the column's edge (Notion's), its handles stand in the gap before it. */
+.edytor-notion
+	:is(
+		[data-edytor-block][data-edytor-columns],
+		[data-edytor-block][data-edytor-column]:not([data-edytor-table-cell])
+	) {
+	padding-inline: 0;
+}
 /* A column's first and last blocks sit flush with the layout's edges. */
 .edytor-notion [data-edytor-column] > [data-edytor-children] > [data-edytor-block]:first-child {
 	margin-top: 0;

package/dist/utils/sanitize.d.ts

@@ -0,0 +1,38 @@
+/**
+ * The sanitizers every reader of untrusted values shares: a link's href and
+ * a CSS colour (marks), read the same by render, the clipboard, HTML and
+ * markdown import and export. Pure: no DOM, no Svelte, Worker-safe.
+ */
+/**
+ * CSS-color sanitizer for `color`/`highlight` marks. The value lands in
+ * `style="color: {value}"` — a `;`/`{`/`}` payload escapes the property
+ * and injects arbitrary declarations (`url()` exfil, `position:fixed`
+ * overlays). Metacharacters, escape/obfuscation sequences, and
+ * resource-loading functions are rejected; real `<color>` values
+ * (`#hex`, `rgb()/hsl()/oklch()/color-mix()/var()`, named colors) pass.
+ */
+export declare const sanitizeCssColorValue: (value: unknown) => string | null;
+/**
+ * Scheme allowlist for link hrefs. `javascript:`/`data:`/`vbscript:`
+ * payloads can arrive through native `insertLink`, pasted HTML, or a
+ * malicious collaborator — and Svelte renders `href` verbatim. The href is
+ * read as the browser's URL parser reads it: it strips C0 controls and
+ * spaces at both ends and tab/newline/CR anywhere (`\u0001javascript:` is
+ * `javascript:` to a browser), then resolves it against a base; only an
+ * allowed scheme, or a relative href that stays relative, passes.
+ */
+export declare const sanitizeLinkHref: (href: unknown) => string | null;
+/**
+ * A web page's URL a media block may store or render: the link sanitizer's
+ * reading of it ({@link sanitizeLinkHref}: ASCII control characters and spaces stripped,
+ * tab/newline anywhere), then only an absolute `http:`/`https:` URL with a
+ * host. `null` for anything else: a script or `data:` URL, a `mailto:`, a
+ * relative path, a bare domain.
+ */
+export declare const safeWebUrl: (value: unknown) => string | null;
+/**
+ * A media file's source (a video, an audio track, an attachment): a
+ * {@link safeWebUrl}, or a `blob:` URL an upload answered. Never `data:`:
+ * an inline file would be stored in the document and sent in every update.
+ */
+export declare const safeMediaSrc: (value: unknown) => string | null;

package/dist/utils/sanitize.js

@@ -0,0 +1,82 @@
+/**
+ * The sanitizers every reader of untrusted values shares: a link's href and
+ * a CSS colour (marks), read the same by render, the clipboard, HTML and
+ * markdown import and export. Pure: no DOM, no Svelte, Worker-safe.
+ */
+const SAFE_LINK_PROTOCOLS = new Set(['http:', 'https:', 'mailto:', 'tel:']);
+/**
+ * CSS-color sanitizer for `color`/`highlight` marks. The value lands in
+ * `style="color: {value}"` — a `;`/`{`/`}` payload escapes the property
+ * and injects arbitrary declarations (`url()` exfil, `position:fixed`
+ * overlays). Metacharacters, escape/obfuscation sequences, and
+ * resource-loading functions are rejected; real `<color>` values
+ * (`#hex`, `rgb()/hsl()/oklch()/color-mix()/var()`, named colors) pass.
+ */
+export const sanitizeCssColorValue = (value) => {
+    if (typeof value !== 'string')
+        return null;
+    const trimmed = value.trim();
+    if (!trimmed || trimmed.length > 128)
+        return null;
+    if (/[;{}<>\\'"`]/.test(trimmed) || /url\s*\(|expression\s*\(|\/\*|\*\//i.test(trimmed)) {
+        return null;
+    }
+    return trimmed;
+};
+/**
+ * Scheme allowlist for link hrefs. `javascript:`/`data:`/`vbscript:`
+ * payloads can arrive through native `insertLink`, pasted HTML, or a
+ * malicious collaborator — and Svelte renders `href` verbatim. The href is
+ * read as the browser's URL parser reads it: it strips C0 controls and
+ * spaces at both ends and tab/newline/CR anywhere (`\u0001javascript:` is
+ * `javascript:` to a browser), then resolves it against a base; only an
+ * allowed scheme, or a relative href that stays relative, passes.
+ */
+export const sanitizeLinkHref = (href) => {
+    const trimmed = hrefOf(href);
+    // A relative href resolves to the base's `https:`: it names no scheme of its own.
+    return trimmed &&
+        SAFE_LINK_PROTOCOLS.has(urlOf(trimmed, 'https://relative.invalid/')?.protocol ?? '')
+        ? trimmed
+        : null;
+};
+/**
+ * A href as the browser's URL parser reads it: C0 controls and spaces
+ * stripped at both ends, tab/newline/CR anywhere; `''` for a non-string
+ * (marks arrive from untrusted sources too: synced peers, paste).
+ */
+const hrefOf = (href) => typeof href === 'string'
+    ? // eslint-disable-next-line no-control-regex
+        href.replace(/[\t\n\r]/g, '').replace(/^[\u0000-\u0020]+|[\u0000-\u0020]+$/g, '')
+    : '';
+/** `href` parsed (against `base`), or `undefined` when it is no URL. */
+const urlOf = (href, base) => {
+    try {
+        return new URL(href, base);
+    }
+    catch {
+        return undefined;
+    }
+};
+/**
+ * A web page's URL a media block may store or render: the link sanitizer's
+ * reading of it ({@link sanitizeLinkHref}: ASCII control characters and spaces stripped,
+ * tab/newline anywhere), then only an absolute `http:`/`https:` URL with a
+ * host. `null` for anything else: a script or `data:` URL, a `mailto:`, a
+ * relative path, a bare domain.
+ */
+export const safeWebUrl = (value) => {
+    const href = hrefOf(value);
+    const url = href ? urlOf(href) : undefined;
+    return url && /^https?:$/.test(url.protocol) && url.host ? href : null;
+};
+/**
+ * A media file's source (a video, an audio track, an attachment): a
+ * {@link safeWebUrl}, or a `blob:` URL an upload answered. Never `data:`:
+ * an inline file would be stored in the document and sent in every update.
+ */
+export const safeMediaSrc = (value) => {
+    const blob = typeof value === 'string' ? /^blob:(.*)$/is.exec(value.trim()) : null;
+    const origin = blob && safeWebUrl(blob[1]);
+    return origin ? `blob:${origin}` : safeWebUrl(value);
+};