ngwr 14.7.0 → 14.9.0

package/fesm2022/ngwr-editor.mjs

@@ -0,0 +1,2601 @@
+import { Directionality } from '@angular/cdk/bidi';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { DOCUMENT, isPlatformBrowser, NgTemplateOutlet } from '@angular/common';
+import * as i0 from '@angular/core';
+import { signal, computed, model, output, input, inject, Injector, DestroyRef, ElementRef, PLATFORM_ID, viewChild, viewChildren, isDevMode, effect, untracked, afterRenderEffect, afterNextRender, ViewEncapsulation, Component } from '@angular/core';
+import { WrButton } from 'ngwr/button';
+import { useConfigValue } from 'ngwr/config';
+import { useFormFieldAria, WR_FORM_FIELD } from 'ngwr/form';
+import { useI18nText, readI18nText, useI18nFormatter } from 'ngwr/i18n';
+import { WrInput } from 'ngwr/input';
+import { parseMarkdown, serializeMarkdown, safeMarkdownUrl } from 'ngwr/markdown';
+import { WrPlatform } from 'ngwr/platform';
+import { WrPopover } from 'ngwr/popover';
+import { isComposing } from 'ngwr/utils';
+import { TextSelection, Plugin, EditorState } from 'prosemirror-state';
+import { EditorView, DecorationSet, Decoration } from 'prosemirror-view';
+import { DOMParser, DOMSerializer, Fragment, Schema } from 'prosemirror-model';
+import { toggleMark, setBlockType, wrapIn, chainCommands, exitCode, baseKeymap } from 'prosemirror-commands';
+import { redo, undo, history } from 'prosemirror-history';
+import { undoInputRule, inputRules, textblockTypeInputRule, wrappingInputRule } from 'prosemirror-inputrules';
+import { keymap } from 'prosemirror-keymap';
+import { wrapInList, liftListItem, splitListItem, sinkListItem } from 'prosemirror-schema-list';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/** Past this many nested elements the value is refused unread — see {@link readHtml}. */
+const MAX_DOM_DEPTH = 512;
+/** What the HTML parser collapses and strips, written where a space has to survive it. */
+const NBSP = '\u00a0';
+/** One answer per window, `null` where there is no policy to use. */
+const policies = new WeakMap();
+/**
+ * An HTML string wrapped for a `trusted-types` page, decided once per window and
+ * only where the API exists.
+ *
+ * A template's `innerHTML` is a Trusted Types sink like any other, and under
+ * `require-trusted-types-for 'script'` a plain string throws. Pass-through is
+ * sound HERE and nowhere else: the string lands in an inert template, and what
+ * leaves it is rebuilt node by node from the schema's allowlist — the same
+ * argument ProseMirror makes for its own clipboard policy.
+ *
+ * The page's default policy comes first, as it does in ProseMirror's clipboard
+ * code; then one named `ngwr-editor`. Creating that one THROWS on a page whose
+ * `trusted-types` allowlist does not name it, and uncaught that refused every
+ * HTML value on the page — so a refusal falls back to the plain string, which
+ * such a page refuses at the sink instead, as a value the editor could not read.
+ * An app with an allowlist and no default policy adds `ngwr-editor` (and
+ * ProseMirror's own `ProseMirrorClipboard`, for paste).
+ */
+function trusted(html, view) {
+    const types = view?.trustedTypes;
+    if (!view || !types)
+        return html;
+    let policy = policies.get(view);
+    if (policy === undefined) {
+        policy = types.defaultPolicy ?? null;
+        if (!policy) {
+            try {
+                policy = types.createPolicy('ngwr-editor', { createHTML: input => input });
+            }
+            catch {
+                policy = null;
+            }
+        }
+        policies.set(view, policy);
+    }
+    return (policy ? policy.createHTML(html) : html);
+}
+/**
+ * An untrusted HTML string as a checked document, or a thrown `RangeError`.
+ *
+ * Parsed into a `<template>` of the INJECTED document, never into a live node:
+ * a template's content has no browsing context, so a `<script>` does not run, an
+ * `<img onerror>` never loads and no handler fires. It is also the one inert
+ * parser the server has — domino ships no `DOMParser`. From there the schema's
+ * parse rules rebuild the document from an allowlist, so an attribute they do
+ * not name never reaches it, and a link or image the URL policy refuses keeps its
+ * text and loses the URL.
+ *
+ * Depth is checked before ProseMirror sees the tree: its parser recurses, a
+ * browser's HTML parser caps nesting on its own and neither jsdom nor domino
+ * does.
+ */
+function readHtml(html, document, schema) {
+    const template = document.createElement('template');
+    template.innerHTML = trusted(html, document.defaultView);
+    if (depthOf(template.content) > MAX_DOM_DEPTH)
+        throw new RangeError('<wr-editor>: the HTML value nests too deeply');
+    const doc = DOMParser.fromSchema(schema).parse(template.content);
+    doc.check();
+    return doc;
+}
+function depthOf(root) {
+    let deepest = 0;
+    const stack = [];
+    for (let child = root.firstElementChild; child; child = child.nextElementSibling)
+        stack.push([child, 1]);
+    while (stack.length) {
+        const [element, depth] = stack.pop();
+        if (depth > deepest)
+            deepest = depth;
+        if (deepest > MAX_DOM_DEPTH)
+            return deepest;
+        for (let child = element.firstElementChild; child; child = child.nextElementSibling)
+            stack.push([child, depth + 1]);
+    }
+    return deepest;
+}
+/**
+ * A document as HTML, serialized in a document of its own.
+ *
+ * Never the live one: an `<img>` created by the page's document starts loading
+ * the moment its `src` is set, attached or not. On the server the injected
+ * document is domino's and loads nothing, which is also why the fallback is safe
+ * where `createHTMLDocument` is missing.
+ *
+ * Spaces are written the way {@link keepSpaces} says, so the editor's own output
+ * reads back as the text it was written from.
+ */
+function writeHtml(doc, document) {
+    const off = document.implementation?.createHTMLDocument?.('') ?? document;
+    const container = off.createElement('div');
+    const content = withKeptSpaces(doc).content;
+    container.appendChild(DOMSerializer.fromSchema(doc.type.schema).serializeFragment(content, { document: off }));
+    return container.innerHTML;
+}
+function withKeptSpaces(node) {
+    if (node.isTextblock)
+        return keepSpaces(node);
+    if (node.isLeaf)
+        return node;
+    const children = [];
+    let changed = false;
+    node.forEach(child => {
+        const next = withKeptSpaces(child);
+        changed ||= next !== child;
+        children.push(next);
+    });
+    return changed ? node.copy(Fragment.from(children)) : node;
+}
+/**
+ * A textblock whose spaces survive the HTML parser: every space it would collapse
+ * or strip is written as a no-break space.
+ *
+ * The surface draws spaces as typed (`white-space: break-spaces`), but the parser
+ * that reads a value back — ProseMirror's, and a browser's rendering of the same
+ * HTML — collapses a run into one and drops one at the start of a block, after a
+ * line break and at the end. So a space stays a space only where a character
+ * other than a space comes before it and anything but the block's end comes
+ * after; the rest alternate as no-break spaces, the way CKEditor writes them. A
+ * run that crosses a mark boundary is still one run. A code block is read with
+ * its whitespace kept, and left alone.
+ */
+function keepSpaces(block) {
+    if (block.type.spec.code || !block.textContent.includes(' '))
+        return block;
+    const children = [];
+    let before = 'start';
+    let changed = false;
+    block.forEach((child, _offset, index) => {
+        if (!child.isText) {
+            children.push(child);
+            before = child.type.name === 'hard_break' ? 'start' : 'other';
+            return;
+        }
+        const text = child.text;
+        const last = index === block.childCount - 1;
+        let out = '';
+        for (let i = 0; i < text.length; i++) {
+            const char = text[i];
+            if (char !== ' ') {
+                out += char;
+                before = 'other';
+            }
+            else if (before === 'other' && !(last && i === text.length - 1)) {
+                out += ' ';
+                before = 'space';
+            }
+            else {
+                out += NBSP;
+                before = 'other';
+            }
+        }
+        changed ||= out !== text;
+        children.push(out === text ? child : block.type.schema.text(out, child.marks));
+    });
+    return changed ? block.copy(Fragment.from(children)) : block;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * How deep a JSON value may nest before it is refused unread.
+ *
+ * Not the editing limit — that is `MAX_NESTING`, counted in quotes and list
+ * items. This one is the stack's: `Node.fromJSON` and `check()` both recurse,
+ * and about three thousand nested blocks overflow them. A document the editor
+ * itself can produce is nowhere near it (eleven levels of list is under forty
+ * JSON levels), so anything past it was not written by an editor.
+ */
+const MAX_JSON_DEPTH = 256;
+/**
+ * An untrusted JSON value as a checked document, or a thrown `RangeError`.
+ *
+ * Both steps are needed. `nodeFromJSON` refuses an unknown node or mark, an
+ * empty text node and an attribute its validator rejects — the URL policy
+ * among them — but does NOT check content expressions; `check()` does, and
+ * re-runs the validators besides. The shape pass in front keeps a malformed or
+ * hostile value from reaching either: a non-object, a `text` that is not a
+ * string, or nesting past {@link MAX_JSON_DEPTH}.
+ */
+function readJson(value, schema) {
+    assertShape(value, 0);
+    const doc = schema.nodeFromJSON(value);
+    if (doc.type !== schema.topNodeType)
+        throw new RangeError('<wr-editor>: a JSON value is a `doc` node');
+    doc.check();
+    return doc;
+}
+function assertShape(value, depth) {
+    if (depth > MAX_JSON_DEPTH)
+        throw new RangeError('<wr-editor>: the JSON value nests too deeply');
+    if (typeof value !== 'object' || value === null || Array.isArray(value)) {
+        throw new RangeError('<wr-editor>: every JSON node is an object');
+    }
+    const node = value;
+    if (typeof node['type'] !== 'string')
+        throw new RangeError('<wr-editor>: every JSON node has a string `type`');
+    if (node['text'] !== undefined && typeof node['text'] !== 'string') {
+        throw new RangeError('<wr-editor>: `text` is a string');
+    }
+    for (const key of ['attrs', 'marks', 'content']) {
+        const child = node[key];
+        if (child === undefined)
+            continue;
+        if (key === 'attrs') {
+            if (typeof child !== 'object' || child === null || Array.isArray(child)) {
+                throw new RangeError('<wr-editor>: `attrs` is an object');
+            }
+            continue;
+        }
+        if (!Array.isArray(child))
+            throw new RangeError(`<wr-editor>: \`${key}\` is an array`);
+        for (const item of child)
+            assertShape(item, depth + 1);
+    }
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Markdown to and from the editor's document JSON — both walkers pure, with no
+ * ProseMirror import, so they run under SSR and in a spec with no DOM.
+ *
+ * The reading half never passes `streaming: true`: that mode withholds a
+ * trailing `**` or `[` as a half-typed fragment, which in an editor would delete
+ * what the user actually wrote.
+ */
+// ---------------------------------------------------------------------------
+// Markdown → document
+// ---------------------------------------------------------------------------
+/** A markdown string as the editor's document JSON. */
+function markdownToJson(source) {
+    const content = blocksToJson(parseMarkdown(source));
+    return { type: 'doc', content: content.length ? content : [{ type: 'paragraph' }] };
+}
+function blocksToJson(blocks) {
+    return blocks.map(blockToJson);
+}
+function blockToJson(block) {
+    switch (block.kind) {
+        case 'paragraph':
+            return textblock('paragraph', undefined, block.inlines);
+        case 'heading':
+            // The schema stops at three; h4–h6 keep being headings rather than turning
+            // into paragraphs, the same clamp the HTML path applies.
+            return textblock('heading', { level: Math.min(block.level, 3) }, block.inlines);
+        case 'code':
+            // An empty text node is refused by ProseMirror, so an empty fence has no
+            // content. The info word goes through the schema's own rule, as it does on
+            // the HTML path: the parser keeps a word of any length, the schema refuses
+            // one past 64 characters, and passed on unchanged it refused the whole
+            // document over one fence tagged with a URL.
+            return {
+                type: 'code_block',
+                attrs: { language: languageValue(block.language) },
+                ...(block.code ? { content: [{ type: 'text', text: block.code }] } : {}),
+            };
+        case 'quote': {
+            const children = blocksToJson(block.children);
+            return { type: 'blockquote', content: children.length ? children : [{ type: 'paragraph' }] };
+        }
+        case 'list':
+            return {
+                type: block.ordered ? 'ordered_list' : 'bullet_list',
+                attrs: block.ordered ? { order: block.start, tight: block.tight } : { tight: block.tight },
+                content: block.items.map(itemToJson),
+            };
+        case 'table':
+            return tableToJson(block.head, block.rows, block.align);
+        case 'rule':
+            return { type: 'horizontal_rule' };
+    }
+}
+/**
+ * A list item. Its content has to open with a paragraph — the shape
+ * `prosemirror-schema-list`'s commands are written for — so an item that starts
+ * with a code block, a quote or a nested list gets an empty paragraph in front,
+ * which {@link jsonToMarkdown} drops again on the way out.
+ */
+function itemToJson(item) {
+    const children = blocksToJson(item.children);
+    if (children[0]?.type !== 'paragraph')
+        children.unshift({ type: 'paragraph' });
+    return { type: 'list_item', attrs: { checked: item.checked }, content: children };
+}
+function tableToJson(head, rows, align) {
+    const row = (cells, type) => ({
+        type: 'table_row',
+        content: cells.map((cell, index) => ({
+            type,
+            attrs: { align: align[index] ?? null },
+            content: [textblock('paragraph', undefined, cell.inlines)],
+        })),
+    });
+    return { type: 'table', content: [row(head, 'table_header'), ...rows.map(cells => row(cells, 'table_cell'))] };
+}
+function textblock(type, attrs, inlines) {
+    const content = inlinesToJson(inlines);
+    return { type, ...(attrs ? { attrs } : {}), ...(content.length ? { content } : {}) };
+}
+/**
+ * Nested inline nodes flattened into leaves that each carry the marks collected
+ * on the way down — the shape ProseMirror holds.
+ *
+ * A mark is added once however often it nests (`**a **b** c**`): a mark set with
+ * the same mark twice is invalid to ProseMirror, and the whole value would be
+ * refused over it. Adjacent leaves with the same marks are joined, because
+ * `Node.fromJSON` does not join them and ProseMirror assumes it never sees two.
+ */
+function inlinesToJson(inlines) {
+    const out = [];
+    collect(inlines, [], out);
+    return out;
+}
+function collect(nodes, marks, out) {
+    for (const node of nodes) {
+        switch (node.kind) {
+            case 'text':
+                // A soft break and the indentation around it render as one space; kept
+                // as `\n`, the editor's `pre-wrap` would draw a line break the markdown
+                // never had.
+                pushText(out, node.value.replace(/\s*\n\s*/g, ' '), marks);
+                break;
+            case 'code':
+                pushText(out, node.value, withMark(marks, { type: 'code' }));
+                break;
+            case 'break':
+                out.push(withMarks({ type: 'hard_break' }, marks));
+                break;
+            case 'image':
+                out.push(withMarks({ type: 'image', attrs: { src: node.src, alt: node.alt, title: node.title } }, marks.filter(mark => mark.type === 'link')));
+                break;
+            case 'link':
+                collect(node.children, withMark(marks, { type: 'link', attrs: { href: node.href, title: node.title } }), out);
+                break;
+            case 'strong':
+                collect(node.children, withMark(marks, { type: 'strong' }), out);
+                break;
+            case 'em':
+                collect(node.children, withMark(marks, { type: 'em' }), out);
+                break;
+            case 'del':
+                collect(node.children, withMark(marks, { type: 'strike' }), out);
+                break;
+        }
+    }
+}
+function withMark(marks, mark) {
+    // The outer one wins — for a link that is the one the reader would follow.
+    return marks.some(existing => existing.type === mark.type) ? marks : [...marks, mark];
+}
+function withMarks(node, marks) {
+    return marks.length ? { ...node, marks } : node;
+}
+function pushText(out, text, marks) {
+    if (!text)
+        return;
+    const last = out[out.length - 1];
+    if (last?.type === 'text' && sameMarks(last.marks ?? [], marks)) {
+        out[out.length - 1] = { ...last, text: last.text + text };
+        return;
+    }
+    out.push(withMarks({ type: 'text', text }, marks));
+}
+function sameMarks(a, b) {
+    if (a.length !== b.length)
+        return false;
+    const key = (mark) => `${mark.type}:${JSON.stringify(mark.attrs ?? null)}`;
+    const left = a.map(key).sort();
+    const right = b.map(key).sort();
+    return left.every((value, index) => value === right[index]);
+}
+// ---------------------------------------------------------------------------
+// Document → markdown
+// ---------------------------------------------------------------------------
+/**
+ * The editor's document JSON as markdown, through `serializeMarkdown` — so the
+ * editor writes exactly the dialect `<wr-markdown>` renders.
+ *
+ * Underline has no markdown spelling and is dropped (in `markdown` format the
+ * schema does not carry it in the first place). Everything else the schema holds
+ * has a markdown form; what the serializer normalises is listed on
+ * `serializeMarkdown` itself.
+ */
+function jsonToMarkdown(doc) {
+    return serializeMarkdown(childrenToBlocks(doc));
+}
+function childrenToBlocks(node) {
+    return (node.content ?? []).flatMap(jsonToBlock);
+}
+function jsonToBlock(node) {
+    const attrs = node.attrs ?? {};
+    switch (node.type) {
+        case 'paragraph':
+            return [{ kind: 'paragraph', inlines: jsonToInlines(node.content ?? []) }];
+        case 'heading':
+            return [
+                {
+                    kind: 'heading',
+                    level: headingLevel(attrs['level']),
+                    inlines: jsonToInlines(node.content ?? []),
+                    id: '',
+                },
+            ];
+        case 'code_block':
+            return [
+                {
+                    kind: 'code',
+                    language: typeof attrs['language'] === 'string' ? attrs['language'] : null,
+                    code: (node.content ?? []).map(child => child.text ?? '').join(''),
+                    closed: true,
+                },
+            ];
+        case 'blockquote':
+            return [{ kind: 'quote', children: childrenToBlocks(node) }];
+        case 'bullet_list':
+        case 'ordered_list':
+            return [
+                {
+                    kind: 'list',
+                    ordered: node.type === 'ordered_list',
+                    start: node.type === 'ordered_list' && typeof attrs['order'] === 'number' ? attrs['order'] : 1,
+                    tight: attrs['tight'] !== false,
+                    items: (node.content ?? []).map(jsonToItem),
+                },
+            ];
+        case 'table':
+            return tableBlock(node);
+        case 'horizontal_rule':
+            return [{ kind: 'rule' }];
+        default:
+            return [];
+    }
+}
+function headingLevel(value) {
+    return value === 2 || value === 3 ? value : 1;
+}
+function jsonToItem(item) {
+    const content = item.content ?? [];
+    // The filler paragraph `itemToJson` put in front of a non-paragraph block.
+    const filler = content.length > 1 && content[0].type === 'paragraph' && !(content[0].content ?? []).length;
+    const checked = item.attrs?.['checked'];
+    return {
+        children: (filler ? content.slice(1) : content).flatMap(jsonToBlock),
+        checked: typeof checked === 'boolean' ? checked : null,
+    };
+}
+/**
+ * A table as markdown, every row as wide as the widest one.
+ *
+ * A markdown table is as wide as its header, and `serializeMarkdown` fits every
+ * row to it — but a document can hold a header narrower than the rows below it:
+ * a paste whose merged header came across one cell short, since `colspan` is not
+ * read. Fitted to that header, the cells past it were on screen and never saved.
+ * So the header grows empty cells instead, which markdown can carry.
+ */
+function tableBlock(table) {
+    const rows = (table.content ?? []).map(row => row.content ?? []);
+    const width = rows.reduce((widest, cells) => Math.max(widest, cells.length), 0);
+    const [first, ...body] = rows;
+    if (!first?.length)
+        return [];
+    const head = Array.from({ length: width }, (_, index) => first[index]);
+    const cellOf = (cell) => ({
+        // Markdown has one line per cell: a cell's paragraphs join with a space.
+        inlines: (cell?.content ?? []).flatMap((paragraph, index) => [
+            ...(index ? [{ kind: 'text', value: ' ' }] : []),
+            ...jsonToInlines(paragraph.content ?? []),
+        ]),
+    });
+    const align = head.map(cell => {
+        const value = cell?.attrs?.['align'];
+        return value === 'start' || value === 'center' || value === 'end' ? value : null;
+    });
+    return [
+        {
+            kind: 'table',
+            head: head.map(cellOf),
+            rows: body.map(cells => head.map((_, index) => cellOf(cells[index]))),
+            align,
+        },
+    ];
+}
+/**
+ * Leaves back into an inline tree, each wrapped in its own marks.
+ *
+ * Deliberately naive: `serializeMarkdown` flattens whatever tree it is given to
+ * the same leaves-with-mark-sets and regroups them in its one canonical nesting,
+ * so wrapping every leaf separately writes exactly what a hand-merged tree would.
+ */
+function jsonToInlines(nodes) {
+    return nodes.flatMap((node) => {
+        const marks = node.marks ?? [];
+        switch (node.type) {
+            case 'text': {
+                const code = marks.some(mark => mark.type === 'code');
+                const text = node.text ?? '';
+                return text ? [wrap(code ? { kind: 'code', value: text } : { kind: 'text', value: text }, marks)] : [];
+            }
+            case 'hard_break':
+                return [wrap({ kind: 'break' }, marks)];
+            case 'image': {
+                const attrs = node.attrs ?? {};
+                return [
+                    wrap({
+                        kind: 'image',
+                        src: stringOf(attrs['src']),
+                        alt: stringOf(attrs['alt']),
+                        title: typeof attrs['title'] === 'string' ? attrs['title'] : null,
+                    }, marks),
+                ];
+            }
+            default:
+                return [];
+        }
+    });
+}
+function stringOf(value) {
+    return typeof value === 'string' ? value : '';
+}
+// ---------------------------------------------------------------------------
+// Shared with the schema
+// ---------------------------------------------------------------------------
+/**
+ * A fence's info word: what markdown keeps, and nothing that could break out of
+ * it — or `null`. The one rule for a code block's language on every path in,
+ * which is why it lives here, where the markdown walker needs it without
+ * importing ProseMirror.
+ */
+function languageValue(raw) {
+    const word = (raw ?? '').trim().split(/\s+/)[0].toLowerCase();
+    return word && word.length <= 64 ? word : null;
+}
+function wrap(leaf, marks) {
+    let node = leaf;
+    for (const mark of marks) {
+        switch (mark.type) {
+            case 'strong':
+                node = { kind: 'strong', children: [node] };
+                break;
+            case 'em':
+                node = { kind: 'em', children: [node] };
+                break;
+            case 'strike':
+                node = { kind: 'del', children: [node] };
+                break;
+            case 'link': {
+                const attrs = mark.attrs ?? {};
+                node = {
+                    kind: 'link',
+                    href: stringOf(attrs['href']),
+                    title: typeof attrs['title'] === 'string' ? attrs['title'] : null,
+                    children: [node],
+                };
+                break;
+            }
+            // `code` is the leaf itself, and `underline` has no markdown form.
+        }
+    }
+    return node;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * How deep blockquotes and list items may nest: the deepest document markdown
+ * reads back with its structure. `parseMarkdown` parses twelve block levels and
+ * keeps whatever sits at the twelfth as literal text, so the CONTENT of a twelfth
+ * quote or item would come back flattened — a heading in there reads back as a
+ * paragraph saying `## …`. Each quote and each list item is one level, as it is
+ * there.
+ */
+const MAX_NESTING = 11;
+/** The `align` values a table cell may carry — `ngwr/markdown`'s own vocabulary. */
+const ALIGNS = new Set([null, 'start', 'center', 'end']);
+/** The largest ordinal the markdown parser reads back (`\d{1,9}`). */
+const MAX_ORDER = 999999999;
+/**
+ * The one URL policy of all three formats, as a schema rule.
+ *
+ * `safeMarkdownUrl` is what `parseMarkdown` already applies, so the markdown path
+ * never produces a refused URL. The HTML path asks it in `getAttrs`, where a
+ * refusal drops the link and keeps its text. And the JSON path — plus every
+ * attribute ProseMirror validates since view 1.42.3, clipboard slice context
+ * included — hits these validators, which THROW: a JSON value holding a refused
+ * URL is refused as a whole, the same as one holding an unknown node.
+ */
+function requireUrl(kind) {
+    return (value) => {
+        if (typeof value !== 'string' || safeMarkdownUrl(value, kind) !== value) {
+            throw new RangeError(`<wr-editor>: refused ${kind} URL`);
+        }
+    };
+}
+function nullableString(value) {
+    if (value !== null && typeof value !== 'string')
+        throw new RangeError('<wr-editor>: expected a string or null');
+}
+/**
+ * The attributes of an `<a>` a pasted or bound document may keep: the href, and
+ * only when the policy allows it. `false` drops the mark and keeps the text —
+ * which is why this refuses rather than rewrites.
+ */
+function linkAttrs(dom) {
+    const href = safeMarkdownUrl(dom.getAttribute('href') ?? '', 'link');
+    return href ? { href, title: dom.getAttribute('title') } : false;
+}
+function imageAttrs(dom) {
+    const src = safeMarkdownUrl(dom.getAttribute('src') ?? '', 'image');
+    return src ? { src, alt: dom.getAttribute('alt') ?? '', title: dom.getAttribute('title') } : false;
+}
+/**
+ * A list item's task state, from this schema's own `data-checked` or from the
+ * `<input type="checkbox">` GitHub-style renderers put first in the item.
+ */
+function checkedOf(dom) {
+    const data = dom.getAttribute('data-checked');
+    if (data === 'true' || data === 'false')
+        return data === 'true';
+    for (let child = dom.firstChild; child; child = child.nextSibling) {
+        if (child.nodeType === 3 && !(child.textContent ?? '').trim())
+            continue;
+        if (child.nodeName !== 'INPUT')
+            return null;
+        const input = child;
+        return (input.getAttribute('type') ?? '').toLowerCase() === 'checkbox' ? input.hasAttribute('checked') : null;
+    }
+    return null;
+}
+function alignOf(dom) {
+    // The first one that says anything: an element with no inline style reports
+    // `''` for it, not null, so a nullish fallback would stop there.
+    const raw = [dom.getAttribute('data-align'), dom.style?.textAlign, dom.getAttribute('align')].find(Boolean) ?? '';
+    const word = raw.toLowerCase();
+    if (word === 'center')
+        return 'center';
+    if (word === 'start' || word === 'left')
+        return 'start';
+    if (word === 'end' || word === 'right')
+        return 'end';
+    return null;
+}
+function languageOf(dom) {
+    const code = dom.querySelector('code');
+    const named = dom.getAttribute('data-language') ?? code?.getAttribute('data-language');
+    const fromClass = /(?:^|\s)language-(\S+)/.exec(code?.getAttribute('class') ?? '')?.[1];
+    return languageValue(named ?? fromClass ?? null);
+}
+function orderOf(dom) {
+    const start = Number.parseInt(dom.getAttribute('start') ?? '', 10);
+    return Number.isFinite(start) ? Math.min(Math.max(start, 0), MAX_ORDER) : 1;
+}
+const nodes = {
+    doc: { content: 'block+' },
+    paragraph: {
+        group: 'block',
+        content: 'inline*',
+        parseDOM: [{ tag: 'p' }],
+        toDOM: () => ['p', 0],
+    },
+    heading: {
+        group: 'block',
+        content: 'inline*',
+        defining: true,
+        attrs: {
+            level: {
+                default: 1,
+                // A FUNCTION, not `'number'`: the level becomes a tag name in `toDOM`,
+                // and a type check alone accepts `{ level: 9 }`.
+                validate: (value) => {
+                    if (value !== 1 && value !== 2 && value !== 3)
+                        throw new RangeError('<wr-editor>: heading level is 1–3');
+                },
+            },
+        },
+        // h4–h6 clamp to h3 rather than falling through to a paragraph, which would
+        // lose the fact that the line was a heading at all.
+        parseDOM: [
+            { tag: 'h1', attrs: { level: 1 } },
+            { tag: 'h2', attrs: { level: 2 } },
+            { tag: 'h3', attrs: { level: 3 } },
+            { tag: 'h4', attrs: { level: 3 } },
+            { tag: 'h5', attrs: { level: 3 } },
+            { tag: 'h6', attrs: { level: 3 } },
+        ],
+        toDOM: node => [`h${Math.min(Math.max(Number(node.attrs['level']) || 1, 1), 3)}`, 0],
+    },
+    blockquote: {
+        group: 'block',
+        content: 'block+',
+        defining: true,
+        parseDOM: [{ tag: 'blockquote' }],
+        toDOM: () => ['blockquote', 0],
+    },
+    code_block: {
+        group: 'block',
+        content: 'text*',
+        marks: '',
+        code: true,
+        defining: true,
+        attrs: {
+            language: {
+                default: null,
+                validate: (value) => {
+                    if (value !== null && (typeof value !== 'string' || languageValue(value) !== value)) {
+                        throw new RangeError('<wr-editor>: a code language is one lowercase word');
+                    }
+                },
+            },
+        },
+        parseDOM: [{ tag: 'pre', preserveWhitespace: 'full', getAttrs: dom => ({ language: languageOf(dom) }) }],
+        toDOM: node => {
+            const language = node.attrs['language'];
+            return ['pre', ['code', language ? { class: `language-${language}`, 'data-language': language } : {}, 0]];
+        },
+    },
+    horizontal_rule: {
+        group: 'block',
+        parseDOM: [{ tag: 'hr' }],
+        toDOM: () => ['hr'],
+    },
+    bullet_list: {
+        group: 'block',
+        content: 'list_item+',
+        attrs: { tight: { default: true, validate: 'boolean' } },
+        parseDOM: [{ tag: 'ul' }],
+        toDOM: () => ['ul', 0],
+    },
+    ordered_list: {
+        group: 'block',
+        content: 'list_item+',
+        attrs: {
+            order: {
+                default: 1,
+                validate: (value) => {
+                    if (!Number.isInteger(value) || value < 0 || value > MAX_ORDER) {
+                        throw new RangeError('<wr-editor>: a list starts at a whole number');
+                    }
+                },
+            },
+            tight: { default: true, validate: 'boolean' },
+        },
+        parseDOM: [{ tag: 'ol', getAttrs: dom => ({ order: orderOf(dom) }) }],
+        toDOM: node => (node.attrs['order'] === 1 ? ['ol', 0] : ['ol', { start: String(node.attrs['order']) }, 0]),
+    },
+    list_item: {
+        content: 'paragraph block*',
+        defining: true,
+        attrs: {
+            checked: {
+                default: null,
+                validate: (value) => {
+                    if (value !== null && typeof value !== 'boolean')
+                        throw new RangeError('<wr-editor>: checked is a boolean');
+                },
+            },
+        },
+        parseDOM: [{ tag: 'li', getAttrs: dom => ({ checked: checkedOf(dom) }) }],
+        toDOM: node => {
+            const checked = node.attrs['checked'];
+            return checked === null ? ['li', 0] : ['li', { 'data-checked': String(checked) }, 0];
+        },
+    },
+    table: {
+        group: 'block',
+        content: 'table_row+',
+        isolating: true,
+        parseDOM: [{ tag: 'table' }],
+        toDOM: () => ['table', ['tbody', 0]],
+    },
+    table_row: {
+        content: '(table_header | table_cell)+',
+        parseDOM: [{ tag: 'tr' }],
+        toDOM: () => ['tr', 0],
+    },
+    table_header: cell('th'),
+    table_cell: cell('td'),
+    text: { group: 'inline' },
+    image: {
+        group: 'inline',
+        inline: true,
+        draggable: true,
+        attrs: {
+            src: { validate: requireUrl('image') },
+            alt: { default: '', validate: 'string' },
+            title: { default: null, validate: nullableString },
+        },
+        parseDOM: [{ tag: 'img[src]', getAttrs: imageAttrs }],
+        toDOM: node => {
+            // Re-asked here: validators do not run on `type.create()`, so a node built
+            // in code never passed through them.
+            const src = safeMarkdownUrl(String(node.attrs['src'] ?? ''), 'image');
+            const title = node.attrs['title'];
+            return ['img', { src: src ?? '', alt: String(node.attrs['alt'] ?? ''), ...(title ? { title } : {}) }];
+        },
+    },
+    hard_break: {
+        group: 'inline',
+        inline: true,
+        selectable: false,
+        linebreakReplacement: true,
+        parseDOM: [{ tag: 'br' }],
+        toDOM: () => ['br'],
+    },
+};
+function cell(tag) {
+    return {
+        content: 'paragraph+',
+        isolating: true,
+        attrs: {
+            align: {
+                default: null,
+                validate: (value) => {
+                    if (!ALIGNS.has(value))
+                        throw new RangeError('<wr-editor>: align is start, center or end');
+                },
+            },
+        },
+        parseDOM: [{ tag, getAttrs: dom => ({ align: alignOf(dom) }) }],
+        // The value is one of three words — checked by the validator, and again
+        // here — so writing it into `style` cannot carry anything the input chose.
+        toDOM: node => {
+            const align = node.attrs['align'];
+            return ALIGNS.has(align) && align ? [tag, { style: `text-align: ${align}` }, 0] : [tag, 0];
+        },
+    };
+}
+/**
+ * Marks in nesting order, outermost first — which is also how `toDOM` nests
+ * them in the HTML this writes.
+ */
+function marks(underline) {
+    return {
+        link: {
+            inclusive: false,
+            attrs: {
+                href: { validate: requireUrl('link') },
+                title: { default: null, validate: nullableString },
+            },
+            parseDOM: [{ tag: 'a[href]', getAttrs: linkAttrs }],
+            toDOM: (mark) => {
+                const href = safeMarkdownUrl(String(mark.attrs['href'] ?? ''), 'link');
+                if (!href)
+                    return ['span', 0];
+                const title = mark.attrs['title'];
+                return ['a', { href, ...(title ? { title } : {}), rel: 'noopener noreferrer nofollow' }, 0];
+            },
+        },
+        strong: {
+            parseDOM: [
+                { tag: 'strong' },
+                // Google Docs wraps a whole paste in `<b style="font-weight: normal">`.
+                { tag: 'b', getAttrs: dom => dom.style.fontWeight !== 'normal' && null },
+                { style: 'font-weight=400', clearMark: mark => mark.type.name === 'strong' },
+                { style: 'font-weight', getAttrs: value => /^(bold(er)?|[5-9]\d{2,})$/.test(value) && null },
+            ],
+            toDOM: () => ['strong', 0],
+        },
+        em: {
+            parseDOM: [
+                { tag: 'i' },
+                { tag: 'em' },
+                { style: 'font-style=italic' },
+                { style: 'font-style=normal', clearMark: mark => mark.type.name === 'em' },
+            ],
+            toDOM: () => ['em', 0],
+        },
+        ...(underline
+            ? {
+                underline: {
+                    parseDOM: [
+                        { tag: 'u' },
+                        { style: 'text-decoration=underline' },
+                        { style: 'text-decoration-line=underline' },
+                    ],
+                    toDOM: () => ['u', 0],
+                },
+            }
+            : {}),
+        strike: {
+            parseDOM: [
+                { tag: 's' },
+                { tag: 'del' },
+                { tag: 'strike' },
+                { style: 'text-decoration=line-through' },
+                { style: 'text-decoration-line=line-through' },
+            ],
+            toDOM: () => ['s', 0],
+        },
+        code: {
+            code: true,
+            parseDOM: [{ tag: 'code' }],
+            toDOM: () => ['code', 0],
+        },
+    };
+}
+let full = null;
+let markdown = null;
+/**
+ * The schema for a format, built on first use and shared after that.
+ *
+ * Markdown gets its own, one mark short: it has no underline, and a mark the
+ * value cannot carry would paint on screen and vanish on save — from a paste,
+ * where no toolbar button could have kept it out.
+ */
+function editorSchema(format) {
+    if (format === 'markdown')
+        return (markdown ??= new Schema({ nodes, marks: marks(false) }));
+    return (full ??= new Schema({ nodes, marks: marks(true) }));
+}
+/** How many blockquotes and list items deep the document's deepest block sits. */
+function nestingOf(doc) {
+    let deepest = 0;
+    const walk = (node, depth) => {
+        node.forEach(child => {
+            if (child.isTextblock || child.isLeaf)
+                return;
+            const next = child.type.name === 'blockquote' || child.type.name === 'list_item' ? depth + 1 : depth;
+            if (next > deepest)
+                deepest = next;
+            walk(child, next);
+        });
+    };
+    walk(doc, 0);
+    return deepest;
+}
+/**
+ * A document that is one empty textblock — the shape the placeholder is drawn
+ * on. Which textblock is open: an empty heading shows the hint as well.
+ *
+ * Not the test for "nothing written"; that is {@link isBlankDoc}.
+ */
+function isEmptyDoc(doc) {
+    if (doc.childCount !== 1)
+        return false;
+    const only = doc.firstChild;
+    return only.isTextblock && only.childCount === 0;
+}
+/**
+ * A document with nothing written in it: no text but whitespace, and no leaf
+ * but line breaks. An image or a rule is content in its own right; structure
+ * alone is not.
+ *
+ * Decided by content rather than by shape, because every one of these looks
+ * empty and markdown already wrote them as `''`: Enter on an empty editor (two
+ * empty paragraphs), a lone Shift-Enter, a few spaces, and a list, a quote or a
+ * heading chosen on an empty editor. Written as anything else, `required()`
+ * passed in `html` and `json` over an editor with nothing in it.
+ */
+function isBlankDoc(doc) {
+    let written = false;
+    doc.descendants(node => {
+        if (node.isText ? /\S/.test(node.text) : node.isLeaf && node.type.name !== 'hard_break')
+            written = true;
+        return !written;
+    });
+    return !written;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * The three formats meeting in one place. JSON is the pivot: markdown is walked
+ * into it, HTML is parsed by the schema's own rules, and a bound JSON value is
+ * validated like any other untrusted input.
+ */
+/**
+ * A bound value as a document in `schema`, or a thrown error naming why it was
+ * refused. `null`, `undefined` and `''` are the empty document in every format.
+ *
+ * Throwing is the whole contract: the caller keeps the document it already has,
+ * which is the rule `wr-input-number` and `wr-date-picker` follow for input they
+ * cannot read. Nothing here ever returns a "repaired" document to write back.
+ */
+function readValue(value, format, schema, document) {
+    if (value === null || value === undefined || value === '')
+        return schema.topNodeType.createAndFill();
+    switch (format) {
+        case 'json':
+            if (typeof value === 'string')
+                throw new RangeError('<wr-editor>: `format="json"` takes an object, not a string');
+            return readJson(value, schema);
+        case 'markdown':
+            if (typeof value !== 'string')
+                throw new RangeError('<wr-editor>: `format="markdown"` takes a string');
+            return readJson(markdownToJson(value), schema);
+        case 'html':
+            if (typeof value !== 'string')
+                throw new RangeError('<wr-editor>: `format="html"` takes a string');
+            return readHtml(value, document, schema);
+    }
+}
+/**
+ * A document in the bound format — `''` or `null` when nothing is written in it,
+ * the same in all three: see {@link isBlankDoc}.
+ */
+function writeValue(doc, format, document) {
+    if (isBlankDoc(doc))
+        return format === 'json' ? null : '';
+    switch (format) {
+        case 'json':
+            return doc.toJSON();
+        case 'markdown':
+            return jsonToMarkdown(doc.toJSON());
+        case 'html':
+            return writeHtml(doc, document);
+    }
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * The keyboard half of each tool — the keymap below binds exactly these, so a
+ * hint can never name a shortcut that does nothing.
+ *
+ * Where a convention exists it is followed: Google Docs for the block types
+ * (Mod-Alt-0…3, Mod-Shift-7/8), and Tiptap / Notion for the three it does not
+ * cover (Mod-Shift-S strikethrough, Mod-E inline code, Mod-Shift-B quote,
+ * Mod-Alt-C code block). The horizontal rule has none. Tab is deliberately not
+ * bound — indenting with it would be a keyboard trap (WCAG 2.1.2), so list items
+ * move with Mod-] and Mod-[ — and neither is Escape, which `<wr-dialog>` needs.
+ *
+ * Where a layout types `[` and `]` with AltGr or Option (German, French, the
+ * Nordic and Polish layouts), the bracket chords are also read with that Alt
+ * held — see {@link bracketKeys} — since nothing else indents a list item. The
+ * Mod-Alt chords are NOT widened the same way: on Windows, Ctrl+Alt is AltGr, and
+ * on those layouts AltGr+0 types `}` and AltGr+C types `ć`. Taking the chord by
+ * physical key would make those characters impossible to type in the editor, so
+ * there the key types its character and the toolbar sets the block type.
+ */
+const SHORTCUTS = {
+    bold: { key: 'B' },
+    italic: { key: 'I' },
+    underline: { key: 'U' },
+    strike: { key: 'S', shift: true },
+    code: { key: 'E' },
+    paragraph: { key: '0', alt: true },
+    heading1: { key: '1', alt: true },
+    heading2: { key: '2', alt: true },
+    heading3: { key: '3', alt: true },
+    bulletList: { key: '8', shift: true },
+    orderedList: { key: '7', shift: true },
+    blockquote: { key: 'B', shift: true },
+    codeBlock: { key: 'C', alt: true },
+    link: { key: 'K' },
+    undo: { key: 'Z' },
+    redo: { key: 'Z', shift: true },
+};
+/**
+ * The tools a click toggles — the ones that carry `aria-pressed`. Not `link`,
+ * which opens a panel: a popup button that also claimed to be pressed would say
+ * two contradictory things.
+ */
+const TOGGLES = new Set([
+    'bold',
+    'italic',
+    'underline',
+    'strike',
+    'code',
+    'paragraph',
+    'heading1',
+    'heading2',
+    'heading3',
+    'bulletList',
+    'orderedList',
+    'blockquote',
+    'codeBlock',
+]);
+// ---------------------------------------------------------------------------
+// State
+// ---------------------------------------------------------------------------
+function markActive(state, type) {
+    if (!type)
+        return false;
+    const { empty, from, to, $from } = state.selection;
+    if (empty)
+        return !!type.isInSet(state.storedMarks ?? $from.marks());
+    return state.doc.rangeHasMark(from, to, type);
+}
+/**
+ * Whether every textblock the selection touches is `type` — asked of the blocks
+ * themselves rather than of `$from.parent`, which is the DOCUMENT under a
+ * select-all.
+ */
+function parentIs(state, type, attrs) {
+    const { empty, from, to, $from } = state.selection;
+    if (empty)
+        return $from.parent.hasMarkup(type, attrs);
+    let found = false;
+    let all = true;
+    state.doc.nodesBetween(from, to, node => {
+        if (!node.isTextblock)
+            return true;
+        found = true;
+        if (!node.hasMarkup(type, attrs))
+            all = false;
+        return false;
+    });
+    return found && all;
+}
+/** The nearest list around the selection, with the position it starts at. */
+function nearestList(state) {
+    const { $from } = state.selection;
+    for (let depth = $from.depth; depth > 0; depth--) {
+        const node = $from.node(depth);
+        if (node.type.name === 'bullet_list' || node.type.name === 'ordered_list') {
+            return { type: node.type, pos: $from.before(depth) };
+        }
+    }
+    return null;
+}
+function insideNode(state, type) {
+    const { $from } = state.selection;
+    for (let depth = $from.depth; depth > 0; depth--)
+        if ($from.node(depth).type === type)
+            return true;
+    return false;
+}
+/** Whether a tool's state is "on" at the selection — what `aria-pressed` reports. */
+function toolActive(tool, state) {
+    const { marks, nodes } = state.schema;
+    switch (tool) {
+        case 'bold':
+            return markActive(state, marks['strong']);
+        case 'italic':
+            return markActive(state, marks['em']);
+        case 'underline':
+            return markActive(state, marks['underline']);
+        case 'strike':
+            return markActive(state, marks['strike']);
+        case 'code':
+            return markActive(state, marks['code']);
+        case 'link':
+            return linkRange(state) !== null;
+        case 'paragraph':
+            return parentIs(state, nodes['paragraph']);
+        case 'heading1':
+            return parentIs(state, nodes['heading'], { level: 1 });
+        case 'heading2':
+            return parentIs(state, nodes['heading'], { level: 2 });
+        case 'heading3':
+            return parentIs(state, nodes['heading'], { level: 3 });
+        case 'codeBlock':
+            return parentIs(state, nodes['code_block']);
+        case 'bulletList':
+            return nearestList(state)?.type === nodes['bullet_list'];
+        case 'orderedList':
+            return nearestList(state)?.type === nodes['ordered_list'];
+        case 'blockquote':
+            return insideNode(state, nodes['blockquote']);
+        default:
+            return false;
+    }
+}
+// ---------------------------------------------------------------------------
+// Commands
+// ---------------------------------------------------------------------------
+/** What a tool does, or `null` for one the schema cannot carry (underline in markdown). */
+function toolCommand(tool, schema) {
+    const { marks, nodes } = schema;
+    const mark = (type) => (type ? toggleMark(type) : null);
+    const heading = (level) => toggleBlock(nodes['heading'], nodes['paragraph'], { level });
+    switch (tool) {
+        case 'bold':
+            return mark(marks['strong']);
+        case 'italic':
+            return mark(marks['em']);
+        case 'underline':
+            return mark(marks['underline']);
+        case 'strike':
+            return mark(marks['strike']);
+        case 'code':
+            return mark(marks['code']);
+        // The link tool opens a panel; `setLink` is its command.
+        case 'link':
+            return toggleMark(marks['link'], { href: '#' });
+        case 'paragraph':
+            return setBlockType(nodes['paragraph']);
+        case 'heading1':
+            return heading(1);
+        case 'heading2':
+            return heading(2);
+        case 'heading3':
+            return heading(3);
+        case 'codeBlock':
+            return toggleBlock(nodes['code_block'], nodes['paragraph']);
+        case 'bulletList':
+            return toggleList(nodes['bullet_list'], nodes['list_item']);
+        case 'orderedList':
+            return toggleList(nodes['ordered_list'], nodes['list_item']);
+        case 'blockquote':
+            return toggleQuote(nodes['blockquote']);
+        case 'horizontalRule':
+            return insertRule(nodes['horizontal_rule']);
+        case 'undo':
+            return undo;
+        case 'redo':
+            return redo;
+    }
+}
+/** A block type that switches back to a paragraph when it is already on. */
+function toggleBlock(type, paragraph, attrs) {
+    return (state, dispatch) => parentIs(state, type, attrs)
+        ? setBlockType(paragraph)(state, dispatch)
+        : setBlockType(type, attrs)(state, dispatch);
+}
+/**
+ * A list toggle: out of this kind of list, over to it from the other kind, or
+ * into a new one.
+ */
+function toggleList(type, item) {
+    return (state, dispatch) => {
+        const list = nearestList(state);
+        if (!list)
+            return wrapInList(type)(state, dispatch);
+        if (list.type === type)
+            return liftListItem(item)(state, dispatch);
+        if (dispatch) {
+            const tight = state.doc.nodeAt(list.pos)?.attrs['tight'] !== false;
+            const attrs = type.name === 'ordered_list' ? { order: 1, tight } : { tight };
+            dispatch(state.tr.setNodeMarkup(list.pos, type, attrs).scrollIntoView());
+        }
+        return true;
+    };
+}
+/**
+ * Into a quote, or out of the nearest one.
+ *
+ * Out is a hand-rolled lift rather than `prosemirror-commands`' `lift`, which
+ * lifts out of whatever the selection's parent is — inside a quoted list that is
+ * the list item, not the quote. The target depth is the quote's own parent; a
+ * lift that does not fit there throws, and the throw is the "cannot".
+ */
+function toggleQuote(quote) {
+    return (state, dispatch) => {
+        const { $from, $to } = state.selection;
+        const range = insideNode(state, quote) ? $from.blockRange($to, node => node.type === quote) : null;
+        if (!range)
+            return wrapIn(quote)(state, dispatch);
+        try {
+            const tr = state.tr.lift(range, range.depth - 1);
+            if (dispatch)
+                dispatch(tr.scrollIntoView());
+            return true;
+        }
+        catch {
+            return false;
+        }
+    };
+}
+/**
+ * A horizontal rule at the selection, where one fits without leaving an
+ * isolating node — a table cell holds paragraphs only, and splitting the table
+ * around a rule is not what anyone clicking the button meant.
+ */
+function insertRule(rule) {
+    return (state, dispatch) => {
+        const { $from } = state.selection;
+        let fits = false;
+        for (let depth = $from.depth; depth >= 0; depth--) {
+            const node = $from.node(depth);
+            const index = $from.index(depth);
+            if (node.canReplaceWith(index, index, rule)) {
+                fits = true;
+                break;
+            }
+            if (node.type.spec.isolating)
+                break;
+        }
+        if (!fits)
+            return false;
+        if (dispatch)
+            dispatch(state.tr.replaceSelectionWith(rule.create()).scrollIntoView());
+        return true;
+    };
+}
+// ---------------------------------------------------------------------------
+// Tables
+// ---------------------------------------------------------------------------
+/** The table around the selection, as a depth of `$from`, or `-1`. */
+function tableDepth(state) {
+    const { $from } = state.selection;
+    for (let depth = $from.depth; depth > 0; depth--)
+        if ($from.node(depth).type.name === 'table')
+            return depth;
+    return -1;
+}
+/**
+ * An empty paragraph beside the table at `depth`, with the caret in it — the one
+ * way to a line the keyboard cannot otherwise reach. There is no gap cursor here,
+ * and a cell holds paragraphs, so Enter only ever splits inside it.
+ */
+function paragraphBeside(state, depth, side, dispatch) {
+    const { $from } = state.selection;
+    const paragraph = state.schema.nodes['paragraph'];
+    const parent = $from.node(depth - 1);
+    const index = $from.index(depth - 1) + (side === 'after' ? 1 : 0);
+    if (!parent.canReplaceWith(index, index, paragraph))
+        return false;
+    if (dispatch) {
+        const pos = side === 'after' ? $from.after(depth) : $from.before(depth);
+        const tr = state.tr.insert(pos, paragraph.create());
+        dispatch(tr.setSelection(TextSelection.create(tr.doc, pos + 1)).scrollIntoView());
+    }
+    return true;
+}
+/** Mod-Enter in a table: out of it, onto a new line below — what `exitCode` does for a code block. */
+const exitTable = (state, dispatch) => {
+    const depth = tableDepth(state);
+    return depth > 0 && paragraphBeside(state, depth, 'after', dispatch);
+};
+/**
+ * The arrow key off the edge of a table nothing can be reached past: ArrowDown on
+ * the last line of its last row with no text anywhere after it, ArrowUp on the
+ * first line of its first row with none before. Anywhere else the key moves the
+ * caret as it always does. Up and down only — left and right swap ends under
+ * `dir="rtl"`, and the vertical pair means the same thing in both directions.
+ */
+function leaveTable(side) {
+    return (state, dispatch, view) => {
+        if (view && !view.editable)
+            return false;
+        const depth = tableDepth(state);
+        const { $from, empty } = state.selection;
+        if (depth < 0 || !empty)
+            return false;
+        // table > row > cell > paragraph: the row's place in the table, and the
+        // paragraph's in its cell.
+        const table = $from.node(depth);
+        const cell = $from.node(depth + 2);
+        const row = $from.index(depth);
+        const block = $from.index(depth + 2);
+        const edge = side === 'after' ? row === table.childCount - 1 && block === cell.childCount - 1 : row === 0 && block === 0;
+        if (!edge)
+            return false;
+        const onEdgeLine = view
+            ? view.endOfTextblock(side === 'after' ? 'down' : 'up')
+            : $from.parentOffset === (side === 'after' ? $from.parent.content.size : 0);
+        if (!onEdgeLine)
+            return false;
+        const outside = state.doc.resolve(side === 'after' ? $from.after(depth) : $from.before(depth));
+        if (TextSelection.findFrom(outside, side === 'after' ? 1 : -1, true))
+            return false;
+        return paragraphBeside(state, depth, side, dispatch);
+    };
+}
+function insertHardBreak(state, dispatch) {
+    const type = state.schema.nodes['hard_break'];
+    const { $from } = state.selection;
+    if (!$from.parent.canReplaceWith($from.index(), $from.index(), type))
+        return false;
+    if (dispatch)
+        dispatch(state.tr.replaceSelectionWith(type.create()).scrollIntoView());
+    return true;
+}
+// ---------------------------------------------------------------------------
+// Links
+// ---------------------------------------------------------------------------
+/**
+ * The run of text carrying one link around the selection — the whole link, when
+ * the caret merely sits in it — or `null` when there is none.
+ */
+function linkRange(state) {
+    const type = state.schema.marks['link'];
+    const { empty, from, to, $from } = state.selection;
+    if (!empty) {
+        let found = null;
+        state.doc.nodesBetween(from, to, node => {
+            found ??= type.isInSet(node.marks) ?? null;
+        });
+        return found ? { from, to, mark: found } : null;
+    }
+    return markAround($from, type);
+}
+function markAround($pos, type) {
+    const parent = $pos.parent;
+    const start = $pos.start();
+    const offsets = [];
+    parent.forEach((_child, offset) => offsets.push(offset));
+    // The child the caret is in — or, at a boundary, the one before it and then
+    // the one after, since a non-inclusive mark does not report itself at its end.
+    const index = $pos.index();
+    const candidates = ($pos.textOffset > 0 ? [index] : [index - 1, index]).filter(i => i >= 0 && i < parent.childCount);
+    for (const at of candidates) {
+        const mark = type.isInSet(parent.child(at).marks);
+        if (!mark)
+            continue;
+        let first = at;
+        let last = at;
+        while (first > 0 && mark.isInSet(parent.child(first - 1).marks))
+            first--;
+        while (last < parent.childCount - 1 && mark.isInSet(parent.child(last + 1).marks))
+            last++;
+        return { from: start + offsets[first], to: start + offsets[last] + parent.child(last).nodeSize, mark };
+    }
+    return null;
+}
+/**
+ * Link the selection to `href` — replacing the link it sits in when the caret
+ * is inside one, and inserting the address as its own text when nothing is
+ * selected at all. `href` has already passed the URL policy.
+ */
+function setLink(href) {
+    return (state, dispatch) => {
+        const type = state.schema.marks['link'];
+        const { empty, from, to } = state.selection;
+        const existing = linkRange(state);
+        const title = existing?.mark.attrs['title'] ?? null;
+        const mark = type.create({ href, title });
+        if (!toggleMark(type, { href })(state))
+            return false;
+        if (!dispatch)
+            return true;
+        const tr = state.tr;
+        if (!empty)
+            tr.removeMark(from, to, type).addMark(from, to, mark);
+        else if (existing)
+            tr.removeMark(existing.from, existing.to, type).addMark(existing.from, existing.to, mark);
+        else
+            tr.insertText(href, from).addMark(from, from + href.length, mark);
+        dispatch(tr.scrollIntoView());
+        return true;
+    };
+}
+/** Remove the link the selection is in or covers. */
+const removeLink = (state, dispatch) => {
+    const range = linkRange(state);
+    if (!range)
+        return false;
+    if (dispatch)
+        dispatch(state.tr.removeMark(range.from, range.to, state.schema.marks['link']).scrollIntoView());
+    return true;
+};
+// ---------------------------------------------------------------------------
+// Plugins
+// ---------------------------------------------------------------------------
+/**
+ * The editor's plugin stack, in precedence order: its own keys, history keys,
+ * ProseMirror's base keymap, then history and the markdown-style input rules.
+ *
+ * `canEdit` is asked for every document-changing transaction, because
+ * `view.dispatch()` does not consult `editable` — a toolbar click or a plugin
+ * would otherwise change a read-only document. Outside writes never pass here:
+ * they replace the state wholesale.
+ *
+ * The input rules are the block shortcuts only. The typographic ones (smart
+ * quotes, the em dash, the ellipsis) are left out on purpose: in a form control
+ * they silently rewrite what someone typed into a name, a code or a reference.
+ */
+function editorPlugins(schema, options) {
+    const { nodes } = schema;
+    const keys = {};
+    const bind = (combo, command) => {
+        if (!command)
+            return;
+        keys[combo] = command;
+        // `event.key` is upper case under Shift or Caps Lock, and ProseMirror
+        // matches on it; bound twice, the way `prosemirror-example-setup` does.
+        const last = combo.slice(combo.lastIndexOf('-') + 1);
+        if (/^[a-z]$/.test(last))
+            keys[combo.slice(0, -1) + last.toUpperCase()] = command;
+    };
+    for (const [tool, shortcut] of Object.entries(SHORTCUTS)) {
+        if (tool === 'link' || tool === 'undo' || tool === 'redo')
+            continue;
+        bind(comboOf(shortcut), toolCommand(tool, schema));
+    }
+    bind('Mod-z', undo);
+    bind('Mod-Shift-z', redo);
+    if (!options.apple)
+        bind('Mod-y', redo);
+    keys['Shift-Enter'] = chainCommands(exitCode, insertHardBreak);
+    keys['Mod-Enter'] = chainCommands(exitCode, exitTable);
+    keys['Enter'] = splitListItem(nodes['list_item']);
+    keys['Mod-['] = liftListItem(nodes['list_item']);
+    keys['Mod-]'] = sinkListItem(nodes['list_item']);
+    keys['ArrowDown'] = leaveTable('after');
+    keys['ArrowUp'] = leaveTable('before');
+    keys['Backspace'] = undoInputRule;
+    return [
+        new Plugin({
+            filterTransaction: (tr, state) => {
+                if (!tr.docChanged)
+                    return true;
+                if (!options.canEdit())
+                    return false;
+                // `MAX_NESTING` is the deepest markdown reads back with its structure. A
+                // document that already nests deeper (a bound HTML or JSON value) is kept
+                // as it is; what is refused is an edit that makes it deeper still.
+                const depth = nestingOf(tr.doc);
+                return depth <= MAX_NESTING || depth <= nestingOf(state.doc);
+            },
+        }),
+        bracketKeys(nodes['list_item'], options.apple),
+        keymap(keys),
+        keymap(baseKeymap),
+        history(),
+        inputRules({
+            rules: [
+                textblockTypeInputRule(/^(#{1,3})\s$/, nodes['heading'], match => ({ level: match[1].length })),
+                wrappingInputRule(/^\s*>\s$/, nodes['blockquote']),
+                wrappingInputRule(/^\s*([-+*])\s$/, nodes['bullet_list']),
+                wrappingInputRule(/^(\d{1,9})\.\s$/, nodes['ordered_list'], match => ({ order: Number(match[1]) }), (match, node) => node.childCount + node.attrs['order'] === Number(match[1])),
+                textblockTypeInputRule(/^```$/, nodes['code_block']),
+            ],
+        }),
+    ];
+}
+/**
+ * Mod-] and Mod-[ as they are TYPED on a layout that needs AltGr or Option for a
+ * bracket: Windows German reports AltGr+8 as Ctrl+Alt with `key` `[`, macOS
+ * German reports Option+5 under ⌘ as ⌘+Alt with `key` `[`. The keymap matches on
+ * the full modifier set, so neither reaches `Mod-[`, and indenting a list item has
+ * no other path — Tab is not bound and the toolbar has no indent tool.
+ *
+ * Matched on the character, never on `event.code`: the physical key at `]` is `+`
+ * on a German keyboard, and Ctrl and `+` is the browser's zoom.
+ */
+function bracketKeys(item, apple) {
+    const lift = liftListItem(item);
+    const sink = sinkListItem(item);
+    return new Plugin({
+        props: {
+            handleKeyDown: (view, event) => {
+                if (!event.altKey || event.shiftKey || (event.key !== '[' && event.key !== ']'))
+                    return false;
+                const mod = apple ? event.metaKey && !event.ctrlKey : event.ctrlKey && !event.metaKey;
+                return mod && (event.key === ']' ? sink : lift)(view.state, view.dispatch);
+            },
+        },
+    });
+}
+/** A shortcut in ProseMirror's key-name syntax. */
+function comboOf(shortcut) {
+    return `Mod-${shortcut.alt ? 'Alt-' : ''}${shortcut.shift ? 'Shift-' : ''}${shortcut.key.toLowerCase()}`;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Toolbar glyphs as path data, drawn inline so the editor needs no
+ * `provideWrIcons()` — the same reason `<wr-textarea>` inlines its grip.
+ *
+ * Lucide's (ISC), on its 24-unit grid with a 2-unit stroke; `line` elements are
+ * rewritten as the equivalent paths so one `<path>` loop draws every icon.
+ */
+const TOOL_ICONS = {
+    bold: ['M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8'],
+    italic: ['M19 4h-9', 'M14 20H5', 'M15 4 9 20'],
+    underline: ['M6 4v6a6 6 0 0 0 12 0V4', 'M4 20h16'],
+    strike: ['M16 4H9a3 3 0 0 0-2.83 4', 'M14 12a4 4 0 0 1 0 8H6', 'M4 12h16'],
+    code: ['m16 18 6-6-6-6', 'm8 6-6 6 6 6'],
+    paragraph: ['M13 4v16', 'M17 4v16', 'M19 4H9.5a4.5 4.5 0 0 0 0 9H13'],
+    heading1: ['M4 12h8', 'M4 18V6', 'M12 18V6', 'm17 12 3-2v8'],
+    heading2: ['M4 12h8', 'M4 18V6', 'M12 18V6', 'M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1'],
+    heading3: [
+        'M4 12h8',
+        'M4 18V6',
+        'M12 18V6',
+        'M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2',
+        'M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2',
+    ],
+    bulletList: ['M3 5h.01', 'M3 12h.01', 'M3 19h.01', 'M8 5h13', 'M8 12h13', 'M8 19h13'],
+    orderedList: [
+        'M11 5h10',
+        'M11 12h10',
+        'M11 19h10',
+        'M4 4h1v5',
+        'M4 9h2',
+        'M6.5 20H3.4c0-1 2.6-1.925 2.6-3.5a1.5 1.5 0 0 0-2.6-1.02',
+    ],
+    blockquote: ['M17 5H3', 'M21 12H8', 'M21 19H8', 'M3 12v7'],
+    codeBlock: [
+        'm10 9-3 3 3 3',
+        'm14 15 3-3-3-3',
+        'M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z',
+    ],
+    link: [
+        'M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71',
+        'M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71',
+    ],
+    horizontalRule: ['M5 12h14'],
+    undo: ['M9 14 4 9l5-5', 'M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11'],
+    redo: ['m15 14 5-5-5-5', 'M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13'],
+};
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+let nextId$1 = 0;
+/**
+ * The field the link panel's URL input belongs to — provided as `WR_FORM_FIELD`
+ * for the editor's whole subtree.
+ *
+ * It does two jobs at once. It is the SHIELD every composite control needs: the
+ * editor is the control a `<wr-form-field>` wraps, and without a nearer provider
+ * the `[wrInput]` in its link panel would adopt the outer field's id, take over
+ * its label and announce its error as its own. And it is the input's own field:
+ * `[wrInput]` binds `id`, `aria-invalid` and `aria-describedby` from whatever
+ * field it finds, so answering here is how a refused URL reaches a screen reader
+ * without binding attributes the directive already owns.
+ *
+ * @internal
+ */
+class WrEditorLinkField {
+    id = `wr-editor-link-${nextId$1++}`;
+    /** The URL just submitted was refused by the link policy. */
+    invalid = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "invalid" }] : /* istanbul ignore next */ []));
+    controlId = signal(`${this.id}-url`).asReadonly();
+    errorId = `${this.id}-error`;
+    panelId = `${this.id}-panel`;
+    errorKeys = computed(() => (this.invalid() ? ['url'] : []), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errorKeys" }] : /* istanbul ignore next */ []));
+    describedBy = computed(() => (this.invalid() ? this.errorId : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
+    labelId = signal(null).asReadonly();
+    adoptControlId() {
+        // The panel's input never carries an id of its own.
+    }
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * List items as the editor draws them, which differs from the HTML it writes
+ * only for a TASK item.
+ *
+ * A task item's box is presentational, with its state as text beside it —
+ * exactly what `<wr-markdown>` renders. A real `<input type="checkbox">` would be
+ * an unlabelled form control inside the text, and making it operable would
+ * promise an interaction v1 does not have. The box and the words sit outside the
+ * editable content, so ProseMirror neither edits nor serializes them; the words
+ * come from the catalog, which is why this is a node view the component builds
+ * rather than a schema `toDOM` (the schema is shared and has no catalog).
+ */
+function listItemView(labels) {
+    return (node, view) => new WrListItemView(node, view.dom.ownerDocument, labels);
+}
+class WrListItemView {
+    dom;
+    contentDOM;
+    node;
+    constructor(node, document, labels) {
+        this.node = node;
+        this.dom = document.createElement('li');
+        const checked = node.attrs['checked'];
+        if (checked === null) {
+            this.contentDOM = this.dom;
+            return;
+        }
+        this.dom.className = 'wr-editor__item wr-editor__item--task';
+        this.dom.setAttribute('data-checked', String(checked));
+        const box = document.createElement('span');
+        box.className = checked ? 'wr-editor__task wr-editor__task--checked' : 'wr-editor__task';
+        box.contentEditable = 'false';
+        box.setAttribute('aria-hidden', 'true');
+        const state = document.createElement('span');
+        state.className = 'wr-editor__sr-only';
+        state.contentEditable = 'false';
+        state.textContent = checked ? labels.done : labels.todo;
+        this.contentDOM = document.createElement('div');
+        this.contentDOM.className = 'wr-editor__task-body';
+        this.dom.append(box, state, this.contentDOM);
+    }
+    update(node) {
+        // A task item becoming a plain one (or the reverse, or toggled) is drawn
+        // again from scratch; there is no in-place way to add or drop the box.
+        if (node.type !== this.node.type || node.attrs['checked'] !== this.node.attrs['checked'])
+            return false;
+        this.node = node;
+        return true;
+    }
+    ignoreMutation(mutation) {
+        if (mutation.type === 'selection' || this.contentDOM === this.dom)
+            return false;
+        return !this.contentDOM.contains(mutation.target);
+    }
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * The toolbar `<wr-editor>` draws when `toolbar` is not bound — every tool, in
+ * five groups. Exported so a toolbar can be built from it rather than retyped:
+ *
+ * ```ts
+ * readonly tools = WR_EDITOR_TOOLBAR.filter(tool => tool !== 'code');
+ * ```
+ *
+ * `underline` is dropped in `markdown` format whether it is listed or not.
+ */
+const WR_EDITOR_TOOLBAR = [
+    'bold',
+    'italic',
+    'underline',
+    'strike',
+    'code',
+    '|',
+    'paragraph',
+    'heading1',
+    'heading2',
+    'heading3',
+    '|',
+    'bulletList',
+    'orderedList',
+    'blockquote',
+    'codeBlock',
+    '|',
+    'link',
+    'horizontalRule',
+    '|',
+    'undo',
+    'redo',
+];
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+let nextId = 0;
+function warn(message) {
+    // eslint-disable-next-line no-console -- dev-mode validation
+    console.warn(`[NGWR] <wr-editor>: ${message}`);
+}
+/** A document's JSON with every mark the target schema does not know dropped. */
+function withoutMarks(node, known) {
+    return {
+        ...node,
+        ...(node.marks ? { marks: node.marks.filter(mark => mark.type in known) } : {}),
+        ...(node.content ? { content: node.content.map(child => withoutMarks(child, known)) } : {}),
+    };
+}
+/**
+ * Rich-text editor on ProseMirror, with a toolbar, a link panel, keyboard
+ * shortcuts and markdown-style block shortcuts (`# `, `> `, `- `, `1. `,
+ * ` ``` `).
+ *
+ * A signal-forms native control: it implements `FormValueControl<WrEditorValue>`,
+ * so `[formField]` binds straight to its `value` model — no
+ * `ControlValueAccessor` in between. `[(value)]` works standalone.
+ *
+ * The value is an HTML string, a markdown string or the document as JSON, chosen
+ * by `format`. Whatever arrives is treated as untrusted and rebuilt from the
+ * editor's schema, so only what the schema allows survives, and links and images
+ * go through `safeMarkdownUrl` in all three. A value the editor cannot read is
+ * refused — the document it already shows is kept, a warning names the reason in
+ * dev mode, and nothing is written back. Until a value it CAN read arrives the
+ * editor is read-only and carries `wr-editor--refused`: the model still holds the
+ * refused value, and an edit would write the document on screen over it.
+ *
+ * Headings stop at three levels: an h4–h6 read from HTML or markdown becomes an
+ * h3 rather than a paragraph. Underline exists in `html` and `json` only —
+ * markdown cannot spell it, so in that format the tool, the shortcut and the mark
+ * itself are absent.
+ *
+ * ProseMirror is an OPTIONAL peer dependency: only an app that imports
+ * `ngwr/editor` installs `prosemirror-model`, `-state`, `-view`, `-commands`,
+ * `-keymap`, `-history`, `-schema-list` and `-inputrules`.
+ *
+ * @example
+ * ```html
+ * <!-- signal forms -->
+ * <wr-editor format="markdown" placeholder="Describe the change" [formField]="form.body" />
+ *
+ * <!-- standalone two-way binding -->
+ * <wr-editor [(value)]="html" />
+ * ```
+ *
+ * @see https://ngwr.dev/reference/components/editor
+ */
+class WrEditor {
+    /**
+     * The document. A string in `html` and `markdown` format, a
+     * {@link WrEditorJson} tree in `json`; `''` / `null` when nothing is written.
+     * Bound by `[formField]`, or two-way via `[(value)]`.
+     */
+    value = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Emitted on blur so a bound field can mark itself touched. */
+    touch = output();
+    /**
+     * Disable the editor and its toolbar. Bound automatically from the field's
+     * disabled state when used with `[formField]`.
+     *
+     * @default false
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * Refuse edits while the text stays focusable, selectable and announced.
+     * Bound automatically from the field's readonly state when used with
+     * `[formField]`.
+     *
+     * The surface keeps its tab stop and reports `aria-readonly`; typing, paste,
+     * drop, the shortcuts and every toolbar command are refused. The toolbar goes
+     * inert, since none of its tools can apply.
+     *
+     * @default false
+     */
+    readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * Hint shown while the document is empty, and exposed as `aria-placeholder`.
+     *
+     * @default ''
+     */
+    placeholder = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /**
+     * Accessible name of the text surface. Falls back to the surrounding
+     * `<wr-form-field>`'s label, then to `editor.label`.
+     */
+    ariaLabel = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * What `value` holds — see {@link WrEditorFormat}. Unset, it falls back to
+     * `provideWrConfig({ editor: { format } })`. Changing it re-reads `value` in
+     * the new format.
+     *
+     * @default 'html'
+     */
+    format = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "format" }] : /* istanbul ignore next */ []));
+    // `null` as the input's own default, not `'html'`, so "the template said
+    // nothing" stays distinguishable from "the template said html" and an app-wide
+    // default can apply.
+    resolvedFormat = useConfigValue(this.format, c => c.editor?.format, 'html');
+    /**
+     * The toolbar's tools, in order, with `'|'` between groups; `false` hides it.
+     * `underline` is left out in `markdown` format, which cannot store it.
+     *
+     * @default WR_EDITOR_TOOLBAR
+     */
+    toolbar = input(WR_EDITOR_TOOLBAR, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "toolbar" }] : /* istanbul ignore next */ []));
+    document = inject(DOCUMENT);
+    injector = inject(Injector);
+    destroyRef = inject(DestroyRef);
+    host = inject(ElementRef);
+    platform = inject(WrPlatform);
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+    /**
+     * Ambient reading direction, read by the toolbar's arrow keys. Optional so a
+     * bare `TestBed` needs no provider; `null` means LTR.
+     */
+    dir = inject(Directionality, { optional: true });
+    /** @internal */
+    linkField = inject(WrEditorLinkField, { self: true });
+    /** The surrounding `<wr-form-field>`'s error state, read past the editor's own shield. @internal */
+    fieldAria = useFormFieldAria({ skipSelf: true });
+    resolvedAriaLabel = useI18nText(this.ariaLabel, 'editor.label', 'Rich text');
+    /**
+     * The field's label names the surface, when there is one — a
+     * `contenteditable` is not labelable, so the field's `<label for>` cannot
+     * reach it. An explicit `ariaLabel` still wins over both.
+     */
+    labelledBy = computed(() => (this.ariaLabel() ? null : this.fieldAria.labelledBy()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelledBy" }] : /* istanbul ignore next */ []));
+    /** `null` while the field's label carries the name. */
+    accessibleName = computed(() => (this.labelledBy() ? null : this.resolvedAriaLabel()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "accessibleName" }] : /* istanbul ignore next */ []));
+    surfaceId = `wr-editor-${nextId++}`;
+    /** ProseMirror owns the surface from here on; until then the preview stands in. */
+    mounted = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mounted" }] : /* istanbul ignore next */ []));
+    focused = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []));
+    editorState = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "editorState" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether `value` holds something the editor could not read, so the document
+     * on screen is not the one the model holds — empty at mount, or the previous
+     * record after a write. Edits are refused until a readable value arrives:
+     * the first keystroke would otherwise replace the stored value with whatever
+     * is on screen, and the only sign of it was a dev-mode warning.
+     */
+    refused = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "refused" }] : /* istanbul ignore next */ []));
+    /** Read-only by the input, or because the value was refused. @internal */
+    locked = computed(() => this.readonly() || this.refused(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "locked" }] : /* istanbul ignore next */ []));
+    /** Apple keyboards name the modifier ⌘. Read in the browser only — see `mount()`. */
+    apple = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "apple" }] : /* istanbul ignore next */ []));
+    surface = viewChild.required('surface', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "surface" }] : /* istanbul ignore next */ []));
+    // `read`, because `#tool` sits on a `wr-btn` and would otherwise resolve to the component.
+    toolButtons = viewChildren('tool', { ...(ngDevMode ? { debugName: "toolButtons" } : /* istanbul ignore next */ {}), read: ElementRef });
+    linkPopover = viewChild('linkPopover', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkPopover" }] : /* istanbul ignore next */ []));
+    view = null;
+    /** The format the live document was read in, which is the format it is written in. */
+    viewFormat = 'html';
+    /**
+     * The value the live document was last read from or written as. A write from
+     * outside that equals it is the document already on screen — an echo of the
+     * editor's own emit, or a consumer writing back what it was handed — and must
+     * neither re-parse nor reset the selection.
+     */
+    lastSerialized = undefined;
+    linkToSurface = false;
+    // Labels
+    toolbarLabel = readI18nText('editor.toolbar', 'Formatting');
+    linkUrlLabel = readI18nText('editor.linkUrl', 'Link address');
+    linkApplyLabel = readI18nText('editor.linkApply', 'Apply');
+    linkRemoveLabel = readI18nText('editor.linkRemove', 'Remove link');
+    linkInvalidLabel = readI18nText('editor.linkInvalid', 'This address cannot be used as a link.');
+    taskDoneLabel = readI18nText('editor.taskDone', 'Done:');
+    taskTodoLabel = readI18nText('editor.taskTodo', 'To do:');
+    keyCtrl = readI18nText('editor.keyCtrl', 'Ctrl');
+    keyShift = readI18nText('editor.keyShift', 'Shift');
+    keyAlt = readI18nText('editor.keyAlt', 'Alt');
+    headingLabel = useI18nFormatter('editor.heading', 'Heading {{level}}');
+    shortcutLabel = useI18nFormatter('editor.shortcut', '{{label}} ({{keys}})');
+    toolLabels = {
+        bold: readI18nText('editor.bold', 'Bold'),
+        italic: readI18nText('editor.italic', 'Italic'),
+        underline: readI18nText('editor.underline', 'Underline'),
+        strike: readI18nText('editor.strike', 'Strikethrough'),
+        code: readI18nText('editor.code', 'Inline code'),
+        paragraph: readI18nText('editor.paragraph', 'Paragraph'),
+        heading1: computed(() => this.headingLabel({ level: 1 })),
+        heading2: computed(() => this.headingLabel({ level: 2 })),
+        heading3: computed(() => this.headingLabel({ level: 3 })),
+        bulletList: readI18nText('editor.bulletList', 'Bulleted list'),
+        orderedList: readI18nText('editor.orderedList', 'Numbered list'),
+        blockquote: readI18nText('editor.blockquote', 'Quote'),
+        codeBlock: readI18nText('editor.codeBlock', 'Code block'),
+        link: readI18nText('editor.link', 'Insert link'),
+        horizontalRule: readI18nText('editor.horizontalRule', 'Horizontal line'),
+        undo: readI18nText('editor.undo', 'Undo'),
+        redo: readI18nText('editor.redo', 'Redo'),
+    };
+    // Toolbar
+    /**
+     * The bound tools as drawn: underline dropped where the format cannot store
+     * it, and separators only BETWEEN two groups — a leading, trailing or doubled
+     * one would be left behind by that filter or by a hand-built list.
+     */
+    tools = computed(() => {
+        const bound = this.toolbar();
+        if (!bound)
+            return [];
+        const markdown = this.resolvedFormat() === 'markdown';
+        const out = [];
+        for (const tool of bound) {
+            if (markdown && tool === 'underline')
+                continue;
+            if (tool === '|' && (out.length === 0 || out[out.length - 1] === '|'))
+                continue;
+            if (tool !== '|' && out.includes(tool))
+                continue;
+            out.push(tool);
+        }
+        if (out[out.length - 1] === '|')
+            out.pop();
+        return out;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tools" }] : /* istanbul ignore next */ []));
+    /** The tools that are buttons, in order — what the roving tab stop moves over. */
+    buttons = computed(() => this.tools().filter((tool) => tool !== '|'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "buttons" }] : /* istanbul ignore next */ []));
+    /** Each drawn entry's index among the buttons, `-1` for a separator. @internal */
+    buttonIndex = computed(() => {
+        let index = 0;
+        return this.tools().map(tool => (tool === '|' ? -1 : index++));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "buttonIndex" }] : /* istanbul ignore next */ []));
+    commands = computed(() => {
+        const schema = editorSchema(this.resolvedFormat());
+        return new Map(this.buttons().map(tool => [tool, toolCommand(tool, schema)]));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "commands" }] : /* istanbul ignore next */ []));
+    /** Every button's pressed and available state at the current selection. @internal */
+    toolStates = computed(() => {
+        const state = this.editorState();
+        const editable = this.canEdit();
+        const commands = this.commands();
+        return new Map(this.buttons().map(tool => {
+            const command = commands.get(tool);
+            return [
+                tool,
+                {
+                    tool,
+                    active: !!state && toolActive(tool, state),
+                    available: !!state && editable && !!command && command(state),
+                },
+            ];
+        }));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "toolStates" }] : /* istanbul ignore next */ []));
+    rovingIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "rovingIndex" }] : /* istanbul ignore next */ []));
+    /**
+     * The one button in the tab order. It follows the user, and moves off a tool
+     * that stopped applying so the toolbar never loses its tab stop — unless NO
+     * tool applies (read-only, disabled), where it stays put, because there is
+     * nothing to reach.
+     */
+    tabStop = computed(() => {
+        const buttons = this.buttons();
+        const states = this.toolStates();
+        const current = Math.min(this.rovingIndex(), Math.max(buttons.length - 1, 0));
+        if (states.get(buttons[current])?.available)
+            return current;
+        const first = buttons.findIndex(tool => states.get(tool)?.available);
+        return first >= 0 ? first : current;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tabStop" }] : /* istanbul ignore next */ []));
+    /** Whether the live document is empty — pre-mount, whether the value is. */
+    empty = computed(() => {
+        const state = this.editorState();
+        if (state)
+            return isEmptyDoc(state.doc);
+        const value = this.value();
+        return value === null || value === undefined || value === '';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "empty" }] : /* istanbul ignore next */ []));
+    /** The task-item words, handed to ProseMirror through its node views. */
+    nodeViews = computed(() => ({
+        list_item: listItemView({ done: this.taskDoneLabel(), todo: this.taskTodoLabel() }),
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "nodeViews" }] : /* istanbul ignore next */ []));
+    ariaPlaceholder = computed(() => (this.placeholder() && this.empty() ? this.placeholder() : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaPlaceholder" }] : /* istanbul ignore next */ []));
+    // Link panel
+    linkDraft = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkDraft" }] : /* istanbul ignore next */ []));
+    /** Whether the selection is in a link — what the panel's remove button needs. */
+    linkActive = computed(() => this.toolStates().get('link')?.active ?? false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkActive" }] : /* istanbul ignore next */ []));
+    /**
+     * The value rendered by Angular until ProseMirror takes over: on the server,
+     * and for the first browser frame. Read from the doc JSON, so it shows exactly
+     * what the schema kept — the same sanitised document the editor will mount.
+     */
+    preview = computed(() => {
+        if (this.mounted())
+            return null;
+        const format = this.resolvedFormat();
+        try {
+            return readValue(this.value(), format, editorSchema(format), this.document).toJSON();
+        }
+        catch (error) {
+            // The browser warns once, when it mounts; the server has no mount to wait for.
+            if (!this.isBrowser && isDevMode())
+                this.warnRefused(format, error);
+            return null;
+        }
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "preview" }] : /* istanbul ignore next */ []));
+    classes = computed(() => {
+        const parts = ['wr-editor'];
+        if (this.focused())
+            parts.push('wr-editor--focused');
+        if (this.disabled())
+            parts.push('wr-editor--disabled');
+        else if (this.locked())
+            parts.push('wr-editor--readonly');
+        if (this.refused())
+            parts.push('wr-editor--refused');
+        return parts.join(' ');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // Outside writes: a form reset, a server load, a patch. Skipped when the
+        // value is the document already on screen — see `lastSerialized`.
+        effect(() => {
+            const value = this.value();
+            const format = this.resolvedFormat();
+            untracked(() => this.sync(value, format));
+        });
+        // `editable` and the placeholder are functions ProseMirror asks on every
+        // update, so poking it is enough to make it ask again.
+        effect(() => {
+            this.readonly();
+            this.disabled();
+            this.refused();
+            this.placeholder();
+            untracked(() => this.view?.setProps({}));
+        });
+        // The task-item words live in node views, which ProseMirror only redraws
+        // when the `nodeViews` prop itself changes.
+        effect(() => {
+            const nodeViews = this.nodeViews();
+            untracked(() => this.view?.setProps({ nodeViews }));
+        });
+        // The roving tab stop is written to the DOM rather than bound: `wr-btn`
+        // binds `[attr.tabindex]` on its host (`null` for a native button), and a
+        // host binding runs after the template's and removes the attribute on the
+        // first pass. Nothing rewrites it after that, so a write after render sticks.
+        afterRenderEffect({
+            write: () => {
+                const stop = this.tabStop();
+                this.toolButtons().forEach((ref, index) => (ref.nativeElement.tabIndex = index === stop ? 0 : -1));
+            },
+        });
+        // `afterNextRender` alone is not the guard: it keys on the global server
+        // flag, not on `PLATFORM_ID`, so a platform test would still run it.
+        if (!this.isBrowser)
+            return;
+        afterNextRender(() => this.mount());
+    }
+    /** Focus the text surface — what Signal Forms calls to focus this control. */
+    focus(options) {
+        const view = this.view;
+        // ProseMirror's own `focus()` is a no-op while the view is not editable,
+        // and read-only has to stay focusable.
+        if (view?.editable)
+            view.focus();
+        else
+            this.surface().nativeElement.focus(options);
+    }
+    // Template handlers
+    label(tool) {
+        return this.toolLabels[tool]();
+    }
+    icon(tool) {
+        return TOOL_ICONS[tool];
+    }
+    isToggle(tool) {
+        return TOGGLES.has(tool);
+    }
+    /** The tooltip: the label, with the shortcut when the tool has one. */
+    tooltip(tool) {
+        const shortcut = SHORTCUTS[tool];
+        if (!shortcut)
+            return this.label(tool);
+        const keys = this.apple()
+            ? `${shortcut.alt ? '⌥' : ''}${shortcut.shift ? '⇧' : ''}⌘${shortcut.key}`
+            : [
+                this.keyCtrl(),
+                ...(shortcut.alt ? [this.keyAlt()] : []),
+                ...(shortcut.shift ? [this.keyShift()] : []),
+                shortcut.key,
+            ].join('+');
+        return this.shortcutLabel({ label: this.label(tool), keys });
+    }
+    /** `aria-keyshortcuts` — key names from the ARIA spec, never localised. */
+    keyShortcuts(tool) {
+        const shortcut = SHORTCUTS[tool];
+        if (!shortcut)
+            return null;
+        const mod = this.apple() ? 'Meta' : 'Control';
+        const combo = `${mod}+${shortcut.alt ? 'Alt+' : ''}${shortcut.shift ? 'Shift+' : ''}${shortcut.key}`;
+        return tool === 'redo' && !this.apple() ? `${combo} Control+Y` : combo;
+    }
+    state(tool) {
+        return this.toolStates().get(tool);
+    }
+    /**
+     * A toolbar button was activated.
+     *
+     * By pointer, focus never left the text (`mousedown` is cancelled), so the
+     * caret is put back where the command left it. By keyboard, focus stays on the
+     * button, as the toolbar pattern asks — unless the tool no longer applies,
+     * which disables it: a disabled button drops its focus on `<body>`, so the text
+     * takes it first.
+     */
+    onToolClick(tool, event) {
+        const view = this.view;
+        const command = this.commands().get(tool);
+        if (!view || !command || !this.canEdit())
+            return;
+        command(view.state, view.dispatch, view);
+        if (event.detail !== 0 || !this.state(tool)?.available)
+            view.focus();
+    }
+    onToolFocus(index) {
+        this.rovingIndex.set(index);
+    }
+    /** The APG toolbar keys: the arrows rove and wrap, Home and End jump. */
+    onToolbarKeydown(event) {
+        if (isComposing(event) || event.altKey || event.ctrlKey || event.metaKey)
+            return;
+        const buttons = this.toolButtons().map(ref => ref.nativeElement);
+        const current = buttons.indexOf(event.target);
+        if (current < 0)
+            return;
+        const reachable = buttons.map((button, index) => (button.disabled ? -1 : index)).filter(index => index >= 0);
+        if (!reachable.length)
+            return;
+        const rtl = this.dir?.value === 'rtl';
+        const at = reachable.indexOf(current);
+        let next;
+        switch (event.key) {
+            case 'ArrowRight':
+                next = reachable[(at + (rtl ? -1 : 1) + reachable.length) % reachable.length];
+                break;
+            case 'ArrowLeft':
+                next = reachable[(at + (rtl ? 1 : -1) + reachable.length) % reachable.length];
+                break;
+            case 'Home':
+                next = reachable[0];
+                break;
+            case 'End':
+                next = reachable[reachable.length - 1];
+                break;
+            default:
+                return;
+        }
+        event.preventDefault();
+        this.rovingIndex.set(next);
+        buttons[next].focus();
+    }
+    /** `touch` once focus leaves the whole control — not when it moves between its own parts. */
+    onFocusOut(event) {
+        const next = event.relatedTarget;
+        if (next && this.withinControl(next))
+            return;
+        const fromPanel = this.inLinkPanel(event.target);
+        // Chromium fires a `focusout` with no `relatedTarget` when the focused
+        // element is REMOVED — the link panel closing with focus inside it, or its
+        // remove button leaving — and the popover hands focus back only after that.
+        // It does the same when Tab runs off the end of the document, which is where
+        // the overlay container sits. So where focus went is decided once it has
+        // settled, or Escape on the panel marked the field touched with focus never
+        // leaving the control.
+        if (!next && fromPanel) {
+            afterNextRender(() => {
+                const active = this.document.activeElement;
+                if (active && this.withinControl(active))
+                    return;
+                this.leaveLinkPanel();
+                this.touch.emit();
+            }, { injector: this.injector });
+            return;
+        }
+        if (next && fromPanel)
+            this.leaveLinkPanel();
+        this.touch.emit();
+    }
+    onLinkOpened() {
+        const state = this.view?.state;
+        const range = state ? linkRange(state) : null;
+        this.linkDraft.set(range ? String(range.mark.attrs['href'] ?? '') : '');
+        this.linkField.invalid.set(false);
+        afterNextRender(() => this.focusLinkInput(), { injector: this.injector });
+    }
+    onLinkClosed() {
+        // Back to the text when the panel was opened from it (Mod-K) or when a link
+        // was just applied; otherwise the popover has already handed focus back to
+        // the toolbar button, which is where Escape should leave it.
+        //
+        // Only while focus is where the popover left it — on the link button — or
+        // nowhere. A click elsewhere on the page closes the panel too, and by then
+        // it has put focus where the user wanted it; taking it back sent their next
+        // keystrokes into this editor.
+        const toSurface = this.linkToSurface;
+        this.linkToSurface = false;
+        this.linkField.invalid.set(false);
+        if (!toSurface)
+            return;
+        const active = this.document.activeElement;
+        const linkButton = this.toolButtons()[this.buttons().indexOf('link')]?.nativeElement;
+        if (!active || active === this.document.body || active === linkButton)
+            this.view?.focus();
+    }
+    onLinkInput(event) {
+        this.linkDraft.set(event.target.value);
+        this.linkField.invalid.set(false);
+    }
+    applyLink(event) {
+        event.preventDefault();
+        const view = this.view;
+        if (!view || !this.canEdit())
+            return;
+        const draft = this.linkDraft().trim();
+        // An emptied field on an existing link means "no link".
+        if (!draft && this.linkActive()) {
+            this.removeLink();
+            return;
+        }
+        const href = draft ? safeMarkdownUrl(draft, 'link') : null;
+        if (!href) {
+            this.linkField.invalid.set(true);
+            this.focusLinkInput();
+            return;
+        }
+        if (!setLink(href)(view.state, view.dispatch))
+            return;
+        this.linkToSurface = true;
+        this.linkPopover()?.close();
+    }
+    removeLink() {
+        const view = this.view;
+        if (!view || !this.canEdit())
+            return;
+        removeLink(view.state, view.dispatch);
+        this.linkToSurface = true;
+        this.linkPopover()?.close();
+    }
+    // Preview helpers — the template's typed view of untyped JSON.
+    nodesOf(raw) {
+        return Array.isArray(raw) ? raw : [];
+    }
+    nodeOf(raw) {
+        return raw;
+    }
+    markAt(node, depth) {
+        return node.marks?.[depth] ?? null;
+    }
+    attr(node, name) {
+        return node.attrs?.[name] ?? null;
+    }
+    text(node, name) {
+        const value = node.attrs?.[name];
+        return typeof value === 'string' ? value : null;
+    }
+    textOf(node) {
+        return (node.content ?? []).map(child => child.text ?? '').join('');
+    }
+    // Internals
+    /** Whether an edit may happen at all — not while read-only, disabled or refused. */
+    canEdit() {
+        return !this.readonly() && !this.disabled() && !this.refused();
+    }
+    mount() {
+        this.apple.set((this.platform.userAgent ?? '').toLowerCase().includes('mac'));
+        const format = untracked(this.resolvedFormat);
+        const value = untracked(this.value);
+        const schema = editorSchema(format);
+        let doc;
+        try {
+            doc = readValue(value, format, schema, this.document);
+        }
+        catch (error) {
+            if (isDevMode())
+                this.warnRefused(format, error);
+            doc = schema.topNodeType.createAndFill();
+            // An empty document over a stored value: see `refused`.
+            this.refused.set(true);
+        }
+        const state = this.createState(doc);
+        this.view = new EditorView({ mount: this.surface().nativeElement }, {
+            state,
+            editable: () => untracked(() => this.canEdit()),
+            dispatchTransaction: tr => this.dispatch(tr),
+            decorations: current => this.placeholderDecorations(current),
+            nodeViews: untracked(this.nodeViews),
+            handleKeyDown: (_view, event) => this.onSurfaceKeydown(event),
+        });
+        this.viewFormat = format;
+        this.lastSerialized = value;
+        this.editorState.set(state);
+        this.mounted.set(true);
+        this.destroyRef.onDestroy(() => {
+            this.view?.destroy();
+            this.view = null;
+        });
+    }
+    createState(doc) {
+        const current = this.view?.state;
+        const plugins = current?.schema === doc.type.schema
+            ? current.plugins
+            : editorPlugins(doc.type.schema, {
+                apple: untracked(this.apple),
+                canEdit: () => untracked(() => this.canEdit()),
+            });
+        return EditorState.create({ doc, plugins });
+    }
+    dispatch(tr) {
+        const view = this.view;
+        if (!view)
+            return;
+        const previous = view.state;
+        const next = previous.apply(tr);
+        view.updateState(next);
+        this.editorState.set(next);
+        // A refused transaction leaves the document as it was even though it asked
+        // to change it; that is not an edit, and must not reach the model.
+        if (next.doc !== previous.doc)
+            this.emit(next.doc);
+    }
+    emit(doc) {
+        const out = writeValue(doc, this.viewFormat, this.document);
+        if (out === this.lastSerialized)
+            return;
+        this.lastSerialized = out;
+        this.value.set(out);
+    }
+    /**
+     * Bring an outside write into the view.
+     *
+     * Compared as DOCUMENTS, never as strings: `<b>` comes back as `<strong>`, so a
+     * normalised string differs from what the consumer wrote while the documents
+     * are equal — and an equal document is left alone, selection and history
+     * included. A different one replaces the state wholesale, history with it,
+     * which is right for a form reset or a server load: undo back into content the
+     * app replaced would be wrong. The normalised form is never written back —
+     * that would mark the field dirty on load. A write that arrives mid-composition
+     * (IME) replaces the composition too: the model is the source of truth.
+     */
+    sync(value, format) {
+        const view = this.view;
+        if (!view)
+            return;
+        if (format === this.viewFormat && value === this.lastSerialized)
+            return;
+        const schema = editorSchema(format);
+        let doc;
+        try {
+            doc = readValue(value, format, schema, this.document);
+        }
+        catch (error) {
+            if (isDevMode())
+                this.warnRefused(format, error);
+            // Only the format moved, and the screen still shows this very value read
+            // in the old one: carried across, an edit converts it and loses nothing.
+            // Any other refusal leaves the model holding what the screen does not show.
+            const carried = format !== this.viewFormat && value === this.lastSerialized && !this.refused();
+            if (format !== this.viewFormat)
+                this.switchFormat(format, schema);
+            this.refused.set(!carried);
+            return;
+        }
+        this.refused.set(false);
+        this.lastSerialized = value;
+        if (format === this.viewFormat && doc.eq(view.state.doc))
+            return;
+        this.viewFormat = format;
+        this.replaceState(doc);
+    }
+    /**
+     * A new format whose value could not be read: keep the document, moved into
+     * the new format's schema — markdown's lacks underline, so that mark is
+     * dropped on the way. What is written from here on is in the new format.
+     */
+    switchFormat(format, schema) {
+        const view = this.view;
+        this.viewFormat = format;
+        if (view.state.schema === schema)
+            return;
+        let doc;
+        try {
+            doc = schema.nodeFromJSON(withoutMarks(view.state.doc.toJSON(), schema.marks));
+            doc.check();
+        }
+        catch {
+            doc = schema.topNodeType.createAndFill();
+        }
+        this.replaceState(doc);
+    }
+    replaceState(doc) {
+        const state = this.createState(doc);
+        this.view.updateState(state);
+        this.editorState.set(state);
+    }
+    placeholderDecorations(state) {
+        const text = untracked(this.placeholder);
+        if (!text || !isEmptyDoc(state.doc))
+            return null;
+        const first = state.doc.firstChild;
+        return DecorationSet.create(state.doc, [
+            Decoration.node(0, first.nodeSize, { class: 'wr-editor__placeholder', 'data-placeholder': text }),
+        ]);
+    }
+    /**
+     * Mod-K opens the link panel. Its propagation stops here: `<wr-command-palette>`
+     * binds the same chord on the document, and `WrHotkey` deliberately does not
+     * skip an event another listener already handled.
+     */
+    onSurfaceKeydown(event) {
+        if (isComposing(event) || event.altKey || event.shiftKey)
+            return false;
+        const mod = untracked(this.apple) ? event.metaKey && !event.ctrlKey : event.ctrlKey && !event.metaKey;
+        if (!mod || (event.key.toLowerCase() !== 'k' && event.code !== 'KeyK'))
+            return false;
+        const popover = this.linkPopover();
+        if (!popover || !untracked(this.toolStates).get('link')?.available)
+            return false;
+        event.stopPropagation();
+        this.linkToSurface = true;
+        popover.open();
+        return true;
+    }
+    focusLinkInput() {
+        const input = this.document.getElementById(this.linkField.controlId());
+        input?.focus();
+        input?.select();
+    }
+    /**
+     * Focus left the link panel for somewhere outside the control — Tab, Shift+Tab,
+     * a click elsewhere. The panel is not a focus trap, and left open it stays
+     * anchored to a control the user has left, whose next close would then pull
+     * focus back into the text. Closed with focus left where it went.
+     */
+    leaveLinkPanel() {
+        this.linkToSurface = false;
+        this.linkPopover()?.close();
+    }
+    /** Whether a node is part of this control: the host, or its link panel. */
+    withinControl(node) {
+        return this.host.nativeElement.contains(node) || this.inLinkPanel(node);
+    }
+    inLinkPanel(node) {
+        const panel = this.document.getElementById(this.linkField.panelId);
+        if (!panel)
+            return false;
+        // The popover focuses its own pane before the input takes over.
+        return panel.contains(node) || node === panel.closest('.cdk-overlay-pane');
+    }
+    warnRefused(format, error) {
+        const reason = error instanceof Error ? error.message : String(error);
+        warn(`the bound value could not be read as ${format} and was ignored — the editor keeps the document it had and ` +
+            `refuses edits until it is given a value it can read, so the stored one is not overwritten. ${reason}`);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrEditor, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: WrEditor, isStandalone: true, selector: "wr-editor", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, toolbar: { classPropertyName: "toolbar", publicName: "toolbar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { listeners: { "focusout": "onFocusOut($event)" }, properties: { "class": "classes()" } }, providers: [
+            { provide: WrEditorLinkField, useFactory: () => new WrEditorLinkField() },
+            { provide: WR_FORM_FIELD, useExisting: WrEditorLinkField },
+        ], viewQueries: [{ propertyName: "surface", first: true, predicate: ["surface"], descendants: true, isSignal: true }, { propertyName: "toolButtons", predicate: ["tool"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "linkPopover", first: true, predicate: ["linkPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (tools().length) {\n  <div class=\"wr-editor__toolbar\" role=\"toolbar\" [attr.aria-label]=\"toolbarLabel()\" [attr.aria-controls]=\"surfaceId\">\n    @for (item of tools(); track $index; let n = $index) {\n      @if (item === '|') {\n        <span class=\"wr-editor__separator\" aria-hidden=\"true\"></span>\n      } @else if (item === 'link') {\n        <!-- The link button hosts the link panel, so it carries the popover's own\n             `aria-haspopup` / `aria-expanded` / `aria-controls` \u2014 and no tooltip,\n             since one element cannot host `[wrPopover]` twice; its name and\n             `aria-keyshortcuts` still say what the others' tooltips say. No\n             `aria-pressed` either: a button that opens a popup is not a toggle,\n             and the panel's remove button is where \"in a link\" is announced. -->\n        <button\n          #tool\n          #linkPopover=\"wrPopover\"\n          wr-btn\n          type=\"button\"\n          class=\"wr-editor__tool\"\n          [class.wr-editor__tool--active]=\"state(item)?.active\"\n          [disabled]=\"!state(item)?.available\"\n          [attr.aria-label]=\"label(item)\"\n          [attr.aria-keyshortcuts]=\"keyShortcuts(item)\"\n          [wrPopover]=\"linkPanel\"\n          [ariaLabel]=\"label(item)\"\n          (opened)=\"onLinkOpened()\"\n          (closed)=\"onLinkClosed()\"\n          (focus)=\"onToolFocus(buttonIndex()[n])\"\n          (keydown)=\"onToolbarKeydown($event)\"\n          (mousedown)=\"$event.preventDefault()\"\n        >\n          <svg\n            class=\"wr-editor__icon\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            @for (d of icon(item); track $index) {\n              <path [attr.d]=\"d\" />\n            }\n          </svg>\n        </button>\n      } @else {\n        <button\n          #tool\n          wr-btn\n          type=\"button\"\n          class=\"wr-editor__tool\"\n          mode=\"tooltip\"\n          [class.wr-editor__tool--active]=\"state(item)?.active\"\n          [disabled]=\"!state(item)?.available\"\n          [attr.aria-pressed]=\"isToggle(item) ? (state(item)?.active ? 'true' : 'false') : null\"\n          [attr.aria-label]=\"label(item)\"\n          [attr.aria-keyshortcuts]=\"keyShortcuts(item)\"\n          [wrPopover]=\"tooltip(item)\"\n          (click)=\"onToolClick(item, $event)\"\n          (focus)=\"onToolFocus(buttonIndex()[n])\"\n          (keydown)=\"onToolbarKeydown($event)\"\n          (mousedown)=\"$event.preventDefault()\"\n        >\n          <svg\n            class=\"wr-editor__icon\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            @for (d of icon(item); track $index) {\n              <path [attr.d]=\"d\" />\n            }\n          </svg>\n        </button>\n      }\n    }\n  </div>\n}\n\n<!--\n  The static preview: what Angular renders until ProseMirror mounts \u2014 on the\n  server, and for the first browser frame. It is a SIBLING of the mount surface,\n  never inside it: `{ mount }` replaces the element's children, and nodes Angular\n  owns would be deleted out from under the next change detection.\n-->\n@if (preview(); as doc) {\n  <div class=\"wr-editor__preview wr-editor__content\">\n    <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: doc.content }\" />\n  </div>\n}\n\n<!--\n  The mount surface. Angular binds every attribute it needs, so the prerendered\n  page and the synchronous first render already carry the role, the name and the\n  field's error state; ProseMirror adds only its own class, `contenteditable` and\n  `translate`, and never touches an attribute it did not set. No Angular child\n  ever lives in here.\n-->\n<div\n  #surface\n  class=\"wr-editor__surface wr-editor__content\"\n  role=\"textbox\"\n  aria-multiline=\"true\"\n  [id]=\"surfaceId\"\n  [hidden]=\"!mounted()\"\n  [attr.aria-label]=\"accessibleName()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-readonly]=\"locked() && !disabled() ? 'true' : null\"\n  [attr.aria-disabled]=\"disabled() ? 'true' : null\"\n  [attr.aria-placeholder]=\"ariaPlaceholder()\"\n  [attr.tabindex]=\"locked() && !disabled() ? 0 : null\"\n  (focus)=\"focused.set(true)\"\n  (blur)=\"focused.set(false)\"\n></div>\n\n<!--\n  The popover styles its panel as `.wr-popover-overlay > *`, which is this form,\n  so the form stays a plain block and the layout lives one level in.\n-->\n<ng-template #linkPanel>\n  <form\n    class=\"wr-editor-link\"\n    novalidate\n    [id]=\"linkField.panelId\"\n    (submit)=\"applyLink($event)\"\n    (focusout)=\"onFocusOut($event)\"\n  >\n    <div class=\"wr-editor-link__body\">\n      <label class=\"wr-editor-link__label\" [attr.for]=\"linkField.controlId()\">{{ linkUrlLabel() }}</label>\n      <input\n        wrInput\n        class=\"wr-editor-link__input\"\n        type=\"text\"\n        inputmode=\"url\"\n        autocomplete=\"url\"\n        spellcheck=\"false\"\n        [value]=\"linkDraft()\"\n        (input)=\"onLinkInput($event)\"\n      />\n      @if (linkField.invalid()) {\n        <p class=\"wr-editor-link__error\" role=\"alert\" [id]=\"linkField.errorId\">{{ linkInvalidLabel() }}</p>\n      }\n      <div class=\"wr-editor-link__actions\">\n        @if (linkActive()) {\n          <button wr-btn type=\"button\" class=\"wr-editor-link__remove\" (click)=\"removeLink()\">\n            {{ linkRemoveLabel() }}\n          </button>\n        }\n        <button wr-btn type=\"submit\" color=\"primary\" class=\"wr-editor-link__apply\">{{ linkApplyLabel() }}</button>\n      </div>\n    </div>\n  </form>\n</ng-template>\n\n<!--\n  Recursion runs through `ngTemplateOutlet`, as in `<wr-markdown>`, so the preview\n  is exactly the document with no wrapper between a `<ul>` and its `<li>`.\n-->\n<ng-template #previewBlocks let-raw>\n  @for (node of nodesOf(raw); track $index) {\n    @switch (node.type) {\n      @case ('paragraph') {\n        <p [class.wr-editor__placeholder]=\"ariaPlaceholder() !== null\" [attr.data-placeholder]=\"ariaPlaceholder()\">\n          <ng-container [ngTemplateOutlet]=\"previewInline\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </p>\n      }\n      @case ('heading') {\n        @switch (attr(node, 'level')) {\n          @case (2) {\n            <h2>\n              <ng-container\n                [ngTemplateOutlet]=\"previewInline\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </h2>\n          }\n          @case (3) {\n            <h3>\n              <ng-container\n                [ngTemplateOutlet]=\"previewInline\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </h3>\n          }\n          @default {\n            <h1>\n              <ng-container\n                [ngTemplateOutlet]=\"previewInline\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </h1>\n          }\n        }\n      }\n      @case ('blockquote') {\n        <blockquote>\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </blockquote>\n      }\n      @case ('code_block') {\n        <pre><code>{{ textOf(node) }}</code></pre>\n      }\n      @case ('horizontal_rule') {\n        <hr />\n      }\n      @case ('bullet_list') {\n        <ul>\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </ul>\n      }\n      @case ('ordered_list') {\n        <ol [attr.start]=\"attr(node, 'order') === 1 ? null : attr(node, 'order')\">\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </ol>\n      }\n      @case ('list_item') {\n        @let checked = attr(node, 'checked');\n        @if (checked === null) {\n          <li>\n            <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n          </li>\n        } @else {\n          <li class=\"wr-editor__item wr-editor__item--task\" [attr.data-checked]=\"checked\">\n            <span class=\"wr-editor__task\" [class.wr-editor__task--checked]=\"checked === true\" aria-hidden=\"true\"></span>\n            <span class=\"wr-editor__sr-only\">{{ checked === true ? taskDoneLabel() : taskTodoLabel() }}</span>\n            <div class=\"wr-editor__task-body\">\n              <ng-container\n                [ngTemplateOutlet]=\"previewBlocks\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </div>\n          </li>\n        }\n      }\n      @case ('table') {\n        <table>\n          <tbody>\n            <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n          </tbody>\n        </table>\n      }\n      @case ('table_row') {\n        <tr>\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </tr>\n      }\n      @case ('table_header') {\n        <th [style.text-align]=\"text(node, 'align')\">\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </th>\n      }\n      @case ('table_cell') {\n        <td [style.text-align]=\"text(node, 'align')\">\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </td>\n      }\n    }\n  }\n</ng-template>\n\n<ng-template #previewInline let-raw>\n  @for (node of nodesOf(raw); track $index) {\n    <ng-container [ngTemplateOutlet]=\"previewMarked\" [ngTemplateOutletContext]=\"{ $implicit: node, depth: 0 }\" />\n  }\n</ng-template>\n\n<!-- One mark per level, outermost first \u2014 the order the schema ranks them in. -->\n<ng-template #previewMarked let-raw let-depth=\"depth\">\n  @let node = nodeOf(raw);\n  @let mark = markAt(node, depth);\n  @if (mark) {\n    @switch (mark.type) {\n      @case ('link') {\n        <a [href]=\"text(mark, 'href')\" [attr.title]=\"text(mark, 'title')\" rel=\"noopener noreferrer nofollow\"\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></a>\n      }\n      @case ('strong') {\n        <strong\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></strong>\n      }\n      @case ('em') {\n        <em\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></em>\n      }\n      @case ('underline') {\n        <u\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></u>\n      }\n      @case ('strike') {\n        <s\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></s>\n      }\n      @case ('code') {\n        <code\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></code>\n      }\n      @default {\n        <ng-container\n          [ngTemplateOutlet]=\"previewMarked\"\n          [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        />\n      }\n    }\n  } @else {\n    @switch (node.type) {\n      @case ('text') {\n        <ng-container>{{ node.text }}</ng-container>\n      }\n      @case ('hard_break') {\n        <br />\n      }\n      @case ('image') {\n        <img [src]=\"text(node, 'src')\" [alt]=\"text(node, 'alt') ?? ''\" [attr.title]=\"text(node, 'title')\" />\n      }\n    }\n  }\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: WrButton, selector: "wr-btn, button[wr-btn], a[wr-btn]", inputs: ["color", "size", "shape", "icon", "iconPosition", "disabled", "outlined", "block", "loading", "disabledWhenLoading"] }, { kind: "directive", type: WrInput, selector: "input[wrInput], textarea[wrInput]", inputs: ["size", "rounded"] }, { kind: "directive", type: WrPopover, selector: "[wrPopover]", inputs: ["wrPopover", "mode", "trigger", "position", "showDelay", "hideDelay", "responsive", "ariaLabel"], outputs: ["opened", "closed"], exportAs: ["wrPopover"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrEditor, decorators: [{
+            type: Component,
+            args: [{ selector: 'wr-editor', encapsulation: ViewEncapsulation.None, host: {
+                        '[class]': 'classes()',
+                        '(focusout)': 'onFocusOut($event)',
+                    }, providers: [
+                        { provide: WrEditorLinkField, useFactory: () => new WrEditorLinkField() },
+                        { provide: WR_FORM_FIELD, useExisting: WrEditorLinkField },
+                    ], imports: [NgTemplateOutlet, WrButton, WrInput, WrPopover], template: "@if (tools().length) {\n  <div class=\"wr-editor__toolbar\" role=\"toolbar\" [attr.aria-label]=\"toolbarLabel()\" [attr.aria-controls]=\"surfaceId\">\n    @for (item of tools(); track $index; let n = $index) {\n      @if (item === '|') {\n        <span class=\"wr-editor__separator\" aria-hidden=\"true\"></span>\n      } @else if (item === 'link') {\n        <!-- The link button hosts the link panel, so it carries the popover's own\n             `aria-haspopup` / `aria-expanded` / `aria-controls` \u2014 and no tooltip,\n             since one element cannot host `[wrPopover]` twice; its name and\n             `aria-keyshortcuts` still say what the others' tooltips say. No\n             `aria-pressed` either: a button that opens a popup is not a toggle,\n             and the panel's remove button is where \"in a link\" is announced. -->\n        <button\n          #tool\n          #linkPopover=\"wrPopover\"\n          wr-btn\n          type=\"button\"\n          class=\"wr-editor__tool\"\n          [class.wr-editor__tool--active]=\"state(item)?.active\"\n          [disabled]=\"!state(item)?.available\"\n          [attr.aria-label]=\"label(item)\"\n          [attr.aria-keyshortcuts]=\"keyShortcuts(item)\"\n          [wrPopover]=\"linkPanel\"\n          [ariaLabel]=\"label(item)\"\n          (opened)=\"onLinkOpened()\"\n          (closed)=\"onLinkClosed()\"\n          (focus)=\"onToolFocus(buttonIndex()[n])\"\n          (keydown)=\"onToolbarKeydown($event)\"\n          (mousedown)=\"$event.preventDefault()\"\n        >\n          <svg\n            class=\"wr-editor__icon\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            @for (d of icon(item); track $index) {\n              <path [attr.d]=\"d\" />\n            }\n          </svg>\n        </button>\n      } @else {\n        <button\n          #tool\n          wr-btn\n          type=\"button\"\n          class=\"wr-editor__tool\"\n          mode=\"tooltip\"\n          [class.wr-editor__tool--active]=\"state(item)?.active\"\n          [disabled]=\"!state(item)?.available\"\n          [attr.aria-pressed]=\"isToggle(item) ? (state(item)?.active ? 'true' : 'false') : null\"\n          [attr.aria-label]=\"label(item)\"\n          [attr.aria-keyshortcuts]=\"keyShortcuts(item)\"\n          [wrPopover]=\"tooltip(item)\"\n          (click)=\"onToolClick(item, $event)\"\n          (focus)=\"onToolFocus(buttonIndex()[n])\"\n          (keydown)=\"onToolbarKeydown($event)\"\n          (mousedown)=\"$event.preventDefault()\"\n        >\n          <svg\n            class=\"wr-editor__icon\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            @for (d of icon(item); track $index) {\n              <path [attr.d]=\"d\" />\n            }\n          </svg>\n        </button>\n      }\n    }\n  </div>\n}\n\n<!--\n  The static preview: what Angular renders until ProseMirror mounts \u2014 on the\n  server, and for the first browser frame. It is a SIBLING of the mount surface,\n  never inside it: `{ mount }` replaces the element's children, and nodes Angular\n  owns would be deleted out from under the next change detection.\n-->\n@if (preview(); as doc) {\n  <div class=\"wr-editor__preview wr-editor__content\">\n    <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: doc.content }\" />\n  </div>\n}\n\n<!--\n  The mount surface. Angular binds every attribute it needs, so the prerendered\n  page and the synchronous first render already carry the role, the name and the\n  field's error state; ProseMirror adds only its own class, `contenteditable` and\n  `translate`, and never touches an attribute it did not set. No Angular child\n  ever lives in here.\n-->\n<div\n  #surface\n  class=\"wr-editor__surface wr-editor__content\"\n  role=\"textbox\"\n  aria-multiline=\"true\"\n  [id]=\"surfaceId\"\n  [hidden]=\"!mounted()\"\n  [attr.aria-label]=\"accessibleName()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-readonly]=\"locked() && !disabled() ? 'true' : null\"\n  [attr.aria-disabled]=\"disabled() ? 'true' : null\"\n  [attr.aria-placeholder]=\"ariaPlaceholder()\"\n  [attr.tabindex]=\"locked() && !disabled() ? 0 : null\"\n  (focus)=\"focused.set(true)\"\n  (blur)=\"focused.set(false)\"\n></div>\n\n<!--\n  The popover styles its panel as `.wr-popover-overlay > *`, which is this form,\n  so the form stays a plain block and the layout lives one level in.\n-->\n<ng-template #linkPanel>\n  <form\n    class=\"wr-editor-link\"\n    novalidate\n    [id]=\"linkField.panelId\"\n    (submit)=\"applyLink($event)\"\n    (focusout)=\"onFocusOut($event)\"\n  >\n    <div class=\"wr-editor-link__body\">\n      <label class=\"wr-editor-link__label\" [attr.for]=\"linkField.controlId()\">{{ linkUrlLabel() }}</label>\n      <input\n        wrInput\n        class=\"wr-editor-link__input\"\n        type=\"text\"\n        inputmode=\"url\"\n        autocomplete=\"url\"\n        spellcheck=\"false\"\n        [value]=\"linkDraft()\"\n        (input)=\"onLinkInput($event)\"\n      />\n      @if (linkField.invalid()) {\n        <p class=\"wr-editor-link__error\" role=\"alert\" [id]=\"linkField.errorId\">{{ linkInvalidLabel() }}</p>\n      }\n      <div class=\"wr-editor-link__actions\">\n        @if (linkActive()) {\n          <button wr-btn type=\"button\" class=\"wr-editor-link__remove\" (click)=\"removeLink()\">\n            {{ linkRemoveLabel() }}\n          </button>\n        }\n        <button wr-btn type=\"submit\" color=\"primary\" class=\"wr-editor-link__apply\">{{ linkApplyLabel() }}</button>\n      </div>\n    </div>\n  </form>\n</ng-template>\n\n<!--\n  Recursion runs through `ngTemplateOutlet`, as in `<wr-markdown>`, so the preview\n  is exactly the document with no wrapper between a `<ul>` and its `<li>`.\n-->\n<ng-template #previewBlocks let-raw>\n  @for (node of nodesOf(raw); track $index) {\n    @switch (node.type) {\n      @case ('paragraph') {\n        <p [class.wr-editor__placeholder]=\"ariaPlaceholder() !== null\" [attr.data-placeholder]=\"ariaPlaceholder()\">\n          <ng-container [ngTemplateOutlet]=\"previewInline\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </p>\n      }\n      @case ('heading') {\n        @switch (attr(node, 'level')) {\n          @case (2) {\n            <h2>\n              <ng-container\n                [ngTemplateOutlet]=\"previewInline\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </h2>\n          }\n          @case (3) {\n            <h3>\n              <ng-container\n                [ngTemplateOutlet]=\"previewInline\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </h3>\n          }\n          @default {\n            <h1>\n              <ng-container\n                [ngTemplateOutlet]=\"previewInline\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </h1>\n          }\n        }\n      }\n      @case ('blockquote') {\n        <blockquote>\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </blockquote>\n      }\n      @case ('code_block') {\n        <pre><code>{{ textOf(node) }}</code></pre>\n      }\n      @case ('horizontal_rule') {\n        <hr />\n      }\n      @case ('bullet_list') {\n        <ul>\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </ul>\n      }\n      @case ('ordered_list') {\n        <ol [attr.start]=\"attr(node, 'order') === 1 ? null : attr(node, 'order')\">\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </ol>\n      }\n      @case ('list_item') {\n        @let checked = attr(node, 'checked');\n        @if (checked === null) {\n          <li>\n            <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n          </li>\n        } @else {\n          <li class=\"wr-editor__item wr-editor__item--task\" [attr.data-checked]=\"checked\">\n            <span class=\"wr-editor__task\" [class.wr-editor__task--checked]=\"checked === true\" aria-hidden=\"true\"></span>\n            <span class=\"wr-editor__sr-only\">{{ checked === true ? taskDoneLabel() : taskTodoLabel() }}</span>\n            <div class=\"wr-editor__task-body\">\n              <ng-container\n                [ngTemplateOutlet]=\"previewBlocks\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.content }\"\n              />\n            </div>\n          </li>\n        }\n      }\n      @case ('table') {\n        <table>\n          <tbody>\n            <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n          </tbody>\n        </table>\n      }\n      @case ('table_row') {\n        <tr>\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </tr>\n      }\n      @case ('table_header') {\n        <th [style.text-align]=\"text(node, 'align')\">\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </th>\n      }\n      @case ('table_cell') {\n        <td [style.text-align]=\"text(node, 'align')\">\n          <ng-container [ngTemplateOutlet]=\"previewBlocks\" [ngTemplateOutletContext]=\"{ $implicit: node.content }\" />\n        </td>\n      }\n    }\n  }\n</ng-template>\n\n<ng-template #previewInline let-raw>\n  @for (node of nodesOf(raw); track $index) {\n    <ng-container [ngTemplateOutlet]=\"previewMarked\" [ngTemplateOutletContext]=\"{ $implicit: node, depth: 0 }\" />\n  }\n</ng-template>\n\n<!-- One mark per level, outermost first \u2014 the order the schema ranks them in. -->\n<ng-template #previewMarked let-raw let-depth=\"depth\">\n  @let node = nodeOf(raw);\n  @let mark = markAt(node, depth);\n  @if (mark) {\n    @switch (mark.type) {\n      @case ('link') {\n        <a [href]=\"text(mark, 'href')\" [attr.title]=\"text(mark, 'title')\" rel=\"noopener noreferrer nofollow\"\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></a>\n      }\n      @case ('strong') {\n        <strong\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></strong>\n      }\n      @case ('em') {\n        <em\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></em>\n      }\n      @case ('underline') {\n        <u\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></u>\n      }\n      @case ('strike') {\n        <s\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></s>\n      }\n      @case ('code') {\n        <code\n          ><ng-container\n            [ngTemplateOutlet]=\"previewMarked\"\n            [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        /></code>\n      }\n      @default {\n        <ng-container\n          [ngTemplateOutlet]=\"previewMarked\"\n          [ngTemplateOutletContext]=\"{ $implicit: node, depth: depth + 1 }\"\n        />\n      }\n    }\n  } @else {\n    @switch (node.type) {\n      @case ('text') {\n        <ng-container>{{ node.text }}</ng-container>\n      }\n      @case ('hard_break') {\n        <br />\n      }\n      @case ('image') {\n        <img [src]=\"text(node, 'src')\" [alt]=\"text(node, 'alt') ?? ''\" [attr.title]=\"text(node, 'title')\" />\n      }\n    }\n  }\n</ng-template>\n" }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touch: [{ type: i0.Output, args: ["touch"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], toolbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolbar", required: false }] }], surface: [{ type: i0.ViewChild, args: ['surface', { isSignal: true }] }], toolButtons: [{ type: i0.ViewChildren, args: ['tool', { ...{ read: ElementRef }, isSignal: true }] }], linkPopover: [{ type: i0.ViewChild, args: ['linkPopover', { isSignal: true }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WR_EDITOR_TOOLBAR, WrEditor };
+//# sourceMappingURL=ngwr-editor.mjs.map