@iloveagents/foundry-web-ui 0.29.0 → 0.30.0

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

@@ -4,22 +4,12 @@ import { useAuiState } from "@assistant-ui/react";
 import { useEffect, useMemo, useRef, useState } from "react";
 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 { MessagesSquare, Settings, Layers } from "lucide-react";
 import { useChatWidth } from "./use-chat-width.js";
+import { findNavItem } from "../lib/nav-config.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(() => {
@@ -33,9 +23,12 @@ function useWorkbenchNavigation() {
             const space = workspaceGroups[0];
             const root = space.items.find((item) => item.to === space.focusOn) ?? space.items[0];
             return [
+                ...navGroups
+                    .filter((group) => group.meta?.showInWorkspaceNavigation)
+                    .map((group) => ({ ...group, priority: 1100 })),
                 {
                     ...space,
-                    label: "Spaces",
+                    label: "All spaces",
                     icon: Layers,
                     priority: 1000,
                     items: root
@@ -56,7 +49,7 @@ function useWorkbenchNavigation() {
             ...navGroups
                 .filter((group) => !["recent-chats", "pinned-chats"].includes(String(group.meta?.type)))
                 .map((group) => group.meta?.type === "spaces-workspaces"
-                ? { ...group, label: "Spaces", icon: Layers }
+                ? { ...group, label: "All spaces", icon: Layers, createActions: undefined }
                 : group.label === "Admin"
                     ? { ...group, icon: Settings }
                     : group.label === "Activity"
@@ -72,9 +65,13 @@ export function useWorkbenchState(chatRoute) {
     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 routeItem = useMemo(() => {
+        const item = findNavItem(navGroups, location.pathname + location.search)?.item;
+        return item &&
+            normalizeWorkbenchPath(item.to.split("?")[0]) === normalizeWorkbenchPath(location.pathname)
+            ? item
+            : undefined;
+    }, [location.pathname, location.search, navGroups]);
     const pageLabel = useAppStore((s) => s.navContext.label);
     const entityId = routeItem?.meta?.spacesEntityId;
     const chatWidth = useChatWidth();
@@ -108,7 +105,7 @@ export function useWorkbenchState(chatRoute) {
     const openHistory = () => {
         setHistoryOpen(true);
     };
-    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 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(MessagesSquare, { className: "size-4", "aria-hidden": true }), "Conversation history"] }));
     const toggleNavigation = useSidebarStore((s) => s.toggleMobile);
     useEffect(() => {
         if (panelOpen) {

package/dist/workbench/welcome-intro.js

@@ -4,7 +4,7 @@ import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuIte
 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." }), _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
+    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-9 gap-2 px-2 text-sm font-normal text-muted-foreground [@media(pointer:coarse)]:min-h-11", children: [_jsx(Layers, { className: "size-4", "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-styles.js

@@ -231,10 +231,10 @@ export function WorkbenchStyles() {
         }
         .workbench-preview [data-conversation-row],
         .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-depth] {
-          min-height: 36px;
-          padding-top: 6px;
-          padding-bottom: 6px;
-          gap: 10px;
+          min-height: 32px;
+          padding-top: 4px;
+          padding-bottom: 4px;
+          gap: 8px;
           border-radius: 8px;
         }
         .workbench-preview:not([data-workspace-navigation]) [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-depth="0"] {
@@ -252,18 +252,17 @@ export function WorkbenchStyles() {
         }
         .workbench-preview:not([data-workspace-navigation]) [data-sidebar-surface]:not([data-sidebar-collapsed]) div[data-nav-depth="0"] > button:not([data-nav-twisty]) {
           padding-left: 12px;
-          min-height: 36px;
-          gap: 10px;
+          min-height: 32px;
+          gap: 8px;
         }
-        [data-workspace-navigation] [data-nav-group-label="Spaces"] > :first-child,
         .workbench-preview [data-sidebar-surface] nav > [data-nav-group-label]:first-child > div:has(> [data-nav-group-header]) {
           padding-top: 0;
         }
-        [data-workspace-navigation] [data-nav-group-label="Spaces"] [data-nav-depth="0"] > button {
-          font-size: 15px;
+        [data-workspace-navigation] [data-nav-group-label="All spaces"] [data-nav-depth="0"] > button {
+          font-size: 14px;
           font-weight: 600;
-          letter-spacing: -0.015em;
-          line-height: 22px;
+          letter-spacing: normal;
+          line-height: 20px;
         }
         [data-workspace-navigation] [data-nav-group-label="Recent chats"] > :first-child {
           padding-top: 10px;
@@ -271,6 +270,38 @@ export function WorkbenchStyles() {
         [data-workspace-navigation] [data-nav-group-label="Content"] {
           margin-top: 0;
         }
+        .workbench-preview [data-nav-group-label="All spaces"] > div:has(> [data-nav-group-header]) {
+          padding-top: 8px;
+        }
+        .workbench-preview [data-nav-group-label="All spaces"] [data-nav-group-header] {
+          height: 32px;
+          min-height: 32px;
+          padding-top: 0;
+          padding-bottom: 0;
+        }
+        .workbench-preview [data-nav-group-label="All spaces"] [data-nav-group-items] {
+          animation: none;
+        }
+        /* The first utility row shares the heading line in both scopes. */
+        .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) nav:has(> [data-nav-group-label="Activity"]:first-child) {
+          padding-top: 8px;
+        }
+        .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-group-label="Activity"] [data-nav-depth="0"] {
+          padding-left: 12px;
+        }
+        .workbench-preview [data-nav-group-label="Activity"] [data-nav-twisty-cell]:not(:has([data-nav-twisty])) {
+          display: none;
+        }
+        .workbench-preview[data-workspace-navigation]:not(:has([data-page-title-row])) [data-chat-empty-state] {
+          padding-top: 28px;
+        }
+        .workbench-preview[data-workspace-navigation] [data-preview-entity-header] > [data-entity-header-row] {
+          padding-top: 24px;
+          min-height: 76px;
+        }
+        .workbench-preview[data-workspace-navigation] [data-entity-header-identity]:not(:has([aria-label="Page location"])) {
+          padding-top: 18px;
+        }
 
         [data-workspace-navigation] [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-group-label="Content"] button[data-nav-depth],
         [data-workspace-navigation] [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-group-label="Content"] div[data-nav-depth] > button:not([data-nav-twisty]) {
@@ -280,11 +311,32 @@ export function WorkbenchStyles() {
           left: calc(12px + var(--nav-depth, 0) * 16px);
         }
 
+        @media (pointer: fine) {
+          .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-depth] {
+            height: 32px;
+            min-height: 32px;
+            padding-top: 0;
+            padding-bottom: 0;
+          }
+          .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) div[data-nav-depth] > button:not([data-nav-twisty]) {
+            height: 30px;
+            min-height: 30px;
+            padding-top: 0;
+            padding-bottom: 0;
+          }
+          .workbench-preview:not([data-workspace-navigation]) [data-sidebar-surface]:not([data-sidebar-collapsed]) div[data-nav-depth="0"] > button:not([data-nav-twisty]) {
+            min-height: 30px;
+          }
+        }
+
         @media (pointer: coarse) {
           .workbench-preview [data-conversation-row],
           .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) [data-nav-depth] {
             min-height: 44px;
           }
+          .workbench-preview [data-sidebar-surface]:not([data-sidebar-collapsed]) div[data-nav-depth] > button:not([data-nav-twisty]) {
+            min-height: 44px;
+          }
         }
       ` }));
 }

package/dist/workbench/workbench.js

@@ -39,5 +39,5 @@ export function WorkbenchPreview({ page, chatOnly: chatRoute = false, }) {
                                 }, 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: 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 }) }) }) }) }))] })] })] }));
+                                        }, children: _jsx(ChatContent, { centerComposer: spaciousChat && emptyChat && !historyOpen, composerIntro: spaciousChat && emptyChat ? (_jsx(WelcomeIntro, { navGroups: navGroups, historyShortcut: emptyChatFooter })) : undefined, compactComposer: !spaciousChat, 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.29.0",
+  "version": "0.30.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.29.0",
-    "@iloveagents/foundry-web-primitives": "^0.29.0"
+    "@iloveagents/foundry-agent": "^0.30.0",
+    "@iloveagents/foundry-web-primitives": "^0.30.0"
   },
   "devDependencies": {
     "@ag-ui/client": "^0.0.52",