@iloveagents/foundry-web-ui 0.28.0 → 0.29.0

package/dist/components/assistant-chat.js

@@ -12,7 +12,7 @@ import { ComposerAddMenu } from "./composer-add-menu.js";
 import { ContextPins } from "./context-bar.js";
 import { ChatContext } from "./chat-context.js";
 import { ComposerSubmitBridge } from "./composer-submit-bridge.js";
-import { ChatComposerActionsSlot, ChatComposerBannerSlot, useChatThreadSurface, useComposerActionsOwnSend, } from "./chat-slots.js";
+import { ChatComposerActionsSlot, ChatComposerBannerSlot, ChatHomeStartersSlot, useChatThreadSurface, useComposerActionsOwnSend, } from "./chat-slots.js";
 import { useChatBubbleStore } from "../lib/chat-bubble-store.js";
 import { ReasoningEffortPicker } from "./reasoning-effort-picker.js";
 import { ChatMessageParts } from "./chat-message-parts.js";
@@ -138,7 +138,7 @@ export function ChatContent({ centerComposer = false, composerIntro, composerFoo
                             // `overflow-hidden`, not scroll: a surface owns its own layout,
                             // and a full-bleed one (an avatar cropped to the frame) must be
                             // able to reach the edges rather than sit in a scroll box.
-                            _jsx("div", { className: "absolute inset-0 z-10 overflow-hidden bg-background", children: _jsx(ThreadSurface, {}) })), _jsxs(ThreadPrimitive.Viewport, { className: cn("absolute inset-0 overflow-y-auto bg-background", ThreadSurface && "invisible"), "aria-hidden": ThreadSurface ? true : undefined, children: [_jsx(ThreadPrimitive.Empty, { children: emptyState ?? (_jsxs("div", { className: cn("flex min-h-full flex-col", "items-center justify-center", "px-4"), children: [_jsx(Bot, { className: "size-16 mb-6 text-primary/70" }), _jsx("h1", { className: "text-[2rem] font-normal text-foreground text-center mb-6", children: "How can I help you today?" }), starterSuggestions.length > 0 && (_jsx("div", { className: "flex flex-wrap justify-center gap-2 max-w-lg", children: starterSuggestions.map((prompt) => (_jsx(ThreadPrimitive.Suggestion, { prompt: prompt, send: true, asChild: true, children: _jsx(Button, { variant: "outline", className: "text-sm", children: prompt }) }, prompt))) }))] })) }), _jsx(ThreadPrimitive.If, { empty: false, children: _jsxs("div", { className: "mx-auto max-w-3xl px-4 pt-8 pb-4", children: [_jsx(ThreadPrimitive.Messages, { components: {
+                            _jsx("div", { className: "absolute inset-0 z-10 overflow-hidden bg-background", children: _jsx(ThreadSurface, {}) })), _jsxs(ThreadPrimitive.Viewport, { className: cn("absolute inset-0 overflow-y-auto bg-background", ThreadSurface && "invisible"), "aria-hidden": ThreadSurface ? true : undefined, children: [_jsx(ThreadPrimitive.Empty, { children: emptyState ?? (_jsxs("div", { className: cn("flex min-h-full flex-col", "items-center justify-center", "px-4"), children: [_jsx(Bot, { className: "size-16 mb-6 text-primary/70" }), _jsx("h1", { className: "text-[2rem] font-normal text-foreground text-center mb-6", children: "How can I help you today?" }), _jsx(ChatHomeStartersSlot, {}), starterSuggestions.length > 0 && (_jsx("div", { className: "flex flex-wrap justify-center gap-2 max-w-lg", children: starterSuggestions.map((prompt) => (_jsx(ThreadPrimitive.Suggestion, { prompt: prompt, send: true, asChild: true, children: _jsx(Button, { variant: "outline", className: "text-sm", children: prompt }) }, prompt))) }))] })) }), _jsx(ThreadPrimitive.If, { empty: false, children: _jsxs("div", { className: "mx-auto max-w-3xl px-4 pt-8 pb-4", children: [_jsx(ThreadPrimitive.Messages, { components: {
                                                         UserMessage,
                                                         EditComposer,
                                                         AssistantMessage,

package/dist/components/chat-bubble.js

@@ -12,7 +12,7 @@ import { ComposerContextBadges, SentContextBadges } from "./context-badges.js";
 import { ComposerSubmitBridge } from "./composer-submit-bridge.js";
 import { ComposerAddMenu } from "./composer-add-menu.js";
 import { DEFAULT_COMPOSER_PLACEHOLDER } from "./assistant-chat.js";
-import { ChatComposerActionsSlot, ChatComposerBannerSlot, ChatLauncherBadgeSlot, useChatThreadSurface, useComposerActionsOwnSend, } from "./chat-slots.js";
+import { ChatComposerActionsSlot, ChatComposerBannerSlot, ChatHomeStartersSlot, ChatLauncherBadgeSlot, useChatThreadSurface, useComposerActionsOwnSend, } from "./chat-slots.js";
 import { ChatMessageParts } from "./chat-message-parts.js";
 import { ReasoningEffortPicker } from "./reasoning-effort-picker.js";
 import { LoadingIndicator } from "./loading-indicator.js";
@@ -106,7 +106,7 @@ export function ChatBubble() {
                             height: 64,
                         } })), !isOpen && (_jsxs("div", { className: "fixed z-50 group", style: { left: CHAT_BUBBLE_INSET, bottom: CHAT_BUBBLE_INSET }, children: [_jsx("button", { type: "button", onClick: openBubble, className: cn("size-10 rounded-full", "bg-primary text-primary-foreground shadow-lg", "flex items-center justify-center", "hover:bg-primary/90 transition-all duration-200", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"), "aria-label": "Ask the AI", children: _jsx(Sparkles, { className: "size-4" }) }), _jsx(ChatLauncherBadgeSlot, {})] })), isOpen && (_jsxs("div", { ref: panelRef, "data-chat-surface": "bubble", className: cn("fixed z-50", "rounded-2xl border border-border", "bg-background shadow-2xl", "flex flex-col overflow-hidden", "w-95 h-150"), style: dragPos
                             ? { left: dragPos.x, top: dragPos.y }
-                            : { left: CHAT_BUBBLE_INSET, bottom: CHAT_BUBBLE_INSET }, children: [_jsxs("div", { className: cn("flex items-center justify-between px-4 py-2.5 border-b border-border shrink-0", "cursor-grab active:cursor-grabbing select-none"), style: { touchAction: "none" }, onPointerDown: onHeaderPointerDown, onPointerMove: onHeaderPointerMove, onPointerUp: onHeaderPointerUp, onLostPointerCapture: onHeaderLostPointerCapture, children: [_jsxs("div", { className: "flex flex-col min-w-0", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-sm", children: [_jsx(Sparkles, { className: "size-3.5 text-primary shrink-0" }), _jsx("span", { className: "font-semibold text-foreground truncate", children: pageLabel })] }), _jsx("span", { className: "text-xs text-muted-foreground", children: threadActive ? "Active thread" : "New conversation" })] }), _jsxs("div", { className: "flex items-center gap-0.5", children: [_jsx(TooltipIconButton, { tooltip: "New Thread", size: "icon", className: "size-7", onClick: startNewThread, children: _jsx(SquarePen, { className: "size-3.5" }) }), _jsx(TooltipIconButton, { tooltip: "Expand chat", size: "icon", className: "size-7", onClick: expandChat, children: _jsx(Maximize2, { className: "size-3.5" }) }), _jsx(TooltipIconButton, { tooltip: "Close", size: "icon", className: "size-7", onClick: handleClose, children: _jsx(X, { className: "size-4" }) })] })] }), _jsxs(ThreadPrimitive.Root, { className: "flex flex-col flex-1 overflow-hidden", children: [_jsxs("div", { className: "relative flex-1 overflow-hidden", children: [ThreadSurface && (_jsx("div", { className: "absolute inset-0 z-10 overflow-hidden bg-background", children: _jsx(ThreadSurface, {}) })), _jsxs(ThreadPrimitive.Viewport, { className: cn("absolute inset-0 overflow-y-auto", ThreadSurface && "invisible"), "aria-hidden": ThreadSurface ? true : undefined, children: [_jsx(ThreadPrimitive.Empty, { children: _jsx("div", { className: "flex h-full items-center justify-center p-4", children: _jsx("p", { className: "text-sm text-muted-foreground text-center", children: "Ask the agent about this page" }) }) }), _jsx(ThreadPrimitive.If, { empty: false, children: _jsxs("div", { className: "px-4 pt-4 pb-3", children: [_jsx(ThreadPrimitive.Messages, { components: {
+                            : { left: CHAT_BUBBLE_INSET, bottom: CHAT_BUBBLE_INSET }, children: [_jsxs("div", { className: cn("flex items-center justify-between px-4 py-2.5 border-b border-border shrink-0", "cursor-grab active:cursor-grabbing select-none"), style: { touchAction: "none" }, onPointerDown: onHeaderPointerDown, onPointerMove: onHeaderPointerMove, onPointerUp: onHeaderPointerUp, onLostPointerCapture: onHeaderLostPointerCapture, children: [_jsxs("div", { className: "flex flex-col min-w-0", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-sm", children: [_jsx(Sparkles, { className: "size-3.5 text-primary shrink-0" }), _jsx("span", { className: "font-semibold text-foreground truncate", children: pageLabel })] }), _jsx("span", { className: "text-xs text-muted-foreground", children: threadActive ? "Active thread" : "New conversation" })] }), _jsxs("div", { className: "flex items-center gap-0.5", children: [_jsx(TooltipIconButton, { tooltip: "New Thread", size: "icon", className: "size-7", onClick: startNewThread, children: _jsx(SquarePen, { className: "size-3.5" }) }), _jsx(TooltipIconButton, { tooltip: "Expand chat", size: "icon", className: "size-7", onClick: expandChat, children: _jsx(Maximize2, { className: "size-3.5" }) }), _jsx(TooltipIconButton, { tooltip: "Close", size: "icon", className: "size-7", onClick: handleClose, children: _jsx(X, { className: "size-4" }) })] })] }), _jsxs(ThreadPrimitive.Root, { className: "flex flex-col flex-1 overflow-hidden", children: [_jsxs("div", { className: "relative flex-1 overflow-hidden", children: [ThreadSurface && (_jsx("div", { className: "absolute inset-0 z-10 overflow-hidden bg-background", children: _jsx(ThreadSurface, {}) })), _jsxs(ThreadPrimitive.Viewport, { className: cn("absolute inset-0 overflow-y-auto", ThreadSurface && "invisible"), "aria-hidden": ThreadSurface ? true : undefined, children: [_jsx(ThreadPrimitive.Empty, { children: _jsxs("div", { className: "flex min-h-full flex-col items-center justify-center gap-4 p-4", children: [_jsx("p", { className: "text-sm text-muted-foreground text-center", children: "Ask the agent about this page" }), _jsx(ChatHomeStartersSlot, {})] }) }), _jsx(ThreadPrimitive.If, { empty: false, children: _jsxs("div", { className: "px-4 pt-4 pb-3", children: [_jsx(ThreadPrimitive.Messages, { components: {
                                                                         UserMessage: BubbleUserMessage,
                                                                         AssistantMessage: BubbleAssistantMessage,
                                                                     } }), _jsx(ThreadPrimitive.If, { running: true, children: _jsx(LoadingIndicator, {}) })] }) })] }), _jsx(ThreadPrimitive.If, { empty: false, children: !ThreadSurface && _jsx(BubbleScrollToBottomButton, {}) })] }), _jsxs("div", { className: "shrink-0 border-t border-border", children: [_jsx(ChatComposerBannerSlot, {}), _jsxs("div", { className: "px-3 py-3", children: [_jsx(ChatContext, {}), _jsxs(ComposerPrimitive.Root, { className: cn(

package/dist/components/chat-context.js

@@ -27,7 +27,7 @@ export function ChatContext() {
         const events = ["focusin", "pointerup", "input", "selectionchange"];
         for (const event of events)
             document.addEventListener(event, refresh);
-        const handles = "[data-focused], [data-context-ref-type='entity-field']";
+        const handles = "[data-focused], [data-context-ref-type='entity-field'], [data-agent-component]";
         const observer = typeof MutationObserver === "undefined"
             ? null
             : new MutationObserver((records) => {
@@ -42,6 +42,8 @@ export function ChatContext() {
             childList: true,
             attributes: true,
             attributeFilter: [
+                "data-agent-selected",
+                "data-agent-component-label",
                 "data-focused",
                 "data-focus-title",
                 "data-focus-kind",

package/dist/components/chat-empty-state.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+/** One compact conversation home for workbench, focus and embedded chat panes. */
+export declare function ChatEmptyState({ pageLabel, children, showHomeStarters, homeStarterPriority, }: {
+    pageLabel?: string;
+    children?: ReactNode;
+    showHomeStarters?: boolean;
+    homeStarterPriority?: number;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/chat-empty-state.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChatHomeStartersSlot } from "./chat-slots.js";
+/** One compact conversation home for workbench, focus and embedded chat panes. */
+export function ChatEmptyState({ pageLabel, children, showHomeStarters = true, homeStarterPriority = 0, }) {
+    return (_jsxs("div", { className: "flex min-h-full flex-col justify-start gap-3 px-6 pb-8 pt-0", children: [_jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "What would you like to get done?" }), _jsx("p", { className: "max-w-sm text-sm leading-relaxed text-muted-foreground", children: pageLabel && !pageLabel.startsWith("/") ? (_jsxs(_Fragment, { children: ["Work with ", _jsx("span", { className: "font-medium text-foreground", children: pageLabel }), " or across your spaces: find information, create or edit content, and run actions."] })) : ("Find information, create or edit content, and run actions across your spaces.") }), _jsx("p", { className: "max-w-sm text-xs leading-relaxed text-muted-foreground", children: "Your conversation continues as you browse. Select text or a field to work more specifically." }), showHomeStarters && _jsx(ChatHomeStartersSlot, { priority: homeStarterPriority }), children] }));
+}

package/dist/components/chat-slots.d.ts

@@ -10,6 +10,8 @@
  * shell's chat components render the slots wherever they belong.
  *
  * Render points:
+ *   - ``homeStarters`` — contextual starters inside the empty chat home,
+ *     alongside its introduction. The module owns discovery and execution.
  *   - ``composerBanner`` — directly above the composer in BOTH the full
  *     chat (``ChatContent``) and the floating bubble panel. It renders
  *     inside a fixed (non-scrolling) footer, so it never scrolls away
@@ -40,8 +42,10 @@
  * Type one character and Send comes back. Opt-in, because a slot holding
  * something unrelated must not make Send disappear.
  */
-import type { ComponentType } from "react";
+import { type ComponentType } from "react";
 interface ChatSlotsState {
+    /** Contextual conversation starters. Only mounted on the empty chat home. */
+    homeStarters: ComponentType | null;
     composerBanner: ComponentType | null;
     /** Extra capabilities in the context flyout. Providers own section headings
      * and can dismiss the flyout before opening a dialog or starting an action. */
@@ -64,6 +68,9 @@ export declare const useChatSlotsStore: import("zustand").UseBoundStore<import("
  */
 export declare function registerChatSlots(slots: Partial<ChatSlotsState>): void;
 export declare function ChatComposerBannerSlot(): import("react/jsx-runtime").JSX.Element | null;
+export declare function ChatHomeStartersSlot({ priority }: {
+    priority?: number;
+}): import("react/jsx-runtime").JSX.Element | null;
 export declare function ChatContextDetailsSlot({ onDismiss }: {
     onDismiss: () => void;
 }): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/chat-slots.js

@@ -1,7 +1,53 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Chat extension slots — module-injectable UI anchored to the chat chrome.
+ *
+ * Modules (via ``bootstrapShell``) sometimes need to render inside the
+ * chat surfaces the shell owns — e.g. a background-task progress strip
+ * pinned above the composer, or an activity badge on the collapsed chat
+ * launcher. Threading those through props would couple the shell to
+ * feature modules, so this is a tiny registry instead: a module calls
+ * :func:`registerChatSlots` once (import time or ``useInit``) and the
+ * shell's chat components render the slots wherever they belong.
+ *
+ * Render points:
+ *   - ``homeStarters`` — contextual starters inside the empty chat home,
+ *     alongside its introduction. The module owns discovery and execution.
+ *   - ``composerBanner`` — directly above the composer in BOTH the full
+ *     chat (``ChatContent``) and the floating bubble panel. It renders
+ *     inside a fixed (non-scrolling) footer, so it never scrolls away
+ *     with the thread.
+ *   - ``contextDetails`` — grouped capabilities beneath the current context
+ *     in the composer flyout. Call ``onDismiss`` before opening action dialogs.
+ *   - ``launcherBadge`` — inside the collapsed chat-bubble launcher's
+ *     wrapper (a positioned ``group`` container around the round button),
+ *     so a badge can position itself absolutely over the button and use
+ *     ``group-hover:`` styles for a hover flyout.
+ *   - ``composerActions`` — in the composer's trailing control row, just
+ *     before Send, in BOTH the full chat and the floating bubble panel.
+ *     For controls that are an alternative *way to send* rather than
+ *     content about the thread — a push-to-talk mic, say. Leading-edge
+ *     controls (attach, context pins) stay owned by the composer itself.
+ *
+ *   - ``threadSurface`` — rendered *instead of* the message viewport, for a
+ *     mode that replaces the conversation rather than adding to it. A live
+ *     voice call is the case it exists for: while you are talking, the
+ *     transcript scrolling past is not what you are looking at. Unlike the
+ *     other slots this one is set and cleared at runtime — registering a
+ *     component IS the takeover, clearing it hands the thread back.
+ *
+ * A module that registers ``composerActions`` may also claim the Send
+ * position while the composer is empty (``composerActionsReplaceSend``).
+ * That is the shape a voice control wants: nothing has been typed, so Send
+ * has nothing to do, and the corner belongs to the other way of asking.
+ * Type one character and Send comes back. Opt-in, because a slot holding
+ * something unrelated must not make Send disappear.
+ */
+import { useEffect, useState } from "react";
 import { create } from "zustand";
 import { useAuiState } from "@assistant-ui/react";
 export const useChatSlotsStore = create(() => ({
+    homeStarters: null,
     composerBanner: null,
     contextDetails: null,
     launcherBadge: null,
@@ -9,6 +55,23 @@ export const useChatSlotsStore = create(() => ({
     composerActionsReplaceSend: false,
     threadSurface: null,
 }));
+const homeStarterHosts = new Map();
+let homeStarterHostOrder = 0;
+const useHomeStarterHostStore = create(() => ({ active: null }));
+function refreshActiveHomeStarterHost() {
+    let active = null;
+    let bestPriority = Number.NEGATIVE_INFINITY;
+    let bestOrder = Number.NEGATIVE_INFINITY;
+    for (const [id, host] of homeStarterHosts) {
+        if (host.priority > bestPriority ||
+            (host.priority === bestPriority && host.order > bestOrder)) {
+            active = id;
+            bestPriority = host.priority;
+            bestOrder = host.order;
+        }
+    }
+    useHomeStarterHostStore.setState({ active });
+}
 /**
  * Register chat slot components. Later calls overwrite only the keys
  * they pass, so independent modules can each claim a different slot.
@@ -17,6 +80,8 @@ export const useChatSlotsStore = create(() => ({
  */
 export function registerChatSlots(slots) {
     const next = {};
+    if (slots.homeStarters !== undefined)
+        next.homeStarters = slots.homeStarters;
     if (slots.composerBanner !== undefined)
         next.composerBanner = slots.composerBanner;
     if (slots.contextDetails !== undefined)
@@ -36,6 +101,20 @@ export function ChatComposerBannerSlot() {
     const Banner = useChatSlotsStore((s) => s.composerBanner);
     return Banner ? _jsx(Banner, {}) : null;
 }
+export function ChatHomeStartersSlot({ priority = 0 }) {
+    const [hostId] = useState(() => Symbol("chat-home-starters"));
+    const active = useHomeStarterHostStore((state) => state.active);
+    const Starters = useChatSlotsStore((s) => s.homeStarters);
+    useEffect(() => {
+        homeStarterHosts.set(hostId, { priority, order: ++homeStarterHostOrder });
+        refreshActiveHomeStarterHost();
+        return () => {
+            homeStarterHosts.delete(hostId);
+            refreshActiveHomeStarterHost();
+        };
+    }, [hostId, priority]);
+    return active === hostId && Starters ? _jsx(Starters, {}) : null;
+}
 export function ChatContextDetailsSlot({ onDismiss }) {
     const Details = useChatSlotsStore((s) => s.contextDetails);
     return Details ? _jsx(Details, { onDismiss: onDismiss }) : null;

package/dist/components/focus-chat-pane.js

@@ -1,9 +1,12 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChatEmptyState } from "./chat-empty-state.js";
+import { useAppStore } from "../lib/app-store.js";
 import { Button, cn } from "@iloveagents/foundry-web-primitives";
 import { X, PanelLeft, MessageSquare } from "lucide-react";
 import { TooltipIconButton } from "./tooltip-icon-button.js";
 import { FocusPaneResize } from "./data-table/focus-pane-resize.js";
 import { ChatContent } from "./assistant-chat.js";
 export function FocusChatPane({ chatOpen, setChatOpen, chatWidth, setChatWidth, source, onClose, }) {
-    return (_jsxs("aside", { "aria-label": "Focused content chat", style: { "--focus-chat-width": `${chatWidth ?? 384}px` }, className: cn("relative flex min-h-0 shrink-0 flex-col border-r border-border bg-background", chatOpen ? "w-full md:w-[var(--focus-chat-width)]" : "w-11", source && "hidden xl:flex"), children: [_jsx("div", { className: cn("flex h-12 shrink-0 items-center", chatOpen ? "gap-1 border-b border-border px-2" : "justify-center"), children: chatOpen ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "min-w-0 flex-1 px-2 text-sm font-semibold", children: "Chat" }), _jsx(TooltipIconButton, { tooltip: "Collapse chat", "aria-label": "Collapse chat", className: "size-8", onClick: () => setChatOpen(false), children: _jsx(PanelLeft, { size: 18 }) }), _jsx(Button, { variant: "ghost", size: "icon", title: "Close", "aria-label": "Close", className: "size-8 md:hidden", onClick: () => onClose(), children: _jsx(X, { size: 18 }) })] })) : (_jsx(TooltipIconButton, { tooltip: "Expand chat", "aria-label": "Expand chat", "aria-expanded": false, className: "size-8", onClick: () => setChatOpen(true), children: _jsx(MessageSquare, { size: 18 }) })) }), chatOpen && (_jsx(FocusPaneResize, { label: "chat", side: "right", width: chatWidth, onResize: setChatWidth })), chatOpen && (_jsx(ChatContent, { compactComposer: true, showPinButton: false, hideCurrentPageBadge: true, starterSuggestions: [] }))] }));
+    const pageLabel = useAppStore((state) => state.navContext.label);
+    return (_jsxs("aside", { "aria-label": "Focused content chat", style: { "--focus-chat-width": `${chatWidth ?? 384}px` }, className: cn("relative flex min-h-0 shrink-0 flex-col border-r border-border bg-background", chatOpen ? "w-full md:w-[var(--focus-chat-width)]" : "w-11", source && "hidden xl:flex"), children: [_jsx("div", { className: cn("flex h-12 shrink-0 items-center", chatOpen ? "gap-1 border-b border-border px-2" : "justify-center"), children: chatOpen ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "min-w-0 flex-1 px-2 text-sm font-semibold", children: "Chat" }), _jsx(TooltipIconButton, { tooltip: "Collapse chat", "aria-label": "Collapse chat", className: "size-8", onClick: () => setChatOpen(false), children: _jsx(PanelLeft, { size: 18 }) }), _jsx(Button, { variant: "ghost", size: "icon", title: "Close", "aria-label": "Close", className: "size-8 md:hidden", onClick: () => onClose(), children: _jsx(X, { size: 18 }) })] })) : (_jsx(TooltipIconButton, { tooltip: "Expand chat", "aria-label": "Expand chat", "aria-expanded": false, className: "size-8", onClick: () => setChatOpen(true), children: _jsx(MessageSquare, { size: 18 }) })) }), chatOpen && (_jsx(FocusPaneResize, { label: "chat", side: "right", width: chatWidth, onResize: setChatWidth })), chatOpen && (_jsx(ChatContent, { emptyState: _jsx(ChatEmptyState, { pageLabel: pageLabel, homeStarterPriority: 20 }), compactComposer: true, showPinButton: false, hideCurrentPageBadge: true, starterSuggestions: [] }))] }));
 }

package/dist/components/pin-state-icon.js

@@ -3,5 +3,5 @@ import { Pin } from "lucide-react";
 import { cn } from "@iloveagents/foundry-web-primitives";
 /** State glyph; controls retain explicit Pin/Unpin action labels. */
 export function PinStateIcon({ pinned, className }) {
-    return (_jsx(Pin, { "aria-hidden": "true", className: cn("size-4", pinned ? "text-primary fill-primary/25" : "text-muted-foreground", className) }));
+    return (_jsx(Pin, { "aria-hidden": "true", className: cn("size-4", pinned ? "text-primary fill-primary/20" : "rotate-45 text-muted-foreground fill-current/10", className) }));
 }

package/dist/components/pin-toggle.d.ts

@@ -1,6 +1,6 @@
 import type { ComponentProps } from "react";
 import { Button } from "@iloveagents/foundry-web-primitives";
-/** Pin state uses one upright glyph everywhere; the label describes the action. */
+/** Pinned glyphs are upright; unpinned glyphs tilt. Labels describe the action. */
 export declare function PinToggle({ pinned, label, className, ...props }: Omit<ComponentProps<typeof Button>, "children"> & {
     pinned: boolean;
     label: string;

package/dist/components/pin-toggle.js

@@ -1,10 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { PinStateIcon } from "./pin-state-icon.js";
 import { Button, cn } from "@iloveagents/foundry-web-primitives";
-/** Pin state uses one upright glyph everywhere; the label describes the action. */
+/** Pinned glyphs are upright; unpinned glyphs tilt. Labels describe the action. */
 export function PinToggle({ pinned, label, className, ...props }) {
     const action = `${pinned ? "Unpin" : "Pin"} ${label}`;
-    return (_jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": action, "aria-pressed": pinned, title: action, ...props, className: cn("shrink-0 shadow-none", pinned
-            ? "bg-primary/10 text-primary hover:bg-primary/15 hover:text-primary"
-            : "text-muted-foreground", className), children: _jsx(PinStateIcon, { pinned: pinned }) }));
+    return (_jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": action, "aria-pressed": pinned, title: action, ...props, className: cn("shrink-0 shadow-none", pinned ? "text-primary hover:text-primary" : "text-muted-foreground", className), children: _jsx(PinStateIcon, { pinned: pinned }) }));
 }

package/dist/index.d.ts

@@ -10,7 +10,7 @@ export { ChatContent, DEFAULT_STARTER_SUGGESTIONS, DEFAULT_COMPOSER_PLACEHOLDER,
 export { ComposerAddMenu, type ComposerAddMenuProps } from "./components/composer-add-menu.js";
 export type { ChatContentProps } from "./components/assistant-chat.js";
 export { ChatBubble } from "./components/chat-bubble.js";
-export { registerChatSlots, useChatSlotsStore, ChatComposerBannerSlot, ChatLauncherBadgeSlot, ChatComposerActionsSlot, useComposerActionsOwnSend, useChatThreadSurface, } from "./components/chat-slots.js";
+export { registerChatSlots, useChatSlotsStore, ChatComposerBannerSlot, ChatHomeStartersSlot, ChatLauncherBadgeSlot, ChatComposerActionsSlot, useComposerActionsOwnSend, useChatThreadSurface, } from "./components/chat-slots.js";
 export { ChatHeader } from "./components/chat-header.js";
 export { ComposerAttachment, UserMessageAttachment, userAttachmentComponents, composerAttachmentComponents, } from "./components/chat-attachments.js";
 export { ShowDocumentToolUI } from "./components/show-document-tool-ui.js";

package/dist/index.js

@@ -9,7 +9,7 @@ export { AGUIRuntimeProvider, useAGUIAdapter } from "./components/ag-ui-runtime-
 export { ChatContent, DEFAULT_STARTER_SUGGESTIONS, DEFAULT_COMPOSER_PLACEHOLDER, } from "./components/assistant-chat.js";
 export { ComposerAddMenu } from "./components/composer-add-menu.js";
 export { ChatBubble } from "./components/chat-bubble.js";
-export { registerChatSlots, useChatSlotsStore, ChatComposerBannerSlot, ChatLauncherBadgeSlot, ChatComposerActionsSlot, useComposerActionsOwnSend, useChatThreadSurface, } from "./components/chat-slots.js";
+export { registerChatSlots, useChatSlotsStore, ChatComposerBannerSlot, ChatHomeStartersSlot, ChatLauncherBadgeSlot, ChatComposerActionsSlot, useComposerActionsOwnSend, useChatThreadSurface, } from "./components/chat-slots.js";
 export { ChatHeader } from "./components/chat-header.js";
 export { ComposerAttachment, UserMessageAttachment, userAttachmentComponents, composerAttachmentComponents, } from "./components/chat-attachments.js";
 export { ShowDocumentToolUI } from "./components/show-document-tool-ui.js";

package/dist/lib/chat-context-summary.js

@@ -13,13 +13,16 @@ export function summarizeChatContext(state) {
         return { ...item, ...payload, meta: { ...record(item.meta), ...record(payload.meta) } };
     });
     const field = references.find((item) => item.meta.fieldFocus === "active");
+    const component = references.find((item) => item.meta.componentFocus === "active");
     const selected = references.find((item) => item.type === "selection" || item.meta.selectionScope === "text");
     const target = field && record(field.target ?? field.meta.jsonTarget);
     const detail = selected
         ? "Selected text"
         : field
             ? text(target?.label) || text(field.meta.fieldLabel) || text(field.label)
-            : "";
+            : component
+                ? text(component.meta.componentLabel) || text(component.label)
+                : "";
     const pageLabel = nav.label && !nav.label.startsWith("/") && !/^\/?chat$/i.test(nav.label)
         ? nav.label
         : "Your spaces";
@@ -27,7 +30,7 @@ export function summarizeChatContext(state) {
     const open = references.filter((item) => item.meta.windowState === "open");
     return {
         label,
-        detail,
+        detail: detail === label ? "" : detail,
         focused: Boolean(focused.title),
         path: nav.page,
         field: Boolean(field),

package/dist/workbench/chat-header.d.ts

@@ -1,6 +1,7 @@
 import { useChatWidth } from "./use-chat-width.js";
-export declare function WorkbenchChatHeader({ collapsed, chatWidth, buttonClass, toggleNavigation, setCollapsed, showHistory, startChat, returnToChat, openHistory, chatOnly, setContentCollapsed, }: {
+export declare function WorkbenchChatHeader({ collapsed, running, chatWidth, buttonClass, toggleNavigation, setCollapsed, showHistory, startChat, returnToChat, openHistory, chatOnly, setContentCollapsed, }: {
     collapsed: boolean;
+    running: boolean;
     chatWidth: ReturnType<typeof useChatWidth>;
     buttonClass: string;
     toggleNavigation: () => void;

package/dist/workbench/chat-header.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { TooltipIconButton } from "../index.js";
-import { SquarePen, PanelLeft, MessageSquare, Menu, History } from "lucide-react";
-export function WorkbenchChatHeader({ collapsed, chatWidth, buttonClass, toggleNavigation, setCollapsed, showHistory, startChat, returnToChat, openHistory, chatOnly, setContentCollapsed, }) {
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-chat-header": true, className: `relative flex shrink-0 items-center ${collapsed ? "justify-center" : "gap-1 px-2"}`, children: [!collapsed && !chatWidth.compact && (_jsx(TooltipIconButton, { tooltip: "Open navigation", className: `${buttonClass} preview-mobile-navigation`, "aria-label": "Open navigation", onClick: toggleNavigation, children: _jsx(Menu, { size: 18 }) })), collapsed ? (_jsx(TooltipIconButton, { tooltip: "Expand chat", className: buttonClass, "aria-label": "Expand chat", onClick: () => setCollapsed(false), children: _jsx(MessageSquare, { size: 18 }) })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "min-w-0 flex-1 px-2 py-2", children: _jsx("div", { className: "text-sm font-semibold", children: showHistory ? "Conversations" : "Chat" }) }), _jsx(TooltipIconButton, { tooltip: "New chat", className: buttonClass, "aria-label": "New chat", onClick: startChat, children: _jsx(SquarePen, { size: 18 }) }), _jsx(TooltipIconButton, { tooltip: "Chat history", className: buttonClass, "aria-label": "Chat history", "aria-expanded": showHistory, onClick: () => (showHistory ? returnToChat() : openHistory()), children: _jsx(History, { size: 18 }) }), _jsx(TooltipIconButton, { tooltip: "Collapse chat", style: chatOnly || chatWidth.compact ? { display: "none" } : undefined, className: buttonClass, "aria-label": "Collapse chat", onClick: () => {
+import { SquarePen, PanelLeft, MessageSquare, Menu, History, LoaderCircle } from "lucide-react";
+export function WorkbenchChatHeader({ collapsed, running, chatWidth, buttonClass, toggleNavigation, setCollapsed, showHistory, startChat, returnToChat, openHistory, chatOnly, setContentCollapsed, }) {
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-chat-header": true, className: `relative flex shrink-0 items-center ${collapsed ? "justify-center" : "gap-1 px-2"}`, children: [!collapsed && !chatWidth.compact && (_jsx(TooltipIconButton, { tooltip: "Open navigation", className: `${buttonClass} preview-mobile-navigation`, "aria-label": "Open navigation", onClick: toggleNavigation, children: _jsx(Menu, { size: 18 }) })), collapsed ? (_jsx(TooltipIconButton, { tooltip: running ? "AI is working — expand chat" : "Expand chat", className: buttonClass, "aria-label": running ? "AI is working — expand chat" : "Expand chat", onClick: () => setCollapsed(false), children: running ? (_jsx(LoaderCircle, { size: 18, className: "animate-spin motion-reduce:animate-none text-primary" })) : (_jsx(MessageSquare, { size: 18 })) })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "min-w-0 flex-1 px-2 py-2", children: _jsx("div", { className: "text-sm font-semibold", children: showHistory ? "Conversations" : "Chat" }) }), _jsx(TooltipIconButton, { tooltip: "New chat", className: buttonClass, "aria-label": "New chat", onClick: startChat, children: _jsx(SquarePen, { size: 18 }) }), _jsx(TooltipIconButton, { tooltip: "Chat history", className: buttonClass, "aria-label": "Chat history", "aria-expanded": showHistory, onClick: () => (showHistory ? returnToChat() : openHistory()), children: _jsx(History, { size: 18 }) }), _jsx(TooltipIconButton, { tooltip: "Collapse chat", style: chatOnly || chatWidth.compact ? { display: "none" } : undefined, className: buttonClass, "aria-label": "Collapse chat", onClick: () => {
                                     setContentCollapsed(false);
                                     setCollapsed(true);
                                 }, children: _jsx(PanelLeft, { size: 18 }) })] }))] }), collapsed && (_jsxs("div", { "data-chat-rail": true, className: "flex flex-col items-center gap-1", children: [_jsx(TooltipIconButton, { tooltip: "Open navigation", className: `${buttonClass} preview-mobile-navigation`, "aria-label": "Open navigation", onClick: toggleNavigation, children: _jsx(Menu, { size: 18 }) }), _jsx(TooltipIconButton, { tooltip: "Chat history", className: buttonClass, "aria-label": "Chat history", onClick: () => {

package/dist/workbench/conversation-history.d.ts

@@ -1,6 +1,6 @@
 import type { NavGroup } from "../index.js";
 /** History is a view of existing navigation targets, never a second chat runtime. */
-export declare function ConversationHistory({ groups, workspaceId, onClose, showBack, welcome, compact, onViewAll, }: {
+export declare function ConversationHistory({ groups, workspaceId, onClose, showBack, welcome, compact, onViewAll, entityId, rootContext, }: {
     groups: NavGroup[];
     workspaceId: unknown;
     onClose: () => void;
@@ -8,4 +8,7 @@ export declare function ConversationHistory({ groups, workspaceId, onClose, show
     welcome?: boolean;
     compact?: boolean;
     onViewAll?: () => void;
+    /** Current content entity. Compact homes show only an exact match unless this is the workspace root. */
+    entityId?: unknown;
+    rootContext?: boolean;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/workbench/conversation-history.js

@@ -3,9 +3,9 @@ import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuIte
 import { Button, Input } from "@iloveagents/foundry-web-primitives";
 import { Fragment, useEffect, useState } from "react";
 import { Link } from "react-router";
-import { ArrowLeft, MessageSquare, MoreHorizontal, Pin, Loader2, ChevronDown, Check, } from "lucide-react";
+import { ArrowLeft, MessageSquare, MoreHorizontal, Pin, Loader2, ChevronDown, Check, History, } from "lucide-react";
 /** History is a view of existing navigation targets, never a second chat runtime. */
-export function ConversationHistory({ groups, workspaceId, onClose, showBack = true, welcome = false, compact = false, onViewAll, }) {
+export function ConversationHistory({ groups, workspaceId, onClose, showBack = true, welcome = false, compact = false, onViewAll, entityId, rootContext = false, }) {
     const [loadingTo, setLoadingTo] = useState(null);
     const [loadError, setLoadError] = useState(null);
     const [all, setAll] = useState(!workspaceId);
@@ -16,9 +16,12 @@ export function ConversationHistory({ groups, workspaceId, onClose, showBack = t
         groups
             .filter((g) => g.meta?.type === "recent-chats" || g.meta?.type === "pinned-chats")
             .flatMap((g) => g.items);
-    const scopedItems = all || !workspaceId
+    const workspaceItems = all || !workspaceId
         ? allItems
         : (scoped?.meta?.workspaceConversations ?? scoped?.items ?? []);
+    const scopedItems = compact && workspaceId && !rootContext
+        ? workspaceItems.filter((item) => Boolean(entityId) && item.meta?.previewEntityId === entityId)
+        : workspaceItems;
     const items = [...new Map(scopedItems.map((item) => [item.to, item])).values()]
         .filter((item) => item.meta?.type !== "show-all-chats")
         .filter((item) => item.label.toLocaleLowerCase().includes(search.toLocaleLowerCase()))
@@ -31,7 +34,7 @@ export function ConversationHistory({ groups, workspaceId, onClose, showBack = t
             { label: "Recent chats", items: visibleItems.filter((item) => !item.meta?.pinned) },
         ]
         : [{ label: "", items: visibleItems }];
-    return (_jsxs("section", { "data-conversation-history": true, "aria-label": "Chat history", className: "mx-auto flex min-h-0 w-full max-w-3xl flex-1 flex-col px-4 pb-4", children: [welcome && (_jsxs("div", { className: "pb-6 pt-8", children: [_jsx("h1", { className: "text-xl font-semibold", children: "How can I help?" }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: "Start something new or continue a recent chat." })] })), showBack && (_jsxs("button", { onClick: onClose, className: "mb-4 flex items-center gap-2 py-2 text-xs text-muted-foreground hover:text-foreground", children: [_jsx(ArrowLeft, { size: 14 }), " Back to chat"] })), _jsxs("div", { className: "mb-3 mt-2 flex items-center justify-between", children: [_jsx("h2", { className: compact ? "text-xs font-medium text-muted-foreground" : "text-base font-semibold", children: "Conversation history" }), compact && (_jsx("button", { onClick: onViewAll, className: "text-xs text-muted-foreground hover:text-foreground", children: "View all" }))] }), Boolean(workspaceId) && (_jsx("div", { className: "mb-3", children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", "aria-label": "History filter", className: "w-full justify-between font-normal shadow-none", children: [_jsx("span", { className: "truncate", children: all ? "All conversations" : "Last used in this workspace" }), _jsx(ChevronDown, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" })] }) }), _jsx(DropdownMenuContent, { align: "start", className: "w-[var(--radix-dropdown-menu-trigger-width)]", children: [
+    return (_jsxs("section", { "data-conversation-history": true, "aria-label": compact ? "Recent conversations" : "Chat history", className: compact ? "w-full" : "mx-auto flex min-h-0 w-full max-w-3xl flex-1 flex-col px-4 pb-4", children: [welcome && (_jsxs("div", { className: "pb-6 pt-8", children: [_jsx("h1", { className: "text-xl font-semibold", children: "How can I help?" }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: "Start something new or continue a recent chat." })] })), showBack && (_jsxs("button", { onClick: onClose, className: "mb-4 flex items-center gap-2 py-2 text-xs text-muted-foreground hover:text-foreground", children: [_jsx(ArrowLeft, { size: 14 }), " Back to chat"] })), (!compact || items.length > 0) && (_jsx("div", { className: "mb-2 mt-2 flex items-center justify-between", children: _jsx("h2", { className: compact ? "text-xs font-medium text-muted-foreground" : "text-base font-semibold", children: compact ? "Recent conversations" : "Conversation history" }) })), Boolean(workspaceId) && !compact && (_jsx("div", { className: "mb-3", children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", "aria-label": "History filter", className: "w-full justify-between font-normal shadow-none", children: [_jsx("span", { className: "truncate", children: all ? "All conversations" : "Last used in this workspace" }), _jsx(ChevronDown, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" })] }) }), _jsx(DropdownMenuContent, { align: "start", className: "w-[var(--radix-dropdown-menu-trigger-width)]", children: [
                                 { value: false, label: "Last used in this workspace" },
                                 { value: true, label: "All conversations" },
                             ].map((option) => (_jsxs(DropdownMenuItem, { role: "menuitemradio", "aria-checked": all === option.value, onSelect: () => setAll(option.value), children: [_jsx("span", { className: "flex-1", children: option.label }), all === option.value && _jsx(Check, { className: "size-4", "aria-hidden": "true" })] }, option.label))) })] }) })), !compact && (_jsx(Input, { "aria-label": "Search chats", placeholder: "Search chats", value: search, onChange: (event) => setSearch(event.target.value), className: "mb-3" })), loadError && (_jsx("p", { role: "alert", className: "mb-2 text-xs text-destructive", children: loadError })), _jsxs("div", { className: "min-h-0 flex-1 overflow-y-auto", "aria-busy": Boolean(loadingTo), children: [sections
@@ -79,5 +82,5 @@ export function ConversationHistory({ groups, workspaceId, onClose, showBack = t
                                                                         ? "Location unavailable"
                                                                         : "Last outside a workspace" })] })] }), Boolean(item.actions?.length) && (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": `Actions for ${item.label}`, className: "mr-1 inline-flex size-7 shrink-0 items-center justify-center rounded-md text-muted-foreground opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[state=open]:opacity-100 [@media(hover:none)]:opacity-100 hover:bg-background", children: _jsx(MoreHorizontal, { className: "size-4" }) }) }), _jsx(DropdownMenuContent, { align: "end", children: item.actions?.map((action) => (_jsxs(Fragment, { children: [action.separator && _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onSelect: () => {
                                                                 void action.handler();
-                                                            }, className: action.destructive ? "text-destructive" : undefined, children: [_jsx(action.icon, { className: "mr-2 size-4" }), action.label] })] }, action.label))) })] }))] }, item.to)))] }, section.label))), items.length === 0 && (_jsx("p", { className: "py-3 text-sm text-muted-foreground", children: search ? "No matching chats" : "No chats yet" }))] })] }));
+                                                            }, className: action.destructive ? "text-destructive" : undefined, children: [_jsx(action.icon, { className: "mr-2 size-4" }), action.label] })] }, action.label))) })] }))] }, item.to)))] }, section.label))), items.length === 0 && !compact && (_jsx("p", { className: "py-3 text-sm text-muted-foreground", children: search ? "No matching chats" : "No chats yet" }))] }), compact && onViewAll && (_jsxs(Button, { variant: "ghost", size: "sm", onClick: onViewAll, className: "mt-1 h-9 w-fit gap-2 px-2 text-sm font-normal text-muted-foreground [@media(pointer:coarse)]:min-h-11", children: [_jsx(History, { className: "size-4", "aria-hidden": true }), "Conversation history"] }))] }));
 }

package/dist/workbench/use-workbench-state.d.ts

@@ -1,7 +1,11 @@
+import type { NavItem } from "../lib/nav-config.js";
+export declare function normalizeWorkbenchPath(path: string): string;
 export declare function useWorkbenchState(chatRoute: boolean): {
     panelOpen: boolean;
+    currentPage: string;
     chatOnly: boolean;
     pageLabel: string;
+    entityId: unknown;
     chatWidth: {
         min: number;
         max: number;
@@ -12,6 +16,7 @@ export declare function useWorkbenchState(chatRoute: boolean): {
         compact: boolean;
     };
     collapsed: boolean;
+    running: boolean;
     setCollapsed: import("react").Dispatch<import("react").SetStateAction<boolean>>;
     compactPane: "content" | "chat";
     setCompactPane: import("react").Dispatch<import("react").SetStateAction<"content" | "chat">>;
@@ -33,7 +38,7 @@ export declare function useWorkbenchState(chatRoute: boolean): {
         label: string;
         tree?: boolean;
         icon?: import("lucide-react").LucideIcon;
-        items: import("../index.js").NavItem[];
+        items: NavItem[];
         priority?: number;
         defaultCollapsed?: boolean;
         to?: string;

package/dist/workbench/use-workbench-state.js

@@ -6,6 +6,20 @@ import { Button } from "@iloveagents/foundry-web-primitives";
 import { useSidebarStore, useChatBubbleStore, useToolPanelStore, useNewConversation, useNavStore, useAppStore, } from "../index.js";
 import { History, Settings, Layers } from "lucide-react";
 import { useChatWidth } from "./use-chat-width.js";
+export function normalizeWorkbenchPath(path) {
+    return path === "/" ? path : path.replace(/\/+$/, "");
+}
+function findExactWorkbenchItem(items, pathname) {
+    const target = normalizeWorkbenchPath(pathname);
+    for (const item of items) {
+        if (normalizeWorkbenchPath(item.to) === target)
+            return item;
+        const nested = item.children && findExactWorkbenchItem(item.children, pathname);
+        if (nested)
+            return nested;
+    }
+    return undefined;
+}
 function useWorkbenchNavigation() {
     const navGroups = useNavStore((s) => s.config);
     const workspaceGroups = useMemo(() => {
@@ -57,7 +71,12 @@ export function useWorkbenchState(chatRoute) {
     const panelOpen = useToolPanelStore((s) => s.isOpen && !s.isWindowHosted);
     const chatOnly = chatRoute && !panelOpen;
     const location = useLocation();
+    const { navGroups, workspaceGroups, staticNavigationGroups } = useWorkbenchNavigation();
+    const routeItem = useMemo(() => navGroups
+        .map((group) => findExactWorkbenchItem(group.items, location.pathname))
+        .find((item) => item !== undefined), [location.pathname, navGroups]);
     const pageLabel = useAppStore((s) => s.navContext.label);
+    const entityId = routeItem?.meta?.spacesEntityId;
     const chatWidth = useChatWidth();
     const [desktopCollapsed, setCollapsed] = useState(false);
     const collapsed = !chatWidth.compact && desktopCollapsed;
@@ -73,6 +92,7 @@ export function useWorkbenchState(chatRoute) {
         // the same address again. Collapsing remains local until the next entry.
     }, [chatOnly, location.key]);
     const [historyOpen, setHistoryOpen] = useState(false);
+    const running = useAuiState((s) => s.thread.isRunning);
     const emptyChat = useAuiState((s) => s.thread.messages.length === 0 && !s.thread.isRunning && !s.thread.isLoading);
     const wasEmptyChat = useRef(emptyChat);
     useEffect(() => {
@@ -88,9 +108,8 @@ export function useWorkbenchState(chatRoute) {
     const openHistory = () => {
         setHistoryOpen(true);
     };
-    const historyShortcut = (_jsxs(Button, { variant: "ghost", size: "sm", onClick: openHistory, className: "h-8 w-fit gap-2 px-3 text-xs font-normal text-muted-foreground [@media(pointer:coarse)]:min-h-11", children: [_jsx(History, { className: "size-3.5", "aria-hidden": true }), "Conversation history"] }));
+    const historyShortcut = (_jsxs(Button, { variant: "ghost", size: "sm", onClick: openHistory, className: "h-9 w-fit gap-2 px-2 text-sm font-normal text-muted-foreground [@media(pointer:coarse)]:min-h-11", children: [_jsx(History, { className: "size-4", "aria-hidden": true }), "Conversation history"] }));
     const toggleNavigation = useSidebarStore((s) => s.toggleMobile);
-    const { navGroups, workspaceGroups, staticNavigationGroups } = useWorkbenchNavigation();
     useEffect(() => {
         if (panelOpen) {
             setContentCollapsed(false);
@@ -118,10 +137,13 @@ export function useWorkbenchState(chatRoute) {
     }, [requestedChat]);
     return {
         panelOpen,
+        currentPage: location.pathname,
         chatOnly,
         pageLabel,
+        entityId,
         chatWidth,
         collapsed,
+        running,
         setCollapsed,
         compactPane,
         setCompactPane,

package/dist/workbench/welcome-intro.js

@@ -1,9 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from "@iloveagents/foundry-web-primitives";
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, } from "../index.js";
+import { ChatHomeStartersSlot } from "../components/chat-slots.js";
 import { Layers } from "lucide-react";
 export function WelcomeIntro({ navGroups, historyShortcut, }) {
-    return (_jsxs("div", { className: "mb-4 text-center", children: [_jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: "What would you like to get done?" }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: "Find information, create or edit content, and run actions across your spaces." }), _jsxs("div", { className: "mt-4 flex flex-wrap items-center justify-center gap-2", children: [historyShortcut, navGroups.some((group) => group.meta?.type === "spaces-workspaces" && group.createActions?.length) && (_jsx("div", { children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "h-8 gap-2 px-3 text-xs font-normal text-muted-foreground [@media(pointer:coarse)]:min-h-11", children: [_jsx(Layers, { className: "size-3.5", "aria-hidden": "true" }), "Create a space"] }) }), _jsx(DropdownMenuContent, { align: "center", children: navGroups
+    return (_jsxs("div", { className: "mb-4 text-center", children: [_jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: "What would you like to get done?" }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: "Find information, create or edit content, and run actions across your spaces." }), _jsx("div", { className: "mx-auto mt-4 max-w-sm text-left", children: _jsx(ChatHomeStartersSlot, { priority: 10 }) }), _jsxs("div", { className: "mt-4 flex flex-wrap items-center justify-center gap-2", children: [historyShortcut, navGroups.some((group) => group.meta?.type === "spaces-workspaces" && group.createActions?.length) && (_jsx("div", { children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "h-8 gap-2 px-3 text-xs font-normal text-muted-foreground [@media(pointer:coarse)]:min-h-11", children: [_jsx(Layers, { className: "size-3.5", "aria-hidden": "true" }), "Create a space"] }) }), _jsx(DropdownMenuContent, { align: "center", children: navGroups
                                         .filter((group) => group.meta?.type === "spaces-workspaces")
                                         .flatMap((group) => group.createActions ?? [])
                                         .map((action) => (_jsx(DropdownMenuItem, { onSelect: () => action.handler(), children: action.label }, action.id))) })] }) }))] })] }));

package/dist/workbench/workbench.js

@@ -1,21 +1,32 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { WorkbenchNavigation } from "./navigation.js";
 import { WorkbenchChatHeader } from "./chat-header.js";
 import { WorkbenchContentPane } from "./content-pane.js";
 import { ChatResizeHandle } from "./chat-resize-handle.js";
+import { ChatEmptyState } from "../components/chat-empty-state.js";
 import { WelcomeIntro } from "./welcome-intro.js";
-import { useWorkbenchState } from "./use-workbench-state.js";
+import { normalizeWorkbenchPath, useWorkbenchState } from "./use-workbench-state.js";
 import { WorkbenchStyles } from "./workbench-styles.js";
 import { Button } from "@iloveagents/foundry-web-primitives";
 import { ChatContent, TooltipIconButton } from "../index.js";
-import { FileText, MessageSquare, Menu } from "lucide-react";
+import { FileText, MessageSquare, Menu, LoaderCircle } from "lucide-react";
 import { ConversationHistory } from "./conversation-history.js";
 export function WorkbenchPreview({ page, chatOnly: chatRoute = false, }) {
-    const { panelOpen, chatOnly, pageLabel, chatWidth, collapsed, setCollapsed, compactPane, setCompactPane, contentCollapsed, setContentCollapsed, contentHidden, historyOpen, emptyChat, showHistory, spaciousChat, returnToChat, openHistory, historyShortcut, toggleNavigation, navGroups, workspaceGroups, staticNavigationGroups, closePanel, startChat, } = useWorkbenchState(chatRoute);
+    const { panelOpen, currentPage, chatOnly, pageLabel, entityId, chatWidth, collapsed, running, setCollapsed, compactPane, setCompactPane, contentCollapsed, setContentCollapsed, contentHidden, historyOpen, emptyChat, showHistory, spaciousChat, returnToChat, openHistory, historyShortcut, toggleNavigation, navGroups, workspaceGroups, staticNavigationGroups, closePanel, startChat, } = useWorkbenchState(chatRoute);
+    const workspaceId = workspaceGroups?.[0]?.meta?.exclusiveRootId;
+    const rootItem = workspaceGroups?.[0]
+        ? (workspaceGroups[0].items.find((item) => item.to === workspaceGroups[0].focusOn) ??
+            workspaceGroups[0].items[0])
+        : undefined;
+    const rootContext = Boolean(workspaceId &&
+        rootItem &&
+        normalizeWorkbenchPath(rootItem.to) === normalizeWorkbenchPath(currentPage));
+    const conversationHome = (_jsx(ConversationHistory, { groups: navGroups, workspaceId: workspaceId, entityId: entityId, rootContext: rootContext, onClose: returnToChat, onViewAll: openHistory, showBack: false, compact: true }));
+    const emptyChatFooter = workspaceId ? conversationHome : historyShortcut;
     const buttonClass = "inline-flex items-center justify-center rounded-lg p-2 text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-2 focus-visible:outline-primary";
     return (_jsxs("div", { className: "workbench-preview flex min-h-0 flex-1 overflow-hidden", "data-workspace-navigation": workspaceGroups ? "true" : undefined, children: [_jsx(WorkbenchStyles, {}), _jsx(WorkbenchNavigation, { groups: staticNavigationGroups, workspace: !!workspaceGroups, onNewConversation: startChat }), _jsxs("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", "data-workbench-surface": true, role: "region", "aria-label": "Workspace working area", children: [chatWidth.compact && (_jsxs("div", { className: "flex shrink-0 items-center gap-1 border-b border-border px-2 py-1", role: "group", "aria-label": "Workspace panes", children: [_jsx(Button, { variant: "ghost", size: "icon", className: "preview-mobile-navigation size-11", "aria-label": "Open navigation", onClick: toggleNavigation, children: _jsx(Menu, { className: "size-4" }) }), ["content", "chat"]
                                 .filter((pane) => !chatOnly || pane === "chat")
-                                .map((pane) => (_jsxs(Button, { variant: "ghost", className: "h-11 gap-1.5 px-3 aria-pressed:bg-muted", "aria-pressed": chatOnly || compactPane === pane, "aria-controls": pane === "chat" ? "preview-assistant" : "preview-content", onClick: () => setCompactPane(pane), children: [pane === "chat" ? (_jsx(MessageSquare, { className: "size-4" })) : (_jsx(FileText, { className: "size-4" })), pane === "chat" ? "Chat" : "Content"] }, pane)))] })), _jsxs("div", { ref: chatWidth.containerRef, className: "relative flex min-h-0 min-w-0 flex-1 overflow-x-auto", children: [_jsxs("section", { id: "preview-assistant", "data-panel-motion": true, "data-global-chat": spaciousChat || undefined, "data-chat-collapsed": collapsed ? "true" : undefined, inert: chatWidth.compact && !chatOnly && compactPane !== "chat", "aria-label": "Assistant conversation", className: "relative flex min-h-0 shrink-0 flex-col", style: {
+                                .map((pane) => (_jsxs(Button, { variant: "ghost", className: "h-11 gap-1.5 px-3 aria-pressed:bg-muted", "aria-pressed": chatOnly || compactPane === pane, "aria-controls": pane === "chat" ? "preview-assistant" : "preview-content", "aria-label": pane === "chat" && running ? "Chat — AI is working" : undefined, onClick: () => setCompactPane(pane), children: [pane === "chat" ? (running ? (_jsx(LoaderCircle, { className: "size-4 animate-spin motion-reduce:animate-none text-primary" })) : (_jsx(MessageSquare, { className: "size-4" }))) : (_jsx(FileText, { className: "size-4" })), pane === "chat" ? "Chat" : "Content"] }, pane)))] })), _jsxs("div", { ref: chatWidth.containerRef, className: "relative flex min-h-0 min-w-0 flex-1 overflow-x-auto", children: [_jsxs("section", { id: "preview-assistant", "data-panel-motion": true, "data-global-chat": spaciousChat || undefined, "data-chat-collapsed": collapsed ? "true" : undefined, inert: chatWidth.compact && !chatOnly && compactPane !== "chat", "aria-label": "Assistant conversation", className: "relative flex min-h-0 shrink-0 flex-col", style: {
                                     display: chatWidth.compact && !chatOnly && compactPane !== "chat" ? "none" : "flex",
                                     width: chatWidth.compact || chatOnly
                                         ? "100%"
@@ -25,8 +36,8 @@ export function WorkbenchPreview({ page, chatOnly: chatRoute = false, }) {
                                                 ? "calc(100% - 44px)"
                                                 : chatWidth.width,
                                     background: "var(--background)",
-                                }, children: [_jsx(WorkbenchChatHeader, { collapsed: collapsed, chatWidth: chatWidth, buttonClass: buttonClass, toggleNavigation: toggleNavigation, setCollapsed: setCollapsed, showHistory: showHistory, startChat: startChat, returnToChat: returnToChat, openHistory: openHistory, chatOnly: chatOnly, setContentCollapsed: setContentCollapsed }), !collapsed && showHistory && (_jsx(ConversationHistory, { groups: navGroups, workspaceId: workspaceGroups?.[0]?.meta?.exclusiveRootId, onClose: returnToChat, showBack: true })), !chatWidth.compact && !collapsed && !contentCollapsed && (_jsx(ChatResizeHandle, { chatWidth: chatWidth })), _jsx("div", { className: "min-h-0 flex-1 flex-col", style: {
+                                }, children: [_jsx(WorkbenchChatHeader, { collapsed: collapsed, running: running, chatWidth: chatWidth, buttonClass: buttonClass, toggleNavigation: toggleNavigation, setCollapsed: setCollapsed, showHistory: showHistory, startChat: startChat, returnToChat: returnToChat, openHistory: openHistory, chatOnly: chatOnly, setContentCollapsed: setContentCollapsed }), !collapsed && showHistory && (_jsx(ConversationHistory, { groups: navGroups, workspaceId: workspaceId, onClose: returnToChat, showBack: true })), !chatWidth.compact && !collapsed && !contentCollapsed && (_jsx(ChatResizeHandle, { chatWidth: chatWidth })), _jsx("div", { className: "min-h-0 flex-1 flex-col", style: {
                                             display: collapsed || showHistory ? "none" : "flex",
                                             paddingBottom: spaciousChat && emptyChat && !historyOpen ? "clamp(32px, 10vh, 96px)" : undefined,
-                                        }, children: _jsx(ChatContent, { centerComposer: spaciousChat && emptyChat && !historyOpen, composerIntro: spaciousChat && emptyChat ? (_jsx(WelcomeIntro, { navGroups: navGroups, historyShortcut: historyShortcut })) : undefined, compactComposer: !spaciousChat, hideCurrentPageBadge: true, showPinButton: false, starterSuggestions: [], emptyState: _jsxs("div", { className: "flex min-h-full flex-col justify-center gap-3 px-6 py-8", children: [_jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "What would you like to get done?" }), _jsx("p", { className: "max-w-sm text-sm leading-relaxed text-muted-foreground", children: pageLabel && !pageLabel.startsWith("/") ? (_jsxs(_Fragment, { children: ["Work with ", _jsx("span", { className: "font-medium text-foreground", children: pageLabel }), " ", "or across your spaces: find information, create or edit content, and run actions."] })) : ("Find information, create or edit content, and run actions across your spaces.") }), _jsx("p", { className: "max-w-sm text-xs leading-relaxed text-muted-foreground", children: "Your conversation continues as you browse. Select text or a field to work more specifically." }), historyShortcut] }) }) })] }), _jsx(WorkbenchContentPane, { contentHidden: contentHidden, panelOpen: panelOpen, chatWidth: chatWidth, contentCollapsed: contentCollapsed, collapsed: collapsed, buttonClass: buttonClass, setCollapsed: setCollapsed, setContentCollapsed: setContentCollapsed, closePanel: closePanel, page: page }), contentCollapsed && !chatOnly && !chatWidth.compact && (_jsx("aside", { "aria-label": "Collapsed content", className: "flex w-11 shrink-0 flex-col items-center", style: { width: 44 }, children: _jsx("div", { className: "flex h-full w-full flex-col items-center", "data-chat-rail": true, children: _jsx("div", { className: "flex items-center justify-center", style: { height: 60 }, children: _jsx(TooltipIconButton, { tooltip: "Expand content", className: buttonClass, "aria-label": "Expand content", onClick: () => setContentCollapsed(false), children: _jsx(FileText, { size: 18 }) }) }) }) }))] })] })] }));
+                                        }, children: _jsx(ChatContent, { centerComposer: spaciousChat && emptyChat && !historyOpen, composerIntro: spaciousChat && emptyChat ? (_jsx(WelcomeIntro, { navGroups: navGroups, historyShortcut: emptyChatFooter })) : undefined, compactComposer: !spaciousChat, hideCurrentPageBadge: true, showPinButton: false, starterSuggestions: [], emptyState: _jsx(ChatEmptyState, { pageLabel: pageLabel, showHomeStarters: !spaciousChat, children: emptyChatFooter }) }) })] }), _jsx(WorkbenchContentPane, { contentHidden: contentHidden, panelOpen: panelOpen, chatWidth: chatWidth, contentCollapsed: contentCollapsed, collapsed: collapsed, buttonClass: buttonClass, setCollapsed: setCollapsed, setContentCollapsed: setContentCollapsed, closePanel: closePanel, page: page }), contentCollapsed && !chatOnly && !chatWidth.compact && (_jsx("aside", { "aria-label": "Collapsed content", className: "flex w-11 shrink-0 flex-col items-center", style: { width: 44 }, children: _jsx("div", { className: "flex h-full w-full flex-col items-center", "data-chat-rail": true, children: _jsx("div", { className: "flex items-center justify-center", style: { height: 60 }, children: _jsx(TooltipIconButton, { tooltip: "Expand content", className: buttonClass, "aria-label": "Expand content", onClick: () => setContentCollapsed(false), children: _jsx(FileText, { size: 18 }) }) }) }) }))] })] })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iloveagents/foundry-web-ui",
-  "version": "0.28.0",
+  "version": "0.29.0",
   "license": "MIT",
   "description": "React agent UI core for Foundry UI — chat, composer, AG-UI adapter for assistant-ui, tool cards, panels, sidebar, theme runtime, and UI stores.",
   "keywords": [
@@ -80,8 +80,8 @@
     "recharts": "^3.10.1",
     "remark-gfm": "^4.0.0",
     "tailwind-merge": "^3.5.0",
-    "@iloveagents/foundry-agent": "^0.28.0",
-    "@iloveagents/foundry-web-primitives": "^0.28.0"
+    "@iloveagents/foundry-agent": "^0.29.0",
+    "@iloveagents/foundry-web-primitives": "^0.29.0"
   },
   "devDependencies": {
     "@ag-ui/client": "^0.0.52",