@charcuterie/ui 4.19.0 → 4.20.1

package/README.md

@@ -329,3 +329,5 @@ rename breaks only the rendered page).
    source and fails on this, so the component M4 adds joins the rule automatically.
 
 **`Chart`** provides responsive bar and line plots, negative values, gaps for missing data, and an optional semantic values table. TanStack provides hover/touch tooltips, keyboard navigation, and transitions with reduced-motion support. Set `renderer="portable"` for the lightweight fallback. The `@charcuterie/logic/charts`, `/charts/preact`, and `/charts/react` subpaths expose static and framework-specific surfaces; `/core` remains dependency-free. Apps supply their own series, labels, and semantic colors.
+
+**HTML notes** use optional `@charcuterie/ui/html-view` and `/html-editor` entries: `HtmlView` renders a safe document projection and `HtmlEditor` preserves original HTML until a real edit. The existing markdown editors keep their markdown-only storage contracts.

package/dist/htmlEditor/HtmlEditor.d.ts

@@ -0,0 +1,25 @@
+import type { ReactNode } from "react";
+import type { SlotProps } from "../slotProps.ts";
+export type HtmlEditorProps = SlotProps & {
+    className?: string;
+    /** Initial only. Remount with a key to switch documents. */
+    defaultValue?: string;
+    icons?: Readonly<Record<string, ReactNode>>;
+    isDisabled?: boolean;
+    isReadOnly?: boolean;
+    /** Omit inside a Field, which supplies the real label. */
+    label?: string;
+    /** Hidden form control; its original bytes survive until an edit. */
+    name?: string;
+    onChange?: (value: string) => void;
+    toolbarLabel?: string;
+};
+/**
+ * A rich editor for records already stored as HTML. Sanitization is
+ * a projection for display and editing, not a migration: mounting,
+ * selecting, focusing and submitting an untouched form never emit
+ * normalized HTML. ProseMirror owns document edits and their undo
+ * history; external defaults never replace that document.
+ */
+export declare const HtmlEditor: ({ className, defaultValue, icons, isDisabled, isReadOnly, label, name, onChange, toolbarLabel, ...slotProps }: HtmlEditorProps) => ReactNode;
+//# sourceMappingURL=HtmlEditor.d.ts.map

package/dist/htmlEditor/HtmlEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlEditor.d.ts","sourceRoot":"","sources":["../../src/htmlEditor/HtmlEditor.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWtC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAOhD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,4DAA4D;IAC5D,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAA;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,0DAA0D;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,qEAAqE;IACrE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAaD;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,GAAI,+GAWxB,eAAe,KAAG,SA8VpB,CAAA"}

package/dist/htmlEditor/HtmlEditor.js

@@ -0,0 +1,233 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useUniqueId } from "@charcuterie/logic";
+import Image from "@tiptap/extension-image";
+import TextAlign from "@tiptap/extension-text-align";
+import { Color, TextStyle, } from "@tiptap/extension-text-style";
+import { EditorContent, useEditor } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import { useEffect, useRef, useState } from "react";
+import { Button } from "../Button/Button.js";
+import { Dialog } from "../Dialog/Dialog.js";
+import { Field } from "../Field/Field.js";
+import { FOCUS_RING_CLASS } from "../intentStyles.js";
+import { toSafeImageUrl, toSafeLinkUrl, } from "../safeUrls.js";
+import { Toolbar } from "../Toolbar/Toolbar.js";
+import { toClassName } from "../toClassName.js";
+import { HTML_CONTENT_CLASS } from "./htmlContentStyles.js";
+import { toSafeHtml, toSafeHtmlColour } from "./safeHtml.js";
+const EDITOR_CLASS = toClassName(HTML_CONTENT_CLASS, "min-h-40 rounded-md border border-border-default bg-surface-sunken px-3 py-2", FOCUS_RING_CLASS);
+const INPUT_CLASS = toClassName("w-full min-w-0 rounded-md border border-border-default bg-surface-sunken p-2 text-content-primary", FOCUS_RING_CLASS);
+/**
+ * A rich editor for records already stored as HTML. Sanitization is
+ * a projection for display and editing, not a migration: mounting,
+ * selecting, focusing and submitting an untouched form never emit
+ * normalized HTML. ProseMirror owns document edits and their undo
+ * history; external defaults never replace that document.
+ */
+export const HtmlEditor = ({ className, defaultValue = "", icons, isDisabled = false, isReadOnly = false, label, name, onChange, toolbarLabel = "HTML formatting", ...slotProps }) => {
+    const generatedId = useUniqueId("html-editor");
+    const dialogInputRef = useRef(null);
+    const id = slotProps.id ?? generatedId;
+    const [initialValue] = useState(defaultValue);
+    const [formValue, setFormValue] = useState(initialValue);
+    const [dialog, setDialog] = useState(null);
+    const [error, setError] = useState();
+    const editor = useEditor({
+        content: toSafeHtml(initialValue),
+        editable: !isDisabled && !isReadOnly,
+        immediatelyRender: false,
+        shouldRerenderOnTransaction: true,
+        extensions: [
+            StarterKit.configure({
+                link: {
+                    openOnClick: false,
+                    autolink: false,
+                    isAllowedUri: (url) => toSafeLinkUrl(url) !== undefined,
+                },
+            }),
+            Image.configure({ allowBase64: true }),
+            TextStyle,
+            Color,
+            TextAlign.configure({
+                types: ["heading", "paragraph"],
+                alignments: [
+                    "start",
+                    "end",
+                    "left",
+                    "right",
+                    "center",
+                    "justify",
+                ],
+            }),
+        ],
+        editorProps: {
+            attributes: {
+                id,
+                role: "textbox",
+                "aria-multiline": "true",
+                "aria-label": label ?? "",
+                "aria-labelledby": label === undefined && slotProps.id
+                    ? `${slotProps.id}-label`
+                    : "",
+                "aria-describedby": slotProps["aria-describedby"] ?? "",
+                "aria-invalid": String(slotProps["aria-invalid"] ?? false),
+                "aria-required": String(slotProps["aria-required"] ??
+                    slotProps.required ??
+                    false),
+                "aria-disabled": String(isDisabled),
+                "aria-readonly": String(isReadOnly),
+                tabindex: String(isDisabled ? -1 : 0),
+                class: EDITOR_CLASS,
+            },
+            transformPastedHTML: toSafeHtml,
+        },
+        onUpdate: ({ editor: changedEditor, transaction, }) => {
+            if (!transaction.docChanged)
+                return;
+            const next = toSafeHtml(changedEditor.getHTML());
+            setFormValue(next);
+            onChange?.(next);
+        },
+    }, []);
+    useEffect(() => {
+        editor?.setEditable(!isDisabled && !isReadOnly, false);
+    }, [editor, isDisabled, isReadOnly]);
+    const hasDisabledActions = isDisabled || isReadOnly || !editor;
+    const openDialog = (next) => {
+        setError(undefined);
+        setDialog(next);
+    };
+    const toggle = (key, title, onSelect, isPressed) => ({
+        key,
+        type: "control",
+        element: (_jsx(Button, { appearance: "ghost", "aria-pressed": isPressed, iconStart: icons?.[key], isDisabled: hasDisabledActions, onClick: onSelect, children: title })),
+    });
+    const action = (key, title, onSelect) => ({
+        key,
+        label: title,
+        icon: icons?.[key],
+        isDisabled: hasDisabledActions,
+        onSelect,
+    });
+    const closeDialog = () => setDialog(null);
+    return (_jsxs("div", { className: toClassName("min-w-0 space-y-2", className), children: [_jsx(Toolbar, { label: toolbarLabel, overflow: "panel", overflowIcon: icons?.overflow, items: [
+                    toggle("bold", "Bold", () => {
+                        editor?.chain().focus().toggleBold().run();
+                    }, editor?.isActive("bold") ?? false),
+                    toggle("italic", "Italic", () => {
+                        editor?.chain().focus().toggleItalic().run();
+                    }, editor?.isActive("italic") ?? false),
+                    toggle("underline", "Underline", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .toggleUnderline()
+                            .run();
+                    }, editor?.isActive("underline") ?? false),
+                    toggle("bulletList", "Bullet list", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .toggleBulletList()
+                            .run();
+                    }, editor?.isActive("bulletList") ?? false),
+                    toggle("orderedList", "Numbered list", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .toggleOrderedList()
+                            .run();
+                    }, editor?.isActive("orderedList") ?? false),
+                    action("alignStart", "Align start", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .setTextAlign("start")
+                            .run();
+                    }),
+                    action("alignCenter", "Align centre", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .setTextAlign("center")
+                            .run();
+                    }),
+                    action("alignEnd", "Align end", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .setTextAlign("end")
+                            .run();
+                    }),
+                    action("link", "Edit link", () => openDialog("link")),
+                    action("unlink", "Remove link", () => {
+                        editor
+                            ?.chain()
+                            .focus()
+                            .extendMarkRange("link")
+                            .unsetLink()
+                            .run();
+                    }),
+                    action("colour", "Text colour", () => openDialog("colour")),
+                    action("image", "Insert image", () => openDialog("image")),
+                    action("undo", "Undo", () => {
+                        editor?.chain().focus().undo().run();
+                    }),
+                    action("redo", "Redo", () => {
+                        editor?.chain().focus().redo().run();
+                    }),
+                ] }), _jsx(EditorContent, { editor: editor }), name !== undefined && (_jsx("input", { disabled: isDisabled, name: name, type: "hidden", value: formValue })), _jsx(Dialog, { initialFocus: dialogInputRef, heading: dialog === "image"
+                    ? "Insert image"
+                    : dialog === "colour"
+                        ? "Text colour"
+                        : "Edit link", isVisible: dialog !== null, onClose: closeDialog, children: _jsxs("form", { className: "space-y-4", onSubmit: (event) => {
+                        event.preventDefault();
+                        // A portalled formatting form must never submit its record form.
+                        event.stopPropagation();
+                        if (!editor || hasDisabledActions)
+                            return;
+                        const data = new FormData(event.currentTarget);
+                        const value = String(data.get("value") ?? "").trim();
+                        if (dialog === "colour") {
+                            const colour = toSafeHtmlColour(value);
+                            if (!colour) {
+                                setError("Enter a colour name, hex, RGB or HSL value.");
+                                return;
+                            }
+                            editor.chain().focus().setColor(colour).run();
+                        }
+                        else if (dialog === "image") {
+                            const src = toSafeImageUrl(value);
+                            if (!src) {
+                                setError("Enter a safe image URL.");
+                                return;
+                            }
+                            editor
+                                .chain()
+                                .focus()
+                                .setImage({
+                                src,
+                                alt: String(data.get("alt") ?? ""),
+                            })
+                                .run();
+                        }
+                        else {
+                            const href = toSafeLinkUrl(value);
+                            if (!href) {
+                                setError("Enter a safe link URL.");
+                                return;
+                            }
+                            editor
+                                .chain()
+                                .focus()
+                                .extendMarkRange("link")
+                                .setLink({ href })
+                                .run();
+                        }
+                        closeDialog();
+                    }, children: [_jsx(Field, { error: error, label: dialog === "colour" ? "Colour" : "URL", isRequired: true, children: _jsx("input", { className: INPUT_CLASS, defaultValue: dialog === "link"
+                                    ? String(editor?.getAttributes("link").href ??
+                                        "")
+                                    : "", name: "value", ref: dialogInputRef, required: true }) }), dialog === "image" && (_jsx(Field, { label: "Image description", children: _jsx("input", { className: INPUT_CLASS, name: "alt" }) })), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { isDisabled: hasDisabledActions, type: "submit", children: "Apply" }), _jsx(Button, { appearance: "outline", onClick: closeDialog, children: "Cancel" })] })] }, dialog) })] }));
+};
+//# sourceMappingURL=HtmlEditor.js.map

package/dist/htmlEditor/HtmlEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlEditor.js","sourceRoot":"","sources":["../../src/htmlEditor/HtmlEditor.tsx"],"names":[],"mappings":"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"}

package/dist/htmlEditor/HtmlView.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+export type HtmlViewProps = {
+    className?: string;
+    /** The readable document's accessible name. */
+    label: string;
+    value: string;
+};
+/** HTML is a distinct stored format. No editor and no innerHTML. */
+export declare const HtmlView: ({ className, label, value, }: HtmlViewProps) => ReactNode;
+//# sourceMappingURL=HtmlView.d.ts.map

package/dist/htmlEditor/HtmlView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlView.d.ts","sourceRoot":"","sources":["../../src/htmlEditor/HtmlView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAA;AASrD,MAAM,MAAM,aAAa,GAAG;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AA2CD,oEAAoE;AACpE,eAAO,MAAM,QAAQ,GAAI,8BAItB,aAAa,KAAG,SAQlB,CAAA"}

package/dist/htmlEditor/HtmlView.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement } from "react";
+import { TextLink } from "../TextLink/TextLink.js";
+import { toClassName } from "../toClassName.js";
+import { HTML_CONTENT_CLASS } from "./htmlContentStyles.js";
+import { toHtmlContent } from "./safeHtml.js";
+const toStyle = (value) => Object.fromEntries((value ?? "")
+    .split(";")
+    .filter(Boolean)
+    .map((declaration) => {
+    const [name, content] = declaration.split(":");
+    return [
+        name === "text-align" ? "textAlign" : name,
+        content,
+    ];
+}));
+const renderNode = (node, key) => {
+    if ("text" in node)
+        return node.text;
+    const { style, ...attributes } = node.attributes;
+    const children = node.children.map(renderNode);
+    if (node.tag === "a" && attributes.href !== undefined)
+        return (_jsx(TextLink, { href: attributes.href, style: toStyle(style), title: attributes.title, children: children }, key));
+    return createElement(node.tag, { ...attributes, key, style: toStyle(style) }, children.length ? children : undefined);
+};
+/** HTML is a distinct stored format. No editor and no innerHTML. */
+export const HtmlView = ({ className, label, value, }) => (_jsx("div", { "aria-label": label, className: toClassName(HTML_CONTENT_CLASS, className), role: "document", children: toHtmlContent(value).map(renderNode) }));
+//# sourceMappingURL=HtmlView.js.map

package/dist/htmlEditor/HtmlView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlView.js","sourceRoot":"","sources":["../../src/htmlEditor/HtmlView.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAErC,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAA0B,CAAA;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAE3D,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAS7C,MAAM,OAAO,GAAG,CACd,KAAyB,EACV,EAAE,CACjB,MAAM,CAAC,WAAW,CAChB,CAAC,KAAK,IAAI,EAAE,CAAC;KACV,KAAK,CAAC,GAAG,CAAC;KACV,MAAM,CAAC,OAAO,CAAC;KACf,GAAG,CAAC,CAAC,WAAW,EAAE,EAAE;IACnB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;IAC9C,OAAO;QACL,IAAI,KAAK,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI;QAC1C,OAAO;KACR,CAAA;AACH,CAAC,CAAC,CACL,CAAA;AAEH,MAAM,UAAU,GAAG,CACjB,IAAqB,EACrB,GAAW,EACA,EAAE;IACb,IAAI,MAAM,IAAI,IAAI;QAAE,OAAO,IAAI,CAAC,IAAI,CAAA;IACpC,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,GAAG,IAAI,CAAC,UAAU,CAAA;IAChD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC,CAAA;IAC9C,IAAI,IAAI,CAAC,GAAG,KAAK,GAAG,IAAI,UAAU,CAAC,IAAI,KAAK,SAAS;QACnD,OAAO,CACL,KAAC,QAAQ,IACP,IAAI,EAAE,UAAU,CAAC,IAAI,EAErB,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,EACrB,KAAK,EAAE,UAAU,CAAC,KAAK,YAEtB,QAAQ,IAJJ,GAAG,CAKC,CACZ,CAAA;IACH,OAAO,aAAa,CAClB,IAAI,CAAC,GAAG,EACR,EAAE,GAAG,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,EAAE,EAC7C,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CACvC,CAAA;AACH,CAAC,CAAA;AAED,oEAAoE;AACpE,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,SAAS,EACT,KAAK,EACL,KAAK,GACS,EAAa,EAAE,CAAC,CAC9B,4BACc,KAAK,EACjB,SAAS,EAAE,WAAW,CAAC,kBAAkB,EAAE,SAAS,CAAC,EACrD,IAAI,EAAC,UAAU,YAEd,aAAa,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,GACjC,CACP,CAAA"}

package/dist/htmlEditor/htmlContentStyles.d.ts

@@ -0,0 +1,3 @@
+/** Identical document paint in the reader and the editing surface. */
+export declare const HTML_CONTENT_CLASS = "min-w-0 wrap-anywhere text-content-primary [&_p]:my-2 [&_div]:my-2 [&_ul]:my-2 [&_ul]:list-disc [&_ul]:ps-6 [&_ol]:my-2 [&_ol]:list-decimal [&_ol]:ps-6 [&_li]:my-1 [&_blockquote]:my-3 [&_blockquote]:border-s-2 [&_blockquote]:border-border-default [&_blockquote]:ps-4 [&_blockquote]:text-content-secondary [&_pre]:whitespace-pre-wrap [&_pre]:rounded-md [&_pre]:bg-surface-raised [&_pre]:p-3 [&_code]:font-mono [&_h1]:my-3 [&_h1]:text-2xl [&_h1]:font-bold [&_h2]:my-3 [&_h2]:text-xl [&_h2]:font-bold [&_h3]:my-3 [&_h3]:text-lg [&_h3]:font-bold [&_h4]:my-2 [&_h4]:font-semibold [&_h5]:my-2 [&_h5]:font-semibold [&_h6]:my-2 [&_h6]:font-semibold [&_a]:text-intent-accent-content [&_a]:underline [&_img]:max-w-full [&_img]:h-auto [&_img]:rounded-md [&_hr]:my-3 [&_hr]:border-border-default";
+//# sourceMappingURL=htmlContentStyles.d.ts.map

package/dist/htmlEditor/htmlContentStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"htmlContentStyles.d.ts","sourceRoot":"","sources":["../../src/htmlEditor/htmlContentStyles.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,eAAO,MAAM,kBAAkB,oxBACovB,CAAA"}

package/dist/htmlEditor/htmlContentStyles.js

@@ -0,0 +1,3 @@
+/** Identical document paint in the reader and the editing surface. */
+export const HTML_CONTENT_CLASS = "min-w-0 wrap-anywhere text-content-primary [&_p]:my-2 [&_div]:my-2 [&_ul]:my-2 [&_ul]:list-disc [&_ul]:ps-6 [&_ol]:my-2 [&_ol]:list-decimal [&_ol]:ps-6 [&_li]:my-1 [&_blockquote]:my-3 [&_blockquote]:border-s-2 [&_blockquote]:border-border-default [&_blockquote]:ps-4 [&_blockquote]:text-content-secondary [&_pre]:whitespace-pre-wrap [&_pre]:rounded-md [&_pre]:bg-surface-raised [&_pre]:p-3 [&_code]:font-mono [&_h1]:my-3 [&_h1]:text-2xl [&_h1]:font-bold [&_h2]:my-3 [&_h2]:text-xl [&_h2]:font-bold [&_h3]:my-3 [&_h3]:text-lg [&_h3]:font-bold [&_h4]:my-2 [&_h4]:font-semibold [&_h5]:my-2 [&_h5]:font-semibold [&_h6]:my-2 [&_h6]:font-semibold [&_a]:text-intent-accent-content [&_a]:underline [&_img]:max-w-full [&_img]:h-auto [&_img]:rounded-md [&_hr]:my-3 [&_hr]:border-border-default";
+//# sourceMappingURL=htmlContentStyles.js.map

package/dist/htmlEditor/htmlContentStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"htmlContentStyles.js","sourceRoot":"","sources":["../../src/htmlEditor/htmlContentStyles.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,MAAM,CAAC,MAAM,kBAAkB,GAC7B,ixBAAixB,CAAA"}

package/dist/htmlEditor/index.d.ts

@@ -0,0 +1,8 @@
+/** Opt-in rich HTML surfaces; no HTML conversion in markdown components. */
+export type { HtmlEditorProps } from "./HtmlEditor.tsx";
+export { HtmlEditor } from "./HtmlEditor.tsx";
+export type { HtmlViewProps } from "./HtmlView.tsx";
+export { HtmlView } from "./HtmlView.tsx";
+export type { HtmlContentNode } from "./safeHtml.ts";
+export { toHtmlContent, toSafeHtml } from "./safeHtml.ts";
+//# sourceMappingURL=index.d.ts.map

package/dist/htmlEditor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/htmlEditor/index.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,YAAY,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA"}

package/dist/htmlEditor/index.js

@@ -0,0 +1,4 @@
+export { HtmlEditor } from "./HtmlEditor.js";
+export { HtmlView } from "./HtmlView.js";
+export { toHtmlContent, toSafeHtml } from "./safeHtml.js";
+//# sourceMappingURL=index.js.map

package/dist/htmlEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/htmlEditor/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAkB,CAAA;AAE7C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAgB,CAAA;AAEzC,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA"}

package/dist/htmlEditor/safeHtml.d.ts

@@ -0,0 +1,12 @@
+export type HtmlContentNode = {
+    text: string;
+} | {
+    attributes: Record<string, string>;
+    children: HtmlContentNode[];
+    tag: string;
+};
+export declare const toSafeHtmlColour: (value: string) => string | undefined;
+export declare const toHtmlContent: (value: string) => HtmlContentNode[];
+/** A display/edit projection, never an instruction to rewrite stored HTML. */
+export declare const toSafeHtml: (value: string) => string;
+//# sourceMappingURL=safeHtml.d.ts.map

package/dist/htmlEditor/safeHtml.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"safeHtml.d.ts","sourceRoot":"","sources":["../../src/htmlEditor/safeHtml.ts"],"names":[],"mappings":"AAQA,MAAM,MAAM,eAAe,GACvB;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAChB;IACE,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,QAAQ,EAAE,eAAe,EAAE,CAAA;IAC3B,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AA+CL,eAAO,MAAM,gBAAgB,GAC3B,OAAO,MAAM,KACZ,MAAM,GAAG,SAOX,CAAA;AAoFD,eAAO,MAAM,aAAa,GACxB,OAAO,MAAM,KACZ,eAAe,EAC4B,CAAA;AA2B9C,8EAA8E;AAC9E,eAAO,MAAM,UAAU,GAAI,OAAO,MAAM,KAAG,MACG,CAAA"}

package/dist/htmlEditor/safeHtml.js

@@ -0,0 +1,137 @@
+import { parseFragment } from "parse5";
+import { toSafeImageUrl, toSafeLinkUrl, } from "../safeUrls.js";
+// One format policy for rendering, initial editor content, paste,
+// and serialized edits. Parsing HTML5 before filtering also decodes
+// character references in URLs; an encoded scheme cannot evade the
+// shared URL guard. Nothing from the source becomes a React prop.
+const TAGS = new Set([
+    "p",
+    "div",
+    "br",
+    "strong",
+    "b",
+    "em",
+    "i",
+    "u",
+    "s",
+    "strike",
+    "span",
+    "a",
+    "img",
+    "ul",
+    "ol",
+    "li",
+    "blockquote",
+    "h1",
+    "h2",
+    "h3",
+    "h4",
+    "h5",
+    "h6",
+    "pre",
+    "code",
+    "hr",
+]);
+const DROP_CONTENT = new Set([
+    "script",
+    "style",
+    "template",
+    "iframe",
+    "object",
+    "embed",
+    "svg",
+    "math",
+    "noscript",
+]);
+const VOID_TAGS = new Set(["br", "hr", "img"]);
+export const toSafeHtmlColour = (value) => {
+    const colour = value.trim().toLowerCase();
+    return /^(#[\da-f]{3}|#[\da-f]{4}|#[\da-f]{6}|#[\da-f]{8}|[a-z]+|(?:rgb|rgba|hsl|hsla)\([\d.,%\s+-]+\))$/.test(colour)
+        ? colour
+        : undefined;
+};
+const toSafeStyle = (value) => value
+    .split(";")
+    .flatMap((declaration) => {
+    const [rawName, ...parts] = declaration.split(":");
+    const name = rawName?.trim().toLowerCase();
+    const content = parts.join(":").trim().toLowerCase();
+    if (name === "text-align" &&
+        /^(start|end|left|right|center|justify)$/.test(content)) {
+        return [`text-align:${content}`];
+    }
+    if (name === "color" &&
+        toSafeHtmlColour(content) !== undefined) {
+        return [`color:${content}`];
+    }
+    return [];
+})
+    .join(";");
+const toSafeAttributes = (tag, attributes) => {
+    const source = Object.fromEntries(attributes
+        .filter((attribute) => !attribute.namespace)
+        .map(({ name, value }) => [name, value]));
+    const result = {};
+    const style = toSafeStyle(source.style ?? "");
+    if (style !== "")
+        result.style = style;
+    if (tag === "a") {
+        const href = toSafeLinkUrl(source.href ?? "");
+        if (source.href !== undefined && href !== undefined)
+            result.href = href;
+        if (source.title)
+            result.title = source.title;
+        // Source target/rel attributes never reach the page.
+        result.rel = "noopener noreferrer";
+    }
+    if (tag === "img") {
+        const src = toSafeImageUrl(source.src ?? "");
+        if (src)
+            result.src = src;
+        result.alt = source.alt ?? "";
+        if (source.title)
+            result.title = source.title;
+    }
+    if (tag === "ol" && /^\d{1,6}$/.test(source.start ?? ""))
+        result.start = source.start ?? "1";
+    return result;
+};
+const toSafeNodes = (nodes) => nodes.flatMap((node) => {
+    if (node.nodeName === "#text" && "value" in node)
+        return [{ text: node.value }];
+    if (!("tagName" in node))
+        return [];
+    if (DROP_CONTENT.has(node.tagName) ||
+        node.namespaceURI !== "http://www.w3.org/1999/xhtml")
+        return [];
+    const children = toSafeNodes(node.childNodes);
+    if (!TAGS.has(node.tagName))
+        return children;
+    const attributes = toSafeAttributes(node.tagName, node.attrs);
+    // A rejected image is absent, rather than a broken image or an
+    // empty src that makes another request for the document itself.
+    if (node.tagName === "img" && !attributes.src)
+        return [];
+    return [{ attributes, children, tag: node.tagName }];
+});
+export const toHtmlContent = (value) => toSafeNodes(parseFragment(value).childNodes);
+const escapeHtml = (value) => value.replace(/[&<>"]/g, (character) => ({
+    "&": "&amp;",
+    "<": "&lt;",
+    ">": "&gt;",
+    '"': "&quot;",
+})[character] ?? character);
+const serialize = (node) => {
+    if ("text" in node)
+        return escapeHtml(node.text);
+    const attributes = Object.entries(node.attributes)
+        .map(([name, value]) => ` ${name}="${escapeHtml(value)}"`)
+        .join("");
+    const start = `<${node.tag}${attributes}>`;
+    return VOID_TAGS.has(node.tag)
+        ? start
+        : `${start}${node.children.map(serialize).join("")}</${node.tag}>`;
+};
+/** A display/edit projection, never an instruction to rewrite stored HTML. */
+export const toSafeHtml = (value) => toHtmlContent(value).map(serialize).join("");
+//# sourceMappingURL=safeHtml.js.map

package/dist/htmlEditor/safeHtml.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"safeHtml.js","sourceRoot":"","sources":["../../src/htmlEditor/safeHtml.ts"],"names":[],"mappings":"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"}

package/dist/htmlEditor/view.d.ts

@@ -0,0 +1,6 @@
+/** Read HTML without importing or installing the rich editor core. */
+export type { HtmlViewProps } from "./HtmlView.tsx";
+export { HtmlView } from "./HtmlView.tsx";
+export type { HtmlContentNode } from "./safeHtml.ts";
+export { toHtmlContent, toSafeHtml } from "./safeHtml.ts";
+//# sourceMappingURL=view.d.ts.map

package/dist/htmlEditor/view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.d.ts","sourceRoot":"","sources":["../../src/htmlEditor/view.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA"}

package/dist/htmlEditor/view.js

@@ -0,0 +1,3 @@
+export { HtmlView } from "./HtmlView.js";
+export { toHtmlContent, toSafeHtml } from "./safeHtml.js";
+//# sourceMappingURL=view.js.map

package/dist/htmlEditor/view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.js","sourceRoot":"","sources":["../../src/htmlEditor/view.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAgB,CAAA;AAEzC,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA"}