themelia-react-ui 1.0.2 → 2.0.1

package/dist/features/email-composer.js

@@ -1,36 +1,36 @@
 "use client";
 import { useStrings as e } from "../lib/strings.js";
-import { t } from "../utils-BvH9PSmq.js";
-import { a as n } from "../typography-BxQgiZyw.js";
-import { t as r } from "../button-BZDasD04.js";
-import { i, t as a } from "../structure-CRdqVawd.js";
-import { h as o, p as s, t as c, v as l } from "../smart-card-DjGVV2xr.js";
-import { n as u, t as d } from "../feedback-CJkUAapr.js";
-import { n as f, t as p } from "../action-menu-Drxw_vJk.js";
-import { n as m, r as h, t as g } from "../overlays-DUbs1KEi.js";
+import { t } from "../utils-l5LpDw2z.js";
+import { n } from "../buttons-SbIcm1HJ.js";
+import { s as r } from "../typography-DTRkE9zL.js";
+import { i, t as a } from "../structure-DC2dygdA.js";
+import { h as o, p as s, t as c, v as l } from "../smart-card-lFKxn5Hu.js";
+import { n as u, t as d } from "../feedback-qNuMBtRH.js";
+import { n as f, t as p } from "../action-menu-TzCoSlwL.js";
+import { n as m, r as h, t as g } from "../overlays-I0axtYA6.js";
 import { n as _ } from "../content-typography-CnwgMJ37.js";
-import { t as v } from "../accordion-BRTcsp8J.js";
-import { t as y } from "../input-SX9V0AL3.js";
-import { a as b, c as x, d as S, o as C, s as w } from "../text-inputs-DsR56TR-.js";
-import { c as T } from "../choice-inputs-Mk3iWbhr.js";
-import { t as ee } from "../scroll-area-D-pIhEKl.js";
-import { t as E } from "../form-field-CZwrkP7m.js";
-import { i as D, n as O, r as te, t as ne } from "../tabs-BNgu7g0u.js";
-import { t as k } from "../popover-menu-B4PoWhRl.js";
-import { n as A, t as j } from "../rich-text-editor.recipes-B72Nfuze.js";
-import { t as M } from "../rich-text-editor.strings-BpnIQgMl.js";
-import { a as N, c as P, i as F, l as I, n as L, o as R, r as z, s as B, t as V, u as H } from "../http-CdEIHyQf.js";
-import { useEffect as U, useId as W, useImperativeHandle as G, useMemo as re, useRef as K, useState as q } from "react";
-import { Fragment as J, jsx as Y, jsxs as X } from "react/jsx-runtime";
-import { Bold as ie, Italic as ae, Link as oe, List as se, ListOrdered as ce, Plus as Z, Redo2 as le, Send as ue, Undo2 as de, X as fe } from "lucide-react";
-import { EditorContent as pe, Node as me, generateJSON as he, mergeAttributes as ge, useEditor as _e } from "@tiptap/react";
-import ve from "@tiptap/starter-kit";
+import { t as v } from "../accordion-B6a3vVgA.js";
+import { t as y } from "../input-DWhBBBww.js";
+import { t as b } from "../form-field-DUt4UxSV.js";
+import { a as x, c as S, d as C, o as w, s as T } from "../text-inputs-aaK9wcDT.js";
+import { l as E } from "../choice-inputs-t6w3ATNz.js";
+import { t as ee } from "../scroll-area-Bt_vXY2b.js";
+import { i as D, n as O, r as te, t as k } from "../tabs-DwBJfjxX.js";
+import { t as A } from "../popover-menu-B71Tn2Qz.js";
+import { n as j, t as M } from "../rich-text-editor.recipes-CadiF_Uu.js";
+import { t as N } from "../rich-text-editor.strings-CB59ekH2.js";
+import { a as P, c as F, i as I, l as L, n as R, o as z, r as B, s as V, t as H, u as U } from "../http-D_6rOnzU.js";
+import { useEffect as W, useId as G, useImperativeHandle as K, useMemo as ne, useRef as q, useState as J } from "react";
+import { Fragment as Y, jsx as X, jsxs as Z } from "react/jsx-runtime";
+import { Bold as re, Italic as ie, Link as ae, List as oe, ListOrdered as se, Plus as ce, Redo2 as le, Undo2 as ue, X as de } from "lucide-react";
+import { EditorContent as fe, Node as pe, generateJSON as me, mergeAttributes as he, useEditor as ge } from "@tiptap/react";
+import _e from "@tiptap/starter-kit";
 //#region src/components/features/email-composer/partials/data-status.tsx
 function Q(e) {
 	return !!(e?.loading || e?.error);
 }
-function ye({ state: e, label: t, retryLabel: n, report: r }) {
-	return e?.loading ? /* @__PURE__ */ Y(u, { label: t }) : e?.error ? /* @__PURE__ */ Y(d, {
+function ve({ state: e, label: t, retryLabel: n, report: r }) {
+	return e?.loading ? /* @__PURE__ */ X(u, { label: t }) : e?.error ? /* @__PURE__ */ X(d, {
 		variant: "inline",
 		description: e.error,
 		retryLabel: n,
@@ -41,8 +41,8 @@ function ye({ state: e, label: t, retryLabel: n, report: r }) {
 }
 //#endregion
 //#region src/components/features/email-composer/use-composer.ts
-function be(t) {
-	let n = e(H, t.strings), r = K(null);
+function ye(t) {
+	let n = e(U, t.strings), r = q(null);
 	r.current ||= structuredClone({
 		to: [],
 		cc: [],
@@ -50,12 +50,12 @@ function be(t) {
 		subject: "",
 		body: {
 			kind: "rich",
-			document: I
+			document: L
 		},
 		placeholderOverrides: {},
 		...t.value ?? t.defaultValue
 	});
-	let [i, a] = q(r.current), o = t.value ?? i, s = K({
+	let [i, a] = J(r.current), o = t.value ?? i, s = q({
 		props: t,
 		draft: o,
 		strings: n
@@ -65,26 +65,26 @@ function be(t) {
 		draft: o,
 		strings: n
 	};
-	let c = K(o);
+	let c = q(o);
 	t.value !== void 0 && (c.current = t.value);
-	let l = K(null), u = K(null), [d, f] = q(!1), [p, m] = q(""), [h, g] = q(""), [_, v] = q(!1), [y, b] = q([]), x = K(!0);
-	U(() => (x.current = !0, () => {
+	let l = q(null), u = q(null), [d, f] = J(!1), [p, m] = J(""), [h, g] = J(""), [_, v] = J(!1), [y, b] = J([]), x = q(!0);
+	W(() => (x.current = !0, () => {
 		x.current = !1;
 	}), []);
-	let S = re(() => {
+	let S = ne(() => {
 		let e = Object.create(null);
 		for (let r of t.placeholders?.sets ?? []) for (let t of Object.keys(r.definitions)) {
 			if (Object.hasOwn(e, t)) throw Error(n.duplicateVariable(t));
 			r.definitions[t] && (e[t] = r.definitions[t]);
 		}
 		return e;
-	}, [t.placeholders?.sets, n]), C = re(() => [...t.templates?.items ?? [], ...y], [t.templates?.items, y]), w = K(C);
+	}, [t.placeholders?.sets, n]), C = ne(() => [...t.templates?.items ?? [], ...y], [t.templates?.items, y]), w = q(C);
 	if (w.current = C, new Set(C.map((e) => e.id)).size !== C.length) throw Error(n.duplicateTemplate);
-	let T = () => s.current.props.value ?? c.current, ee = (e) => C.find((t) => t.id === e.templateId), E = K(null), D = (e = T()) => {
-		let t = s.current.props.context, n = ee(e), r = s.current.strings, i = E.current;
+	let T = () => s.current.props.value ?? c.current, E = (e) => C.find((t) => t.id === e.templateId), ee = q(null), D = (e = T()) => {
+		let t = s.current.props.context, n = E(e), r = s.current.strings, i = ee.current;
 		if (i && i.draft === e && i.context === t && i.definitions === S && i.template === n && i.strings === r) return i.result;
-		let a = L(e, t, S, n, r);
-		return E.current = {
+		let a = R(e, t, S, n, r);
+		return ee.current = {
 			draft: e,
 			context: t,
 			definitions: S,
@@ -106,54 +106,54 @@ function be(t) {
 			field: "placeholders",
 			message: t.dataUnavailable
 		}), n;
-	}, te = O().length > 0, ne = (e = T()) => structuredClone([...O(), ...D(e).issues]), k = () => {
+	}, te = O().length > 0, k = (e = T()) => structuredClone([...O(), ...D(e).issues]), A = () => {
 		let e = T(), t = [...D(e).rendered?.unresolved ?? []];
 		return {
 			draft: structuredClone(e),
 			dirty: JSON.stringify(e) !== JSON.stringify(r.current),
 			busy: u.current !== null,
-			issues: ne(e),
+			issues: k(e),
 			unresolvedPlaceholders: t
 		};
-	}, A = (e) => {
+	}, j = (e) => {
 		let t = e instanceof Error ? e : Error(String(e));
 		x.current && m(t.message), s.current.props.onError?.(t);
-	}, j = (e, t = "api", n = !1) => {
+	}, M = (e, t = "api", n = !1) => {
 		if (!x.current || !n && u.current && u.current !== "action") return;
 		let r = structuredClone(e(structuredClone(T())));
 		s.current.props.value === void 0 && (c.current = r, a(r)), s.current.props.onChange?.(structuredClone(r)), s.current.props.onEdit?.(structuredClone(r), { source: t }), m(""), g("");
-	}, M = K(null);
-	async function N(e, t, n = !1) {
+	}, N = q(null);
+	async function P(e, t, n = !1) {
 		if (u.current && !(n && u.current === "action") || !x.current) return;
 		let r = {
 			kind: e,
 			settled: !1,
-			parent: n ? M.current : null
+			parent: n ? N.current : null
 		};
-		M.current = r, u.current = e, f(!0), m(""), g("");
+		N.current = r, u.current = e, f(!0), m(""), g("");
 		try {
 			await t();
 		} catch (e) {
-			A(e);
+			j(e);
 		} finally {
-			if (r.settled = !0, M.current === r) {
+			if (r.settled = !0, N.current === r) {
 				let e = r.parent;
 				for (; e?.settled;) e = e.parent;
-				M.current = e, u.current = e?.kind ?? null, x.current && f(e !== null);
+				N.current = e, u.current = e?.kind ?? null, x.current && f(e !== null);
 			}
 		}
 	}
-	let P = () => {
+	let F = () => {
 		if (!l.current) throw Error(n.editorNotReady);
 		if (T().body.kind === "html") throw Error(n.editableRequired);
 		return l.current.synchronize(T().body), l.current;
 	};
-	function F(e, t = {}, r = !1) {
+	function I(e, t = {}, r = !1) {
 		if (!r && u.current && u.current !== "action") return;
 		let i = t.body ?? "replace";
 		if (i !== "replace" && (e.body.kind === "html" || T().body.kind === "html")) throw Error(n.editableRequired);
-		let a = i === "replace" ? e.body : P().insert(e.body, i);
-		j((n) => ({
+		let a = i === "replace" ? e.body : F().insert(e.body, i);
+		M((n) => ({
 			...n,
 			body: a,
 			subject: t.subject === "preserve" ? n.subject : e.subject ?? n.subject,
@@ -161,66 +161,66 @@ function be(t) {
 			placeholderOverrides: t.overrides === "reset" ? {} : n.placeholderOverrides
 		}), "template", r);
 	}
-	let R = K(null), z = K(null);
-	z.current ||= {
-		getState: () => R.current.getState(),
-		update: (e) => R.current.update(e),
-		setSubject: (e) => R.current.setSubject(e),
-		setRecipients: (e, t) => R.current.setRecipients(e, t),
-		setBody: (e) => R.current.setBody(e),
-		importBody: (e) => R.current.importBody(e),
-		setPlaceholder: (e, t) => R.current.setPlaceholder(e, t),
-		clearPlaceholderOverride: (e) => R.current.clearPlaceholderOverride(e),
-		insertPlaceholder: (e) => R.current.insertPlaceholder(e),
-		applyTemplate: (e, t) => R.current.applyTemplate(e, t),
-		insertText: (e) => R.current.insertText(e),
-		focusBody: () => R.current.focusBody(),
-		validate: () => R.current.validate(),
-		prepare: () => R.current.prepare(),
-		send: () => R.current.send(),
-		discard: () => R.current.discard()
+	let z = q(null), B = q(null);
+	B.current ||= {
+		getState: () => z.current.getState(),
+		update: (e) => z.current.update(e),
+		setSubject: (e) => z.current.setSubject(e),
+		setRecipients: (e, t) => z.current.setRecipients(e, t),
+		setBody: (e) => z.current.setBody(e),
+		importBody: (e) => z.current.importBody(e),
+		setPlaceholder: (e, t) => z.current.setPlaceholder(e, t),
+		clearPlaceholderOverride: (e) => z.current.clearPlaceholderOverride(e),
+		insertPlaceholder: (e) => z.current.insertPlaceholder(e),
+		applyTemplate: (e, t) => z.current.applyTemplate(e, t),
+		insertText: (e) => z.current.insertText(e),
+		focusBody: () => z.current.focusBody(),
+		validate: () => z.current.validate(),
+		prepare: () => z.current.prepare(),
+		send: () => z.current.send(),
+		discard: () => z.current.discard()
 	};
-	let B = z.current, V = async () => {
+	let V = B.current, H = async () => {
 		if (O().length) throw Error(s.current.strings.dataUnavailable);
 		let e = D();
 		if (e.issues.length || !e.rendered) throw Error(e.issues.map((e) => e.message).join(" "));
 		return structuredClone(e.rendered.email);
-	}, W = (e = !1) => N("send", async () => {
+	}, G = (e = !1) => P("send", async () => {
 		let e = s.current.props;
 		v(!0);
-		let t = await V();
+		let t = await H();
 		if (e.onBeforeSend) {
-			let n = await e.onBeforeSend(t, B);
+			let n = await e.onBeforeSend(t, V);
 			if (n === !1 || !x.current) return;
 			t = n;
 		}
 		x.current && (t = structuredClone(t), await e.onSend(structuredClone(t)), x.current && (g(n.sent), e.onSent?.(t)));
-	}, e), J = (e = !1) => N("discard", async () => {
+	}, e), Y = (e = !1) => P("discard", async () => {
 		let e = s.current.props, t = T();
-		await e.onDiscard?.(B), x.current && T() === t && (j(() => r.current, "api", !0), v(!1), g(n.discarded), e.onClose?.());
+		await e.onDiscard?.(V), x.current && T() === t && (M(() => r.current, "api", !0), v(!1), g(n.discarded), e.onClose?.());
 	}, e);
-	R.current = {
-		getState: k,
-		update: (e) => j(e),
-		setSubject: (e) => j((t) => ({
+	z.current = {
+		getState: A,
+		update: (e) => M(e),
+		setSubject: (e) => M((t) => ({
 			...t,
 			subject: e
 		})),
-		setRecipients: (e, t) => j((n) => ({
+		setRecipients: (e, t) => M((n) => ({
 			...n,
 			[e]: t
 		})),
-		setBody: (e) => j((t) => ({
+		setBody: (e) => M((t) => ({
 			...t,
 			body: e
 		})),
-		importBody: (e) => j((t) => ({
+		importBody: (e) => M((t) => ({
 			...t,
 			body: e
 		})),
 		setPlaceholder: (e, t) => {
 			if (!Object.hasOwn(S, e)) throw Error(n.unknownVariable(e));
-			j((n) => ({
+			M((n) => ({
 				...n,
 				placeholderOverrides: {
 					...n.placeholderOverrides,
@@ -228,20 +228,20 @@ function be(t) {
 				}
 			}), "placeholder");
 		},
-		clearPlaceholderOverride: (e) => j((t) => (delete t.placeholderOverrides[e], t), "placeholder"),
+		clearPlaceholderOverride: (e) => M((t) => (delete t.placeholderOverrides[e], t), "placeholder"),
 		insertPlaceholder: (e) => {
 			if (u.current && u.current !== "action") return;
 			if (!Object.hasOwn(S, e)) throw Error(n.unknownVariable(e));
-			let t = P().insertPlaceholder(e);
-			j((e) => ({
+			let t = F().insertPlaceholder(e);
+			M((e) => ({
 				...e,
 				body: t
 			}));
 		},
 		insertText: (e) => {
 			if (u.current && u.current !== "action") return;
-			let t = P().insertText(e);
-			j((e) => ({
+			let t = F().insertText(e);
+			M((e) => ({
 				...e,
 				body: t
 			}));
@@ -251,27 +251,27 @@ function be(t) {
 			if (Q(s.current.props.templates)) throw Error(s.current.strings.templatesUnavailable);
 			let r = C.find((t) => t.id === e);
 			if (!r) throw Error(n.unknownTemplate(e));
-			F(r, t);
+			I(r, t);
 		},
-		validate: () => ne(),
-		prepare: V,
-		send: () => W(),
-		discard: () => J()
-	}, G(t.apiRef, () => B, [B]);
-	let Y = (e) => N("action", async () => {
-		await e.onSelect(Object.assign(Object.create(B), {
-			send: () => W(!0),
-			discard: () => J(!0)
+		validate: () => k(),
+		prepare: H,
+		send: () => G(),
+		discard: () => Y()
+	}, K(t.apiRef, () => V, [V]);
+	let X = (e) => P("action", async () => {
+		await e.onSelect(Object.assign(Object.create(V), {
+			send: () => G(!0),
+			discard: () => Y(!0)
 		}));
-	}), X = () => N("import", async () => {
+	}), Z = () => P("import", async () => {
 		let e = T(), t = await s.current.props.templates?.onImport?.();
 		if (t && x.current) {
 			if (w.current.some((e) => e.id === t.id)) throw Error(n.duplicateTemplate);
-			b((e) => [...e, structuredClone(t)]), T() === e && F(t, {}, !0);
+			b((e) => [...e, structuredClone(t)]), T() === e && I(t, {}, !0);
 		}
-	}), { rendered: ie, renderError: ae } = D(o);
+	}), { rendered: re, renderError: ie } = D(o);
 	return {
-		api: B,
+		api: V,
 		draft: o,
 		strings: n,
 		busy: d,
@@ -279,25 +279,25 @@ function be(t) {
 		error: p,
 		notice: h,
 		attempted: _,
-		rendered: ie,
-		renderError: ae,
+		rendered: re,
+		renderError: ie,
 		definitions: S,
 		templates: C,
-		values: ie?.email.resolvedPlaceholders ?? {},
+		values: re?.email.resolvedPlaceholders ?? {},
 		editorRef: l,
-		state: k(),
-		report: A,
-		runAction: Y,
-		importTemplate: X,
-		changeBody: (e) => j((t) => ({
+		state: A(),
+		report: j,
+		runAction: X,
+		importTemplate: Z,
+		changeBody: (e) => M((t) => ({
 			...t,
 			body: e
 		}), "body"),
-		changeSubject: (e) => j((t) => ({
+		changeSubject: (e) => M((t) => ({
 			...t,
 			subject: e
 		}), "subject"),
-		changeRecipients: (e, t) => j((n) => ({
+		changeRecipients: (e, t) => M((n) => ({
 			...n,
 			[e]: t
 		}), "recipient")
@@ -305,20 +305,20 @@ function be(t) {
 }
 //#endregion
 //#region src/components/features/email-composer/partials/recipients.tsx
-function xe({ recipient: e, field: t, index: n, options: r, busy: i, strings: a, change: o, remove: s, add: c, id: l, errorId: u }) {
-	let [d, f] = q(F(e));
-	U(() => {
-		f(F(e));
+function be({ recipient: e, field: t, index: n, options: r, busy: i, strings: a, change: o, remove: s, add: c, id: l, errorId: u }) {
+	let [d, f] = J(I(e));
+	W(() => {
+		f(I(e));
 	}, [e.name, e.email]);
 	let p = r.mode === "readonly", m = r.mode === "disabled" || i, h = r.mode !== "disabled" && r.allowRemove !== !1 && (!p || r.allowRemove === !0), g = () => {
-		!p && !m && d !== F(e) && o({
+		!p && !m && d !== I(e) && o({
 			id: e.id,
-			...z(d)
+			...B(d)
 		});
 	};
-	return /* @__PURE__ */ X(b, {
+	return /* @__PURE__ */ Z(x, {
 		className: "min-w-0 w-full",
-		children: [/* @__PURE__ */ Y(x, {
+		children: [/* @__PURE__ */ X(S, {
 			id: l,
 			"aria-invalid": !!u,
 			"aria-describedby": u,
@@ -326,23 +326,23 @@ function xe({ recipient: e, field: t, index: n, options: r, busy: i, strings: a,
 			value: d,
 			readOnly: p,
 			disabled: m,
-			title: F(e),
+			title: I(e),
 			onChange: (e) => f(e.target.value),
 			onBlur: g,
 			onKeyDown: (t) => {
-				t.key === "Enter" && (t.preventDefault(), g()), t.key === "Escape" && (t.preventDefault(), f(F(e)));
+				t.key === "Enter" && (t.preventDefault(), g()), t.key === "Escape" && (t.preventDefault(), f(I(e)));
 			}
-		}), (h || c) && /* @__PURE__ */ X(C, {
+		}), (h || c) && /* @__PURE__ */ Z(w, {
 			align: "inline-end",
-			children: [h && /* @__PURE__ */ Y(w, {
+			children: [h && /* @__PURE__ */ X(T, {
 				type: "button",
 				iconOnly: !0,
 				size: "sm",
 				disabled: i,
 				"aria-label": a.removeRecipient(e.email),
 				onClick: s,
-				children: /* @__PURE__ */ Y(fe, { className: "size-icon" })
-			}), c && /* @__PURE__ */ Y(w, {
+				children: /* @__PURE__ */ X(de, { className: "size-icon" })
+			}), c && /* @__PURE__ */ X(T, {
 				type: "button",
 				iconOnly: !0,
 				size: "sm",
@@ -350,38 +350,38 @@ function xe({ recipient: e, field: t, index: n, options: r, busy: i, strings: a,
 				"aria-label": a.addRecipient(t),
 				title: a.addRecipient(t),
 				onClick: c,
-				children: /* @__PURE__ */ Y(Z, { className: "size-icon" })
+				children: /* @__PURE__ */ X(ce, { className: "size-icon" })
 			})]
 		})]
 	});
 }
-function Se({ field: e, value: t, options: n = {}, busy: r, strings: i, onChange: o, error: s, actions: c, report: l }) {
-	let [u, d] = q(!1), [f, p] = q(""), m = W(), h = s ? `${m}-error` : void 0, g = K(null), _ = n.mode !== "disabled" && n.allowAdd !== !1 && (n.mode !== "readonly" || n.allowAdd === !0), v = u || t.length === 0, y = Q(n), S = () => {
+function xe({ field: e, value: t, options: n = {}, busy: r, strings: i, onChange: o, error: s, actions: c, report: l }) {
+	let [u, d] = J(!1), [f, p] = J(""), m = G(), h = s ? `${m}-error` : void 0, g = q(null), _ = n.mode !== "disabled" && n.allowAdd !== !1 && (n.mode !== "readonly" || n.allowAdd === !0), v = u || t.length === 0, y = Q(n), C = () => {
 		if (r || !_ || !v || y) return;
-		let e = z(f);
+		let e = B(f);
 		f.trim() && !t.some((t) => t.email.toLowerCase() === e.email.toLowerCase()) && o([...t, e]), p(""), d(!1);
 	};
-	U(() => {
+	W(() => {
 		u && g.current?.focus();
 	}, [u]);
-	let T = () => {
-		v && S(), d(!0), g.current?.focus();
+	let E = () => {
+		v && C(), d(!0), g.current?.focus();
 	};
-	return /* @__PURE__ */ Y(E, {
+	return /* @__PURE__ */ X(b, {
 		label: i[e],
 		required: e === "to",
 		error: s,
 		supportingTextId: h,
 		htmlFor: t.length ? `${m}-0` : `${m}-new`,
-		children: /* @__PURE__ */ X(a, {
+		children: /* @__PURE__ */ Z(a, {
 			id: `${m}-group`,
 			gap: "sm",
-			children: [y ? /* @__PURE__ */ Y(ye, {
+			children: [y ? /* @__PURE__ */ X(ve, {
 				state: n,
 				label: i.loadingRecipients(i[e]),
 				retryLabel: i.retry,
 				report: l
-			}) : /* @__PURE__ */ X(J, { children: [t.map((a, s) => /* @__PURE__ */ Y(xe, {
+			}) : /* @__PURE__ */ Z(Y, { children: [t.map((a, s) => /* @__PURE__ */ X(be, {
 				id: `${m}-${s}`,
 				errorId: h,
 				recipient: a,
@@ -392,10 +392,10 @@ function Se({ field: e, value: t, options: n = {}, busy: r, strings: i, onChange
 				strings: i,
 				change: (e) => o(t.map((t, n) => n === s ? e : t)),
 				remove: () => o(t.filter((e, t) => t !== s)),
-				add: _ && !v && s === t.length - 1 ? T : void 0
-			}, a.id ?? s)), v && /* @__PURE__ */ X(b, {
+				add: _ && !v && s === t.length - 1 ? E : void 0
+			}, a.id ?? s)), v && /* @__PURE__ */ Z(x, {
 				className: "min-w-0 w-full",
-				children: [/* @__PURE__ */ Y(x, {
+				children: [/* @__PURE__ */ X(S, {
 					id: `${m}-new`,
 					ref: g,
 					autoFocus: e !== "to",
@@ -407,13 +407,13 @@ function Se({ field: e, value: t, options: n = {}, busy: r, strings: i, onChange
 					disabled: r || n.mode === "disabled",
 					readOnly: !_,
 					onChange: (e) => p(e.target.value),
-					onBlur: S,
+					onBlur: C,
 					onKeyDown: (e) => {
-						e.key === "Enter" && (e.preventDefault(), S()), e.key === "Escape" && (e.preventDefault(), p(""), d(!1));
+						e.key === "Enter" && (e.preventDefault(), C()), e.key === "Escape" && (e.preventDefault(), p(""), d(!1));
 					}
-				}), _ && /* @__PURE__ */ Y(C, {
+				}), _ && /* @__PURE__ */ X(w, {
 					align: "inline-end",
-					children: /* @__PURE__ */ Y(w, {
+					children: /* @__PURE__ */ X(T, {
 						type: "button",
 						iconOnly: !0,
 						size: "sm",
@@ -421,11 +421,11 @@ function Se({ field: e, value: t, options: n = {}, busy: r, strings: i, onChange
 						"aria-label": i.addRecipient(i[e]),
 						title: i.addRecipient(i[e]),
 						onMouseDown: (e) => e.preventDefault(),
-						onClick: T,
-						children: /* @__PURE__ */ Y(Z, { className: "size-icon" })
+						onClick: E,
+						children: /* @__PURE__ */ X(ce, { className: "size-icon" })
 					})
 				})]
-			})] }), c && /* @__PURE__ */ Y(a, {
+			})] }), c && /* @__PURE__ */ X(a, {
 				direction: "horizontal",
 				gap: "xs",
 				justify: "end",
@@ -436,47 +436,47 @@ function Se({ field: e, value: t, options: n = {}, busy: r, strings: i, onChange
 }
 //#endregion
 //#region src/components/features/email-composer/partials/variables.tsx
-function Ce({ definitions: e, values: t, draft: n, api: o, strings: s, busy: c, editable: l }) {
-	let u = W();
-	return /* @__PURE__ */ Y(i, {
+function Se({ definitions: e, values: t, draft: r, api: o, strings: s, busy: c, editable: l }) {
+	let u = G();
+	return /* @__PURE__ */ X(i, {
 		minColumnWidth: "sm",
 		gap: "md",
 		children: Object.keys(e).map((i) => {
-			let d = e[i], f = Object.hasOwn(n.placeholderOverrides, i), p = `${u}-email-variable-${i}`, m = {
+			let d = e[i], f = Object.hasOwn(r.placeholderOverrides, i), p = `${u}-email-variable-${i}`, m = {
 				id: p,
 				value: String(t[i] ?? ""),
 				disabled: c,
 				readOnly: !d.editable
-			}, h = d.input === "textarea" ? /* @__PURE__ */ Y(S, {
+			}, h = d.input === "textarea" ? /* @__PURE__ */ X(C, {
 				...m,
 				onChange: (e) => o.setPlaceholder(i, e.target.value)
-			}) : d.input === "select" ? /* @__PURE__ */ Y(T, {
+			}) : d.input === "select" ? /* @__PURE__ */ X(E, {
 				...m,
 				placeholder: s.choose,
 				options: [...d.options ?? []],
 				onValueChange: (e) => o.setPlaceholder(i, e ?? "")
-			}) : /* @__PURE__ */ Y(y, {
+			}) : /* @__PURE__ */ X(y, {
 				...m,
 				type: d.input === "number" ? "number" : d.input === "date" ? "date" : "text",
 				onChange: (e) => o.setPlaceholder(i, d.input === "number" && e.target.value !== "" ? Number(e.target.value) : e.target.value)
 			});
-			return /* @__PURE__ */ Y(E, {
+			return /* @__PURE__ */ X(b, {
 				label: d.group ? `${d.group} · ${d.label}` : d.label,
 				htmlFor: p,
 				required: d.required,
 				helperText: `${f ? s.overridden : s.dynamic}${d.description ? ` · ${d.description}` : ""}`,
-				children: /* @__PURE__ */ X(a, {
+				children: /* @__PURE__ */ Z(a, {
 					id: `${p}-group`,
 					direction: "horizontal",
 					gap: "sm",
 					align: "start",
 					wrap: !1,
 					children: [
-						/* @__PURE__ */ Y("div", {
+						/* @__PURE__ */ X("div", {
 							className: "min-w-0 flex-1",
 							children: h
 						}),
-						/* @__PURE__ */ Y(r, {
+						/* @__PURE__ */ X(n, {
 							type: "button",
 							iconOnly: !0,
 							size: "sm",
@@ -485,9 +485,9 @@ function Ce({ definitions: e, values: t, draft: n, api: o, strings: s, busy: c,
 							disabled: c || !l,
 							"aria-label": s.insertVariable(d.label),
 							onClick: () => o.insertPlaceholder(i),
-							children: /* @__PURE__ */ Y(Z, { className: "size-icon" })
+							children: /* @__PURE__ */ X(ce, { className: "size-icon" })
 						}),
-						f && /* @__PURE__ */ Y(r, {
+						f && /* @__PURE__ */ X(n, {
 							type: "button",
 							size: "sm",
 							buttonStyle: "ghost",
@@ -504,7 +504,7 @@ function Ce({ definitions: e, values: t, draft: n, api: o, strings: s, busy: c,
 }
 //#endregion
 //#region src/components/features/email-composer/partials/body-editor.tsx
-var we = me.create({
+var Ce = pe.create({
 	name: "placeholderToken",
 	group: "inline",
 	inline: !0,
@@ -516,7 +516,7 @@ var we = me.create({
 	parseHTML: () => [{ tag: "span[data-placeholder]" }],
 	renderHTML: ({ node: e, HTMLAttributes: t }) => [
 		"span",
-		ge(t, {
+		he(t, {
 			"data-placeholder": e.attrs.key,
 			class: "rounded-inner bg-accent text-accent-foreground",
 			contenteditable: "false"
@@ -524,21 +524,21 @@ var we = me.create({
 		`{{${e.attrs.key}}}`
 	],
 	renderText: ({ node: e }) => `{{${e.attrs.key}}}`
-}), $ = [ve.configure({ link: { openOnClick: !1 } }), we];
-function Te({ body: n, disabled: r, onChange: i, adapterRef: c, strings: l }) {
-	let u = K(i);
+}), $ = [_e.configure({ link: { openOnClick: !1 } }), Ce];
+function we({ body: n, disabled: r, onChange: i, adapterRef: c, strings: l }) {
+	let u = q(i);
 	u.current = i;
-	let d = K(!1), [f, p] = q(!1), [m, g] = q(""), [v, b] = q(""), x = K({
+	let d = q(!1), [f, p] = J(!1), [m, g] = J(""), [v, x] = J(""), S = q({
 		from: 1,
 		to: 1
-	}), S = e(M, {
+	}), C = e(N, {
 		editorLabel: l.body,
 		toolbar: l.toolbar
-	}), C = _e({
+	}), w = ge({
 		extensions: $,
 		immediatelyRender: !1,
 		shouldRerenderOnTransaction: !0,
-		content: n.kind === "rich" ? n.document : P(n),
+		content: n.kind === "rich" ? n.document : F(n),
 		editable: !r,
 		editorProps: { attributes: {
 			role: "textbox",
@@ -553,27 +553,27 @@ function Te({ body: n, disabled: r, onChange: i, adapterRef: c, strings: l }) {
 			});
 		}
 	});
-	U(() => {
-		if (C) try {
-			let e = n.kind === "rich" ? C.schema.nodeFromJSON(n.document).toJSON() : he(P(n), $);
-			JSON.stringify(C.getJSON()) !== JSON.stringify(e) && C.commands.setContent(e, { emitUpdate: !1 });
+	W(() => {
+		if (w) try {
+			let e = n.kind === "rich" ? w.schema.nodeFromJSON(n.document).toJSON() : me(F(n), $);
+			JSON.stringify(w.getJSON()) !== JSON.stringify(e) && w.commands.setContent(e, { emitUpdate: !1 });
 		} catch {}
-	}), U(() => {
-		C?.setEditable(!r && n.kind !== "html", !1);
+	}), W(() => {
+		w?.setEditable(!r && n.kind !== "html", !1);
 	}, [
-		C,
+		w,
 		r,
 		n.kind
-	]), U(() => {
+	]), W(() => {
 		(r || n.kind === "html") && p(!1);
-	}, [r, n.kind]), G(c, () => {
+	}, [r, n.kind]), K(c, () => {
 		let e = (e) => {
-			if (!C) throw Error(l.editorNotReady);
+			if (!w) throw Error(l.editorNotReady);
 			d.current = !0;
 			try {
 				return e(), {
 					kind: "rich",
-					document: C.getJSON()
+					document: w.getJSON()
 				};
 			} finally {
 				d.current = !1;
@@ -581,121 +581,121 @@ function Te({ body: n, disabled: r, onChange: i, adapterRef: c, strings: l }) {
 		};
 		return {
 			synchronize: (e) => {
-				if (!C) return;
-				let t = e.kind === "rich" ? C.schema.nodeFromJSON(e.document).toJSON() : he(P(e), $);
-				JSON.stringify(C.getJSON()) !== JSON.stringify(t) && C.commands.setContent(t, { emitUpdate: !1 });
+				if (!w) return;
+				let t = e.kind === "rich" ? w.schema.nodeFromJSON(e.document).toJSON() : me(F(e), $);
+				JSON.stringify(w.getJSON()) !== JSON.stringify(t) && w.commands.setContent(t, { emitUpdate: !1 });
 			},
 			focus: () => {
-				C?.commands.focus();
+				w?.commands.focus();
 			},
 			convert: (e) => ({
 				kind: "rich",
-				document: e.kind === "rich" ? e.document : he(P(e), $)
+				document: e.kind === "rich" ? e.document : me(F(e), $)
 			}),
 			insert: (t, n) => e(() => {
-				n === "append" && C.commands.focus("end"), C.chain().focus().insertContent(t.kind === "rich" ? t.document.content ?? [] : P(t)).run();
+				n === "append" && w.commands.focus("end"), w.chain().focus().insertContent(t.kind === "rich" ? t.document.content ?? [] : F(t)).run();
 			}),
 			insertText: (t) => e(() => {
-				t && C.chain().focus().insertContent({
+				t && w.chain().focus().insertContent({
 					type: "text",
 					text: t
 				}).run();
 			}),
 			insertPlaceholder: (t) => e(() => {
-				C.chain().focus().insertContent({
+				w.chain().focus().insertContent({
 					type: "placeholderToken",
 					attrs: { key: t }
 				}).run();
 			})
 		};
-	}, [C, l]);
-	let w = [
+	}, [w, l]);
+	let T = [
 		{
 			id: "bold",
-			icon: ie,
-			label: S.toolbar.bold,
-			isActive: () => !!C?.isActive("bold"),
+			icon: re,
+			label: C.toolbar.bold,
+			isActive: () => !!w?.isActive("bold"),
 			run: () => {
-				C?.chain().focus().toggleBold().run();
+				w?.chain().focus().toggleBold().run();
 			}
 		},
 		{
 			id: "italic",
-			icon: ae,
-			label: S.toolbar.italic,
-			isActive: () => !!C?.isActive("italic"),
+			icon: ie,
+			label: C.toolbar.italic,
+			isActive: () => !!w?.isActive("italic"),
 			run: () => {
-				C?.chain().focus().toggleItalic().run();
+				w?.chain().focus().toggleItalic().run();
 			}
 		},
 		{
 			id: "bullet",
-			icon: se,
-			label: S.toolbar.bulletList,
-			isActive: () => !!C?.isActive("bulletList"),
+			icon: oe,
+			label: C.toolbar.bulletList,
+			isActive: () => !!w?.isActive("bulletList"),
 			run: () => {
-				C?.chain().focus().toggleBulletList().run();
+				w?.chain().focus().toggleBulletList().run();
 			}
 		},
 		{
 			id: "ordered",
-			icon: ce,
-			label: S.toolbar.orderedList,
-			isActive: () => !!C?.isActive("orderedList"),
+			icon: se,
+			label: C.toolbar.orderedList,
+			isActive: () => !!w?.isActive("orderedList"),
 			run: () => {
-				C?.chain().focus().toggleOrderedList().run();
+				w?.chain().focus().toggleOrderedList().run();
 			}
 		},
 		{
 			id: "undo",
-			icon: de,
-			label: S.toolbar.undo,
+			icon: ue,
+			label: C.toolbar.undo,
 			isActive: () => !1,
 			run: () => {
-				C?.chain().focus().undo().run();
+				w?.chain().focus().undo().run();
 			},
-			disabled: !C?.can().undo()
+			disabled: !w?.can().undo()
 		},
 		{
 			id: "redo",
 			icon: le,
-			label: S.toolbar.redo,
+			label: C.toolbar.redo,
 			isActive: () => !1,
 			run: () => {
-				C?.chain().focus().redo().run();
+				w?.chain().focus().redo().run();
 			},
-			disabled: !C?.can().redo()
+			disabled: !w?.can().redo()
 		}
 	];
-	return /* @__PURE__ */ X(a, {
+	return /* @__PURE__ */ Z(a, {
 		gap: "none",
-		className: t("email-composer--editor", j.frame, r && j.disabled),
+		className: t("email-composer--editor", M.frame, r && M.disabled),
 		children: [
-			/* @__PURE__ */ Y(A, {
-				buttons: w,
+			/* @__PURE__ */ X(j, {
+				buttons: T,
 				disabled: r,
-				hasEditor: !!C,
+				hasEditor: !!w,
 				sourceMode: !1,
 				hideSourceToggle: !0,
 				toggleSourceMode: () => {},
-				strings: S,
+				strings: C,
 				extraToolbarItems: [{
 					id: "link",
-					icon: oe,
+					icon: ae,
 					label: l.link,
 					onClick: () => {
-						C && (x.current = {
-							from: C.state.selection.from,
-							to: C.state.selection.to
-						}, g(String(C.getAttributes("link").href ?? "")), b(""), p(!0));
+						w && (S.current = {
+							from: w.state.selection.from,
+							to: w.state.selection.to
+						}, g(String(w.getAttributes("link").href ?? "")), x(""), p(!0));
 					}
 				}]
 			}),
-			/* @__PURE__ */ Y(pe, {
-				editor: C,
-				className: t(j.content, "min-h-64 w-full min-w-0 [&_.ProseMirror]:min-h-64")
+			/* @__PURE__ */ X(fe, {
+				editor: w,
+				className: t(M.content, "min-h-64 w-full min-w-0 [&_.ProseMirror]:min-h-64")
 			}),
-			/* @__PURE__ */ Y(h, {
+			/* @__PURE__ */ X(h, {
 				open: f,
 				onOpenChange: p,
 				title: l.linkTitle,
@@ -708,22 +708,22 @@ function Te({ body: n, disabled: r, onChange: i, adapterRef: c, strings: l }) {
 				onAsyncConfirm: async () => {
 					let e = m.trim();
 					if (e && !/^(https?:\/\/|mailto:)/i.test(e)) {
-						b(l.invalidLink);
+						x(l.invalidLink);
 						return;
 					}
-					C?.commands.setTextSelection(x.current), e ? C?.chain().focus().extendMarkRange("link").setLink({ href: e }).run() : C?.chain().focus().extendMarkRange("link").unsetLink().run(), p(!1);
+					w?.commands.setTextSelection(S.current), e ? w?.chain().focus().extendMarkRange("link").setLink({ href: e }).run() : w?.chain().focus().extendMarkRange("link").unsetLink().run(), p(!1);
 				},
-				children: /* @__PURE__ */ X(a, {
+				children: /* @__PURE__ */ Z(a, {
 					gap: "md",
-					children: [/* @__PURE__ */ Y(E, {
+					children: [/* @__PURE__ */ X(b, {
 						label: l.linkUrl,
-						children: /* @__PURE__ */ Y(y, {
+						children: /* @__PURE__ */ X(y, {
 							value: m,
 							onChange: (e) => g(e.target.value)
 						})
-					}), v && /* @__PURE__ */ Y(s, {
+					}), v && /* @__PURE__ */ X(s, {
 						tone: "destructive",
-						children: /* @__PURE__ */ Y(o, { children: v })
+						children: /* @__PURE__ */ X(o, { children: v })
 					})]
 				})
 			})
@@ -732,22 +732,22 @@ function Te({ body: n, disabled: r, onChange: i, adapterRef: c, strings: l }) {
 }
 //#endregion
 //#region src/components/features/email-composer/partials/html-preview.tsx
-function Ee({ html: e, subject: t, strings: r }) {
-	return /* @__PURE__ */ X(a, {
+function Te({ html: e, subject: t, strings: n }) {
+	return /* @__PURE__ */ Z(a, {
 		gap: "normal",
 		className: "min-w-0",
-		children: [/* @__PURE__ */ X(n, {
+		children: [/* @__PURE__ */ Z(r, {
 			type: "secondary",
 			children: [
-				r.subject,
+				n.subject,
 				": ",
 				t
 			]
-		}), /* @__PURE__ */ Y(c, {
+		}), /* @__PURE__ */ X(c, {
 			surface: "card",
 			padding: "none",
-			children: /* @__PURE__ */ Y("iframe", {
-				title: r.previewLabel,
+			children: /* @__PURE__ */ X("iframe", {
+				title: n.previewLabel,
 				sandbox: "",
 				referrerPolicy: "no-referrer",
 				className: "h-80 w-full border-0",
@@ -758,18 +758,18 @@ function Ee({ html: e, subject: t, strings: r }) {
 }
 //#endregion
 //#region src/components/features/email-composer/email-composer.tsx
-function De(e) {
-	let n = be(e), { api: i, draft: u, strings: d, busy: _, state: b } = n, [x, S] = q("editor"), [C, w] = q(e.placeholders?.showEditor ?? !1), [T, A] = q(!1), [j, M] = q(!1), [N, P] = q(!1), F = W(), I = x === "preview" || u.body.kind === "html", L = (t) => (e.actions ?? []).filter((e) => (e.position ?? "toolbar") === t && (e.visible?.(b) ?? !0)).map((e) => ({
+function Ee(e) {
+	let r = ye(e), { api: i, draft: u, strings: d, busy: _, state: x } = r, [S, C] = J("editor"), [w, T] = J(e.placeholders?.showEditor ?? !1), [E, j] = J(!1), [M, N] = J(!1), [P, F] = J(!1), I = G(), L = S === "preview" || u.body.kind === "html", R = (t) => (e.actions ?? []).filter((e) => (e.position ?? "toolbar") === t && (e.visible?.(x) ?? !0)).map((e) => ({
 		id: e.id,
 		label: e.label,
 		icon: e.icon,
-		disabled: _ || e.disabled?.(b),
+		disabled: _ || e.disabled?.(x),
 		onClick: () => {
-			n.runAction(e);
+			r.runAction(e);
 		},
 		buttonStyle: "ghost",
 		tone: "secondary"
-	})), R = /* @__PURE__ */ X(a, {
+	})), z = /* @__PURE__ */ Z(a, {
 		direction: {
 			base: "vertical",
 			sm: "horizontal"
@@ -781,10 +781,10 @@ function De(e) {
 		},
 		justify: "between",
 		className: "w-full",
-		children: [/* @__PURE__ */ X(a, {
+		children: [/* @__PURE__ */ Z(a, {
 			direction: "horizontal",
 			gap: "sm",
-			children: [e.buttons?.discard !== !1 && /* @__PURE__ */ Y(r, {
+			children: [e.buttons?.discard !== !1 && /* @__PURE__ */ X(n, {
 				type: "button",
 				tone: "secondary",
 				buttonStyle: "ghost",
@@ -793,115 +793,118 @@ function De(e) {
 					i.discard();
 				},
 				children: e.buttons?.discard?.label ?? d.discard
-			}), /* @__PURE__ */ Y(p, { actions: L("footer-start") })]
-		}), /* @__PURE__ */ X(a, {
+			}), /* @__PURE__ */ X(p, { actions: R("footer-start") })]
+		}), /* @__PURE__ */ Z(a, {
 			direction: "horizontal",
 			gap: "sm",
 			justify: "end",
-			children: [
-				/* @__PURE__ */ Y(p, { actions: L("footer-end") }),
-				!!L("overflow").length && /* @__PURE__ */ Y(f, {
-					actions: L("overflow"),
-					srText: d.more,
-					buttonProps: { disabled: _ }
-				}),
-				e.buttons?.send !== !1 && /* @__PURE__ */ X(r, {
+			children: [/* @__PURE__ */ X(p, { actions: R("footer-end") }), (e.buttons?.send !== !1 || !!R("overflow").length) && /* @__PURE__ */ Z(a, {
+				direction: "horizontal",
+				gap: "sm",
+				wrap: !1,
+				className: "email-composer--send-commands",
+				children: [e.buttons?.send !== !1 && /* @__PURE__ */ X(n, {
 					type: "button",
 					tone: "primary",
-					disabled: _ || n.dataPending,
+					disabled: _ || r.dataPending,
 					loading: _,
 					strings: { loading: d.working },
 					onClick: () => {
 						i.send();
 					},
-					children: [/* @__PURE__ */ Y(ue, { className: "size-icon" }), _ ? d.working : e.buttons?.send?.label ?? d.send]
-				})
-			]
+					children: _ ? d.working : e.buttons?.send?.label ?? d.send
+				}), !!R("overflow").length && /* @__PURE__ */ X(f, {
+					actions: R("overflow"),
+					srText: d.more,
+					buttonProps: { disabled: _ }
+				})]
+			})]
 		})]
-	}), z = (e) => n.attempted ? b.issues.find((t) => t.field === e)?.message : void 0, B = /* @__PURE__ */ X(a, {
+	}), B = (e) => r.attempted ? x.issues.find((t) => t.field === e)?.message : void 0, V = /* @__PURE__ */ Z(a, {
 		gap: "lg",
 		className: "email-composer--body min-w-0",
 		children: [
-			/* @__PURE__ */ X(a, {
+			/* @__PURE__ */ Z(a, {
 				gap: "md",
 				className: "email-composer--details",
-				children: [/* @__PURE__ */ Y(a, {
+				children: [/* @__PURE__ */ X(a, {
 					gap: "md",
 					children: [
 						"to",
 						"cc",
 						"bcc"
-					].filter((t) => t === "to" || t === "cc" && (T || u.cc.length || Q(e.recipients?.cc)) || t === "bcc" && (j || u.bcc.length || Q(e.recipients?.bcc))).map((t) => /* @__PURE__ */ Y(Se, {
+					].filter((t) => t === "to" || t === "cc" && (E || u.cc.length || Q(e.recipients?.cc)) || t === "bcc" && (M || u.bcc.length || Q(e.recipients?.bcc))).map((t) => /* @__PURE__ */ X(xe, {
 						field: t,
 						value: u[t],
 						options: e.recipients?.[t],
 						strings: d,
 						busy: _,
-						report: n.report,
-						error: z(t),
-						onChange: (e) => n.changeRecipients(t, e),
-						actions: t === "to" ? /* @__PURE__ */ X(J, { children: [!T && !u.cc.length && /* @__PURE__ */ Y(r, {
+						report: r.report,
+						error: B(t),
+						onChange: (e) => r.changeRecipients(t, e),
+						actions: t === "to" ? /* @__PURE__ */ Z(Y, { children: [!E && !u.cc.length && /* @__PURE__ */ X(n, {
 							type: "button",
 							size: "sm",
 							buttonStyle: "ghost",
 							tone: "secondary",
 							disabled: _,
-							onClick: () => A(!0),
+							onClick: () => j(!0),
 							children: d.cc
-						}), !j && !u.bcc.length && /* @__PURE__ */ Y(r, {
+						}), !M && !u.bcc.length && /* @__PURE__ */ X(n, {
 							type: "button",
 							size: "sm",
 							buttonStyle: "ghost",
 							tone: "secondary",
 							disabled: _,
-							onClick: () => M(!0),
+							onClick: () => N(!0),
 							children: d.bcc
 						})] }) : void 0
 					}, t))
-				}), /* @__PURE__ */ Y(E, {
+				}), /* @__PURE__ */ X(b, {
 					label: d.subject,
 					required: !0,
-					htmlFor: `${F}-subject`,
-					error: z("subject"),
-					supportingTextId: `${F}-subject-error`,
-					children: /* @__PURE__ */ Y(y, {
-						id: `${F}-subject`,
+					htmlFor: `${I}-subject`,
+					error: B("subject"),
+					supportingTextId: `${I}-subject-error`,
+					children: /* @__PURE__ */ X(y, {
+						id: `${I}-subject`,
 						value: u.subject,
 						readOnly: e.subject?.readOnly,
 						disabled: _,
-						invalid: !!z("subject"),
-						"aria-describedby": z("subject") ? `${F}-subject-error` : void 0,
-						onChange: (e) => n.changeSubject(e.target.value)
+						invalid: !!B("subject"),
+						"aria-describedby": B("subject") ? `${I}-subject-error` : void 0,
+						onChange: (e) => r.changeSubject(e.target.value)
 					})
 				})]
 			}),
-			/* @__PURE__ */ Y(ne, {
-				value: I ? "preview" : "editor",
+			/* @__PURE__ */ X(k, {
+				value: L ? "preview" : "editor",
 				onValueChange: (e) => {
-					e && S(e);
+					e && C(e);
 				},
-				children: /* @__PURE__ */ X(c, {
+				children: /* @__PURE__ */ Z(c, {
 					surface: "flat",
 					padding: "none",
 					contentGap: "md",
+					titleSize: "sm",
 					title: d.body,
-					headerAction: /* @__PURE__ */ X(te, { children: [/* @__PURE__ */ Y(D, {
+					headerAction: /* @__PURE__ */ Z(te, { children: [/* @__PURE__ */ X(D, {
 						value: "editor",
 						disabled: u.body.kind === "html",
 						children: d.editor
-					}), /* @__PURE__ */ Y(D, {
+					}), /* @__PURE__ */ X(D, {
 						value: "preview",
 						children: d.preview
 					})] }),
 					children: [
-						(!!e.templates || !!n.templates.length || L("toolbar").length > 0) && /* @__PURE__ */ X(a, {
+						(!!e.templates || !!r.templates.length || R("toolbar").length > 0) && /* @__PURE__ */ Z(a, {
 							direction: "horizontal",
 							gap: "sm",
 							align: "center",
 							className: "email-composer--message-actions",
 							children: [
-								(e.templates || !!n.templates.length) && /* @__PURE__ */ Y(k, {
-									trigger: /* @__PURE__ */ Y(r, {
+								(e.templates || !!r.templates.length) && /* @__PURE__ */ X(A, {
+									trigger: /* @__PURE__ */ X(n, {
 										type: "button",
 										tone: "secondary",
 										buttonStyle: "outline",
@@ -909,7 +912,7 @@ function De(e) {
 										disabled: _,
 										children: d.templates
 									}),
-									items: n.templates.map((e) => ({
+									items: r.templates.map((e) => ({
 										value: e.id,
 										label: e.name,
 										description: e.description ?? e.category,
@@ -919,13 +922,13 @@ function De(e) {
 										try {
 											i.applyTemplate(e.value);
 										} catch (e) {
-											n.report(e);
+											r.report(e);
 										}
 									},
 									loading: e.templates?.loading,
 									error: e.templates?.error,
 									onRetry: e.templates?.onRetry ? () => {
-										Promise.resolve().then(e.templates.onRetry).catch(n.report);
+										Promise.resolve().then(e.templates.onRetry).catch(r.report);
 									} : void 0,
 									onOpenChange: e.templates?.onOpenChange,
 									strings: {
@@ -935,88 +938,88 @@ function De(e) {
 										retry: d.retry
 									}
 								}),
-								e.templates?.allowImport && e.templates.onImport && /* @__PURE__ */ Y(r, {
+								e.templates?.allowImport && e.templates.onImport && /* @__PURE__ */ X(n, {
 									type: "button",
 									tone: "secondary",
 									buttonStyle: "ghost",
 									size: "sm",
 									disabled: _,
 									onClick: () => {
-										n.importTemplate();
+										r.importTemplate();
 									},
 									children: d.importTemplate
 								}),
-								/* @__PURE__ */ Y(p, {
+								/* @__PURE__ */ X(p, {
 									size: "sm",
-									actions: L("toolbar")
+									actions: R("toolbar")
 								})
 							]
 						}),
-						/* @__PURE__ */ Y(O, {
+						/* @__PURE__ */ X(O, {
 							value: "editor",
 							keepMounted: !0,
-							children: /* @__PURE__ */ Y(Te, {
+							children: /* @__PURE__ */ X(we, {
 								body: u.body,
-								disabled: _ || I,
-								onChange: n.changeBody,
-								adapterRef: n.editorRef,
+								disabled: _ || L,
+								onChange: r.changeBody,
+								adapterRef: r.editorRef,
 								strings: d
 							})
 						}),
-						/* @__PURE__ */ Y(O, {
+						/* @__PURE__ */ X(O, {
 							value: "preview",
-							children: n.rendered && /* @__PURE__ */ Y(Ee, {
-								html: n.rendered.email.html,
-								subject: n.rendered.email.subject,
+							children: r.rendered && /* @__PURE__ */ X(Te, {
+								html: r.rendered.email.html,
+								subject: r.rendered.email.subject,
 								strings: d
 							})
 						})
 					]
 				})
 			}),
-			(!!Object.keys(n.definitions).length || Q(e.placeholders)) && /* @__PURE__ */ Y(v, {
-				value: C ? ["variables"] : [],
-				onValueChange: (e) => w(e.includes("variables")),
+			(!!Object.keys(r.definitions).length || Q(e.placeholders)) && /* @__PURE__ */ X(v, {
+				value: w ? ["variables"] : [],
+				onValueChange: (e) => T(e.includes("variables")),
 				items: [{
 					value: "variables",
 					title: d.variables,
 					description: d.variablesDescription,
-					content: Q(e.placeholders) ? /* @__PURE__ */ Y(ye, {
+					content: Q(e.placeholders) ? /* @__PURE__ */ X(ve, {
 						state: e.placeholders,
 						label: d.loadingVariables,
 						retryLabel: d.retry,
-						report: n.report
-					}) : /* @__PURE__ */ Y(Ce, {
-						definitions: n.definitions,
-						values: n.values,
+						report: r.report
+					}) : /* @__PURE__ */ X(Se, {
+						definitions: r.definitions,
+						values: r.values,
 						draft: u,
 						api: i,
 						strings: d,
 						busy: _,
-						editable: !I
+						editable: !L
 					})
 				}]
 			}),
-			u.body.kind === "html" && /* @__PURE__ */ Y(r, {
+			u.body.kind === "html" && /* @__PURE__ */ X(n, {
 				type: "button",
 				tone: "secondary",
 				buttonStyle: "outline",
 				disabled: _,
-				onClick: () => P(!0),
+				onClick: () => F(!0),
 				children: d.convert
 			}),
-			(n.error || !n.dataPending && n.renderError) && /* @__PURE__ */ X(s, {
+			(r.error || !r.dataPending && r.renderError) && /* @__PURE__ */ Z(s, {
 				tone: "destructive",
-				children: [/* @__PURE__ */ Y(l, { children: d.errorTitle }), /* @__PURE__ */ Y(o, { children: n.error || n.renderError })]
+				children: [/* @__PURE__ */ X(l, { children: d.errorTitle }), /* @__PURE__ */ X(o, { children: r.error || r.renderError })]
 			}),
-			n.notice && /* @__PURE__ */ Y(s, {
+			r.notice && /* @__PURE__ */ X(s, {
 				tone: "success",
 				role: "status",
-				children: /* @__PURE__ */ Y(o, { children: n.notice })
+				children: /* @__PURE__ */ X(o, { children: r.notice })
 			}),
 			e.children?.(i)
 		]
-	}), V = e.title ?? d.title, H = e.onClose ? /* @__PURE__ */ Y(r, {
+	}), H = e.title ?? d.title, U = e.onClose ? /* @__PURE__ */ X(n, {
 		type: "button",
 		iconOnly: !0,
 		tone: "secondary",
@@ -1025,12 +1028,12 @@ function De(e) {
 		disabled: _,
 		"aria-label": d.close,
 		onClick: e.onClose,
-		children: /* @__PURE__ */ Y(fe, { className: "size-icon" })
-	}) : void 0, U, G = t("email-composer--component min-w-0", e.className);
+		children: /* @__PURE__ */ X(de, { className: "size-icon" })
+	}) : void 0, W, K = t("email-composer--component min-w-0", e.className);
 	if (e.position === "dialog" || e.position === "sheet") {
 		let t = {
 			open: !0,
-			title: V,
+			title: H,
 			description: e.description,
 			onOpenChange: (t) => {
 				!t && !_ && e.onClose?.();
@@ -1042,44 +1045,42 @@ function De(e) {
 			showCancel: !1,
 			showConfirm: !1,
 			showCloseButton: !!e.onClose && !_,
-			footer: R,
-			className: G
+			footer: z,
+			className: K
 		};
-		U = e.position === "dialog" ? /* @__PURE__ */ Y(h, {
+		W = e.position === "dialog" ? /* @__PURE__ */ X(h, {
 			...t,
 			size: "3xl",
 			showCloseButton: !!e.onClose && !_,
-			children: B
-		}) : /* @__PURE__ */ Y(m, {
+			children: V
+		}) : /* @__PURE__ */ X(m, {
 			...t,
 			width: "3xl",
-			children: B
+			children: V
 		});
 	} else {
-		let t = /* @__PURE__ */ Y(c, {
-			className: G,
+		let t = /* @__PURE__ */ X(c, {
+			className: K,
 			surface: "card",
-			title: V,
+			title: H,
 			description: e.description,
-			headerAction: H,
-			headerClassName: e.position === "floating" && H ? "flex-nowrap [&>.card--header-start]:basis-0 [&>.card--header-end]:shrink-0" : void 0,
-			headerDivider: !0,
-			footerDivider: !0,
-			footerSlot: R,
-			children: B
+			headerAction: U,
+			headerClassName: e.position === "floating" && U ? "flex-nowrap [&>.card--header-start]:basis-0 [&>.card--header-end]:shrink-0" : void 0,
+			footerSlot: z,
+			children: V
 		});
-		U = e.position === "floating" ? /* @__PURE__ */ Y("div", {
+		W = e.position === "floating" ? /* @__PURE__ */ X("div", {
 			className: "fixed bottom-space-md end-space-md z-40 w-[min(42rem,calc(100vw-2rem))]",
-			children: /* @__PURE__ */ Y(ee, {
+			children: /* @__PURE__ */ X(ee, {
 				className: "max-h-[calc(100dvh-2rem)]",
 				viewportClassName: "max-h-[calc(100dvh-2rem)]",
 				children: t
 			})
 		}) : t;
 	}
-	return /* @__PURE__ */ X(J, { children: [U, /* @__PURE__ */ Y(g, {
-		open: N,
-		onOpenChange: P,
+	return /* @__PURE__ */ Z(Y, { children: [W, /* @__PURE__ */ X(g, {
+		open: P,
+		onOpenChange: F,
 		title: d.convertTitle,
 		description: d.convertDescription,
 		strings: {
@@ -1088,11 +1089,11 @@ function De(e) {
 			close: d.closeConversion
 		},
 		onConfirm: () => {
-			!_ && n.editorRef.current && (i.setBody(n.editorRef.current.convert(u.body)), S("editor"));
+			!_ && r.editorRef.current && (i.setBody(r.editorRef.current.convert(u.body)), C("editor"));
 		}
 	})] });
 }
 //#endregion
-export { De as EmailComposer, P as bodyHtml, V as createHttpSender, H as defaultEmailComposerStrings, z as parseRecipient, F as recipientLabel, N as renderEmail, R as resolveValues, B as validate };
+export { Ee as EmailComposer, F as bodyHtml, H as createHttpSender, U as defaultEmailComposerStrings, B as parseRecipient, I as recipientLabel, P as renderEmail, z as resolveValues, V as validate };
 
 //# sourceMappingURL=email-composer.js.map