@alexkroman1/aai-ui 0.9.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 AAI
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/_components/app.d.ts

@@ -0,0 +1,5 @@
+import type * as preact from "preact";
+/** @public */
+export declare function App({ className }: {
+    className?: string;
+}): preact.JSX.Element;

package/dist/_components/app.js

@@ -0,0 +1,23 @@
+import { useMountConfig } from "../mount-context.js";
+import { ChatView } from "./chat-view.js";
+import { StartScreen } from "./start-screen.js";
+import { jsx } from "preact/jsx-runtime";
+//#region _components/app.tsx
+function AnsiLogo() {
+	return /* @__PURE__ */ jsx("pre", {
+		class: "font-aai-mono text-lg leading-[1.1] font-bold text-aai-primary m-0",
+		children: "▄▀█ ▄▀█ █\n█▀█ █▀█ █"
+	});
+}
+/** @public */
+function App({ className }) {
+	const { title } = useMountConfig();
+	return /* @__PURE__ */ jsx(StartScreen, {
+		icon: title ? void 0 : /* @__PURE__ */ jsx(AnsiLogo, {}),
+		title,
+		className,
+		children: /* @__PURE__ */ jsx(ChatView, {})
+	});
+}
+//#endregion
+export { App };

package/dist/_components/button.d.ts

@@ -0,0 +1,11 @@
+import type * as preact from "preact";
+type ButtonVariant = "default" | "secondary" | "ghost";
+type ButtonSize = "default" | "lg";
+/** @public */
+export declare function Button({ variant, size, className, children, ...rest }: {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    className?: string;
+    children?: preact.ComponentChildren;
+} & Omit<preact.JSX.HTMLAttributes<HTMLButtonElement>, "className">): preact.JSX.Element;
+export {};

package/dist/_components/button.js

@@ -0,0 +1,22 @@
+import clsx from "clsx";
+import { jsx } from "preact/jsx-runtime";
+//#region _components/button.tsx
+/** @public */
+function Button({ variant = "default", size = "default", className, children, ...rest }) {
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		style: size === "lg" ? {
+			display: "grid",
+			placeItems: "center",
+			appearance: "none",
+			margin: 0,
+			padding: "12px 32px",
+			lineHeight: 1
+		} : void 0,
+		class: clsx(size !== "lg" && "flex items-center justify-center appearance-none m-0 h-8 px-3 py-1.5 w-fit leading-none", "rounded-aai text-sm font-medium cursor-pointer border outline-none", variant === "secondary" && "bg-aai-surface-hover text-aai-text-secondary border-aai-border", variant === "ghost" && "bg-transparent text-aai-text-secondary border-aai-border", variant === "default" && "bg-aai-primary text-white border-transparent", className),
+		...rest,
+		children
+	});
+}
+//#endregion
+export { Button };

package/dist/_components/chat-view.d.ts

@@ -0,0 +1,5 @@
+import type * as preact from "preact";
+/** @public */
+export declare function ChatView({ className }: {
+    className?: string;
+}): preact.JSX.Element;

package/dist/_components/chat-view.js

@@ -0,0 +1,37 @@
+import { useMountConfig } from "../mount-context.js";
+import { useSession } from "../signals.js";
+import { Controls } from "./controls.js";
+import { ErrorBanner } from "./error-banner.js";
+import { MessageList } from "./message-list.js";
+import { StateIndicator } from "./state-indicator.js";
+import clsx from "clsx";
+import { jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/chat-view.tsx
+/** @public */
+function ChatView({ className }) {
+	const { session } = useSession();
+	const { title } = useMountConfig();
+	return /* @__PURE__ */ jsxs("div", {
+		class: clsx("flex flex-col h-screen max-w-130 mx-auto bg-aai-bg text-aai-text font-aai text-sm", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				class: "flex items-center gap-3 px-4 py-3 border-b border-aai-border shrink-0",
+				children: [title ? /* @__PURE__ */ jsx("span", {
+					class: "text-sm font-semibold text-aai-primary",
+					children: title
+				}) : /* @__PURE__ */ jsx("pre", {
+					class: "font-aai-mono text-[10px] leading-[1.1] font-bold text-aai-primary m-0",
+					children: "▄▀█ ▄▀█ █\n█▀█ █▀█ █"
+				}), /* @__PURE__ */ jsx("div", {
+					class: "ml-auto",
+					children: /* @__PURE__ */ jsx(StateIndicator, { state: session.state })
+				})]
+			}),
+			/* @__PURE__ */ jsx(ErrorBanner, { error: session.error }),
+			/* @__PURE__ */ jsx(MessageList, {}),
+			/* @__PURE__ */ jsx(Controls, {})
+		]
+	});
+}
+//#endregion
+export { ChatView };

package/dist/_components/controls.d.ts

@@ -0,0 +1,4 @@
+/** @public */
+export declare function Controls({ className }: {
+    className?: string;
+}): import("preact").JSX.Element;

package/dist/_components/controls.js

@@ -0,0 +1,23 @@
+import { useSession } from "../signals.js";
+import { Button } from "./button.js";
+import clsx from "clsx";
+import { jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/controls.tsx
+/** @public */
+function Controls({ className }) {
+	const { running, toggle, reset } = useSession();
+	return /* @__PURE__ */ jsxs("div", {
+		class: clsx("flex gap-2 px-4 py-3 border-t border-aai-border shrink-0", className),
+		children: [/* @__PURE__ */ jsx(Button, {
+			variant: "secondary",
+			onClick: toggle,
+			children: running.value ? "Stop" : "Resume"
+		}), /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			onClick: reset,
+			children: "New Conversation"
+		})]
+	});
+}
+//#endregion
+export { Controls };

package/dist/_components/error-banner.d.ts

@@ -0,0 +1,7 @@
+import type * as preact from "preact";
+import type { Reactive, SessionError } from "../types.ts";
+/** @public */
+export declare function ErrorBanner({ error, className, }: {
+    error: Reactive<SessionError | null>;
+    className?: string;
+}): preact.JSX.Element | null;

package/dist/_components/error-banner.js

@@ -0,0 +1,13 @@
+import clsx from "clsx";
+import { jsx } from "preact/jsx-runtime";
+//#region _components/error-banner.tsx
+/** @public */
+function ErrorBanner({ error, className }) {
+	if (!error.value) return null;
+	return /* @__PURE__ */ jsx("div", {
+		class: clsx("mx-4 mt-3 px-3 py-2 rounded-aai border border-aai-error/40 bg-aai-error/8 text-[13px] leading-[130%] text-aai-error", className),
+		children: error.value.message
+	});
+}
+//#endregion
+export { ErrorBanner };

package/dist/_components/message-bubble.d.ts

@@ -0,0 +1,7 @@
+import type * as preact from "preact";
+import type { Message } from "../types.ts";
+/** @public */
+export declare function MessageBubble({ message, className, }: {
+    message: Message;
+    className?: string;
+}): preact.JSX.Element;

package/dist/_components/message-bubble.js

@@ -0,0 +1,19 @@
+import clsx from "clsx";
+import { jsx } from "preact/jsx-runtime";
+//#region _components/message-bubble.tsx
+/** @public */
+function MessageBubble({ message, className }) {
+	if (message.role === "user") return /* @__PURE__ */ jsx("div", {
+		class: clsx("flex flex-col w-full items-end", className),
+		children: /* @__PURE__ */ jsx("div", {
+			class: "max-w-[min(82%,64ch)] bg-aai-surface-faint border border-aai-border px-3 py-2 rounded-aai whitespace-pre-wrap wrap-break-word text-sm font-normal leading-[150%] text-aai-text",
+			children: message.content
+		})
+	});
+	return /* @__PURE__ */ jsx("div", {
+		class: clsx("whitespace-pre-wrap wrap-break-word text-sm font-normal leading-[150%] text-aai-text", className),
+		children: message.content
+	});
+}
+//#endregion
+export { MessageBubble };

package/dist/_components/message-list.d.ts

@@ -0,0 +1,4 @@
+/** @public */
+export declare function MessageList({ className }: {
+    className?: string;
+}): import("preact").JSX.Element;

package/dist/_components/message-list.js

@@ -0,0 +1,59 @@
+import { useAutoScroll, useSession } from "../signals.js";
+import { MessageBubble } from "./message-bubble.js";
+import { ThinkingIndicator } from "./thinking-indicator.js";
+import { ToolCallBlock } from "./tool-call-block.js";
+import { Transcript } from "./transcript.js";
+import clsx from "clsx";
+import { computed } from "@preact/signals";
+import { jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/message-list.tsx
+/** @public */
+function MessageList({ className }) {
+	const { session } = useSession();
+	const scrollRef = useAutoScroll();
+	const showThinking = computed(() => {
+		if (session.state.value !== "thinking") return false;
+		const last = session.toolCalls.value.at(-1);
+		if (last?.status === "pending") return false;
+		const lastMsg = session.messages.value.at(-1);
+		return !lastMsg || lastMsg.role === "user" || Boolean(last);
+	});
+	const messages = session.messages.value;
+	const toolCalls = session.toolCalls.value;
+	const items = [];
+	let tci = 0;
+	for (const [i, msg] of messages.entries()) {
+		items.push(/* @__PURE__ */ jsx(MessageBubble, { message: msg }, `msg-${i}`));
+		let tc = toolCalls[tci];
+		while (tc && tc.afterMessageIndex <= i) {
+			items.push(/* @__PURE__ */ jsx(ToolCallBlock, { toolCall: tc }, tc.toolCallId));
+			tci++;
+			tc = toolCalls[tci];
+		}
+	}
+	let tc = toolCalls[tci];
+	while (tc) {
+		items.push(/* @__PURE__ */ jsx(ToolCallBlock, { toolCall: tc }, tc.toolCallId));
+		tci++;
+		tc = toolCalls[tci];
+	}
+	return /* @__PURE__ */ jsx("div", {
+		role: "log",
+		class: clsx("flex-1 overflow-y-auto [scrollbar-width:none] bg-aai-surface", className),
+		children: /* @__PURE__ */ jsxs("div", {
+			class: "flex flex-col gap-4.5 p-4",
+			children: [
+				items,
+				session.agentUtterance.value && /* @__PURE__ */ jsx(MessageBubble, { message: {
+					role: "assistant",
+					content: session.agentUtterance.value
+				} }),
+				/* @__PURE__ */ jsx(Transcript, { userUtterance: session.userUtterance }),
+				showThinking.value && /* @__PURE__ */ jsx(ThinkingIndicator, {}),
+				/* @__PURE__ */ jsx("div", { ref: scrollRef })
+			]
+		})
+	});
+}
+//#endregion
+export { MessageList };

package/dist/_components/sidebar-layout.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentChildren } from "preact";
+/**
+ * A two-column layout with a fixed-width sidebar and a flexible main area.
+ * Commonly used to pair a custom sidebar (cart, dashboard) with `<ChatView />`.
+ *
+ * @example
+ * ```tsx
+ * <SidebarLayout sidebar={<OrderPanel />}>
+ *   <ChatView />
+ * </SidebarLayout>
+ * ```
+ *
+ * @public
+ */
+export declare function SidebarLayout({ sidebar, children, width, side, className, }: {
+    sidebar: ComponentChildren;
+    children: ComponentChildren;
+    width?: string | undefined;
+    side?: "left" | "right" | undefined;
+    className?: string;
+}): import("preact").JSX.Element;

package/dist/_components/sidebar-layout.js

@@ -0,0 +1,36 @@
+import clsx from "clsx";
+import { jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/sidebar-layout.tsx
+/**
+* A two-column layout with a fixed-width sidebar and a flexible main area.
+* Commonly used to pair a custom sidebar (cart, dashboard) with `<ChatView />`.
+*
+* @example
+* ```tsx
+* <SidebarLayout sidebar={<OrderPanel />}>
+*   <ChatView />
+* </SidebarLayout>
+* ```
+*
+* @public
+*/
+function SidebarLayout({ sidebar, children, width = "20rem", side = "left", className }) {
+	const sidebarEl = /* @__PURE__ */ jsx("div", {
+		class: clsx("flex-shrink-0 flex flex-col overflow-y-auto", side === "left" ? "border-r border-aai-border" : "border-l border-aai-border"),
+		style: { width },
+		children: sidebar
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		class: clsx("flex h-screen bg-aai-bg", className),
+		children: [
+			side === "left" && sidebarEl,
+			/* @__PURE__ */ jsx("div", {
+				class: "flex-1 min-w-0",
+				children
+			}),
+			side === "right" && sidebarEl
+		]
+	});
+}
+//#endregion
+export { SidebarLayout };

package/dist/_components/start-screen.d.ts

@@ -0,0 +1,26 @@
+import type { ComponentChildren } from "preact";
+/**
+ * A centered start screen with icon, title, subtitle, and a start button.
+ * Renders `children` (the main app) once the session has started.
+ *
+ * @example
+ * ```tsx
+ * function MyAgent() {
+ *   return (
+ *     <StartScreen icon="🍕" title="Pizza Palace" subtitle="Voice-powered ordering">
+ *       <ChatView />
+ *     </StartScreen>
+ *   );
+ * }
+ * ```
+ *
+ * @public
+ */
+export declare function StartScreen({ children, icon, title, subtitle, buttonText, className, }: {
+    children: ComponentChildren;
+    icon?: ComponentChildren | undefined;
+    title?: string | undefined;
+    subtitle?: string | undefined;
+    buttonText?: string | undefined;
+    className?: string | undefined;
+}): import("preact").JSX.Element;

package/dist/_components/start-screen.js

@@ -0,0 +1,51 @@
+import { useSession } from "../signals.js";
+import { Button } from "./button.js";
+import clsx from "clsx";
+import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/start-screen.tsx
+/**
+* A centered start screen with icon, title, subtitle, and a start button.
+* Renders `children` (the main app) once the session has started.
+*
+* @example
+* ```tsx
+* function MyAgent() {
+*   return (
+*     <StartScreen icon="🍕" title="Pizza Palace" subtitle="Voice-powered ordering">
+*       <ChatView />
+*     </StartScreen>
+*   );
+* }
+* ```
+*
+* @public
+*/
+function StartScreen({ children, icon, title, subtitle, buttonText = "Start", className }) {
+	const { started, start } = useSession();
+	if (started.value) return /* @__PURE__ */ jsx(Fragment, { children });
+	return /* @__PURE__ */ jsx("div", {
+		class: clsx("flex items-center justify-center h-screen bg-aai-bg font-aai", className),
+		children: /* @__PURE__ */ jsxs("div", {
+			class: "flex flex-col items-center gap-4 bg-aai-surface border border-aai-border rounded-lg px-12 py-10 max-w-sm text-center",
+			children: [
+				icon,
+				title && /* @__PURE__ */ jsx("h1", {
+					class: "font-semibold text-aai-primary m-0",
+					children: title
+				}),
+				subtitle && /* @__PURE__ */ jsx("p", {
+					class: "text-sm text-aai-text-muted m-0",
+					children: subtitle
+				}),
+				/* @__PURE__ */ jsx(Button, {
+					size: "lg",
+					className: "mt-2 w-full",
+					onClick: start,
+					children: buttonText
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { StartScreen };

package/dist/_components/state-indicator.d.ts

@@ -0,0 +1,7 @@
+import type * as preact from "preact";
+import type { AgentState, Reactive } from "../types.ts";
+/** @public */
+export declare function StateIndicator({ state, className, }: {
+    state: Reactive<AgentState>;
+    className?: string;
+}): preact.JSX.Element;

package/dist/_components/state-indicator.js

@@ -0,0 +1,15 @@
+import clsx from "clsx";
+import { jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/state-indicator.tsx
+/** @public */
+function StateIndicator({ state, className }) {
+	return /* @__PURE__ */ jsxs("div", {
+		class: clsx("inline-flex items-center justify-center gap-1.5 text-[13px] font-medium leading-[130%] text-aai-text-muted capitalize", className),
+		children: [/* @__PURE__ */ jsx("div", {
+			"data-state": state.value,
+			class: "w-2 h-2 rounded-full data-[state=disconnected]:bg-aai-state-disconnected data-[state=connecting]:bg-aai-state-connecting data-[state=ready]:bg-aai-state-ready data-[state=listening]:bg-aai-state-listening data-[state=thinking]:bg-aai-state-thinking data-[state=speaking]:bg-aai-state-speaking data-[state=error]:bg-aai-state-error"
+		}), state.value]
+	});
+}
+//#endregion
+export { StateIndicator };

package/dist/_components/thinking-indicator.d.ts

@@ -0,0 +1,5 @@
+import type * as preact from "preact";
+/** @public */
+export declare function ThinkingIndicator({ className }: {
+    className?: string;
+}): preact.JSX.Element;

package/dist/_components/thinking-indicator.js

@@ -0,0 +1,22 @@
+import clsx from "clsx";
+import { jsx } from "preact/jsx-runtime";
+//#region _components/thinking-indicator.tsx
+/** @public */
+function ThinkingIndicator({ className }) {
+	return /* @__PURE__ */ jsx("div", {
+		class: clsx("flex items-center gap-2 text-aai-text-dim text-sm font-medium min-h-5", className),
+		children: [
+			0,
+			.16,
+			.32
+		].map((delay) => /* @__PURE__ */ jsx("div", {
+			class: "w-1.5 h-1.5 rounded-full bg-aai-text-dim",
+			style: {
+				animation: "aai-bounce 1.4s infinite ease-in-out both",
+				animationDelay: `${delay}s`
+			}
+		}, delay))
+	});
+}
+//#endregion
+export { ThinkingIndicator };

package/dist/_components/tool-call-block.d.ts

@@ -0,0 +1,7 @@
+import type * as preact from "preact";
+import type { ToolCallInfo } from "../types.ts";
+/** @public */
+export declare function ToolCallBlock({ toolCall, className, }: {
+    toolCall: ToolCallInfo;
+    className?: string;
+}): preact.JSX.Element;

package/dist/_components/tool-call-block.js

@@ -0,0 +1,96 @@
+import { BoltIcon, ChatBubbleIcon, DownloadIcon, ExternalLinkIcon, SearchIcon, TerminalIcon } from "./tool-icons.js";
+import { useMemo, useState } from "preact/hooks";
+import clsx from "clsx";
+import { jsx, jsxs } from "preact/jsx-runtime";
+//#region _components/tool-call-block.tsx
+const argField = (key) => (args) => String(args[key] ?? "");
+const TOOL_CONFIG = {
+	web_search: {
+		Icon: SearchIcon,
+		title: "Web Search",
+		subtitle: argField("query")
+	},
+	visit_webpage: {
+		Icon: ExternalLinkIcon,
+		title: "Visit Page",
+		subtitle: argField("url")
+	},
+	run_code: {
+		Icon: TerminalIcon,
+		title: "Run Code",
+		subtitle: (args) => {
+			const firstLine = String(args.code ?? "").split("\n")[0] ?? "";
+			return firstLine.length > 80 ? `${firstLine.slice(0, 80)}...` : firstLine;
+		}
+	},
+	fetch_json: {
+		Icon: DownloadIcon,
+		title: "Fetch JSON",
+		subtitle: argField("url")
+	},
+	user_input: {
+		Icon: ChatBubbleIcon,
+		title: "Asking User",
+		subtitle: argField("question")
+	}
+};
+const DEFAULT_CONFIG = {
+	Icon: BoltIcon,
+	title: "",
+	subtitle: (args) => {
+		const summary = JSON.stringify(args);
+		return summary.length > 80 ? `${summary.slice(0, 80)}...` : summary;
+	}
+};
+function formatResult(result) {
+	try {
+		return JSON.stringify(JSON.parse(result), null, 2);
+	} catch {
+		return result;
+	}
+}
+/** @public */
+function ToolCallBlock({ toolCall, className }) {
+	const [isOpen, setOpen] = useState(false);
+	const config = TOOL_CONFIG[toolCall.toolName] ?? DEFAULT_CONFIG;
+	const isPending = toolCall.status === "pending";
+	const title = config.title || toolCall.toolName;
+	const canExpand = !isPending && !!toolCall.result;
+	const formatted = useMemo(() => toolCall.result ? formatResult(toolCall.result) : "", [toolCall.result]);
+	return /* @__PURE__ */ jsxs("div", {
+		class: clsx("flex flex-col", className),
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			"aria-expanded": canExpand ? isOpen : void 0,
+			disabled: isPending,
+			class: clsx("flex items-center gap-2 px-3 py-2 rounded-aai border border-aai-border bg-aai-surface-faint select-none text-left w-full", canExpand && "cursor-pointer"),
+			onClick: () => canExpand && setOpen(!isOpen),
+			children: [
+				/* @__PURE__ */ jsx(config.Icon, { class: "w-4 h-4 text-aai-text-dim shrink-0" }),
+				/* @__PURE__ */ jsx("span", {
+					class: clsx("text-sm font-medium text-aai-text", isPending && "tool-shimmer"),
+					children: title
+				}),
+				/* @__PURE__ */ jsx("span", {
+					class: "text-sm text-aai-text-dim truncate flex-1 min-w-0",
+					children: config.subtitle(toolCall.args)
+				}),
+				canExpand && /* @__PURE__ */ jsx("span", {
+					class: "text-xs text-aai-text-dim shrink-0",
+					children: isOpen ? "▾" : "▸"
+				})
+			]
+		}), isOpen && /* @__PURE__ */ jsxs("div", {
+			class: "border-x border-b border-aai-border rounded-b-aai bg-aai-surface max-h-64 overflow-auto",
+			children: [toolCall.toolName === "run_code" && toolCall.args.code && /* @__PURE__ */ jsx("pre", {
+				class: "text-xs text-aai-text p-2 whitespace-pre-wrap border-b border-aai-border font-mono",
+				children: String(toolCall.args.code)
+			}), formatted && /* @__PURE__ */ jsx("pre", {
+				class: "text-xs text-aai-text-dim p-2 whitespace-pre-wrap",
+				children: formatted
+			})]
+		})]
+	});
+}
+//#endregion
+export { ToolCallBlock };

package/dist/_components/tool-icons.d.ts

@@ -0,0 +1,17 @@
+import type * as preact from "preact";
+type IconProps = {
+    class?: string;
+};
+/** Magnifying glass icon for web_search. */
+export declare function SearchIcon(props: IconProps): preact.JSX.Element;
+/** External link icon for visit_webpage. */
+export declare function ExternalLinkIcon(props: IconProps): preact.JSX.Element;
+/** Terminal icon for run_code. */
+export declare function TerminalIcon(props: IconProps): preact.JSX.Element;
+/** Download icon for fetch_json. */
+export declare function DownloadIcon(props: IconProps): preact.JSX.Element;
+/** Chat bubble icon for user_input. */
+export declare function ChatBubbleIcon(props: IconProps): preact.JSX.Element;
+/** Bolt/lightning icon for default/unknown tools. */
+export declare function BoltIcon(props: IconProps): preact.JSX.Element;
+export {};