smartrte-react 0.3.4 → 0.3.5

package/dist/adapters/docxFormat.js

@@ -0,0 +1,272 @@
+import JSZip from "jszip";
+import mammoth from "mammoth";
+import { normalizeSmartDocument } from "smartrte-core";
+import { portableFormulaMarker, portableImageMarker, restorePortableDocxAtoms } from "./portableDocxAtoms.js";
+import { smartDocumentFromHtml } from "./domSmartDocument.js";
+export const DOCX_MEDIA_TYPE = "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
+const xmlEscape = (value) => value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+const colorValue = (value) => {
+    const hex = /^#([0-9a-f]{6})$/i.exec(value.trim());
+    if (hex)
+        return hex[1].toUpperCase();
+    const rgb = /^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/i.exec(value.trim());
+    return rgb
+        ? rgb.slice(1, 4).map((part) => Math.max(0, Math.min(255, Number(part))).toString(16).padStart(2, "0")).join("").toUpperCase()
+        : "";
+};
+const runProperties = (marks = []) => marks.map((mark) => {
+    if (mark.type === "bold")
+        return "<w:b/>";
+    if (mark.type === "italic")
+        return "<w:i/>";
+    if (mark.type === "underline")
+        return '<w:u w:val="single"/>';
+    if (mark.type === "strike")
+        return "<w:strike/>";
+    if (mark.type === "superscript")
+        return '<w:vertAlign w:val="superscript"/>';
+    if (mark.type === "subscript")
+        return '<w:vertAlign w:val="subscript"/>';
+    if (mark.type === "textColor") {
+        const color = colorValue(mark.value);
+        return color ? `<w:color w:val="${color}"/>` : "";
+    }
+    if (mark.type === "backgroundColor") {
+        const color = colorValue(mark.value);
+        return color ? `<w:shd w:val="clear" w:color="auto" w:fill="${color}"/>` : "";
+    }
+    if (mark.type === "fontSize")
+        return `<w:sz w:val="${Math.max(2, Math.round(mark.valuePx * 1.5))}"/>`;
+    return "";
+}).join("");
+const textRun = (text, properties = "") => `<w:r>${properties ? `<w:rPr>${properties}</w:rPr>` : ""}<w:t xml:space="preserve">${xmlEscape(text)}</w:t></w:r>`;
+const createSerializationContext = () => ({
+    relationships: [],
+    hyperlinkIds: new Map(),
+    media: [],
+    drawingId: 1,
+});
+const hyperlinkRelationshipId = (context, href) => {
+    const existing = context.hyperlinkIds.get(href);
+    if (existing)
+        return existing;
+    const id = `rId${context.relationships.length + 2}`;
+    context.hyperlinkIds.set(href, id);
+    context.relationships.push({ id, target: href, kind: "hyperlink" });
+    return id;
+};
+const embeddableImage = (src) => {
+    const match = /^data:(image\/(?:png|jpeg|gif));base64,([a-z0-9+/=\s]+)$/i.exec(src);
+    if (!match)
+        return;
+    return {
+        mimeType: match[1].toLowerCase(),
+        base64: match[2].replace(/\s/g, ""),
+    };
+};
+const imageRun = (node, context) => {
+    const image = embeddableImage(node.src);
+    if (!image)
+        return textRun(portableImageMarker(node.src, node.alt, node.title));
+    const extension = image.mimeType === "image/jpeg" ? "jpg" : image.mimeType.split("/")[1];
+    const filename = `image${context.media.length + 1}.${extension}`;
+    const relationshipId = `rId${context.relationships.length + 2}`;
+    const drawingId = context.drawingId++;
+    context.media.push({ filename, ...image });
+    context.relationships.push({
+        id: relationshipId,
+        target: `media/${filename}`,
+        kind: "image",
+    });
+    const widthEmu = Math.max(1, Math.round((node.width || 96) * 9525));
+    const heightEmu = Math.max(1, Math.round((node.height || 96) * 9525));
+    const name = xmlEscape(node.title || node.alt || filename);
+    const description = xmlEscape(node.alt || "");
+    return `<w:r><w:drawing><wp:inline xmlns:wp="http://schemas.openxmlformats.org/drawingml/2006/wordprocessingDrawing" distT="0" distB="0" distL="0" distR="0"><wp:extent cx="${widthEmu}" cy="${heightEmu}"/><wp:docPr id="${drawingId}" name="${name}" descr="${description}"/><a:graphic xmlns:a="http://schemas.openxmlformats.org/drawingml/2006/main"><a:graphicData uri="http://schemas.openxmlformats.org/drawingml/2006/picture"><pic:pic xmlns:pic="http://schemas.openxmlformats.org/drawingml/2006/picture"><pic:nvPicPr><pic:cNvPr id="0" name="${name}" descr="${description}"/><pic:cNvPicPr/></pic:nvPicPr><pic:blipFill><a:blip r:embed="${relationshipId}"/><a:stretch><a:fillRect/></a:stretch></pic:blipFill><pic:spPr><a:xfrm><a:off x="0" y="0"/><a:ext cx="${widthEmu}" cy="${heightEmu}"/></a:xfrm><a:prstGeom prst="rect"><a:avLst/></a:prstGeom></pic:spPr></pic:pic></a:graphicData></a:graphic></wp:inline></w:drawing></w:r>`;
+};
+const formulaRun = (node) => {
+    const source = xmlEscape(node.value);
+    const marker = xmlEscape(portableFormulaMarker(node.value, node.displayText));
+    return `<m:oMath><m:r><m:t>${source}</m:t></m:r></m:oMath><w:r><w:rPr><w:vanish/></w:rPr><w:t>${marker}</w:t></w:r>`;
+};
+const inlineRun = (node, context) => {
+    if (node.type === "formula")
+        return formulaRun(node);
+    if (node.type === "inlineImage")
+        return imageRun(node, context);
+    const properties = runProperties(node.marks);
+    const runs = node.text.split("\n").map((part, index) => `${index ? "<w:r><w:br/></w:r>" : ""}${part ? textRun(part, properties) : ""}`).join("");
+    const link = node.marks?.find((mark) => mark.type === "link");
+    if (!link || !runs)
+        return runs;
+    return `<w:hyperlink r:id="${hyperlinkRelationshipId(context, link.href)}"${link.target === "_blank" ? ' w:history="1"' : ""}>${runs}</w:hyperlink>`;
+};
+const paragraphProperties = (block, extra = "") => [
+    block.alignment ? `<w:jc w:val="${xmlEscape(block.alignment)}"/>` : "",
+    block.indent ? `<w:ind w:left="${block.indent * 480}"/>` : "",
+    extra,
+].join("");
+const paragraphXml = (children, block, context, extraProperties = "") => {
+    const properties = paragraphProperties(block, extraProperties);
+    const content = children.map((node) => inlineRun(node, context)).join("") || textRun("");
+    return `<w:p>${properties ? `<w:pPr>${properties}</w:pPr>` : ""}${content}</w:p>`;
+};
+const tableXml = (block, context) => {
+    const grid = [];
+    const placements = [];
+    block.children.forEach((row, rowIndex) => {
+        grid[rowIndex] || (grid[rowIndex] = []);
+        let column = 0;
+        row.children.forEach((cell) => {
+            var _a;
+            while (grid[rowIndex][column])
+                column += 1;
+            const placement = {
+                row: rowIndex,
+                column,
+                rowspan: cell.rowspan || 1,
+                colspan: cell.colspan || 1,
+                cell,
+            };
+            placements.push(placement);
+            for (let rowOffset = 0; rowOffset < placement.rowspan; rowOffset += 1) {
+                grid[_a = rowIndex + rowOffset] || (grid[_a] = []);
+                for (let columnOffset = 0; columnOffset < placement.colspan; columnOffset += 1) {
+                    grid[rowIndex + rowOffset][column + columnOffset] = placement;
+                }
+            }
+            column += placement.colspan;
+        });
+    });
+    const width = Math.max(1, ...grid.map((row) => row.length));
+    const widths = Array.from({ length: width }, (_, index) => block.columnWidths?.[index] || 96);
+    const gridXml = `<w:tblGrid>${widths.map((widthPx) => `<w:gridCol w:w="${Math.max(1, Math.round(widthPx * 15))}"/>`).join("")}</w:tblGrid>`;
+    const borderNone = '<w:tcBorders><w:top w:val="nil"/><w:left w:val="nil"/><w:bottom w:val="nil"/><w:right w:val="nil"/></w:tcBorders>';
+    const rows = block.children.map((row, rowIndex) => {
+        const header = grid[rowIndex]?.every((placement) => placement?.cell.type === "tableHeaderCell");
+        const rowProperties = [
+            header ? "<w:tblHeader/>" : "",
+            row.heightPx ? `<w:trHeight w:val="${Math.round(row.heightPx * 15)}" w:hRule="atLeast"/>` : "",
+        ].join("");
+        let cells = "";
+        for (let column = 0; column < width;) {
+            const placement = grid[rowIndex]?.[column];
+            if (!placement || placement.column !== column) {
+                column += 1;
+                continue;
+            }
+            const continuation = placement.row < rowIndex;
+            const shade = colorValue(placement.cell.backgroundColor || "");
+            const properties = [
+                placement.colspan > 1 ? `<w:gridSpan w:val="${placement.colspan}"/>` : "",
+                placement.rowspan > 1
+                    ? continuation ? "<w:vMerge/>" : '<w:vMerge w:val="restart"/>'
+                    : "",
+                shade ? `<w:shd w:val="clear" w:color="auto" w:fill="${shade}"/>` : "",
+                placement.cell.border === "none" ? borderNone : "",
+            ].join("");
+            const content = continuation
+                ? "<w:p/>"
+                : placement.cell.children.map((child) => blockXml(child, context)).join("") || "<w:p/>";
+            cells += `<w:tc><w:tcPr>${properties}</w:tcPr>${content}</w:tc>`;
+            column += placement.colspan;
+        }
+        return `<w:tr>${rowProperties ? `<w:trPr>${rowProperties}</w:trPr>` : ""}${cells}</w:tr>`;
+    }).join("");
+    return `<w:tbl><w:tblPr><w:tblW w:w="0" w:type="auto"/><w:tblBorders><w:top w:val="single" w:sz="4" w:color="D1D5DB"/><w:left w:val="single" w:sz="4" w:color="D1D5DB"/><w:bottom w:val="single" w:sz="4" w:color="D1D5DB"/><w:right w:val="single" w:sz="4" w:color="D1D5DB"/><w:insideH w:val="single" w:sz="4" w:color="D1D5DB"/><w:insideV w:val="single" w:sz="4" w:color="D1D5DB"/></w:tblBorders></w:tblPr>${gridXml}${rows}</w:tbl>`;
+};
+const listStyleNumId = {
+    disc: 1, circle: 2, square: 3, decimal: 4,
+    "decimal-leading-zero": 4,
+    "lower-alpha": 5, "upper-alpha": 6, "lower-roman": 7, "upper-roman": 8,
+};
+const blockXml = (block, context, listLevel = 0) => {
+    if (block.type === "paragraph")
+        return paragraphXml(block.children, block, context);
+    if (block.type === "heading") {
+        return paragraphXml(block.children, block, context, `<w:pStyle w:val="Heading${block.level}"/>`);
+    }
+    if (block.type === "codeBlock")
+        return paragraphXml([{ type: "text", text: block.text, marks: [{ type: "code" }] }], block, context);
+    if (block.type === "blockquote") {
+        return block.children.map((child) => {
+            if (child.type === "paragraph")
+                return paragraphXml(child.children, child, context, '<w:ind w:left="720"/>');
+            return blockXml(child, context, listLevel);
+        }).join("");
+    }
+    if (block.type === "list") {
+        return block.children.map((item) => item.children.map((child) => {
+            if (child.type === "paragraph") {
+                return paragraphXml(child.children, child, context, `<w:numPr><w:ilvl w:val="${Math.min(listLevel, 8)}"/><w:numId w:val="${listStyleNumId[block.style]}"/></w:numPr>`);
+            }
+            return blockXml(child, context, listLevel + 1);
+        }).join("")).join("");
+    }
+    if (block.type === "table")
+        return tableXml(block, context);
+    if (block.type === "image")
+        return paragraphXml([{
+                type: "inlineImage",
+                src: block.src,
+                alt: block.alt,
+                title: block.title,
+                width: block.width,
+                height: block.height,
+            }], block, context);
+    return paragraphXml([{ type: "text", text: block.title || block.src }], block, context);
+};
+const numberingLevelXml = (level, format, text, font) => `<w:lvl w:ilvl="${level}"><w:start w:val="1"/><w:numFmt w:val="${format}"/><w:lvlText w:val="${text}"/><w:lvlJc w:val="left"/><w:pPr><w:tabs><w:tab w:val="num" w:pos="${720 + level * 360}"/></w:tabs><w:ind w:left="${720 + level * 360}" w:hanging="360"/></w:pPr>${font ? `<w:rPr><w:rFonts w:ascii="${font}" w:hAnsi="${font}"/></w:rPr>` : ""}</w:lvl>`;
+const numberingXml = () => {
+    const definitions = [
+        { id: 1, format: "bullet", text: "•", font: "Symbol" },
+        { id: 2, format: "bullet", text: "○", font: "Arial" },
+        { id: 3, format: "bullet", text: "▪", font: "Arial" },
+        { id: 4, format: "decimal", text: "%1." },
+        { id: 5, format: "lowerLetter", text: "%1." },
+        { id: 6, format: "upperLetter", text: "%1." },
+        { id: 7, format: "lowerRoman", text: "%1." },
+        { id: 8, format: "upperRoman", text: "%1." },
+    ];
+    const abstracts = definitions.map(({ id, format, text, font }) => `<w:abstractNum w:abstractNumId="${id}"><w:multiLevelType w:val="multilevel"/>${Array.from({ length: 9 }, (_, level) => numberingLevelXml(level, format, text.replace("%1", `%${level + 1}`), font)).join("")}</w:abstractNum>`).join("");
+    const instances = definitions.map(({ id }) => `<w:num w:numId="${id}"><w:abstractNumId w:val="${id}"/></w:num>`).join("");
+    return `<?xml version="1.0" encoding="UTF-8" standalone="yes"?><w:numbering xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main">${abstracts}${instances}</w:numbering>`;
+};
+const serializeDocxDocument = (document) => {
+    const normalized = normalizeSmartDocument(document);
+    const context = createSerializationContext();
+    const body = normalized.children.map((block) => blockXml(block, context)).join("");
+    return {
+        documentXml: `<?xml version="1.0" encoding="UTF-8" standalone="yes"?><w:document xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main" xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships" xmlns:m="http://schemas.openxmlformats.org/officeDocument/2006/math"><w:body>${body}<w:sectPr><w:pgSz w:w="12240" w:h="15840"/><w:pgMar w:top="720" w:right="720" w:bottom="720" w:left="720"/></w:sectPr></w:body></w:document>`,
+        relationships: context.relationships,
+        media: context.media,
+    };
+};
+export const smartDocumentToDocxXml = (document) => serializeDocxDocument(document).documentXml;
+export const exportDocxDocument = async (document) => {
+    const zip = new JSZip();
+    const serialized = serializeDocxDocument(document);
+    const imageTypes = [...new Set(serialized.media.map(({ filename, mimeType }) => ({
+            extension: filename.split(".").pop(),
+            mimeType,
+        })).map((entry) => JSON.stringify(entry)))].map((entry) => JSON.parse(entry));
+    zip.file("[Content_Types].xml", `<?xml version="1.0" encoding="UTF-8"?><Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types"><Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/><Default Extension="xml" ContentType="application/xml"/>${imageTypes.map(({ extension, mimeType }) => `<Default Extension="${extension}" ContentType="${mimeType}"/>`).join("")}<Override PartName="/word/document.xml" ContentType="${DOCX_MEDIA_TYPE}.main+xml"/><Override PartName="/word/numbering.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.numbering+xml"/></Types>`);
+    zip.folder("_rels")?.file(".rels", `<?xml version="1.0" encoding="UTF-8"?><Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"><Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument" Target="word/document.xml"/></Relationships>`);
+    zip.folder("word")?.file("document.xml", serialized.documentXml);
+    zip.folder("word")?.file("numbering.xml", numberingXml());
+    serialized.media.forEach(({ filename, base64 }) => {
+        zip.folder("word")?.folder("media")?.file(filename, base64, { base64: true });
+    });
+    const relationships = serialized.relationships.map((relationship) => relationship.kind === "hyperlink"
+        ? `<Relationship Id="${relationship.id}" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/hyperlink" Target="${xmlEscape(relationship.target)}" TargetMode="External"/>`
+        : `<Relationship Id="${relationship.id}" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/image" Target="${relationship.target}"/>`).join("");
+    zip.folder("word")?.folder("_rels")?.file("document.xml.rels", `<?xml version="1.0" encoding="UTF-8"?><Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"><Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/numbering" Target="numbering.xml"/>${relationships}</Relationships>`);
+    return zip.generateAsync({ type: "blob", mimeType: DOCX_MEDIA_TYPE });
+};
+export const importDocxDocumentWithMammoth = async (arrayBuffer, ownerDocument) => {
+    // Mammoth's browser entry reads `arrayBuffer`, while its Node entry reads
+    // `buffer`. Supplying both keeps the adapter portable across bundlers/tests.
+    const result = await mammoth.convertToHtml({ arrayBuffer, buffer: arrayBuffer });
+    const html = restorePortableDocxAtoms(result.value, ownerDocument);
+    return normalizeSmartDocument(smartDocumentFromHtml(html, ownerDocument));
+};

package/dist/adapters/domBlockCommandBridge.d.ts

@@ -0,0 +1,19 @@
+import { type SetBlockTypeInput, type TextAlignment } from "smartrte-core";
+export type DomBlockCommand = {
+    id: "block-type.set";
+    input: Pick<SetBlockTypeInput, "type" | "level">;
+} | {
+    id: "alignment.set";
+    input: {
+        alignment: TextAlignment | null;
+    };
+} | {
+    id: "blockquote.toggle";
+} | {
+    id: "code-block.toggle";
+};
+/**
+ * Runs a core block command against a contiguous sibling run and replaces only
+ * that run. Returns null when the DOM shape needs a more specialized adapter.
+ */
+export declare const executeDomBlockCommand: (blocks: readonly HTMLElement[], command: DomBlockCommand) => HTMLElement[] | null;

package/dist/adapters/domBlockCommandBridge.js

@@ -0,0 +1,79 @@
+import { alignmentPlugin, blockquotePlugin, blockTypePlugin, codeBlockPlugin, createSmartEditor, } from "smartrte-core";
+import { serializeSmartDocument, smartDocumentFromHtml } from "./domSmartDocument.js";
+const pluginFor = (id) => {
+    if (id === "block-type.set")
+        return blockTypePlugin;
+    if (id === "alignment.set")
+        return alignmentPlugin;
+    if (id === "blockquote.toggle")
+        return blockquotePlugin;
+    return codeBlockPlugin;
+};
+const isContiguousSiblingRun = (blocks) => {
+    if (!blocks.length || !blocks[0].parentElement)
+        return false;
+    const parent = blocks[0].parentElement;
+    if (!blocks.every((block) => block.parentElement === parent))
+        return false;
+    const siblings = Array.from(parent.children);
+    const indexes = blocks.map((block) => siblings.indexOf(block));
+    return indexes.every((index, offset) => index >= 0 && (offset === 0 || index === indexes[offset - 1] + 1));
+};
+/**
+ * Runs a core block command against a contiguous sibling run and replaces only
+ * that run. Returns null when the DOM shape needs a more specialized adapter.
+ */
+export const executeDomBlockCommand = (blocks, command) => {
+    if (!isContiguousSiblingRun(blocks))
+        return null;
+    const ownerDocument = blocks[0].ownerDocument;
+    const document = smartDocumentFromHtml(blocks.map((block) => block.outerHTML).join(""), ownerDocument);
+    if (document.children.length !== blocks.length)
+        return null;
+    const indexes = document.children.map((_, index) => index);
+    const editor = createSmartEditor({
+        state: { document, selection: { type: "all" } },
+        plugins: [pluginFor(command.id)],
+    });
+    const input = command.id === "alignment.set"
+        ? { paths: indexes.map((index) => [index]), alignment: command.input.alignment }
+        : command.id === "block-type.set"
+            ? { parentPath: [], blockIndexes: indexes, ...command.input }
+            : { parentPath: [], blockIndexes: indexes };
+    if (!editor.execute(command.id, input))
+        return null;
+    const container = ownerDocument.createElement("div");
+    container.innerHTML = serializeSmartDocument(editor.state.document);
+    const replacements = Array.from(container.children);
+    if (!replacements.length)
+        return null;
+    if (command.id === "alignment.set" && replacements.length === blocks.length) {
+        replacements.forEach((replacement, index) => {
+            blocks[index].style.textAlign = replacement.style.textAlign;
+            if (!blocks[index].getAttribute("style"))
+                blocks[index].removeAttribute("style");
+        });
+        return [...blocks];
+    }
+    const parent = blocks[0].parentElement;
+    const reference = blocks[0];
+    replacements.forEach((replacement, index) => {
+        if (replacements.length === blocks.length) {
+            const previous = blocks[index];
+            const generatedAlignment = replacement.style.textAlign;
+            const previousStyle = previous.getAttribute("style");
+            const previousClass = previous.getAttribute("class");
+            if (previousStyle)
+                replacement.setAttribute("style", previousStyle);
+            if (generatedAlignment)
+                replacement.style.textAlign = generatedAlignment;
+            if (!replacement.getAttribute("style"))
+                replacement.removeAttribute("style");
+            if (previousClass)
+                replacement.setAttribute("class", previousClass);
+        }
+        parent.insertBefore(replacement, reference);
+    });
+    blocks.forEach((block) => block.remove());
+    return replacements;
+};

package/dist/adapters/domChecklistCommandBridge.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Validates and executes a checklist mutation through core, then projects the
+ * changed attribute onto the existing DOM item. Keeping the subtree in place
+ * preserves focus, selection, event targets, and framework-owned DOM identity.
+ */
+export declare const executeDomChecklistItemCommand: (list: HTMLElement, item: HTMLElement, checked?: boolean) => HTMLElement | null;

package/dist/adapters/domChecklistCommandBridge.js

@@ -0,0 +1,33 @@
+import { checklistPlugin, createSmartEditor, listPlugin } from "smartrte-core";
+import { smartDocumentFromHtml } from "./domSmartDocument.js";
+/**
+ * Validates and executes a checklist mutation through core, then projects the
+ * changed attribute onto the existing DOM item. Keeping the subtree in place
+ * preserves focus, selection, event targets, and framework-owned DOM identity.
+ */
+export const executeDomChecklistItemCommand = (list, item, checked) => {
+    if (list.dataset.srteChecklist !== "true" || item.parentElement !== list)
+        return null;
+    const items = Array.from(list.children).filter((child) => child instanceof HTMLElement && child.tagName === "LI");
+    const index = items.indexOf(item);
+    if (index < 0)
+        return null;
+    const document = smartDocumentFromHtml(list.outerHTML, list.ownerDocument);
+    if (document.children.length !== 1 || document.children[0].type !== "list")
+        return null;
+    const editor = createSmartEditor({
+        state: { document, selection: { type: "node", path: [0, index] } },
+        plugins: [listPlugin, checklistPlugin],
+    });
+    if (!editor.execute("checklist.set-checked", { path: [0, index], checked }))
+        return null;
+    const nextList = editor.state.document.children[0];
+    if (nextList.type !== "list")
+        return null;
+    const nextItem = nextList.children[index];
+    if (!nextItem || nextItem.type !== "listItem")
+        return null;
+    item.dataset.checked = nextItem.checked ? "true" : "false";
+    item.removeAttribute("data-srte-checked");
+    return list;
+};

package/dist/adapters/domCommandBridge.d.ts

@@ -0,0 +1,19 @@
+import { type SmartRtePlugin, type SmartSelection } from "smartrte-core";
+export interface DomCommandResult {
+    html: string;
+    selection: SmartSelection;
+}
+/**
+ * Executes one model command against the live editor boundary.
+ *
+ * The DOM is parsed once, the command runs entirely in core, and the resulting
+ * document replaces the DOM once. History and change emission remain owned by
+ * the React host until the complete editor runtime is migrated.
+ */
+export declare const executeDomCommand: <Input>(args: {
+    root: HTMLElement;
+    plugins: SmartRtePlugin[];
+    commandId: string;
+    input?: Input;
+    selection?: Selection | null;
+}) => DomCommandResult | null;

package/dist/adapters/domCommandBridge.js

@@ -0,0 +1,33 @@
+import { createSmartEditor, } from "smartrte-core";
+import { restoreSelectionToDom, selectionFromDom } from "./domSelectionBridge.js";
+import { serializeSmartDocument, smartDocumentFromEditorRoot, } from "./domSmartDocument.js";
+/**
+ * Executes one model command against the live editor boundary.
+ *
+ * The DOM is parsed once, the command runs entirely in core, and the resulting
+ * document replaces the DOM once. History and change emission remain owned by
+ * the React host until the complete editor runtime is migrated.
+ */
+export const executeDomCommand = (args) => {
+    // These nodes are not represented by SmartDocument yet. Falling back is
+    // mandatory so a supported command can never erase unsupported content.
+    if (args.root.querySelector("img,video,audio,iframe")) {
+        return null;
+    }
+    const selection = selectionFromDom(args.root, args.selection === undefined
+        ? args.root.ownerDocument.defaultView?.getSelection() || null
+        : args.selection);
+    if (!selection)
+        return null;
+    const { document } = smartDocumentFromEditorRoot(args.root);
+    const editor = createSmartEditor({
+        state: { document, selection },
+        plugins: args.plugins,
+    });
+    if (!editor.execute(args.commandId, args.input))
+        return null;
+    const html = serializeSmartDocument(editor.state.document);
+    args.root.innerHTML = html;
+    restoreSelectionToDom(args.root, editor.state.selection);
+    return { html, selection: editor.state.selection };
+};

package/dist/adapters/domInlineAtomCommandBridge.d.ts

@@ -0,0 +1,14 @@
+import { type Path } from "smartrte-core";
+export declare const inlineAtomPathFromDom: (root: HTMLElement, atom: HTMLElement) => Path | null;
+/**
+ * Runs deletion through the owning feature plugin and removes only the
+ * validated live atom. Caret placement remains a DOM-host responsibility.
+ */
+export declare const executeDomInlineAtomDelete: (root: HTMLElement, atom: HTMLElement) => boolean;
+export interface DomFormulaInput {
+    value: string;
+    displayText?: string;
+}
+/** Validates formula insertion through core, then projects only the new atom. */
+export declare const executeDomFormulaInsert: (root: HTMLElement, input: DomFormulaInput, domSelection?: Selection | null) => HTMLElement | null;
+export declare const adjacentInlineAtom: (range: Range, direction: "backward" | "forward") => HTMLElement | null;

package/dist/adapters/domInlineAtomCommandBridge.js

@@ -0,0 +1,101 @@
+import { createSmartEditor, formulaPlugin, getNodeAtPath, mediaPlugin, } from "smartrte-core";
+import { isEditorOnlyElement, pathForDomElement, selectionFromDom } from "./domSelectionBridge.js";
+import { smartDocumentFromEditorRoot } from "./domSmartDocument.js";
+const atomType = (element) => {
+    if (element.tagName.toLowerCase() === "img")
+        return "inlineImage";
+    if (element.hasAttribute("data-formula"))
+        return "formula";
+    return null;
+};
+const inlineUnits = (root) => {
+    const units = [];
+    const visit = (node) => {
+        if (node.nodeType === Node.TEXT_NODE) {
+            if (node.textContent)
+                units.push(node);
+            return;
+        }
+        if (!(node instanceof Element) || isEditorOnlyElement(node))
+            return;
+        if (atomType(node)) {
+            units.push(node);
+            return;
+        }
+        Array.from(node.childNodes).forEach(visit);
+    };
+    Array.from(root.childNodes).forEach(visit);
+    return units;
+};
+export const inlineAtomPathFromDom = (root, atom) => {
+    const leaf = atom.closest("p,h1,h2,h3,h4,h5,h6");
+    if (!leaf || !root.contains(leaf))
+        return null;
+    const leafPath = pathForDomElement(leaf, root);
+    const index = inlineUnits(leaf).indexOf(atom);
+    return leafPath && index >= 0 ? [...leafPath, index] : null;
+};
+/**
+ * Runs deletion through the owning feature plugin and removes only the
+ * validated live atom. Caret placement remains a DOM-host responsibility.
+ */
+export const executeDomInlineAtomDelete = (root, atom) => {
+    const type = atomType(atom);
+    const path = type && inlineAtomPathFromDom(root, atom);
+    if (!type || !path)
+        return false;
+    const selection = selectionFromDom(root, root.ownerDocument.defaultView?.getSelection() || null) || { type: "node", path };
+    const { document } = smartDocumentFromEditorRoot(root);
+    const editor = createSmartEditor({
+        state: { document, selection },
+        plugins: type === "formula" ? [formulaPlugin] : [mediaPlugin],
+    });
+    const command = type === "formula" ? "formula.delete" : "image.delete-inline";
+    if (!editor.execute(command, { path }))
+        return false;
+    atom.remove();
+    return true;
+};
+/** Validates formula insertion through core, then projects only the new atom. */
+export const executeDomFormulaInsert = (root, input, domSelection = root.ownerDocument.defaultView?.getSelection() || null) => {
+    if (!domSelection?.rangeCount || !domSelection.isCollapsed)
+        return null;
+    const modelSelection = selectionFromDom(root, domSelection);
+    if (!modelSelection)
+        return null;
+    const { document } = smartDocumentFromEditorRoot(root);
+    const editor = createSmartEditor({
+        state: { document, selection: modelSelection },
+        plugins: [formulaPlugin],
+    });
+    if (!editor.execute("formula.insert", input))
+        return null;
+    const selectionAfter = editor.state.selection;
+    if (selectionAfter.type !== "text")
+        return null;
+    const formulaPath = [
+        ...selectionAfter.anchor.path.slice(0, -1),
+        selectionAfter.anchor.path[selectionAfter.anchor.path.length - 1] - 1,
+    ];
+    const atom = getNodeAtPath(editor.state.document, formulaPath);
+    if (atom?.type !== "formula")
+        return null;
+    const range = domSelection.getRangeAt(0);
+    const span = root.ownerDocument.createElement("span");
+    span.dataset.formula = atom.value;
+    span.textContent = atom.displayText ?? atom.value;
+    range.insertNode(span);
+    range.setStartAfter(span);
+    range.collapse(true);
+    domSelection.removeAllRanges();
+    domSelection.addRange(range);
+    return span;
+};
+export const adjacentInlineAtom = (range, direction) => {
+    if (!range.collapsed || range.startContainer.nodeType !== Node.ELEMENT_NODE)
+        return null;
+    const container = range.startContainer;
+    const index = direction === "backward" ? range.startOffset - 1 : range.startOffset;
+    const candidate = container.childNodes[index];
+    return candidate instanceof HTMLElement && atomType(candidate) ? candidate : null;
+};

package/dist/adapters/domInlineImageCommandBridge.d.ts

@@ -0,0 +1,14 @@
+export interface DomInlineImageInput {
+    src: string;
+    alt?: string;
+    title?: string;
+    width?: number;
+    height?: number;
+}
+/**
+ * Executes inline image insertion through core and projects only the resulting
+ * atom into the existing DOM range. Unrelated DOM and metadata stay untouched.
+ */
+export declare const executeDomInlineImageCommand: (root: HTMLElement, input: DomInlineImageInput, domSelection?: Selection | null) => HTMLImageElement | null;
+/** Validates an inline image attribute update through core, then mutates it in place. */
+export declare const executeDomInlineImageUpdate: (root: HTMLElement, image: HTMLImageElement, input: Omit<DomInlineImageInput, "src">) => boolean;