@namroodinc/liquid-editorial 0.0.0-stage → 0.1.1

package/dist/chunks/RichTextEditor-DRt-kibg.js

@@ -0,0 +1,248 @@
+import { Button as e } from "../components/Button/index.js";
+import { ButtonGroup as t } from "../components/ButtonGroup/index.js";
+/* empty css               */
+import { forwardRef as n, useCallback as r, useEffect as i, useId as a, useMemo as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { EditorContent as u, createDocument as d, getSchema as f, useEditor as p, useEditorState as m } from "@tiptap/react";
+import { Placeholder as h } from "@tiptap/extension-placeholder";
+import { StarterKit as g } from "@tiptap/starter-kit";
+import { Link as _ } from "@tiptap/extension-link";
+//#region src/components/RichTextEditor/document.ts
+var v = {
+	type: "doc",
+	content: [{ type: "paragraph" }]
+};
+function y() {
+	return [g.configure({ link: !1 }), _.configure({
+		openOnClick: !1,
+		autolink: !0
+	})];
+}
+var b = f(y());
+function x(e) {
+	return e.content?.length ? e : {
+		...e,
+		content: v.content
+	};
+}
+function S(e) {
+	try {
+		if (!e || typeof e != "object" || !("type" in e) || e.type !== "doc") throw Error();
+		let t = (e) => {
+			let n = b.nodes[e.type ?? ""];
+			if (!n || Object.keys(e).some((e) => ![
+				"type",
+				"attrs",
+				"content",
+				"marks",
+				"text"
+			].includes(e)) || e.text !== void 0 && e.type !== "text" || e.attrs && Object.keys(e.attrs).some((e) => !Object.hasOwn(n.spec.attrs ?? {}, e))) throw Error();
+			for (let t of e.marks ?? []) {
+				let e = b.marks[t.type];
+				if (!e || Object.keys(t).some((e) => !["type", "attrs"].includes(e)) || Object.keys(t.attrs ?? {}).some((t) => !Object.hasOwn(e.spec.attrs ?? {}, t))) throw Error();
+			}
+			e.content?.forEach(t);
+		}, n = e;
+		t(n), b.nodeFromJSON(x(n)).check();
+	} catch {
+		return "Unsupported or invalid rich-text document.";
+	}
+}
+//#endregion
+//#region src/components/RichTextEditor/index.tsx
+var C = [
+	[
+		{
+			id: "bold",
+			icon: "bold",
+			label: "Bold",
+			run: (e) => e.chain().focus().toggleBold().run(),
+			active: (e) => e.isActive("bold")
+		},
+		{
+			id: "italic",
+			icon: "italic",
+			label: "Italic",
+			run: (e) => e.chain().focus().toggleItalic().run(),
+			active: (e) => e.isActive("italic")
+		},
+		{
+			id: "strike",
+			icon: "strikethrough",
+			label: "Strikethrough",
+			run: (e) => e.chain().focus().toggleStrike().run(),
+			active: (e) => e.isActive("strike")
+		},
+		{
+			id: "code",
+			icon: "code",
+			label: "Inline code",
+			run: (e) => e.chain().focus().toggleCode().run(),
+			active: (e) => e.isActive("code")
+		}
+	],
+	[
+		{
+			id: "h2",
+			icon: "heading-2",
+			label: "Heading",
+			run: (e) => e.chain().focus().toggleHeading({ level: 2 }).run(),
+			active: (e) => e.isActive("heading", { level: 2 })
+		},
+		{
+			id: "h3",
+			icon: "heading-3",
+			label: "Subheading",
+			run: (e) => e.chain().focus().toggleHeading({ level: 3 }).run(),
+			active: (e) => e.isActive("heading", { level: 3 })
+		},
+		{
+			id: "quote",
+			icon: "quote",
+			label: "Quote",
+			run: (e) => e.chain().focus().toggleBlockquote().run(),
+			active: (e) => e.isActive("blockquote")
+		}
+	],
+	[{
+		id: "ul",
+		icon: "list",
+		label: "Bulleted list",
+		run: (e) => e.chain().focus().toggleBulletList().run(),
+		active: (e) => e.isActive("bulletList")
+	}, {
+		id: "ol",
+		icon: "list-ordered",
+		label: "Numbered list",
+		run: (e) => e.chain().focus().toggleOrderedList().run(),
+		active: (e) => e.isActive("orderedList")
+	}],
+	[{
+		id: "undo",
+		icon: "undo",
+		label: "Undo",
+		run: (e) => e.chain().focus().undo().run()
+	}, {
+		id: "redo",
+		icon: "redo",
+		label: "Redo",
+		run: (e) => e.chain().focus().redo().run()
+	}]
+], w = n(function(n, f) {
+	let { placeholder: g = "Write something…", size: _ = "md", isDisabled: b = !1, isInvalid: w = !1, label: T = "Rich text editor", className: E, toolbarExtra: D, id: O, isRequired: k, "aria-labelledby": A, "aria-describedby": j, "aria-invalid": M } = n, [N, P] = s(!1), [F] = s(() => n.defaultValue ?? (n.format === "json" ? v : "")), I = n.value === void 0 ? F : n.value, L = o(() => n.format === "json" ? S(I) : void 0, [n.format, I]), R = a(), z = w || !!L || M, B = b || !!L, V = o(() => ({
+		role: "textbox",
+		"aria-label": T,
+		"aria-multiline": "true",
+		...O ? { id: O } : {},
+		...A ? { "aria-labelledby": A } : {},
+		...j ? { "aria-describedby": j } : {},
+		...z ? { "aria-invalid": String(z) } : {},
+		...k ? { "aria-required": "true" } : {}
+	}), [
+		T,
+		O,
+		A,
+		j,
+		z,
+		k
+	]), H = p({
+		immediatelyRender: !1,
+		editable: !B,
+		content: L ? v : typeof I == "string" ? I : x(I),
+		extensions: [...y(), h.configure({ placeholder: g })],
+		editorProps: { attributes: V },
+		onFocus: () => P(!0),
+		onBlur: () => P(!1),
+		onUpdate: ({ editor: e }) => {
+			B || (n.format === "json" ? n.onChange?.(e.getJSON()) : n.onChange?.(e.getHTML()));
+		}
+	});
+	i(() => {
+		H && (H.setEditable(!B, !1), H.setOptions({ editorProps: { attributes: V } }));
+	}, [
+		H,
+		B,
+		V
+	]), i(() => {
+		if (!H || n.value === void 0 || L) return;
+		let e = typeof n.value == "string" ? d(n.value, H.schema) : H.schema.nodeFromJSON(x(n.value));
+		e.eq(H.state.doc) || H.commands.setContent(e, { emitUpdate: !1 });
+	}, [
+		H,
+		n.value,
+		L
+	]);
+	let U = m({
+		editor: H,
+		selector: ({ editor: e }) => e ? {
+			active: Object.fromEntries(C.flat().map((t) => [t.id, t.active?.(e) ?? !1])),
+			linkActive: e.isActive("link")
+		} : null
+	}), W = r(() => {
+		if (!H) return;
+		if (H.isActive("link")) {
+			H.chain().focus().unsetLink().run();
+			return;
+		}
+		let e = window.prompt("Link to");
+		e && H.chain().focus().extendMarkRange("link").setLink({ href: e }).run();
+	}, [H]);
+	return /* @__PURE__ */ l("div", {
+		ref: f,
+		className: ["ds-rte", E].filter(Boolean).join(" "),
+		"data-focused": N || void 0,
+		"data-disabled": B || void 0,
+		"aria-invalid": z || void 0,
+		children: [L && /* @__PURE__ */ c("p", {
+			id: R,
+			role: "alert",
+			className: "ds-field__error",
+			children: L
+		}), /* @__PURE__ */ l("div", {
+			hidden: !!L,
+			children: [/* @__PURE__ */ l("div", {
+				className: "ds-rte__toolbar",
+				role: "toolbar",
+				"aria-label": `${T} formatting`,
+				children: [
+					C.map((n, r) => /* @__PURE__ */ c(t, {
+						"aria-label": `Formatting ${r + 1}`,
+						children: n.map((t) => /* @__PURE__ */ c(e, {
+							size: "sm",
+							isIconOnly: !0,
+							iconStart: t.icon,
+							"aria-label": t.label,
+							title: t.label,
+							"aria-pressed": t.active ? U?.active[t.id] : void 0,
+							variant: U?.active[t.id] ? "active" : "neutral",
+							isDisabled: B || !H,
+							onClick: () => H && t.run(H)
+						}, t.id))
+					}, r)),
+					/* @__PURE__ */ c(t, {
+						"aria-label": "Link",
+						children: /* @__PURE__ */ c(e, {
+							size: "sm",
+							isIconOnly: !0,
+							iconStart: U?.linkActive ? "link-off" : "link",
+							"aria-label": U?.linkActive ? "Remove link" : "Add link",
+							title: U?.linkActive ? "Remove link" : "Add link",
+							variant: U?.linkActive ? "active" : "neutral",
+							isDisabled: B || !H,
+							onClick: W
+						})
+					}),
+					D
+				]
+			}), /* @__PURE__ */ c("div", {
+				className: "ds-rte__content",
+				"data-size": _,
+				children: /* @__PURE__ */ c(u, { editor: H })
+			})]
+		})]
+	});
+});
+//#endregion
+export { S as n, v as r, w as t };
+
+//# sourceMappingURL=RichTextEditor-DRt-kibg.js.map

package/dist/chunks/RichTextEditor-DRt-kibg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextEditor-DRt-kibg.js","names":["emptyDocument","richTextExtensions","StarterKit","Link","schema","getSchema","normalizeDocument","document","documentError","value","check","type","node","key","mark","markType","GROUPS","RichTextEditor","forwardRef","labelledBy","describedBy","ariaInvalid","props","isFocused","setIsFocused","useState","initialValue","content","contentError","useMemo","errorId","useId","invalid","isInvalid","disabled","isDisabled","attributes","label","id","isRequired","editor","useEditor","Placeholder","useEffect","next","createDocument","state","useEditorState","toggleLink","useCallback","href","className","ButtonGroup","i","group","Button","tool","toolbarExtra","size","EditorContent"],"sources":["../../src/components/RichTextEditor/document.ts","../../src/components/RichTextEditor/index.tsx"],"sourcesContent":["import { getSchema, type JSONContent } from \"@tiptap/react\";\nimport { StarterKit } from \"@tiptap/starter-kit\";\nimport { Link } from \"@tiptap/extension-link\";\n\nexport type RichTextDocument = JSONContent & { type: \"doc\" };\n\nexport const emptyDocument: RichTextDocument = { type: \"doc\", content: [{ type: \"paragraph\" }] };\n\nexport function richTextExtensions() {\n  return [StarterKit.configure({ link: false }), Link.configure({ openOnClick: false, autolink: true })];\n}\n\nconst schema = getSchema(richTextExtensions());\n\n/** ProseMirror represents an empty writing surface with one empty paragraph. */\nexport function normalizeDocument(document: RichTextDocument): RichTextDocument {\n  return !document.content?.length ? { ...document, content: emptyDocument.content } : document;\n}\n\nexport function documentError(value: unknown): string | undefined {\n  try {\n    if (!value || typeof value !== \"object\" || !(\"type\" in value) || value.type !== \"doc\") throw new Error();\n    const check = (node: JSONContent) => {\n      const type = schema.nodes[node.type ?? \"\"];\n      if (!type || Object.keys(node).some((key) => ![\"type\", \"attrs\", \"content\", \"marks\", \"text\"].includes(key)) ||\n        (node.text !== undefined && node.type !== \"text\") ||\n        (node.attrs && Object.keys(node.attrs).some((key) => !Object.hasOwn(type.spec.attrs ?? {}, key)))) {\n        throw new Error();\n      }\n      for (const mark of node.marks ?? []) {\n        const markType = schema.marks[mark.type];\n        if (!markType || Object.keys(mark).some((key) => ![\"type\", \"attrs\"].includes(key)) ||\n          Object.keys(mark.attrs ?? {}).some((key) => !Object.hasOwn(markType.spec.attrs ?? {}, key))) {\n          throw new Error();\n        }\n      }\n      node.content?.forEach(check);\n    };\n    const document = value as RichTextDocument;\n    check(document);\n    schema.nodeFromJSON(normalizeDocument(document)).check();\n  } catch {\n    return \"Unsupported or invalid rich-text document.\";\n  }\n}\n","import { forwardRef, useCallback, useEffect, useId, useMemo, useState, type AriaAttributes, type ReactNode } from \"react\";\nimport { createDocument, EditorContent, useEditor, useEditorState, type Editor } from \"@tiptap/react\";\nimport { Placeholder } from \"@tiptap/extension-placeholder\";\nimport { Button } from \"../Button\";\nimport { ButtonGroup } from \"../ButtonGroup\";\nimport type { IconName } from \"../Icon/icons\";\nimport { documentError, emptyDocument, normalizeDocument, richTextExtensions, type RichTextDocument } from \"./document\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nexport type RichTextEditorSize = \"sm\" | \"md\" | \"lg\";\n\nexport type { RichTextDocument } from \"./document\";\n\ninterface RichTextEditorCommonProps {\n  placeholder?: string;\n  size?: RichTextEditorSize;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Accessible name for the editing surface. */\n  label?: string;\n  className?: string;\n  /** Extra controls appended to the toolbar, e.g. a word count. */\n  toolbarExtra?: ReactNode;\n  /** Applied to the editable surface. */\n  id?: string;\n  isRequired?: boolean;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: AriaAttributes[\"aria-invalid\"];\n}\n\nexport type RichTextEditorProps = RichTextEditorCommonProps & (\n  | { format?: \"html\"; value?: string; defaultValue?: string; onChange?: (html: string) => void }\n  | { format: \"json\"; value?: RichTextDocument; defaultValue?: RichTextDocument; onChange?: (document: RichTextDocument) => void }\n);\n\ninterface ToolItem {\n  id: string;\n  icon: IconName;\n  label: string;\n  run: (editor: Editor) => void;\n  active?: (editor: Editor) => boolean;\n}\n\nconst GROUPS: ToolItem[][] = [\n  [\n    {\n      id: \"bold\",\n      icon: \"bold\",\n      label: \"Bold\",\n      run: (e) => e.chain().focus().toggleBold().run(),\n      active: (e) => e.isActive(\"bold\"),\n    },\n    {\n      id: \"italic\",\n      icon: \"italic\",\n      label: \"Italic\",\n      run: (e) => e.chain().focus().toggleItalic().run(),\n      active: (e) => e.isActive(\"italic\"),\n    },\n    {\n      id: \"strike\",\n      icon: \"strikethrough\",\n      label: \"Strikethrough\",\n      run: (e) => e.chain().focus().toggleStrike().run(),\n      active: (e) => e.isActive(\"strike\"),\n    },\n    {\n      id: \"code\",\n      icon: \"code\",\n      label: \"Inline code\",\n      run: (e) => e.chain().focus().toggleCode().run(),\n      active: (e) => e.isActive(\"code\"),\n    },\n  ],\n  [\n    {\n      id: \"h2\",\n      icon: \"heading-2\",\n      label: \"Heading\",\n      run: (e) => e.chain().focus().toggleHeading({ level: 2 }).run(),\n      active: (e) => e.isActive(\"heading\", { level: 2 }),\n    },\n    {\n      id: \"h3\",\n      icon: \"heading-3\",\n      label: \"Subheading\",\n      run: (e) => e.chain().focus().toggleHeading({ level: 3 }).run(),\n      active: (e) => e.isActive(\"heading\", { level: 3 }),\n    },\n    {\n      id: \"quote\",\n      icon: \"quote\",\n      label: \"Quote\",\n      run: (e) => e.chain().focus().toggleBlockquote().run(),\n      active: (e) => e.isActive(\"blockquote\"),\n    },\n  ],\n  [\n    {\n      id: \"ul\",\n      icon: \"list\",\n      label: \"Bulleted list\",\n      run: (e) => e.chain().focus().toggleBulletList().run(),\n      active: (e) => e.isActive(\"bulletList\"),\n    },\n    {\n      id: \"ol\",\n      icon: \"list-ordered\",\n      label: \"Numbered list\",\n      run: (e) => e.chain().focus().toggleOrderedList().run(),\n      active: (e) => e.isActive(\"orderedList\"),\n    },\n  ],\n  [\n    {\n      id: \"undo\",\n      icon: \"undo\",\n      label: \"Undo\",\n      run: (e) => e.chain().focus().undo().run(),\n    },\n    {\n      id: \"redo\",\n      icon: \"redo\",\n      label: \"Redo\",\n      run: (e) => e.chain().focus().redo().run(),\n    },\n  ],\n];\n\n/**\n * The editorial writing surface. Rich text plus links — the same field skin,\n * radius and states as `TextField`, with the toolbar inside the frame.\n */\nexport const RichTextEditor = forwardRef<HTMLDivElement, RichTextEditorProps>(\n  function RichTextEditor(\n    props,\n    ref,\n  ) {\n    const {\n      placeholder = \"Write something…\",\n      size = \"md\",\n      isDisabled = false,\n      isInvalid = false,\n      label = \"Rich text editor\",\n      className,\n      toolbarExtra,\n      id,\n      isRequired,\n      \"aria-labelledby\": labelledBy,\n      \"aria-describedby\": describedBy,\n      \"aria-invalid\": ariaInvalid,\n    } = props;\n    const [isFocused, setIsFocused] = useState(false);\n    const [initialValue] = useState(() => props.defaultValue ?? (props.format === \"json\" ? emptyDocument : \"\"));\n    const content = props.value !== undefined ? props.value : initialValue;\n    const contentError = useMemo(() => props.format === \"json\" ? documentError(content) : undefined, [props.format, content]);\n    const errorId = useId();\n    const invalid = isInvalid || !!contentError || ariaInvalid;\n    const disabled = isDisabled || !!contentError;\n    const attributes = useMemo(() => ({\n      role: \"textbox\",\n      \"aria-label\": label,\n      \"aria-multiline\": \"true\",\n      ...(id ? { id } : {}),\n      ...(labelledBy ? { \"aria-labelledby\": labelledBy } : {}),\n      ...(describedBy ? { \"aria-describedby\": describedBy } : {}),\n      ...(invalid ? { \"aria-invalid\": String(invalid) } : {}),\n      ...(isRequired ? { \"aria-required\": \"true\" } : {}),\n    }), [label, id, labelledBy, describedBy, invalid, isRequired]);\n\n    const editor = useEditor({\n      immediatelyRender: false,\n      editable: !disabled,\n      content: contentError ? emptyDocument : typeof content === \"string\" ? content : normalizeDocument(content),\n      extensions: [\n        ...richTextExtensions(),\n        Placeholder.configure({ placeholder }),\n      ],\n      editorProps: {\n        attributes,\n      },\n      onFocus: () => setIsFocused(true),\n      onBlur: () => setIsFocused(false),\n      onUpdate: ({ editor: e }) => {\n        if (disabled) return;\n        if (props.format === \"json\") props.onChange?.(e.getJSON() as RichTextDocument);\n        else props.onChange?.(e.getHTML());\n      },\n    });\n\n    useEffect(() => {\n      if (!editor) return;\n      editor.setEditable(!disabled, false);\n      editor.setOptions({ editorProps: { attributes } });\n    }, [editor, disabled, attributes]);\n\n    useEffect(() => {\n      if (!editor || props.value === undefined || contentError) return;\n      const next = typeof props.value === \"string\"\n        ? createDocument(props.value, editor.schema)\n        : editor.schema.nodeFromJSON(normalizeDocument(props.value));\n      // Parent echoes should preserve the current selection and undo history.\n      if (!next.eq(editor.state.doc)) editor.commands.setContent(next, { emitUpdate: false });\n    }, [editor, props.value, contentError]);\n\n    const state = useEditorState({\n      editor,\n      selector: ({ editor: e }) =>\n        e\n          ? {\n              active: Object.fromEntries(\n                GROUPS.flat().map((t) => [t.id, t.active?.(e) ?? false]),\n              ),\n              linkActive: e.isActive(\"link\"),\n            }\n          : null,\n    });\n\n    const toggleLink = useCallback(() => {\n      if (!editor) return;\n      if (editor.isActive(\"link\")) {\n        editor.chain().focus().unsetLink().run();\n        return;\n      }\n      const href = window.prompt(\"Link to\");\n      if (!href) return;\n      editor.chain().focus().extendMarkRange(\"link\").setLink({ href }).run();\n    }, [editor]);\n\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-rte\", className].filter(Boolean).join(\" \")}\n        data-focused={isFocused || undefined}\n        data-disabled={disabled || undefined}\n        aria-invalid={invalid || undefined}\n      >\n        {contentError && <p id={errorId} role=\"alert\" className=\"ds-field__error\">{contentError}</p>}\n        <div hidden={!!contentError}>\n          <div className=\"ds-rte__toolbar\" role=\"toolbar\" aria-label={`${label} formatting`}>\n            {GROUPS.map((group, i) => (\n              <ButtonGroup key={i} aria-label={`Formatting ${i + 1}`}>\n                {group.map((tool) => (\n                  <Button\n                    key={tool.id}\n                    size=\"sm\"\n                    isIconOnly\n                    iconStart={tool.icon}\n                    aria-label={tool.label}\n                    title={tool.label}\n                    aria-pressed={tool.active ? state?.active[tool.id] : undefined}\n                    variant={state?.active[tool.id] ? \"active\" : \"neutral\"}\n                    isDisabled={disabled || !editor}\n                    onClick={() => editor && tool.run(editor)}\n                  />\n                ))}\n              </ButtonGroup>\n            ))}\n            <ButtonGroup aria-label=\"Link\">\n              <Button\n                size=\"sm\"\n                isIconOnly\n                iconStart={state?.linkActive ? \"link-off\" : \"link\"}\n                aria-label={state?.linkActive ? \"Remove link\" : \"Add link\"}\n                title={state?.linkActive ? \"Remove link\" : \"Add link\"}\n                variant={state?.linkActive ? \"active\" : \"neutral\"}\n                isDisabled={disabled || !editor}\n                onClick={toggleLink}\n              />\n            </ButtonGroup>\n            {toolbarExtra}\n          </div>\n          <div className=\"ds-rte__content\" data-size={size}>\n            <EditorContent editor={editor} />\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/chunks/RichTextEditor-tFkISOvq.cjs

@@ -0,0 +1,2 @@
+const e=require("../components/Button/index.cjs"),t=require("../components/ButtonGroup/index.cjs");;/* empty css                 */let n=require("react"),r=require("react/jsx-runtime"),i=require("@tiptap/react"),a=require("@tiptap/extension-placeholder"),o=require("@tiptap/starter-kit"),s=require("@tiptap/extension-link");var c={type:`doc`,content:[{type:`paragraph`}]};function l(){return[o.StarterKit.configure({link:!1}),s.Link.configure({openOnClick:!1,autolink:!0})]}var u=(0,i.getSchema)(l());function d(e){return e.content?.length?e:{...e,content:c.content}}function f(e){try{if(!e||typeof e!=`object`||!(`type`in e)||e.type!==`doc`)throw Error();let t=e=>{let n=u.nodes[e.type??``];if(!n||Object.keys(e).some(e=>![`type`,`attrs`,`content`,`marks`,`text`].includes(e))||e.text!==void 0&&e.type!==`text`||e.attrs&&Object.keys(e.attrs).some(e=>!Object.hasOwn(n.spec.attrs??{},e)))throw Error();for(let t of e.marks??[]){let e=u.marks[t.type];if(!e||Object.keys(t).some(e=>![`type`,`attrs`].includes(e))||Object.keys(t.attrs??{}).some(t=>!Object.hasOwn(e.spec.attrs??{},t)))throw Error()}e.content?.forEach(t)},n=e;t(n),u.nodeFromJSON(d(n)).check()}catch{return`Unsupported or invalid rich-text document.`}}var p=[[{id:`bold`,icon:`bold`,label:`Bold`,run:e=>e.chain().focus().toggleBold().run(),active:e=>e.isActive(`bold`)},{id:`italic`,icon:`italic`,label:`Italic`,run:e=>e.chain().focus().toggleItalic().run(),active:e=>e.isActive(`italic`)},{id:`strike`,icon:`strikethrough`,label:`Strikethrough`,run:e=>e.chain().focus().toggleStrike().run(),active:e=>e.isActive(`strike`)},{id:`code`,icon:`code`,label:`Inline code`,run:e=>e.chain().focus().toggleCode().run(),active:e=>e.isActive(`code`)}],[{id:`h2`,icon:`heading-2`,label:`Heading`,run:e=>e.chain().focus().toggleHeading({level:2}).run(),active:e=>e.isActive(`heading`,{level:2})},{id:`h3`,icon:`heading-3`,label:`Subheading`,run:e=>e.chain().focus().toggleHeading({level:3}).run(),active:e=>e.isActive(`heading`,{level:3})},{id:`quote`,icon:`quote`,label:`Quote`,run:e=>e.chain().focus().toggleBlockquote().run(),active:e=>e.isActive(`blockquote`)}],[{id:`ul`,icon:`list`,label:`Bulleted list`,run:e=>e.chain().focus().toggleBulletList().run(),active:e=>e.isActive(`bulletList`)},{id:`ol`,icon:`list-ordered`,label:`Numbered list`,run:e=>e.chain().focus().toggleOrderedList().run(),active:e=>e.isActive(`orderedList`)}],[{id:`undo`,icon:`undo`,label:`Undo`,run:e=>e.chain().focus().undo().run()},{id:`redo`,icon:`redo`,label:`Redo`,run:e=>e.chain().focus().redo().run()}]],m=(0,n.forwardRef)(function(o,s){let{placeholder:u=`Write something…`,size:m=`md`,isDisabled:h=!1,isInvalid:g=!1,label:_=`Rich text editor`,className:v,toolbarExtra:y,id:b,isRequired:x,"aria-labelledby":S,"aria-describedby":C,"aria-invalid":w}=o,[T,E]=(0,n.useState)(!1),[D]=(0,n.useState)(()=>o.defaultValue??(o.format===`json`?c:``)),O=o.value===void 0?D:o.value,k=(0,n.useMemo)(()=>o.format===`json`?f(O):void 0,[o.format,O]),A=(0,n.useId)(),j=g||!!k||w,M=h||!!k,N=(0,n.useMemo)(()=>({role:`textbox`,"aria-label":_,"aria-multiline":`true`,...b?{id:b}:{},...S?{"aria-labelledby":S}:{},...C?{"aria-describedby":C}:{},...j?{"aria-invalid":String(j)}:{},...x?{"aria-required":`true`}:{}}),[_,b,S,C,j,x]),P=(0,i.useEditor)({immediatelyRender:!1,editable:!M,content:k?c:typeof O==`string`?O:d(O),extensions:[...l(),a.Placeholder.configure({placeholder:u})],editorProps:{attributes:N},onFocus:()=>E(!0),onBlur:()=>E(!1),onUpdate:({editor:e})=>{M||(o.format===`json`?o.onChange?.(e.getJSON()):o.onChange?.(e.getHTML()))}});(0,n.useEffect)(()=>{P&&(P.setEditable(!M,!1),P.setOptions({editorProps:{attributes:N}}))},[P,M,N]),(0,n.useEffect)(()=>{if(!P||o.value===void 0||k)return;let e=typeof o.value==`string`?(0,i.createDocument)(o.value,P.schema):P.schema.nodeFromJSON(d(o.value));e.eq(P.state.doc)||P.commands.setContent(e,{emitUpdate:!1})},[P,o.value,k]);let F=(0,i.useEditorState)({editor:P,selector:({editor:e})=>e?{active:Object.fromEntries(p.flat().map(t=>[t.id,t.active?.(e)??!1])),linkActive:e.isActive(`link`)}:null}),I=(0,n.useCallback)(()=>{if(!P)return;if(P.isActive(`link`)){P.chain().focus().unsetLink().run();return}let e=window.prompt(`Link to`);e&&P.chain().focus().extendMarkRange(`link`).setLink({href:e}).run()},[P]);return(0,r.jsxs)(`div`,{ref:s,className:[`ds-rte`,v].filter(Boolean).join(` `),"data-focused":T||void 0,"data-disabled":M||void 0,"aria-invalid":j||void 0,children:[k&&(0,r.jsx)(`p`,{id:A,role:`alert`,className:`ds-field__error`,children:k}),(0,r.jsxs)(`div`,{hidden:!!k,children:[(0,r.jsxs)(`div`,{className:`ds-rte__toolbar`,role:`toolbar`,"aria-label":`${_} formatting`,children:[p.map((n,i)=>(0,r.jsx)(t.ButtonGroup,{"aria-label":`Formatting ${i+1}`,children:n.map(t=>(0,r.jsx)(e.Button,{size:`sm`,isIconOnly:!0,iconStart:t.icon,"aria-label":t.label,title:t.label,"aria-pressed":t.active?F?.active[t.id]:void 0,variant:F?.active[t.id]?`active`:`neutral`,isDisabled:M||!P,onClick:()=>P&&t.run(P)},t.id))},i)),(0,r.jsx)(t.ButtonGroup,{"aria-label":`Link`,children:(0,r.jsx)(e.Button,{size:`sm`,isIconOnly:!0,iconStart:F?.linkActive?`link-off`:`link`,"aria-label":F?.linkActive?`Remove link`:`Add link`,title:F?.linkActive?`Remove link`:`Add link`,variant:F?.linkActive?`active`:`neutral`,isDisabled:M||!P,onClick:I})}),y]}),(0,r.jsx)(`div`,{className:`ds-rte__content`,"data-size":m,children:(0,r.jsx)(i.EditorContent,{editor:P})})]})]})});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return m}});
+//# sourceMappingURL=RichTextEditor-tFkISOvq.cjs.map

package/dist/chunks/RichTextEditor-tFkISOvq.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextEditor-tFkISOvq.cjs","names":["StarterKit","Link","getSchema","forwardRef","useState","useMemo","useId","useEditor","Placeholder","createDocument","useEditorState","useCallback","ButtonGroup","Button","EditorContent","require_components_Button_index","require_components_ButtonGroup_index","react","react_jsx_runtime","_tiptap_react","_tiptap_extension_placeholder","_tiptap_starter_kit","_tiptap_extension_link","emptyDocument","richTextExtensions","schema","normalizeDocument","document","documentError","value","check","type","node","key","mark","markType","GROUPS","RichTextEditor","labelledBy","describedBy","ariaInvalid","props","isFocused","setIsFocused","initialValue","content","contentError","errorId","invalid","isInvalid","disabled","isDisabled","attributes","label","id","isRequired","editor","next","state","toggleLink","href","className","group","tool","toolbarExtra","size"],"sources":["../../src/components/RichTextEditor/document.ts","../../src/components/RichTextEditor/index.tsx"],"sourcesContent":["import { getSchema, type JSONContent } from \"@tiptap/react\";\nimport { StarterKit } from \"@tiptap/starter-kit\";\nimport { Link } from \"@tiptap/extension-link\";\n\nexport type RichTextDocument = JSONContent & { type: \"doc\" };\n\nexport const emptyDocument: RichTextDocument = { type: \"doc\", content: [{ type: \"paragraph\" }] };\n\nexport function richTextExtensions() {\n  return [StarterKit.configure({ link: false }), Link.configure({ openOnClick: false, autolink: true })];\n}\n\nconst schema = getSchema(richTextExtensions());\n\n/** ProseMirror represents an empty writing surface with one empty paragraph. */\nexport function normalizeDocument(document: RichTextDocument): RichTextDocument {\n  return !document.content?.length ? { ...document, content: emptyDocument.content } : document;\n}\n\nexport function documentError(value: unknown): string | undefined {\n  try {\n    if (!value || typeof value !== \"object\" || !(\"type\" in value) || value.type !== \"doc\") throw new Error();\n    const check = (node: JSONContent) => {\n      const type = schema.nodes[node.type ?? \"\"];\n      if (!type || Object.keys(node).some((key) => ![\"type\", \"attrs\", \"content\", \"marks\", \"text\"].includes(key)) ||\n        (node.text !== undefined && node.type !== \"text\") ||\n        (node.attrs && Object.keys(node.attrs).some((key) => !Object.hasOwn(type.spec.attrs ?? {}, key)))) {\n        throw new Error();\n      }\n      for (const mark of node.marks ?? []) {\n        const markType = schema.marks[mark.type];\n        if (!markType || Object.keys(mark).some((key) => ![\"type\", \"attrs\"].includes(key)) ||\n          Object.keys(mark.attrs ?? {}).some((key) => !Object.hasOwn(markType.spec.attrs ?? {}, key))) {\n          throw new Error();\n        }\n      }\n      node.content?.forEach(check);\n    };\n    const document = value as RichTextDocument;\n    check(document);\n    schema.nodeFromJSON(normalizeDocument(document)).check();\n  } catch {\n    return \"Unsupported or invalid rich-text document.\";\n  }\n}\n","import { forwardRef, useCallback, useEffect, useId, useMemo, useState, type AriaAttributes, type ReactNode } from \"react\";\nimport { createDocument, EditorContent, useEditor, useEditorState, type Editor } from \"@tiptap/react\";\nimport { Placeholder } from \"@tiptap/extension-placeholder\";\nimport { Button } from \"../Button\";\nimport { ButtonGroup } from \"../ButtonGroup\";\nimport type { IconName } from \"../Icon/icons\";\nimport { documentError, emptyDocument, normalizeDocument, richTextExtensions, type RichTextDocument } from \"./document\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nexport type RichTextEditorSize = \"sm\" | \"md\" | \"lg\";\n\nexport type { RichTextDocument } from \"./document\";\n\ninterface RichTextEditorCommonProps {\n  placeholder?: string;\n  size?: RichTextEditorSize;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Accessible name for the editing surface. */\n  label?: string;\n  className?: string;\n  /** Extra controls appended to the toolbar, e.g. a word count. */\n  toolbarExtra?: ReactNode;\n  /** Applied to the editable surface. */\n  id?: string;\n  isRequired?: boolean;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: AriaAttributes[\"aria-invalid\"];\n}\n\nexport type RichTextEditorProps = RichTextEditorCommonProps & (\n  | { format?: \"html\"; value?: string; defaultValue?: string; onChange?: (html: string) => void }\n  | { format: \"json\"; value?: RichTextDocument; defaultValue?: RichTextDocument; onChange?: (document: RichTextDocument) => void }\n);\n\ninterface ToolItem {\n  id: string;\n  icon: IconName;\n  label: string;\n  run: (editor: Editor) => void;\n  active?: (editor: Editor) => boolean;\n}\n\nconst GROUPS: ToolItem[][] = [\n  [\n    {\n      id: \"bold\",\n      icon: \"bold\",\n      label: \"Bold\",\n      run: (e) => e.chain().focus().toggleBold().run(),\n      active: (e) => e.isActive(\"bold\"),\n    },\n    {\n      id: \"italic\",\n      icon: \"italic\",\n      label: \"Italic\",\n      run: (e) => e.chain().focus().toggleItalic().run(),\n      active: (e) => e.isActive(\"italic\"),\n    },\n    {\n      id: \"strike\",\n      icon: \"strikethrough\",\n      label: \"Strikethrough\",\n      run: (e) => e.chain().focus().toggleStrike().run(),\n      active: (e) => e.isActive(\"strike\"),\n    },\n    {\n      id: \"code\",\n      icon: \"code\",\n      label: \"Inline code\",\n      run: (e) => e.chain().focus().toggleCode().run(),\n      active: (e) => e.isActive(\"code\"),\n    },\n  ],\n  [\n    {\n      id: \"h2\",\n      icon: \"heading-2\",\n      label: \"Heading\",\n      run: (e) => e.chain().focus().toggleHeading({ level: 2 }).run(),\n      active: (e) => e.isActive(\"heading\", { level: 2 }),\n    },\n    {\n      id: \"h3\",\n      icon: \"heading-3\",\n      label: \"Subheading\",\n      run: (e) => e.chain().focus().toggleHeading({ level: 3 }).run(),\n      active: (e) => e.isActive(\"heading\", { level: 3 }),\n    },\n    {\n      id: \"quote\",\n      icon: \"quote\",\n      label: \"Quote\",\n      run: (e) => e.chain().focus().toggleBlockquote().run(),\n      active: (e) => e.isActive(\"blockquote\"),\n    },\n  ],\n  [\n    {\n      id: \"ul\",\n      icon: \"list\",\n      label: \"Bulleted list\",\n      run: (e) => e.chain().focus().toggleBulletList().run(),\n      active: (e) => e.isActive(\"bulletList\"),\n    },\n    {\n      id: \"ol\",\n      icon: \"list-ordered\",\n      label: \"Numbered list\",\n      run: (e) => e.chain().focus().toggleOrderedList().run(),\n      active: (e) => e.isActive(\"orderedList\"),\n    },\n  ],\n  [\n    {\n      id: \"undo\",\n      icon: \"undo\",\n      label: \"Undo\",\n      run: (e) => e.chain().focus().undo().run(),\n    },\n    {\n      id: \"redo\",\n      icon: \"redo\",\n      label: \"Redo\",\n      run: (e) => e.chain().focus().redo().run(),\n    },\n  ],\n];\n\n/**\n * The editorial writing surface. Rich text plus links — the same field skin,\n * radius and states as `TextField`, with the toolbar inside the frame.\n */\nexport const RichTextEditor = forwardRef<HTMLDivElement, RichTextEditorProps>(\n  function RichTextEditor(\n    props,\n    ref,\n  ) {\n    const {\n      placeholder = \"Write something…\",\n      size = \"md\",\n      isDisabled = false,\n      isInvalid = false,\n      label = \"Rich text editor\",\n      className,\n      toolbarExtra,\n      id,\n      isRequired,\n      \"aria-labelledby\": labelledBy,\n      \"aria-describedby\": describedBy,\n      \"aria-invalid\": ariaInvalid,\n    } = props;\n    const [isFocused, setIsFocused] = useState(false);\n    const [initialValue] = useState(() => props.defaultValue ?? (props.format === \"json\" ? emptyDocument : \"\"));\n    const content = props.value !== undefined ? props.value : initialValue;\n    const contentError = useMemo(() => props.format === \"json\" ? documentError(content) : undefined, [props.format, content]);\n    const errorId = useId();\n    const invalid = isInvalid || !!contentError || ariaInvalid;\n    const disabled = isDisabled || !!contentError;\n    const attributes = useMemo(() => ({\n      role: \"textbox\",\n      \"aria-label\": label,\n      \"aria-multiline\": \"true\",\n      ...(id ? { id } : {}),\n      ...(labelledBy ? { \"aria-labelledby\": labelledBy } : {}),\n      ...(describedBy ? { \"aria-describedby\": describedBy } : {}),\n      ...(invalid ? { \"aria-invalid\": String(invalid) } : {}),\n      ...(isRequired ? { \"aria-required\": \"true\" } : {}),\n    }), [label, id, labelledBy, describedBy, invalid, isRequired]);\n\n    const editor = useEditor({\n      immediatelyRender: false,\n      editable: !disabled,\n      content: contentError ? emptyDocument : typeof content === \"string\" ? content : normalizeDocument(content),\n      extensions: [\n        ...richTextExtensions(),\n        Placeholder.configure({ placeholder }),\n      ],\n      editorProps: {\n        attributes,\n      },\n      onFocus: () => setIsFocused(true),\n      onBlur: () => setIsFocused(false),\n      onUpdate: ({ editor: e }) => {\n        if (disabled) return;\n        if (props.format === \"json\") props.onChange?.(e.getJSON() as RichTextDocument);\n        else props.onChange?.(e.getHTML());\n      },\n    });\n\n    useEffect(() => {\n      if (!editor) return;\n      editor.setEditable(!disabled, false);\n      editor.setOptions({ editorProps: { attributes } });\n    }, [editor, disabled, attributes]);\n\n    useEffect(() => {\n      if (!editor || props.value === undefined || contentError) return;\n      const next = typeof props.value === \"string\"\n        ? createDocument(props.value, editor.schema)\n        : editor.schema.nodeFromJSON(normalizeDocument(props.value));\n      // Parent echoes should preserve the current selection and undo history.\n      if (!next.eq(editor.state.doc)) editor.commands.setContent(next, { emitUpdate: false });\n    }, [editor, props.value, contentError]);\n\n    const state = useEditorState({\n      editor,\n      selector: ({ editor: e }) =>\n        e\n          ? {\n              active: Object.fromEntries(\n                GROUPS.flat().map((t) => [t.id, t.active?.(e) ?? false]),\n              ),\n              linkActive: e.isActive(\"link\"),\n            }\n          : null,\n    });\n\n    const toggleLink = useCallback(() => {\n      if (!editor) return;\n      if (editor.isActive(\"link\")) {\n        editor.chain().focus().unsetLink().run();\n        return;\n      }\n      const href = window.prompt(\"Link to\");\n      if (!href) return;\n      editor.chain().focus().extendMarkRange(\"link\").setLink({ href }).run();\n    }, [editor]);\n\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-rte\", className].filter(Boolean).join(\" \")}\n        data-focused={isFocused || undefined}\n        data-disabled={disabled || undefined}\n        aria-invalid={invalid || undefined}\n      >\n        {contentError && <p id={errorId} role=\"alert\" className=\"ds-field__error\">{contentError}</p>}\n        <div hidden={!!contentError}>\n          <div className=\"ds-rte__toolbar\" role=\"toolbar\" aria-label={`${label} formatting`}>\n            {GROUPS.map((group, i) => (\n              <ButtonGroup key={i} aria-label={`Formatting ${i + 1}`}>\n                {group.map((tool) => (\n                  <Button\n                    key={tool.id}\n                    size=\"sm\"\n                    isIconOnly\n                    iconStart={tool.icon}\n                    aria-label={tool.label}\n                    title={tool.label}\n                    aria-pressed={tool.active ? state?.active[tool.id] : undefined}\n                    variant={state?.active[tool.id] ? \"active\" : \"neutral\"}\n                    isDisabled={disabled || !editor}\n                    onClick={() => editor && tool.run(editor)}\n                  />\n                ))}\n              </ButtonGroup>\n            ))}\n            <ButtonGroup aria-label=\"Link\">\n              <Button\n                size=\"sm\"\n                isIconOnly\n                iconStart={state?.linkActive ? \"link-off\" : \"link\"}\n                aria-label={state?.linkActive ? \"Remove link\" : \"Add link\"}\n                title={state?.linkActive ? \"Remove link\" : \"Add link\"}\n                variant={state?.linkActive ? \"active\" : \"neutral\"}\n                isDisabled={disabled || !editor}\n                onClick={toggleLink}\n              />\n            </ButtonGroup>\n            {toolbarExtra}\n          </div>\n          <div className=\"ds-rte__content\" data-size={size}>\n            <EditorContent editor={editor} />\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/components/AssetGrid/index.cjs

@@ -0,0 +1,2 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Grid/index.cjs"),n=require("../Skeleton/index.cjs");let r=require("react"),i=require("react/jsx-runtime");function a(...e){return e.filter(Boolean).join(` `)}var o=(0,r.forwardRef)(function({isLoading:e=!1,loadingCount:n=8,className:r,children:o,...c},l){return(0,i.jsx)(t.Grid,{ref:l,columns:`auto`,gap:`md`,minColumnWidth:`var(--asset-tile-min-width)`,className:a(`ds-asset-grid`,r),"aria-busy":e||void 0,...c,children:e?Array.from({length:n},(e,t)=>(0,i.jsx)(s,{index:t},t)):o})});function s({index:e=0}){let t={animationDelay:`calc(var(--skeleton-stagger) * ${e})`};return(0,i.jsxs)(`div`,{className:`ds-asset-tile`,"data-loading":`true`,"aria-hidden":`true`,children:[(0,i.jsx)(n.Skeleton,{shape:`block`,className:`ds-asset-tile__thumb`,style:t}),(0,i.jsxs)(`div`,{className:`ds-asset-tile__text`,children:[(0,i.jsx)(n.Skeleton,{shape:`text`,width:`80%`,style:t}),(0,i.jsx)(n.Skeleton,{shape:`text`,width:`45%`,style:t})]})]})}var c=(0,r.forwardRef)(function({name:t,src:o,icon:s=`image`,meta:c,isSelected:l=!1,isPending:u=!1,onSelect:d,actions:f,className:p,...m},h){let[g,_]=(0,r.useState)(!1),[v,y]=(0,r.useState)(!1),b=!!o&&!g;return(0,i.jsxs)(`div`,{ref:h,className:a(`ds-asset-tile`,p),"data-selected":l||void 0,"data-pending":u||void 0,...m,children:[(0,i.jsxs)(`div`,{className:`ds-asset-tile__thumb`,children:[b?(0,i.jsxs)(i.Fragment,{children:[!v&&(0,i.jsx)(n.Skeleton,{shape:`block`,className:`ds-asset-tile__thumb-skeleton`}),(0,i.jsx)(`img`,{src:o,alt:``,loading:`lazy`,"data-loaded":v||void 0,onLoad:()=>y(!0),onError:()=>_(!0)})]}):(0,i.jsx)(`span`,{className:`ds-asset-tile__placeholder`,children:(0,i.jsx)(e.t,{name:g?`alert-triangle`:s,size:24})}),u&&(0,i.jsxs)(`span`,{className:`ds-asset-tile__pending`,role:`status`,children:[(0,i.jsx)(e.t,{name:`spinner`,size:20,className:`ds-asset-tile__spinner`}),(0,i.jsx)(`span`,{className:`ds-asset-tile__pending-label`,children:`Uploading`})]}),f&&(0,i.jsx)(`div`,{className:`ds-asset-tile__actions`,children:f}),d&&(0,i.jsx)(`button`,{type:`button`,className:`ds-asset-tile__hit`,"aria-pressed":l,disabled:u,onClick:d,children:(0,i.jsx)(`span`,{className:`ds-asset-tile__hit-label`,children:t})})]}),(0,i.jsxs)(`div`,{className:`ds-asset-tile__text`,children:[(0,i.jsx)(`span`,{className:`ds-asset-tile__name`,children:t}),c&&(0,i.jsx)(`span`,{className:`ds-asset-tile__meta`,children:c})]})]})});function l({title:t,description:n,action:r}){return(0,i.jsxs)(`div`,{className:`ds-asset-empty`,children:[(0,i.jsx)(e.t,{name:`image`,size:24}),(0,i.jsx)(`span`,{className:`ds-asset-empty__title`,children:t}),n&&(0,i.jsx)(`span`,{className:`ds-asset-empty__description`,children:n}),r]})}exports.AssetGrid=o,exports.AssetGridEmpty=l,exports.AssetTile=c,exports.AssetTileSkeleton=s;
+//# sourceMappingURL=index.cjs.map

package/dist/components/AssetGrid/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["forwardRef","Grid","Skeleton","useState","_Fragment","Icon","require_Icon","require_components_Grid_index","require_components_Skeleton_index","react","react_jsx_runtime","cx","parts","AssetGrid","rest","className","isLoading","loadingCount","AssetTileSkeleton","i","children","delay","index","AssetTile","hasFailed","setHasFailed","isLoaded","setIsLoaded","showImage","src","isSelected","isPending","icon","actions","onSelect","name","meta","AssetGridEmpty","title","description","action"],"sources":["../../../src/components/AssetGrid/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Grid } from \"../Grid\";\nimport { Icon } from \"../Icon\";\nimport type { IconName } from \"../Icon/icons\";\nimport { Skeleton } from \"../Skeleton\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface AssetGridProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Renders placeholder tiles instead of children. The grid keeps its\n   * geometry, so nothing moves when the real assets arrive.\n   */\n  isLoading?: boolean;\n  /** How many placeholder tiles to show while loading. */\n  loadingCount?: number;\n  children?: ReactNode;\n}\n\n/**\n * The media library surface: an auto-filling grid of asset tiles. Sits inside\n * a `TableFrame` when it is the page's collection, bare inside a drawer.\n */\nexport const AssetGrid = forwardRef<HTMLDivElement, AssetGridProps>(function AssetGrid(\n  { isLoading = false, loadingCount = 8, className, children, ...rest },\n  ref,\n) {\n  return (\n    <Grid\n      ref={ref}\n      columns=\"auto\"\n      gap=\"md\"\n      minColumnWidth=\"var(--asset-tile-min-width)\"\n      className={cx(\"ds-asset-grid\", className)}\n      aria-busy={isLoading || undefined}\n      {...rest}\n    >\n      {isLoading\n        ? Array.from({ length: loadingCount }, (_, i) => <AssetTileSkeleton key={i} index={i} />)\n        : children}\n    </Grid>\n  );\n});\n\nexport interface AssetTileSkeletonProps {\n  /** Position in the grid — drives the stagger, nothing else. */\n  index?: number;\n}\n\n/** One loading tile: thumbnail block, name line, meta line. */\nexport function AssetTileSkeleton({ index = 0 }: AssetTileSkeletonProps) {\n  const delay = { animationDelay: `calc(var(--skeleton-stagger) * ${index})` };\n  return (\n    <div className=\"ds-asset-tile\" data-loading=\"true\" aria-hidden=\"true\">\n      <Skeleton shape=\"block\" className=\"ds-asset-tile__thumb\" style={delay} />\n      <div className=\"ds-asset-tile__text\">\n        <Skeleton shape=\"text\" width=\"80%\" style={delay} />\n        <Skeleton shape=\"text\" width=\"45%\" style={delay} />\n      </div>\n    </div>\n  );\n}\n\nexport interface AssetTileProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onSelect\" | \"title\"> {\n  /** File name, shown in full — asset names are how people find things again. */\n  name: string;\n  /** Thumbnail source. Omit for a non-image asset and pass an `icon` instead. */\n  src?: string;\n  /** Glyph shown when there is no thumbnail, or while one fails to load. */\n  icon?: IconName;\n  /** Second line: dimensions, size, date — whatever the library sorts by. */\n  meta?: ReactNode;\n  /** Paints the soft fill and the solid rail. Never changes the tile's size. */\n  isSelected?: boolean;\n  /** The asset is still uploading or processing: dimmed, with a spinner. */\n  isPending?: boolean;\n  /** Makes the whole tile a selection target. */\n  onSelect?: () => void;\n  /** Badges or a menu, pinned to the top of the thumbnail. */\n  actions?: ReactNode;\n}\n\n/**\n * One asset in the library. Selection paints a fill and a rail exactly like a\n * table row, so a grid and a list read as the same collection in two shapes.\n */\nexport const AssetTile = forwardRef<HTMLDivElement, AssetTileProps>(function AssetTile(\n  {\n    name,\n    src,\n    icon = \"image\",\n    meta,\n    isSelected = false,\n    isPending = false,\n    onSelect,\n    actions,\n    className,\n    ...rest\n  },\n  ref,\n) {\n  const [hasFailed, setHasFailed] = useState(false);\n  const [isLoaded, setIsLoaded] = useState(false);\n  const showImage = Boolean(src) && !hasFailed;\n\n  return (\n    <div\n      ref={ref}\n      className={cx(\"ds-asset-tile\", className)}\n      data-selected={isSelected || undefined}\n      data-pending={isPending || undefined}\n      {...rest}\n    >\n      <div className=\"ds-asset-tile__thumb\">\n        {showImage ? (\n          <>\n            {!isLoaded && <Skeleton shape=\"block\" className=\"ds-asset-tile__thumb-skeleton\" />}\n            <img\n              src={src}\n              alt=\"\"\n              loading=\"lazy\"\n              data-loaded={isLoaded || undefined}\n              onLoad={() => setIsLoaded(true)}\n              onError={() => setHasFailed(true)}\n            />\n          </>\n        ) : (\n          <span className=\"ds-asset-tile__placeholder\">\n            <Icon name={hasFailed ? \"alert-triangle\" : icon} size={24} />\n          </span>\n        )}\n\n        {isPending && (\n          <span className=\"ds-asset-tile__pending\" role=\"status\">\n            <Icon name=\"spinner\" size={20} className=\"ds-asset-tile__spinner\" />\n            <span className=\"ds-asset-tile__pending-label\">Uploading</span>\n          </span>\n        )}\n\n        {actions && <div className=\"ds-asset-tile__actions\">{actions}</div>}\n\n        {onSelect && (\n          <button\n            type=\"button\"\n            className=\"ds-asset-tile__hit\"\n            aria-pressed={isSelected}\n            disabled={isPending}\n            onClick={onSelect}\n          >\n            <span className=\"ds-asset-tile__hit-label\">{name}</span>\n          </button>\n        )}\n      </div>\n\n      <div className=\"ds-asset-tile__text\">\n        <span className=\"ds-asset-tile__name\">{name}</span>\n        {meta && <span className=\"ds-asset-tile__meta\">{meta}</span>}\n      </div>\n    </div>\n  );\n});\n\nexport interface AssetGridEmptyProps {\n  title: string;\n  description?: ReactNode;\n  action?: ReactNode;\n}\n\n/** Nothing in the library yet — one action, the one that fills it. */\nexport function AssetGridEmpty({ title, description, action }: AssetGridEmptyProps) {\n  return (\n    <div className=\"ds-asset-empty\">\n      <Icon name=\"image\" size={24} />\n      <span className=\"ds-asset-empty__title\">{title}</span>\n      {description && <span className=\"ds-asset-empty__description\">{description}</span>}\n      {action}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/AssetGrid/index.d.cts

@@ -0,0 +1,54 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+import type { IconName } from "../Icon/icons.cjs";
+export interface AssetGridProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Renders placeholder tiles instead of children. The grid keeps its
+     * geometry, so nothing moves when the real assets arrive.
+     */
+    isLoading?: boolean;
+    /** How many placeholder tiles to show while loading. */
+    loadingCount?: number;
+    children?: ReactNode;
+}
+/**
+ * The media library surface: an auto-filling grid of asset tiles. Sits inside
+ * a `TableFrame` when it is the page's collection, bare inside a drawer.
+ */
+export declare const AssetGrid: import("react").ForwardRefExoticComponent<AssetGridProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface AssetTileSkeletonProps {
+    /** Position in the grid — drives the stagger, nothing else. */
+    index?: number;
+}
+/** One loading tile: thumbnail block, name line, meta line. */
+export declare function AssetTileSkeleton({ index }: AssetTileSkeletonProps): import("react").JSX.Element;
+export interface AssetTileProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSelect" | "title"> {
+    /** File name, shown in full — asset names are how people find things again. */
+    name: string;
+    /** Thumbnail source. Omit for a non-image asset and pass an `icon` instead. */
+    src?: string;
+    /** Glyph shown when there is no thumbnail, or while one fails to load. */
+    icon?: IconName;
+    /** Second line: dimensions, size, date — whatever the library sorts by. */
+    meta?: ReactNode;
+    /** Paints the soft fill and the solid rail. Never changes the tile's size. */
+    isSelected?: boolean;
+    /** The asset is still uploading or processing: dimmed, with a spinner. */
+    isPending?: boolean;
+    /** Makes the whole tile a selection target. */
+    onSelect?: () => void;
+    /** Badges or a menu, pinned to the top of the thumbnail. */
+    actions?: ReactNode;
+}
+/**
+ * One asset in the library. Selection paints a fill and a rail exactly like a
+ * table row, so a grid and a list read as the same collection in two shapes.
+ */
+export declare const AssetTile: import("react").ForwardRefExoticComponent<AssetTileProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface AssetGridEmptyProps {
+    title: string;
+    description?: ReactNode;
+    action?: ReactNode;
+}
+/** Nothing in the library yet — one action, the one that fills it. */
+export declare function AssetGridEmpty({ title, description, action }: AssetGridEmptyProps): import("react").JSX.Element;
+//# sourceMappingURL=index.d.cts.map

package/dist/components/AssetGrid/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AssetGrid/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,cAAc,CAAC;IACpE;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wDAAwD;IACxD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,2GAmBpB,CAAC;AAEH,MAAM,WAAW,sBAAsB;IACrC,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,+DAA+D;AAC/D,wBAAgB,iBAAiB,CAAC,EAAE,KAAS,EAAE,EAAE,sBAAsB,+BAWtE;AAED,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAClE,+EAA+E;IAC/E,IAAI,EAAE,MAAM,CAAC;IACb,+EAA+E;IAC/E,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,0EAA0E;IAC1E,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,2GA0EpB,CAAC;AAEH,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,sEAAsE;AACtE,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,mBAAmB,+BASjF"}

package/dist/components/AssetGrid/index.d.ts

@@ -0,0 +1,54 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+import type { IconName } from "../Icon/icons.js";
+export interface AssetGridProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Renders placeholder tiles instead of children. The grid keeps its
+     * geometry, so nothing moves when the real assets arrive.
+     */
+    isLoading?: boolean;
+    /** How many placeholder tiles to show while loading. */
+    loadingCount?: number;
+    children?: ReactNode;
+}
+/**
+ * The media library surface: an auto-filling grid of asset tiles. Sits inside
+ * a `TableFrame` when it is the page's collection, bare inside a drawer.
+ */
+export declare const AssetGrid: import("react").ForwardRefExoticComponent<AssetGridProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface AssetTileSkeletonProps {
+    /** Position in the grid — drives the stagger, nothing else. */
+    index?: number;
+}
+/** One loading tile: thumbnail block, name line, meta line. */
+export declare function AssetTileSkeleton({ index }: AssetTileSkeletonProps): import("react").JSX.Element;
+export interface AssetTileProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSelect" | "title"> {
+    /** File name, shown in full — asset names are how people find things again. */
+    name: string;
+    /** Thumbnail source. Omit for a non-image asset and pass an `icon` instead. */
+    src?: string;
+    /** Glyph shown when there is no thumbnail, or while one fails to load. */
+    icon?: IconName;
+    /** Second line: dimensions, size, date — whatever the library sorts by. */
+    meta?: ReactNode;
+    /** Paints the soft fill and the solid rail. Never changes the tile's size. */
+    isSelected?: boolean;
+    /** The asset is still uploading or processing: dimmed, with a spinner. */
+    isPending?: boolean;
+    /** Makes the whole tile a selection target. */
+    onSelect?: () => void;
+    /** Badges or a menu, pinned to the top of the thumbnail. */
+    actions?: ReactNode;
+}
+/**
+ * One asset in the library. Selection paints a fill and a rail exactly like a
+ * table row, so a grid and a list read as the same collection in two shapes.
+ */
+export declare const AssetTile: import("react").ForwardRefExoticComponent<AssetTileProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface AssetGridEmptyProps {
+    title: string;
+    description?: ReactNode;
+    action?: ReactNode;
+}
+/** Nothing in the library yet — one action, the one that fills it. */
+export declare function AssetGridEmpty({ title, description, action }: AssetGridEmptyProps): import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/AssetGrid/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/AssetGrid/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,cAAc,CAAC;IACpE;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wDAAwD;IACxD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,2GAmBpB,CAAC;AAEH,MAAM,WAAW,sBAAsB;IACrC,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,+DAA+D;AAC/D,wBAAgB,iBAAiB,CAAC,EAAE,KAAS,EAAE,EAAE,sBAAsB,+BAWtE;AAED,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAClE,+EAA+E;IAC/E,IAAI,EAAE,MAAM,CAAC;IACb,+EAA+E;IAC/E,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,0EAA0E;IAC1E,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,2GA0EpB,CAAC;AAEH,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,sEAAsE;AACtE,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,mBAAmB,+BASjF"}