@parallelworks/ui 0.44.0 → 0.46.0

package/dist/ai/strings.js

@@ -1,11 +1,7 @@
+import { defaultToolStrings } from "./agent/toolStrings.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/ai/strings.tsx
 var defaultChatStrings = {
-	modal: {
-		cancel: "Cancel",
-		save: "Save",
-		loading: "Loading…"
-	},
 	shareConversation: {
 		title: "Share Conversation",
 		loadError: "Failed to load sharing settings",
@@ -17,7 +13,6 @@ var defaultChatStrings = {
 		noGroups: "No groups have access yet",
 		viewOnly: "View only",
 		canCollaborate: "Can collaborate",
-		remove: "Remove",
 		addGroups: "Add groups…",
 		info: /* @__PURE__ */ jsxs(Fragment, { children: [
 			/* @__PURE__ */ jsx("strong", { children: "View" }),
@@ -36,8 +31,7 @@ var defaultChatStrings = {
 		remove: "Remove queued message",
 		waiting: "Queued · sends when this reply finishes",
 		waitingNextStep: "Queued · reaches the agent after its current step",
-		handedOver: "Sent to the running turn",
-		removeShort: "Remove"
+		handedOver: "Sent to the running turn"
 	},
 	providerIssue: {
 		keyRejected: "API key rejected",
@@ -53,12 +47,12 @@ var defaultChatStrings = {
 		search: "Search models…",
 		loading: "Loading models…",
 		failed: "Failed to load models",
-		retry: "Retry",
 		none: "No models available",
 		sharedBy: (owner) => `Shared by ${owner}`,
 		connecting: "Connecting…",
 		notResponding: "Not responding",
-		manageProvider: "Manage provider"
+		manageProvider: "Manage provider",
+		selectFirst: "Select a model first"
 	},
 	allocationPicker: {
 		choose: "Allocation",
@@ -80,8 +74,7 @@ var defaultChatStrings = {
 			session,
 			"” is not reachable"
 		] }),
-		sessionUnreachableBody: "The session may be offline or still starting up. You can select a different model to continue.",
-		retry: "Retry"
+		sessionUnreachableBody: "The session may be offline or still starting up. You can select a different model to continue."
 	},
 	input: {
 		placeholder: "Ask anything",
@@ -90,11 +83,11 @@ var defaultChatStrings = {
 		attachFiles: "Attach files",
 		stopGenerating: "Stop generating (Escape)",
 		sendMessage: "Send message (Enter)",
-		filesAttached: (count) => `${count} file${count > 1 ? "s" : ""} attached`
+		filesAttached: (count) => count === 1 ? "1 file attached" : `${count.toLocaleString()} files attached`
 	},
 	paste: {
 		title: "Pasted text",
-		lines: (count) => `${count.toLocaleString()} line${count === 1 ? "" : "s"}`,
+		lines: (count) => count === 1 ? "1 line" : `${count.toLocaleString()} lines`,
 		saving: "Saving…",
 		remove: "Remove paste"
 	},
@@ -102,7 +95,9 @@ var defaultChatStrings = {
 		label: "Thinking",
 		ellipsis: "Thinking...",
 		thoughtFor: (duration) => `Thought for ${duration}`,
-		activity: "Activity"
+		thoughtProcess: "Thought process",
+		activity: "Activity",
+		ranToolCalls: (count) => count === 1 ? "Ran 1 tool call" : `Ran ${count.toLocaleString()} tool calls`
 	},
 	thread: { viewOnly: "You have view only access" },
 	sidebar: {
@@ -112,9 +107,6 @@ var defaultChatStrings = {
 		groupThisMonth: "This Month",
 		groupOlder: "Older",
 		untitled: "Untitled",
-		rename: "Rename",
-		share: "Share",
-		delete: "Delete",
 		sharedWithYou: "Shared with you",
 		openSidebar: "Open sidebar",
 		closeSidebar: "Close sidebar",
@@ -128,26 +120,22 @@ var defaultChatStrings = {
 		noConversations: "No conversations yet",
 		deleteTitle: "Delete Conversation",
 		deleteBody: "Are you sure you want to delete this conversation? This action cannot be undone.",
-		deleteAction: "Delete",
 		renameTitle: "Rename Conversation",
-		renameAction: "Rename",
 		renameLabel: "Conversation title",
 		renamePlaceholder: "Enter a new title"
 	},
 	attachmentUpload: {
 		fileTooLarge: (maxSize) => `File too large. Maximum size is ${maxSize}`,
 		maxFilesAllowed: (max) => `Maximum ${max} files allowed`,
-		remove: "Remove",
 		dropFilesHere: "Drop files here",
-		addFiles: "Add files (drag or click)"
+		releaseToUpload: "Release to upload",
+		addFiles: "Add files (drag or click)",
+		maxSizePerFile: (size) => `Max ${size} per file`,
+		uploading: "Uploading…"
 	},
 	attachmentManager: {
 		title: "Attachments",
-		empty: "No attachments yet",
-		download: "Download",
-		delete: "Delete",
-		loadMore: "Load more",
-		loading: "Loading..."
+		empty: "No attachments yet"
 	},
 	branch: {
 		previous: "Previous branch",
@@ -157,24 +145,18 @@ var defaultChatStrings = {
 		searchPlaceholder: "Search conversations",
 		searchLabel: "Search conversations (⌘/Ctrl+Shift+F)",
 		noMatches: "No conversations match your search",
-		download: "Download",
 		exportError: "Failed to export conversation",
 		jumpToLatest: "Jump to latest",
-		dismiss: "Dismiss"
+		noResponseToCopy: "No response to copy"
 	},
 	messageMeta: {
 		stopped: "Stopped",
-		showMore: "Show more",
-		showLess: "Show less",
 		tokens: (total) => `${total.toLocaleString()} tokens`,
 		tokensBreakdown: (prompt, completion) => `${prompt.toLocaleString()} in · ${completion.toLocaleString()} out`,
 		copy: "Copy message",
 		edit: "Edit message",
 		regenerate: "Regenerate response",
-		retry: "Retry",
-		editPlaceholder: "Edit your message...",
-		cancel: "Cancel",
-		send: "Send"
+		editPlaceholder: "Edit your message..."
 	},
 	permissions: {
 		choose: "Choose what the agent may do",
@@ -190,8 +172,6 @@ var defaultChatStrings = {
 		planHint: "The workspace is left unchanged while a plan is drafted."
 	},
 	agentTranscript: {
-		showMore: "Show more",
-		showLess: "Show less",
 		running: "Running…",
 		done: "Done",
 		failed: "Failed",
@@ -210,7 +190,6 @@ var defaultChatStrings = {
 		denyCall: "No, deny this call",
 		denyWithFeedback: "No, and provide feedback to the agent",
 		feedbackPlaceholder: "Tell the agent what to do instead…",
-		send: "Send",
 		answered: "Answered",
 		writeOwnAnswer: "Write my own answer…",
 		subagent: "Task",
@@ -218,7 +197,8 @@ var defaultChatStrings = {
 		planPending: "Plan awaiting approval in the terminal",
 		approvalPending: "Waiting for an answer in the terminal",
 		approvalOptions: "Offered choices"
-	}
+	},
+	tools: defaultToolStrings
 };
 //#endregion
 export { defaultChatStrings };

package/dist/ai/types.d.ts

@@ -228,11 +228,6 @@ export interface ChatNavigation {
     toConversation(id: string): void;
     toNewChat(): void;
 }
-export interface ChatNotify {
-    success(message: string): void;
-    error(message: string): void;
-    info(message: string): void;
-}
 export type SharePermissionLevel = 'view' | 'collaborate';
 export interface SharePermission {
     id?: string;

package/dist/ai/ui/ConversationSidebar.d.ts

@@ -1,15 +1,18 @@
 import { type ReactNode } from 'react';
 export declare const SIDEBAR_MIN_WIDTH_PX = 200;
-export declare const SIDEBAR_MAX_WIDTH_PX = 480;
-/** A sidebar width the reader drags, nudges or resets, kept per list under
- *  its own storage key. */
-export declare function useResizableSidebarWidth(storageKey: string): {
-    width: number;
-    resizing: boolean;
-    startResize: (e: React.PointerEvent<HTMLElement>) => void;
-    reset: () => void;
-    nudge: (delta: number) => void;
+/** A conversation list's drawer on a layout too narrow to keep it beside the
+ *  content: it covers the chat's own positioned container, not the window, and
+ *  stays mounted so the list keeps its scroll and search between openings. */
+export declare const sidebarDrawerProps: {
+    readonly contained: true;
+    readonly side: 'left';
+    readonly width: 'min(20rem, 85%)';
+    readonly modal: 'trap-focus';
+    readonly keepMounted: true;
+    readonly closeButton: false;
+    readonly padded: false;
 };
+export declare const SIDEBAR_MAX_WIDTH_PX = 480;
 export interface ConversationSidebarGroup<T> {
     key: string;
     label: ReactNode;

package/dist/ai/ui/ConversationSidebar.js

@@ -1,66 +1,28 @@
+import { cx } from "../../cx.js";
 import { positionKeys } from "../../components/keys.js";
-import { SidebarDrawer, SidebarGroupHeading, SidebarPanel, SidebarToggle } from "./sidebar.js";
-import { clsx } from "clsx";
+import { usePersistedState } from "../../components/Provider.js";
+import { useSplitter } from "../../components/splitter.js";
+import { Drawer } from "../../components/Drawer.js";
+import { LoadingRegion, Skeleton } from "../../components/Skeleton.js";
+import { SidebarGroupHeading, SidebarPanel, SidebarToggle } from "./sidebar.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Fragment as Fragment$1, useEffect, useRef, useState } from "react";
+import { Fragment as Fragment$1, useEffect, useRef } from "react";
+/** A conversation list's drawer on a layout too narrow to keep it beside the
+*  content: it covers the chat's own positioned container, not the window, and
+*  stays mounted so the list keeps its scroll and search between openings. */
+var sidebarDrawerProps = {
+	contained: true,
+	side: "left",
+	width: "min(20rem, 85%)",
+	modal: "trap-focus",
+	keepMounted: true,
+	closeButton: false,
+	padded: false
+};
 var SHARED_WIDTH_STORAGE_KEY = "aiChatSidebarWidth";
 function clampSidebarWidth(width) {
 	return Math.min(480, Math.max(200, width));
 }
-function readStoredSidebarWidth(storageKey) {
-	try {
-		const stored = Number(window.localStorage.getItem(storageKey));
-		return Number.isFinite(stored) && stored > 0 ? clampSidebarWidth(stored) : 256;
-	} catch {
-		return 256;
-	}
-}
-function storeSidebarWidth(storageKey, width) {
-	try {
-		window.localStorage.setItem(storageKey, String(width));
-	} catch {}
-}
-/** A sidebar width the reader drags, nudges or resets, kept per list under
-*  its own storage key. */
-function useResizableSidebarWidth(storageKey) {
-	const [width, setWidth] = useState(() => readStoredSidebarWidth(storageKey));
-	const [resizing, setResizing] = useState(false);
-	const widthRef = useRef(width);
-	widthRef.current = width;
-	const startResize = (e) => {
-		e.preventDefault();
-		const startX = e.clientX;
-		const startWidth = widthRef.current;
-		setResizing(true);
-		const onMove = (ev) => {
-			setWidth(clampSidebarWidth(startWidth + ev.clientX - startX));
-		};
-		const onUp = () => {
-			window.removeEventListener("pointermove", onMove);
-			window.removeEventListener("pointerup", onUp);
-			setResizing(false);
-			storeSidebarWidth(storageKey, widthRef.current);
-		};
-		window.addEventListener("pointermove", onMove);
-		window.addEventListener("pointerup", onUp);
-	};
-	const reset = () => {
-		setWidth(256);
-		storeSidebarWidth(storageKey, 256);
-	};
-	const nudge = (delta) => {
-		const next = clampSidebarWidth(widthRef.current + delta);
-		setWidth(next);
-		storeSidebarWidth(storageKey, next);
-	};
-	return {
-		width,
-		resizing,
-		startResize,
-		reset,
-		nudge
-	};
-}
 /** Steps through the listed items in order and wraps, so moving between
 *  conversations never needs the pointer. */
 function useItemCycling(ordered, cycle) {
@@ -92,7 +54,16 @@ function useItemCycling(ordered, cycle) {
 *  collapse to a rail, with an optional drag handle for the width. The host
 *  decides what is listed, how it is grouped and how each row reads. */
 function ConversationSidebar({ label, collapsed: collapsedProp, onToggle, toggleLabels, resize, fill: fillProp = false, drawer, groups, getKey, renderRow, loading = false, placeholder, top, rail, footer, cycle, groupTestId, children }) {
-	const sized = useResizableSidebarWidth(resize?.storageKey ?? SHARED_WIDTH_STORAGE_KEY);
+	const [storedWidth, setStoredWidth] = usePersistedState(resize?.storageKey ?? SHARED_WIDTH_STORAGE_KEY, 256);
+	const splitter = useSplitter({
+		width: clampSidebarWidth(storedWidth),
+		onWidthChange: setStoredWidth,
+		min: 200,
+		max: 480,
+		side: "right",
+		defaultWidth: 256,
+		label: resize?.label
+	});
 	useItemCycling(groups.flatMap((g) => g.items), cycle);
 	const fill = fillProp || !!drawer;
 	const collapsed = collapsedProp && !fill;
@@ -101,42 +72,26 @@ function ConversationSidebar({ label, collapsed: collapsedProp, onToggle, toggle
 		collapsed,
 		label,
 		...resizable ? {
-			width: sized.width,
-			resizing: sized.resizing
+			width: splitter.width,
+			resizing: splitter.resizing
 		} : {},
 		...fill ? { style: { width: "100%" } } : {},
 		children: [
 			resizable && !collapsed && /* @__PURE__ */ jsx("div", {
-				role: "separator",
-				tabIndex: 0,
-				"aria-orientation": "vertical",
-				"aria-label": resize.label,
-				"aria-valuemin": 200,
-				"aria-valuemax": 480,
-				"aria-valuenow": sized.width,
-				title: resize.hint,
-				onPointerDown: sized.startResize,
-				onDoubleClick: sized.reset,
-				onKeyDown: (e) => {
-					if (e.key === "ArrowLeft") sized.nudge(-16);
-					else if (e.key === "ArrowRight") sized.nudge(16);
-				},
-				className: clsx("absolute inset-y-0 right-0 z-10 w-1 cursor-col-resize touch-none", sized.resizing ? "bg-(--theme-element)" : "hover:bg-(--theme-border)")
+				...splitter.separatorProps,
+				title: resize.hint
 			}),
 			top,
 			collapsed && rail ? /* @__PURE__ */ jsx("ul", {
 				className: "flex min-h-0 flex-1 flex-col items-center gap-1 overflow-y-auto py-1",
 				children: rail
 			}) : /* @__PURE__ */ jsx("div", {
-				className: clsx("min-h-0 flex-1 overflow-y-auto px-2 pb-2 transition-opacity duration-200", collapsed ? "pointer-events-none opacity-0" : "opacity-100"),
-				children: loading ? /* @__PURE__ */ jsx("div", {
+				className: cx("min-h-0 flex-1 overflow-y-auto px-2 pb-2 transition-opacity duration-200", collapsed ? "pointer-events-none opacity-0" : "opacity-100"),
+				children: loading ? /* @__PURE__ */ jsx(LoadingRegion, {
 					className: "space-y-3 px-2 pt-2",
-					children: positionKeys(5, "skeleton").map((key, i) => /* @__PURE__ */ jsx("div", {
-						className: "animate-pulse",
-						children: /* @__PURE__ */ jsx("div", {
-							className: "h-4 rounded theme-muted-panel",
-							style: { width: `${70 - i * 10}%` }
-						})
+					children: positionKeys(5, "skeleton").map((key, i) => /* @__PURE__ */ jsx(Skeleton, {
+						width: `${70 - i * 10}%`,
+						height: 16
 					}, key))
 				}) : groups.length === 0 ? placeholder : groups.map((group) => /* @__PURE__ */ jsxs("div", {
 					className: "mb-2",
@@ -151,7 +106,7 @@ function ConversationSidebar({ label, collapsed: collapsedProp, onToggle, toggle
 				}, group.key))
 			}),
 			/* @__PURE__ */ jsxs("div", {
-				className: clsx("flex shrink-0 items-center gap-1 p-1.5", collapsed ? "justify-center" : footer ? "justify-between" : "justify-end"),
+				className: cx("flex shrink-0 items-center gap-1 p-1.5", collapsed ? "justify-center" : footer ? "justify-between" : "justify-end"),
 				children: [!collapsed && footer, /* @__PURE__ */ jsx(SidebarToggle, {
 					collapsed,
 					onToggle,
@@ -162,12 +117,13 @@ function ConversationSidebar({ label, collapsed: collapsedProp, onToggle, toggle
 			children
 		]
 	});
-	return drawer ? /* @__PURE__ */ jsx(SidebarDrawer, {
+	return drawer ? /* @__PURE__ */ jsx(Drawer, {
+		...sidebarDrawerProps,
 		open: drawer.open,
 		onClose: drawer.onClose,
-		label: drawer.label,
+		"aria-label": drawer.label,
 		children: panel
 	}) : panel;
 }
 //#endregion
-export { ConversationSidebar, useResizableSidebarWidth };
+export { ConversationSidebar, sidebarDrawerProps };

package/dist/ai/ui/Markdown.d.ts

@@ -1,6 +1,3 @@
-interface MarkdownProps {
-    children: string;
-    isStreaming?: boolean;
-}
-export default function Markdown({ children, isStreaming }: MarkdownProps): import("react").JSX.Element;
-export {};
+import { type MarkdownProps } from '../../components/Markdown.js';
+/** Markdown with the chat host's per-tag overrides. */
+export default function Markdown(props: Omit<MarkdownProps, 'components'>): import("react").JSX.Element;

package/dist/ai/ui/Markdown.js

@@ -1,80 +1,13 @@
+import Markdown$1 from "../../components/Markdown.js";
 import { useChatConfig } from "../core/config.js";
-import { rehypeCodeBreaks } from "./codeBreaks.js";
-import { clsx } from "clsx";
 import { jsx } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
-import { code } from "@streamdown/code";
-import { math } from "@streamdown/math";
-import { Streamdown, defaultRehypePlugins } from "streamdown";
 //#region src/ai/ui/Markdown.tsx
-function schemeIsDark() {
-	if (typeof document === "undefined") return false;
-	const scheme = getComputedStyle(document.documentElement).colorScheme;
-	if (scheme.includes("dark") !== scheme.includes("light")) return scheme.includes("dark");
-	return typeof window.matchMedia === "function" && window.matchMedia("(prefers-color-scheme: dark)").matches;
-}
-var basePlugins = {
-	code,
-	math
-};
-var pluginsWithMermaid;
-var mermaidLoad;
-function loadMermaid() {
-	mermaidLoad ??= import("@streamdown/mermaid").then(({ createMermaidPlugin }) => {
-		const base = createMermaidPlugin();
-		pluginsWithMermaid = {
-			...basePlugins,
-			mermaid: {
-				...base,
-				getMermaid: (config) => base.getMermaid({
-					theme: schemeIsDark() ? "dark" : "neutral",
-					...config
-				})
-			}
-		};
-	});
-	return mermaidLoad;
-}
-var shikiTheme = ["github-light", "github-dark"];
-var rehypePlugins = [...Object.values(defaultRehypePlugins), rehypeCodeBreaks];
-function Markdown({ children, isStreaming }) {
+/** Markdown with the chat host's per-tag overrides. */
+function Markdown(props) {
 	const { markdownComponents } = useChatConfig();
-	const needsMermaid = !!children && children.includes("```mermaid");
-	const [, setMermaidReady] = useState(() => !!pluginsWithMermaid);
-	useEffect(() => {
-		if (!needsMermaid || pluginsWithMermaid) return;
-		let live = true;
-		loadMermaid().then(() => {
-			if (live) setMermaidReady(true);
-		});
-		return () => {
-			live = false;
-		};
-	}, [needsMermaid]);
-	const plugins = needsMermaid && pluginsWithMermaid ? pluginsWithMermaid : basePlugins;
-	return /* @__PURE__ */ jsx("div", {
-		className: "markdown whitespace-normal text-start w-full",
-		children: /* @__PURE__ */ jsx(Streamdown, {
-			mode: isStreaming ? "streaming" : "static",
-			...isStreaming === void 0 ? {} : { isAnimating: isStreaming },
-			...isStreaming ? {
-				caret: "block",
-				className: "markdown-streaming"
-			} : {},
-			plugins,
-			rehypePlugins,
-			shikiTheme,
-			components: {
-				a: ({ node, ...props }) => /* @__PURE__ */ jsx("a", {
-					...props,
-					className: clsx("link wrap-break-word", props.className),
-					target: "_blank",
-					rel: "noopener noreferrer"
-				}),
-				...markdownComponents
-			},
-			children: children || ""
-		})
+	return /* @__PURE__ */ jsx(Markdown$1, {
+		...props,
+		...markdownComponents ? { components: markdownComponents } : {}
 	});
 }
 //#endregion

package/dist/ai/ui/Notice.js

@@ -1,7 +1,5 @@
-import { FiAlertCircle } from "../../icons/fi/FiAlertCircle.js";
-import { IoMdClose } from "../../icons/io/IoMdClose.js";
-import { IoInformationCircleOutline } from "../../icons/io5/IoInformationCircleOutline.js";
-import { clsx } from "clsx";
+import { cx } from "../../cx.js";
+import { CloseIcon, ErrorIcon, InfoIcon } from "../../icons.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ai/ui/Notice.tsx
 var barTone = {
@@ -31,16 +29,16 @@ var cardTone = {
 /** A standing condition on the surface: a full-width bar under the header
 *  with a title, an explanation, and the one thing the reader can do about it. */
 function NoticeBar({ tone, title, children, action, onAction, testId }) {
-	const Icon = tone === "danger" || tone === "warning" ? FiAlertCircle : IoInformationCircleOutline;
+	const Icon = tone === "danger" || tone === "warning" ? ErrorIcon : InfoIcon;
 	return /* @__PURE__ */ jsxs("div", {
 		"data-testid": testId,
-		className: clsx("flex shrink-0 items-start gap-3 border-b px-6 py-3", barTone[tone]),
+		className: cx("flex shrink-0 items-start gap-3 border-b px-6 py-3", barTone[tone]),
 		children: [
-			/* @__PURE__ */ jsx(Icon, { className: clsx("mt-0.5 h-4 w-4 shrink-0", iconTone[tone]) }),
+			/* @__PURE__ */ jsx(Icon, { className: cx("mt-0.5 h-4 w-4 shrink-0", iconTone[tone]) }),
 			/* @__PURE__ */ jsxs("div", {
 				className: "min-w-0 flex-1",
 				children: [/* @__PURE__ */ jsx("p", {
-					className: clsx("text-sm font-medium", titleTone[tone]),
+					className: cx("text-sm font-medium", titleTone[tone]),
 					children: title
 				}), children && /* @__PURE__ */ jsx("p", {
 					className: "mt-0.5 text-xs theme-muted-text",
@@ -64,7 +62,7 @@ function OutputCard({ title, text, onDismiss, dismissLabel, testId }) {
 		className: "relative my-3 rounded-lg border theme-border theme-muted-panel px-3 py-2",
 		children: [
 			/* @__PURE__ */ jsx("p", {
-				className: clsx("font-mono text-[11px] theme-muted-text", onDismiss && "pr-6"),
+				className: cx("font-mono text-[11px] theme-muted-text", onDismiss && "pr-6"),
 				children: title
 			}),
 			/* @__PURE__ */ jsx("pre", {
@@ -77,7 +75,7 @@ function OutputCard({ title, text, onDismiss, dismissLabel, testId }) {
 				"aria-label": dismissLabel,
 				title: dismissLabel,
 				className: "absolute top-1.5 right-1.5 rounded p-1 theme-muted-text hover:theme-hover",
-				children: /* @__PURE__ */ jsx(IoMdClose, { className: "h-3.5 w-3.5" })
+				children: /* @__PURE__ */ jsx(CloseIcon, { className: "h-3.5 w-3.5" })
 			})
 		]
 	});
@@ -87,7 +85,7 @@ function OutputCard({ title, text, onDismiss, dismissLabel, testId }) {
 function NoticeCard({ tone = "neutral", children, onDismiss, dismissLabel, testId }) {
 	return /* @__PURE__ */ jsxs("div", {
 		"data-testid": testId,
-		className: clsx("flex items-start gap-2 rounded-lg border px-3 py-2 text-xs", cardTone[tone]),
+		className: cx("flex items-start gap-2 rounded-lg border px-3 py-2 text-xs", cardTone[tone]),
 		children: [/* @__PURE__ */ jsx("span", {
 			className: "flex-1",
 			children
@@ -97,7 +95,7 @@ function NoticeCard({ tone = "neutral", children, onDismiss, dismissLabel, testI
 			"aria-label": dismissLabel,
 			title: dismissLabel,
 			className: "shrink-0 rounded p-0.5 hover:theme-hover",
-			children: /* @__PURE__ */ jsx(IoMdClose, { className: "h-3 w-3" })
+			children: /* @__PURE__ */ jsx(CloseIcon, { className: "h-3 w-3" })
 		})]
 	});
 }

package/dist/ai/ui/chip.d.ts

@@ -1,4 +1,4 @@
 /** A picker under the composer, beside send. */
-export declare const chipClassName = "inline-flex min-w-0 items-center cursor-pointer outline-none transition-colors theme-muted-text hover:theme-text focus-visible:ring-1 focus-visible:ring-(--theme-element) disabled:cursor-not-allowed disabled:opacity-50 h-8 max-w-[280px] gap-1.5 rounded-full px-2.5 text-[13px] hover:chat-tint";
+export declare const chipClassName = "inline-flex min-w-0 items-center cursor-pointer outline-none transition-colors theme-muted-text hover:theme-text focus-visible:ring-1 focus-visible:ring-(--theme-accent) disabled:cursor-not-allowed disabled:opacity-50 h-8 max-w-[280px] gap-1.5 rounded-full px-2.5 text-[13px] hover:chat-tint";
 /** A smaller picker for secondary settings, such as the agent's permissions. */
-export declare const smallChipClassName = "inline-flex min-w-0 items-center cursor-pointer outline-none transition-colors theme-muted-text hover:theme-text focus-visible:ring-1 focus-visible:ring-(--theme-element) disabled:cursor-not-allowed disabled:opacity-50 gap-1 rounded-md px-1.5 py-0.5 text-[11px] hover:theme-muted-panel";
+export declare const smallChipClassName = "inline-flex min-w-0 items-center cursor-pointer outline-none transition-colors theme-muted-text hover:theme-text focus-visible:ring-1 focus-visible:ring-(--theme-accent) disabled:cursor-not-allowed disabled:opacity-50 gap-1 rounded-md px-1.5 py-0.5 text-[11px] hover:theme-muted-panel";

package/dist/ai/ui/chip.js

@@ -1,5 +1,5 @@
 //#region src/ai/ui/chip.ts
-var chipBase = "inline-flex min-w-0 items-center cursor-pointer outline-none transition-colors theme-muted-text hover:theme-text focus-visible:ring-1 focus-visible:ring-(--theme-element) disabled:cursor-not-allowed disabled:opacity-50";
+var chipBase = "inline-flex min-w-0 items-center cursor-pointer outline-none transition-colors theme-muted-text hover:theme-text focus-visible:ring-1 focus-visible:ring-(--theme-accent) disabled:cursor-not-allowed disabled:opacity-50";
 /** A picker under the composer, beside send. */
 var chipClassName = `${chipBase} h-8 max-w-[280px] gap-1.5 rounded-full px-2.5 text-[13px] hover:chat-tint`;
 /** A smaller picker for secondary settings, such as the agent's permissions. */

package/dist/ai/ui/sidebar.d.ts

@@ -14,17 +14,6 @@ export declare function SidebarPanel({ collapsed, width, railWidth, resizing, la
     style?: CSSProperties;
     children: ReactNode;
 }): import("react").JSX.Element;
-/** The list over the content of a layout too narrow to keep it beside the
- *  content. Place it in a positioned container: the drawer covers that
- *  container, not the window, so an embedded chat keeps to its own panel.
- *  A tap outside, Escape or a swipe to the left closes it, and focus returns
- *  where it was. */
-export declare function SidebarDrawer({ open, onClose, label, children, }: {
-    open: boolean;
-    onClose: () => void;
-    label: string;
-    children: ReactNode;
-}): import("react").JSX.Element;
 export declare function SidebarToggle({ collapsed, onToggle, openLabel, closeLabel, className, }: {
     collapsed: boolean;
     onToggle: () => void;
@@ -38,17 +27,12 @@ export declare function SidebarGroupHeading({ children, tone, testId, }: {
     tone?: 'default' | 'attention';
     testId?: string | undefined;
 }): import("react").JSX.Element;
-/** What a list says in place of its rows: none yet, no matches, or why it
- *  could not load. Plain text, so an empty list reads the same in every list. */
-export declare function SidebarPlaceholder({ children, testId, }: {
-    children: ReactNode;
-    testId?: string | undefined;
-}): import("react").JSX.Element;
 /** A row's first line, the same in every list: what it is, and when it last
  *  moved, abbreviated, on the right. */
 export declare function SidebarRowTitle({ children, time, }: {
     children: ReactNode;
-    time?: string | undefined;
+    /** When it last changed, short: a compact `RelativeTime`. */
+    time?: ReactNode;
 }): import("react").JSX.Element;
 /** One entry in the list: the row highlights while it is the open one or
  *  while its menu is up, and the menu opens from its button or a right-click. */
@@ -61,12 +45,12 @@ export declare function SidebarRow({ selected, menuItems, openMenu, className, c
 }): import("react").JSX.Element;
 /** One entry in the collapsed rail: a square the size of the toggle, with the
  *  same highlight as a row, holding whatever stands in for the item. */
-export declare function SidebarRailItem({ selected, label, onSelect, testId, tooltipProps, children, }: {
+export declare function SidebarRailItem({ selected, label, onSelect, testId, children, }: {
     selected: boolean;
+    /** Names the icon-only button, and shows beside it on hover. */
     label: string;
     onSelect: () => void;
     testId?: string;
-    tooltipProps?: Record<string, string>;
     children: ReactNode;
 }): import("react").JSX.Element;
 export declare function RenameDialog({ open, title, label, placeholder, confirmLabel, value, onChange, onConfirm, onClose, }: {