@object-ui/app-shell 5.4.1 → 6.0.0

package/CHANGELOG.md

@@ -1,5 +1,74 @@
 # @object-ui/app-shell — Changelog
 
+## 6.0.0
+
+### Major Changes
+
+- 168a4d0: ai
+
+### Patch Changes
+
+- 451bbee: **HITL conversation loop:** `useHitlInChat` now accepts a
+  `continueConversation(prompt, ctx)` callback. After the operator approves
+  or rejects a tool call from inline chat buttons, the hook synthesises a
+  short follow-up user prompt (tagged `[HITL pa_xxx]`, with the executed
+  result or rejection reason) and invokes the callback so the LLM
+  continues the conversation with full awareness of the outcome.
+
+  `ConsoleFloatingChatbot` wires this callback to `useObjectChat`'s
+  `sendMessage`, closing the loop end-to-end. Execution failures stay
+  visible in the inline status badge but do NOT continue automatically —
+  the operator decides next steps.
+
+  No framework changes required. Internal `idMap` now also tracks the
+  tool name so the synthesised prompt is human-readable. New test suite
+  `useHitlInChat.test.tsx` covers approve/reject/failed/no-callback
+  branches.
+
+- Updated dependencies [451bbee]
+  - @object-ui/plugin-chatbot@6.0.0
+  - @object-ui/types@6.0.0
+  - @object-ui/core@6.0.0
+  - @object-ui/i18n@6.0.0
+  - @object-ui/react@6.0.0
+  - @object-ui/components@6.0.0
+  - @object-ui/fields@6.0.0
+  - @object-ui/layout@6.0.0
+  - @object-ui/data-objectstack@6.0.0
+  - @object-ui/auth@6.0.0
+  - @object-ui/permissions@6.0.0
+  - @object-ui/plugin-calendar@6.0.0
+  - @object-ui/plugin-charts@6.0.0
+  - @object-ui/plugin-dashboard@6.0.0
+  - @object-ui/plugin-designer@6.0.0
+  - @object-ui/plugin-detail@6.0.0
+  - @object-ui/plugin-form@6.0.0
+  - @object-ui/plugin-grid@6.0.0
+  - @object-ui/plugin-kanban@6.0.0
+  - @object-ui/plugin-list@6.0.0
+  - @object-ui/plugin-report@6.0.0
+  - @object-ui/plugin-view@6.0.0
+  - @object-ui/collaboration@6.0.0
+  - @object-ui/providers@6.0.0
+
+## 5.4.2
+
+### Patch Changes
+
+- 3efeecf: ai
+  - @object-ui/types@5.4.2
+  - @object-ui/core@5.4.2
+  - @object-ui/i18n@5.4.2
+  - @object-ui/react@5.4.2
+  - @object-ui/components@5.4.2
+  - @object-ui/fields@5.4.2
+  - @object-ui/layout@5.4.2
+  - @object-ui/data-objectstack@5.4.2
+  - @object-ui/auth@5.4.2
+  - @object-ui/permissions@5.4.2
+  - @object-ui/collaboration@5.4.2
+  - @object-ui/providers@5.4.2
+
 ## 5.4.1
 
 ### Patch Changes

package/dist/console/home/HomeLayout.js

@@ -8,13 +8,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *
  * @module
  */
-import { useEffect, Suspense, lazy } from 'react';
+import { useEffect } from 'react';
 import { useNavigationContext } from '../../context/NavigationContext';
 import { AppHeader } from '../../layout/AppHeader';
 import { useDiscovery } from '@object-ui/react';
-// Lazy-load the chatbot so its heavy markdown deps stay out of the initial
-// paint until the AI assistant is actually enabled.
-const ConsoleFloatingChatbot = lazy(() => import('../../layout/ConsoleFloatingChatbot'));
+// Lightweight FAB stub — the heavy chat chunk graph only downloads on
+// first hover/click. See ../../layout/ConsoleChatbotFab.tsx.
+import { ConsoleChatbotFab } from '../../layout/ConsoleChatbotFab';
 export function HomeLayout({ children }) {
     const { setContext } = useNavigationContext();
     const { isAiEnabled } = useDiscovery();
@@ -26,5 +26,5 @@ export function HomeLayout({ children }) {
     useEffect(() => {
         setContext('home');
     }, [setContext]);
-    return (_jsxs("div", { className: "flex min-h-svh w-full flex-col bg-background", "data-testid": "home-layout", children: [_jsx("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: _jsx(AppHeader, { variant: "home" }) }), _jsx("main", { className: "flex-1 min-w-0 overflow-auto pb-20 sm:pb-0", children: children }), showChatbot && (_jsx(Suspense, { fallback: null, children: _jsx(ConsoleFloatingChatbot, { appLabel: "Workspace", objects: [] }) }))] }));
+    return (_jsxs("div", { className: "flex min-h-svh w-full flex-col bg-background", "data-testid": "home-layout", children: [_jsx("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: _jsx(AppHeader, { variant: "home" }) }), _jsx("main", { className: "flex-1 min-w-0 overflow-auto pb-20 sm:pb-0", children: children }), showChatbot && _jsx(ConsoleChatbotFab, { appLabel: "Workspace", objects: [] })] }));
 }

package/dist/console/organizations/OrganizationsPage.js

@@ -14,6 +14,7 @@ import { useAuth } from '@object-ui/auth';
 import { useObjectTranslation } from '@object-ui/i18n';
 import { useNavigate } from 'react-router-dom';
 import { CreateWorkspaceDialog } from './CreateWorkspaceDialog';
+import { resolveHomeUrl } from './resolveHomeUrl';
 function getOrgInitials(name) {
     return name
         .split(/[\s_-]+/)
@@ -42,9 +43,7 @@ export function OrganizationsPage() {
             if (org.id !== activeOrganization?.id) {
                 await switchOrganization(org.id);
             }
-            const base = import.meta.env.BASE_URL || '/';
-            const normalizedBase = base.endsWith('/') ? base : `${base}/`;
-            window.location.href = `${window.location.origin}${normalizedBase}home`;
+            window.location.href = resolveHomeUrl();
         }
         catch (err) {
             console.error('[OrganizationsPage] Failed to switch:', err);

package/dist/console/organizations/resolveHomeUrl.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Resolve the absolute URL of the console "home" route used after switching
+ * the active organization.
+ *
+ * Earlier versions concatenated `import.meta.env.BASE_URL` to
+ * `window.location.origin` ("`${origin}${base}home`"). That was correct for
+ * apps built with an absolute Vite base (e.g. `base: '/_console/'`), but
+ * silently broken for portable builds that ship with `base: './'` — the
+ * resulting URL `https://host./home` has a trailing-dot host (`host.` is a
+ * fully-qualified-domain marker the browser keeps) AND drops the mount
+ * prefix, landing the user on a 404.
+ *
+ * The fix is to resolve `home` against `document.baseURI`, which already
+ * accounts for any `<base href="...">` injected by the host page. This works
+ * for both `<base href="/_console/">` (tenant deployments) and
+ * `<base href="/">` (root-mount deployments), and also for hosts that omit
+ * `<base>` entirely (falls back to the current document URL's directory).
+ */
+export declare function resolveHomeUrl(baseURI?: string): string;

package/dist/console/organizations/resolveHomeUrl.js

@@ -0,0 +1,21 @@
+/**
+ * Resolve the absolute URL of the console "home" route used after switching
+ * the active organization.
+ *
+ * Earlier versions concatenated `import.meta.env.BASE_URL` to
+ * `window.location.origin` ("`${origin}${base}home`"). That was correct for
+ * apps built with an absolute Vite base (e.g. `base: '/_console/'`), but
+ * silently broken for portable builds that ship with `base: './'` — the
+ * resulting URL `https://host./home` has a trailing-dot host (`host.` is a
+ * fully-qualified-domain marker the browser keeps) AND drops the mount
+ * prefix, landing the user on a 404.
+ *
+ * The fix is to resolve `home` against `document.baseURI`, which already
+ * accounts for any `<base href="...">` injected by the host page. This works
+ * for both `<base href="/_console/">` (tenant deployments) and
+ * `<base href="/">` (root-mount deployments), and also for hosts that omit
+ * `<base>` entirely (falls back to the current document URL's directory).
+ */
+export function resolveHomeUrl(baseURI = document.baseURI) {
+    return new URL('home', baseURI).toString();
+}

package/dist/layout/ConsoleChatbotFab.d.ts

@@ -0,0 +1,3 @@
+import type { ConsoleFloatingChatbotProps } from './ConsoleFloatingChatbot';
+export type ConsoleChatbotFabProps = ConsoleFloatingChatbotProps;
+export declare function ConsoleChatbotFab(props: ConsoleChatbotFabProps): import("react/jsx-runtime").JSX.Element;

package/dist/layout/ConsoleChatbotFab.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ConsoleChatbotFab
+ *
+ * Lightweight FAB proxy for the console's floating AI assistant.
+ *
+ * Before any interaction this component renders a small, zero-dependency
+ * button (~1KB). On first hover/focus it speculatively warms the heavy
+ * chat chunk graph (plugin-chatbot → streamdown → shiki → mermaid →
+ * @ai-sdk, ~20MB); on first click it lazy-mounts `<ConsoleFloatingChatbot
+ * defaultOpen />` which takes over (its own FAB replaces this stub).
+ *
+ * Net effect: every console page-load no longer pays the chat-bundle
+ * cost just for the FAB to be visible — those bytes only download when
+ * the user actually opens (or hovers) the assistant.
+ *
+ * @module
+ */
+import { Suspense, lazy, useState } from 'react';
+const ConsoleFloatingChatbot = lazy(() => import('./ConsoleFloatingChatbot'));
+const prefetchChatbot = () => {
+    void import('./ConsoleFloatingChatbot');
+};
+export function ConsoleChatbotFab(props) {
+    const [armed, setArmed] = useState(false);
+    if (armed) {
+        return (_jsx(Suspense, { fallback: null, children: _jsx(ConsoleFloatingChatbot, { ...props, defaultOpen: true }) }));
+    }
+    return (_jsx("button", { type: "button", "aria-label": `Open ${props.appLabel} assistant`, onClick: () => setArmed(true), onMouseEnter: prefetchChatbot, onFocus: prefetchChatbot, className: "fixed bottom-6 right-6 z-50 flex h-14 w-14 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg ring-1 ring-primary/20 transition-transform hover:scale-105 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", children: _jsxs("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("path", { d: "M12 3v3" }), _jsx("path", { d: "M12 18v3" }), _jsx("path", { d: "M5.6 5.6l2.1 2.1" }), _jsx("path", { d: "M16.3 16.3l2.1 2.1" }), _jsx("path", { d: "M3 12h3" }), _jsx("path", { d: "M18 12h3" }), _jsx("path", { d: "M5.6 18.4l2.1-2.1" }), _jsx("path", { d: "M16.3 7.7l2.1-2.1" }), _jsx("circle", { cx: "12", cy: "12", r: "3" })] }) }));
+}

package/dist/layout/ConsoleFloatingChatbot.d.ts

@@ -12,6 +12,8 @@ export interface ConsoleFloatingChatbotProps {
     apiBase?: string;
     /** Default agent name to select on first render. */
     defaultAgent?: string;
+    /** Whether the floating panel should open immediately on mount. */
+    defaultOpen?: boolean;
 }
-export default function ConsoleFloatingChatbot({ appLabel, objects, apiBase: apiBaseProp, defaultAgent: defaultAgentProp, }: ConsoleFloatingChatbotProps): import("react/jsx-runtime").JSX.Element;
+export default function ConsoleFloatingChatbot({ appLabel, objects, apiBase: apiBaseProp, defaultAgent: defaultAgentProp, defaultOpen, }: ConsoleFloatingChatbotProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/layout/ConsoleFloatingChatbot.js

@@ -12,7 +12,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * @module
  */
 import React from 'react';
-import { FloatingChatbot, useObjectChat, useAgents, } from '@object-ui/plugin-chatbot';
+import { FloatingChatbot, useObjectChat, useAgents, useHitlInChat, } from '@object-ui/plugin-chatbot';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@object-ui/components';
 const DEFAULT_AI_PATH = '/api/v1/ai';
 function resolveApiBase(explicit) {
@@ -25,7 +25,7 @@ function resolveApiBase(explicit) {
     const serverUrl = env.VITE_SERVER_URL ?? '';
     return `${serverUrl.replace(/\/$/, '')}${DEFAULT_AI_PATH}`;
 }
-function ChatbotInner({ appLabel, objects, agents, agentsLoading, agentsError, activeAgent, onAgentChange, chatApi, }) {
+function ChatbotInner({ appLabel, objects, agents, agentsLoading, agentsError, activeAgent, onAgentChange, chatApi, apiBase, defaultOpen = false, }) {
     const objectNames = objects.map((o) => o.label || o.name).join(', ');
     const activeAgentLabel = React.useMemo(() => {
         const found = agents.find((a) => a.name === activeAgent);
@@ -59,10 +59,22 @@ function ChatbotInner({ appLabel, objects, agents, agentsLoading, agentsError, a
             : "Thanks for your message! I'm here to help you navigate and manage your data.",
         autoResponseDelay: 600,
     });
+    // HITL bridge — turns the pending-approval tool result envelope from the
+    // framework's action-tools.ts into inline approve/reject buttons that talk
+    // directly to /api/v1/ai/pending-actions/:id/{approve,reject}. After a
+    // successful decision the hook synthesises a short follow-up user message
+    // so the LLM continues the conversation aware of the outcome.
+    const hitl = useHitlInChat({
+        messages: messages,
+        apiBase,
+        continueConversation: (prompt) => {
+            sendMessage(prompt);
+        },
+    });
     const headerExtra = agents.length > 0 ? (_jsxs(Select, { value: activeAgent, onValueChange: onAgentChange, disabled: agentsLoading, children: [_jsx(SelectTrigger, { className: "h-7 w-[180px] text-xs", "data-testid": "floating-chatbot-agent-picker", children: _jsx(SelectValue, { placeholder: "Choose agent..." }) }), _jsx(SelectContent, { align: "end", children: agents.map((agent) => (_jsxs(SelectItem, { value: agent.name, className: "text-xs", children: [_jsx("span", { className: "font-medium", children: agent.label }), agent.description ? (_jsx("span", { className: "block text-muted-foreground text-[10px] truncate max-w-[220px]", children: agent.description })) : null] }, agent.name))) })] })) : null;
     return (_jsx(FloatingChatbot, { floatingConfig: {
             position: 'bottom-right',
-            defaultOpen: false,
+            defaultOpen,
             panelWidth: 420,
             panelHeight: 560,
             title: `${appLabel} Assistant`,
@@ -71,9 +83,9 @@ function ChatbotInner({ appLabel, objects, agents, agentsLoading, agentsError, a
             ? `Ask ${activeAgentLabel}...`
             : agentsLoading
                 ? 'Loading agents...'
-                : 'Ask anything...', onSendMessage: (content) => sendMessage(content), onClear: clear, onStop: isLoading ? stop : undefined, onReload: reload, isLoading: isLoading, error: error, enableMarkdown: true }));
+                : 'Ask anything...', onSendMessage: (content) => sendMessage(content), onClear: clear, onStop: isLoading ? stop : undefined, onReload: reload, isLoading: isLoading, error: error, enableMarkdown: true, onToolApprove: hitl.decide, toolDecisions: hitl.decisions, toolApproveLabel: "Approve & run", toolDenyLabel: "Reject", toolDenyReason: "Operator rejected from chat" }));
 }
-export default function ConsoleFloatingChatbot({ appLabel, objects, apiBase: apiBaseProp, defaultAgent: defaultAgentProp, }) {
+export default function ConsoleFloatingChatbot({ appLabel, objects, apiBase: apiBaseProp, defaultAgent: defaultAgentProp, defaultOpen = false, }) {
     const apiBase = React.useMemo(() => resolveApiBase(apiBaseProp), [apiBaseProp]);
     const env = import.meta.env ?? {};
     const envDefaultAgent = env.VITE_AI_DEFAULT_AGENT;
@@ -92,5 +104,5 @@ export default function ConsoleFloatingChatbot({ appLabel, objects, apiBase: api
     // `key` forces a clean remount whenever the active agent (and therefore the
     // chat API URL) changes — required because `useObjectChat` locks its mode
     // (api vs local) on first render.
-    return (_jsx(ChatbotInner, { appLabel: appLabel, objects: objects, agents: agents, agentsLoading: agentsLoading, agentsError: agentsError, activeAgent: activeAgent, onAgentChange: setActiveAgent, chatApi: chatApi }, chatApi ?? 'local'));
+    return (_jsx(ChatbotInner, { appLabel: appLabel, objects: objects, agents: agents, agentsLoading: agentsLoading, agentsError: agentsError, activeAgent: activeAgent, onAgentChange: setActiveAgent, chatApi: chatApi, apiBase: apiBase, defaultOpen: defaultOpen }, chatApi ?? 'local'));
 }

package/dist/layout/ConsoleLayout.js

@@ -8,12 +8,13 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * Sets navigation context to 'app' for app-specific routes.
  * @module
  */
-import { useEffect, Suspense, lazy } from 'react';
+import { useEffect } from 'react';
 import { AppShell } from '@object-ui/layout';
 import { useDiscovery } from '@object-ui/react';
-// Lazy-load the chatbot so its heavy markdown deps (~150 KB) stay out of
-// the initial paint until the AI assistant is actually enabled.
-const ConsoleFloatingChatbot = lazy(() => import('./ConsoleFloatingChatbot'));
+// Lightweight FAB stub — the heavy chat chunk graph (plugin-chatbot,
+// shiki, streamdown, mermaid, @ai-sdk, ~20MB) only downloads on first
+// hover/click. See ConsoleChatbotFab.tsx.
+import { ConsoleChatbotFab } from './ConsoleChatbotFab';
 import { UnifiedSidebar } from './UnifiedSidebar';
 import { AppHeader } from './AppHeader';
 import { MobileViewSwitcherProvider } from './MobileViewSwitcherContext';
@@ -50,5 +51,5 @@ export function ConsoleLayout({ children, activeAppName, activeApp, onAppChange,
                         ? `${resolveI18nLabel(activeApp.label)} — ObjectStack Console`
                         : undefined,
                 }
-                : undefined, children: [_jsx(ConsoleLayoutInner, { children: children }), showChatbot && (_jsx(Suspense, { fallback: null, children: _jsx(ConsoleFloatingChatbot, { appLabel: appLabel, objects: objects }) }))] }) }));
+                : undefined, children: [_jsx(ConsoleLayoutInner, { children: children }), showChatbot && (_jsx(ConsoleChatbotFab, { appLabel: appLabel, objects: objects }))] }) }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@object-ui/app-shell",
-  "version": "5.4.1",
+  "version": "6.0.0",
   "type": "module",
   "license": "MIT",
   "description": "Minimal application shell for ObjectUI - framework-agnostic rendering engine",
@@ -28,35 +28,35 @@
     "@sentry/react": "^8.55.2",
     "lucide-react": "^1.16.0",
     "sonner": "^2.0.7",
-    "@object-ui/auth": "5.4.1",
-    "@object-ui/collaboration": "5.4.1",
-    "@object-ui/components": "5.4.1",
-    "@object-ui/core": "5.4.1",
-    "@object-ui/data-objectstack": "5.4.1",
-    "@object-ui/fields": "5.4.1",
-    "@object-ui/i18n": "5.4.1",
-    "@object-ui/layout": "5.4.1",
-    "@object-ui/permissions": "5.4.1",
-    "@object-ui/providers": "5.4.1",
-    "@object-ui/react": "5.4.1",
-    "@object-ui/types": "5.4.1"
+    "@object-ui/auth": "6.0.0",
+    "@object-ui/collaboration": "6.0.0",
+    "@object-ui/components": "6.0.0",
+    "@object-ui/core": "6.0.0",
+    "@object-ui/data-objectstack": "6.0.0",
+    "@object-ui/fields": "6.0.0",
+    "@object-ui/i18n": "6.0.0",
+    "@object-ui/layout": "6.0.0",
+    "@object-ui/permissions": "6.0.0",
+    "@object-ui/providers": "6.0.0",
+    "@object-ui/react": "6.0.0",
+    "@object-ui/types": "6.0.0"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
     "react-router-dom": "^6.0.0 || ^7.0.0",
-    "@object-ui/plugin-calendar": "^5.4.1",
-    "@object-ui/plugin-charts": "^5.4.1",
-    "@object-ui/plugin-chatbot": "^5.4.1",
-    "@object-ui/plugin-dashboard": "^5.4.1",
-    "@object-ui/plugin-designer": "^5.4.1",
-    "@object-ui/plugin-detail": "^5.4.1",
-    "@object-ui/plugin-form": "^5.4.1",
-    "@object-ui/plugin-grid": "^5.4.1",
-    "@object-ui/plugin-kanban": "^5.4.1",
-    "@object-ui/plugin-list": "^5.4.1",
-    "@object-ui/plugin-report": "^5.4.1",
-    "@object-ui/plugin-view": "^5.4.1"
+    "@object-ui/plugin-calendar": "^6.0.0",
+    "@object-ui/plugin-charts": "^6.0.0",
+    "@object-ui/plugin-chatbot": "^6.0.0",
+    "@object-ui/plugin-dashboard": "^6.0.0",
+    "@object-ui/plugin-designer": "^6.0.0",
+    "@object-ui/plugin-detail": "^6.0.0",
+    "@object-ui/plugin-form": "^6.0.0",
+    "@object-ui/plugin-grid": "^6.0.0",
+    "@object-ui/plugin-kanban": "^6.0.0",
+    "@object-ui/plugin-list": "^6.0.0",
+    "@object-ui/plugin-report": "^6.0.0",
+    "@object-ui/plugin-view": "^6.0.0"
   },
   "devDependencies": {
     "@types/node": "^25.9.0",