@lapismd/mira 0.0.1

package/dist/preview/preview.test.js

@@ -0,0 +1,124 @@
+import { describe, expect, it } from "vitest";
+import remarkGridTables from "@adobe/remark-gridtables";
+import rehypeRaw from "rehype-raw";
+import rehypeSanitize, { defaultSchema } from "rehype-sanitize";
+import remarkEmoji from "remark-emoji";
+import remarkGfm from "remark-gfm";
+import { TYPE_TABLE, mdast2hastGridTablesHandler, } from "@adobe/mdast-util-gridtables";
+import { remarkHeadings, remarkWikiLinks } from "./remark";
+import { createParser } from "./renderer/utils";
+import { findElement } from "./test-utils";
+describe("preview exports", () => {
+    it("exports built-in remark plugins", () => {
+        expect(typeof remarkWikiLinks).toBe("function");
+    });
+});
+describe("Carta markdown parity", () => {
+    const dataPng = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
+    it("renders reference-style base64 embedded images", () => {
+        const parser = createParser([remarkGfm]);
+        const ast = parser([
+            "Here is my embedded image: ![Alt Text][my-image]",
+            "",
+            "And the document continues normally here.",
+            "",
+            `[my-image]: ${dataPng}`,
+        ].join("\n"));
+        const image = findElement(ast, "img");
+        expect(image?.properties?.src).toBe(dataPng);
+        expect(image?.properties?.alt).toBe("Alt Text");
+        expect(JSON.stringify(ast)).toContain("And the document continues normally here.");
+    });
+    it("renders inline base64 images", () => {
+        const parser = createParser([remarkGfm]);
+        const ast = parser(`![Alt Text](${dataPng})`);
+        const image = findElement(ast, "img");
+        expect(image?.properties?.src).toBe(dataPng);
+    });
+    it("adds stable heading ids when enabled", () => {
+        const parser = createParser([
+            [remarkHeadings, { ids: true, prefix: "doc-" }],
+        ]);
+        const ast = parser(["# Title", "", "# Title"].join("\n"));
+        const headings = ast.children.filter((node) => node.type === "element" && node.tagName === "h1");
+        expect(headings[0]?.properties?.id).toBe("doc-title");
+        expect(headings[1]?.properties?.id).toBe("doc-title-1");
+    });
+    it("supports opt-in emoji shortcodes", () => {
+        const parser = createParser([remarkEmoji]);
+        const ast = parser("Ship it :rocket:");
+        expect(JSON.stringify(ast)).toContain("🚀");
+    });
+    it("sanitizes raw HTML in safe mode while preserving data images", () => {
+        const parser = createParser([], [
+            rehypeRaw,
+            [
+                rehypeSanitize,
+                {
+                    ...defaultSchema,
+                    attributes: {
+                        ...defaultSchema.attributes,
+                        img: [...(defaultSchema.attributes?.img ?? []), "src", "alt"],
+                    },
+                    protocols: {
+                        ...defaultSchema.protocols,
+                        src: ["http", "https", "data"],
+                    },
+                },
+            ],
+        ], { allowDangerousHtml: true });
+        const ast = parser(`<img src="${dataPng}" onerror="alert(1)" alt="ok"><script>alert(1)</script>`);
+        const image = findElement(ast, "img");
+        expect(image?.properties?.src).toBe(dataPng);
+        expect(image?.properties?.onerror).toBeUndefined();
+        expect(JSON.stringify(ast)).not.toContain("script");
+    });
+});
+describe("grid table rendering", () => {
+    it("renders Adobe grid tables through the preview pipeline", () => {
+        const parser = createParser([remarkGridTables], [], {
+            allowDangerousHtml: true,
+            handlers: {
+                [TYPE_TABLE]: mdast2hastGridTablesHandler(),
+            },
+        });
+        const ast = parser([
+            "+---------+----------+",
+            "| Feature | Behavior |",
+            "+=========+==========+",
+            "| Menus   | Actions  |",
+            "+---------+----------+",
+        ].join("\n"));
+        expect(findElement(ast, "table")).toBeDefined();
+        expect(JSON.stringify(ast)).toContain("Feature");
+    });
+});
+describe("renderer prop normalization", () => {
+    it("normalizes props added by rehype plugins", () => {
+        const parser = createParser([], [
+            () => (tree) => {
+                const root = tree;
+                const paragraph = root.children[0];
+                paragraph.properties = {
+                    className: ["from-plugin"],
+                    ariaDescribedBy: "details",
+                    ariaSelected: true,
+                    colSpan: 2,
+                    dataSourceOffset: 4,
+                    rowSpan: 3,
+                };
+            },
+        ]);
+        const ast = parser("Hello");
+        const paragraph = ast.children[0];
+        expect(paragraph.properties?.class).toBe("from-plugin");
+        expect(paragraph.properties?.["aria-describedby"]).toBe("details");
+        expect(paragraph.properties?.["aria-selected"]).toBe(true);
+        expect(paragraph.properties?.colspan).toBe(2);
+        expect(paragraph.properties?.["data-source-offset"]).toBe(4);
+        expect(paragraph.properties?.rowspan).toBe(3);
+        expect(paragraph.properties?.className).toBeUndefined();
+        expect(paragraph.properties?.colSpan).toBeUndefined();
+        expect(paragraph.properties?.rowSpan).toBeUndefined();
+    });
+});

package/dist/preview/rehype-code-context.d.ts

@@ -0,0 +1,5 @@
+import type { Root } from "hast";
+import type { Plugin } from "unified";
+export declare const rehypeCodeContext: Plugin<[], Root>;
+export default rehypeCodeContext;
+//# sourceMappingURL=rehype-code-context.d.ts.map

package/dist/preview/rehype-code-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rehype-code-context.d.ts","sourceRoot":"","sources":["../../src/preview/rehype-code-context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAW,IAAI,EAAE,MAAM,MAAM,CAAC;AAC1C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAGtC,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,EAAE,EAAE,IAAI,CAgB9C,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/preview/rehype-code-context.js

@@ -0,0 +1,17 @@
+import { toText } from "hast-util-to-text";
+import { visit } from "unist-util-visit";
+export const rehypeCodeContext = () => {
+    return (tree) => {
+        visit(tree, "element", (node, _index, parent) => {
+            if (node.tagName !== "code" ||
+                !parent ||
+                parent.type !== "element" ||
+                parent.tagName !== "pre") {
+                return;
+            }
+            node.properties ??= {};
+            node.properties.code = toText(node, { whitespace: "pre" });
+        });
+    };
+};
+export default rehypeCodeContext;

package/dist/preview/rehype-highlight-lines.d.ts

@@ -0,0 +1,9 @@
+import type { Root } from "hast";
+import type { Plugin } from "unified";
+type HighlightLinesOptions = {
+    showLineNumbers?: boolean;
+    keepOuterBlankLine?: boolean;
+};
+export declare const rehypeHighlightLines: Plugin<[HighlightLinesOptions?], Root>;
+export {};
+//# sourceMappingURL=rehype-highlight-lines.d.ts.map

package/dist/preview/rehype-highlight-lines.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rehype-highlight-lines.d.ts","sourceRoot":"","sources":["../../src/preview/rehype-highlight-lines.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAA2B,IAAI,EAAQ,MAAM,MAAM,CAAC;AAChE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAGtC,KAAK,qBAAqB,GAAG;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAKF,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,CAAC,qBAAqB,CAAC,CAAC,EAAE,IAAI,CAiGvE,CAAC"}

package/dist/preview/rehype-highlight-lines.js

@@ -0,0 +1,257 @@
+import { visit } from "unist-util-visit";
+const lineBreaks = /\r?\n|\r/g;
+const leadingLineBreaks = /^(\r?\n|\r)+/;
+export const rehypeHighlightLines = (options = {}) => {
+    const showLineNumbers = options.showLineNumbers ?? false;
+    const keepOuterBlankLine = options.keepOuterBlankLine ?? false;
+    return (tree) => {
+        visit(tree, "element", (code, index, parent) => {
+            if (index === undefined ||
+                !parent ||
+                code.tagName !== "code" ||
+                parent.type !== "element" ||
+                parent.tagName !== "pre") {
+                return;
+            }
+            if (!Array.isArray(code.properties.className) &&
+                code.properties.className !== undefined) {
+                return;
+            }
+            const meta = String(code.data?.meta ?? code.properties.metastring ?? "").toLowerCase();
+            const classNames = code.properties.className;
+            const directives = classNames
+                ?.map((className) => className.toLowerCase().replaceAll("-", ""))
+                .filter((className) => [
+                "showlinenumbers",
+                "numberlines",
+                "linenumbers",
+                "nolinenumbers",
+                "keepouterblankline",
+            ].includes(className));
+            const noLineNumbers = meta.includes("nolinenumbers") ||
+                Boolean(directives?.includes("nolinenumbers"));
+            const lineNumberStart = getLineNumberStart(meta, code.properties.dataStartNumbering);
+            const lineNumbering = !noLineNumbers &&
+                (lineNumberStart ??
+                    (showLineNumbers ||
+                        ["showlinenumbers", "numberlines", "linenumbers"].some((keyword) => meta.includes(keyword) || directives?.includes(keyword))
+                        ? true
+                        : false));
+            const highlightedLines = [
+                ...parseMetaHighlightedLines(meta),
+                ...parseRange(String(code.properties.dataHighlightLines ?? "")),
+            ];
+            const keepOuterBlank = keepOuterBlankLine ||
+                meta.includes("keepouterblankline") ||
+                Boolean(directives?.includes("keepouterblankline"));
+            code.properties.className = classNames?.filter((className) => ![
+                "showlinenumbers",
+                "numberlines",
+                "linenumbers",
+                "nolinenumbers",
+                "keepouterblankline",
+            ].includes(className.toLowerCase().replaceAll("-", "")));
+            if (!code.properties.className?.length) {
+                code.properties.className = undefined;
+            }
+            code.properties.dataStartNumbering = undefined;
+            code.properties.dataHighlightLines = undefined;
+            code.properties.metastring = undefined;
+            if (lineNumbering === false && highlightedLines.length === 0) {
+                return;
+            }
+            wrapCodeLines(code, {
+                highlightedLines,
+                keepOuterBlank,
+                lineNumbering,
+            });
+            code.properties["data-muted"] = String(meta.includes("muted"));
+        });
+    };
+};
+function getLineNumberStart(meta, propertyValue) {
+    const metaStart = /(showlinenumbers|numberlines|linenumbers)=(?<start>\d+)/u.exec(meta)
+        ?.groups?.start;
+    const propertyStart = String(propertyValue ?? "");
+    const value = Number(metaStart ?? propertyStart);
+    return Number.isFinite(value) && value > 0 ? value : undefined;
+}
+function parseMetaHighlightedLines(meta) {
+    return parseRange(/\{(?<lines>[\d\s,-]+)\}/u.exec(meta)?.groups?.lines ?? "");
+}
+function parseRange(value) {
+    const result = [];
+    for (const part of value.split(",").map((item) => item.trim())) {
+        if (/^-?\d+$/u.test(part)) {
+            result.push(Number.parseInt(part, 10));
+            continue;
+        }
+        const match = /^(-?\d+)(-|\.\.\.?|\u2025|\u2026|\u22EF)(-?\d+)$/u.exec(part);
+        if (!match) {
+            continue;
+        }
+        const start = Number.parseInt(match[1], 10);
+        let end = Number.parseInt(match[3], 10);
+        const increment = start < end ? 1 : -1;
+        if (match[2] === "-" || match[2] === ".." || match[2] === "\u2025") {
+            end += increment;
+        }
+        for (let index = start; index !== end; index += increment) {
+            result.push(index);
+        }
+    }
+    return result;
+}
+function wrapCodeLines(code, options) {
+    flattenCodeTree(code);
+    splitLeadingLineBreak(code);
+    splitMultilineTextChildren(code);
+    const replacement = [];
+    let start = 0;
+    let textRemainder = "";
+    let lineNumber = 0;
+    for (let index = 0; index < code.children.length; index += 1) {
+        const child = code.children[index];
+        if (child?.type !== "text") {
+            continue;
+        }
+        let textStart = 0;
+        const matches = Array.from(child.value.matchAll(lineBreaks));
+        for (const [iteration, match] of matches.entries()) {
+            const line = code.children.slice(start, index);
+            if (textRemainder) {
+                line.unshift({ type: "text", value: textRemainder });
+                textRemainder = "";
+            }
+            if ((match.index ?? 0) > textStart) {
+                line.push({
+                    type: "text",
+                    value: child.value.slice(textStart, match.index),
+                });
+            }
+            const isFirst = index === 0 && iteration === 0;
+            const isLast = index === code.children.length - 1 && iteration === matches.length - 1;
+            if (!((isFirst || isLast) && !options.keepOuterBlank && line.length === 0)) {
+                replacement.push(createCodeLine(line, ++lineNumber, options), {
+                    type: "text",
+                    value: match[0],
+                });
+            }
+            start = index + 1;
+            textStart = (match.index ?? 0) + match[0].length;
+        }
+        if (start === index + 1) {
+            textRemainder = child.value.slice(textStart);
+        }
+    }
+    const remainingLine = code.children.slice(start);
+    if (textRemainder) {
+        remainingLine.unshift({ type: "text", value: textRemainder });
+    }
+    if (remainingLine.length > 0) {
+        if (remainingLine[0]?.type === "text" &&
+            remainingLine[0].value.trim() === "") {
+            replacement.push(...remainingLine);
+        }
+        else {
+            replacement.push(createCodeLine(remainingLine, ++lineNumber, options));
+        }
+    }
+    code.children = replacement;
+    code.properties.style = `--numbered-code-line-size: ${String(lineNumber + 1).length}`;
+}
+function createCodeLine(children, lineNumber, options) {
+    return {
+        type: "element",
+        tagName: "span",
+        children,
+        properties: {
+            className: [
+                "code-line",
+                options.lineNumbering || options.lineNumbering === 0
+                    ? "numbered-code-line"
+                    : "",
+                options.highlightedLines.includes(lineNumber)
+                    ? "highlighted-code-line"
+                    : "",
+            ].filter(Boolean),
+            dataLineNumber: typeof options.lineNumbering === "number"
+                ? options.lineNumbering - 1 + lineNumber
+                : options.lineNumbering
+                    ? lineNumber
+                    : undefined,
+        },
+    };
+}
+function flattenCodeTree(code) {
+    const next = [];
+    for (const child of code.children) {
+        if (child.type !== "element") {
+            next.push(child);
+            continue;
+        }
+        const className = child.properties.className;
+        const classes = Array.isArray(className)
+            ? className.map(String)
+            : className
+                ? [String(className)]
+                : [];
+        if (child.children.length === 1 && child.children[0]?.type !== "element") {
+            next.push(child);
+            continue;
+        }
+        const nested = child;
+        flattenCodeTree(nested);
+        for (const nestedChild of nested.children) {
+            if (nestedChild.type === "element") {
+                nestedChild.properties.className = [
+                    ...classes,
+                    ...(Array.isArray(nestedChild.properties.className)
+                        ? nestedChild.properties.className.map(String)
+                        : []),
+                ];
+            }
+            next.push(nestedChild);
+        }
+    }
+    code.children = next;
+}
+function splitLeadingLineBreak(code) {
+    const first = code.children[0];
+    if (!isElementWithText(first)) {
+        return;
+    }
+    const match = leadingLineBreaks.exec(first.children[0].value);
+    if (!match) {
+        return;
+    }
+    code.children.unshift({ type: "text", value: match[0] });
+    first.children[0].value = first.children[0].value.slice(match[0].length);
+}
+function splitMultilineTextChildren(code) {
+    for (let index = 0; index < code.children.length; index += 1) {
+        const child = code.children[index];
+        if (!isElementWithText(child) ||
+            !lineBreaks.test(child.children[0].value)) {
+            continue;
+        }
+        const chunks = child.children[0].value.split(lineBreaks);
+        const replacement = [];
+        for (let chunkIndex = 0; chunkIndex < chunks.length; chunkIndex += 1) {
+            const nextChild = {
+                ...child,
+                children: [{ type: "text", value: chunks[chunkIndex] ?? "" }],
+            };
+            replacement.push(nextChild);
+            if (chunkIndex < chunks.length - 1) {
+                replacement.push({ type: "text", value: "\n" });
+            }
+        }
+        code.children.splice(index, 1, ...replacement);
+    }
+}
+function isElementWithText(node) {
+    return (node?.type === "element" &&
+        node.children.length === 1 &&
+        node.children[0]?.type === "text");
+}

package/dist/preview/rehype-table-spans.d.ts

@@ -0,0 +1,4 @@
+import type { Root } from "hast";
+import type { Plugin } from "unified";
+export declare const rehypeTableSpans: Plugin<[], Root>;
+//# sourceMappingURL=rehype-table-spans.d.ts.map

package/dist/preview/rehype-table-spans.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rehype-table-spans.d.ts","sourceRoot":"","sources":["../../src/preview/rehype-table-spans.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAW,IAAI,EAAE,MAAM,MAAM,CAAC;AAC1C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAGtC,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,EAAE,EAAE,IAAI,CAU7C,CAAC"}

package/dist/preview/rehype-table-spans.js

@@ -0,0 +1,120 @@
+import { visit } from "unist-util-visit";
+export const rehypeTableSpans = () => {
+    return (tree) => {
+        visit(tree, "element", (node) => {
+            if (node.tagName !== "table") {
+                return;
+            }
+            removeGeneratedTableSpanPadding(node);
+        });
+    };
+};
+function removeGeneratedTableSpanPadding(table) {
+    const headerRow = findFirstRow(table, "thead");
+    const expectedColumnCount = headerRow
+        ? tableRowColumnCount(headerRow)
+        : tableRowColumnCount(findFirstRow(table));
+    if (expectedColumnCount <= 0) {
+        return;
+    }
+    const activeRowspans = [];
+    for (const row of tableRows(table)) {
+        while (activeRowspanColumnCount(activeRowspans) + tableRowColumnCount(row) >
+            expectedColumnCount) {
+            const removableCell = findLastEmptyCell(row);
+            if (!removableCell) {
+                break;
+            }
+            row.children.splice(row.children.indexOf(removableCell), 1);
+        }
+        applyRowspans(row, activeRowspans);
+        decrementActiveRowspans(activeRowspans);
+    }
+}
+function findFirstRow(table, sectionTagName) {
+    if (sectionTagName) {
+        const section = elementChildren(table).find((child) => child.tagName === sectionTagName);
+        if (!section) {
+            return null;
+        }
+        return (elementChildren(section).find((child) => child.tagName === "tr") ?? null);
+    }
+    return tableRows(table)[0] ?? null;
+}
+function tableRows(table) {
+    const rows = [];
+    for (const child of elementChildren(table)) {
+        if (child.tagName === "tr") {
+            rows.push(child);
+        }
+        else if (["thead", "tbody", "tfoot"].includes(child.tagName)) {
+            rows.push(...elementChildren(child).filter((row) => row.tagName === "tr"));
+        }
+    }
+    return rows;
+}
+function tableRowColumnCount(row) {
+    if (!row) {
+        return 0;
+    }
+    return tableCells(row).reduce((count, cell) => count + numericProperty(cell, "colSpan", "colspan"), 0);
+}
+function tableCells(row) {
+    return elementChildren(row).filter((child) => ["td", "th"].includes(child.tagName));
+}
+function activeRowspanColumnCount(activeRowspans) {
+    return activeRowspans.filter((rowspan) => rowspan > 0).length;
+}
+function applyRowspans(row, activeRowspans) {
+    let columnIndex = 0;
+    for (const cell of tableCells(row)) {
+        while ((activeRowspans[columnIndex] ?? 0) > 0) {
+            columnIndex += 1;
+        }
+        const colspan = numericProperty(cell, "colSpan", "colspan");
+        const rowspan = numericProperty(cell, "rowSpan", "rowspan");
+        if (rowspan > 1) {
+            for (let offset = 0; offset < colspan; offset += 1) {
+                activeRowspans[columnIndex + offset] = Math.max(activeRowspans[columnIndex + offset] ?? 0, rowspan);
+            }
+        }
+        columnIndex += colspan;
+    }
+}
+function decrementActiveRowspans(activeRowspans) {
+    for (let index = 0; index < activeRowspans.length; index += 1) {
+        const rowspan = activeRowspans[index] ?? 0;
+        if (rowspan > 0) {
+            activeRowspans[index] = rowspan - 1;
+        }
+    }
+}
+function findLastEmptyCell(row) {
+    const cells = tableCells(row);
+    for (let index = cells.length - 1; index >= 0; index -= 1) {
+        const cell = cells[index];
+        if (!cell) {
+            continue;
+        }
+        if (tableCellIsEmpty(cell)) {
+            return cell;
+        }
+    }
+    return null;
+}
+function tableCellIsEmpty(cell) {
+    return !cell.children.some((child) => {
+        if (child.type === "text") {
+            return child.value.trim().length > 0;
+        }
+        return true;
+    });
+}
+function elementChildren(node) {
+    return (node.children ?? []).filter((child) => child.type === "element");
+}
+function numericProperty(element, camelCaseName, lowercaseName) {
+    const value = element.properties?.[camelCaseName] ?? element.properties?.[lowercaseName];
+    const numericValue = typeof value === "number" ? value : Number.parseInt(String(value ?? 1), 10);
+    return Number.isFinite(numericValue) && numericValue > 0 ? numericValue : 1;
+}

package/dist/preview/remark/callouts.d.ts

@@ -0,0 +1,4 @@
+import type { Root } from "mdast";
+import type { Plugin } from "unified";
+export declare const remarkCallouts: Plugin<[], Root>;
+//# sourceMappingURL=callouts.d.ts.map

package/dist/preview/remark/callouts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"callouts.d.ts","sourceRoot":"","sources":["../../../src/preview/remark/callouts.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAyB,IAAI,EAAQ,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAGtC,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,EAAE,EAAE,IAAI,CAqD3C,CAAC"}

package/dist/preview/remark/callouts.js

@@ -0,0 +1,81 @@
+import { visit } from "unist-util-visit";
+export const remarkCallouts = () => {
+    return (tree) => {
+        visit(tree, "blockquote", (node) => {
+            const first = node.children[0];
+            const firstText = first?.children?.[0];
+            if (!first || first.type !== "paragraph" || firstText?.type !== "text") {
+                return;
+            }
+            const [firstLine = "", ...remainingLines] = firstText.value.split(/\r?\n/);
+            const match = firstLine.match(/^\[!([\w-]+)]([+-]?)[ \t]*(.*)$/);
+            if (!match) {
+                return;
+            }
+            const calloutType = (match[1] ?? "note").toLowerCase();
+            const collapsible = match[2] ?? "";
+            const calloutTitle = match[3]?.trim() || defaultCalloutTitle(calloutType);
+            const markerOffset = typeof firstText.position?.start.offset === "number"
+                ? firstText.position.start.offset +
+                    firstLine.indexOf(collapsible || "]") +
+                    (collapsible ? 0 : 1)
+                : -1;
+            const remainingText = remainingLines.join("\n");
+            if (remainingText.trim()) {
+                firstText.value = remainingText;
+            }
+            else {
+                first.children = first.children.filter((child) => child !== firstText);
+            }
+            if (!first.children.length) {
+                node.children = node.children.filter((child) => child !== first);
+            }
+            node.data = {
+                ...(node.data ?? {}),
+                hName: "callout",
+                hProperties: {
+                    "data-callout": calloutType,
+                    "data-expand-offset": markerOffset,
+                    "data-expandable": (collapsible.length > 0).toString(),
+                    "data-expanded": (collapsible === "+").toString(),
+                    "data-icon": calloutIcons[calloutType] ?? "info",
+                    "data-type": calloutType,
+                    title: calloutTitle,
+                    type: calloutType,
+                },
+            };
+        });
+    };
+};
+const calloutIcons = {
+    abstract: "clipboard-list",
+    attention: "triangle-alert",
+    bug: "bug",
+    caution: "triangle-alert",
+    check: "check",
+    cite: "bookmark",
+    danger: "zap",
+    done: "check",
+    error: "zap",
+    example: "list",
+    fail: "x",
+    failure: "x",
+    faq: "circle-help",
+    help: "circle-help",
+    hint: "flame",
+    important: "flame",
+    info: "info",
+    missing: "x",
+    note: "pencil",
+    question: "circle-help",
+    quote: "quote",
+    success: "check",
+    summary: "clipboard-list",
+    tip: "flame",
+    tldr: "clipboard-list",
+    todo: "circle-check",
+    warning: "triangle-alert",
+};
+function defaultCalloutTitle(type) {
+    return `${type.slice(0, 1).toUpperCase()}${type.slice(1)}`;
+}

package/dist/preview/remark/callouts.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=callouts.test.d.ts.map

package/dist/preview/remark/callouts.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"callouts.test.d.ts","sourceRoot":"","sources":["../../../src/preview/remark/callouts.test.ts"],"names":[],"mappings":""}

package/dist/preview/remark/callouts.test.js

@@ -0,0 +1,23 @@
+import { describe, expect, it } from "vitest";
+import { createParser } from "../renderer/utils";
+import { remarkPositionsToData } from "./hast";
+import { remarkCallouts } from "./callouts";
+describe("callout rendering", () => {
+    it("turns Obsidian callout blockquotes into callout elements", () => {
+        const parser = createParser([remarkCallouts]);
+        const ast = parser("> [!note] Portable package boundary\n> The editor works.");
+        const callout = ast.children.find((node) => node.type === "element" && node.tagName === "callout");
+        expect(callout?.properties?.["data-callout"]).toBe("note");
+        expect(callout?.properties?.["data-icon"]).toBe("pencil");
+        expect(callout?.properties?.title).toBe("Portable package boundary");
+        expect(JSON.stringify(callout)).not.toContain("[!note]");
+    });
+    it("preserves collapsible callout state", () => {
+        const parser = createParser([remarkCallouts, remarkPositionsToData]);
+        const ast = parser("> [!warning]- Heads up\n> Hidden.");
+        const callout = ast.children.find((node) => node.type === "element" && node.tagName === "callout");
+        expect(callout?.properties?.["data-expandable"]).toBe("true");
+        expect(callout?.properties?.["data-expanded"]).toBe("false");
+        expect(Number(callout?.properties?.["data-expand-offset"])).toBeGreaterThan(0);
+    });
+});