@tomny-dev/uzi 0.7.1 → 0.8.0

package/dist/index76.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index76.cjs","names":[],"sources":["../src/components/ai-chat/ai-chat.module.css"],"sourcesContent":[".container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 0;\n  max-height: none;\n  overflow: hidden;\n  position: relative;\n}\n\n.scope {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  padding: 0.75rem 3rem 0.75rem 1rem;\n  background: var(--uzi-surface-1, var(--muted));\n  border-bottom: 1px solid var(--border);\n}\n\n.scopeLabel {\n  font-size: 0.6875rem;\n  font-weight: 650;\n  letter-spacing: 0.04em;\n  text-transform: uppercase;\n  color: var(--muted-foreground);\n}\n\n.scope strong {\n  font-size: 0.875rem;\n}\n\n.scopeHelp {\n  margin: 0;\n  font-size: 0.75rem;\n  color: var(--muted-foreground);\n  line-height: 1.5;\n}\n\n.closeBtn {\n  position: absolute;\n  top: 0.5rem;\n  right: 0.5rem;\n  z-index: 1;\n  display: grid;\n  place-items: center;\n  width: 2rem;\n  height: 2rem;\n  border: 0;\n  border-radius: 50%;\n  background: transparent;\n  color: var(--muted-foreground);\n  cursor: pointer;\n  font-size: 0.875rem;\n}\n\n.closeBtn:hover {\n  background: var(--uzi-surface-2, var(--muted));\n  color: var(--foreground);\n}\n\n.closeBtn:focus-visible,\n.sendButton:focus-visible,\n.errorActions button:focus-visible,\n.historyLimit button:focus-visible {\n  outline: 2px solid var(--primary);\n  outline-offset: 2px;\n}\n\n.thread {\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.viewport {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  overflow-y: auto;\n  overflow-x: hidden;\n  gap: 0.75rem;\n}\n\n.chatToolbar {\n  position: sticky;\n  top: 0;\n  z-index: 1;\n  display: flex;\n  justify-content: flex-end;\n  padding: 0.5rem 1rem;\n  background: var(--uzi-surface-1, var(--background));\n  border-bottom: 1px solid var(--border);\n}\n\n.chatToolbar button {\n  border: 0;\n  border-radius: 0.375rem;\n  padding: 0.35rem 0.5rem;\n  background: transparent;\n  color: var(--muted-foreground);\n  font: inherit;\n  font-size: 0.75rem;\n  cursor: pointer;\n}\n\n.chatToolbar button:hover {\n  color: var(--foreground);\n  background: var(--uzi-surface-2, var(--muted));\n}\n\n.chatToolbar button:focus-visible {\n  outline: 2px solid var(--primary);\n  outline-offset: 2px;\n}\n\n.messageList {\n  display: flex;\n  flex: 1 0 auto;\n  flex-direction: column;\n  gap: 0.75rem;\n  padding: 1rem;\n}\n\n.userMessage,\n.assistantMessage {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  padding: 0.75rem 1rem;\n  border-radius: 0.75rem;\n  color: var(--foreground);\n  overflow-wrap: anywhere;\n}\n\n.userMessage {\n  background: color-mix(in srgb, var(--primary) 10%, transparent);\n  border: 1px solid color-mix(in srgb, var(--primary) 20%, transparent);\n}\n\n.assistantMessage {\n  background: var(--muted);\n  border: 1px solid var(--border);\n}\n\n.textPart {\n  white-space: pre-wrap;\n  line-height: 1.6;\n}\n\n.reasoning,\n.toolPart {\n  border: 1px solid var(--border);\n  border-radius: 0.5rem;\n  padding: 0.5rem 0.75rem;\n  background: var(--uzi-surface-1, transparent);\n}\n\n.reasoningSummary,\n.toolPart summary {\n  cursor: pointer;\n  font-size: 0.75rem;\n  font-weight: 600;\n  color: var(--muted-foreground);\n}\n\n.reasoningText {\n  margin: 0.5rem 0 0;\n  font-size: 0.8125rem;\n  line-height: 1.6;\n  color: var(--muted-foreground);\n  white-space: pre-wrap;\n}\n\n.sources {\n  padding-top: 0.5rem;\n  border-top: 1px solid var(--border);\n}\n\n.sourcesLabel {\n  display: block;\n  font-size: 0.6875rem;\n  font-weight: 650;\n  color: var(--muted-foreground);\n  margin-bottom: 0.25rem;\n}\n\n.sources ul {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n  margin: 0;\n  padding-left: 1.25rem;\n}\n\n.sources li {\n  font-size: 0.75rem;\n  overflow-wrap: anywhere;\n}\n\n.data {\n  padding: 0.5rem;\n  background: var(--uzi-surface-2, var(--muted));\n  border-radius: 0.5rem;\n  overflow-x: auto;\n}\n\n.structuredData {\n  margin: 0;\n  padding: 0.5rem 0;\n  max-width: 100%;\n  overflow-x: auto;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  font-size: 0.75rem;\n  line-height: 1.5;\n}\n\n.footer {\n  position: sticky;\n  bottom: 0;\n  z-index: 1;\n  flex-shrink: 0;\n  background: var(--background);\n  border-top: 1px solid var(--border);\n}\n\n.composerForm {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  align-items: end;\n  gap: 0.75rem;\n  padding: 0.75rem 1rem;\n}\n\n.input {\n  width: 100%;\n  min-height: 2.5rem;\n  padding: 0.5rem 0.75rem;\n  border: 1px solid var(--border);\n  border-radius: 0.5rem;\n  background: var(--background);\n  color: var(--foreground);\n  font: inherit;\n  font-size: 0.875rem;\n  line-height: 1.5;\n  resize: vertical;\n}\n\n.input:focus {\n  outline: none;\n  border-color: var(--primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 30%, transparent);\n}\n\n.input::placeholder {\n  color: var(--muted-foreground);\n}\n\n.input:disabled,\n.sendButton:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.sendButton {\n  min-height: 2.5rem;\n  padding: 0.5rem 0.875rem;\n  border: 1px solid var(--border);\n  border-radius: 0.5rem;\n  background: var(--primary);\n  color: var(--primary-foreground);\n  font: inherit;\n  font-size: 0.875rem;\n  font-weight: 600;\n  cursor: pointer;\n}\n\n.sendButton:not(:disabled):hover {\n  filter: brightness(0.95);\n}\n\n.status {\n  margin: 0;\n  padding: 0.5rem 1rem;\n  text-align: center;\n  font-size: 0.8125rem;\n  color: var(--muted-foreground);\n  font-style: italic;\n}\n\n.error {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  padding: 0.75rem 1rem;\n  border: 1px solid var(--destructive);\n  border-radius: 0.5rem;\n  margin: 0.75rem 1rem;\n  background: color-mix(in srgb, var(--destructive) 10%, transparent);\n}\n\n.error p {\n  margin: 0;\n  color: var(--destructive);\n  font-size: 0.8125rem;\n}\n\n.errorActions {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.errorActions button,\n.historyLimit button {\n  padding: 0.375rem 0.75rem;\n  border: 1px solid var(--border);\n  border-radius: 0.375rem;\n  background: transparent;\n  color: var(--foreground);\n  font: inherit;\n  font-size: 0.75rem;\n  cursor: pointer;\n}\n\n.errorActions button:hover,\n.historyLimit button:hover {\n  background: var(--uzi-surface-2, var(--muted));\n}\n\n.historyLimit {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  align-items: center;\n  padding: 0.75rem 1rem;\n  margin: 0.75rem 1rem;\n  background: var(--uzi-surface-1, var(--muted));\n  border: 1px solid var(--border);\n  border-radius: 0.5rem;\n}\n\n.historyLimit span {\n  font-size: 0.75rem;\n  color: var(--muted-foreground);\n}\n\n.emptyState {\n  display: grid;\n  place-items: center;\n  flex: 1;\n  min-height: 12rem;\n  color: var(--muted-foreground);\n  text-align: center;\n}\n\n.emptyState p {\n  margin: 0;\n  font-size: 0.875rem;\n}\n\n@media (max-width: 640px) {\n  .composerForm {\n    grid-template-columns: minmax(0, 1fr) auto;\n  }\n\n  .errorActions {\n    flex-wrap: wrap;\n  }\n}\n\n/* Optional integration controls use the same Uzi surface and layout tokens. */\n.composerExtras {\n  grid-column: 1 / -1;\n  min-width: 0;\n}\n\n.composerActions {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.approvalActions { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; padding-top: 0.5rem; }\n.approvalActions button, .attachmentList button {\n  background: var(--background); color: var(--foreground); border: 1px solid var(--border);\n  border-radius: 0.375rem; padding: 0.3rem 0.55rem; cursor: pointer;\n}\n.approvalActions button:disabled { opacity: 0.5; cursor: not-allowed; }\n.attachmentError { color: var(--destructive); padding: 0.5rem 1rem; margin: 0; }\n.attachmentList { display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 0.4rem 0; margin: 0; list-style: none; }\n.attachmentList li { display: inline-flex; gap: 0.5rem; align-items: center; font-size: 0.75rem; }\n\n/* Role-aware message layout shared by the default renderer and consumer apps. */\n.messageBubble { width: fit-content; min-width: 0; max-width: 100%; }\n.messageBubble.userMessage { align-self: flex-end; max-width: min(90%, 42rem); }\n.messageBubble.assistantMessage { align-self: flex-start; max-width: 100%; }\n.messageLabel { font-size: 0.6875rem; font-weight: 650; color: var(--muted-foreground); }\n\n/* Shared compact composer: same visual grammar as Betty, without app-owned behavior. */\n.composerSurface {\n  grid-column: 1 / -1;\n  min-width: 0;\n  border: 1px solid var(--border);\n  border-radius: 0.875rem;\n  background: var(--background);\n}\n.composerSurface:focus-within { outline: 2px solid var(--ring); outline-offset: 2px; }\n.composerRow { display: flex; align-items: end; min-width: 0; gap: 0.375rem; padding: 0.375rem; }\n.composerRow .input {\n  display: block; flex: 1; width: 0; min-width: 0; min-height: 2.75rem;\n  max-height: 11rem; padding: 0.625rem 0.25rem; border: 0;\n  background: transparent; resize: none; font-size: 1rem;\n}\n.composerRow .input:focus { outline: none; box-shadow: none; }\n.composerIconButton, .composerRow .sendButton {\n  display: grid; place-items: center; flex-shrink: 0;\n  width: 2.75rem; height: 2.75rem; min-height: 2.75rem;\n  padding: 0; border-radius: 0.625rem; cursor: pointer;\n}\n.composerIconButton {\n  color: var(--foreground); border: 0; background: transparent;\n}\n.composerIconButton:hover:not(:disabled) { background: var(--muted); }\n.composerRow .sendButton { border: 0; background: var(--primary); color: var(--primary-foreground); }\n.composerIconButton:focus-visible, .composerRow .sendButton:focus-visible {\n  outline: 2px solid var(--ring); outline-offset: 2px;\n}\n.composerIconButton:disabled { opacity: 0.5; cursor: not-allowed; }\n.visuallyHidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }\n\n/* Thumbnail treatment matches the Betty attachment shelf. */\n.attachmentList {\n  gap: 0.5rem;\n  padding: 0;\n  align-items: center;\n}\n.attachmentList li {\n  max-width: 100%;\n  position: relative;\n  min-height: 3rem;\n  border-radius: 0.625rem;\n  border: 1px solid var(--border);\n  background: var(--uzi-surface-1, var(--muted));\n  padding: 0.125rem;\n}\n.attachmentThumbnail {\n  width: 3rem;\n  height: 3rem;\n  border-radius: 0.5rem;\n  object-fit: cover;\n}\n.attachmentFilename {\n  max-width: 11rem;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  padding: 0.5rem;\n}\n.attachmentList li button {\n  flex-shrink: 0;\n  border: 0;\n  background: transparent;\n  color: var(--muted-foreground);\n  border-radius: 0.4rem;\n}\n.attachmentList li button:hover { color: var(--foreground); background: var(--muted); }\n"],"mappings":""}

package/dist/index76.js

@@ -0,0 +1,667 @@
+"use client";
+import ai_chat_module_default from "./index75.js";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { AuiConfig, AuiProvider, ThreadPrimitive } from "@assistant-ui/react";
+import { AISDKChat, AssistantChatTransport, useAISDKChat } from "@assistant-ui/ai-sdk";
+//#region src/components/ai-chat/AIChat.tsx
+function isRecord(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function asString(value) {
+	return typeof value === "string" ? value : void 0;
+}
+function safeHttpUrl(value) {
+	const url = asString(value);
+	return url && /^https?:\/\//i.test(url) ? url : void 0;
+}
+function AIChatMessageBubble({ role, label, children, className }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: [
+			ai_chat_module_default.messageBubble,
+			role === "user" ? ai_chat_module_default.userMessage : ai_chat_module_default.assistantMessage,
+			className
+		].filter(Boolean).join(" "),
+		"data-role": role,
+		children: [label && /* @__PURE__ */ jsx("span", {
+			className: ai_chat_module_default.messageLabel,
+			children: label
+		}), children]
+	});
+}
+function DefaultMessageRenderer({ message, renderMessagePart }) {
+	return /* @__PURE__ */ jsx(AIChatMessageBubble, {
+		role: message.role,
+		children: message.parts.map((part, index) => /* @__PURE__ */ jsx("div", { children: isRecord(part) ? renderMessagePart(part, index) : null }, isRecord(part) && typeof part.id === "string" ? part.id : index))
+	});
+}
+function DefaultReasoningRenderer({ children, title = "Reasoning" }) {
+	return /* @__PURE__ */ jsxs("details", {
+		className: ai_chat_module_default.reasoning,
+		children: [/* @__PURE__ */ jsx("summary", {
+			className: ai_chat_module_default.reasoningSummary,
+			children: title
+		}), /* @__PURE__ */ jsx("p", {
+			className: ai_chat_module_default.reasoningText,
+			children
+		})]
+	});
+}
+function DefaultSourceRenderer({ sources, renderSource }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: ai_chat_module_default.sources,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: ai_chat_module_default.sourcesLabel,
+			children: "Sources"
+		}), /* @__PURE__ */ jsx("ul", { children: sources.map((source, index) => /* @__PURE__ */ jsx("li", { children: renderSource(source, index) }, source.id)) })]
+	});
+}
+function DefaultDataRenderer({ data, renderDataItem }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: ai_chat_module_default.data,
+		children: data.map((item, index) => /* @__PURE__ */ jsx("div", { children: renderDataItem(item, index) }, index))
+	});
+}
+function DefaultErrorRenderer({ error, onRetry, onClear }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: ai_chat_module_default.error,
+		role: "alert",
+		children: [/* @__PURE__ */ jsx("p", { children: error.message }), /* @__PURE__ */ jsxs("div", {
+			className: ai_chat_module_default.errorActions,
+			children: [/* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: onRetry,
+				children: "Retry response"
+			}), /* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: onClear,
+				children: "Start new chat"
+			})]
+		})]
+	});
+}
+function renderPart(part, index, components, onToolApproval, pendingApprovalId) {
+	const type = asString(part.type) ?? "";
+	if (type === "step-start") return null;
+	if (type === "text") return /* @__PURE__ */ jsx("span", {
+		className: ai_chat_module_default.textPart,
+		children: asString(part.text) ?? ""
+	});
+	if (type === "reasoning") return /* @__PURE__ */ jsx(components?.ReasoningRenderer ?? DefaultReasoningRenderer, { children: asString(part.text) ?? "" });
+	if (type === "source-url" || type === "source-document") return /* @__PURE__ */ jsx(components?.SourceRenderer ?? DefaultSourceRenderer, {
+		sources: [{
+			id: asString(part.sourceId) ?? asString(part.id) ?? `source-${index}`,
+			title: asString(part.title) ?? asString(part.filename),
+			url: safeHttpUrl(part.url)
+		}],
+		renderSource: (item) => item.url ? /* @__PURE__ */ jsx("a", {
+			href: item.url,
+			target: "_blank",
+			rel: "noopener noreferrer",
+			children: item.title ?? item.url
+		}) : /* @__PURE__ */ jsx("span", { children: item.title ?? item.id })
+	});
+	if (type.startsWith("data-")) return /* @__PURE__ */ jsx(components?.DataRenderer ?? DefaultDataRenderer, {
+		data: [part],
+		renderDataItem: (item) => /* @__PURE__ */ jsx("pre", {
+			className: ai_chat_module_default.structuredData,
+			children: JSON.stringify(item.data ?? item, null, 2)
+		})
+	});
+	if (type.startsWith("tool-") || type === "dynamic-tool") {
+		const name = asString(part.toolName) ?? type.replace(/^tool-/, "");
+		const approval = isRecord(part.approval) ? asString(part.approval.id) : void 0;
+		const approvalId = part.state === "approval-requested" ? approval : void 0;
+		const controlsDisabled = pendingApprovalId !== null && pendingApprovalId !== void 0;
+		const ToolRenderer = components?.ToolRenderer;
+		const props = {
+			part,
+			name,
+			approvalId,
+			approvalPending: controlsDisabled,
+			...approvalId && onToolApproval ? {
+				onApprove: () => {
+					if (!controlsDisabled) onToolApproval(approvalId, true);
+				},
+				onDeny: () => {
+					if (!controlsDisabled) onToolApproval(approvalId, false);
+				}
+			} : {}
+		};
+		if (ToolRenderer) return /* @__PURE__ */ jsx(ToolRenderer, { ...props });
+		return /* @__PURE__ */ jsxs("div", {
+			className: ai_chat_module_default.toolPart,
+			children: [/* @__PURE__ */ jsxs("details", { children: [/* @__PURE__ */ jsx("summary", { children: name }), /* @__PURE__ */ jsx("pre", {
+				className: ai_chat_module_default.structuredData,
+				children: JSON.stringify(part.output ?? part.input ?? part, null, 2)
+			})] }), approvalId && /* @__PURE__ */ jsx("div", {
+				className: ai_chat_module_default.approvalActions,
+				"aria-label": `Approval required for ${name}`,
+				children: props.onApprove && props.onDeny ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("button", {
+					type: "button",
+					disabled: controlsDisabled,
+					onClick: props.onApprove,
+					children: "Approve"
+				}), /* @__PURE__ */ jsx("button", {
+					type: "button",
+					disabled: controlsDisabled,
+					onClick: props.onDeny,
+					children: "Deny"
+				})] }) : /* @__PURE__ */ jsx("span", { children: "Approval required in application" })
+			})]
+		});
+	}
+	if (type === "file" || type === "image") {
+		const url = safeHttpUrl(part.url);
+		return url ? /* @__PURE__ */ jsx("a", {
+			href: url,
+			target: "_blank",
+			rel: "noopener noreferrer",
+			children: asString(part.filename) ?? "View attachment"
+		}) : /* @__PURE__ */ jsx("span", { children: "Attachment" });
+	}
+	return /* @__PURE__ */ jsx("pre", {
+		className: ai_chat_module_default.structuredData,
+		children: JSON.stringify(part, null, 2)
+	});
+}
+var DEFAULT_MESSAGE_LIMIT = 8;
+function AIChat({ api, scope, scopeLabel, fetch: requestFetch, headers, credentials, prepareSendMessagesRequest, sessionKey, messageLimit = DEFAULT_MESSAGE_LIMIT, inputPlaceholder = "Ask a question...", inputAriaLabel = "Message", inputMaxLength = 2e3, components, attachments, history, sendAutomaticallyWhen, onClose, className, style }) {
+	const [session, setSession] = useState(0);
+	const transport = useMemo(() => new AssistantChatTransport({
+		api,
+		...scope ? { body: { scope } } : {},
+		...requestFetch ? { fetch: requestFetch } : {},
+		...headers ? { headers } : {},
+		...credentials ? { credentials } : {},
+		...prepareSendMessagesRequest ? { prepareSendMessagesRequest } : {}
+	}), [
+		api,
+		scope,
+		requestFetch,
+		headers,
+		credentials,
+		prepareSendMessagesRequest
+	]);
+	const config = useMemo(() => AuiConfig({ threads: AISDKChat({
+		transport,
+		...sendAutomaticallyWhen ? { sendAutomaticallyWhen } : {}
+	}) }), [
+		transport,
+		session,
+		sendAutomaticallyWhen
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: [ai_chat_module_default.container, className].filter(Boolean).join(" "),
+		style,
+		children: [
+			scopeLabel && /* @__PURE__ */ jsxs("div", {
+				className: ai_chat_module_default.scope,
+				children: [/* @__PURE__ */ jsx("span", {
+					className: ai_chat_module_default.scopeLabel,
+					children: "Current scope"
+				}), /* @__PURE__ */ jsx("strong", { children: scopeLabel })]
+			}),
+			onClose && /* @__PURE__ */ jsx("button", {
+				className: ai_chat_module_default.closeBtn,
+				type: "button",
+				onClick: onClose,
+				"aria-label": "Close chat",
+				children: "✕"
+			}),
+			/* @__PURE__ */ jsx(AuiProvider, {
+				config,
+				children: /* @__PURE__ */ jsx(ThreadPrimitive.Root, {
+					className: ai_chat_module_default.thread,
+					children: /* @__PURE__ */ jsx(ChatViewport, {
+						messageLimit: Number.isFinite(messageLimit) ? Math.max(1, Math.floor(messageLimit)) : DEFAULT_MESSAGE_LIMIT,
+						inputPlaceholder,
+						inputAriaLabel,
+						inputMaxLength,
+						components,
+						attachmentOptions: attachments,
+						history,
+						onNewChat: () => setSession((previous) => previous + 1)
+					})
+				})
+			}, JSON.stringify([
+				api,
+				scope,
+				sessionKey,
+				session
+			]))
+		]
+	});
+}
+function ChatViewport({ messageLimit, inputPlaceholder, inputAriaLabel, inputMaxLength, components, attachmentOptions, history, onNewChat }) {
+	const chat = useAISDKChat();
+	const [draft, setDraft] = useState("");
+	const [selectedFiles, setSelectedFiles] = useState([]);
+	const [attachmentError, setAttachmentError] = useState(null);
+	const [attachmentPreviews, setAttachmentPreviews] = useState([]);
+	const [hydrated, setHydrated] = useState(!history);
+	const expectedRestoredId = useRef(null);
+	const saveQueue = useRef(Promise.resolve());
+	const [approvalBusy, setApprovalBusy] = useState(false);
+	useEffect(() => {
+		const urls = selectedFiles.map((file) => file.type.startsWith("image/") && typeof URL.createObjectURL === "function" ? URL.createObjectURL(file) : "");
+		setAttachmentPreviews(urls);
+		return () => urls.forEach((url) => {
+			if (url && typeof URL.revokeObjectURL === "function") URL.revokeObjectURL(url);
+		});
+	}, [selectedFiles]);
+	const messages = chat?.messages ?? [];
+	const status = chat?.status ?? "ready";
+	const isBusy = status === "submitted" || status === "streaming";
+	const historyFull = messages.filter((message) => message.role === "user").length >= messageLimit;
+	const reportHistoryError = (operation, error) => {
+		if (history?.onError) history.onError(operation, error);
+		else console.warn(`[Uzi AIChat] History ${operation} failed`);
+	};
+	useEffect(() => {
+		if (!history) return;
+		let active = true;
+		Promise.resolve().then(() => history.load()).then((restored) => {
+			if (!active) return;
+			if (Array.isArray(restored)) {
+				const valid = restored.filter((message) => typeof message?.id === "string" && (message.role === "user" || message.role === "assistant") && Array.isArray(message.parts));
+				expectedRestoredId.current = valid.length ? valid[0].id : null;
+				if (valid.length) chat?.setMessages(valid);
+			}
+			setHydrated(true);
+		}).catch((error) => {
+			if (active) {
+				reportHistoryError("load", error);
+				setHydrated(true);
+			}
+		});
+		return () => {
+			active = false;
+		};
+	}, [chat?.setMessages, history]);
+	useEffect(() => {
+		if (!history || !hydrated || isBusy) return;
+		const snapshot = messages.filter((message) => message.role === "user" || message.role === "assistant").map((message) => ({
+			id: message.id,
+			role: message.role,
+			parts: message.parts,
+			...isRecord(message.metadata) ? { metadata: message.metadata } : {}
+		}));
+		if (expectedRestoredId.current) {
+			if (!snapshot.some((message) => message.id === expectedRestoredId.current)) return;
+			expectedRestoredId.current = null;
+		}
+		saveQueue.current = saveQueue.current.then(() => history.save(snapshot), () => history.save(snapshot)).then(() => {}, (error) => {
+			reportHistoryError("save", error);
+		});
+	}, [
+		history,
+		hydrated,
+		isBusy,
+		messages
+	]);
+	const handleSelectedFiles = (files) => {
+		if (!attachmentOptions) return;
+		const selected = Array.from(files);
+		if (selected.length + selectedFiles.length > (attachmentOptions.maxFiles ?? 3)) {
+			setAttachmentError("Too many attachments.");
+			return;
+		}
+		if (selected.some((file) => file.size > (attachmentOptions.maxBytesPerFile ?? 5 * 1024 * 1024))) {
+			setAttachmentError("An attachment exceeds the size limit.");
+			return;
+		}
+		const allowedTypes = attachmentOptions.accept.split(",").map((item) => item.trim());
+		if (selected.some((file) => !allowedTypes.some((allow) => allow === file.type || allow.endsWith("/*") && file.type.startsWith(allow.slice(0, -1))))) {
+			setAttachmentError("Unsupported attachment type.");
+			return;
+		}
+		setAttachmentError(null);
+		setSelectedFiles((existing) => [...existing, ...selected]);
+	};
+	const handleSubmit = () => {
+		const text = draft.trim();
+		if (!chat || !text && selectedFiles.length === 0 || isBusy || historyFull || chat.error || !hydrated || approvalBusy) return;
+		const files = selectedFiles.length ? new DataTransfer() : null;
+		selectedFiles.forEach((file) => files?.items.add(file));
+		const previousDraft = draft;
+		const previousFiles = selectedFiles;
+		setDraft("");
+		setSelectedFiles([]);
+		setAttachmentError(null);
+		Promise.resolve(chat.sendMessage({
+			text,
+			...files ? { files: files.files } : {}
+		})).catch(() => {
+			setDraft((current) => current || previousDraft);
+			setSelectedFiles((current) => current.length ? current : previousFiles);
+		});
+	};
+	const handleNewChat = () => {
+		(async () => {
+			await chat?.stop();
+			if (history) try {
+				await saveQueue.current;
+				await history.clear();
+			} catch (error) {
+				reportHistoryError("clear", error);
+				return;
+			}
+			onNewChat();
+		})();
+	};
+	const handleRetry = () => {
+		if (!chat || isBusy) return;
+		chat.clearError();
+		chat.regenerate();
+	};
+	return /* @__PURE__ */ jsx(AIChatView, {
+		messages: messages.filter((message) => message.role === "user" || message.role === "assistant").map((message) => ({
+			id: message.id,
+			role: message.role,
+			parts: message.parts,
+			...isRecord(message.metadata) ? { metadata: message.metadata } : {}
+		})),
+		status,
+		error: chat?.error,
+		draft,
+		onDraftChange: setDraft,
+		onSend: handleSubmit,
+		onStop: () => {
+			chat?.stop();
+		},
+		onRetry: handleRetry,
+		onNewChat: handleNewChat,
+		messageLimit,
+		attachments: selectedFiles.map((file, index) => ({
+			name: file.name,
+			size: file.size,
+			...attachmentPreviews[index] ? { previewUrl: attachmentPreviews[index] } : {}
+		})),
+		onSelectAttachments: attachmentOptions ? handleSelectedFiles : void 0,
+		onRemoveAttachment: attachmentOptions ? (index) => setSelectedFiles((files) => files.filter((_, i) => i !== index)) : void 0,
+		attachmentAccept: attachmentOptions?.accept,
+		attachmentError,
+		onToolApproval: chat ? async (id, approved) => {
+			if (approvalBusy) return;
+			setApprovalBusy(true);
+			try {
+				await chat.addToolApprovalResponse({
+					id,
+					approved,
+					...!approved ? { reason: "User denied approval" } : {}
+				});
+			} finally {
+				setApprovalBusy(false);
+			}
+		} : void 0,
+		inputPlaceholder,
+		inputAriaLabel,
+		inputMaxLength,
+		components
+	});
+}
+/**
+* Controlled chat presentation for apps with their own AI SDK/assistant-ui
+* runtime. It does not create providers, transports or chat state. Callbacks
+* are the only way messages/actions leave the view.
+*/
+function AIChatView({ messages, status = "ready", error, draft = "", onDraftChange, onSend, onStop, onRetry, onNewChat, messageLimit, inputPlaceholder = "Ask a question...", inputAriaLabel = "Message", inputMaxLength = 2e3, components, attachments, onSelectAttachments, onRemoveAttachment, attachmentAccept, attachmentError, onToolApproval, toolbarActions, header, composerLeading, composerTrailing, composer, emptyState, className, style }) {
+	const viewportRef = useRef(null);
+	const pinnedToBottom = useRef(true);
+	const fileInputRef = useRef(null);
+	const approvalRef = useRef(null);
+	const [pendingApprovalId, setPendingApprovalId] = useState(null);
+	const [approvalError, setApprovalError] = useState(null);
+	const respondToApproval = async (id, approved) => {
+		if (!onToolApproval || approvalRef.current) return;
+		approvalRef.current = id;
+		setPendingApprovalId(id);
+		setApprovalError(null);
+		try {
+			await onToolApproval(id, approved);
+		} catch {
+			setApprovalError("Could not submit approval. Please try again.");
+		} finally {
+			approvalRef.current = null;
+			setPendingApprovalId(null);
+		}
+	};
+	const isBusy = status === "submitted" || status === "streaming";
+	const limit = messageLimit != null && Number.isFinite(messageLimit) ? Math.max(1, Math.floor(messageLimit)) : null;
+	const historyFull = limit !== null && messages.filter((message) => message.role === "user").length >= limit;
+	const MessageRenderer = components?.MessageRenderer ?? DefaultMessageRenderer;
+	const ErrorRenderer = components?.ErrorRenderer ?? DefaultErrorRenderer;
+	useEffect(() => {
+		const viewport = viewportRef.current;
+		if (viewport && pinnedToBottom.current) viewport.scrollTop = viewport.scrollHeight;
+	});
+	const handleKeyDown = (event) => {
+		if (event.key === "Enter" && !event.shiftKey && !event.nativeEvent.isComposing) {
+			event.preventDefault();
+			if (!isBusy && !historyFull && !error && (draft.trim() || (attachments?.length ?? 0) > 0)) onSend?.();
+		}
+	};
+	const handleFormSubmit = (event) => {
+		event.preventDefault();
+		if (!isBusy && !historyFull && !error && (draft.trim() || (attachments?.length ?? 0) > 0)) onSend?.();
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: [ai_chat_module_default.thread, className].filter(Boolean).join(" "),
+		style,
+		children: [
+			header,
+			/* @__PURE__ */ jsxs("div", {
+				ref: viewportRef,
+				className: ai_chat_module_default.viewport,
+				onScroll: (event) => {
+					const viewport = event.currentTarget;
+					pinnedToBottom.current = viewport.scrollHeight - viewport.scrollTop - viewport.clientHeight < 80;
+				},
+				children: [(messages.length > 0 || toolbarActions) && (onNewChat || toolbarActions) && /* @__PURE__ */ jsxs("div", {
+					className: ai_chat_module_default.chatToolbar,
+					children: [toolbarActions, onNewChat && messages.length > 0 && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: onNewChat,
+						children: "New chat"
+					})]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: ai_chat_module_default.messageList,
+					role: "log",
+					"aria-label": "Chat history",
+					"aria-live": "polite",
+					children: [
+						messages.length === 0 && /* @__PURE__ */ jsx("div", {
+							className: ai_chat_module_default.emptyState,
+							children: emptyState ?? /* @__PURE__ */ jsx("p", { children: "Start a conversation" })
+						}),
+						messages.map((message) => /* @__PURE__ */ jsx(MessageRenderer, {
+							message,
+							renderMessagePart: (part, index) => renderPart(part, index, components, onToolApproval ? respondToApproval : void 0, pendingApprovalId),
+							onToolApproval: onToolApproval ? respondToApproval : void 0
+						}, message.id)),
+						isBusy && /* @__PURE__ */ jsx("p", {
+							className: ai_chat_module_default.status,
+							children: "Thinking..."
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: ai_chat_module_default.footer,
+				children: [
+					approvalError && /* @__PURE__ */ jsx("p", {
+						role: "alert",
+						className: ai_chat_module_default.attachmentError,
+						children: approvalError
+					}),
+					attachmentError && /* @__PURE__ */ jsx("p", {
+						role: "alert",
+						className: ai_chat_module_default.attachmentError,
+						children: attachmentError
+					}),
+					error && (onRetry && onNewChat ? /* @__PURE__ */ jsx(ErrorRenderer, {
+						error,
+						onRetry,
+						onClear: onNewChat
+					}) : /* @__PURE__ */ jsxs("div", {
+						className: ai_chat_module_default.error,
+						role: "alert",
+						children: [/* @__PURE__ */ jsx("p", { children: error.message }), (onRetry || onNewChat) && /* @__PURE__ */ jsxs("div", {
+							className: ai_chat_module_default.errorActions,
+							children: [onRetry && /* @__PURE__ */ jsx("button", {
+								type: "button",
+								onClick: onRetry,
+								children: "Retry response"
+							}), onNewChat && /* @__PURE__ */ jsx("button", {
+								type: "button",
+								onClick: onNewChat,
+								children: "Start new chat"
+							})]
+						})]
+					})),
+					historyFull && !error && !isBusy && onNewChat && /* @__PURE__ */ jsxs("div", {
+						className: ai_chat_module_default.historyLimit,
+						children: [/* @__PURE__ */ jsxs("span", { children: [
+							"This chat has reached its ",
+							limit,
+							"-question limit."
+						] }), /* @__PURE__ */ jsx("button", {
+							type: "button",
+							onClick: onNewChat,
+							children: "Start new chat"
+						})]
+					}),
+					(!historyFull || isBusy) && !error && (composer !== void 0 ? composer : /* @__PURE__ */ jsxs("form", {
+						className: ai_chat_module_default.composerForm,
+						onSubmit: handleFormSubmit,
+						children: [
+							composerLeading && /* @__PURE__ */ jsx("div", {
+								className: ai_chat_module_default.composerExtras,
+								children: composerLeading
+							}),
+							onSelectAttachments && /* @__PURE__ */ jsxs("div", {
+								className: ai_chat_module_default.composerExtras,
+								children: [/* @__PURE__ */ jsx("input", {
+									ref: fileInputRef,
+									className: ai_chat_module_default.visuallyHidden,
+									type: "file",
+									"aria-label": "Add attachments",
+									accept: attachmentAccept,
+									multiple: true,
+									disabled: isBusy,
+									onChange: (event) => {
+										if (event.target.files) onSelectAttachments(event.target.files);
+										event.target.value = "";
+									}
+								}), attachments && attachments.length > 0 && /* @__PURE__ */ jsx("ul", {
+									className: ai_chat_module_default.attachmentList,
+									children: attachments.map((attachment, index) => /* @__PURE__ */ jsxs("li", { children: [attachment.previewUrl ? /* @__PURE__ */ jsx("img", {
+										className: ai_chat_module_default.attachmentThumbnail,
+										src: attachment.previewUrl,
+										alt: attachment.name
+									}) : /* @__PURE__ */ jsx("span", {
+										className: ai_chat_module_default.attachmentFilename,
+										children: attachment.name
+									}), onRemoveAttachment && /* @__PURE__ */ jsx("button", {
+										type: "button",
+										onClick: () => onRemoveAttachment(index),
+										"aria-label": `Remove ${attachment.name}`,
+										title: `Remove ${attachment.name}`,
+										children: "×"
+									})] }, index))
+								})]
+							}),
+							/* @__PURE__ */ jsx("div", {
+								className: ai_chat_module_default.composerSurface,
+								children: /* @__PURE__ */ jsxs("div", {
+									className: ai_chat_module_default.composerRow,
+									children: [
+										onSelectAttachments && /* @__PURE__ */ jsx("button", {
+											type: "button",
+											className: ai_chat_module_default.composerIconButton,
+											"aria-label": "Attach file",
+											title: "Attach file",
+											disabled: isBusy,
+											onClick: () => fileInputRef.current?.click(),
+											children: /* @__PURE__ */ jsx("svg", {
+												width: "20",
+												height: "20",
+												viewBox: "0 0 24 24",
+												fill: "none",
+												stroke: "currentColor",
+												strokeWidth: "1.8",
+												strokeLinecap: "round",
+												strokeLinejoin: "round",
+												"aria-hidden": "true",
+												children: /* @__PURE__ */ jsx("path", { d: "m21 11-8.5 8.5a6 6 0 0 1-8.5-8.5l9-9a4 4 0 0 1 5.7 5.7l-9 9a2 2 0 0 1-2.8-2.8l8.5-8.5" })
+											})
+										}),
+										/* @__PURE__ */ jsx("textarea", {
+											className: ai_chat_module_default.input,
+											"aria-label": inputAriaLabel,
+											rows: 1,
+											value: draft,
+											onChange: (event) => onDraftChange?.(event.target.value),
+											onKeyDown: handleKeyDown,
+											placeholder: inputPlaceholder,
+											maxLength: inputMaxLength,
+											disabled: isBusy || !onSend || !onDraftChange,
+											readOnly: !onDraftChange
+										}),
+										/* @__PURE__ */ jsxs("div", {
+											className: ai_chat_module_default.composerActions,
+											children: [composerTrailing, isBusy ? onStop && /* @__PURE__ */ jsx("button", {
+												type: "button",
+												className: ai_chat_module_default.composerIconButton,
+												onClick: onStop,
+												"aria-label": "Stop response",
+												title: "Stop response",
+												children: /* @__PURE__ */ jsx("svg", {
+													width: "18",
+													height: "18",
+													viewBox: "0 0 24 24",
+													fill: "currentColor",
+													"aria-hidden": "true",
+													children: /* @__PURE__ */ jsx("rect", {
+														x: "5",
+														y: "5",
+														width: "14",
+														height: "14",
+														rx: "2"
+													})
+												})
+											}) : /* @__PURE__ */ jsx("button", {
+												type: "submit",
+												className: ai_chat_module_default.sendButton,
+												"aria-label": "Send message",
+												title: "Send message",
+												disabled: !onSend || !draft.trim() && !attachments?.length,
+												children: /* @__PURE__ */ jsx("svg", {
+													width: "20",
+													height: "20",
+													viewBox: "0 0 24 24",
+													fill: "none",
+													stroke: "currentColor",
+													strokeWidth: "2",
+													strokeLinecap: "round",
+													strokeLinejoin: "round",
+													"aria-hidden": "true",
+													children: /* @__PURE__ */ jsx("path", { d: "M12 19V5m-7 7 7-7 7 7" })
+												})
+											})]
+										})
+									]
+								})
+							})
+						]
+					}))
+				]
+			})
+		]
+	});
+}
+//#endregion
+export { AIChat, AIChatMessageBubble, AIChatView };
+
+//# sourceMappingURL=index76.js.map