themelia-ui 3.0.0 → 3.2.0

package/dist/rich-text-editor-D_Ppm8yh.js

@@ -0,0 +1,491 @@
+import "#core.css";
+import { c as e, s as t, t as n } from "./typography-DmeR05Er.js";
+import { t as r } from "./cx--CBrhWH0.js";
+import { w as i } from "./primitives-BskKlf35.js";
+import { c as a } from "./text-inputs-BboE77nZ.js";
+import { n as o, o as s, r as c, t as l } from "./toolbar-DBK-c4yy.js";
+import { t as u } from "./tiptap-engine-IJO4CSsk.js";
+import { BoldIcon as d, Code2Icon as f, ItalicIcon as p, ListIcon as m, ListOrderedIcon as h, QuoteIcon as g, Redo2Icon as _, StrikethroughIcon as v, Undo2Icon as ee } from "lucide-react";
+import { useCallback as y, useEffect as b, useImperativeHandle as te, useMemo as ne, useRef as x, useState as S, useSyncExternalStore as C } from "react";
+import { Fragment as re, jsx as w, jsxs as T } from "react/jsx-runtime";
+import "#css/rich-text-editor.css";
+//#region src/components/features/rich-text-editor/editor-dom.ts
+var E = "p, li, h1, h2, h3, h4, h5, h6, blockquote", D = /* @__PURE__ */ new Set([
+	"",
+	"<p></p>",
+	"<p><br></p>",
+	"<br>",
+	"<div><br></div>"
+]);
+function O(e) {
+	let t = e.trim();
+	return D.has(t) ? "" : t;
+}
+function k(e) {
+	let t = O(e);
+	return t === "" ? "<p></p>" : t;
+}
+function A(e) {
+	return e.replace(/<\/(?:p|div|li|h[1-6]|blockquote|pre)>/gi, " ").replace(/<br\s*\/?>/gi, " ").replace(/<[^>]*>/g, "").replace(/&nbsp;/g, " ");
+}
+function j() {
+	if (typeof window > "u") return null;
+	let e = window.getSelection();
+	if (!e || e.rangeCount === 0) return null;
+	let t = e.getRangeAt(0);
+	if (!t.collapsed) return null;
+	let n = t.startContainer;
+	for (; n && n.nodeType !== Node.ELEMENT_NODE;) n = n.parentNode;
+	if (!n || !n.closest("[contenteditable=\"true\"]")) return null;
+	let r = t.startContainer.nodeType === Node.TEXT_NODE ? (t.startContainer.textContent ?? "").slice(0, t.startOffset) : "", i = t.startContainer;
+	for (; i && i !== n;) {
+		for (let e = i.previousSibling; e; e = e.previousSibling) r = (e.textContent ?? "") + r;
+		if (i = i.parentNode, i && i.matches?.(E)) break;
+	}
+	let a = t.getBoundingClientRect();
+	return {
+		textBefore: r,
+		rect: a && (a.top || a.left || a.right || a.bottom) ? {
+			top: a.top,
+			left: a.left,
+			bottom: a.bottom,
+			right: a.right
+		} : void 0
+	};
+}
+function ie(e) {
+	let t = e;
+	for (; t;) {
+		if (t.previousSibling) {
+			for (t = t.previousSibling; t?.lastChild;) t = t.lastChild;
+			if (t?.nodeType === Node.TEXT_NODE) return t;
+			continue;
+		}
+		if (t = t.parentNode, !t || t.matches?.(`${E}, [contenteditable="true"]`)) return null;
+	}
+	return null;
+}
+function ae(e, t, n) {
+	if (typeof window > "u") return;
+	let r = window.getSelection();
+	if (!r || r.rangeCount === 0) return;
+	let i = r.getRangeAt(0);
+	if (!i.collapsed) return;
+	let a = e, o = i.startContainer, s = i.startOffset;
+	for (; a > 0;) {
+		if (o.nodeType === Node.TEXT_NODE) {
+			let e = Math.min(s, a);
+			if (s -= e, a -= e, a === 0) break;
+		}
+		let e = ie(o);
+		if (!e) break;
+		o = e, s = e.textContent?.length ?? 0;
+	}
+	let c = document.createRange();
+	c.setStart(o, s), c.setEnd(i.endContainer, i.endOffset);
+	let l = (o.parentElement ?? null)?.closest("[contenteditable=\"true\"]");
+	c.deleteContents(), c.insertNode(document.createRange().createContextualFragment(t)), r.removeAllRanges(), c.collapse(!1), r.addRange(c), l && n();
+}
+function oe(e, t) {
+	if (typeof window > "u" || !e) return;
+	e.focus();
+	let n = window.getSelection(), r = n && n.rangeCount > 0 ? n.getRangeAt(0) : null;
+	if (!r || !e.contains(r.commonAncestorContainer)) {
+		e.insertAdjacentHTML("beforeend", t);
+		return;
+	}
+	r.deleteContents(), r.insertNode(document.createRange().createContextualFragment(t)), r.collapse(!1), n.removeAllRanges(), n.addRange(r);
+}
+//#endregion
+//#region src/components/features/rich-text-editor/rich-text-editor.strings.ts
+var M = {
+	editorLabel: "Rich text editor",
+	sourceLabel: "HTML source",
+	toolbarLabel: "Formatting",
+	toolbar: {
+		bold: "Bold",
+		italic: "Italic",
+		strike: "Strike",
+		bulletList: "Bullet list",
+		orderedList: "Ordered list",
+		blockquote: "Quote",
+		undo: "Undo",
+		redo: "Redo",
+		sourceCode: "Source code"
+	},
+	counts: {
+		characters: "characters",
+		words: "words"
+	}
+}, N = {
+	root: "rich-text-editor__root___MRWcD",
+	toolbar: "rich-text-editor__toolbar___Yd4rD",
+	toolbarRule: "rich-text-editor__toolbarRule___aZWen",
+	toolbarTrailing: "rich-text-editor__toolbarTrailing___eJpyL",
+	bodyWrap: "rich-text-editor__bodyWrap___5cELi",
+	source: "rich-text-editor__source___tH6UD",
+	mount: "rich-text-editor__mount___iRz9J",
+	body: "rich-text-editor__body___9gEV_",
+	placeholder: "rich-text-editor__placeholder___eRucn",
+	footerSlot: "rich-text-editor__footerSlot___E1Vt-",
+	counts: "rich-text-editor__counts___d4bAu"
+};
+//#endregion
+//#region src/components/features/rich-text-editor/rich-text-editor-toolbar.tsx
+function P({ config: e, disabled: t, separatorBefore: n = !1 }) {
+	let r = e.icon, i = e.isActive(), a = /* @__PURE__ */ w(o, {
+		type: "button",
+		tone: i ? "primary" : "neutral",
+		appearance: i ? "solid" : "ghost",
+		iconOnly: !0,
+		onMouseDown: (e) => e.preventDefault(),
+		onClick: e.run,
+		disabled: t || e.disabled,
+		"aria-pressed": i,
+		"aria-label": e.label,
+		title: e.label,
+		children: /* @__PURE__ */ w(r, {})
+	});
+	return n ? /* @__PURE__ */ T(c, { children: [/* @__PURE__ */ w(s, {
+		orientation: "vertical",
+		className: N.toolbarRule
+	}), a] }) : a;
+}
+function F({ buttons: e, extraToolbarItems: t, hideSourceToggle: n = !1, sourceMode: i, toggleSourceMode: a, disabled: o = !1, toolbarTrailing: s, strings: c, className: u }) {
+	let d = o || i;
+	return /* @__PURE__ */ T(l, {
+		"aria-label": c.toolbarLabel ?? "Formatting",
+		className: r("rich-text-editor-toolbar--component", N.toolbar, u),
+		children: [
+			e.map((e) => /* @__PURE__ */ w(P, {
+				config: e,
+				disabled: d
+			}, e.id)),
+			!n && /* @__PURE__ */ w(P, {
+				separatorBefore: !0,
+				config: {
+					id: "source",
+					icon: f,
+					label: c.toolbar.sourceCode,
+					isActive: () => i,
+					run: a
+				},
+				disabled: o
+			}),
+			t?.map((e, t) => /* @__PURE__ */ w(P, {
+				separatorBefore: t === 0,
+				config: {
+					id: e.id,
+					icon: e.icon,
+					label: e.label,
+					isActive: e.isActive ?? (() => !1),
+					run: e.onClick,
+					disabled: e.disabled
+				},
+				disabled: d
+			}, e.id)),
+			!!s && /* @__PURE__ */ w("div", {
+				className: N.toolbarTrailing,
+				children: s
+			})
+		]
+	});
+}
+function I({ text: e, maxLength: n, strings: a, className: o }) {
+	let s = e.length, c = e.trim().length > 0 ? e.trim().split(/\s+/).length : 0, l = typeof n == "number" && s > n;
+	return /* @__PURE__ */ T("div", {
+		className: r("editor-counts--component", N.counts, o),
+		children: [/* @__PURE__ */ T(t, {
+			tag: "span",
+			size: "xs",
+			type: l ? "error" : "secondary",
+			weight: l ? "medium" : "normal",
+			children: [
+				/* @__PURE__ */ w(i, {
+					value: s,
+					size: "xs",
+					type: "inherit"
+				}),
+				typeof n == "number" && /* @__PURE__ */ T(re, { children: [" / ", /* @__PURE__ */ w(i, {
+					value: n,
+					size: "xs",
+					type: "inherit"
+				})] }),
+				" ",
+				a.counts.characters
+			]
+		}), /* @__PURE__ */ T(t, {
+			tag: "span",
+			size: "xs",
+			type: "secondary",
+			children: [
+				/* @__PURE__ */ w(i, {
+					value: c,
+					size: "xs",
+					type: "inherit"
+				}),
+				" ",
+				a.counts.words
+			]
+		})]
+	});
+}
+//#endregion
+//#region src/components/features/rich-text-editor/use-editor-document.ts
+var L = [N.body, ...n().split(" ")].filter(Boolean);
+function se({ engine: e, value: t, onValueChange: n, onCaretChange: r, disabled: i, autoFocus: a, label: o }) {
+	let s = x(null), c = x(null), l = x(null), d = x({
+		onValueChange: n,
+		onCaretChange: r
+	}), f = x(t), p = x(t), m = x(O(t)), h = x(!1), [g, _] = S(null);
+	b(() => {
+		d.current = {
+			onValueChange: n,
+			onCaretChange: r
+		}, f.current = t;
+	});
+	let v = y(() => {
+		if (h.current) return;
+		let e = O(l.current?.getState().html ?? c.current?.innerHTML ?? "");
+		e !== m.current && (m.current = e, d.current.onValueChange(e)), d.current.onCaretChange?.();
+	}, []);
+	return b(() => {
+		let t = s.current;
+		if (!t) return;
+		let n = e ?? u({
+			element: t,
+			content: f.current
+		}), r = n.mount?.(t) ?? t;
+		n.mount ? e && n.setHtml(f.current) : (r.innerHTML = k(f.current), n.setHtml(f.current)), l.current = n, c.current = r, m.current = O(n.getState().html), p.current = f.current;
+		let i = n.subscribe(v);
+		return _(n), () => {
+			i(), l.current = null, c.current = null, e ? n.unmount?.() : n.destroy();
+		};
+	}, [e, v]), b(() => {
+		let e = c.current;
+		e && (e.classList.add(...L), e.setAttribute("role", "textbox"), e.setAttribute("aria-label", o), e.setAttribute("aria-multiline", "true"), e.setAttribute("aria-disabled", String(i)), g?.setEditable ? g.setEditable(!i) : e.contentEditable = String(!i));
+	}, [
+		g,
+		i,
+		o
+	]), b(() => {
+		a && !i && g?.focus();
+	}, [
+		g,
+		a,
+		i
+	]), b(() => {
+		if (!(!g || t === p.current) && (p.current = t, O(t) !== m.current)) {
+			h.current = !0;
+			try {
+				g.setHtml(t), m.current = O(g.getState().html);
+			} finally {
+				h.current = !1;
+			}
+		}
+	}, [g, t]), {
+		host: s,
+		editable: c,
+		current: l,
+		activeEngine: g,
+		state: C(y((e) => g?.subscribe(e) ?? (() => {}), [g]), () => g?.getState() ?? null, () => null),
+		emit: v,
+		read: y(() => O(l.current?.getState().html ?? f.current), []),
+		write: y((e) => {
+			l.current?.setHtml(e), v();
+		}, [v]),
+		noteCaret: y(() => d.current.onCaretChange?.(), [])
+	};
+}
+//#endregion
+//#region src/components/features/rich-text-editor/rich-text-editor.tsx
+function R({ engine: n, value: i, onValueChange: o, placeholder: s, compact: c = !1, minHeight: l, maxHeight: u, disabled: f = !1, showCounts: b = !1, maxLength: x, extraToolbarItems: C, toolbarTrailing: re, footerSlot: E, hideSourceToggle: D = !1, autoFocus: k = !1, className: ie, onCaretChange: P, strings: L, ref: R }) {
+	let z = {
+		...M,
+		...L,
+		toolbar: {
+			...M.toolbar,
+			...L?.toolbar
+		},
+		counts: {
+			...M.counts,
+			...L?.counts
+		}
+	}, [ce, B] = S(!1), [V, le] = S(!1), [H, U] = S({
+		raw: "",
+		html: ""
+	}), { host: ue, editable: W, current: G, activeEngine: K, state: q, emit: J, read: Y, write: X, noteCaret: de } = se({
+		engine: n,
+		value: i,
+		onValueChange: o,
+		onCaretChange: P,
+		disabled: f,
+		autoFocus: k,
+		label: z.editorLabel
+	}), Z = O(q?.html ?? i), fe = H.html === Z ? H.raw : Z;
+	te(R, () => ({
+		focus: () => G.current?.focus(),
+		getHTML: Y,
+		setHTML: X,
+		insertHTML: (e) => {
+			G.current?.insertHtml ? G.current.insertHtml(e) : oe(W.current, e), J();
+		},
+		isEmpty: () => Y() === "",
+		clear: () => X(""),
+		getCaretContext: () => V ? null : G.current?.getCaretContext ? G.current.getCaretContext() : W.current?.contains(window.getSelection()?.anchorNode ?? null) ? j() : null,
+		replaceBeforeCaret: (e, t) => {
+			G.current?.replaceBeforeCaret ? G.current.replaceBeforeCaret(e, t) : ae(e, t, J), J();
+		}
+	}), [
+		G,
+		W,
+		J,
+		Y,
+		V,
+		X
+	]);
+	let Q = y((e) => {
+		K?.execute(e), J();
+	}, [K, J]), $ = y((e) => q?.active.has(e) ?? !1, [q]), pe = ne(() => [
+		{
+			id: "bold",
+			icon: d,
+			label: z.toolbar.bold,
+			isActive: () => $("bold"),
+			run: () => Q("bold")
+		},
+		{
+			id: "italic",
+			icon: p,
+			label: z.toolbar.italic,
+			isActive: () => $("italic"),
+			run: () => Q("italic")
+		},
+		{
+			id: "strike",
+			icon: v,
+			label: z.toolbar.strike,
+			isActive: () => $("strike"),
+			run: () => Q("strike")
+		},
+		{
+			id: "bullet-list",
+			icon: m,
+			label: z.toolbar.bulletList,
+			isActive: () => $("bulletList"),
+			run: () => Q("bulletList")
+		},
+		{
+			id: "ordered-list",
+			icon: h,
+			label: z.toolbar.orderedList,
+			isActive: () => $("orderedList"),
+			run: () => Q("orderedList")
+		},
+		{
+			id: "blockquote",
+			icon: g,
+			label: z.toolbar.blockquote,
+			isActive: () => $("blockquote"),
+			run: () => Q("blockquote")
+		},
+		{
+			id: "undo",
+			icon: ee,
+			label: z.toolbar.undo,
+			isActive: () => !1,
+			run: () => Q("undo"),
+			disabled: q ? !q.canUndo : void 0
+		},
+		{
+			id: "redo",
+			icon: _,
+			label: z.toolbar.redo,
+			isActive: () => !1,
+			run: () => Q("redo"),
+			disabled: q ? !q.canRedo : void 0
+		}
+	], [
+		z.toolbar,
+		Q,
+		$,
+		q
+	]), me = y(() => {
+		if (!V) {
+			let e = Y();
+			U({
+				raw: e,
+				html: e
+			});
+		}
+		le((e) => !e);
+	}, [Y, V]), he = y((e) => {
+		let t = e.target.value;
+		X(t), U({
+			raw: t,
+			html: Y()
+		});
+	}, [Y, X]), ge = ne(() => ({
+		...l ? { minHeight: l } : {},
+		...u ? {
+			maxHeight: u,
+			overflowY: "auto"
+		} : {}
+	}), [u, l]), _e = O(i) === "", ve = A(V ? fe : O(i));
+	return /* @__PURE__ */ T("div", {
+		"data-slot": "rich-text-editor",
+		"data-compact": c || void 0,
+		"data-disabled": f || void 0,
+		className: r("rich-text-editor--component", N.root, ie),
+		children: [
+			/* @__PURE__ */ w(F, {
+				buttons: pe,
+				extraToolbarItems: C,
+				hideSourceToggle: D,
+				sourceMode: V,
+				toggleSourceMode: me,
+				disabled: f,
+				toolbarTrailing: re,
+				strings: z
+			}),
+			V && /* @__PURE__ */ w(a, {
+				"aria-label": z.sourceLabel,
+				value: fe,
+				onChange: he,
+				disabled: f,
+				spellCheck: !1,
+				className: r(N.source, e({ mono: !0 })),
+				style: ge
+			}),
+			/* @__PURE__ */ T("div", {
+				className: N.bodyWrap,
+				style: ge,
+				hidden: V,
+				children: [!!s && _e && !ce && /* @__PURE__ */ w(t, {
+					type: "secondary",
+					className: N.placeholder,
+					children: s
+				}), /* @__PURE__ */ w("div", {
+					ref: ue,
+					className: N.mount,
+					onInput: J,
+					onKeyUp: de,
+					onMouseUp: de,
+					onFocus: () => B(!0),
+					onBlur: () => B(!1)
+				})]
+			}),
+			!!E && /* @__PURE__ */ w("div", {
+				className: N.footerSlot,
+				children: E
+			}),
+			b && /* @__PURE__ */ w(I, {
+				text: ve,
+				maxLength: x,
+				strings: z
+			})
+		]
+	});
+}
+//#endregion
+export { A as a, j as c, M as i, ae as l, I as n, oe as o, F as r, O as s, R as t, k as u };

package/dist/{sheet-CKcmRbJ9.js → sheet-CJ1-OAla.js}

@@ -1,12 +1,12 @@
 import { t as e } from "./cx--CBrhWH0.js";
-import { n as t } from "./ui-provider-Cmoq6i_D.js";
-import { r as n } from "./overlay-WQOsLd69.js";
+import { n as t } from "./ui-provider-DpzLUD12.js";
+import { r as n } from "./overlay-BuQOl8aP.js";
 import "react";
 import { jsx as r } from "react/jsx-runtime";
 //#region src/components/base/sheet/sheet.tsx
 var i = {
 	side: "inline-end",
-	size: "md",
+	size: "default",
 	length: "full",
 	inset: !1
 };