themelia-react-ui 1.0.1 → 2.0.0

package/dist/features/ai-chat.js

@@ -1,52 +1,53 @@
 "use client";
 import { interpolateString as e, useStrings as t } from "../lib/strings.js";
-import { t as n } from "../utils-C2EKeIw3.js";
-import { n as r } from "../buttons-Co6GavvM.js";
-import { a as i, r as a } from "../typography-Cv8MT-82.js";
-import { t as o } from "../structure-MvKVq-oL.js";
-import { t as s } from "../badge-BZXZT9wd.js";
-import { d as c } from "../text-inputs-Dh9XGyiS.js";
-import { l } from "../data-display-cWIRdeaf.js";
-import { S as u, _ as d, a as f, b as p, d as m, h, l as g, p as _, r as v, s as y, t as b, y as x } from "../ai-artifact-B5tPpXnS.js";
-import { useCallback as S, useEffect as C, useRef as w, useState as T } from "react";
-import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
-import { ArrowDown as k, ArrowUp as A, Loader2 as j, Paperclip as M, Sparkles as N, Square as P, X as F } from "lucide-react";
+import { t as n } from "../utils-Cospvlj1.js";
+import { a as r, s as i } from "../typography-CAr3dQhX.js";
+import { t as a } from "../button-BS3KDg00.js";
+import { t as o } from "../structure-hzCW-XsV.js";
+import { t as s } from "../badge-0tATj-tW.js";
+import { d as c } from "../text-inputs-BFpku0Qd.js";
+import { l } from "../data-display-3xWQUnMA.js";
+import { c as u, l as d, s as f } from "../message-YfFmbXNP.js";
+import { S as p, _ as m, a as h, b as g, d as _, h as v, l as y, p as b, r as x, s as S, t as C, y as w } from "../ai-artifact-2PQ2fItc.js";
+import { useCallback as T, useEffect as E, useRef as D, useState as O } from "react";
+import { Fragment as k, jsx as A, jsxs as j } from "react/jsx-runtime";
+import { ArrowDown as M, ArrowUp as N, Loader2 as P, Paperclip as F, Sparkles as I, Square as L, X as R } from "lucide-react";
 //#region src/components/features/ai-chat/ai-chat.strings.ts
-var I = {
+var z = {
 	placeholder: "Ask anything…",
 	attachAria: "Attach files",
 	submitAria: "Send message",
 	stopAria: "Stop generating",
 	modelPickerAria: "Choose model",
 	hint: "Press {{submitKey}} to send · {{newlineKey}} for newline"
-}, L = {
+}, B = {
 	transcriptAria: "Conversation messages",
 	empty: "No messages yet.",
 	scrollToBottom: "Jump to latest",
 	scrollToBottomAria: "Scroll to bottom"
-}, R = {
+}, V = {
 	header: "In queue",
 	cancelAria: "Remove from queue",
 	queuedLabel: "Queued",
 	runningLabel: "Running"
-}, z = { header: "Try" }, B = { pending: "Thinking…" }, V = {
-	prompt: I,
-	conversation: L,
-	queue: R,
-	suggestions: z,
-	message: B,
+}, H = { header: "Try" }, U = { pending: "Thinking…" }, W = {
+	prompt: z,
+	conversation: B,
+	queue: V,
+	suggestions: H,
+	message: U,
 	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 H({ attachments: e, onRemove: t, onOpen: r, className: i }) {
-	return e.length === 0 ? null : /* @__PURE__ */ D(o, {
+function G({ attachments: e, onRemove: t, onOpen: r, className: i }) {
+	return e.length === 0 ? null : /* @__PURE__ */ A(o, {
 		direction: "horizontal",
 		gap: "sm",
 		className: n("ai-chat-attachments-strip--component", i),
-		children: e.map((e) => /* @__PURE__ */ D(h, {
+		children: e.map((e) => /* @__PURE__ */ A(v, {
 			name: e.name,
 			meta: e.meta,
 			kind: e.kind,
@@ -59,17 +60,17 @@ function H({ attachments: e, onRemove: t, onOpen: r, className: i }) {
 		}, e.id))
 	});
 }
-H.displayName = "AiChatAttachmentsStrip";
+G.displayName = "AiChatAttachmentsStrip";
 //#endregion
 //#region src/components/features/ai-chat/hooks/use-ai-chat-scroll.ts
-function U({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {}) {
-	let r = w(null), i = w(null), [a, o] = T(!0), s = S((e = "smooth") => {
+function K({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {}) {
+	let r = D(null), i = D(null), [a, o] = O(!0), s = T((e = "smooth") => {
 		i.current?.scrollIntoView({
 			behavior: e,
 			block: "end"
 		});
 	}, []);
-	return C(() => {
+	return E(() => {
 		let t = r.current;
 		if (!t) return;
 		let n = () => {
@@ -77,7 +78,7 @@ function U({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {})
 			o(n <= e);
 		};
 		return n(), t.addEventListener("scroll", n, { passive: !0 }), () => t.removeEventListener("scroll", n);
-	}, [e]), C(() => {
+	}, [e]), E(() => {
 		if (n || !a) return;
 		let e = window.requestAnimationFrame(() => s("auto"));
 		return () => window.cancelAnimationFrame(e);
@@ -90,61 +91,61 @@ function U({ threshold: e = 80, dependency: t, disableAutoScroll: n = !1 } = {})
 }
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-conversation.tsx
-function W({ messages: e, renderMessage: a, intro: s, footer: c, empty: l, disableAutoScroll: u, className: d, strings: f }) {
-	let p = t(L, f), { containerRef: m, endRef: h, isAtBottom: g, scrollToBottom: _ } = U({
+function q({ messages: e, renderMessage: r, intro: s, footer: c, empty: l, disableAutoScroll: u, className: d, strings: f }) {
+	let p = t(B, f), { containerRef: m, endRef: h, isAtBottom: g, scrollToBottom: _ } = K({
 		dependency: e.length,
 		disableAutoScroll: u
 	}), v = e.length === 0 && !s;
-	return /* @__PURE__ */ O("div", {
+	return /* @__PURE__ */ j("div", {
 		className: n("ai-chat-conversation--component relative flex h-full min-h-0 flex-col", d),
-		children: [/* @__PURE__ */ O("div", {
+		children: [/* @__PURE__ */ j("div", {
 			ref: m,
 			tabIndex: 0,
 			"aria-label": p.transcriptAria,
 			className: "flex-1 overflow-y-auto p-surface focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
 			children: [
-				!!s && /* @__PURE__ */ D("div", {
+				!!s && /* @__PURE__ */ A("div", {
 					className: "mb-space-xl",
 					children: s
 				}),
-				v ? l ?? /* @__PURE__ */ D("div", {
+				v ? l ?? /* @__PURE__ */ A("div", {
 					className: "flex h-full items-center justify-center p-surface-lg",
-					children: /* @__PURE__ */ D(i, {
+					children: /* @__PURE__ */ A(i, {
 						type: "secondary",
 						children: p.empty
 					})
-				}) : /* @__PURE__ */ D(o, {
-					render: /* @__PURE__ */ D("ol", {}),
+				}) : /* @__PURE__ */ A(o, {
+					render: /* @__PURE__ */ A("ol", {}),
 					gap: "xl",
-					className: "ai-chat-conversation--messages",
+					className: "ai-chat-conversation--messages m-0 list-none p-0 font-sans",
 					children: e.map((t, n) => {
-						let r = {
+						let i = {
 							isLast: n === e.length - 1,
 							index: n
 						};
-						return /* @__PURE__ */ D("li", { children: a(t, r) }, t.id);
+						return /* @__PURE__ */ A("li", { children: r(t, i) }, t.id);
 					})
 				}),
-				!!c && /* @__PURE__ */ D("div", {
+				!!c && /* @__PURE__ */ A("div", {
 					className: "mt-space-xl",
 					children: c
 				}),
-				/* @__PURE__ */ D("div", {
+				/* @__PURE__ */ A("div", {
 					ref: h,
 					"aria-hidden": !0,
 					className: "h-px"
 				})
 			]
-		}), !g && /* @__PURE__ */ D("div", {
+		}), !g && /* @__PURE__ */ A("div", {
 			className: "ai-chat-conversation--jump flex shrink-0 justify-center border-t border-border/50 bg-background/95 px-space-md py-space-sm",
-			children: /* @__PURE__ */ O(r, {
+			children: /* @__PURE__ */ j(a, {
 				type: "button",
 				tone: "secondary",
 				buttonStyle: "solid",
 				"aria-label": p.scrollToBottomAria,
 				onClick: () => _("smooth"),
-				className: n("rounded-full shadow-sm max-sm:size-action-sm max-sm:p-0", "border border-border/60"),
-				children: [/* @__PURE__ */ D(k, { className: "size-icon-md" }), /* @__PURE__ */ D(i, {
+				className: n("shadow-sm max-sm:size-action-sm max-sm:min-h-0 max-sm:p-0", "border border-border/60"),
+				children: [/* @__PURE__ */ A(M, { className: "size-icon-md" }), /* @__PURE__ */ A(i, {
 					tag: "span",
 					size: "pxs",
 					className: "max-sm:sr-only",
@@ -154,89 +155,90 @@ function W({ messages: e, renderMessage: a, intro: s, footer: c, empty: l, disab
 		})]
 	});
 }
-W.displayName = "AiChatConversation";
+q.displayName = "AiChatConversation";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-empty-state.tsx
-function G({ title: e = "Start a conversation", description: t, icon: r = N, below: i, className: a }) {
-	let s = /* @__PURE__ */ D(r, {
+function J({ title: e = "Start a conversation", description: t, icon: r = I, below: i, className: a }) {
+	let s = /* @__PURE__ */ A(r, {
 		className: "size-icon",
 		"aria-hidden": "true"
 	});
-	return /* @__PURE__ */ O(o, {
+	return /* @__PURE__ */ j(o, {
 		gap: "md",
 		align: "center",
 		justify: "center",
-		className: n("ai-chat-empty-state--component h-full text-center", a),
-		children: [/* @__PURE__ */ D(l, {
+		className: n("ai-chat-empty-state--component min-h-full text-center", a),
+		children: [/* @__PURE__ */ A(l, {
 			title: e,
 			description: t ?? !1,
 			media: s,
 			mediaVariant: "icon",
 			padding: "md",
 			className: "w-full"
-		}), !!i && /* @__PURE__ */ D("div", {
+		}), !!i && /* @__PURE__ */ A("div", {
 			className: "w-full max-w-2xl",
 			children: i
 		})]
 	});
 }
-G.displayName = "AiChatEmptyState";
+J.displayName = "AiChatEmptyState";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-message.tsx
-function K({ message: e, onCopy: r, onRegenerate: i, onAttachmentOpen: a, className: s, strings: c }) {
-	let l = t(B, c), d = [], f = [];
-	for (let t of e.parts) t.type === "text" ? d.push(t) : f.push(t);
-	let p = d.map((e) => e.type === "text" ? e.plain ?? J(e.content) : "").filter(Boolean).join("\n") || void 0, m = e.pending ? /* @__PURE__ */ D(x, { children: l.pending }) : d.length === 0 && f.length > 0 ? null : /* @__PURE__ */ D(o, {
+function Y({ message: e, onCopy: r, onRegenerate: i, onAttachmentOpen: a, className: s, strings: c }) {
+	let l = t(U, c), m = 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 ?? X(e.content) : "").filter(Boolean).join("\n") || void 0, v = e.pending ? /* @__PURE__ */ A(w, { children: l.pending }) : h.length === 0 && g.length > 0 ? null : /* @__PURE__ */ A(o, {
 		gap: "md",
-		children: d.map((e, t) => e.type === "text" ? /* @__PURE__ */ D("div", {
+		children: h.map((e, t) => e.type === "text" ? /* @__PURE__ */ A("div", {
 			className: "whitespace-pre-wrap",
 			children: e.content
 		}, t) : null)
-	});
-	return /* @__PURE__ */ O(o, {
+	}), y = v !== null || e.pending, b = y && (e.avatar == null || f(e.avatar)), x = b ? d[m] : "col-start-1";
+	return /* @__PURE__ */ j(o, {
 		gap: "md",
-		className: n("ai-chat-message--component", s),
+		className: n("ai-chat-message--component grid min-w-0", b ? u[m] : "grid-cols-1", s),
 		children: [
-			(m !== null || e.pending) && /* @__PURE__ */ D(u, {
+			y && /* @__PURE__ */ A(p, {
 				role: e.role,
 				avatar: e.avatar,
 				authorName: e.authorName,
 				timestamp: e.timestamp,
-				plainText: p,
+				plainText: _,
 				loading: e.loading,
-				onCopy: p ? r ?? (() => void 0) : void 0,
+				className: "col-span-full grid-cols-subgrid",
+				onCopy: _ ? r ?? (() => void 0) : void 0,
 				onRegenerate: i,
-				children: m
+				children: v
 			}),
-			f.length > 0 && /* @__PURE__ */ D(o, {
+			g.length > 0 && /* @__PURE__ */ A(o, {
 				gap: "md",
-				className: n(e.role === "user" ? "pr-9 sm:pl-12" : "pl-9 sm:pr-12"),
-				children: f.map((e, t) => /* @__PURE__ */ D(q, {
+				className: n("ai-chat-message--parts min-w-0", x),
+				children: g.map((e, t) => /* @__PURE__ */ A(ee, {
 					part: e,
 					onAttachmentOpen: a
 				}, t))
 			}),
-			!!e.trailing && /* @__PURE__ */ D("div", {
-				className: n(e.role === "user" ? "pr-9 sm:pl-12" : "pl-9 sm:pr-12"),
+			!!e.trailing && /* @__PURE__ */ A("div", {
+				className: n("ai-chat-message--trailing min-w-0", x),
 				children: e.trailing
 			})
 		]
 	});
 }
-K.displayName = "AiChatMessage";
-function q({ part: e, onAttachmentOpen: t }) {
+Y.displayName = "AiChatMessage";
+function ee({ part: e, onAttachmentOpen: t }) {
 	switch (e.type) {
-		case "text": return /* @__PURE__ */ D(i, { children: e.content });
-		case "reasoning": return /* @__PURE__ */ D(y, {
+		case "text": return /* @__PURE__ */ A(i, { children: e.content });
+		case "reasoning": return /* @__PURE__ */ A(S, {
 			streaming: e.streaming,
 			durationSeconds: e.durationSeconds,
 			children: e.content
 		});
-		case "chain-of-thought": return /* @__PURE__ */ D(f, {
+		case "chain-of-thought": return /* @__PURE__ */ A(h, {
 			steps: e.steps,
 			streaming: e.streaming
 		});
-		case "tool": return /* @__PURE__ */ D(p, {
+		case "tool": return /* @__PURE__ */ A(g, {
 			name: e.name,
 			status: e.status,
 			icon: e.icon,
@@ -246,24 +248,24 @@ function q({ part: e, onAttachmentOpen: t }) {
 			durationMs: e.durationMs,
 			defaultExpanded: e.defaultExpanded
 		});
-		case "code": return /* @__PURE__ */ D(d, {
+		case "code": return /* @__PURE__ */ A(m, {
 			code: e.code,
 			language: e.language,
 			filename: e.filename,
 			showLineNumbers: e.showLineNumbers,
 			highlightLines: e.highlightLines
 		});
-		case "attachments": return /* @__PURE__ */ D(H, {
+		case "attachments": return /* @__PURE__ */ A(G, {
 			attachments: e.items,
 			onOpen: t ? (e) => t(e.id) : void 0
 		});
-		case "sources": return /* @__PURE__ */ D(g, {
+		case "sources": return /* @__PURE__ */ A(y, {
 			sources: e.items,
 			variant: e.variant,
 			defaultExpanded: e.defaultExpanded
 		});
-		case "task": return /* @__PURE__ */ D(v, { task: e.task });
-		case "artifact": return /* @__PURE__ */ D(b, {
+		case "task": return /* @__PURE__ */ A(x, { task: e.task });
+		case "artifact": return /* @__PURE__ */ A(C, {
 			title: e.title,
 			subtitle: e.subtitle,
 			icon: e.icon,
@@ -273,7 +275,7 @@ function q({ part: e, onAttachmentOpen: t }) {
 			onDownload: e.onDownload,
 			children: e.body
 		});
-		case "confirmation": return /* @__PURE__ */ D(m, {
+		case "confirmation": return /* @__PURE__ */ A(_, {
 			title: e.title,
 			description: e.description,
 			tone: e.tone,
@@ -282,99 +284,99 @@ function q({ part: e, onAttachmentOpen: t }) {
 			onApprove: e.onApprove,
 			onReject: e.onReject
 		});
-		case "custom": return /* @__PURE__ */ D(E, { children: e.render() });
+		case "custom": return /* @__PURE__ */ A(k, { children: e.render() });
 		default: return null;
 	}
 }
-function J(e) {
-	return typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(J).join("") : "";
+function X(e) {
+	return typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(X).join("") : "";
 }
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-prompt-input.tsx
-function Y({ value: a, onValueChange: o, onSubmit: s, onStop: l, 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: C = "↩", className: T, strings: E }) {
-	let k = t(I, E), j = w(null), N = !u && !d && (a.trim().length > 0 || f.length > 0), F = S(() => {
-		N && s?.({
-			text: a,
+function Z({ value: r, onValueChange: o, onSubmit: s, onStop: l, 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 E = t(z, w), O = D(null), k = !u && !d && (r.trim().length > 0 || f.length > 0), M = T(() => {
+		k && s?.({
+			text: r,
 			attachments: f
 		});
 	}, [
-		N,
+		k,
 		s,
-		a,
+		r,
 		f
-	]), L = S((e) => {
-		e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing && (e.preventDefault(), F());
-	}, [F]), R = h ?? !!m;
-	return /* @__PURE__ */ O("div", {
-		className: n("ai-chat-prompt-input--component", "rounded-radius-lg border border-border bg-card transition-colors duration-150", "focus-within:border-foreground/20 focus-within:ring-2 focus-within:ring-ring/30", d && "opacity-60 pointer-events-none", T),
+	]), P = T((e) => {
+		e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing && (e.preventDefault(), M());
+	}, [M]), I = h ?? !!m;
+	return /* @__PURE__ */ j("div", {
+		className: n("ai-chat-prompt-input--component", "rounded-radius border border-border bg-card transition-colors duration-150", "focus-within:border-foreground/20 focus-within:ring-2 focus-within:ring-ring", d && "opacity-60 pointer-events-none", C),
 		children: [
-			f.length > 0 && /* @__PURE__ */ D("div", {
+			f.length > 0 && /* @__PURE__ */ A("div", {
 				className: "border-b border-border/60 p-surface-xs",
-				children: /* @__PURE__ */ D(H, {
+				children: /* @__PURE__ */ A(G, {
 					attachments: f,
 					onRemove: p
 				})
 			}),
-			/* @__PURE__ */ D(c, {
-				ref: j,
-				value: a,
+			/* @__PURE__ */ A(c, {
+				ref: O,
+				value: r,
 				onChange: (e) => o(e.target.value),
-				onKeyDown: L,
-				placeholder: k.placeholder,
+				onKeyDown: P,
+				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 px-control py-2.5")
+				className: n("!border-0 !bg-transparent !shadow-none focus-visible:!ring-0 resize-none")
 			}),
-			/* @__PURE__ */ O("div", {
+			/* @__PURE__ */ j("div", {
 				className: "flex items-center gap-space-xs border-t border-border/60 px-surface-xs py-space-sm",
 				children: [
 					g,
-					R && /* @__PURE__ */ D(r, {
+					I && /* @__PURE__ */ A(a, {
 						type: "button",
 						tone: "secondary",
 						buttonStyle: "ghost",
 						size: "sm",
 						iconOnly: !0,
-						"aria-label": k.attachAria,
+						"aria-label": E.attachAria,
 						onClick: m,
 						disabled: d,
-						children: /* @__PURE__ */ D(M, { className: "size-icon" })
+						children: /* @__PURE__ */ A(F, { className: "size-icon" })
 					}),
-					/* @__PURE__ */ O("div", {
+					/* @__PURE__ */ j("div", {
 						className: "ml-auto flex items-center gap-space-xs",
-						children: [_, u ? /* @__PURE__ */ D(r, {
+						children: [_, u ? /* @__PURE__ */ A(a, {
 							type: "button",
 							tone: "secondary",
 							buttonStyle: "solid",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": k.stopAria,
+							"aria-label": E.stopAria,
 							onClick: l,
-							children: /* @__PURE__ */ D(P, { className: "size-icon-md fill-current" })
-						}) : /* @__PURE__ */ D(r, {
+							children: /* @__PURE__ */ A(L, { className: "size-icon-md fill-current" })
+						}) : /* @__PURE__ */ A(a, {
 							type: "button",
 							tone: "primary",
 							buttonStyle: "solid",
 							size: "sm",
 							iconOnly: !0,
-							"aria-label": k.submitAria,
-							onClick: F,
-							disabled: !N,
-							children: /* @__PURE__ */ D(A, { className: "size-icon" })
+							"aria-label": E.submitAria,
+							onClick: M,
+							disabled: !k,
+							children: /* @__PURE__ */ A(N, { className: "size-icon" })
 						})]
 					})
 				]
 			}),
-			!v && /* @__PURE__ */ D("div", {
+			!v && /* @__PURE__ */ A("div", {
 				className: "px-surface-xs pb-surface-xs",
-				children: /* @__PURE__ */ D(i, {
+				children: /* @__PURE__ */ A(i, {
 					size: "xs",
 					type: "discrete",
-					children: e(k.hint, {
-						submitKey: C,
+					children: e(E.hint, {
+						submitKey: S,
 						newlineKey: "⇧↩"
 					})
 				})
@@ -382,42 +384,44 @@ function Y({ value: a, onValueChange: o, onSubmit: s, onStop: l, streaming: u =
 		]
 	});
 }
-Y.displayName = "AiChatPromptInput";
+Z.displayName = "AiChatPromptInput";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-queue.tsx
-function X({ items: e, hideHeader: c = !1, onCancel: l, className: u, strings: d }) {
-	let f = t(R, d);
-	return e.length === 0 ? null : /* @__PURE__ */ O("div", {
+function Q({ items: e, hideHeader: c = !1, onCancel: l, className: u, strings: d }) {
+	let f = t(V, d);
+	return e.length === 0 ? null : /* @__PURE__ */ j(o, {
+		gap: "sm",
 		className: n("ai-chat-queue--component", "rounded-radius border border-border/60 bg-muted/20 p-surface-xs", u),
-		children: [!c && /* @__PURE__ */ O(a, {
-			className: "mb-1.5 px-1",
+		children: [!c && /* @__PURE__ */ j(r, {
+			className: "px-1",
 			children: [
 				f.header,
 				" · ",
 				e.length
 			]
-		}), /* @__PURE__ */ D(o, {
-			render: /* @__PURE__ */ D("ul", {}),
+		}), /* @__PURE__ */ A(o, {
+			render: /* @__PURE__ */ A("ul", {}),
 			gap: "xs",
-			className: "ai-chat-queue--list",
+			className: "ai-chat-queue--list m-0 list-none p-0 font-sans",
 			children: e.map((e) => {
 				let t = e.status ?? "queued";
-				return /* @__PURE__ */ O("li", {
-					className: "flex items-center gap-space-md rounded-radius-md bg-card px-space-md py-space-sm",
+				return /* @__PURE__ */ j("li", {
+					className: "flex items-center gap-space-md rounded-inner bg-card px-space-md py-space-sm",
 					children: [
-						t === "running" ? /* @__PURE__ */ D(j, { className: "size-icon-md shrink-0 animate-spin text-primary-accent" }) : /* @__PURE__ */ D("span", {
+						t === "running" ? /* @__PURE__ */ A(P, { className: "size-icon-md shrink-0 animate-spin text-primary-accent" }) : /* @__PURE__ */ A("span", {
 							"aria-hidden": !0,
-							className: "size-2 shrink-0 rounded-full bg-muted-foreground/50"
+							className: "flex size-icon-md shrink-0 items-center justify-center",
+							children: /* @__PURE__ */ A("span", { className: "size-2 rounded-full bg-muted-foreground/50" })
 						}),
-						/* @__PURE__ */ D(i, {
+						/* @__PURE__ */ A(i, {
 							className: "flex-1 truncate",
 							children: e.label
 						}),
-						/* @__PURE__ */ D(s, {
-							tone: t === "running" ? "primary" : "secondary",
+						/* @__PURE__ */ A(s, {
+							tone: t === "running" ? "info" : "secondary",
 							children: t === "running" ? f.runningLabel : f.queuedLabel
 						}),
-						(!!e.onCancel || !!l) && /* @__PURE__ */ D(r, {
+						(!!e.onCancel || !!l) && /* @__PURE__ */ A(a, {
 							type: "button",
 							tone: "secondary",
 							buttonStyle: "ghost",
@@ -427,7 +431,7 @@ function X({ items: e, hideHeader: c = !1, onCancel: l, className: u, strings: d
 							onClick: () => {
 								e.onCancel?.(), l?.(e.id);
 							},
-							children: /* @__PURE__ */ D(F, { className: "size-icon-md" })
+							children: /* @__PURE__ */ A(R, { className: "size-icon-md" })
 						})
 					]
 				}, e.id);
@@ -435,28 +439,28 @@ function X({ items: e, hideHeader: c = !1, onCancel: l, className: u, strings: d
 		})]
 	});
 }
-X.displayName = "AiChatQueue";
+Q.displayName = "AiChatQueue";
 //#endregion
 //#region src/components/features/ai-chat/partials/ai-chat-suggestions-row.tsx
-function Z({ suggestions: e, onPick: o, hideHeader: s = !1, className: c, strings: l }) {
-	let u = t(z, l);
-	return e.length === 0 ? null : /* @__PURE__ */ O("div", {
+function $({ suggestions: e, onPick: o, hideHeader: s = !1, className: c, strings: l }) {
+	let u = t(H, l);
+	return e.length === 0 ? null : /* @__PURE__ */ j("div", {
 		className: n("ai-chat-suggestions-row--component flex items-center gap-space-md", c),
-		children: [!s && /* @__PURE__ */ O("div", {
-			className: "inline-flex shrink-0 items-center gap-space-sm",
-			children: [/* @__PURE__ */ D(N, { className: "size-icon-md text-muted-foreground" }), /* @__PURE__ */ D(a, { children: u.header })]
-		}), /* @__PURE__ */ D("div", {
-			className: "-mx-1 flex flex-1 items-center gap-space-sm overflow-x-auto px-1 py-0.5 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
+		children: [!s && /* @__PURE__ */ A(r, {
+			className: "shrink-0",
+			children: u.header
+		}), /* @__PURE__ */ A("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__ */ O(r, {
+				return /* @__PURE__ */ j(a, {
 					type: "button",
 					tone: "secondary",
 					buttonStyle: "ghost",
 					size: "sm",
 					onClick: () => o?.(e),
-					className: n("h-auto shrink-0 gap-space-sm rounded-full border border-border/60 bg-card px-control-sm py-1", "transition-[border-color,background] duration-150", "hover:border-foreground/20 hover:bg-muted/40"),
-					children: [!!t && /* @__PURE__ */ D(t, { className: "size-icon-sm text-muted-foreground" }), /* @__PURE__ */ D(i, {
+					className: n("shrink-0 gap-space-sm border border-border/60 bg-card", "transition-[border-color,background] duration-150", "hover:border-foreground/20 hover:bg-muted/40"),
+					children: [!!t && /* @__PURE__ */ A(t, { className: "size-icon-sm text-muted-foreground" }), /* @__PURE__ */ A(i, {
 						tag: "span",
 						weight: "medium",
 						children: e.label
@@ -466,30 +470,30 @@ function Z({ suggestions: e, onPick: o, hideHeader: s = !1, className: c, string
 		})]
 	});
 }
-Z.displayName = "AiChatSuggestionsRow";
+$.displayName = "AiChatSuggestionsRow";
 //#endregion
 //#region src/components/features/ai-chat/ai-chat.tsx
-function Q({ messages: e, inputValue: r, onInputChange: a, onSubmit: s, onStop: c, streaming: l = !1, disabled: u = !1, attachments: d = [], onRemoveAttachment: f, onAttach: p, showAttach: m, agent: h, headerActions: g, queue: v = [], onCancelQueueItem: y, suggestions: b = [], onPickSuggestion: x, onMessageCopy: C, onMessageRegenerate: w, onAttachmentOpen: E, disableAutoScroll: k, slots: A, strings: j, className: M }) {
-	let N = t(V, j), [, P] = T(0), F = S((e, t) => A?.renderMessage ? A.renderMessage(e, t) : /* @__PURE__ */ D(K, {
+function te({ messages: e, inputValue: r, onInputChange: a, onSubmit: s, 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: x, onMessageCopy: S, onMessageRegenerate: C, onAttachmentOpen: w, disableAutoScroll: E, slots: D, strings: k, className: M }) {
+	let N = t(W, k), [, P] = O(0), F = T((e, t) => D?.renderMessage ? D.renderMessage(e, t) : /* @__PURE__ */ A(Y, {
 		className: "ai-chat-message--component",
 		message: e,
 		strings: N.message,
-		onCopy: C ? () => C(e) : void 0,
-		onRegenerate: w ? () => w(e) : void 0,
-		onAttachmentOpen: E ? (t) => E(e.id, t) : void 0
+		onCopy: S ? () => S(e) : void 0,
+		onRegenerate: C ? () => C(e) : void 0,
+		onAttachmentOpen: w ? (t) => w(e.id, t) : void 0
 	}), [
-		E,
-		C,
 		w,
-		A,
+		S,
+		C,
+		D,
 		N.message
-	]), I = A?.header ?? (h ? /* @__PURE__ */ D("div", {
+	]), I = D?.header ?? (h ? /* @__PURE__ */ A("div", {
 		className: "border-b border-border bg-card p-surface",
-		children: /* @__PURE__ */ O(o, {
+		children: /* @__PURE__ */ j(o, {
 			direction: "horizontal",
 			align: "center",
 			gap: "lg",
-			children: [/* @__PURE__ */ D(_, {
+			children: [/* @__PURE__ */ A(b, {
 				name: h.name,
 				icon: h.icon,
 				avatar: h.avatar,
@@ -497,23 +501,23 @@ function Q({ messages: e, inputValue: r, onInputChange: a, onSubmit: s, onStop:
 				tone: h.tone,
 				status: h.status,
 				variant: "inline"
-			}), !!g && /* @__PURE__ */ D("div", {
+			}), !!g && /* @__PURE__ */ A("div", {
 				className: "ml-auto flex items-center gap-space-xs",
 				children: g
 			})]
 		})
-	}) : null), L = A?.empty ?? (e.length === 0 ? /* @__PURE__ */ D(G, {
+	}) : null), L = D?.empty ?? (e.length === 0 ? /* @__PURE__ */ A(J, {
 		title: N.emptyTitle,
 		description: N.emptyDescription
-	}) : null), R = A?.queue ?? (v.length > 0 ? /* @__PURE__ */ D(X, {
-		items: v,
-		onCancel: y,
+	}) : null), R = D?.queue ?? (_.length > 0 ? /* @__PURE__ */ A(Q, {
+		items: _,
+		onCancel: v,
 		strings: N.queue
-	}) : null), z = A?.suggestions ?? (b.length > 0 ? /* @__PURE__ */ D(Z, {
-		suggestions: b,
+	}) : null), z = D?.suggestions ?? (y.length > 0 ? /* @__PURE__ */ A($, {
+		suggestions: y,
 		onPick: x,
 		strings: N.suggestions
-	}) : null), B = A?.input ?? /* @__PURE__ */ D(Y, {
+	}) : null), B = D?.input ?? /* @__PURE__ */ A(Z, {
 		value: r,
 		onValueChange: a,
 		onSubmit: (e) => {
@@ -528,22 +532,22 @@ function Q({ messages: e, inputValue: r, onInputChange: a, onSubmit: s, onStop:
 		showAttach: m,
 		strings: N.prompt
 	});
-	return /* @__PURE__ */ O("div", {
-		className: n("ai-chat--component flex h-full flex-col overflow-hidden rounded-radius-lg border border-border bg-background", M),
+	return /* @__PURE__ */ j("div", {
+		className: n("ai-chat--component flex h-full flex-col overflow-hidden rounded-radius border border-border bg-background", M),
 		children: [
 			I,
-			/* @__PURE__ */ D(W, {
+			/* @__PURE__ */ A(q, {
 				messages: e,
 				renderMessage: F,
-				intro: A?.intro,
-				footer: A?.belowMessages,
+				intro: D?.intro,
+				footer: D?.belowMessages,
 				empty: L,
-				disableAutoScroll: k,
+				disableAutoScroll: E,
 				strings: N.conversation
 			}),
-			(R || z || B) && /* @__PURE__ */ D("div", {
+			(R || z || B) && /* @__PURE__ */ A("div", {
 				className: "border-t border-border bg-card/60 p-surface",
-				children: /* @__PURE__ */ O(o, {
+				children: /* @__PURE__ */ j(o, {
 					gap: "md",
 					children: [
 						R,
@@ -552,7 +556,7 @@ function Q({ messages: e, inputValue: r, onInputChange: a, onSubmit: s, onStop:
 					]
 				})
 			}),
-			u && /* @__PURE__ */ D(i, {
+			u && /* @__PURE__ */ A(i, {
 				className: "sr-only",
 				"aria-live": "polite",
 				children: N.disabledAnnouncement
@@ -560,8 +564,8 @@ function Q({ messages: e, inputValue: r, onInputChange: a, onSubmit: s, onStop:
 		]
 	});
 }
-Q.displayName = "AiChat";
+te.displayName = "AiChat";
 //#endregion
-export { Q as AiChat, H as AiChatAttachmentsStrip, W as AiChatConversation, G as AiChatEmptyState, K as AiChatMessageView, Y as AiChatPromptInput, X as AiChatQueue, Z as AiChatSuggestionsRow, L as defaultAiChatConversationStrings, B as defaultAiChatMessageStrings, I as defaultAiChatPromptInputStrings, R as defaultAiChatQueueStrings, V as defaultAiChatStrings, z as defaultAiChatSuggestionsStrings, U as useAiChatScroll };
+export { te as AiChat, G as AiChatAttachmentsStrip, q as AiChatConversation, J as AiChatEmptyState, Y as AiChatMessageView, Z as AiChatPromptInput, Q as AiChatQueue, $ as AiChatSuggestionsRow, B as defaultAiChatConversationStrings, U as defaultAiChatMessageStrings, z as defaultAiChatPromptInputStrings, V as defaultAiChatQueueStrings, W as defaultAiChatStrings, H as defaultAiChatSuggestionsStrings, K as useAiChatScroll };
 
 //# sourceMappingURL=ai-chat.js.map