@signal9/era-ui 34.4.0 → 34.5.0

package/CHANGELOG.md

@@ -1,3 +1,20 @@
+## [34.5.0](https://github.com/sig-nine/era-ui/compare/v34.4.1...v34.5.0) (2026-08-28)
+
+### Features
+
+* **ai:** add compact tool inspector ([1fe91ec](https://github.com/sig-nine/era-ui/commit/1fe91ec0eaaf121ad16bc75de4ebe893e222b988))
+
+### Bug Fixes
+
+* **ai:** render inspector input details ([2400f80](https://github.com/sig-nine/era-ui/commit/2400f806ed9aabed901bc2625751096453f168b5))
+* **notes:** focus editor from trailing surface ([d4de399](https://github.com/sig-nine/era-ui/commit/d4de399d03b1d85db55b99aed1d5ffe7e0d5fcea))
+
+## [34.4.1](https://github.com/sig-nine/era-ui/compare/v34.4.0...v34.4.1) (2026-08-26)
+
+### Bug Fixes
+
+* **bevel:** unify compact keycap travel ([7ca2e28](https://github.com/sig-nine/era-ui/commit/7ca2e2874a6bbe6e6f6a0aff811462bdab40aad6))
+
 ## [34.4.0](https://github.com/sig-nine/era-ui/compare/v34.3.0...v34.4.0) (2026-08-25)
 
 ### Features

package/dist/ai/context/conversation-capacity.svelte

@@ -0,0 +1,89 @@
+<script lang="ts" module>
+	export type ConversationCapacityPhase =
+		'quiet' | 'preparing' | 'compacting' | 'complete' | 'failed';
+</script>
+
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import LoaderCircle from '@lucide/svelte/icons/loader-circle';
+	import CircleCheck from '@lucide/svelte/icons/circle-check';
+	import CircleAlert from '@lucide/svelte/icons/circle-alert';
+	import * as Collapsible from '../../ui/collapsible/index.js';
+	import { cn } from '../../utils/index.js';
+
+	let {
+		phase = 'quiet',
+		used,
+		total,
+		retained,
+		condensedToolResults,
+		setAsideTurns,
+		open = $bindable(false),
+		threshold = 0.7,
+		class: className
+	}: HTMLAttributes<HTMLDivElement> & {
+		phase?: ConversationCapacityPhase;
+		used?: number;
+		total?: number;
+		retained?: number;
+		condensedToolResults?: number;
+		setAsideTurns?: number;
+		open?: boolean;
+		threshold?: number;
+	} = $props();
+	const ratio = $derived(total && used !== undefined ? Math.max(0, Math.min(1, used / total)) : 0);
+	const hidden = $derived(phase === 'quiet' && ratio < threshold);
+	const label = $derived(
+		phase === 'preparing' || phase === 'compacting'
+			? 'Making room for this conversation…'
+			: phase === 'complete'
+				? 'Conversation space refreshed.'
+				: phase === 'failed'
+					? 'Conversation space could not be refreshed. You can continue safely.'
+					: 'Conversation capacity'
+	);
+</script>
+
+{#if !hidden}
+	<Collapsible.Root bind:open class={cn('min-w-0', className)}>
+		<Collapsible.Trigger
+			class="flex h-control w-full items-center gap-gutter px-inset-control text-left text-body"
+		>
+			{#if phase === 'preparing' || phase === 'compacting'}<LoaderCircle
+					class="size-icon shrink-0 animate-spin text-primary"
+					aria-hidden="true"
+				/>
+			{:else if phase === 'complete'}<CircleCheck
+					class="size-icon shrink-0 text-success"
+					aria-hidden="true"
+				/>
+			{:else if phase === 'failed'}<CircleAlert
+					class="size-icon shrink-0 text-warning"
+					aria-hidden="true"
+				/>{/if}
+			<span class="min-w-0 flex-1 truncate">{label}</span>
+			{#if total && used !== undefined}<span class="shrink-0 text-muted tabular-nums"
+					>{Math.round(ratio * 100)}%</span
+				>{/if}
+		</Collapsible.Trigger>
+		{#if total && used !== undefined}<div
+				class="mx-inset-control h-1 overflow-hidden rounded-full bg-well"
+			>
+				<div
+					class="h-full bg-primary duration-base motion-safe:transition-[width]"
+					style={`width: ${ratio * 100}%`}
+				></div>
+			</div>{/if}
+		<Collapsible.Content class="overflow-hidden"
+			><div
+				class="flex flex-wrap gap-x-panel gap-y-gutter px-inset-control py-gutter text-body text-muted"
+			>
+				{#if retained !== undefined}<span>{retained} retained</span
+					>{/if}{#if condensedToolResults !== undefined}<span
+						>{condensedToolResults} older tool results condensed</span
+					>{/if}{#if setAsideTurns !== undefined}<span>{setAsideTurns} earlier turns set aside</span
+					>{/if}
+			</div></Collapsible.Content
+		>
+	</Collapsible.Root>
+{/if}

package/dist/ai/context/conversation-capacity.svelte.d.ts

@@ -0,0 +1,15 @@
+export type ConversationCapacityPhase = 'quiet' | 'preparing' | 'compacting' | 'complete' | 'failed';
+import type { HTMLAttributes } from 'svelte/elements';
+type $$ComponentProps = HTMLAttributes<HTMLDivElement> & {
+    phase?: ConversationCapacityPhase;
+    used?: number;
+    total?: number;
+    retained?: number;
+    condensedToolResults?: number;
+    setAsideTurns?: number;
+    open?: boolean;
+    threshold?: number;
+};
+declare const ConversationCapacity: import("svelte").Component<$$ComponentProps, {}, "open">;
+type ConversationCapacity = ReturnType<typeof ConversationCapacity>;
+export default ConversationCapacity;

package/dist/ai/context/index.d.ts

@@ -1 +1,2 @@
 export { default as Root } from './context.svelte';
+export { default as Capacity, type ConversationCapacityPhase } from './conversation-capacity.svelte';

package/dist/ai/context/index.js

@@ -1 +1,2 @@
 export { default as Root } from './context.svelte';
+export { default as Capacity } from './conversation-capacity.svelte';

package/dist/ai/index.d.ts

@@ -22,6 +22,7 @@ export * as Swarm from './swarm/index.js';
 export * as CodeMode from './code-mode/index.js';
 export { Response, repairStreamingMarkdown } from './response/index.js';
 export { default as ContextGauge } from './context/context.svelte';
+export * as Context from './context/index.js';
 export { default as ModelSelector } from './model-selector/model-selector.svelte';
 export type { ModelGroup, ModelOption } from './model-selector/index.js';
 export { default as OpenInChat, providers as openInProviders } from './open-in-chat/open-in-chat.svelte';

package/dist/ai/index.js

@@ -27,6 +27,7 @@ export * as Swarm from './swarm/index.js';
 export * as CodeMode from './code-mode/index.js';
 export { Response, repairStreamingMarkdown } from './response/index.js';
 export { default as ContextGauge } from './context/context.svelte';
+export * as Context from './context/index.js';
 export { default as ModelSelector } from './model-selector/model-selector.svelte';
 export { default as OpenInChat, providers as openInProviders } from './open-in-chat/open-in-chat.svelte';
 export { default as WebPreview } from './web-preview/web-preview.svelte';

package/dist/ai/model-selector/index.d.ts

@@ -1,2 +1,9 @@
+import * as Dialog from '../../ui/dialog/index.js';
+import * as Command from '../../ui/command/index.js';
 export { default as Root } from './model-selector.svelte';
+/** Composable dialog parts for applications that need a custom picker trigger or layout. */
+export declare const Trigger: typeof Dialog.Trigger;
+export declare const Content: typeof Dialog.Content;
+export declare const Group: typeof Command.Group;
+export declare const Item: typeof Command.Item;
 export type { ModelGroup, ModelOption } from './model-selector.svelte';

package/dist/ai/model-selector/index.js

@@ -1 +1,8 @@
+import * as Dialog from '../../ui/dialog/index.js';
+import * as Command from '../../ui/command/index.js';
 export { default as Root } from './model-selector.svelte';
+/** Composable dialog parts for applications that need a custom picker trigger or layout. */
+export const Trigger = Dialog.Trigger;
+export const Content = Dialog.Content;
+export const Group = Command.Group;
+export const Item = Command.Item;

package/dist/ai/model-selector/model-selector.svelte

@@ -24,6 +24,7 @@
 	import * as Dialog from '../../ui/dialog/index.js';
 	import * as Command from '../../ui/command/index.js';
 	import Search from '@lucide/svelte/icons/search';
+	import ChevronDown from '@lucide/svelte/icons/chevron-down';
 	import { cn } from '../../utils/index.js';
 
 	let {
@@ -32,6 +33,8 @@
 		groups,
 		value = $bindable(''),
 		offline = false,
+		shortLabel = false,
+		showTrigger = true,
 		onSelect,
 		class: className
 	}: {
@@ -43,14 +46,39 @@
 		value?: string;
 		/** Never loads remote logo URLs; local icon snippets continue to render. */
 		offline?: boolean;
+		/** Use the provider/name only label when the picker sits in a narrow toolbar. */
+		shortLabel?: boolean;
+		/** Set false when composing a custom Dialog trigger around this picker. */
+		showTrigger?: boolean;
 		onSelect?: (id: string, model: ModelOption) => void;
 		class?: string;
 	} = $props();
 
 	const visibleGroups = $derived(groups ?? [{ id: 'models', label: 'Models', models }]);
+	const selected = $derived(
+		visibleGroups.flatMap((group) => group.models).find((model) => model.id === value)
+	);
 </script>
 
 <Dialog.Root bind:open>
+	{#if showTrigger}
+		<Dialog.Trigger
+			size="control"
+			disabled={offline || !selected}
+			aria-label={selected ? `Choose model, current ${selected.name}` : 'Choose model'}
+			aria-haspopup="dialog"
+		>
+			{#if selected?.icon}{@render selected.icon()}{/if}
+			<span class="min-w-0 truncate"
+				>{shortLabel
+					? (selected?.name ?? 'Model')
+					: selected?.provider
+						? `${selected.provider} · ${selected.name}`
+						: (selected?.name ?? 'Choose model')}</span
+			>
+			<ChevronDown class="size-icon shrink-0 text-muted" aria-hidden="true" />
+		</Dialog.Trigger>
+	{/if}
 	<Dialog.Content class={cn('max-w-md p-gutter', className)}>
 		<Command.Root bare>
 			<Command.Input icon={Search} placeholder="Search models…" autofocus />

package/dist/ai/model-selector/model-selector.svelte.d.ts

@@ -24,6 +24,10 @@ type $$ComponentProps = {
     value?: string;
     /** Never loads remote logo URLs; local icon snippets continue to render. */
     offline?: boolean;
+    /** Use the provider/name only label when the picker sits in a narrow toolbar. */
+    shortLabel?: boolean;
+    /** Set false when composing a custom Dialog trigger around this picker. */
+    showTrigger?: boolean;
     onSelect?: (id: string, model: ModelOption) => void;
     class?: string;
 };

package/dist/ai/run-status/run-status.svelte

@@ -1,7 +1,20 @@
 <script lang="ts" module>
 	/** Aggregate run lifecycle. `running` pulses; the three active states
 	 *  (queued/running/awaiting) surface the Cancel affordance. */
-	export type RunState = 'idle' | 'queued' | 'running' | 'awaiting' | 'done' | 'error';
+	export type RunState =
+		| 'idle'
+		| 'queued'
+		| 'running'
+		| 'thinking'
+		| 'tool'
+		| 'browser'
+		| 'compacting'
+		| 'speaking'
+		| 'cancelling'
+		| 'awaiting'
+		| 'done'
+		| 'cancelled'
+		| 'error';
 
 	/** Tone for the latest-log line — reuses the era semantic palette. */
 	export type LogTone = 'default' | 'muted' | 'success' | 'warning' | 'destructive';
@@ -25,6 +38,30 @@
 		idle: { label: 'idle', dot: 'bg-muted', text: 'text-muted', active: false, pulse: false },
 		queued: { label: 'queued', dot: 'bg-muted', text: 'text-muted', active: true, pulse: false },
 		running: { label: 'running', dot: 'bg-primary', text: 'text-fg', active: true, pulse: true },
+		thinking: { label: 'thinking', dot: 'bg-primary', text: 'text-fg', active: true, pulse: true },
+		tool: { label: 'using a tool', dot: 'bg-primary', text: 'text-fg', active: true, pulse: true },
+		browser: {
+			label: 'working in browser',
+			dot: 'bg-primary',
+			text: 'text-fg',
+			active: true,
+			pulse: true
+		},
+		compacting: {
+			label: 'making room',
+			dot: 'bg-primary',
+			text: 'text-fg',
+			active: true,
+			pulse: true
+		},
+		speaking: { label: 'speaking', dot: 'bg-primary', text: 'text-fg', active: true, pulse: true },
+		cancelling: {
+			label: 'stopping',
+			dot: 'bg-muted',
+			text: 'text-muted',
+			active: true,
+			pulse: true
+		},
 		awaiting: {
 			label: 'awaiting',
 			dot: 'bg-warning',
@@ -33,6 +70,13 @@
 			pulse: false
 		},
 		done: { label: 'done', dot: 'bg-success', text: 'text-success', active: false, pulse: false },
+		cancelled: {
+			label: 'stopped',
+			dot: 'bg-muted',
+			text: 'text-muted',
+			active: false,
+			pulse: false
+		},
 		error: {
 			label: 'error',
 			dot: 'bg-destructive',

package/dist/ai/run-status/run-status.svelte.d.ts

@@ -1,6 +1,6 @@
 /** Aggregate run lifecycle. `running` pulses; the three active states
  *  (queued/running/awaiting) surface the Cancel affordance. */
-export type RunState = 'idle' | 'queued' | 'running' | 'awaiting' | 'done' | 'error';
+export type RunState = 'idle' | 'queued' | 'running' | 'thinking' | 'tool' | 'browser' | 'compacting' | 'speaking' | 'cancelling' | 'awaiting' | 'done' | 'cancelled' | 'error';
 /** Tone for the latest-log line — reuses the era semantic palette. */
 export type LogTone = 'default' | 'muted' | 'success' | 'warning' | 'destructive';
 export interface RunTools {

package/dist/ai/tool/index.d.ts

@@ -5,4 +5,5 @@ export { default as Output } from './tool-output.svelte';
 export { default as Chip } from './tool-chip.svelte';
 export { default as Chips } from './tool-chips.svelte';
 export { default as Exec } from './tool-exec.svelte';
+export { default as Inspector, toolValue, type ToolMetric, type ToolPresentation } from './tool-inspector.svelte';
 export { Content, Section } from '../../ui/step/index.js';

package/dist/ai/tool/index.js

@@ -5,4 +5,5 @@ export { default as Output } from './tool-output.svelte';
 export { default as Chip } from './tool-chip.svelte';
 export { default as Chips } from './tool-chips.svelte';
 export { default as Exec } from './tool-exec.svelte';
+export { default as Inspector, toolValue } from './tool-inspector.svelte';
 export { Content, Section } from '../../ui/step/index.js';

package/dist/ai/tool/tool-header.svelte

@@ -5,16 +5,23 @@
 
 	let {
 		type,
+		icon,
 		children
 	}: {
 		/** The tool name, e.g. `search_flights`. */
 		type: string;
+		/** Optional local category icon; avoids any remote asset dependency. */
+		icon?: Snippet;
 		children?: Snippet;
 	} = $props();
 </script>
 
 <Step.Summary>
-	<Wrench class="size-icon shrink-0" aria-hidden="true" />
+	{#if icon}
+		{@render icon()}
+	{:else}
+		<Wrench class="size-icon shrink-0" aria-hidden="true" />
+	{/if}
 	<span class="truncate text-fg">{type}</span>
 	{@render children?.()}
 </Step.Summary>

package/dist/ai/tool/tool-header.svelte.d.ts

@@ -2,6 +2,8 @@ import type { Snippet } from 'svelte';
 type $$ComponentProps = {
     /** The tool name, e.g. `search_flights`. */
     type: string;
+    /** Optional local category icon; avoids any remote asset dependency. */
+    icon?: Snippet;
     children?: Snippet;
 };
 declare const ToolHeader: import("svelte").Component<$$ComponentProps, {}, "">;

package/dist/ai/tool/tool-inspector.svelte

@@ -0,0 +1,236 @@
+<script lang="ts" module>
+	export interface ToolMetric {
+		label: string;
+		value: string | number;
+	}
+
+	/** Provider-neutral semantic presentation. Applications own all fetching and actions. */
+	export type ToolPresentation =
+		| { kind: 'generic' }
+		| { kind: 'code'; execution: import('../code-mode/types.js').CodeModeExecution }
+		| { kind: 'shell'; command?: string; stdout?: string; stderr?: string; exitCode?: number }
+		| { kind: 'table'; columns: string[]; rows: unknown[][]; maxRows?: number }
+		| { kind: 'chart'; description?: string }
+		| { kind: 'app'; label?: string; description?: string }
+		| {
+				kind: 'artifact';
+				name: string;
+				mimeType: string;
+				size?: string;
+				available?: boolean;
+		  };
+
+	export function toolValue(
+		value: unknown,
+		limit = 12_000
+	): {
+		value: unknown;
+		raw: string;
+		truncated: boolean;
+		encodedError?: string;
+	} {
+		let resolved = value;
+		if (typeof value === 'string') {
+			try {
+				resolved = JSON.parse(value);
+			} catch {
+				// A plain string remains a useful, valid raw result.
+			}
+		}
+		const encoded =
+			resolved && typeof resolved === 'object' && !Array.isArray(resolved)
+				? (resolved as Record<string, unknown>)
+				: undefined;
+		const encodedError =
+			encoded && (encoded.success === false || encoded.isError === true)
+				? String(encoded.error ?? encoded.message ?? 'Tool reported an error')
+				: undefined;
+		const raw =
+			typeof resolved === 'string' ? resolved : (JSON.stringify(resolved, null, 2) ?? 'null');
+		return {
+			value: resolved,
+			raw: raw.length > limit ? `${raw.slice(0, limit)}\n… truncated` : raw,
+			truncated: raw.length > limit,
+			encodedError
+		};
+	}
+</script>
+
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import * as Tabs from '../../ui/tabs/index.js';
+	import * as Table from '../../ui/table/index.js';
+	import { CodeBlock } from '../../ui/code-block/index.js';
+	import { CopyButton } from '../../ui/copy-button/index.js';
+	import { cn } from '../../utils/index.js';
+	import * as CodeMode from '../code-mode/index.js';
+	import * as StructuredValue from '../structured-value/index.js';
+	import Root from './tool.svelte';
+	import Header from './tool-header.svelte';
+
+	let {
+		name,
+		status = 'pending',
+		input,
+		output,
+		error,
+		durationMs,
+		metrics = [],
+		presentation = { kind: 'generic' },
+		icon,
+		chart,
+		actions,
+		open = $bindable(false),
+		class: className
+	}: {
+		name: string;
+		status?: import('./tool.svelte').ToolStatus;
+		input?: unknown;
+		output?: unknown;
+		error?: string;
+		durationMs?: number;
+		metrics?: ToolMetric[];
+		presentation?: ToolPresentation;
+		icon?: Snippet;
+		/** A trusted application chart; the raw result always remains available. */
+		chart?: Snippet<[unknown]>;
+		actions?: Snippet;
+		open?: boolean;
+		class?: string;
+	} = $props();
+
+	let rawView = $state<'structured' | 'raw'>('structured');
+	let search = $state('');
+	const resultPayload = $derived(toolValue(output));
+	const reportedError = $derived(error ?? resultPayload.encodedError);
+	const visibleRaw = $derived(
+		search
+			? resultPayload.raw
+					.split('\n')
+					.filter((line) => line.toLowerCase().includes(search.toLowerCase()))
+					.join('\n')
+			: resultPayload.raw
+	);
+	const tableRows = $derived(
+		presentation.kind === 'table' ? presentation.rows.slice(0, presentation.maxRows ?? 100) : []
+	);
+	const active = $derived(
+		status === 'pending' || status === 'running' || status === 'approval-required'
+	);
+</script>
+
+{#snippet inputDetail()}
+	<StructuredValue.Root value={toolValue(input).value} />
+{/snippet}
+
+<Root
+	bind:open
+	{status}
+	input={input === undefined ? undefined : inputDetail}
+	class={cn('min-w-0', className)}
+>
+	{#snippet header()}
+		<Header type={name} {icon}>
+			{#if active}<span
+					class="ml-auto size-1.5 shrink-0 rounded-full bg-primary motion-safe:animate-pulse"
+					aria-label="active"
+				></span>{/if}
+			{#if durationMs !== undefined}<span class="ml-auto shrink-0 text-muted tabular-nums"
+					>{durationMs}ms</span
+				>{/if}
+			{#each metrics.slice(0, 2) as metric (metric.label)}
+				<span class="shrink-0 text-muted tabular-nums">{metric.value} {metric.label}</span>
+			{/each}
+		</Header>
+	{/snippet}
+	{#snippet result()}
+		{#if presentation.kind === 'code'}
+			<CodeMode.Root {...presentation.execution} />
+		{:else if presentation.kind === 'shell'}
+			<div class="flex flex-col gap-panel">
+				{#if presentation.command}<CodeBlock code={`$ ${presentation.command}`} />{/if}
+				{#if presentation.stdout}<CodeBlock code={presentation.stdout} />{/if}
+				{#if presentation.stderr}<p class="text-body whitespace-pre-wrap text-destructive">
+						{presentation.stderr}
+					</p>{/if}
+				{#if presentation.exitCode !== undefined}<p class="text-body text-muted">
+						exit code {presentation.exitCode}
+					</p>{/if}
+			</div>
+		{:else if presentation.kind === 'table'}
+			<div class="flex flex-col gap-gutter">
+				<p class="text-body text-muted">
+					{presentation.rows.length} rows · {presentation.columns.length} columns
+				</p>
+				<div class="overflow-auto">
+					<Table.Root
+						><Table.Head
+							><Table.Row
+								>{#each presentation.columns as column (column)}<Table.HeadCell
+										>{column}</Table.HeadCell
+									>{/each}</Table.Row
+							></Table.Head
+						><Table.Body
+							>{#each tableRows as row, i (i)}<Table.Row
+									>{#each row as cell, j (j)}<Table.Cell>{String(cell ?? '')}</Table.Cell
+										>{/each}</Table.Row
+								>{/each}</Table.Body
+						></Table.Root
+					>
+				</div>
+				{#if tableRows.length < presentation.rows.length}<p class="text-body text-muted">
+						Showing the first {tableRows.length} rows.
+					</p>{/if}
+			</div>
+		{:else if presentation.kind === 'chart' && chart}
+			{@render chart(resultPayload.value)}
+		{:else if presentation.kind === 'app'}
+			<p class="text-body text-muted">
+				{presentation.description ?? `${presentation.label ?? name} opened a visual destination.`}
+			</p>
+		{:else if presentation.kind === 'artifact'}
+			<div class="flex flex-wrap items-center gap-gutter text-body">
+				<strong class="text-fg">{presentation.name}</strong><span class="text-muted"
+					>{presentation.mimeType}</span
+				>{#if presentation.size}<span class="text-muted">{presentation.size}</span>{/if}<span
+					class={presentation.available === false ? 'text-warning' : 'text-success'}
+					>{presentation.available === false ? 'unavailable' : 'available'}</span
+				>{@render actions?.()}
+			</div>
+		{:else if output !== undefined}
+			<Tabs.Root bind:value={rawView}>
+				<Tabs.List
+					><Tabs.Trigger value="structured">structured</Tabs.Trigger><Tabs.Trigger value="raw"
+						>raw</Tabs.Trigger
+					></Tabs.List
+				>
+				<Tabs.Content value="structured" class="pt-panel"
+					><StructuredValue.Root value={resultPayload.value} /></Tabs.Content
+				>
+				<Tabs.Content value="raw" class="flex flex-col gap-gutter pt-panel"
+					><div class="flex gap-gutter">
+						<input
+							aria-label="Search raw output"
+							bind:value={search}
+							placeholder="Search"
+							class="min-w-0 flex-1 bg-well px-inset-control text-body outline-none"
+						/><CopyButton text={resultPayload.raw} label="Copy raw output" />
+					</div>
+					<CodeBlock
+						code={visibleRaw || 'No matching lines'}
+						class="whitespace-pre-wrap"
+					/></Tabs.Content
+				>
+			</Tabs.Root>
+		{/if}
+		{#if resultPayload.truncated}<p class="mt-gutter text-body text-muted">
+				Raw output is bounded to keep this transcript responsive.
+			</p>{/if}
+		{#if reportedError}<p
+				role="alert"
+				class="mt-gutter text-body whitespace-pre-wrap text-destructive"
+			>
+				{reportedError}
+			</p>{/if}
+	{/snippet}
+</Root>

package/dist/ai/tool/tool-inspector.svelte.d.ts

@@ -0,0 +1,61 @@
+export interface ToolMetric {
+    label: string;
+    value: string | number;
+}
+/** Provider-neutral semantic presentation. Applications own all fetching and actions. */
+export type ToolPresentation = {
+    kind: 'generic';
+} | {
+    kind: 'code';
+    execution: import('../code-mode/types.js').CodeModeExecution;
+} | {
+    kind: 'shell';
+    command?: string;
+    stdout?: string;
+    stderr?: string;
+    exitCode?: number;
+} | {
+    kind: 'table';
+    columns: string[];
+    rows: unknown[][];
+    maxRows?: number;
+} | {
+    kind: 'chart';
+    description?: string;
+} | {
+    kind: 'app';
+    label?: string;
+    description?: string;
+} | {
+    kind: 'artifact';
+    name: string;
+    mimeType: string;
+    size?: string;
+    available?: boolean;
+};
+export declare function toolValue(value: unknown, limit?: number): {
+    value: unknown;
+    raw: string;
+    truncated: boolean;
+    encodedError?: string;
+};
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    name: string;
+    status?: import('./tool.svelte').ToolStatus;
+    input?: unknown;
+    output?: unknown;
+    error?: string;
+    durationMs?: number;
+    metrics?: ToolMetric[];
+    presentation?: ToolPresentation;
+    icon?: Snippet;
+    /** A trusted application chart; the raw result always remains available. */
+    chart?: Snippet<[unknown]>;
+    actions?: Snippet;
+    open?: boolean;
+    class?: string;
+};
+declare const ToolInspector: import("svelte").Component<$$ComponentProps, {}, "open">;
+type ToolInspector = ReturnType<typeof ToolInspector>;
+export default ToolInspector;