themelia-react-ui 2.0.1 → 2.0.3

package/dist/features/ai-chat.js

@@ -1,54 +1,56 @@
 "use client";
 import { interpolateString as e, useStrings as t } from "../lib/strings.js";
-import { t as n } from "../utils-l5LpDw2z.js";
-import { n as r } from "../buttons-SbIcm1HJ.js";
-import { a as i, s as a } from "../typography-DTRkE9zL.js";
+import { t as n } from "../utils-BRhFDwuU.js";
+import { n as r } from "../buttons-DPZekJFu.js";
+import { c as i, o as a } from "../typography-UTnveOEy.js";
 import { t as o } from "../focus-recipes-B653VaLq.js";
-import { t as s } from "../structure-DC2dygdA.js";
-import { t as c } from "../badge-MrKVNzW9.js";
-import { d as l } from "../text-inputs-aaK9wcDT.js";
-import { s as u } from "../data-display-DafIvCl5.js";
-import { c as d, l as f, s as p } from "../message-CdHgIWKf.js";
-import { S as m, _ as h, a as g, b as _, d as v, h as y, l as b, p as x, r as S, s as C, t as w, y as T } from "../ai-artifact-BMJdv-6q.js";
-import { useCallback as E, useEffect as D, useRef as O, useState as k } from "react";
-import { Fragment as A, jsx as j, jsxs as M } from "react/jsx-runtime";
-import { ArrowDown as N, ArrowUp as P, Loader2 as F, Paperclip as I, Sparkles as L, Square as R, X as z } from "lucide-react";
+import { t as s } from "../structure-BmisBK-3.js";
+import { t as c } from "../tone-recipes-BPsRAvhu.js";
+import { t as l } from "../badge-HpFqoqSY.js";
+import { t as u } from "../field-state-recipes-BVA2CWHo.js";
+import { d } from "../text-inputs-f9Ia-aCi.js";
+import { s as f } from "../data-display-DT_khPl_.js";
+import { c as p, l as m, s as h } from "../message-DZ_ruyUV.js";
+import { S as g, _, a as v, b as y, d as b, h as x, l as S, p as C, r as w, s as T, t as E, y as D } from "../ai-artifact-DvTwDVyL.js";
+import { useCallback as O, useEffect as k, useRef as A, useState as j } from "react";
+import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
+import { ArrowDown as F, ArrowUp as I, Loader2 as L, Paperclip as R, Sparkles as z, Square as B, X as ee } from "lucide-react";
 //#region src/components/features/ai-chat/ai-chat.strings.ts
-var B = {
+var V = {
 	placeholder: "Ask anything…",
 	attachAria: "Attach files",
 	submitAria: "Send message",
 	stopAria: "Stop generating",
 	modelPickerAria: "Choose model",
 	hint: "Press {{submitKey}} to send · {{newlineKey}} for newline"
-}, V = {
+}, H = {
 	transcriptAria: "Conversation messages",
 	empty: "No messages yet.",
 	scrollToBottom: "Jump to latest",
 	scrollToBottomAria: "Scroll to bottom"
-}, H = {
+}, U = {
 	header: "In queue",
 	cancelAria: "Remove from queue",
 	queuedLabel: "Queued",
 	runningLabel: "Running"
-}, U = { header: "Try" }, W = { pending: "Thinking…" }, G = {
-	prompt: B,
-	conversation: V,
-	queue: H,
-	suggestions: U,
-	message: W,
+}, W = { header: "Try" }, G = { pending: "Thinking…" }, K = {
+	prompt: V,
+	conversation: H,
+	queue: U,
+	suggestions: W,
+	message: G,
 	emptyTitle: "Start a conversation",
 	emptyDescription: "Ask a question, share context, or attach a file to get going.",
 	disabledAnnouncement: "Chat is disabled"
 };
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-attachments-strip.tsx
-function K({ attachments: e, onRemove: t, onOpen: r, className: i }) {
-	return e.length === 0 ? null : /* @__PURE__ */ j(s, {
+function q({ attachments: e, onRemove: t, onOpen: r, className: i }) {
+	return e.length === 0 ? null : /* @__PURE__ */ N(s, {
 		direction: "horizontal",
 		gap: "sm",
 		className: n("ai-chat-attachments-strip--component", i),
-		children: e.map((e) => /* @__PURE__ */ j(y, {
+		children: e.map((e) => /* @__PURE__ */ N(x, {
 			name: e.name,
 			meta: e.meta,
 			kind: e.kind,
@@ -61,17 +63,17 @@ function K({ attachments: e, onRemove: t, onOpen: r, className: i }) {
 		}, e.id))
 	});
 }
-K.displayName = "AiChatAttachmentsStrip";
+q.displayName = "AiChatAttachmentsStrip";
 //#endregion
 //#region src/components/features/ai-chat/hooks/use-ai-chat-scroll.ts
-function q({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {}) {
-	let r = O(null), i = O(null), [a, o] = k(!0), s = E((e = "smooth") => {
+function te({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {}) {
+	let r = A(null), i = A(null), [a, o] = j(!0), s = O((e = "smooth") => {
 		i.current?.scrollIntoView({
 			behavior: e,
 			block: "end"
 		});
 	}, []);
-	return D(() => {
+	return k(() => {
 		let t = r.current;
 		if (!t) return;
 		let n = () => {
@@ -79,7 +81,7 @@ function q({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {})
 			o(n <= e);
 		};
 		return n(), t.addEventListener("scroll", n, { passive: !0 }), () => t.removeEventListener("scroll", n);
-	}, [e]), D(() => {
+	}, [e]), k(() => {
 		if (n || !a) return;
 		let e = window.requestAnimationFrame(() => s("auto"));
 		return () => window.cancelAnimationFrame(e);
@@ -92,31 +94,31 @@ function q({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {})
 }
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-conversation.tsx
-function J({ messages: e, renderMessage: i, intro: c, footer: l, empty: u, disableAutoScroll: d, className: f, strings: p }) {
-	let m = t(V, p), { containerRef: h, endRef: g, isAtBottom: _, scrollToBottom: v } = q({
+function J({ messages: e, renderMessage: a, intro: c, footer: l, empty: u, disableAutoScroll: d, className: f, strings: p }) {
+	let m = t(H, p), { containerRef: h, endRef: g, isAtBottom: _, scrollToBottom: v } = te({
 		dependency: e.length,
 		disableAutoScroll: d
 	}), y = e.length === 0 && !c;
-	return /* @__PURE__ */ M("div", {
+	return /* @__PURE__ */ P("div", {
 		className: n("ai-chat-conversation--component relative flex h-full min-h-0 flex-col", f),
-		children: [/* @__PURE__ */ M("div", {
+		children: [/* @__PURE__ */ P("div", {
 			ref: h,
 			tabIndex: 0,
 			"aria-label": m.transcriptAria,
 			className: `flex-1 overflow-y-auto p-surface focus-visible:outline-none ${o.inset}`,
 			children: [
-				!!c && /* @__PURE__ */ j("div", {
+				!!c && /* @__PURE__ */ N("div", {
 					className: "mb-space-xl",
 					children: c
 				}),
-				y ? u ?? /* @__PURE__ */ j("div", {
+				y ? u ?? /* @__PURE__ */ N("div", {
 					className: "flex h-full items-center justify-center p-surface-lg",
-					children: /* @__PURE__ */ j(a, {
+					children: /* @__PURE__ */ N(i, {
 						type: "secondary",
 						children: m.empty
 					})
-				}) : /* @__PURE__ */ j(s, {
-					render: /* @__PURE__ */ j("ol", {}),
+				}) : /* @__PURE__ */ N(s, {
+					render: /* @__PURE__ */ N("ol", {}),
 					gap: "xl",
 					className: "ai-chat-conversation--messages m-0 list-none p-0 font-sans",
 					children: e.map((t, n) => {
@@ -124,29 +126,29 @@ function J({ messages: e, renderMessage: i, intro: c, footer: l, empty: u, disab
 							isLast: n === e.length - 1,
 							index: n
 						};
-						return /* @__PURE__ */ j("li", { children: i(t, r) }, t.id);
+						return /* @__PURE__ */ N("li", { children: a(t, r) }, t.id);
 					})
 				}),
-				!!l && /* @__PURE__ */ j("div", {
+				!!l && /* @__PURE__ */ N("div", {
 					className: "mt-space-xl",
 					children: l
 				}),
-				/* @__PURE__ */ j("div", {
+				/* @__PURE__ */ N("div", {
 					ref: g,
 					"aria-hidden": !0,
 					className: "h-px"
 				})
 			]
-		}), !_ && /* @__PURE__ */ j("div", {
+		}), !_ && /* @__PURE__ */ N("div", {
 			className: "ai-chat-conversation--jump flex shrink-0 justify-center border-t border-border/60 bg-background px-space-md py-space-sm",
-			children: /* @__PURE__ */ M(r, {
+			children: /* @__PURE__ */ P(r, {
 				type: "button",
 				tone: "secondary",
 				buttonStyle: "solid",
 				"aria-label": m.scrollToBottomAria,
 				onClick: () => v("smooth"),
 				className: n("shadow-sm max-sm:size-action-sm max-sm:min-h-0 max-sm:p-0", "border border-border/60"),
-				children: [/* @__PURE__ */ j(N, { className: "size-icon-md" }), /* @__PURE__ */ j(a, {
+				children: [/* @__PURE__ */ N(F, { className: "size-icon-md" }), /* @__PURE__ */ N(i, {
 					tag: "span",
 					size: "pxs",
 					className: "max-sm:sr-only",
@@ -159,24 +161,24 @@ function J({ messages: e, renderMessage: i, intro: c, footer: l, empty: u, disab
 J.displayName = "AiChatConversation";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-empty-state.tsx
-function Y({ title: e = "Start a conversation", description: t, icon: r = L, below: i, className: a }) {
-	let o = /* @__PURE__ */ j(r, {
+function Y({ title: e = "Start a conversation", description: t, icon: r = z, below: i, className: a }) {
+	let o = /* @__PURE__ */ N(r, {
 		className: "size-icon",
 		"aria-hidden": "true"
 	});
-	return /* @__PURE__ */ M(s, {
+	return /* @__PURE__ */ P(s, {
 		gap: "md",
 		align: "center",
 		justify: "center",
 		className: n("ai-chat-empty-state--component min-h-full text-center", a),
-		children: [/* @__PURE__ */ j(u, {
+		children: [/* @__PURE__ */ N(f, {
 			title: e,
 			description: t ?? !1,
 			media: o,
 			mediaVariant: "icon",
 			padding: "md",
 			className: "w-full"
-		}), !!i && /* @__PURE__ */ j("div", {
+		}), !!i && /* @__PURE__ */ N("div", {
 			className: "w-full max-w-2xl",
 			children: i
 		})]
@@ -186,20 +188,20 @@ Y.displayName = "AiChatEmptyState";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-message.tsx
 function X({ message: e, onCopy: r, onRegenerate: i, onAttachmentOpen: a, className: o, strings: c }) {
-	let l = t(W, c), u = e.role === "user" ? "end" : "start", h = [], g = [];
-	for (let t of e.parts) t.type === "text" ? h.push(t) : g.push(t);
-	let _ = h.map((e) => e.type === "text" ? e.plain ?? te(e.content) : "").filter(Boolean).join("\n") || void 0, v = e.pending ? /* @__PURE__ */ j(T, { children: l.pending }) : h.length === 0 && g.length > 0 ? null : /* @__PURE__ */ j(s, {
+	let l = t(G, c), u = e.role === "user" ? "end" : "start", d = [], f = [];
+	for (let t of e.parts) t.type === "text" ? d.push(t) : f.push(t);
+	let _ = d.map((e) => e.type === "text" ? e.plain ?? re(e.content) : "").filter(Boolean).join("\n") || void 0, v = e.pending ? /* @__PURE__ */ N(D, { children: l.pending }) : d.length === 0 && f.length > 0 ? null : /* @__PURE__ */ N(s, {
 		gap: "md",
-		children: h.map((e, t) => e.type === "text" ? /* @__PURE__ */ j("div", {
+		children: d.map((e, t) => e.type === "text" ? /* @__PURE__ */ N("div", {
 			className: "whitespace-pre-wrap",
 			children: e.content
 		}, t) : null)
-	}), y = v !== null || e.pending, b = y && (e.avatar == null || p(e.avatar)), x = b ? f[u] : "col-start-1";
-	return /* @__PURE__ */ M(s, {
+	}), y = v !== null || e.pending, b = y && (e.avatar == null || h(e.avatar)), x = b ? m[u] : "col-start-1";
+	return /* @__PURE__ */ P(s, {
 		gap: "md",
-		className: n("ai-chat-message--component grid min-w-0", b ? d[u] : "grid-cols-1", o),
+		className: n("ai-chat-message--component grid min-w-0", b ? p[u] : "grid-cols-1", o),
 		children: [
-			y && /* @__PURE__ */ j(m, {
+			y && /* @__PURE__ */ N(g, {
 				role: e.role,
 				avatar: e.avatar,
 				authorName: e.authorName,
@@ -211,15 +213,15 @@ function X({ message: e, onCopy: r, onRegenerate: i, onAttachmentOpen: a, classN
 				onRegenerate: i,
 				children: v
 			}),
-			g.length > 0 && /* @__PURE__ */ j(s, {
+			f.length > 0 && /* @__PURE__ */ N(s, {
 				gap: "md",
 				className: n("ai-chat-message--parts min-w-0", x),
-				children: g.map((e, t) => /* @__PURE__ */ j(ee, {
+				children: f.map((e, t) => /* @__PURE__ */ N(ne, {
 					part: e,
 					onAttachmentOpen: a
 				}, t))
 			}),
-			!!e.trailing && /* @__PURE__ */ j("div", {
+			!!e.trailing && /* @__PURE__ */ N("div", {
 				className: n("ai-chat-message--trailing min-w-0", x),
 				children: e.trailing
 			})
@@ -227,19 +229,19 @@ function X({ message: e, onCopy: r, onRegenerate: i, onAttachmentOpen: a, classN
 	});
 }
 X.displayName = "AiChatMessage";
-function ee({ part: e, onAttachmentOpen: t }) {
+function ne({ part: e, onAttachmentOpen: t }) {
 	switch (e.type) {
-		case "text": return /* @__PURE__ */ j(a, { children: e.content });
-		case "reasoning": return /* @__PURE__ */ j(C, {
+		case "text": return /* @__PURE__ */ N(i, { children: e.content });
+		case "reasoning": return /* @__PURE__ */ N(T, {
 			streaming: e.streaming,
 			durationSeconds: e.durationSeconds,
 			children: e.content
 		});
-		case "chain-of-thought": return /* @__PURE__ */ j(g, {
+		case "chain-of-thought": return /* @__PURE__ */ N(v, {
 			steps: e.steps,
 			streaming: e.streaming
 		});
-		case "tool": return /* @__PURE__ */ j(_, {
+		case "tool": return /* @__PURE__ */ N(y, {
 			name: e.name,
 			status: e.status,
 			icon: e.icon,
@@ -249,24 +251,24 @@ function ee({ part: e, onAttachmentOpen: t }) {
 			durationMs: e.durationMs,
 			defaultExpanded: e.defaultExpanded
 		});
-		case "code": return /* @__PURE__ */ j(h, {
+		case "code": return /* @__PURE__ */ N(_, {
 			code: e.code,
 			language: e.language,
 			filename: e.filename,
 			showLineNumbers: e.showLineNumbers,
 			highlightLines: e.highlightLines
 		});
-		case "attachments": return /* @__PURE__ */ j(K, {
+		case "attachments": return /* @__PURE__ */ N(q, {
 			attachments: e.items,
 			onOpen: t ? (e) => t(e.id) : void 0
 		});
-		case "sources": return /* @__PURE__ */ j(b, {
+		case "sources": return /* @__PURE__ */ N(S, {
 			sources: e.items,
 			variant: e.variant,
 			defaultExpanded: e.defaultExpanded
 		});
-		case "task": return /* @__PURE__ */ j(S, { task: e.task });
-		case "artifact": return /* @__PURE__ */ j(w, {
+		case "task": return /* @__PURE__ */ N(w, { task: e.task });
+		case "artifact": return /* @__PURE__ */ N(E, {
 			title: e.title,
 			subtitle: e.subtitle,
 			icon: e.icon,
@@ -276,7 +278,7 @@ function ee({ part: e, onAttachmentOpen: t }) {
 			onDownload: e.onDownload,
 			children: e.body
 		});
-		case "confirmation": return /* @__PURE__ */ j(v, {
+		case "confirmation": return /* @__PURE__ */ N(b, {
 			title: e.title,
 			description: e.description,
 			tone: e.tone,
@@ -285,99 +287,105 @@ function ee({ part: e, onAttachmentOpen: t }) {
 			onApprove: e.onApprove,
 			onReject: e.onReject
 		});
-		case "custom": return /* @__PURE__ */ j(A, { children: e.render() });
+		case "custom": return /* @__PURE__ */ N(M, { children: e.render() });
 		default: return null;
 	}
 }
-function te(e) {
-	return typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(te).join("") : "";
+function re(e) {
+	return typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(re).join("") : "";
 }
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-prompt-input.tsx
-function Z({ value: i, onValueChange: o, onSubmit: s, onStop: c, streaming: u = !1, disabled: d = !1, attachments: f = [], onRemoveAttachment: p, onAttach: m, showAttach: h, leadingActions: g, trailingActions: _, hideHint: v = !1, minRows: y = 1, maxRows: b = 8, autoFocus: x = !1, submitKeyLabel: S = "↩", className: C, strings: w }) {
-	let T = t(B, w), D = O(null), k = !u && !d && (i.trim().length > 0 || f.length > 0), A = E(() => {
+function Z({ value: a, onValueChange: o, onSubmit: s, onStop: c, streaming: l = !1, disabled: f = !1, attachments: p = [], onRemoveAttachment: m, onAttach: h, showAttach: g, leadingActions: _, trailingActions: v, hideHint: y = !1, minRows: b = 1, maxRows: x = 8, autoFocus: S = !1, submitKeyLabel: C = "↩", className: w, strings: T }) {
+	let E = t(V, T), D = A(null), k = !l && !f && (a.trim().length > 0 || p.length > 0), j = O(() => {
 		k && s?.({
-			text: i,
-			attachments: f
+			text: a,
+			attachments: p
 		});
 	}, [
 		k,
 		s,
-		i,
-		f
-	]), N = E((e) => {
-		e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing && (e.preventDefault(), A());
-	}, [A]), F = h ?? !!m;
-	return /* @__PURE__ */ M("div", {
-		className: n("ai-chat-prompt-input--component", "rounded-radius border border-input bg-card transition-[color,box-shadow] duration-150", "has-[textarea:focus-visible]:border-ring has-[textarea:focus-visible]:ring-3 has-[textarea:focus-visible]:ring-ring/50", d && "opacity-50 pointer-events-none", C),
+		a,
+		p
+	]), M = O((e) => {
+		e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing && (e.preventDefault(), j());
+	}, [j]), F = g ?? !!h;
+	return /* @__PURE__ */ P("div", {
+		inert: f || void 0,
+		className: n("ai-chat-prompt-input--component", "rounded-radius border border-input bg-card text-card-foreground transition-[color,box-shadow] duration-150", u.groupFocus, u.groupInvalid, f && "opacity-50 pointer-events-none", w),
 		children: [
-			f.length > 0 && /* @__PURE__ */ j("div", {
+			p.length > 0 && /* @__PURE__ */ N("div", {
 				className: "border-b border-border/60 p-surface-xs",
-				children: /* @__PURE__ */ j(K, {
-					attachments: f,
-					onRemove: p
+				children: /* @__PURE__ */ N(q, {
+					attachments: p,
+					onRemove: m
 				})
 			}),
-			/* @__PURE__ */ j(l, {
+			/* @__PURE__ */ N(d, {
 				ref: D,
-				value: i,
+				value: a,
 				onChange: (e) => o(e.target.value),
-				onKeyDown: N,
-				placeholder: T.placeholder,
+				onKeyDown: M,
+				placeholder: E.placeholder,
 				autoResize: !0,
-				minRows: y,
-				maxRows: b,
-				autoFocus: x,
-				disabled: d,
-				className: n("!border-0 !bg-transparent !shadow-none focus-visible:!ring-0 resize-none")
+				minRows: b,
+				maxRows: x,
+				autoFocus: S,
+				disabled: f,
+				"data-slot": "input-group-control",
+				className: "rounded-none border-0 bg-transparent text-inherit shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 resize-none disabled:opacity-100"
 			}),
-			/* @__PURE__ */ M("div", {
+			/* @__PURE__ */ P("div", {
 				className: "flex items-center gap-space-xs border-t border-border/60 px-surface-xs py-space-sm",
 				children: [
-					g,
-					F && /* @__PURE__ */ j(r, {
+					_,
+					F && /* @__PURE__ */ N(r, {
 						type: "button",
 						tone: "secondary",
 						buttonStyle: "ghost",
 						size: "sm",
 						iconOnly: !0,
-						"aria-label": T.attachAria,
-						onClick: m,
-						disabled: d,
-						children: /* @__PURE__ */ j(I, { className: "size-icon" })
+						"aria-label": E.attachAria,
+						className: "disabled:opacity-100",
+						onClick: h,
+						disabled: f,
+						children: /* @__PURE__ */ N(R, { className: "size-icon" })
 					}),
-					/* @__PURE__ */ M("div", {
+					/* @__PURE__ */ P("div", {
 						className: "ml-auto flex items-center gap-space-xs",
-						children: [_, u ? /* @__PURE__ */ j(r, {
+						children: [v, l ? /* @__PURE__ */ N(r, {
 							type: "button",
 							tone: "secondary",
 							buttonStyle: "solid",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": T.stopAria,
+							"aria-label": E.stopAria,
+							className: "disabled:opacity-100",
 							onClick: c,
-							children: /* @__PURE__ */ j(R, { className: "size-icon-md fill-current" })
-						}) : /* @__PURE__ */ j(r, {
+							disabled: f,
+							children: /* @__PURE__ */ N(B, { className: "size-icon-md fill-current" })
+						}) : /* @__PURE__ */ N(r, {
 							type: "button",
 							tone: "primary",
 							buttonStyle: "solid",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": T.submitAria,
-							onClick: A,
+							"aria-label": E.submitAria,
+							className: f ? "disabled:opacity-100" : void 0,
+							onClick: j,
 							disabled: !k,
-							children: /* @__PURE__ */ j(P, { className: "size-icon" })
+							children: /* @__PURE__ */ N(I, { className: "size-icon" })
 						})]
 					})
 				]
 			}),
-			!v && /* @__PURE__ */ j("div", {
+			!y && /* @__PURE__ */ N("div", {
 				className: "px-surface-xs pb-surface-xs",
-				children: /* @__PURE__ */ j(a, {
+				children: /* @__PURE__ */ N(i, {
 					size: "xs",
 					type: "discrete",
-					children: e(T.hint, {
-						submitKey: S,
+					children: e(E.hint, {
+						submitKey: C,
 						newlineKey: "⇧↩"
 					})
 				})
@@ -388,51 +396,52 @@ function Z({ value: i, onValueChange: o, onSubmit: s, onStop: c, streaming: u =
 Z.displayName = "AiChatPromptInput";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-queue.tsx
-function Q({ items: e, hideHeader: o = !1, onCancel: l, className: u, strings: d }) {
-	let f = t(H, d);
-	return e.length === 0 ? null : /* @__PURE__ */ M(s, {
+function Q({ items: e, hideHeader: o = !1, onCancel: u, className: d, strings: f }) {
+	let p = t(U, f);
+	return e.length === 0 ? null : /* @__PURE__ */ P(s, {
 		gap: "sm",
-		className: n("ai-chat-queue--component", "rounded-radius border border-border/60 bg-muted/30 p-surface-xs", u),
-		children: [!o && /* @__PURE__ */ M(i, {
+		className: n("ai-chat-queue--component", "rounded-radius border border-border/60 bg-muted/30 p-surface-xs", d),
+		children: [!o && /* @__PURE__ */ P(a, {
 			className: "px-1",
 			children: [
-				f.header,
+				p.header,
 				" · ",
 				e.length
 			]
-		}), /* @__PURE__ */ j(s, {
-			render: /* @__PURE__ */ j("ul", {}),
+		}), /* @__PURE__ */ N(s, {
+			render: /* @__PURE__ */ N("ul", {}),
 			gap: "xs",
 			className: "ai-chat-queue--list m-0 list-none p-0 font-sans",
 			children: e.map((e) => {
 				let t = e.status ?? "queued";
-				return /* @__PURE__ */ M("li", {
-					className: "flex items-center gap-space-md rounded-inner bg-card px-space-md py-space-sm",
+				return /* @__PURE__ */ P("li", {
+					className: "flex items-center gap-space-md rounded-inner bg-card text-card-foreground px-space-md py-space-sm",
 					children: [
-						t === "running" ? /* @__PURE__ */ j(F, { className: "size-icon-md shrink-0 animate-spin text-primary-accent" }) : /* @__PURE__ */ j("span", {
+						t === "running" ? /* @__PURE__ */ N(L, { className: "size-icon-md shrink-0 animate-spin text-primary-accent" }) : /* @__PURE__ */ N("span", {
 							"aria-hidden": !0,
 							className: "flex size-icon-md shrink-0 items-center justify-center",
-							children: /* @__PURE__ */ j("span", { className: "size-2 rounded-full bg-muted-foreground" })
+							children: /* @__PURE__ */ N("span", { className: n(c.marker, "bg-muted-foreground") })
 						}),
-						/* @__PURE__ */ j(a, {
+						/* @__PURE__ */ N(i, {
+							type: "inherit",
 							className: "flex-1 truncate",
 							children: e.label
 						}),
-						/* @__PURE__ */ j(c, {
+						/* @__PURE__ */ N(l, {
 							tone: t === "running" ? "info" : "secondary",
-							children: t === "running" ? f.runningLabel : f.queuedLabel
+							children: t === "running" ? p.runningLabel : p.queuedLabel
 						}),
-						(!!e.onCancel || !!l) && /* @__PURE__ */ j(r, {
+						(!!e.onCancel || !!u) && /* @__PURE__ */ N(r, {
 							type: "button",
 							tone: "secondary",
 							buttonStyle: "ghost",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": f.cancelAria,
+							"aria-label": p.cancelAria,
 							onClick: () => {
-								e.onCancel?.(), l?.(e.id);
+								e.onCancel?.(), u?.(e.id);
 							},
-							children: /* @__PURE__ */ j(z, { className: "size-icon-md" })
+							children: /* @__PURE__ */ N(ee, { className: "size-icon-md" })
 						})
 					]
 				}, e.id);
@@ -444,24 +453,24 @@ Q.displayName = "AiChatQueue";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-suggestions-row.tsx
 function $({ suggestions: e, onPick: o, hideHeader: s = !1, className: c, strings: l }) {
-	let u = t(U, l);
-	return e.length === 0 ? null : /* @__PURE__ */ M("div", {
+	let u = t(W, l);
+	return e.length === 0 ? null : /* @__PURE__ */ P("div", {
 		className: n("ai-chat-suggestions-row--component flex items-center gap-space-md", c),
-		children: [!s && /* @__PURE__ */ j(i, {
+		children: [!s && /* @__PURE__ */ N(a, {
 			className: "shrink-0",
 			children: u.header
-		}), /* @__PURE__ */ j("div", {
+		}), /* @__PURE__ */ N("div", {
 			className: "flex min-w-0 flex-1 items-center gap-space-sm overflow-x-auto p-space-xs [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
 			children: e.map((e) => {
 				let t = e.icon;
-				return /* @__PURE__ */ M(r, {
+				return /* @__PURE__ */ P(r, {
 					type: "button",
 					tone: "secondary",
 					buttonStyle: "outline",
 					size: "sm",
 					onClick: () => o?.(e),
 					className: "shrink-0 gap-space-sm",
-					children: [!!t && /* @__PURE__ */ j(t, { className: "size-icon-sm text-muted-foreground" }), /* @__PURE__ */ j(a, {
+					children: [!!t && /* @__PURE__ */ N(t, { className: "size-icon-sm text-muted-foreground" }), /* @__PURE__ */ N(i, {
 						tag: "span",
 						weight: "medium",
 						children: e.label
@@ -474,27 +483,27 @@ function $({ suggestions: e, onPick: o, hideHeader: s = !1, className: c, string
 $.displayName = "AiChatSuggestionsRow";
 //#endregion
 //#region src/components/features/ai-chat/ai-chat.tsx
-function ne({ messages: e, inputValue: r, onInputChange: i, onSubmit: o, onStop: c, streaming: l = !1, disabled: u = !1, attachments: d = [], onRemoveAttachment: f, onAttach: p, showAttach: m, agent: h, headerActions: g, queue: _ = [], onCancelQueueItem: v, suggestions: y = [], onPickSuggestion: b, onMessageCopy: S, onMessageRegenerate: C, onAttachmentOpen: w, disableAutoScroll: T, slots: D, strings: O, className: A }) {
-	let N = t(G, O), [, P] = k(0), F = E((e, t) => D?.renderMessage ? D.renderMessage(e, t) : /* @__PURE__ */ j(X, {
+function ie({ messages: e, inputValue: r, onInputChange: a, onSubmit: o, onStop: c, streaming: l = !1, disabled: u = !1, attachments: d = [], onRemoveAttachment: f, onAttach: p, showAttach: m, agent: h, headerActions: g, queue: _ = [], onCancelQueueItem: v, suggestions: y = [], onPickSuggestion: b, onMessageCopy: x, onMessageRegenerate: S, onAttachmentOpen: w, disableAutoScroll: T, slots: E, strings: D, className: k }) {
+	let A = t(K, D), [, M] = j(0), F = O((e, t) => E?.renderMessage ? E.renderMessage(e, t) : /* @__PURE__ */ N(X, {
 		className: "ai-chat-message--component",
 		message: e,
-		strings: N.message,
-		onCopy: S ? () => S(e) : void 0,
-		onRegenerate: C ? () => C(e) : void 0,
+		strings: A.message,
+		onCopy: x ? () => x(e) : void 0,
+		onRegenerate: S ? () => S(e) : void 0,
 		onAttachmentOpen: w ? (t) => w(e.id, t) : void 0
 	}), [
 		w,
+		x,
 		S,
-		C,
-		D,
-		N.message
-	]), I = D?.header ?? (h ? /* @__PURE__ */ j("div", {
-		className: "border-b border-border bg-card p-surface",
-		children: /* @__PURE__ */ M(s, {
+		E,
+		A.message
+	]), I = E?.header ?? (h ? /* @__PURE__ */ N("div", {
+		className: "border-b border-border bg-card text-card-foreground p-surface",
+		children: /* @__PURE__ */ P(s, {
 			direction: "horizontal",
 			align: "center",
 			gap: "lg",
-			children: [/* @__PURE__ */ j(x, {
+			children: [/* @__PURE__ */ N(C, {
 				name: h.name,
 				icon: h.icon,
 				avatar: h.avatar,
@@ -502,27 +511,27 @@ function ne({ messages: e, inputValue: r, onInputChange: i, onSubmit: o, onStop:
 				tone: h.tone,
 				status: h.status,
 				variant: "inline"
-			}), !!g && /* @__PURE__ */ j("div", {
+			}), !!g && /* @__PURE__ */ N("div", {
 				className: "ml-auto flex items-center gap-space-xs",
 				children: g
 			})]
 		})
-	}) : null), L = D?.empty ?? (e.length === 0 ? /* @__PURE__ */ j(Y, {
-		title: N.emptyTitle,
-		description: N.emptyDescription
-	}) : null), R = D?.queue ?? (_.length > 0 ? /* @__PURE__ */ j(Q, {
+	}) : null), L = E?.empty ?? (e.length === 0 ? /* @__PURE__ */ N(Y, {
+		title: A.emptyTitle,
+		description: A.emptyDescription
+	}) : null), R = E?.queue ?? (_.length > 0 ? /* @__PURE__ */ N(Q, {
 		items: _,
 		onCancel: v,
-		strings: N.queue
-	}) : null), z = D?.suggestions ?? (y.length > 0 ? /* @__PURE__ */ j($, {
+		strings: A.queue
+	}) : null), z = E?.suggestions ?? (y.length > 0 ? /* @__PURE__ */ N($, {
 		suggestions: y,
 		onPick: b,
-		strings: N.suggestions
-	}) : null), B = D?.input ?? /* @__PURE__ */ j(Z, {
+		strings: A.suggestions
+	}) : null), B = E?.input ?? /* @__PURE__ */ N(Z, {
 		value: r,
-		onValueChange: i,
+		onValueChange: a,
 		onSubmit: (e) => {
-			o?.(e), P((e) => e + 1);
+			o?.(e), M((e) => e + 1);
 		},
 		onStop: c,
 		streaming: l,
@@ -531,24 +540,24 @@ function ne({ messages: e, inputValue: r, onInputChange: i, onSubmit: o, onStop:
 		onRemoveAttachment: f,
 		onAttach: p,
 		showAttach: m,
-		strings: N.prompt
+		strings: A.prompt
 	});
-	return /* @__PURE__ */ M("div", {
-		className: n("ai-chat--component flex h-full flex-col overflow-hidden rounded-radius border border-border bg-background", A),
+	return /* @__PURE__ */ P("div", {
+		className: n("ai-chat--component box-border flex h-full flex-col overflow-hidden rounded-radius border border-border bg-background text-foreground", k),
 		children: [
 			I,
-			/* @__PURE__ */ j(J, {
+			/* @__PURE__ */ N(J, {
 				messages: e,
 				renderMessage: F,
-				intro: D?.intro,
-				footer: D?.belowMessages,
+				intro: E?.intro,
+				footer: E?.belowMessages,
 				empty: L,
 				disableAutoScroll: T,
-				strings: N.conversation
+				strings: A.conversation
 			}),
-			(R || z || B) && /* @__PURE__ */ j("div", {
-				className: "border-t border-border bg-card p-surface",
-				children: /* @__PURE__ */ M(s, {
+			(R || z || B) && /* @__PURE__ */ N("div", {
+				className: "border-t border-border bg-card text-card-foreground p-surface",
+				children: /* @__PURE__ */ P(s, {
 					gap: "md",
 					children: [
 						R,
@@ -557,16 +566,16 @@ function ne({ messages: e, inputValue: r, onInputChange: i, onSubmit: o, onStop:
 					]
 				})
 			}),
-			u && /* @__PURE__ */ j(a, {
+			u && /* @__PURE__ */ N(i, {
 				className: "sr-only",
 				"aria-live": "polite",
-				children: N.disabledAnnouncement
+				children: A.disabledAnnouncement
 			})
 		]
 	});
 }
-ne.displayName = "AiChat";
+ie.displayName = "AiChat";
 //#endregion
-export { ne as AiChat, K as AiChatAttachmentsStrip, J as AiChatConversation, Y as AiChatEmptyState, X as AiChatMessageView, Z as AiChatPromptInput, Q as AiChatQueue, $ as AiChatSuggestionsRow, V as defaultAiChatConversationStrings, W as defaultAiChatMessageStrings, B as defaultAiChatPromptInputStrings, H as defaultAiChatQueueStrings, G as defaultAiChatStrings, U as defaultAiChatSuggestionsStrings, q as useAiChatScroll };
+export { ie as AiChat, q as AiChatAttachmentsStrip, J as AiChatConversation, Y as AiChatEmptyState, X as AiChatMessageView, Z as AiChatPromptInput, Q as AiChatQueue, $ as AiChatSuggestionsRow, H as defaultAiChatConversationStrings, G as defaultAiChatMessageStrings, V as defaultAiChatPromptInputStrings, U as defaultAiChatQueueStrings, K as defaultAiChatStrings, W as defaultAiChatSuggestionsStrings, te as useAiChatScroll };
 
 //# sourceMappingURL=ai-chat.js.map