themelia-react-ui 2.0.4 → 2.0.6

package/dist/{rich-text-editor-Cm1dpUpQ.js → rich-text-editor-CAurDwT5.js}

@@ -1,23 +1,23 @@
 "use client";
 import { interpolateString as e, useStrings as t } from "./lib/strings.js";
-import { t as n } from "./utils-CF3c95Io.js";
-import { n as r } from "./buttons-BbfzgczK.js";
-import { c as i } from "./typography-CSyJrh28.js";
-import { t as a } from "./structure-C0V0_Fyf.js";
-import { n as o } from "./safe-image-src-C6kQSMBZ.js";
-import { n as s } from "./content-typography-CnwgMJ37.js";
-import { g as c } from "./primitives-Du64iDbb.js";
-import { t as l } from "./number-E_OiIfJz.js";
-import { t as u } from "./input-Cdw4k0fb.js";
-import { t as d } from "./form-field-CsgRmdit.js";
-import { n as f, t as ee } from "./rich-text-editor-toolbar-L__e4x47.js";
-import { t as te } from "./rich-text-editor.strings-CB59ekH2.js";
-import { forwardRef as p, useCallback as m, useEffect as h, useId as ne, useImperativeHandle as re, useMemo as g, useRef as _, useState as v } from "react";
+import { t as n } from "./utils-DhuoqFy4.js";
+import { n as r } from "./buttons-DeW0bQeK.js";
+import { c as i } from "./typography-C7-YMW1S.js";
+import { t as a } from "./structure-DZJ2wbAU.js";
+import { r as o, t as s } from "./sanitize-html-BWkH4dLM.js";
+import { g as c } from "./primitives-BkkQjYl7.js";
+import { t as l } from "./number-CYqBcrSj.js";
+import { t as u } from "./input-7KAc7XQL.js";
+import { t as d } from "./form-field-CAPdwdnZ.js";
+import { n as ee } from "./field-control-attributes-B6i335wr.js";
+import { n as f, t as te } from "./rich-text-editor-toolbar-DbXig7Jk.js";
+import { t as ne } from "./rich-text-editor.strings-CB59ekH2.js";
+import { forwardRef as p, useCallback as m, useEffect as h, useId as re, useImperativeHandle as ie, useLayoutEffect as ae, useMemo as g, useRef as _, useState as v } from "react";
 import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
-import { AlertCircle as ie, Bold as ae, ImagePlus as S, Italic as oe, List as se, ListOrdered as ce, Loader2 as le, Quote as ue, Redo2 as de, Strikethrough as fe, Undo2 as pe } from "lucide-react";
-import * as C from "@tiptap/react";
-import * as me from "@tiptap/starter-kit";
+import { AlertCircle as S, Bold as oe, ImagePlus as C, Italic as se, List as ce, ListOrdered as le, Loader2 as ue, Quote as de, Redo2 as fe, Strikethrough as pe, Undo2 as me } from "lucide-react";
 import { createPortal as he } from "react-dom";
+import * as w from "@tiptap/react";
+import * as T from "@tiptap/starter-kit";
 //#region src/components/features/rich-text-editor/partials/caret-helpers.ts
 function ge() {
 	if (typeof window > "u") return null;
@@ -52,13 +52,13 @@ function ge() {
 function _e(e, t, n, r) {
 	if (typeof window > "u") return;
 	if (e) {
-		let { selection: i } = e.state;
-		if (!i.empty) return;
-		let a = i.from - Math.min(t, i.$from.parentOffset);
+		let { selection: r } = e.state;
+		if (!r.empty) return;
+		let i = r.from - Math.min(t, r.$from.parentOffset);
 		e.chain().focus().insertContentAt({
-			from: a,
-			to: i.from
-		}, n).run(), r(e.getHTML());
+			from: i,
+			to: r.from
+		}, n).run();
 		return;
 	}
 	let i = window.getSelection();
@@ -71,7 +71,7 @@ function _e(e, t, n, r) {
 			let e = Math.min(c, o);
 			if (c -= e, o -= e, o === 0) break;
 		}
-		let e = w(s);
+		let e = ye(s);
 		if (!e) break;
 		s = e, c = e.textContent?.length ?? 0;
 	}
@@ -80,7 +80,7 @@ function _e(e, t, n, r) {
 	let u = document.createRange().createContextualFragment(n);
 	l.insertNode(u), i.collapseToEnd();
 	let d = s?.parentElement?.closest?.("[contenteditable=\"true\"]") ?? null;
-	d && r(d.innerHTML);
+	d && r?.(d.innerHTML);
 }
 function ve(e, t) {
 	if (typeof window > "u" || !e) return;
@@ -99,7 +99,7 @@ function ve(e, t) {
 	let i = document.createRange().createContextualFragment(t);
 	r.insertNode(i), r.collapse(!1), n.removeAllRanges(), n.addRange(r);
 }
-function w(e) {
+function ye(e) {
 	let t = e;
 	for (; t;) {
 		if (t.previousSibling) {
@@ -113,10 +113,10 @@ function w(e) {
 }
 //#endregion
 //#region src/components/features/rich-text-editor/partials/counts-footer.tsx
-function T({ text: e, maxLength: t, strings: r, className: a }) {
+function be({ text: e, maxLength: t, strings: r, className: a }) {
 	let o = e.length, s = e.trim().length > 0 ? e.trim().split(/\s+/).length : 0, u = typeof t == "number" && o > t;
 	return /* @__PURE__ */ x("div", {
-		className: n("counts-footer-text--component border-border flex items-center justify-end gap-space-lg border-t px-control py-space-sm", a),
+		className: n("counts-footer-text--component border-border flex items-center justify-end gap-space-lg border-t px-surface-xs py-space-sm", a),
 		children: [/* @__PURE__ */ x(i, {
 			tag: "span",
 			size: "xs",
@@ -155,43 +155,60 @@ function T({ text: e, maxLength: t, strings: r, className: a }) {
 		})]
 	});
 }
-T.displayName = "CountsFooterText";
-function E({ editor: e, sourceMode: t, sourceValue: n, maxLength: r, strings: i }) {
+be.displayName = "CountsFooterText";
+function xe({ editor: e, sourceMode: t, sourceValue: n, maxLength: r, strings: i }) {
 	let a = t ? n.replace(/<[^>]*>/g, "") : e?.getText() ?? "";
-	return /* @__PURE__ */ b(T, {
+	return /* @__PURE__ */ b(be, {
 		text: a,
 		maxLength: r,
 		strings: i
 	});
 }
-E.displayName = "CountsFooter";
+xe.displayName = "CountsFooter";
+//#endregion
+//#region src/components/features/rich-text-editor/partials/editor-field-aria.ts
+function Se(e, t, n) {
+	return t ? {
+		role: "combobox",
+		"aria-label": e,
+		"aria-expanded": "true",
+		"aria-haspopup": "listbox",
+		"aria-autocomplete": "list",
+		"aria-controls": t,
+		...n ? { "aria-activedescendant": n } : {}
+	} : {
+		role: "textbox",
+		"aria-label": e,
+		"aria-multiline": "true"
+	};
+}
 //#endregion
 //#region src/components/features/rich-text-editor/partials/html-helpers.ts
-function D(e) {
+function E(e) {
 	let t = e.trim();
 	return t === "" || t === "<p></p>" || t === "<p><br></p>" ? "" : t;
 }
-function O(e) {
-	let t = D(e);
+function D(e) {
+	let t = E(e);
 	return t === "" ? "<p></p>" : t;
 }
 //#endregion
 //#region src/components/features/rich-text-editor/partials/inline-reference-node.ts
-var k = "rsc-mention inline-reference--chip", A = "inlineReference";
-function j(e) {
+var Ce = "rsc-mention inline-reference--chip", we = "inlineReference";
+function Te(e) {
 	return ({ editor: t }) => t.commands.command(({ tr: t, state: n }) => {
 		let { selection: r } = n;
 		if (!r.empty) return !1;
 		let { $from: i } = r, a = e === "backward" ? i.nodeBefore : i.nodeAfter;
-		if (a?.type.name !== A) return !1;
+		if (a?.type.name !== we) return !1;
 		let o = e === "backward" ? i.pos - a.nodeSize : i.pos;
 		return t.delete(o, o + a.nodeSize), !0;
 	});
 }
-var M = null;
-function N() {
-	return M ??= C.Node.create({
-		name: A,
+var Ee = null;
+function De() {
+	return Ee ??= w.Node.create({
+		name: we,
 		group: "inline",
 		inline: !0,
 		atom: !0,
@@ -227,7 +244,7 @@ function N() {
 		renderHTML({ node: e, HTMLAttributes: t }) {
 			return [
 				"span",
-				C.mergeAttributes({
+				w.mergeAttributes({
 					class: "rsc-mention",
 					contenteditable: "false"
 				}, t),
@@ -240,33 +257,33 @@ function N() {
 		addNodeView() {
 			return ({ node: e }) => {
 				let t = document.createElement("span");
-				return t.className = k, t.setAttribute("contenteditable", "false"), t.setAttribute("data-ref-id", String(e.attrs.id ?? "")), e.attrs.kind && t.setAttribute("data-ref-kind", String(e.attrs.kind)), e.attrs.tone && t.setAttribute("data-ref-tone", String(e.attrs.tone)), t.textContent = String(e.attrs.label ?? ""), { dom: t };
+				return t.className = Ce, t.setAttribute("contenteditable", "false"), t.setAttribute("data-ref-id", String(e.attrs.id ?? "")), e.attrs.kind && t.setAttribute("data-ref-kind", String(e.attrs.kind)), e.attrs.tone && t.setAttribute("data-ref-tone", String(e.attrs.tone)), t.textContent = String(e.attrs.label ?? ""), { dom: t };
 			};
 		},
 		addKeyboardShortcuts() {
 			return {
-				Backspace: j("backward"),
-				Delete: j("forward")
+				Backspace: Te("backward"),
+				Delete: Te("forward")
 			};
 		}
-	}), M;
+	}), Ee;
 }
-var P = "data-rte-upload", ye = "rich-text-editor--upload my-space-xs flex min-h-control items-center rounded-inner border border-dashed border-input bg-muted/30 px-row-x py-row-y", F = RegExp(`<span[^>]*\\b${P}="[^"]*"[^>]*>[\\s\\S]*?</span>`, "g");
-function be(e) {
-	return e.includes("data-rte-upload") ? e.replace(F, "") : e;
+var O = "data-rte-upload", Oe = "rich-text-editor--upload my-space-xs flex min-h-control items-center rounded-radius border border-dashed border-input bg-muted/30 px-row-x py-row-y", k = RegExp(`<span[^>]*\\b${O}="[^"]*"[^>]*>[\\s\\S]*?</span>`, "g");
+function ke(e) {
+	return e.includes("data-rte-upload") ? e.replace(k, "") : e;
 }
-function I(e, t) {
+function A(e, t) {
 	let n = e.type.toLowerCase(), r = e.name.toLowerCase();
 	return t.split(",").map((e) => e.trim().toLowerCase()).filter(Boolean).some((e) => e.startsWith(".") ? r.endsWith(e) : e.endsWith("/*") ? n.startsWith(e.slice(0, -1)) : n === e);
 }
-function L(e) {
+function Ae(e) {
 	return e.replace(/\.[^.]+$/, "").replace(/[-_]+/g, " ").trim();
 }
-function xe(e) {
+function je(e) {
 	return Array.from(e?.files ?? []).filter((e) => e.type.startsWith("image/"));
 }
-var R = 0;
-function Se(t, n, r) {
+var j = 0;
+function Me(t, n, r) {
 	let [i, a] = v([]), [s, c] = v(null), l = _(/* @__PURE__ */ new Map());
 	h(() => () => {
 		for (let e of l.current.values()) e.controller?.abort();
@@ -293,7 +310,7 @@ function Se(t, n, r) {
 			let c = n.current?.findPlaceholder(e);
 			u(e), c && n.current?.resolvePlaceholder(e, {
 				src: s,
-				alt: a.alt ?? L(r.file.name),
+				alt: a.alt ?? Ae(r.file.name),
 				width: a.width,
 				height: a.height
 			});
@@ -317,14 +334,14 @@ function Se(t, n, r) {
 			if (!t) return;
 			let a = t.accept ?? "image/png,image/jpeg,image/gif,image/webp", o = [];
 			for (let s of i) {
-				let i = I(s, a) ? t.maxSize && s.size > t.maxSize ? r.tooLarge : null : r.unsupported;
+				let i = A(s, a) ? t.maxSize && s.size > t.maxSize ? r.tooLarge : null : r.unsupported;
 				if (i) {
 					let n = e(i, { name: s.name });
 					o.push(n), t.onError?.(Error(n), s);
 					continue;
 				}
-				R += 1;
-				let c = `upload-${R}`;
+				j += 1;
+				let c = `upload-${j}`;
 				l.current.set(c, { file: s }), n.current?.insertPlaceholder(c), d(c);
 			}
 			c(o.length > 0 ? o.join(" ") : null);
@@ -346,7 +363,7 @@ function Se(t, n, r) {
 		}, [n, u])
 	};
 }
-function z({ upload: t, strings: n, onRetry: o, onRemove: s }) {
+function M({ upload: t, strings: n, onRetry: o, onRemove: s }) {
 	let c = t.status === "error";
 	return /* @__PURE__ */ x(a, {
 		direction: "horizontal",
@@ -356,10 +373,10 @@ function z({ upload: t, strings: n, onRetry: o, onRemove: s }) {
 		className: "rich-text-editor--upload-status w-full min-w-0",
 		"data-status": t.status,
 		children: [
-			c ? /* @__PURE__ */ b(ie, {
+			c ? /* @__PURE__ */ b(S, {
 				className: "size-icon shrink-0 text-destructive",
 				"aria-hidden": "true"
-			}) : /* @__PURE__ */ b(le, {
+			}) : /* @__PURE__ */ b(ue, {
 				className: "size-icon shrink-0 animate-spin text-muted-foreground motion-reduce:animate-none",
 				"aria-hidden": "true"
 			}),
@@ -387,10 +404,10 @@ function z({ upload: t, strings: n, onRetry: o, onRemove: s }) {
 		]
 	});
 }
-function Ce({ queue: e, adapterRef: t, strings: n }) {
+function Ne({ queue: e, adapterRef: t, strings: n }) {
 	return /* @__PURE__ */ b(y, { children: e.uploads.map((r) => {
 		let i = t.current?.findPlaceholder(r.id);
-		return i ? he(/* @__PURE__ */ b(z, {
+		return i ? he(/* @__PURE__ */ b(M, {
 			upload: r,
 			strings: n,
 			onRetry: () => e.retry(r.id),
@@ -398,14 +415,14 @@ function Ce({ queue: e, adapterRef: t, strings: n }) {
 		}), i, r.id) : null;
 	}) });
 }
-function we(e, t, n, r) {
+function Pe(e, t, n, r) {
 	let i = _(null), a = _(r);
 	a.current = r;
 	let o = !!e;
 	return {
 		item: g(() => o ? {
 			id: "insert-image",
-			icon: S,
+			icon: C,
 			label: t.insert,
 			toggle: !1,
 			onClick: () => {
@@ -427,11 +444,11 @@ function we(e, t, n, r) {
 		}) : null
 	};
 }
-function Te({ alt: e, onAltChange: t, onRemove: n, notice: o, onDismissNotice: s, strings: c }) {
-	let l = ne();
+function Fe({ alt: e, onAltChange: t, onRemove: n, notice: o, onDismissNotice: s, strings: c }) {
+	let l = re();
 	return e === null && !o ? null : /* @__PURE__ */ x(a, {
 		gap: "sm",
-		className: "rich-text-editor--image-details border-t border-border/60 px-control py-space-sm",
+		className: "rich-text-editor--image-details border-t border-border/60 px-surface-xs py-space-sm",
 		children: [!!o && /* @__PURE__ */ x(a, {
 			direction: "horizontal",
 			align: "center",
@@ -476,13 +493,13 @@ function Te({ alt: e, onAltChange: t, onRemove: n, notice: o, onDismissNotice: s
 }
 //#endregion
 //#region src/components/features/rich-text-editor/partials/image-nodes.ts
-function B(e) {
+function N(e) {
 	let t = Number(e);
 	return Number.isFinite(t) && t > 0 ? t : null;
 }
-var V = null, H = null;
-function U() {
-	return V ??= C.Node.create({
+var Ie = null, P = null;
+function Le() {
+	return Ie ??= w.Node.create({
 		name: "image",
 		group: "inline",
 		inline: !0,
@@ -502,11 +519,11 @@ function U() {
 				title: { default: null },
 				width: {
 					default: null,
-					parseHTML: (e) => B(e.getAttribute("width"))
+					parseHTML: (e) => N(e.getAttribute("width"))
 				},
 				height: {
 					default: null,
-					parseHTML: (e) => B(e.getAttribute("height"))
+					parseHTML: (e) => N(e.getAttribute("height"))
 				}
 			};
 		},
@@ -518,12 +535,12 @@ function U() {
 		},
 		renderHTML({ HTMLAttributes: e }) {
 			let t = o(e.src);
-			return ["img", C.mergeAttributes(e, { src: t ?? null })];
+			return ["img", w.mergeAttributes(e, { src: t ?? null })];
 		}
-	}), V;
+	}), Ie;
 }
-function W() {
-	return H ??= C.Node.create({
+function Re() {
+	return P ??= w.Node.create({
 		name: "imageUpload",
 		group: "inline",
 		inline: !0,
@@ -536,150 +553,180 @@ function W() {
 			return [];
 		},
 		renderHTML({ node: e }) {
-			return ["span", { [P]: e.attrs.id }];
+			return ["span", { [O]: e.attrs.id }];
 		},
 		addNodeView() {
 			return ({ node: e }) => {
 				let t = document.createElement("span");
-				return t.setAttribute(P, String(e.attrs.id)), t.setAttribute("contenteditable", "false"), t.className = ye, {
+				return t.setAttribute(O, String(e.attrs.id)), t.setAttribute("contenteditable", "false"), t.className = Oe, {
 					dom: t,
 					ignoreMutation: () => !0,
 					stopEvent: () => !0
 				};
 			};
 		}
-	}), H;
+	}), P;
 }
 //#endregion
 //#region src/components/features/rich-text-editor/partials/rich-text-editor-tiptap.tsx
-function G(e) {
-	return D(be(e?.getHTML() ?? ""));
+function F(e) {
+	return E(ke(e?.getHTML() ?? ""));
 }
-var K = C.EditorContent, q = C.useEditor, J = "default" in me ? me.default : me, Y = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1, bodyHeight: c, minHeight: l, maxHeight: u, disabled: d = !1, showCounts: p = !1, maxLength: ne, extraToolbarItems: y, toolbarTrailing: ie, footerSlot: S, hideSourceToggle: le = !1, autoFocus: C = !1, className: me, onCaretChange: he, strings: ve, images: w }, T) {
-	let k = t(te, ve), A = !!w, j = _(null), M = _(null), [P, ye] = v(!1), [F, be] = v(!1), [I, L] = v(""), R = _(!1), z = _(D(e)), B = _(he);
-	B.current = he;
-	let V = q({
+var ze = w.EditorContent, Be = w.useEditor, I = w.useEditorState, Ve = "default" in T ? T.default : T, L = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1, bodyHeight: s, minHeight: c, maxHeight: l, disabled: u = !1, invalid: d, id: p, onBlur: re, "aria-label": y, "aria-labelledby": S, "aria-describedby": C, "aria-invalid": ue, showCounts: he = !1, maxLength: w, extraToolbarItems: T, toolbarTrailing: ve, footerSlot: ye, hideSourceToggle: be = !1, autoFocus: Ce = !1, className: we, onCaretChange: Te, onEditorKeyDown: Ee, suggestionPopup: O, strings: Oe, images: k }, ke) {
+	let A = t(ne, Oe), { ariaInvalid: Ae } = ee(d, ue), j = !!k, M = _(null), N = _(null), [Ie, P] = v(!1), [L, R] = v(!1), z = _(null), [B, He] = v(""), Ue = _(!1), V = _(E(e)), H = _(Te);
+	H.current = Te;
+	let U = u ? void 0 : Ee, We = _(U);
+	ae(() => {
+		We.current = U;
+	}, [U]);
+	let W = O?.listboxId, Ge = O?.activeOptionId, G = y ?? A.editorLabel, K = g(() => {
+		let e = {
+			"data-slot": "editor-field",
+			class: f.editable
+		}, t = {
+			...Se(G, W, Ge),
+			id: p,
+			"aria-labelledby": S,
+			"aria-describedby": C,
+			"aria-invalid": Ae
+		};
+		for (let [n, r] of Object.entries(t)) r !== void 0 && (e[n] = String(r));
+		return e;
+	}, [
+		Ge,
+		C,
+		Ae,
+		S,
+		G,
+		p,
+		W
+	]), q = Be({
 		extensions: g(() => [
-			J,
-			N(),
-			...A ? [U(), W()] : []
-		], [A]),
-		content: O(e),
-		editable: !d,
+			Ve,
+			De(),
+			...j ? [Le(), Re()] : []
+		], [j]),
+		content: D(e),
+		editable: !u,
 		immediatelyRender: !1,
-		autofocus: C ? "end" : !1,
+		autofocus: Ce ? "end" : !1,
 		onFocus: () => {
-			R.current = !0, ye(!0);
+			Ue.current = !0, P(!0);
 		},
 		onBlur: () => {
-			R.current = !1, ye(!1);
+			Ue.current = !1, P(!1);
 		},
 		onUpdate: ({ editor: e }) => {
-			j.current?.prune();
-			let t = G(e);
-			R.current && (t !== z.current && (z.current = t, r(t)), B.current?.());
+			M.current?.prune();
+			let t = F(e);
+			t !== V.current && (V.current = t, r(t)), Ue.current && H.current?.();
 		},
 		editorProps: {
+			handleKeyDown: (e, t) => We.current?.(t) ? (t.preventDefault(), t.stopPropagation(), !0) : !1,
 			handlePaste: (e, t) => {
-				let n = xe(t.clipboardData);
-				return !j.current || !H.current || n.length === 0 ? !1 : (j.current.addFiles(n), !0);
+				let n = je(t.clipboardData);
+				return !M.current || !J.current || n.length === 0 ? !1 : (M.current.addFiles(n), !0);
 			},
 			handleDrop: (e, t, n, r) => {
-				let i = xe(t.dataTransfer);
-				if (r || !j.current || !H.current || i.length === 0) return !1;
+				let i = je(t.dataTransfer);
+				if (r || !M.current || !J.current || i.length === 0) return !1;
 				let a = e.posAtCoords({
 					left: t.clientX,
 					top: t.clientY
 				});
-				return a && M.current?.commands.setTextSelection(a.pos), j.current.addFiles(i), !0;
+				return a && N.current?.commands.setTextSelection(a.pos), M.current.addFiles(i), !0;
 			},
-			attributes: {
-				role: "textbox",
-				"aria-label": k.editorLabel,
-				"aria-multiline": "true",
-				class: s
-			}
+			attributes: K
 		}
-	}, [A]);
-	h(() => {
-		if (!V) return;
-		let t = G(V), n = D(e);
-		z.current = n, t !== n && V.commands.setContent(O(n), { emitUpdate: !1 });
-	}, [V, e]), h(() => {
-		V && V.setEditable(!d);
-	}, [d, V]), h(() => {
+	}, [j]);
+	ae(() => {
+		q && q.options.editorProps.attributes !== K && q.setOptions({ editorProps: {
+			...q.options.editorProps,
+			attributes: K
+		} });
+	}, [q, K]), h(() => {
+		if (!q) return;
+		let t = F(q), n = E(e);
+		V.current = n, t !== n && q.chain().setMeta("addToHistory", !1).setContent(D(n), { emitUpdate: !1 }).run();
+	}, [q, e]), h(() => {
+		q && L && He(q.getHTML());
+	}, [
+		q,
+		L,
+		e
+	]), h(() => {
+		q && q.setEditable(!u, !1);
+	}, [u, q]), h(() => {
 		if (typeof document > "u") return;
 		let e = () => {
-			R.current && B.current?.();
+			Ue.current && H.current?.();
 		};
 		return document.addEventListener("selectionchange", e), () => document.removeEventListener("selectionchange", e);
-	}, []), re(T, () => ({
+	}, []), ie(ke, () => ({
 		focus: () => {
-			V?.chain().focus().run();
+			z.current ? z.current.focus() : q?.chain().focus().run();
 		},
-		getHTML: () => G(V),
+		getHTML: () => F(q),
 		setHTML: (e) => {
-			let t = D(e);
-			z.current = t, V?.commands.setContent(O(t), { emitUpdate: !1 }), r(t);
+			let t = E(e);
+			V.current = t, q?.commands.setContent(D(t), { emitUpdate: !1 }), r(t);
 		},
 		insertHTML: (e) => {
-			V && V.chain().focus().insertContent(e).run();
+			q && q.chain().focus().insertContent(e).run();
 		},
-		isEmpty: () => G(V) === "",
+		isEmpty: () => F(q) === "",
 		clear: () => {
-			z.current = "", V?.commands.setContent("<p></p>", { emitUpdate: !1 }), r("");
+			V.current = "", q?.commands.setContent("<p></p>", { emitUpdate: !1 }), r("");
 		},
 		getCaretContext: () => ge(),
 		replaceBeforeCaret: (e, t) => {
-			_e(V, e, t, (e) => {
-				z.current = D(e), r(z.current);
-			});
+			q && _e(q, e, t);
 		}
-	}), [V, r]), M.current = V ?? null;
-	let H = _(w);
-	H.current = w;
+	}), [q, r]), N.current = q ?? null;
+	let J = _(k);
+	J.current = k;
 	let Y = m(() => {
-		if (!V) return;
-		let e = G(V);
-		e !== z.current && (z.current = e, r(e));
-	}, [V, r]), Ee = m((e) => {
+		if (!q) return;
+		let e = F(q);
+		e !== V.current && (V.current = e, r(e));
+	}, [q, r]), Ke = m((e) => {
 		let t = null;
-		return V?.state.doc.descendants((n, r) => (!t && e(n) && (t = {
+		return q?.state.doc.descendants((n, r) => (!t && e(n) && (t = {
 			pos: r,
 			node: n
 		}), !t)), t;
-	}, [V]), X = _(null);
-	X.current = V ? {
+	}, [q]), qe = _(null);
+	qe.current = q ? {
 		insertPlaceholder: (e) => {
-			V.chain().focus().insertContent({
+			q.chain().focus().insertContent({
 				type: "imageUpload",
 				attrs: { id: e }
 			}).run();
 		},
-		findPlaceholder: (e) => V.view.dom.querySelector(`[data-rte-upload="${e}"]`),
+		findPlaceholder: (e) => q.view.dom.querySelector(`[data-rte-upload="${e}"]`),
 		resolvePlaceholder: (e, t) => {
-			let n = Ee((t) => t.type.name === "imageUpload" && t.attrs.id === e);
+			let n = Ke((t) => t.type.name === "imageUpload" && t.attrs.id === e);
 			if (!n) return;
-			let r = V.schema.nodes.image.create({
+			let r = q.schema.nodes.image.create({
 				src: t.src,
 				alt: t.alt ?? "",
 				width: t.width ?? null,
 				height: t.height ?? null
 			});
-			V.view.dispatch(V.state.tr.replaceWith(n.pos, n.pos + n.node.nodeSize, r)), Y();
+			q.view.dispatch(q.state.tr.replaceWith(n.pos, n.pos + n.node.nodeSize, r)), Y();
 		},
 		removePlaceholder: (e) => {
-			let t = Ee((t) => t.type.name === "imageUpload" && t.attrs.id === e);
-			t && (V.view.dispatch(V.state.tr.delete(t.pos, t.pos + t.node.nodeSize)), Y());
+			let t = Ke((t) => t.type.name === "imageUpload" && t.attrs.id === e);
+			t && (q.view.dispatch(q.state.tr.delete(t.pos, t.pos + t.node.nodeSize)), Y());
 		}
 	} : null;
-	let Z = Se(w, X, k.images);
-	j.current = A ? Z : null;
-	let De = we(w, k.images, Z.addFiles), Oe = g(() => De.item ? [De.item, ...y ?? []] : y, [y, De.item]), [Q, $] = v(null);
+	let X = Me(k, qe, A.images);
+	M.current = j ? X : null;
+	let Z = Pe(k, A.images, X.addFiles), Je = g(() => Z.item ? [Z.item, ...T ?? []] : T, [T, Z.item]), [Q, Ye] = v(null);
 	h(() => {
-		if (!V || !A) return;
+		if (!q || !j) return;
 		let e = () => {
-			let e = V.state.selection, t = null;
+			let e = q.state.selection, t = null;
 			if (e.node?.type.name === "image") t = {
 				pos: e.from,
 				alt: String(e.node.attrs.alt ?? "")
@@ -694,196 +741,206 @@ var K = C.EditorContent, q = C.useEditor, J = "default" in me ? me.default : me,
 					alt: String(r.attrs.alt ?? "")
 				});
 			}
-			$(t);
+			Ye(t);
 		};
-		return V.on("selectionUpdate", e), V.on("update", e), () => {
-			V.off("selectionUpdate", e), V.off("update", e);
+		return q.on("selectionUpdate", e), q.on("update", e), () => {
+			q.off("selectionUpdate", e), q.off("update", e);
 		};
-	}, [V, A]);
-	let ke = f.bodyMinHeight[c ?? (o ? "control" : "document")], Ae = g(() => ({
-		...l ? { minHeight: l } : {},
-		...u ? {
-			maxHeight: u,
+	}, [q, j]);
+	let Xe = f.bodyMinHeight[s ?? (o ? "control" : "document")], Ze = g(() => ({
+		...c ? { minHeight: c } : {},
+		...l ? {
+			maxHeight: l,
 			overflowY: "auto"
 		} : {}
-	}), [u, l]), je = m(() => {
-		if (V) {
-			if (F) {
-				let e = O(I);
-				V.commands.setContent(e, { emitUpdate: !1 });
-				let t = D(I);
-				z.current = t, r(t), be(!1);
-			} else L(V.getHTML()), be(!0);
-		}
+	}), [l, c]), Qe = m(() => {
+		q && (L ? (B !== q.getHTML() && (q.commands.setContent(D(B), { emitUpdate: !1 }), Y()), R(!1)) : (He(q.getHTML()), R(!0)));
 	}, [
-		V,
-		r,
-		F,
-		I
-	]), Me = m((e) => {
-		let t = e.target.value;
-		L(t);
-		let n = D(t);
-		z.current = n, r(n);
-	}, [r]), Ne = g(() => [
+		q,
+		Y,
+		L,
+		B
+	]), $ = I({
+		editor: q,
+		selector: ({ editor: e }) => ({
+			bold: e?.isActive("bold") ?? !1,
+			italic: e?.isActive("italic") ?? !1,
+			strike: e?.isActive("strike") ?? !1,
+			bulletList: e?.isActive("bulletList") ?? !1,
+			orderedList: e?.isActive("orderedList") ?? !1,
+			blockquote: e?.isActive("blockquote") ?? !1,
+			canUndo: e?.can().undo() ?? !1,
+			canRedo: e?.can().redo() ?? !1,
+			extraActive: Je?.map((e) => e.isActive?.() ?? !1)
+		})
+	}), $e = g(() => [
 		{
 			id: "bold",
-			icon: ae,
-			label: k.toolbar.bold,
-			isActive: () => !!V?.isActive("bold"),
+			icon: oe,
+			label: A.toolbar.bold,
+			isActive: () => $?.bold ?? !1,
 			toggle: !0,
-			run: () => V?.chain().focus().toggleBold().run()
+			run: () => q?.chain().focus().toggleBold().run()
 		},
 		{
 			id: "italic",
-			icon: oe,
-			label: k.toolbar.italic,
-			isActive: () => !!V?.isActive("italic"),
+			icon: se,
+			label: A.toolbar.italic,
+			isActive: () => $?.italic ?? !1,
 			toggle: !0,
-			run: () => V?.chain().focus().toggleItalic().run()
+			run: () => q?.chain().focus().toggleItalic().run()
 		},
 		{
 			id: "strike",
-			icon: fe,
-			label: k.toolbar.strike,
-			isActive: () => !!V?.isActive("strike"),
+			icon: pe,
+			label: A.toolbar.strike,
+			isActive: () => $?.strike ?? !1,
 			toggle: !0,
-			run: () => V?.chain().focus().toggleStrike().run()
+			run: () => q?.chain().focus().toggleStrike().run()
 		},
 		{
 			id: "bullet-list",
-			icon: se,
-			label: k.toolbar.bulletList,
-			isActive: () => !!V?.isActive("bulletList"),
+			icon: ce,
+			label: A.toolbar.bulletList,
+			isActive: () => $?.bulletList ?? !1,
 			toggle: !0,
-			run: () => V?.chain().focus().toggleBulletList().run()
+			run: () => q?.chain().focus().toggleBulletList().run()
 		},
 		{
 			id: "ordered-list",
-			icon: ce,
-			label: k.toolbar.orderedList,
-			isActive: () => !!V?.isActive("orderedList"),
+			icon: le,
+			label: A.toolbar.orderedList,
+			isActive: () => $?.orderedList ?? !1,
 			toggle: !0,
-			run: () => V?.chain().focus().toggleOrderedList().run()
+			run: () => q?.chain().focus().toggleOrderedList().run()
 		},
 		{
 			id: "blockquote",
-			icon: ue,
-			label: k.toolbar.blockquote,
-			isActive: () => !!V?.isActive("blockquote"),
+			icon: de,
+			label: A.toolbar.blockquote,
+			isActive: () => $?.blockquote ?? !1,
 			toggle: !0,
-			run: () => V?.chain().focus().toggleBlockquote().run()
+			run: () => q?.chain().focus().toggleBlockquote().run()
 		},
 		{
 			id: "undo",
-			icon: pe,
-			label: k.toolbar.undo,
+			icon: me,
+			label: A.toolbar.undo,
 			isActive: () => !1,
-			run: () => V?.chain().focus().undo().run(),
-			disabled: !V?.can().chain().focus().undo().run()
+			run: () => q?.chain().focus().undo().run(),
+			disabled: !$?.canUndo
 		},
 		{
 			id: "redo",
-			icon: de,
-			label: k.toolbar.redo,
+			icon: fe,
+			label: A.toolbar.redo,
 			isActive: () => !1,
-			run: () => V?.chain().focus().redo().run(),
-			disabled: !V?.can().chain().focus().redo().run()
+			run: () => q?.chain().focus().redo().run(),
+			disabled: !$?.canRedo
 		}
-	], [V, k]), Pe = p && V ? /* @__PURE__ */ b(E, {
-		editor: V,
-		sourceMode: F,
-		sourceValue: I,
-		maxLength: ne,
-		strings: k
-	}) : null, Fe = typeof a == "string" ? a : "", Ie = Fe.length > 0 && !P && V?.isEmpty ? /* @__PURE__ */ b(i, {
+	], [
+		q,
+		A,
+		$
+	]), et = he && q ? /* @__PURE__ */ b(xe, {
+		editor: q,
+		sourceMode: L,
+		sourceValue: B,
+		maxLength: w,
+		strings: A
+	}) : null, tt = typeof a == "string" ? a : "", nt = tt.length > 0 && !Ie && q?.isEmpty ? /* @__PURE__ */ b(i, {
 		tag: "span",
 		size: "sm",
 		type: "secondary",
-		className: "pointer-events-none absolute inset-0 px-control py-control-y-offset",
-		children: Fe
+		className: f.placeholder,
+		children: tt
 	}) : null;
 	return /* @__PURE__ */ x("div", {
-		className: n(f.frame, d && f.disabled, me),
+		onBlur: re && ((e) => {
+			e.currentTarget.contains(e.relatedTarget) || re(e);
+		}),
+		className: n(f.frame, u && f.disabled, we),
 		children: [
-			/* @__PURE__ */ b(ee, {
-				buttons: Ne,
-				extraToolbarItems: Oe,
-				hideSourceToggle: le,
-				sourceMode: F,
-				toggleSourceMode: je,
-				disabled: d,
-				hasEditor: !!V,
-				toolbarTrailing: ie,
-				strings: k
+			/* @__PURE__ */ b(te, {
+				buttons: $e,
+				extraToolbarItems: Je,
+				extraToolbarActive: $?.extraActive,
+				hideSourceToggle: be,
+				sourceMode: L,
+				toggleSourceMode: Qe,
+				disabled: u,
+				hasEditor: !!q,
+				toolbarTrailing: ve,
+				strings: A
 			}),
-			F ? /* @__PURE__ */ b("textarea", {
-				"aria-label": k.sourceLabel,
-				value: I,
-				onChange: Me,
-				disabled: d,
+			L ? /* @__PURE__ */ b("textarea", {
+				ref: z,
+				id: p,
+				"data-slot": "editor-field",
+				"aria-label": y ?? A.sourceLabel,
+				"aria-labelledby": S,
+				"aria-describedby": C,
+				"aria-invalid": Ae,
+				value: B,
+				onChange: (e) => He(e.target.value),
+				disabled: u,
 				spellCheck: !1,
-				className: n(f.source, ke, d && "cursor-not-allowed"),
-				style: Ae
+				className: n(f.source, Xe, u && "cursor-not-allowed"),
+				style: Ze
 			}) : /* @__PURE__ */ x("div", {
-				className: n("relative", ke),
-				style: Ae,
-				children: [Ie, /* @__PURE__ */ b(K, {
-					editor: V,
+				className: n("relative", Xe),
+				style: Ze,
+				children: [nt, /* @__PURE__ */ b(ze, {
+					editor: q,
 					className: f.content
 				})]
 			}),
-			A && /* @__PURE__ */ b(Te, {
+			j && /* @__PURE__ */ b(Fe, {
 				alt: Q ? Q.alt : null,
 				onAltChange: (e) => {
-					if (!V || !Q) return;
-					let t = V.state.doc.nodeAt(Q.pos);
-					t?.type.name === "image" && (V.view.dispatch(V.state.tr.setNodeMarkup(Q.pos, void 0, {
-						...t.attrs,
-						alt: e
-					})), $({
+					q && Q && q.state.doc.nodeAt(Q.pos)?.type.name === "image" && (q.view.dispatch(q.state.tr.setNodeAttribute(Q.pos, "alt", e)), Ye({
 						...Q,
 						alt: e
 					}), Y());
 				},
 				onRemove: () => {
-					if (!V || !Q) return;
-					let e = V.state.doc.nodeAt(Q.pos);
-					e?.type.name === "image" && (V.view.dispatch(V.state.tr.delete(Q.pos, Q.pos + e.nodeSize)), $(null), Y(), V.commands.focus());
+					if (!q || !Q) return;
+					let e = q.state.doc.nodeAt(Q.pos);
+					e?.type.name === "image" && (q.view.dispatch(q.state.tr.delete(Q.pos, Q.pos + e.nodeSize)), Ye(null), Y(), q.commands.focus());
 				},
-				notice: Z.notice,
-				onDismissNotice: Z.dismissNotice,
-				strings: k.images
+				notice: X.notice,
+				onDismissNotice: X.dismissNotice,
+				strings: A.images
 			}),
-			!!S && /* @__PURE__ */ b("div", {
-				className: "px-control pb-space-md pt-space-xs",
-				children: S
+			!!ye && /* @__PURE__ */ b("div", {
+				className: n(f.regionX, "pb-space-md pt-space-xs"),
+				children: ye
 			}),
-			Pe,
-			De.input,
-			A && /* @__PURE__ */ b(Ce, {
-				queue: Z,
-				adapterRef: X,
-				strings: k.images
+			et,
+			Z.input,
+			j && /* @__PURE__ */ b(Ne, {
+				queue: X,
+				adapterRef: qe,
+				strings: A.images
 			})
 		]
 	});
 });
-Y.displayName = "TiptapRichTextEditor";
-var Ee = ((e) => typeof e == "function" || typeof e == "object" && !!e && "$$typeof" in e)(K) && typeof q == "function" && typeof J == "object" && !!J;
+L.displayName = "TiptapRichTextEditor";
+var R = ((e) => typeof e == "function" || typeof e == "object" && !!e && "$$typeof" in e)(ze) && typeof Be == "function" && typeof I == "function" && typeof Ve == "object" && !!Ve;
 //#endregion
 //#region src/components/features/rich-text-editor/partials/rich-text-editor-fallback.tsx
-function X(e) {
+function z(e) {
 	if (!e) return "";
 	if (!e.querySelector("[data-rte-upload]")) return e.innerHTML;
 	let t = e.cloneNode(!0);
-	for (let e of Array.from(t.querySelectorAll(`[${P}]`))) e.remove();
+	for (let e of Array.from(t.querySelectorAll(`[${O}]`))) e.remove();
 	return t.innerHTML;
 }
-function Z(e) {
+function B(e) {
 	for (let t of Array.from(e.querySelectorAll("img"))) o(t.getAttribute("src")) || t.remove();
 }
-function De(e) {
+function He(e) {
 	let t = window.getSelection();
 	if (!t || t.rangeCount === 0) return null;
 	let n = t.getRangeAt(0);
@@ -893,7 +950,7 @@ function De(e) {
 	let { startContainer: r, startOffset: i } = n;
 	return (r.nodeType === Node.TEXT_NODE ? [i === 0 ? r.previousSibling : null, i === (r.textContent?.length ?? 0) ? r.nextSibling : null] : [r.childNodes[i - 1] ?? null, r.childNodes[i] ?? null]).find((e) => e instanceof HTMLImageElement) ?? null;
 }
-function Oe(e, t) {
+function Ue(e, t) {
 	let n = document, r = n.caretRangeFromPoint?.(e, t) ?? null;
 	if (!r) {
 		let i = n.caretPositionFromPoint?.(e, t);
@@ -904,124 +961,124 @@ function Oe(e, t) {
 	let i = window.getSelection();
 	i?.removeAllRanges(), i?.addRange(r);
 }
-var Q = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1, bodyHeight: c, minHeight: l, maxHeight: u, disabled: d = !1, showCounts: p = !1, maxLength: ne, extraToolbarItems: y, toolbarTrailing: ie, footerSlot: S, hideSourceToggle: le = !1, autoFocus: C = !1, className: me, onCaretChange: he, strings: w, images: E }, k) {
-	let A = t(te, w), j = _(null), M = _(null), [N, F] = v(null), [be, I] = v(""), [L, R] = v(!1), [z, B] = v(!1), [V, H] = v(""), U = _(D(e)), W = _(he);
-	W.current = he;
-	let G = m((e) => {
-		j.current = e, e && e.innerHTML === "" && (e.innerHTML = O(U.current));
+var V = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1, bodyHeight: c, minHeight: l, maxHeight: u, disabled: d = !1, invalid: p, id: re, onBlur: ae, "aria-label": y, "aria-labelledby": S, "aria-describedby": C, "aria-invalid": ue, showCounts: he = !1, maxLength: w, extraToolbarItems: T, toolbarTrailing: ye, footerSlot: xe, hideSourceToggle: Ce = !1, autoFocus: we = !1, className: Te, onCaretChange: Ee, onEditorKeyDown: De, suggestionPopup: k, strings: ke, images: A }, Ae) {
+	let j = t(ne, ke), { ariaInvalid: M } = ee(p, ue), N = _(null), Ie = _(null), [P, Le] = v(null), [Re, F] = v(""), [ze, Be] = v(!1), [I, Ve] = v(!1), L = _(null), [R, V] = v(""), H = _(E(e)), U = _(Ee);
+	U.current = Ee;
+	let We = m((e) => {
+		N.current = e, e && e.innerHTML === "" && (e.innerHTML = D(H.current));
 	}, []);
 	h(() => {
-		let t = j.current;
-		if (!t || L) return;
-		let n = O(e);
-		D(X(t)) !== D(n) && (t.innerHTML = n), U.current = D(e);
-	}, [L, e]), h(() => {
-		C && j.current?.focus();
-	}, [C]);
-	let K = m(() => {
-		let e = j.current, t = D(X(e));
-		U.current = t, r(t), W.current?.();
-	}, [r]), q = _(null);
-	q.current = {
+		let t = N.current;
+		if (!t || ze) return;
+		let n = D(e);
+		E(z(t)) !== E(n) && (t.innerHTML = n), H.current = E(e);
+	}, [ze, e]), h(() => {
+		I && (H.current = E(e), V(D(e)));
+	}, [I, e]), h(() => {
+		we && N.current?.focus();
+	}, [we]);
+	let W = m(() => {
+		let e = N.current, t = E(z(e));
+		H.current = t, r(t), U.current?.();
+	}, [r]), Ge = _(null);
+	Ge.current = {
 		insertPlaceholder: (e) => {
-			let t = j.current;
+			let t = N.current;
 			if (!t) return;
-			let n = M.current;
+			let n = Ie.current;
 			if (n && t.contains(n.commonAncestorContainer) && !t.contains(document.activeElement)) {
 				t.focus();
 				let e = window.getSelection();
 				e?.removeAllRanges(), e?.addRange(n);
 			}
-			ve(t, `<span ${P}="${e}" contenteditable="false" class="${ye}"></span>`);
+			ve(t, `<span ${O}="${e}" contenteditable="false" class="${Oe}"></span>`);
 		},
-		findPlaceholder: (e) => j.current?.querySelector(`[data-rte-upload="${e}"]`) ?? null,
+		findPlaceholder: (e) => N.current?.querySelector(`[data-rte-upload="${e}"]`) ?? null,
 		resolvePlaceholder: (e, t) => {
-			let n = j.current?.querySelector(`[${P}="${e}"]`);
+			let n = N.current?.querySelector(`[${O}="${e}"]`);
 			if (!n) return;
 			let r = document.createElement("img");
-			r.setAttribute("src", t.src), r.setAttribute("alt", t.alt ?? ""), t.width && r.setAttribute("width", String(t.width)), t.height && r.setAttribute("height", String(t.height)), n.replaceWith(r), K();
+			r.setAttribute("src", t.src), r.setAttribute("alt", t.alt ?? ""), t.width && r.setAttribute("width", String(t.width)), t.height && r.setAttribute("height", String(t.height)), n.replaceWith(r), W();
 		},
 		removePlaceholder: (e) => {
-			j.current?.querySelector(`[${P}="${e}"]`)?.remove(), K();
+			N.current?.querySelector(`[${O}="${e}"]`)?.remove(), W();
 		}
 	};
-	let J = Se(E, q, A.images), Y = we(E, A.images, J.addFiles, () => {
+	let G = Me(A, Ge, j.images), K = Pe(A, j.images, G.addFiles, () => {
 		let e = window.getSelection(), t = e && e.rangeCount > 0 ? e.getRangeAt(0) : null;
-		M.current = t && j.current?.contains(t.commonAncestorContainer) ? t.cloneRange() : null;
-	}), Ee = g(() => Y.item ? [Y.item, ...y ?? []] : y, [y, Y.item]), Q = m(() => {
-		let e = j.current;
-		if (!E || !e) return;
+		Ie.current = t && N.current?.contains(t.commonAncestorContainer) ? t.cloneRange() : null;
+	}), q = g(() => K.item ? [K.item, ...T ?? []] : T, [T, K.item]), J = m(() => {
+		let e = N.current;
+		if (!A || !e) return;
 		let t = window.getSelection();
 		if (t && t.rangeCount > 0 && !e.contains(t.getRangeAt(0).commonAncestorContainer)) return;
-		let n = De(e);
-		F(n), I(n?.getAttribute("alt") ?? "");
-	}, [E]);
+		let n = He(e);
+		Le(n), F(n?.getAttribute("alt") ?? "");
+	}, [A]);
 	h(() => {
-		if (E && typeof document < "u") return document.addEventListener("selectionchange", Q), () => document.removeEventListener("selectionchange", Q);
-	}, [E, Q]);
-	let $ = m(() => {
-		let e = j.current;
-		E && e && (Z(e), J.prune(), N && !N.isConnected && F(null)), K();
+		if (A && typeof document < "u") return document.addEventListener("selectionchange", J), () => document.removeEventListener("selectionchange", J);
+	}, [A, J]);
+	let Y = m(() => {
+		let e = N.current;
+		A && e && (B(e), G.prune(), P && !P.isConnected && Le(null)), W();
 	}, [
-		N,
-		K,
-		E,
-		J
+		P,
+		W,
+		A,
+		G
 	]);
-	re(k, () => ({
-		focus: () => j.current?.focus(),
-		getHTML: () => D(X(j.current)),
+	ie(Ae, () => ({
+		focus: () => (L.current ?? N.current)?.focus(),
+		getHTML: () => E(z(N.current)),
 		setHTML: (e) => {
-			let t = D(e);
-			U.current = t, j.current && (j.current.innerHTML = O(t)), r(t);
+			let t = E(e);
+			H.current = t, N.current && (N.current.innerHTML = D(t)), r(t);
 		},
 		insertHTML: (e) => {
-			ve(j.current, e), K();
+			ve(N.current, e), W();
 		},
-		isEmpty: () => D(X(j.current)) === "",
+		isEmpty: () => E(z(N.current)) === "",
 		clear: () => {
-			U.current = "", j.current && (j.current.innerHTML = "<p></p>"), r("");
+			H.current = "", N.current && (N.current.innerHTML = "<p></p>"), r("");
 		},
 		getCaretContext: () => ge(),
 		replaceBeforeCaret: (e, t) => {
-			_e(null, e, t, () => K());
+			_e(null, e, t, () => W());
 		}
-	}), [K, r]);
-	let ke = f.bodyMinHeight[c ?? (o ? "control" : "document")], Ae = g(() => ({
+	}), [W, r]);
+	let Ke = f.bodyMinHeight[c ?? (o ? "control" : "document")], qe = g(() => ({
 		...l ? { minHeight: l } : {},
 		...u ? {
 			maxHeight: u,
 			overflowY: "auto"
 		} : {}
-	}), [u, l]), je = m(() => {
-		if (z) {
-			let e = D(V);
-			U.current = e, j.current && (j.current.innerHTML = O(e)), r(e), B(!1);
+	}), [u, l]), X = m(() => {
+		if (I) {
+			let e = document.createElement("template");
+			e.innerHTML = s(R, { images: !!A });
+			let t = E(e.innerHTML);
+			t !== H.current && (H.current = t, r(t)), Ve(!1);
 			return;
 		}
-		H(j.current?.innerHTML ?? O(e)), B(!0);
+		V(N.current?.innerHTML ?? D(e)), Ve(!0);
 	}, [
+		A,
 		r,
-		z,
-		V,
+		I,
+		R,
 		e
-	]), Me = m((e) => {
-		let t = e.target.value;
-		H(t);
-		let n = D(t);
-		U.current = n, r(n);
-	}, [r]), Ne = typeof a == "string" ? a : "", Pe = D(U.current) === "" && J.uploads.length === 0, Fe = Ne.length > 0 && !L && Pe ? /* @__PURE__ */ b(i, {
+	]), Z = typeof a == "string" ? a : "", Je = E(H.current) === "" && G.uploads.length === 0, Q = Z.length > 0 && !ze && Je ? /* @__PURE__ */ b(i, {
 		tag: "span",
 		size: "sm",
 		type: "secondary",
-		className: "pointer-events-none absolute inset-0 px-control py-control-y-offset",
-		children: Ne
-	}) : null, Ie = g(() => [
+		className: f.placeholder,
+		children: Z
+	}) : null, Ye = g(() => [
 		{
 			id: "bold",
 			toggle: !0,
-			icon: ae,
-			label: A.toolbar.bold,
+			icon: oe,
+			label: j.toolbar.bold,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
@@ -1029,8 +1086,8 @@ var Q = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1
 		{
 			id: "italic",
 			toggle: !0,
-			icon: oe,
-			label: A.toolbar.italic,
+			icon: se,
+			label: j.toolbar.italic,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
@@ -1038,8 +1095,8 @@ var Q = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1
 		{
 			id: "strike",
 			toggle: !0,
-			icon: fe,
-			label: A.toolbar.strike,
+			icon: pe,
+			label: j.toolbar.strike,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
@@ -1047,8 +1104,8 @@ var Q = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1
 		{
 			id: "bullet-list",
 			toggle: !0,
-			icon: se,
-			label: A.toolbar.bulletList,
+			icon: ce,
+			label: j.toolbar.bulletList,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
@@ -1056,8 +1113,8 @@ var Q = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1
 		{
 			id: "ordered-list",
 			toggle: !0,
-			icon: ce,
-			label: A.toolbar.orderedList,
+			icon: le,
+			label: j.toolbar.orderedList,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
@@ -1065,132 +1122,152 @@ var Q = p(function({ value: e, onValueChange: r, placeholder: a, compact: o = !1
 		{
 			id: "blockquote",
 			toggle: !0,
-			icon: ue,
-			label: A.toolbar.blockquote,
+			icon: de,
+			label: j.toolbar.blockquote,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
 		},
 		{
 			id: "undo",
-			icon: pe,
-			label: A.toolbar.undo,
+			icon: me,
+			label: j.toolbar.undo,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
 		},
 		{
 			id: "redo",
-			icon: de,
-			label: A.toolbar.redo,
+			icon: fe,
+			label: j.toolbar.redo,
 			isActive: () => !1,
 			run: () => void 0,
 			disabled: !0
 		}
-	], [A]), Le = z ? V.replace(/<[^>]*>/g, "") : j.current?.innerText ?? D(e).replace(/<[^>]*>/g, ""), Re = p ? /* @__PURE__ */ b(T, {
-		text: Le,
-		maxLength: ne,
-		strings: A
+	], [j]), Xe = I ? R.replace(/<[^>]*>/g, "") : N.current?.innerText ?? E(e).replace(/<[^>]*>/g, ""), Ze = he ? /* @__PURE__ */ b(be, {
+		text: Xe,
+		maxLength: w,
+		strings: j
 	}) : null;
 	return /* @__PURE__ */ x("div", {
-		className: n(f.frame, d && f.disabled, me),
+		onBlur: ae && ((e) => {
+			e.currentTarget.contains(e.relatedTarget) || ae(e);
+		}),
+		className: n(f.frame, d && f.disabled, Te),
 		children: [
-			/* @__PURE__ */ b(ee, {
-				buttons: Ie,
-				extraToolbarItems: Ee,
-				hideSourceToggle: le,
-				sourceMode: z,
-				toggleSourceMode: je,
+			/* @__PURE__ */ b(te, {
+				buttons: Ye,
+				extraToolbarItems: q,
+				hideSourceToggle: Ce,
+				sourceMode: I,
+				toggleSourceMode: X,
 				disabled: d,
 				hasEditor: !0,
-				toolbarTrailing: ie,
-				strings: A
+				toolbarTrailing: ye,
+				strings: j
 			}),
-			z ? /* @__PURE__ */ b("textarea", {
-				"aria-label": A.sourceLabel,
-				value: V,
-				onChange: Me,
+			I ? /* @__PURE__ */ b("textarea", {
+				ref: L,
+				id: re,
+				"data-slot": "editor-field",
+				"aria-label": y ?? j.sourceLabel,
+				"aria-labelledby": S,
+				"aria-describedby": C,
+				"aria-invalid": M,
+				value: R,
+				onChange: (e) => V(e.target.value),
 				disabled: d,
 				spellCheck: !1,
-				className: n(f.source, ke, d && "cursor-not-allowed"),
-				style: Ae
+				className: n(f.source, Ke, d && "cursor-not-allowed"),
+				style: qe
 			}) : /* @__PURE__ */ x("div", {
-				className: n("relative", ke),
-				style: Ae,
-				children: [Fe, /* @__PURE__ */ b("div", {
-					ref: G,
-					role: "textbox",
-					"aria-label": A.editorLabel,
-					"aria-multiline": "true",
+				className: n("relative", Ke),
+				style: qe,
+				children: [Q, /* @__PURE__ */ b("div", {
+					ref: We,
+					id: re,
+					"data-slot": "editor-field",
+					...Se(y ?? j.editorLabel, k?.listboxId, k?.activeOptionId),
+					"aria-labelledby": S,
+					"aria-describedby": C,
+					"aria-invalid": M,
 					contentEditable: !d,
 					suppressContentEditableWarning: !0,
-					onInput: $,
-					onKeyUp: () => W.current?.(),
-					onMouseUp: () => W.current?.(),
-					onClick: E ? (e) => {
+					onInput: Y,
+					onKeyDown: De && !d ? (e) => {
+						De(e.nativeEvent) && (e.preventDefault(), e.stopPropagation());
+					} : void 0,
+					onKeyUp: () => U.current?.(),
+					onMouseUp: () => U.current?.(),
+					onClick: A ? (e) => {
 						if (!(e.target instanceof HTMLImageElement)) return;
 						let t = document.createRange();
 						t.selectNode(e.target);
 						let n = window.getSelection();
 						n?.removeAllRanges(), n?.addRange(t);
 					} : void 0,
-					onPaste: E ? (e) => {
-						let t = xe(e.clipboardData);
-						t.length !== 0 && (e.preventDefault(), J.addFiles(t));
+					onPaste: A ? (e) => {
+						let t = je(e.clipboardData);
+						t.length !== 0 && (e.preventDefault(), G.addFiles(t));
 					} : void 0,
-					onDragOver: E ? (e) => {
+					onDragOver: A ? (e) => {
 						Array.from(e.dataTransfer.types).includes("Files") && e.preventDefault();
 					} : void 0,
-					onDrop: E ? (e) => {
-						let t = xe(e.dataTransfer);
-						t.length !== 0 && (e.preventDefault(), j.current?.focus(), Oe(e.clientX, e.clientY), J.addFiles(t));
+					onDrop: A ? (e) => {
+						let t = je(e.dataTransfer);
+						t.length !== 0 && (e.preventDefault(), N.current?.focus(), Ue(e.clientX, e.clientY), G.addFiles(t));
 					} : void 0,
-					onFocus: () => R(!0),
-					onBlur: () => R(!1),
-					className: n(s, "h-full min-h-full", d && "cursor-not-allowed")
+					onFocus: () => Be(!0),
+					onBlur: () => Be(!1),
+					className: n(f.editable, "h-full min-h-full", d && "cursor-not-allowed")
 				})]
 			}),
-			!!E && /* @__PURE__ */ b(Te, {
-				alt: N ? be : null,
+			!!A && /* @__PURE__ */ b(Fe, {
+				alt: P ? Re : null,
 				onAltChange: (e) => {
-					I(e), N?.setAttribute("alt", e), K();
+					F(e), P?.setAttribute("alt", e), W();
 				},
 				onRemove: () => {
-					N?.remove(), F(null), K(), j.current?.focus();
+					P?.remove(), Le(null), W(), N.current?.focus();
 				},
-				notice: J.notice,
-				onDismissNotice: J.dismissNotice,
-				strings: A.images
+				notice: G.notice,
+				onDismissNotice: G.dismissNotice,
+				strings: j.images
 			}),
-			!!S && /* @__PURE__ */ b("div", {
-				className: "px-control pb-space-md pt-space-xs",
-				children: S
+			!!xe && /* @__PURE__ */ b("div", {
+				className: n(f.regionX, "pb-space-md pt-space-xs"),
+				children: xe
 			}),
-			Re,
-			Y.input,
-			/* @__PURE__ */ b(Ce, {
-				queue: J,
-				adapterRef: q,
-				strings: A.images
+			Ze,
+			K.input,
+			/* @__PURE__ */ b(Ne, {
+				queue: G,
+				adapterRef: Ge,
+				strings: j.images
 			})
 		]
 	});
 });
-Q.displayName = "FallbackRichTextEditor";
+V.displayName = "FallbackRichTextEditor";
 //#endregion
 //#region src/components/features/rich-text-editor/rich-text-editor.tsx
-var $ = p(function(e, t) {
-	return Ee ? /* @__PURE__ */ b(Y, {
-		...e,
-		ref: t
-	}) : /* @__PURE__ */ b(Q, {
-		className: "rich-text-editor--component",
-		...e,
-		ref: t
-	});
+var H = p(function({ name: e, ...t }, r) {
+	return /* @__PURE__ */ x(y, { children: [R ? /* @__PURE__ */ b(L, {
+		...t,
+		ref: r
+	}) : /* @__PURE__ */ b(V, {
+		...t,
+		ref: r,
+		className: n("rich-text-editor--component", t.className)
+	}), e && /* @__PURE__ */ b("input", {
+		type: "hidden",
+		name: e,
+		value: t.value,
+		disabled: t.disabled
+	})] });
 });
-$.displayName = "RichTextEditor";
+H.displayName = "RichTextEditor";
 //#endregion
-export { T as n, $ as t };
+export { be as n, H as t };
 
-//# sourceMappingURL=rich-text-editor-Cm1dpUpQ.js.map
+//# sourceMappingURL=rich-text-editor-CAurDwT5.js.map