themelia-react-ui 2.0.5 → 3.0.0

package/dist/features/ai-chat.js

@@ -1,56 +1,56 @@
 "use client";
 import { interpolateString as e, useStrings as t } from "../lib/strings.js";
-import { t as n } from "../utils-B6kKb8jB.js";
-import { n as r } from "../buttons-BedGfygC.js";
-import { c as i, o as a } from "../typography-BQnine1k.js";
-import { t as o } from "../focus-recipes-B653VaLq.js";
-import { t as s } from "../structure-DuxKl954.js";
+import { t as n } from "../utils-BVbAG2J6.js";
+import { c as r, o as i } from "../typography-C0dELqYV.js";
+import { t as a } from "../focus-recipes-DSkiUvUp.js";
+import { n as o } from "../buttons-pZVgPTZn.js";
+import { t as s } from "../structure-DElaQwwN.js";
 import { t as c } from "../tone-recipes-BPsRAvhu.js";
-import { t as l } from "../badge-xIiV_E7f.js";
-import { t as u } from "../field-state-recipes-BVA2CWHo.js";
-import { d } from "../text-inputs-B1culiSK.js";
-import { s as f } from "../data-display-BdgCAw8T.js";
-import { c as p, l as m, s as h } from "../message-g8p7eVtN.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-C58tQcBy.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";
+import { o as l } from "../surface-recipes-DV6rrOFq.js";
+import { t as u } from "../badge-oGiXblW7.js";
+import { t as d } from "../field-state-recipes-EtCxpEy3.js";
+import { d as f } from "../text-inputs-ljyBYaCd.js";
+import { s as p } from "../data-display-CWe9SOYh.js";
+import { c as m, l as h, s as g } from "../message-BiiVrRrm.js";
+import { S as _, _ as v, a as y, b, d as x, h as S, l as C, p as ee, r as w, s as T, t as E, y as D } from "../ai-artifact-otrz9ZwS.js";
+import { useCallback as O, useEffect as k, useId as A, useRef as j, useState as M } from "react";
+import { Fragment as N, jsx as P, jsxs as F } from "react/jsx-runtime";
+import { ArrowDown as I, ArrowUp as L, Loader2 as R, Paperclip as z, Sparkles as te, Square as ne, X as re } from "lucide-react";
 //#region src/components/features/ai-chat/ai-chat.strings.ts
-var V = {
+var B = {
 	placeholder: "Ask anything…",
 	attachAria: "Attach files",
 	submitAria: "Send message",
 	stopAria: "Stop generating",
-	modelPickerAria: "Choose model",
 	hint: "Press {{submitKey}} to send · {{newlineKey}} for newline"
-}, H = {
+}, V = {
 	transcriptAria: "Conversation messages",
 	empty: "No messages yet.",
 	scrollToBottom: "Jump to latest",
 	scrollToBottomAria: "Scroll to bottom"
-}, U = {
+}, H = {
 	header: "In queue",
 	cancelAria: "Remove from queue",
 	queuedLabel: "Queued",
 	runningLabel: "Running"
-}, W = { header: "Try" }, G = { pending: "Thinking…" }, K = {
-	prompt: V,
-	conversation: H,
-	queue: U,
-	suggestions: W,
-	message: G,
+}, U = { header: "Try" }, W = { pending: "Thinking…" }, G = {
+	prompt: B,
+	conversation: V,
+	queue: H,
+	suggestions: U,
+	message: W,
 	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 q({ attachments: e, onRemove: t, onOpen: r, className: i }) {
-	return e.length === 0 ? null : /* @__PURE__ */ N(s, {
+function K({ attachments: e, onRemove: t, onOpen: r, className: i, strings: a }) {
+	return e.length === 0 ? null : /* @__PURE__ */ P(s, {
 		direction: "horizontal",
 		gap: "sm",
 		className: n("ai-chat-attachments-strip--component", i),
-		children: e.map((e) => /* @__PURE__ */ N(x, {
+		children: e.map((e) => /* @__PURE__ */ P(S, {
 			name: e.name,
 			meta: e.meta,
 			kind: e.kind,
@@ -59,66 +59,84 @@ function q({ attachments: e, onRemove: t, onOpen: r, className: i }) {
 			progress: e.progress,
 			errored: e.errored,
 			onOpen: r ? () => r(e) : void 0,
-			onRemove: t ? () => t(e.id) : void 0
+			onRemove: t ? () => t(e.id) : void 0,
+			strings: a
 		}, e.id))
 	});
 }
-q.displayName = "AiChatAttachmentsStrip";
+K.displayName = "AiChatAttachmentsStrip";
 //#endregion
 //#region src/components/features/ai-chat/hooks/use-ai-chat-scroll.ts
-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"
+function q(e, t) {
+	if (e) return e;
+	for (let e = t?.parentElement ?? null; e && e !== document.body && e !== document.documentElement; e = e.parentElement) {
+		let t = window.getComputedStyle(e).overflowY;
+		if (t === "auto" || t === "scroll") return e;
+	}
+	return null;
+}
+function ie({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {}) {
+	let r = j(null), i = j(null), a = j(!0), [o, s] = M(!0), c = O((e = "smooth") => {
+		let t = q(r.current, i.current);
+		t?.scrollTo({
+			top: t.scrollHeight,
+			behavior: e
 		});
-	}, []);
-	return k(() => {
-		let t = r.current;
+	}, []), l = O(() => {
+		let t = q(r.current, i.current);
 		if (!t) return;
-		let n = () => {
-			let n = t.scrollHeight - t.clientHeight - t.scrollTop;
-			o(n <= e);
-		};
-		return n(), t.addEventListener("scroll", n, { passive: !0 }), () => t.removeEventListener("scroll", n);
-	}, [e]), k(() => {
-		if (n || !a) return;
-		let e = window.requestAnimationFrame(() => s("auto"));
+		let n = t.scrollHeight - t.clientHeight - t.scrollTop;
+		a.current = n <= e, s(a.current);
+	}, [e]);
+	return k(() => {
+		let e = q(r.current, i.current);
+		if (e) return e.addEventListener("scroll", l, { passive: !0 }), () => e.removeEventListener("scroll", l);
+	}, [l]), k(() => {
+		let e = window.requestAnimationFrame(() => {
+			let e = q(r.current, i.current);
+			e && e.scrollHeight - e.clientHeight > e.scrollTop && !n && a.current && c("auto"), l();
+		});
 		return () => window.cancelAnimationFrame(e);
-	}, [t, n]), {
+	}, [
+		t,
+		n,
+		l,
+		c
+	]), {
 		containerRef: r,
 		endRef: i,
-		isAtBottom: a,
-		scrollToBottom: s
+		isAtBottom: o,
+		scrollToBottom: c
 	};
 }
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-conversation.tsx
-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__ */ P("div", {
-		className: n("ai-chat-conversation--component relative flex h-full min-h-0 flex-col", f),
-		children: [/* @__PURE__ */ P("div", {
-			ref: h,
+function J({ messages: e, renderMessage: i, intro: c, footer: u, empty: d, disableAutoScroll: f, className: m, strings: h }) {
+	let g = t(V, h), { containerRef: _, endRef: v, isAtBottom: y, scrollToBottom: b } = ie({
+		dependency: e,
+		disableAutoScroll: f
+	}), x = e.length === 0 && !c;
+	return /* @__PURE__ */ F("div", {
+		className: n("ai-chat-conversation--component relative flex h-full min-h-0 flex-col", m),
+		children: [/* @__PURE__ */ F("div", {
+			ref: _,
+			role: "region",
 			tabIndex: 0,
-			"aria-label": m.transcriptAria,
-			className: `flex-1 overflow-y-auto p-surface focus-visible:outline-none ${o.inset}`,
+			"aria-label": g.transcriptAria,
+			className: `flex-1 overflow-y-auto p-surface focus-visible:outline-none ${a.inset}`,
 			children: [
-				!!c && /* @__PURE__ */ N("div", {
+				!!c && /* @__PURE__ */ P("div", {
 					className: "mb-space-xl",
 					children: c
 				}),
-				y ? u ?? /* @__PURE__ */ N("div", {
-					className: "flex h-full items-center justify-center p-surface-lg",
-					children: /* @__PURE__ */ N(i, {
-						type: "secondary",
-						children: m.empty
-					})
-				}) : /* @__PURE__ */ N(s, {
-					render: /* @__PURE__ */ N("ol", {}),
+				x ? d ?? /* @__PURE__ */ P(p, {
+					title: g.empty,
+					description: !1,
+					ariaLabel: g.empty,
+					padding: "lg",
+					className: "h-full"
+				}) : /* @__PURE__ */ P(s, {
+					render: /* @__PURE__ */ P("ol", {}),
 					gap: "xl",
 					className: "ai-chat-conversation--messages m-0 list-none p-0 font-sans",
 					children: e.map((t, n) => {
@@ -126,33 +144,35 @@ function J({ messages: e, renderMessage: a, intro: c, footer: l, empty: u, disab
 							isLast: n === e.length - 1,
 							index: n
 						};
-						return /* @__PURE__ */ N("li", { children: a(t, r) }, t.id);
+						return /* @__PURE__ */ P("li", { children: i(t, r) }, t.id);
 					})
 				}),
-				!!l && /* @__PURE__ */ N("div", {
+				!!u && /* @__PURE__ */ P("div", {
 					className: "mt-space-xl",
-					children: l
+					children: u
 				}),
-				/* @__PURE__ */ N("div", {
-					ref: g,
+				/* @__PURE__ */ P("div", {
+					ref: v,
 					"aria-hidden": !0,
 					className: "h-px"
 				})
 			]
-		}), !_ && /* @__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__ */ P(r, {
+		}), !y && /* @__PURE__ */ P("div", {
+			className: n("ai-chat-conversation--jump flex shrink-0 justify-center bg-background px-space-md py-space-sm", l.footer),
+			children: /* @__PURE__ */ F(o, {
 				type: "button",
 				tone: "secondary",
 				buttonStyle: "solid",
-				"aria-label": m.scrollToBottomAria,
-				onClick: () => v("smooth"),
+				"aria-label": g.scrollToBottomAria,
+				onClick: () => {
+					_.current?.focus({ preventScroll: !0 }), b();
+				},
 				className: n("shadow-sm max-sm:size-action-sm max-sm:min-h-0 max-sm:p-0", "border border-border/60"),
-				children: [/* @__PURE__ */ N(F, { className: "size-icon-md" }), /* @__PURE__ */ N(i, {
+				children: [/* @__PURE__ */ P(I, { className: "size-icon-md" }), /* @__PURE__ */ P(r, {
 					tag: "span",
 					size: "pxs",
 					className: "max-sm:sr-only",
-					children: m.scrollToBottom
+					children: g.scrollToBottom
 				})]
 			})
 		})]
@@ -161,24 +181,24 @@ function J({ messages: e, renderMessage: a, 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 = z, below: i, className: a }) {
-	let o = /* @__PURE__ */ N(r, {
+function Y({ title: e = G.emptyTitle, description: t, icon: r = te, below: i, className: a }) {
+	let o = /* @__PURE__ */ P(r, {
 		className: "size-icon",
 		"aria-hidden": "true"
 	});
-	return /* @__PURE__ */ P(s, {
+	return /* @__PURE__ */ F(s, {
 		gap: "md",
 		align: "center",
 		justify: "center",
 		className: n("ai-chat-empty-state--component min-h-full text-center", a),
-		children: [/* @__PURE__ */ N(f, {
+		children: [/* @__PURE__ */ P(p, {
 			title: e,
 			description: t ?? !1,
 			media: o,
 			mediaVariant: "icon",
 			padding: "md",
 			className: "w-full"
-		}), !!i && /* @__PURE__ */ N("div", {
+		}), !!i && /* @__PURE__ */ P("div", {
 			className: "w-full max-w-2xl",
 			children: i
 		})]
@@ -188,40 +208,42 @@ 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(G, c), u = e.role === "user" ? "end" : "start", d = [], f = [];
+	let l = t(W, 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, {
+	let p = d.map((e) => e.type === "text" ? e.plain ?? oe(e.content) : "").filter(Boolean).join("\n") || void 0, v = e.pending ? /* @__PURE__ */ P(D, { children: l.pending }) : d.length === 0 && f.length > 0 ? null : /* @__PURE__ */ P(s, {
 		gap: "md",
-		children: d.map((e, t) => e.type === "text" ? /* @__PURE__ */ N("div", {
+		children: d.map((e, t) => e.type === "text" ? /* @__PURE__ */ P("div", {
 			className: "whitespace-pre-wrap",
 			children: e.content
 		}, t) : null)
-	}), y = v !== null || e.pending, b = y && (e.avatar == null || h(e.avatar)), x = b ? m[u] : "col-start-1";
-	return /* @__PURE__ */ P(s, {
+	}), y = v !== null || e.pending, b = y && (e.avatar == null || g(e.avatar)), x = b ? h[u] : "col-start-1";
+	return /* @__PURE__ */ F(s, {
 		gap: "md",
-		className: n("ai-chat-message--component grid min-w-0", b ? p[u] : "grid-cols-1", o),
+		className: n("ai-chat-message--component grid min-w-0", b ? m[u] : "grid-cols-1", o),
 		children: [
-			y && /* @__PURE__ */ N(g, {
+			y && /* @__PURE__ */ P(_, {
 				role: e.role,
 				avatar: e.avatar,
 				authorName: e.authorName,
 				timestamp: e.timestamp,
-				plainText: _,
+				plainText: p,
 				loading: e.loading,
 				className: "col-span-full grid-cols-subgrid",
-				onCopy: _ ? r ?? (() => void 0) : void 0,
+				onCopy: p ? r ?? (() => void 0) : void 0,
 				onRegenerate: i,
+				strings: l.bubble,
 				children: v
 			}),
-			f.length > 0 && /* @__PURE__ */ N(s, {
+			f.length > 0 && /* @__PURE__ */ P(s, {
 				gap: "md",
 				className: n("ai-chat-message--parts min-w-0", x),
-				children: f.map((e, t) => /* @__PURE__ */ N(ne, {
+				children: f.map((e, t) => /* @__PURE__ */ P(ae, {
 					part: e,
-					onAttachmentOpen: a
+					onAttachmentOpen: a,
+					strings: l
 				}, t))
 			}),
-			!!e.trailing && /* @__PURE__ */ N("div", {
+			!!e.trailing && /* @__PURE__ */ P("div", {
 				className: n("ai-chat-message--trailing min-w-0", x),
 				children: e.trailing
 			})
@@ -229,19 +251,21 @@ function X({ message: e, onCopy: r, onRegenerate: i, onAttachmentOpen: a, classN
 	});
 }
 X.displayName = "AiChatMessage";
-function ne({ part: e, onAttachmentOpen: t }) {
+function ae({ part: e, onAttachmentOpen: t, strings: n }) {
 	switch (e.type) {
-		case "text": return /* @__PURE__ */ N(i, { children: e.content });
-		case "reasoning": return /* @__PURE__ */ N(T, {
+		case "text": return /* @__PURE__ */ P(r, { children: e.content });
+		case "reasoning": return /* @__PURE__ */ P(T, {
 			streaming: e.streaming,
 			durationSeconds: e.durationSeconds,
+			strings: n.reasoning,
 			children: e.content
 		});
-		case "chain-of-thought": return /* @__PURE__ */ N(v, {
+		case "chain-of-thought": return /* @__PURE__ */ P(y, {
 			steps: e.steps,
-			streaming: e.streaming
+			streaming: e.streaming,
+			strings: n.chainOfThought
 		});
-		case "tool": return /* @__PURE__ */ N(y, {
+		case "tool": return /* @__PURE__ */ P(b, {
 			name: e.name,
 			status: e.status,
 			icon: e.icon,
@@ -249,26 +273,33 @@ function ne({ part: e, onAttachmentOpen: t }) {
 			result: e.result,
 			error: e.error,
 			durationMs: e.durationMs,
-			defaultExpanded: e.defaultExpanded
+			defaultExpanded: e.defaultExpanded,
+			strings: n.toolCall
 		});
-		case "code": return /* @__PURE__ */ N(_, {
+		case "code": return /* @__PURE__ */ P(v, {
 			code: e.code,
 			language: e.language,
 			filename: e.filename,
 			showLineNumbers: e.showLineNumbers,
-			highlightLines: e.highlightLines
+			highlightLines: e.highlightLines,
+			strings: n.codeBlock
 		});
-		case "attachments": return /* @__PURE__ */ N(q, {
+		case "attachments": return /* @__PURE__ */ P(K, {
 			attachments: e.items,
-			onOpen: t ? (e) => t(e.id) : void 0
+			onOpen: t ? (e) => t(e.id) : void 0,
+			strings: n.attachment
 		});
-		case "sources": return /* @__PURE__ */ N(S, {
+		case "sources": return /* @__PURE__ */ P(C, {
 			sources: e.items,
 			variant: e.variant,
-			defaultExpanded: e.defaultExpanded
+			defaultExpanded: e.defaultExpanded,
+			strings: n.sources
+		});
+		case "task": return /* @__PURE__ */ P(w, {
+			task: e.task,
+			strings: n.task
 		});
-		case "task": return /* @__PURE__ */ N(w, { task: e.task });
-		case "artifact": return /* @__PURE__ */ N(E, {
+		case "artifact": return /* @__PURE__ */ P(E, {
 			title: e.title,
 			subtitle: e.subtitle,
 			icon: e.icon,
@@ -276,70 +307,76 @@ function ne({ part: e, onAttachmentOpen: t }) {
 			actions: e.actions,
 			onOpen: e.onOpen,
 			onDownload: e.onDownload,
+			strings: n.artifact,
 			children: e.body
 		});
-		case "confirmation": return /* @__PURE__ */ N(b, {
+		case "confirmation": return /* @__PURE__ */ P(x, {
 			title: e.title,
 			description: e.description,
 			tone: e.tone,
 			status: e.status,
 			details: e.details,
+			icon: e.icon,
 			onApprove: e.onApprove,
-			onReject: e.onReject
+			onReject: e.onReject,
+			approveLabel: e.approveLabel,
+			rejectLabel: e.rejectLabel,
+			strings: n.confirmation
 		});
-		case "custom": return /* @__PURE__ */ N(M, { children: e.render() });
+		case "custom": return /* @__PURE__ */ P(N, { children: e.render() });
 		default: return null;
 	}
 }
-function re(e) {
-	return typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(re).join("") : "";
+function oe(e) {
+	return typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(oe).join("") : "";
 }
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-prompt-input.tsx
-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(() => {
+function Z({ value: i, onValueChange: a, onSubmit: s, onStop: c, streaming: u = !1, disabled: p = !1, attachments: m = [], onRemoveAttachment: h, onAttach: g, showAttach: _, leadingActions: v, trailingActions: y, hideHint: b = !1, minRows: x = 1, maxRows: S = 8, autoFocus: C = !1, submitKeyLabel: ee = "↩", className: w, strings: T }) {
+	let E = t(B, T), D = j(null), k = !u && !p && (i.trim().length > 0 || m.length > 0), A = O(() => {
 		k && s?.({
-			text: a,
-			attachments: p
+			text: i,
+			attachments: m
 		});
 	}, [
 		k,
 		s,
-		a,
-		p
+		i,
+		m
 	]), 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),
+		e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing && (e.preventDefault(), A());
+	}, [A]), N = _ ?? !!g;
+	return /* @__PURE__ */ F("div", {
+		inert: p || 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", d.groupFocus, d.groupInvalid, p && "opacity-50 pointer-events-none", w),
 		children: [
-			p.length > 0 && /* @__PURE__ */ N("div", {
-				className: "border-b border-border/60 p-surface-xs",
-				children: /* @__PURE__ */ N(q, {
-					attachments: p,
-					onRemove: m
+			m.length > 0 && /* @__PURE__ */ P("div", {
+				className: n("p-surface-xs", l.header),
+				children: /* @__PURE__ */ P(K, {
+					attachments: m,
+					onRemove: h,
+					strings: E.attachment
 				})
 			}),
-			/* @__PURE__ */ N(d, {
+			/* @__PURE__ */ P(f, {
 				ref: D,
-				value: a,
-				onChange: (e) => o(e.target.value),
+				value: i,
+				onChange: (e) => a(e.target.value),
 				onKeyDown: M,
 				placeholder: E.placeholder,
 				autoResize: !0,
-				minRows: b,
-				maxRows: x,
-				autoFocus: S,
-				disabled: f,
+				minRows: x,
+				maxRows: S,
+				autoFocus: C,
+				disabled: p,
 				"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__ */ P("div", {
-				className: "flex items-center gap-space-xs border-t border-border/60 px-surface-xs py-space-sm",
+			/* @__PURE__ */ F("div", {
+				className: n("flex items-center gap-space-xs px-surface-xs py-space-sm", l.footer),
 				children: [
-					_,
-					F && /* @__PURE__ */ N(r, {
+					v,
+					N && /* @__PURE__ */ P(o, {
 						type: "button",
 						tone: "secondary",
 						buttonStyle: "ghost",
@@ -347,13 +384,13 @@ function Z({ value: a, onValueChange: o, onSubmit: s, onStop: c, streaming: l =
 						iconOnly: !0,
 						"aria-label": E.attachAria,
 						className: "disabled:opacity-100",
-						onClick: h,
-						disabled: f,
-						children: /* @__PURE__ */ N(R, { className: "size-icon" })
+						onClick: g,
+						disabled: p,
+						children: /* @__PURE__ */ P(z, { className: "size-icon" })
 					}),
-					/* @__PURE__ */ P("div", {
+					/* @__PURE__ */ F("div", {
 						className: "ml-auto flex items-center gap-space-xs",
-						children: [v, l ? /* @__PURE__ */ N(r, {
+						children: [y, u && c ? /* @__PURE__ */ P(o, {
 							type: "button",
 							tone: "secondary",
 							buttonStyle: "solid",
@@ -362,30 +399,30 @@ function Z({ value: a, onValueChange: o, onSubmit: s, onStop: c, streaming: l =
 							"aria-label": E.stopAria,
 							className: "disabled:opacity-100",
 							onClick: c,
-							disabled: f,
-							children: /* @__PURE__ */ N(B, { className: "size-icon-md fill-current" })
-						}) : /* @__PURE__ */ N(r, {
+							disabled: p,
+							children: /* @__PURE__ */ P(ne, { className: "size-icon-md fill-current" })
+						}) : /* @__PURE__ */ P(o, {
 							type: "button",
 							tone: "primary",
 							buttonStyle: "solid",
 							size: "sm",
 							iconOnly: !0,
 							"aria-label": E.submitAria,
-							className: f ? "disabled:opacity-100" : void 0,
-							onClick: j,
+							className: p ? "disabled:opacity-100" : void 0,
+							onClick: A,
 							disabled: !k,
-							children: /* @__PURE__ */ N(I, { className: "size-icon" })
+							children: /* @__PURE__ */ P(L, { className: "size-icon" })
 						})]
 					})
 				]
 			}),
-			!y && /* @__PURE__ */ N("div", {
+			!b && /* @__PURE__ */ P("div", {
 				className: "px-surface-xs pb-surface-xs",
-				children: /* @__PURE__ */ N(i, {
+				children: /* @__PURE__ */ P(r, {
 					size: "xs",
 					type: "discrete",
 					children: e(E.hint, {
-						submitKey: C,
+						submitKey: ee,
 						newlineKey: "⇧↩"
 					})
 				})
@@ -396,52 +433,56 @@ function Z({ value: a, onValueChange: o, onSubmit: s, onStop: c, streaming: l =
 Z.displayName = "AiChatPromptInput";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-queue.tsx
-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, {
+function Q({ items: e, hideHeader: a = !1, onCancel: l, disabled: d = !1, className: f, strings: p }) {
+	let m = t(H, p), h = A();
+	return e.length === 0 ? null : /* @__PURE__ */ F(s, {
 		gap: "sm",
-		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: n("ai-chat-queue--component", "rounded-radius border border-border/60 bg-muted/30 p-surface-xs", f),
+		children: [!a && /* @__PURE__ */ F(i, {
 			className: "px-1",
 			children: [
-				p.header,
+				m.header,
 				" · ",
 				e.length
 			]
-		}), /* @__PURE__ */ N(s, {
-			render: /* @__PURE__ */ N("ul", {}),
+		}), /* @__PURE__ */ P(s, {
+			render: /* @__PURE__ */ P("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__ */ P("li", {
+			children: e.map((e, t) => {
+				let i = e.status ?? "queued", a = `${h}-label-${t}`, s = `${h}-cancel-${t}`;
+				return /* @__PURE__ */ F("li", {
 					className: "flex items-center gap-space-md rounded-radius bg-card text-card-foreground px-space-md py-space-sm",
 					children: [
-						t === "running" ? /* @__PURE__ */ N(L, { className: "size-icon-md shrink-0 animate-spin text-primary-accent" }) : /* @__PURE__ */ N("span", {
+						i === "running" ? /* @__PURE__ */ P(R, { className: "size-icon-md shrink-0 animate-spin text-primary-accent" }) : /* @__PURE__ */ P("span", {
 							"aria-hidden": !0,
 							className: "flex size-icon-md shrink-0 items-center justify-center",
-							children: /* @__PURE__ */ N("span", { className: n(c.marker, "bg-muted-foreground") })
+							children: /* @__PURE__ */ P("span", { className: n(c.marker, "bg-muted-foreground") })
 						}),
-						/* @__PURE__ */ N(i, {
+						/* @__PURE__ */ P(r, {
+							id: a,
 							type: "inherit",
 							className: "flex-1 truncate",
 							children: e.label
 						}),
-						/* @__PURE__ */ N(l, {
-							tone: t === "running" ? "info" : "secondary",
-							children: t === "running" ? p.runningLabel : p.queuedLabel
+						/* @__PURE__ */ P(u, {
+							tone: i === "running" ? "info" : "secondary",
+							children: i === "running" ? m.runningLabel : m.queuedLabel
 						}),
-						(!!e.onCancel || !!u) && /* @__PURE__ */ N(r, {
+						(!!e.onCancel || !!l) && /* @__PURE__ */ P(o, {
 							type: "button",
 							tone: "secondary",
 							buttonStyle: "ghost",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": p.cancelAria,
+							id: s,
+							"aria-label": m.cancelAria,
+							"aria-labelledby": `${s} ${a}`,
+							disabled: d,
 							onClick: () => {
-								e.onCancel?.(), u?.(e.id);
+								e.onCancel?.(), l?.(e.id);
 							},
-							children: /* @__PURE__ */ N(ee, { className: "size-icon-md" })
+							children: /* @__PURE__ */ P(re, { className: "size-icon-md" })
 						})
 					]
 				}, e.id);
@@ -452,25 +493,26 @@ function Q({ items: e, hideHeader: o = !1, onCancel: u, className: d, strings: f
 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(W, l);
-	return e.length === 0 ? null : /* @__PURE__ */ P("div", {
-		className: n("ai-chat-suggestions-row--component flex items-start gap-space-md", c),
-		children: [!s && /* @__PURE__ */ N(a, {
+function $({ suggestions: e, onPick: a, disabled: s = !1, hideHeader: c = !1, className: l, strings: u }) {
+	let d = t(U, u);
+	return e.length === 0 ? null : /* @__PURE__ */ F("div", {
+		className: n("ai-chat-suggestions-row--component flex items-start gap-space-md", l),
+		children: [!c && /* @__PURE__ */ P(i, {
 			className: "flex min-h-action-sm shrink-0 items-center",
-			children: u.header
-		}), /* @__PURE__ */ N("div", {
+			children: d.header
+		}), /* @__PURE__ */ P("div", {
 			className: "ai-chat-suggestions-row--chips flex min-w-0 flex-1 flex-wrap items-center gap-space-sm",
 			children: e.map((e) => {
 				let t = e.icon;
-				return /* @__PURE__ */ P(r, {
+				return /* @__PURE__ */ F(o, {
 					type: "button",
 					tone: "secondary",
 					buttonStyle: "outline",
 					size: "sm",
-					onClick: () => o?.(e),
+					onClick: () => a?.(e),
+					disabled: s,
 					className: "shrink-0 gap-space-sm",
-					children: [!!t && /* @__PURE__ */ N(t, { className: "size-icon-sm text-muted-foreground" }), /* @__PURE__ */ N(i, {
+					children: [!!t && /* @__PURE__ */ P(t, { className: "size-icon-sm text-muted-foreground" }), /* @__PURE__ */ P(r, {
 						tag: "span",
 						weight: "medium",
 						lineHeight: "tight",
@@ -484,99 +526,102 @@ function $({ suggestions: e, onPick: o, hideHeader: s = !1, className: c, string
 $.displayName = "AiChatSuggestionsRow";
 //#endregion
 //#region src/components/features/ai-chat/ai-chat.tsx
-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, {
+function se({ messages: e, inputValue: r, onInputChange: i, onSubmit: a, onStop: o, streaming: c = !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: C, disableAutoScroll: w, slots: T, strings: E, className: D }) {
+	let k = t(G, E), [, A] = M(0), j = O((e, t) => T?.renderMessage ? T.renderMessage(e, t) : /* @__PURE__ */ P(X, {
 		className: "ai-chat-message--component",
 		message: e,
-		strings: A.message,
+		strings: k.message,
 		onCopy: x ? () => x(e) : void 0,
 		onRegenerate: S ? () => S(e) : void 0,
-		onAttachmentOpen: w ? (t) => w(e.id, t) : void 0
+		onAttachmentOpen: C ? (t) => C(e.id, t) : void 0
 	}), [
-		w,
+		C,
 		x,
 		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, {
+		T,
+		k.message
+	]), N = T?.header ?? (h ? /* @__PURE__ */ P("div", {
+		className: n("bg-card text-card-foreground p-surface", l.header),
+		children: /* @__PURE__ */ F(s, {
 			direction: "horizontal",
 			align: "center",
 			gap: "lg",
-			children: [/* @__PURE__ */ N(C, {
+			children: [/* @__PURE__ */ P(ee, {
 				name: h.name,
 				icon: h.icon,
 				avatar: h.avatar,
 				subtitle: h.subtitle,
 				tone: h.tone,
 				status: h.status,
-				variant: "inline"
-			}), !!g && /* @__PURE__ */ N("div", {
+				variant: "inline",
+				strings: k.agent
+			}), !!g && /* @__PURE__ */ P("div", {
 				className: "ml-auto flex items-center gap-space-xs",
 				children: g
 			})]
 		})
-	}) : 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, {
+	}) : null), I = T?.empty ?? (e.length === 0 ? /* @__PURE__ */ P(Y, {
+		title: k.emptyTitle,
+		description: k.emptyDescription
+	}) : null), L = T?.queue ?? (_.length > 0 ? /* @__PURE__ */ P(Q, {
 		items: _,
 		onCancel: v,
-		strings: A.queue
-	}) : null), z = E?.suggestions ?? (y.length > 0 ? /* @__PURE__ */ N($, {
+		disabled: u,
+		strings: k.queue
+	}) : null), R = T?.suggestions ?? (y.length > 0 ? /* @__PURE__ */ P($, {
 		suggestions: y,
 		onPick: b,
-		strings: A.suggestions
-	}) : null), B = E?.input ?? /* @__PURE__ */ N(Z, {
+		disabled: u,
+		strings: k.suggestions
+	}) : null), z = T?.input ?? /* @__PURE__ */ P(Z, {
 		value: r,
-		onValueChange: a,
+		onValueChange: i,
 		onSubmit: (e) => {
-			o?.(e), M((e) => e + 1);
+			a?.(e), A((e) => e + 1);
 		},
-		onStop: c,
-		streaming: l,
+		onStop: o,
+		streaming: c,
 		disabled: u,
 		attachments: d,
 		onRemoveAttachment: f,
 		onAttach: p,
 		showAttach: m,
-		strings: A.prompt
+		strings: k.prompt
 	});
-	return /* @__PURE__ */ P("div", {
-		className: n("ai-chat--component box-border flex h-full flex-col overflow-hidden rounded-surface border border-border bg-background text-foreground", k),
+	return /* @__PURE__ */ F("div", {
+		className: n("ai-chat--component box-border flex h-full flex-col overflow-hidden rounded-surface border border-border bg-background text-foreground", D),
 		children: [
-			I,
-			/* @__PURE__ */ N(J, {
+			N,
+			/* @__PURE__ */ P(J, {
 				messages: e,
-				renderMessage: F,
-				intro: E?.intro,
-				footer: E?.belowMessages,
-				empty: L,
-				disableAutoScroll: T,
-				strings: A.conversation
+				renderMessage: j,
+				intro: T?.intro,
+				footer: T?.belowMessages,
+				empty: I,
+				disableAutoScroll: w,
+				strings: k.conversation
 			}),
-			(R || z || B) && /* @__PURE__ */ N("div", {
-				className: "border-t border-border bg-card text-card-foreground p-surface",
-				children: /* @__PURE__ */ P(s, {
+			(L || R || z) && /* @__PURE__ */ P("div", {
+				className: n("bg-card text-card-foreground p-surface", l.footer),
+				children: /* @__PURE__ */ F(s, {
 					gap: "md",
 					children: [
+						L,
 						R,
-						z,
-						B
+						z
 					]
 				})
 			}),
-			u && /* @__PURE__ */ N(i, {
+			/* @__PURE__ */ P("div", {
 				className: "sr-only",
 				"aria-live": "polite",
-				children: A.disabledAnnouncement
+				children: u ? k.disabledAnnouncement : null
 			})
 		]
 	});
 }
-ie.displayName = "AiChat";
+se.displayName = "AiChat";
 //#endregion
-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 };
+export { se 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, ie as useAiChatScroll };
 
 //# sourceMappingURL=ai-chat.js.map