@calliopelabs/ui 0.14.0 → 0.18.0

package/dist/agent/controller.js

@@ -43,6 +43,8 @@ export class AgentController {
     visible = true;
     read = 0;
     snapshot;
+    /** Where each custom event arrived, by its index in the view. */
+    anchors = [];
     disposed = false;
     connected = false;
     threadSeq = 0;
@@ -140,8 +142,32 @@ export class AgentController {
             unread: Math.max(0, this.finishedAnswers() - this.read),
             suggestions,
             tools: [...this.tools.values()].sort((a, b) => a.order - b.order).map((t) => t.tool),
+            custom: this.customItems(),
         };
     }
+    customItems() {
+        const items = new Map();
+        this.view.custom.forEach((event, i) => {
+            const value = event.value;
+            const id = typeof value === "object" && value !== null && typeof value.id === "string";
+            const key = id ? `${event.name}:${value.id}` : `${event.name}#${i}`;
+            const item = items.get(key);
+            if (item) {
+                item.value = event.value;
+                item.history.push(event.value);
+            }
+            else {
+                items.set(key, {
+                    key,
+                    name: event.name,
+                    value: event.value,
+                    history: [event.value],
+                    after: this.anchors[i] ?? null,
+                });
+            }
+        });
+        return [...items.values()];
+    }
     bind() {
         const agent = this.engine.agent;
         this.unsubscribe();
@@ -160,6 +186,7 @@ export class AgentController {
     /** The view the agent's own messages and state make, for a fresh start or a thread switch. */
     fromAgent(threadId) {
         const agent = this.engine.agent;
+        this.anchors = [];
         let view = { ...createChatView(), threadId };
         if (agent.messages.length > 0) {
             view = reduceChat(view, {
@@ -180,7 +207,12 @@ export class AgentController {
         if (this.halted && event.type !== EventType.RUN_STARTED)
             return;
         this.halted = false;
+        const before = this.view.custom.length;
         this.view = reduceChat(this.view, event);
+        if (this.view.custom.length > before) {
+            const last = this.view.timeline.at(-1);
+            this.anchors.push(last ? `${last.kind}:${last.id}` : null);
+        }
         this.emit();
     }
     /** Tool results the agent's messages gained outside the event stream: the browser's own tools. */
@@ -435,6 +467,7 @@ export class AgentController {
         this.agent.setMessages([]);
         this.agent.setState({});
         this.failed.clear();
+        this.anchors = [];
         this.view = { ...createChatView(), threadId: id };
         this.emit();
         return id;

package/dist/agent/copilotkit/CopilotKitAgentProvider.js

@@ -38,13 +38,13 @@ export function createCopilotKitEngine(copilotkit, agent, invoke, agentId) {
         },
         setTools(next) {
             clearTools();
-            for (const tool of next) {
+            // A render-only tool (available: false) draws the agent's own calls; CopilotKit must not run it.
+            for (const tool of next.filter((t) => t.available !== false)) {
                 copilotkit.addTool({
                     name: tool.name,
                     ...(tool.description !== undefined ? { description: tool.description } : {}),
                     parameters: toolStandardSchema(tool),
                     ...(tool.followUp !== undefined ? { followUp: tool.followUp } : {}),
-                    ...(tool.available !== undefined ? { available: tool.available } : {}),
                     ...(agentId ? { agentId } : {}),
                     handler: (args, ctx) => invoke(tool, args, {
                         toolCallId: ctx.toolCall.id,

package/dist/agent/index.d.ts

@@ -4,12 +4,14 @@
  * `@ag-ui/client`, which the package's main entry never loads. For a
  * CopilotKit runtime, see `@calliopelabs/ui/agent/copilotkit`.
  */
-export { AgentController, agentId, type AgentContextEntry, type AgentControllerOptions, type AgentSnapshot, type AgentSuggestion, type AgentThread, type SendOptions, } from "./controller.js";
+export { AgentController, agentId, type AgentContextEntry, type AgentCustomItem, type AgentControllerOptions, type AgentSnapshot, type AgentSuggestion, type AgentThread, type SendOptions, } from "./controller.js";
 export { createDirectEngine, type AgentEngine, type EngineRunInput, type ToolInvoker, } from "./engine.js";
 export { defineTool, isStandardSchema, toolJsonSchema, toolResultText, toolStandardSchema, validateToolArgs, type AgentTool, type AgentToolContext, type AgentToolRenderProps, type JsonSchema, type StandardSchemaV1, } from "./tool.js";
 export { CalliopeAgentProvider, useAgentController, useAgentReadable, useAgentSuggestions, useAgentTool, useCalliopeAgent, type CalliopeAgentApi, type CalliopeAgentOptions, type CalliopeAgentProviderProps, } from "./AgentProvider.js";
-export { createMockAgent, textEvents, toolCallEvents, type MockAgentOptions, type MockTurn, } from "./mock.js";
+export { createFunctionAgent, createMockAgent, type AgentRunFunction, type FunctionAgentOptions, textEvents, toolCallEvents, type MockAgentOptions, type MockTurn, } from "./mock.js";
 export { AgentChat, NewConversationButton, type AgentChatProps } from "./AgentChat.js";
 export { AgentLauncher, type AgentLauncherProps } from "./AgentLauncher.js";
 export { CalliopeAgent, type CalliopeAgentMode, type CalliopeAgentProps } from "./CalliopeAgent.js";
 export { shortcutLabel, useMediaQuery, useOpenState, useShortcut } from "./surface.js";
+export { mergeRenderers, parseResult, type AgentRenderers, type CustomRendererProps, type InterruptRendererProps, type StateRendererProps, type ToolRendererProps, } from "./renderers.js";
+export { ArtifactReviewCard, InterruptCard, QuestionInterruptCard, RunProgressCard, workflowRenderers, type ArtifactReviewValue, type ArtifactValue, type QuestionInterruptMetadata, type RunProgressValue, } from "./WorkflowRenderers.js";

package/dist/agent/index.js

@@ -8,8 +8,10 @@ export { AgentController, agentId, } from "./controller.js";
 export { createDirectEngine, } from "./engine.js";
 export { defineTool, isStandardSchema, toolJsonSchema, toolResultText, toolStandardSchema, validateToolArgs, } from "./tool.js";
 export { CalliopeAgentProvider, useAgentController, useAgentReadable, useAgentSuggestions, useAgentTool, useCalliopeAgent, } from "./AgentProvider.js";
-export { createMockAgent, textEvents, toolCallEvents, } from "./mock.js";
+export { createFunctionAgent, createMockAgent, textEvents, toolCallEvents, } from "./mock.js";
 export { AgentChat, NewConversationButton } from "./AgentChat.js";
 export { AgentLauncher } from "./AgentLauncher.js";
 export { CalliopeAgent } from "./CalliopeAgent.js";
 export { shortcutLabel, useMediaQuery, useOpenState, useShortcut } from "./surface.js";
+export { mergeRenderers, parseResult, } from "./renderers.js";
+export { ArtifactReviewCard, InterruptCard, QuestionInterruptCard, RunProgressCard, workflowRenderers, } from "./WorkflowRenderers.js";

package/dist/agent/mock.d.ts

@@ -1,8 +1,9 @@
 /**
- * A mock AG-UI agent for Storybook and tests: a real `@ag-ui/client`
- * `HttpAgent` whose fetch is answered from a script instead of the network,
- * as a server-sent event stream. The client's own parser, verifier and
- * message bookkeeping run exactly as they do against a live endpoint.
+ * Agents from functions: `createFunctionAgent` adapts any function that
+ * produces AG-UI events (a non-AG-UI backend, wrapped), and `createMockAgent`
+ * plays recorded turns for Storybook and tests. Both are a real
+ * `@ag-ui/client` `HttpAgent` whose fetch is answered in the page as a
+ * server-sent event stream, never over the network.
  */
 import { HttpAgent } from "@ag-ui/client";
 import { type Message, type RunAgentInput } from "@ag-ui/core";
@@ -23,6 +24,27 @@ export interface MockAgentOptions {
     /** Every request's input, for a test to read. */
     onRequest?: (input: RunAgentInput) => void;
 }
+/**
+ * The events of one run, as a function produces them: a list, a promise of
+ * one, or an async iterable that yields them as they come. The run's start
+ * and finish are added unless the function emits them.
+ */
+export type AgentRunFunction = (input: RunAgentInput, signal: AbortSignal) => Iterable<AgUiEvent> | AsyncIterable<AgUiEvent> | Promise<Iterable<AgUiEvent>>;
+export interface FunctionAgentOptions {
+    threadId?: string;
+    initialMessages?: Message[];
+    initialState?: unknown;
+    /** Pause before each event, in ms (a recording played back at reading speed). */
+    delay?: number;
+}
+/**
+ * An AG-UI agent from a function: the adapter for a backend that does not
+ * speak AG-UI yet (a request and response endpoint, a custom stream), and
+ * the base of `createMockAgent`. It is a real `HttpAgent` whose transport is
+ * the function, so the client's parser, verifier and message bookkeeping run
+ * as they do against a live endpoint, and `stop` aborts `signal`.
+ */
+export declare function createFunctionAgent(run: AgentRunFunction, { threadId, initialMessages, initialState, delay }?: FunctionAgentOptions): HttpAgent;
 /** An agent that answers from `turns`, streaming each event as SSE. */
 export declare function createMockAgent({ turns, delay, threadId, initialMessages, initialState, onRequest, }: MockAgentOptions): HttpAgent;
 /** An assistant's streamed reply, in `chunks`, as the events that make it. */

package/dist/agent/mock.js

@@ -1,8 +1,9 @@
 /**
- * A mock AG-UI agent for Storybook and tests: a real `@ag-ui/client`
- * `HttpAgent` whose fetch is answered from a script instead of the network,
- * as a server-sent event stream. The client's own parser, verifier and
- * message bookkeeping run exactly as they do against a live endpoint.
+ * Agents from functions: `createFunctionAgent` adapts any function that
+ * produces AG-UI events (a non-AG-UI backend, wrapped), and `createMockAgent`
+ * plays recorded turns for Storybook and tests. Both are a real
+ * `@ag-ui/client` `HttpAgent` whose fetch is answered in the page as a
+ * server-sent event stream, never over the network.
  */
 import { HttpAgent } from "@ag-ui/client";
 import { EventType } from "@ag-ui/core";
@@ -16,56 +17,66 @@ const sleep = (ms, signal) => new Promise((resolve, reject) => {
         reject(new DOMException("Aborted", "AbortError"));
     }, { once: true });
 });
-/** Wraps a turn's events in its run's start and, unless they end it, its finish. */
-function framed(input, events) {
-    const ends = events.some((e) => e.type === EventType.RUN_FINISHED || e.type === EventType.RUN_ERROR);
-    return [
-        { type: EventType.RUN_STARTED, threadId: input.threadId, runId: input.runId },
-        ...events,
-        ...(ends
-            ? []
-            : [
-                {
-                    type: EventType.RUN_FINISHED,
-                    threadId: input.threadId,
-                    runId: input.runId,
-                },
-            ]),
-    ];
+async function* eventsOf(output) {
+    if (Symbol.asyncIterator in output)
+        yield* output;
+    else
+        yield* output;
 }
-/** An agent that answers from `turns`, streaming each event as SSE. */
-export function createMockAgent({ turns, delay = 30, threadId, initialMessages, initialState, onRequest, }) {
-    let turn = 0;
+/**
+ * An AG-UI agent from a function: the adapter for a backend that does not
+ * speak AG-UI yet (a request and response endpoint, a custom stream), and
+ * the base of `createMockAgent`. It is a real `HttpAgent` whose transport is
+ * the function, so the client's parser, verifier and message bookkeeping run
+ * as they do against a live endpoint, and `stop` aborts `signal`.
+ */
+export function createFunctionAgent(run, { threadId, initialMessages, initialState, delay = 0 } = {}) {
     const fetch = async (_url, init) => {
         const input = JSON.parse(String(init.body));
-        onRequest?.(input);
-        const index = turn++;
-        const script = turns[Math.min(index, turns.length - 1)] ?? [];
-        const events = framed(input, typeof script === "function" ? script(input, index) : script);
-        const signal = init.signal;
+        const signal = init.signal ?? new AbortController().signal;
         const body = new ReadableStream({
             async start(controller) {
                 try {
-                    for (const event of events) {
+                    let ended = false;
+                    controller.enqueue(encoder.encode(`data: ${JSON.stringify({ type: EventType.RUN_STARTED, threadId: input.threadId, runId: input.runId })}\n\n`));
+                    const output = run(input, signal);
+                    const source = output instanceof Promise ? await output : output;
+                    for await (const event of eventsOf(source)) {
                         if (delay > 0)
                             await sleep(delay, signal);
-                        else
-                            await Promise.resolve();
-                        if (signal?.aborted)
+                        if (signal.aborted)
                             throw new DOMException("Aborted", "AbortError");
+                        if (event.type === EventType.RUN_STARTED)
+                            continue;
+                        if (event.type === EventType.RUN_FINISHED || event.type === EventType.RUN_ERROR)
+                            ended = true;
                         controller.enqueue(encoder.encode(`data: ${JSON.stringify(event)}\n\n`));
                     }
+                    if (!ended) {
+                        const finished = {
+                            type: EventType.RUN_FINISHED,
+                            threadId: input.threadId,
+                            runId: input.runId,
+                        };
+                        controller.enqueue(encoder.encode(`data: ${JSON.stringify(finished)}\n\n`));
+                    }
                     controller.close();
                 }
                 catch (error) {
-                    controller.error(error);
+                    if (signal.aborted)
+                        controller.error(error);
+                    else {
+                        const failed = {
+                            type: EventType.RUN_ERROR,
+                            message: error instanceof Error ? error.message : String(error),
+                        };
+                        controller.enqueue(encoder.encode(`data: ${JSON.stringify(failed)}\n\n`));
+                        controller.close();
+                    }
                 }
             },
         });
-        return new Response(body, {
-            status: 200,
-            headers: { "content-type": "text/event-stream" },
-        });
+        return new Response(body, { status: 200, headers: { "content-type": "text/event-stream" } });
     };
     return new HttpAgent({
         url: "https://agent.invalid/agui",
@@ -75,6 +86,26 @@ export function createMockAgent({ turns, delay = 30, threadId, initialMessages,
         ...(initialState !== undefined ? { initialState: initialState } : {}),
     });
 }
+/** An agent that answers from `turns`, streaming each event as SSE. */
+export function createMockAgent({ turns, delay = 30, threadId, initialMessages, initialState, onRequest, }) {
+    let turn = 0;
+    return createFunctionAgent(async function* (input) {
+        onRequest?.(input);
+        const index = turn++;
+        const script = turns[Math.min(index, turns.length - 1)] ?? [];
+        const events = typeof script === "function" ? script(input, index) : script;
+        // Yield once first, so even a delay of 0 streams instead of arriving in one piece.
+        for (const event of events) {
+            await Promise.resolve();
+            yield event;
+        }
+    }, {
+        delay,
+        ...(threadId ? { threadId } : {}),
+        ...(initialMessages ? { initialMessages } : {}),
+        ...(initialState !== undefined ? { initialState } : {}),
+    });
+}
 /** An assistant's streamed reply, in `chunks`, as the events that make it. */
 export function textEvents(messageId, ...chunks) {
     return [

package/dist/agent/renderers.d.ts

@@ -0,0 +1,49 @@
+import type * as React from "react";
+import { type AgUiInterrupt, type ChatToolCall } from "../chat/model.js";
+import type { CalliopeAgentApi } from "./AgentProvider.js";
+import type { AgentToolRenderProps } from "./tool.js";
+/** What a tool renderer draws from: the call, its arguments and result, and the agent. */
+export interface ToolRendererProps<Args = unknown> extends AgentToolRenderProps<Args> {
+    /** The result parsed as JSON, or as text when it is not JSON. */
+    result: unknown;
+    agent: CalliopeAgentApi;
+}
+/** What a custom-event renderer draws from: the latest value of its event, and the agent. */
+export interface CustomRendererProps<Value = unknown> {
+    name: string;
+    value: Value;
+    /** Every value the event has had under this key, oldest first. */
+    history: readonly Value[];
+    agent: CalliopeAgentApi;
+}
+/** What an interrupt renderer draws from: the open interrupt and how to answer it. */
+export interface InterruptRendererProps {
+    interrupt: AgUiInterrupt;
+    /** Answers it; the run resumes once every open interrupt has an answer. */
+    resolve: (payload?: unknown) => void;
+    cancel: () => void;
+    agent: CalliopeAgentApi;
+}
+export interface StateRendererProps<State = unknown> {
+    state: State;
+    setState: (state: State) => void;
+    agent: CalliopeAgentApi;
+}
+/**
+ * Generative UI: host components for what the agent emits. A tool call by
+ * name (the agent's backend tools as well as the browser's), an AG-UI
+ * `CUSTOM` event by name (drawn where it arrived; an event carrying an `id`
+ * in its value replaces its earlier values in place, so progress updates
+ * one card), an interrupt by reason, and the shared state.
+ */
+export interface AgentRenderers {
+    tools?: Readonly<Record<string, React.ComponentType<ToolRendererProps<any>>>>;
+    custom?: Readonly<Record<string, React.ComponentType<CustomRendererProps<any>>>>;
+    interrupts?: Readonly<Record<string, React.ComponentType<InterruptRendererProps>>>;
+    /** Draws the shared state above the conversation. */
+    state?: React.ComponentType<StateRendererProps<any>>;
+}
+/** Several registries as one; a later one wins a name. */
+export declare function mergeRenderers(...registries: (AgentRenderers | undefined)[]): AgentRenderers;
+/** A tool's result as a renderer reads it. */
+export declare function parseResult(call: ChatToolCall): unknown;

package/dist/agent/renderers.js

@@ -0,0 +1,27 @@
+import { parseToolCallArgs } from "../chat/model.js";
+/* eslint-enable @typescript-eslint/no-explicit-any */
+/** Several registries as one; a later one wins a name. */
+export function mergeRenderers(...registries) {
+    const merged = {
+        tools: {},
+        custom: {},
+        interrupts: {},
+    };
+    for (const r of registries) {
+        if (!r)
+            continue;
+        merged.tools = { ...merged.tools, ...r.tools };
+        merged.custom = { ...merged.custom, ...r.custom };
+        merged.interrupts = { ...merged.interrupts, ...r.interrupts };
+        if (r.state)
+            merged.state = r.state;
+    }
+    return merged;
+}
+/** A tool's result as a renderer reads it. */
+export function parseResult(call) {
+    if (call.result === undefined)
+        return undefined;
+    const parsed = parseToolCallArgs(call.result);
+    return parsed === undefined ? call.result : parsed;
+}

package/dist/appearance/brands.d.ts

@@ -163,6 +163,23 @@ export declare const loadrBrand: {
         readonly light: "paper";
     };
 };
+/**
+ * Calliope AI Deep Data Agent: the family amber on a warm umber sidebar, with
+ * charcoal and mist as its defaults. A separate product from Chat Studio, and
+ * kept visibly apart from it (Studio blue on black and paper), from Astrolift
+ * (green), Zentinelle (teal) and Loadr (blue).
+ */
+export declare const deepDataAgentBrand: {
+    readonly id: "deep-data-agent";
+    readonly name: "Deep Data Agent";
+    readonly accent: "amber";
+    readonly sidebar: "#1a150c";
+    readonly grounds: readonly ["charcoal", "black", "graphite", "paper", "mist"];
+    readonly defaultGround: {
+        readonly dark: "charcoal";
+        readonly light: "mist";
+    };
+};
 /**
  * Cykick: cyan on near-black with square corners, from
  * `ui/theme/native-themes.json` (primary, background, radius 0). Cykick's

package/dist/appearance/brands.js

@@ -101,6 +101,20 @@ export const loadrBrand = {
     grounds: ["black", "charcoal", "graphite", "paper", "mist"],
     defaultGround: { dark: "charcoal", light: "paper" },
 };
+/**
+ * Calliope AI Deep Data Agent: the family amber on a warm umber sidebar, with
+ * charcoal and mist as its defaults. A separate product from Chat Studio, and
+ * kept visibly apart from it (Studio blue on black and paper), from Astrolift
+ * (green), Zentinelle (teal) and Loadr (blue).
+ */
+export const deepDataAgentBrand = {
+    id: "deep-data-agent",
+    name: "Deep Data Agent",
+    accent: "amber",
+    sidebar: TOKENS.brand["deep-data-agent"].sidebar,
+    grounds: ["charcoal", "black", "graphite", "paper", "mist"],
+    defaultGround: { dark: "charcoal", light: "mist" },
+};
 /**
  * Cykick: cyan on near-black with square corners, from
  * `ui/theme/native-themes.json` (primary, background, radius 0). Cykick's

package/dist/chat/MessageBubble.js

@@ -22,5 +22,5 @@ export function MessageBubble({ message, renderContent, meta, className }) {
     const t = messages.chat;
     const speaker = message.name ?? t.role(message.role);
     const empty = message.content === "";
-    return (_jsxs("article", { "aria-label": t.messageFrom(speaker), "aria-busy": message.streaming || undefined, "data-slot": "message-bubble", "data-role": message.role, className: cn("flex min-w-0 flex-col gap-1", ROLE_CLASS[message.role], className), children: [(message.role !== "user" || meta) && (_jsxs("header", { className: "flex min-w-0 items-center gap-2 text-xs text-muted-foreground", children: [message.role !== "user" && _jsx("span", { className: "font-medium", children: speaker }), meta && _jsx("span", { className: "ml-auto flex items-center gap-2", children: meta })] })), message.streaming && empty ? (_jsxs("p", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(StatusDot, { tone: "info", pulse: true }), t.thinking] })) : (_jsxs("div", { className: "min-w-0 text-sm [overflow-wrap:anywhere]", children: [renderContent ? (renderContent(message.content, message)) : (_jsx("p", { className: "whitespace-pre-wrap", children: message.content })), message.streaming && (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, className: "ml-0.5 inline-block h-4 w-1.5 translate-y-0.5 bg-foreground/60 motion-safe:animate-pulse" }), _jsx("span", { className: "sr-only", children: t.writing })] }))] }))] }));
+    return (_jsxs("article", { "aria-label": t.messageFrom(speaker), "aria-busy": message.streaming || undefined, "data-slot": "message-bubble", "data-role": message.role, className: cn("flex min-w-0 flex-col gap-1", ROLE_CLASS[message.role], className), children: [(message.role !== "user" || meta) && (_jsxs("header", { className: "flex min-w-0 items-center gap-2 text-xs text-muted-foreground", children: [message.role !== "user" && _jsx("span", { className: "font-medium", children: speaker }), meta && _jsx("span", { className: "ml-auto flex items-center gap-2", children: meta })] })), message.streaming && empty ? (_jsxs("p", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(StatusDot, { tone: "info", pulse: true }), t.thinking] })) : (_jsxs("div", { className: "min-w-0 text-sm [overflow-wrap:break-word]", children: [renderContent ? (renderContent(message.content, message)) : (_jsx("p", { className: "whitespace-pre-wrap", children: message.content })), message.streaming && (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, className: "ml-0.5 inline-block h-4 w-1.5 translate-y-0.5 bg-foreground/60 motion-safe:animate-pulse" }), _jsx("span", { className: "sr-only", children: t.writing })] }))] }))] }));
 }

package/dist/chat/MessageList.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { type ChatContentRenderer } from "./MessageBubble.js";
-import type { ChatToolCall, ChatView } from "./model.js";
+import type { ChatTimelineItem, ChatToolCall, ChatView } from "./model.js";
 import { type ToolCallCardProps } from "./ToolCallCard.js";
 export interface MessageListProps {
     /** The conversation: a `ChatView`, or the part of one the list reads. */
@@ -15,6 +15,13 @@ export interface MessageListProps {
     toolTitle?: (call: ChatToolCall) => string | undefined;
     onApprove?: ToolCallCardProps["onApprove"];
     onDeny?: ToolCallCardProps["onDeny"];
+    /**
+     * Draws something after a timeline item: generative UI an agent sent
+     * between messages (a progress card, an artifact). Called for each item.
+     */
+    renderAfter?: (item: ChatTimelineItem) => React.ReactNode;
+    /** Drawn after the whole conversation, before a failed run's error: what the run waits on. */
+    footer?: React.ReactNode;
     /** Offered beside a failed run's error. */
     onRetry?: () => void;
     /** The first page of history is loading. */
@@ -33,4 +40,4 @@ export interface MessageListProps {
  * changes, so a long conversation streams without virtualization; a host
  * with thousands of turns pages its history.
  */
-export declare function MessageList({ view, renderContent, renderToolCall, toolTitle, onApprove, onDeny, onRetry, loading, empty, label, className, }: MessageListProps): React.JSX.Element;
+export declare function MessageList({ view, renderContent, renderToolCall, renderAfter, footer, toolTitle, onApprove, onDeny, onRetry, loading, empty, label, className, }: MessageListProps): React.JSX.Element;

package/dist/chat/MessageList.js

@@ -21,7 +21,7 @@ const PINNED = 48;
  * changes, so a long conversation streams without virtualization; a host
  * with thousands of turns pages its history.
  */
-export function MessageList({ view, renderContent, renderToolCall, toolTitle, onApprove, onDeny, onRetry, loading = false, empty, label, className, }) {
+export function MessageList({ view, renderContent, renderToolCall, renderAfter, footer, toolTitle, onApprove, onDeny, onRetry, loading = false, empty, label, className, }) {
     const { messages } = useUI();
     const t = messages.chat;
     const scroller = React.useRef(null);
@@ -48,16 +48,19 @@ export function MessageList({ view, renderContent, renderToolCall, toolTitle, on
         body = empty ?? _jsx(EmptyState, { title: t.empty, description: t.emptyDescription });
     else
         body = (_jsxs(_Fragment, { children: [view.timeline.map((item) => {
+                    const after = renderAfter?.(item);
+                    let node = null;
                     if (item.kind === "message") {
                         const message = byId.messages.get(item.id);
-                        return message ? (_jsx(MemoBubble, { message: message, renderContent: renderContent }, `m:${item.id}`)) : null;
+                        node = message ? _jsx(MemoBubble, { message: message, renderContent: renderContent }) : null;
                     }
-                    const call = byId.calls.get(item.id);
-                    if (!call)
-                        return null;
-                    const custom = renderToolCall?.(call);
-                    return custom !== undefined ? (_jsx(React.Fragment, { children: custom }, `t:${item.id}`)) : (_jsx(MemoToolCall, { call: call, title: toolTitle?.(call), onApprove: onApprove, onDeny: onDeny }, `t:${item.id}`));
-                }), view.status === "error" && view.error && (_jsxs("div", { role: "alert", className: "flex min-w-0 flex-col gap-2 rounded-lg border border-danger-border bg-danger-bg px-3 py-2 text-sm text-danger-fg sm:flex-row sm:items-center", children: [_jsxs("p", { className: "min-w-0 flex-1 [overflow-wrap:anywhere]", children: [_jsx("span", { className: "font-medium", children: t.runFailed }), ": ", view.error.message] }), onRetry && (_jsx(Button, { variant: "outline", size: "sm", onClick: onRetry, children: t.retry }))] }))] }));
+                    else {
+                        const call = byId.calls.get(item.id);
+                        const custom = call ? renderToolCall?.(call) : undefined;
+                        node = !call ? null : custom !== undefined ? (custom) : (_jsx(MemoToolCall, { call: call, title: toolTitle?.(call), onApprove: onApprove, onDeny: onDeny }));
+                    }
+                    return (_jsxs(React.Fragment, { children: [node, after] }, `${item.kind === "message" ? "m" : "t"}:${item.id}`));
+                }), footer, view.status === "error" && view.error && (_jsxs("div", { role: "alert", className: "flex min-w-0 flex-col gap-2 rounded-lg border border-danger-border bg-danger-bg px-3 py-2 text-sm text-danger-fg sm:flex-row sm:items-center", children: [_jsxs("p", { className: "min-w-0 flex-1 [overflow-wrap:anywhere]", children: [_jsx("span", { className: "font-medium", children: t.runFailed }), ": ", view.error.message] }), onRetry && (_jsx(Button, { variant: "outline", size: "sm", onClick: onRetry, children: t.retry }))] }))] }));
     return (_jsxs("div", { "data-slot": "message-list", className: cn("relative flex min-h-0 flex-col", className), children: [_jsx("div", { ref: scroller, role: "log", "aria-label": label ?? t.conversation, "aria-busy": view.status === "running" || loading || undefined, 
                 // A scrolling region is reached by keyboard (WCAG 2.1.1).
                 // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex

package/dist/css/appearance.js

@@ -64,7 +64,7 @@
   d.style.setProperty("--radius",
     (c.corners.indexOf(p.corners) > -1 ? p.corners : c.defaults.corners) + "px");
 };
-  var products = {"astrolift":{"product":"astrolift","key":"astrolift.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"emerald":{"mode":"dark","background":"#050b08"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"graphite","light":"mist","accent":"green","density":"compact","corners":2}},"zentinelle":{"product":"zentinelle","key":"zentinelle.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["teal","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"black","light":"mist","accent":"teal","density":"compact","corners":2}},"workbench":{"product":"workbench","key":"workbench.appearance","grounds":{"navy":{"mode":"dark","background":"#0b1120"},"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["workbench-blue","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"navy","light":"mist","accent":"workbench-blue","density":"compact","corners":2}},"chat-studio":{"product":"chat-studio","key":"chat-studio.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["studio-blue","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"black","light":"paper","accent":"studio-blue","density":"compact","corners":2}},"loadr":{"product":"loadr","key":"loadr.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["loadr-blue","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"charcoal","light":"paper","accent":"loadr-blue","density":"compact","corners":2}},"cykick":{"product":"cykick","key":"cykick.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["cykick-cyan","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"black","light":"mist","accent":"cykick-cyan","density":"compact","corners":0}}};
+  var products = {"astrolift":{"product":"astrolift","key":"astrolift.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"emerald":{"mode":"dark","background":"#050b08"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"graphite","light":"mist","accent":"green","density":"compact","corners":2}},"zentinelle":{"product":"zentinelle","key":"zentinelle.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["teal","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"black","light":"mist","accent":"teal","density":"compact","corners":2}},"workbench":{"product":"workbench","key":"workbench.appearance","grounds":{"navy":{"mode":"dark","background":"#0b1120"},"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["workbench-blue","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"navy","light":"mist","accent":"workbench-blue","density":"compact","corners":2}},"chat-studio":{"product":"chat-studio","key":"chat-studio.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["studio-blue","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"black","light":"paper","accent":"studio-blue","density":"compact","corners":2}},"loadr":{"product":"loadr","key":"loadr.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["loadr-blue","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"charcoal","light":"paper","accent":"loadr-blue","density":"compact","corners":2}},"cykick":{"product":"cykick","key":"cykick.appearance","grounds":{"black":{"mode":"dark","background":"#000000"},"charcoal":{"mode":"dark","background":"#0e0f10"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["cykick-cyan","green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"black","light":"mist","accent":"cykick-cyan","density":"compact","corners":0}},"deep-data-agent":{"product":"deep-data-agent","key":"deep-data-agent.appearance","grounds":{"charcoal":{"mode":"dark","background":"#0e0f10"},"black":{"mode":"dark","background":"#000000"},"graphite":{"mode":"dark","background":"#111214"},"paper":{"mode":"light","background":"#faf6ee"},"mist":{"mode":"light","background":"#f2f7f9"}},"accents":["green","copper","ice","periwinkle","amber"],"corners":[0,2,4,10],"minContrast":3,"defaults":{"dark":"charcoal","light":"mist","accent":"amber","density":"compact","corners":2}}};
   var d = document.documentElement;
   var hex = /^#[0-9a-f]{6}$/;
   var has = function (o, k) {

package/dist/css/calliope.css

@@ -490,6 +490,11 @@
   --brand-on-primary: #ffffff;
 }
 
+/* Product: Deep Data Agent */
+[data-product="deep-data-agent"] {
+  --brand-sidebar: #1a150c;
+}
+
 /*
  * @calliopelabs/ui CSS layer: components.
  *

package/dist/css/tokens.css

@@ -489,3 +489,8 @@
   --brand-primary: #0e7490;
   --brand-on-primary: #ffffff;
 }
+
+/* Product: Deep Data Agent */
+[data-product="deep-data-agent"] {
+  --brand-sidebar: #1a150c;
+}

package/dist/index.d.ts

@@ -8,7 +8,7 @@ export { cn } from "./lib/cn.js";
 export { ACCENTS, ACCENT_KEYS, DENSITIES, DENSITY_KEYS, GROUNDS, GROUND_KEYS, MODE_TOKENS, SURFACES, type AccentSpec, type Density, type FamilyAccent, type Ground, type Mode, type StatusName, } from "./theme/tokens.js";
 export { MIN_NON_TEXT_CONTRAST, MIN_TEXT_CONTRAST, contrastRatio, luminance, } from "./theme/contrast.js";
 export { CORNERS, defineProduct, type BrandAccent, type Corners, type Product, type ProductAccent, type ProductConfig, type ProductTheme, } from "./appearance/product.js";
-export { astroliftBrand, chatStudioBrand, cykickBrand, loadrBrand, workbenchBrand, zentinelleBrand, } from "./appearance/brands.js";
+export { astroliftBrand, chatStudioBrand, cykickBrand, deepDataAgentBrand, loadrBrand, workbenchBrand, zentinelleBrand, } from "./appearance/brands.js";
 export { accentContrast, appearanceFromServer, applyAppearance, clearAppearance, inkFor, isCustomAccent, modeFor, normalize, normalizePartial, parseCustomAccent, readAppearance, resolveAppearance, writeAppearance, type Appearance, type CustomAccent, type OrgAppearancePolicy, type ResolvedAppearance, } from "./appearance/appearance.js";
 export { appearanceScript, bootConfig, productStyles, type BootConfig } from "./appearance/boot.js";
 export { BRAND_ACCENT_KEY, brandStyleVars, brandStyles, htmlAttributes, resolveRuntimeBrand, withBrand, type ResolvedRuntimeBrand, type RuntimeBrand, } from "./appearance/runtime-brand.js";
@@ -62,9 +62,17 @@ export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMe
 export { Popover, PopoverAnchor, PopoverContent, PopoverHeader, PopoverTrigger, } from "./primitives/Popover.js";
 export { Tabs, TabsContent, TabsList, TabsTrigger } from "./primitives/Tabs.js";
 export { Skeleton } from "./primitives/Skeleton.js";
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./primitives/Tooltip.js";
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarTrigger, } from "./primitives/Menubar.js";
+export { ContextMenu, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuTrigger, } from "./primitives/ContextMenu.js";
+export { ScrollArea, type ScrollAreaProps } from "./primitives/ScrollArea.js";
+export { Badge, badgeVariants, type BadgeProps } from "./primitives/Badge.js";
+export { ToastProvider, useToast, type ToastApi, type ToastOptions, type ToastProviderProps, } from "./primitives/Toast.js";
 export type { WorkflowAction, WorkflowAvailability, WorkflowModule, WorkflowPermissions, WorkflowScope, WorkflowStatus, WorkflowSummary, } from "./workflow/model.js";
 export { WorkflowCard, WorkflowCardSkeleton, type WorkflowCardActions, type WorkflowCardProps, } from "./workflow/WorkflowCard.js";
 export { WorkflowQuestionCard, type WorkflowQuestionCardProps, } from "./workflow/WorkflowQuestionCard.js";
+export { WorkflowRuntimeControls, type WorkflowRuntimeControlsProps, } from "./workflow/WorkflowRuntimeControls.js";
+export type { WorkflowRuntimeState, WorkflowRuntimeBinding, WorkflowPauseReceipt, WorkflowRuntimeIntent, } from "./workflow/runtime-controls.js";
 export type { WorkflowQuestion, WorkflowQuestionField, WorkflowQuestionState, WorkflowQuestionAnswers, WorkflowQuestionSubmission, } from "./workflow/question.js";
 export { ANY_FILTER, DEFAULT_WORKFLOW_FILTERS, filterWorkflows, isFiltered, type WorkflowGalleryFilters, } from "./workflow/gallery.js";
 export { WorkflowGallery, type WorkflowGalleryProps, type WorkflowGalleryView, } from "./workflow/WorkflowGallery.js";

package/dist/index.js

@@ -11,7 +11,7 @@ export { ACCENTS, ACCENT_KEYS, DENSITIES, DENSITY_KEYS, GROUNDS, GROUND_KEYS, MO
 export { MIN_NON_TEXT_CONTRAST, MIN_TEXT_CONTRAST, contrastRatio, luminance, } from "./theme/contrast.js";
 // Product and appearance
 export { CORNERS, defineProduct, } from "./appearance/product.js";
-export { astroliftBrand, chatStudioBrand, cykickBrand, loadrBrand, workbenchBrand, zentinelleBrand, } from "./appearance/brands.js";
+export { astroliftBrand, chatStudioBrand, cykickBrand, deepDataAgentBrand, loadrBrand, workbenchBrand, zentinelleBrand, } from "./appearance/brands.js";
 export { accentContrast, appearanceFromServer, applyAppearance, clearAppearance, inkFor, isCustomAccent, modeFor, normalize, normalizePartial, parseCustomAccent, readAppearance, resolveAppearance, writeAppearance, } from "./appearance/appearance.js";
 export { appearanceScript, bootConfig, productStyles } from "./appearance/boot.js";
 export { BRAND_ACCENT_KEY, brandStyleVars, brandStyles, htmlAttributes, resolveRuntimeBrand, withBrand, } from "./appearance/runtime-brand.js";
@@ -73,8 +73,15 @@ export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMe
 export { Popover, PopoverAnchor, PopoverContent, PopoverHeader, PopoverTrigger, } from "./primitives/Popover.js";
 export { Tabs, TabsContent, TabsList, TabsTrigger } from "./primitives/Tabs.js";
 export { Skeleton } from "./primitives/Skeleton.js";
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./primitives/Tooltip.js";
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarTrigger, } from "./primitives/Menubar.js";
+export { ContextMenu, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuTrigger, } from "./primitives/ContextMenu.js";
+export { ScrollArea } from "./primitives/ScrollArea.js";
+export { Badge, badgeVariants } from "./primitives/Badge.js";
+export { ToastProvider, useToast, } from "./primitives/Toast.js";
 export { WorkflowCard, WorkflowCardSkeleton, } from "./workflow/WorkflowCard.js";
 export { WorkflowQuestionCard, } from "./workflow/WorkflowQuestionCard.js";
+export { WorkflowRuntimeControls, } from "./workflow/WorkflowRuntimeControls.js";
 export { ANY_FILTER, DEFAULT_WORKFLOW_FILTERS, filterWorkflows, isFiltered, } from "./workflow/gallery.js";
 export { WorkflowGallery, } from "./workflow/WorkflowGallery.js";
 export { ARTIFACT_TONE, GATE_TONE, RUN_STAGE_TONE, VERDICT_TONE, } from "./workflow/run.js";