@object-ui/app-shell 4.0.10 → 4.0.12

package/CHANGELOG.md

@@ -1,5 +1,64 @@
 # @object-ui/app-shell — Changelog
 
+## 4.0.12
+
+### Patch Changes
+
+- e468592: fix
+  - @object-ui/types@4.0.12
+  - @object-ui/core@4.0.12
+  - @object-ui/i18n@4.0.12
+  - @object-ui/react@4.0.12
+  - @object-ui/components@4.0.12
+  - @object-ui/fields@4.0.12
+  - @object-ui/layout@4.0.12
+  - @object-ui/data-objectstack@4.0.12
+  - @object-ui/auth@4.0.12
+  - @object-ui/permissions@4.0.12
+  - @object-ui/plugin-calendar@4.0.12
+  - @object-ui/plugin-charts@4.0.12
+  - @object-ui/plugin-chatbot@4.0.12
+  - @object-ui/plugin-dashboard@4.0.12
+  - @object-ui/plugin-designer@4.0.12
+  - @object-ui/plugin-detail@4.0.12
+  - @object-ui/plugin-form@4.0.12
+  - @object-ui/plugin-grid@4.0.12
+  - @object-ui/plugin-kanban@4.0.12
+  - @object-ui/plugin-list@4.0.12
+  - @object-ui/plugin-report@4.0.12
+  - @object-ui/plugin-view@4.0.12
+  - @object-ui/collaboration@4.0.12
+
+## 4.0.11
+
+### Patch Changes
+
+- 7ea1d93: dashboard
+- Updated dependencies [1909bc3]
+  - @object-ui/i18n@4.0.11
+  - @object-ui/components@4.0.11
+  - @object-ui/fields@4.0.11
+  - @object-ui/plugin-calendar@4.0.11
+  - @object-ui/plugin-charts@4.0.11
+  - @object-ui/plugin-dashboard@4.0.11
+  - @object-ui/plugin-designer@4.0.11
+  - @object-ui/plugin-kanban@4.0.11
+  - @object-ui/plugin-list@4.0.11
+  - @object-ui/react@4.0.11
+  - @object-ui/layout@4.0.11
+  - @object-ui/plugin-chatbot@4.0.11
+  - @object-ui/plugin-detail@4.0.11
+  - @object-ui/plugin-form@4.0.11
+  - @object-ui/plugin-grid@4.0.11
+  - @object-ui/plugin-report@4.0.11
+  - @object-ui/plugin-view@4.0.11
+  - @object-ui/types@4.0.11
+  - @object-ui/core@4.0.11
+  - @object-ui/data-objectstack@4.0.11
+  - @object-ui/auth@4.0.11
+  - @object-ui/permissions@4.0.11
+  - @object-ui/collaboration@4.0.11
+
 ## 4.0.10
 
 ### Patch Changes

package/dist/console/home/HomeLayout.js

@@ -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", 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(Suspense, { fallback: null, children: _jsx(ConsoleFloatingChatbot, { appLabel: "Workspace", objects: [] }) }))] }));
 }

package/dist/console/home/HomePage.js

@@ -48,7 +48,9 @@ export function HomePage() {
     }
     // Empty state - no apps configured
     if (activeApps.length === 0) {
-        return (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsxs(Empty, { children: [_jsx(EmptyTitle, { children: "Welcome to ObjectUI" }), _jsx(EmptyDescription, { children: "Get started by creating your first application or configure your system settings." }), _jsxs("div", { className: "mt-6 flex flex-col sm:flex-row items-center gap-3", children: [_jsxs(Button, { onClick: () => navigate('/create-app'), "data-testid": "create-first-app-btn", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "Create Your First App"] }), _jsxs(Button, { variant: "outline", onClick: () => navigate('/apps/setup'), "data-testid": "go-to-settings-btn", children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), "System Settings"] })] })] }) }));
+        return (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsxs(Empty, { children: [_jsx(EmptyTitle, { children: t('home.welcome', { defaultValue: 'Welcome to ObjectUI' }) }), _jsx(EmptyDescription, { children: t('home.welcomeDescription', {
+                            defaultValue: 'Get started by creating your first application or configure your system settings.',
+                        }) }), _jsxs("div", { className: "mt-6 flex flex-col sm:flex-row items-center gap-3", children: [_jsxs(Button, { onClick: () => navigate('/create-app'), "data-testid": "create-first-app-btn", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), t('home.createFirstApp', { defaultValue: 'Create Your First App' })] }), _jsxs(Button, { variant: "outline", onClick: () => navigate('/apps/setup'), "data-testid": "go-to-settings-btn", children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('home.systemSettings', { defaultValue: 'System Settings' })] })] })] }) }));
     }
     return (_jsxs("div", { className: "bg-background", children: [_jsxs("div", { className: "px-4 sm:px-6 pt-6 pb-4", children: [_jsx("h1", { className: "text-2xl sm:text-3xl font-bold tracking-tight", children: t('home.title', { defaultValue: 'Home' }) }), _jsx("p", { className: "text-sm text-muted-foreground mt-1", children: t('home.subtitle', { defaultValue: 'Your workspace dashboard' }) })] }), _jsxs("div", { className: "px-4 sm:px-6 py-4 space-y-8", children: [_jsx(QuickActions, {}), starredApps.length > 0 && (_jsx(StarredApps, { items: starredApps })), recentApps.length > 0 && (_jsx(RecentApps, { items: recentApps })), _jsxs("section", { children: [_jsx("h2", { className: "text-2xl font-semibold tracking-tight mb-4", children: t('home.allApps', { defaultValue: 'All Applications' }) }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: activeApps.map((app) => (_jsx(AppCard, { app: app, onClick: () => navigate(`/apps/${app.name}`), isFavorite: favorites.some(f => f.id === `app:${app.name}`) }, app.name))) })] })] })] }));
 }

package/dist/layout/AppHeader.js

@@ -19,7 +19,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  */
 import { useLocation, useParams, Link, useNavigate } from 'react-router-dom';
 import { SidebarTrigger, Button, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuGroup, Avatar, AvatarImage, AvatarFallback, } from '@object-ui/components';
-import { Search, HelpCircle, ChevronDown, Settings, LogOut, User as UserIcon, Boxes, } from 'lucide-react';
+import { Search, HelpCircle, ChevronDown, Settings, LogOut, User as UserIcon, Boxes, Bell, } from 'lucide-react';
 import { useState, useEffect, useCallback, useRef } from 'react';
 import { useOffline } from '@object-ui/react';
 import { PresenceAvatars } from '@object-ui/collaboration';
@@ -58,11 +58,14 @@ export function AppHeader({ variant, appName, objects, connectionState, presence
     const { currentAppName, recordTitle } = useNavigationContext();
     const [apiPresenceUsers, setApiPresenceUsers] = useState(null);
     const [apiActivities, setApiActivities] = useState(null);
+    /** M10.8: in-header notifications. Polled from sys_notification scoped to current user. */
+    const [notifications, setNotifications] = useState([]);
     // Once the server returns 404 for these collections we stop retrying for
     // the lifetime of the page — they're optional features and re-requesting
     // on every navigation creates console noise + wasted round trips.
     const presenceUnavailableRef = useRef(false);
     const activityUnavailableRef = useRef(false);
+    const notificationsUnavailableRef = useRef(false);
     const fetchPresenceAndActivities = useCallback(async () => {
         if (!dataSource || !isApp)
             return;
@@ -103,6 +106,71 @@ export function AppHeader({ variant, appName, objects, connectionState, presence
         catch { /* fallback below */ }
     }, [dataSource, isApp]);
     useEffect(() => { fetchPresenceAndActivities(); }, [fetchPresenceAndActivities]);
+    /**
+     * M10.8: poll sys_notification for the signed-in user. Limited to
+     * the 20 most-recent entries; unread count drives the bell badge.
+     * Polls every 30s while the tab is foregrounded. Tolerates 404 so
+     * older deployments without sys_notification degrade silently.
+     */
+    useEffect(() => {
+        if (!dataSource || !isApp || !user?.id)
+            return;
+        if (notificationsUnavailableRef.current)
+            return;
+        let cancelled = false;
+        const isMissingResource = (err) => err?.httpStatus === 404 || err?.status === 404 || err?.code === 'object_not_found';
+        const fetchOnce = async () => {
+            try {
+                const res = await dataSource.find('sys_notification', {
+                    $filter: { recipient_id: user.id },
+                    $orderby: { created_at: 'desc' },
+                    $top: 20,
+                });
+                if (cancelled)
+                    return;
+                if (Array.isArray(res?.data))
+                    setNotifications(res.data);
+            }
+            catch (err) {
+                if (isMissingResource(err))
+                    notificationsUnavailableRef.current = true;
+            }
+        };
+        fetchOnce();
+        const handle = setInterval(() => {
+            if (typeof document !== 'undefined' && document.hidden)
+                return;
+            if (notificationsUnavailableRef.current) {
+                clearInterval(handle);
+                return;
+            }
+            fetchOnce();
+        }, 30000);
+        return () => { cancelled = true; clearInterval(handle); };
+    }, [dataSource, isApp, user?.id]);
+    const unreadCount = notifications.reduce((n, x) => n + (x.is_read ? 0 : 1), 0);
+    const markNotificationRead = useCallback(async (id) => {
+        setNotifications(prev => prev.map(n => n.id === id ? { ...n, is_read: true } : n));
+        if (!dataSource)
+            return;
+        try {
+            await dataSource.update('sys_notification', id, {
+                is_read: true,
+                read_at: new Date().toISOString(),
+            });
+        }
+        catch { /* best-effort */ }
+    }, [dataSource]);
+    const markAllRead = useCallback(async () => {
+        const unread = notifications.filter(n => !n.is_read);
+        if (!unread.length)
+            return;
+        setNotifications(prev => prev.map(n => ({ ...n, is_read: true })));
+        if (!dataSource)
+            return;
+        const now = new Date().toISOString();
+        await Promise.all(unread.map(n => dataSource.update('sys_notification', n.id, { is_read: true, read_at: now }).catch(() => { })));
+    }, [dataSource, notifications]);
     const activeUsers = presenceUsers ?? apiPresenceUsers ?? EMPTY_PRESENCE_USERS;
     const activeActivities = activities ?? apiActivities ?? [];
     const orgList = organizations ?? [];
@@ -203,5 +271,15 @@ export function AppHeader({ variant, appName, objects, connectionState, presence
     return (_jsxs("div", { className: "flex items-center justify-between w-full h-full", children: [_jsxs("div", { className: "flex items-center min-w-0 flex-1", children: [_jsx(Link, { to: "/home", className: "flex items-center justify-center h-7 w-7 shrink-0 rounded-md bg-primary text-primary-foreground hover:bg-primary/90 transition-colors", title: "ObjectStack", children: _jsx(Boxes, { className: "h-4 w-4" }) }), resolvedVariant === 'home' && (_jsx("span", { className: "hidden sm:inline ml-2 text-sm font-semibold tracking-tight", children: "ObjectStack" })), resolvedVariant === 'orgs' && (_jsxs(_Fragment, { children: [_jsx(PathSep, {}), _jsx("span", { className: "text-sm font-medium text-foreground/80 px-1.5", children: t('organizations.title', { defaultValue: 'Organizations' }) })] })), isApp && (_jsxs(_Fragment, { children: [_jsx(SidebarTrigger, { className: "md:hidden shrink-0 ml-1", "aria-label": t('common.toggleSidebar') || 'Toggle sidebar' }), activeAppName && onAppChange ? (_jsxs(_Fragment, { children: [_jsx(PathSep, {}), _jsx(AppSwitcher, { activeAppName: activeAppName, onAppChange: onAppChange })] })) : appName ? (_jsxs(_Fragment, { children: [_jsx(PathSep, {}), _jsx("span", { className: "text-sm font-medium text-foreground/80 px-1.5", children: appName })] })) : null, extraSegments.map((seg, i) => {
                                 const isLast = i === extraSegments.length - 1;
                                 return (_jsxs("span", { className: "hidden sm:flex items-center min-w-0", children: [_jsx(PathSep, {}), seg.siblings && seg.siblings.length > 1 ? (_jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: `flex items-center gap-1 rounded-md px-1.5 py-1 text-sm font-medium transition-colors outline-none hover:bg-accent hover:text-foreground ${!isLast ? 'text-foreground/60' : 'text-foreground/80'}`, children: [seg.label, _jsx(ChevronDown, { className: "h-3.5 w-3.5 text-muted-foreground" })] }), _jsxs(DropdownMenuContent, { align: "start", sideOffset: 8, className: "w-56 max-h-72 overflow-y-auto", children: [_jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground font-normal", children: "Switch Object" }), _jsx(DropdownMenuSeparator, {}), seg.siblings.map((sibling) => (_jsx(DropdownMenuItem, { asChild: true, children: _jsx(Link, { to: sibling.href, className: "w-full", children: sibling.label }) }, sibling.href)))] })] })) : seg.href ? (_jsx(Link, { to: seg.href, className: `rounded-md px-1.5 py-1 text-sm font-medium transition-colors hover:bg-accent hover:text-foreground truncate max-w-[160px] ${isLast ? 'text-foreground/80' : 'text-foreground/60'}`, children: seg.label })) : (_jsx("span", { className: `px-1.5 py-1 text-sm font-medium truncate max-w-[160px] ${isLast ? 'text-foreground/80' : 'text-foreground/60'}`, children: seg.label }))] }, i));
-                            }), _jsx("span", { className: "text-sm font-medium sm:hidden truncate min-w-0 ml-1", children: lastSegmentLabel })] }))] }), _jsxs("div", { className: "flex items-center gap-0.5 sm:gap-1 shrink-0 [&>*+*[data-topbar-group]]:ml-1 [&>[data-topbar-group]+[data-topbar-group]]:border-l [&>[data-topbar-group]+[data-topbar-group]]:border-border/60 [&>[data-topbar-group]+[data-topbar-group]]:pl-1 sm:[&>[data-topbar-group]+[data-topbar-group]]:pl-2 sm:[&>[data-topbar-group]+[data-topbar-group]]:ml-2", children: [!isOnline && (_jsxs("div", { className: "flex items-center gap-1 px-2 py-1 rounded-full bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-200 text-xs font-medium", children: [_jsx("span", { className: "h-2 w-2 rounded-full bg-yellow-500 animate-pulse" }), "Offline"] })), isApp && connectionState && _jsx(ConnectionStatus, { state: connectionState }), isApp && activeUsers.length > 0 && (_jsx("div", { className: "hidden md:flex items-center shrink-0", title: "Users currently online", children: _jsx(PresenceAvatars, { users: activeUsers, size: "sm", maxVisible: 3, showStatus: true }) })), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 sm:gap-1 shrink-0", children: [_jsxs("button", { onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), className: "hidden lg:flex relative items-center gap-2 w-48 xl:w-64 h-8 px-3 text-sm rounded-md border bg-muted/50 text-muted-foreground hover:bg-muted transition-colors", children: [_jsx(Search, { className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "flex-1 text-left text-xs", children: t('console.search', { defaultValue: 'Search...' }) }), _jsxs("kbd", { className: "pointer-events-none inline-flex h-5 items-center gap-0.5 rounded border bg-background px-1.5 text-[10px] font-medium text-muted-foreground", children: [_jsx("span", { className: "text-xs", children: "\u2318" }), "K"] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "lg:hidden h-8 w-8 shrink-0", onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), "aria-label": t('console.search', { defaultValue: 'Search...' }), children: _jsx(Search, { className: "h-4 w-4" }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ActivityFeed, { activities: activeActivities }) }), _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 hidden md:flex shrink-0", asChild: true, "aria-label": t('sidebar.helpTooltip', { defaultValue: 'Help & Documentation' }), children: _jsx("a", { href: "https://docs.objectstack.ai", target: "_blank", rel: "noopener noreferrer", children: _jsx(HelpCircle, { className: "h-4 w-4" }) }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ModeToggle, {}) }), _jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(LocaleSwitcher, {}) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 rounded-full", children: _jsxs(Avatar, { className: "h-7 w-7 rounded-full", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-full bg-primary text-primary-foreground text-xs", children: getUserInitials(user) })] }) }) }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-64 rounded-lg", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-2 py-2", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuGroup, { children: [hasOrgSection && (_jsxs(DropdownMenuItem, { onClick: () => navigate('/organizations'), className: "cursor-pointer", children: [_jsx(Boxes, { className: "mr-2 h-4 w-4" }), t('organizations.mine', { defaultValue: 'My Organizations' })] })), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup/system/profile'), children: [_jsx(UserIcon, { className: "mr-2 h-4 w-4" }), t('user.profile', { defaultValue: 'Profile' })] }), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('sidebar.settings', { defaultValue: 'Settings' })] })] }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] })] })] })] }));
+                            }), _jsx("span", { className: "text-sm font-medium sm:hidden truncate min-w-0 ml-1", children: lastSegmentLabel })] }))] }), _jsxs("div", { className: "flex items-center gap-0.5 sm:gap-1 shrink-0 [&>*+*[data-topbar-group]]:ml-1 [&>[data-topbar-group]+[data-topbar-group]]:border-l [&>[data-topbar-group]+[data-topbar-group]]:border-border/60 [&>[data-topbar-group]+[data-topbar-group]]:pl-1 sm:[&>[data-topbar-group]+[data-topbar-group]]:pl-2 sm:[&>[data-topbar-group]+[data-topbar-group]]:ml-2", children: [!isOnline && (_jsxs("div", { className: "flex items-center gap-1 px-2 py-1 rounded-full bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-200 text-xs font-medium", children: [_jsx("span", { className: "h-2 w-2 rounded-full bg-yellow-500 animate-pulse" }), "Offline"] })), isApp && connectionState && _jsx(ConnectionStatus, { state: connectionState }), isApp && activeUsers.length > 0 && (_jsx("div", { className: "hidden md:flex items-center shrink-0", title: "Users currently online", children: _jsx(PresenceAvatars, { users: activeUsers, size: "sm", maxVisible: 3, showStatus: true }) })), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 sm:gap-1 shrink-0", children: [_jsxs("button", { onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), className: "hidden lg:flex relative items-center gap-2 w-48 xl:w-64 h-8 px-3 text-sm rounded-md border bg-muted/50 text-muted-foreground hover:bg-muted transition-colors", children: [_jsx(Search, { className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "flex-1 text-left text-xs", children: t('console.search', { defaultValue: 'Search...' }) }), _jsxs("kbd", { className: "pointer-events-none inline-flex h-5 items-center gap-0.5 rounded border bg-background px-1.5 text-[10px] font-medium text-muted-foreground", children: [_jsx("span", { className: "text-xs", children: "\u2318" }), "K"] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "lg:hidden h-8 w-8 shrink-0", onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), "aria-label": t('console.search', { defaultValue: 'Search...' }), children: _jsx(Search, { className: "h-4 w-4" }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ActivityFeed, { activities: activeActivities }) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 relative shrink-0", "aria-label": t('sidebar.notifications', { defaultValue: 'Notifications' }), children: [_jsx(Bell, { className: "h-4 w-4" }), unreadCount > 0 && (_jsx("span", { className: "absolute -top-0.5 -right-0.5 h-4 min-w-[16px] rounded-full bg-red-500 text-[10px] leading-4 text-white text-center px-1", children: unreadCount > 9 ? '9+' : unreadCount }))] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-80 max-h-96 overflow-auto", children: [_jsxs(DropdownMenuLabel, { className: "flex items-center justify-between", children: [_jsx("span", { children: t('sidebar.notifications', { defaultValue: 'Notifications' }) }), unreadCount > 0 && (_jsx("button", { type: "button", onClick: (e) => { e.preventDefault(); markAllRead(); }, className: "text-xs text-muted-foreground hover:text-foreground", children: t('notifications.markAllRead', { defaultValue: 'Mark all read' }) }))] }), _jsx(DropdownMenuSeparator, {}), notifications.length === 0 ? (_jsx("div", { className: "px-3 py-6 text-sm text-muted-foreground text-center", children: t('notifications.empty', { defaultValue: 'No notifications' }) })) : (notifications.map((n) => (_jsxs(DropdownMenuItem, { className: `flex flex-col items-start gap-1 ${n.is_read ? '' : 'bg-accent/40'}`, onSelect: () => {
+                                                    markNotificationRead(n.id);
+                                                    if (n.source_object && n.source_id) {
+                                                        // Navigate to the related record; relative to /apps/<currentApp> if any.
+                                                        const app = currentAppName ?? params.appName;
+                                                        const target = app
+                                                            ? `/apps/${app}/${n.source_object}/${n.source_id}`
+                                                            : `/objects/${n.source_object}/${n.source_id}`;
+                                                        navigate(target);
+                                                    }
+                                                }, children: [_jsx("div", { className: "text-sm font-medium leading-tight", children: n.title }), n.body && (_jsx("div", { className: "text-xs text-muted-foreground line-clamp-2", children: n.body })), n.created_at && (_jsx("div", { className: "text-[10px] text-muted-foreground", children: new Date(n.created_at).toLocaleString() }))] }, n.id))))] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 hidden md:flex shrink-0", asChild: true, "aria-label": t('sidebar.helpTooltip', { defaultValue: 'Help & Documentation' }), children: _jsx("a", { href: "https://docs.objectstack.ai", target: "_blank", rel: "noopener noreferrer", children: _jsx(HelpCircle, { className: "h-4 w-4" }) }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ModeToggle, {}) }), _jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(LocaleSwitcher, {}) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 rounded-full", children: _jsxs(Avatar, { className: "h-7 w-7 rounded-full", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-full bg-primary text-primary-foreground text-xs", children: getUserInitials(user) })] }) }) }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-64 rounded-lg", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-2 py-2", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuGroup, { children: [hasOrgSection && (_jsxs(DropdownMenuItem, { onClick: () => navigate('/organizations'), className: "cursor-pointer", children: [_jsx(Boxes, { className: "mr-2 h-4 w-4" }), t('organizations.mine', { defaultValue: 'My Organizations' })] })), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup/system/profile'), children: [_jsx(UserIcon, { className: "mr-2 h-4 w-4" }), t('user.profile', { defaultValue: 'Profile' })] }), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('sidebar.settings', { defaultValue: 'Settings' })] })] }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] })] })] })] }));
 }

package/dist/layout/AppSidebar.js

@@ -118,7 +118,7 @@ export function AppSidebar({ activeAppName, onAppChange }) {
     }, [isMobile]);
     const { recentItems } = useRecentItems();
     const { favorites, removeFavorite } = useFavorites();
-    const { apps: metadataApps } = useMetadata();
+    const { apps: metadataApps, objects: metadataObjects } = useMetadata();
     const apps = metadataApps || [];
     // Filter out inactive apps
     const activeApps = apps.filter((a) => a.active !== false);
@@ -166,6 +166,24 @@ export function AppSidebar({ activeAppName, onAppChange }) {
             : [perm, 'read'];
         return can(object, action);
     }), [can]);
+    // Runtime capability checker — gates nav entries with `requiresObject` /
+    // `requiresService` against the runtime's actual SchemaRegistry contents.
+    // Currently we only probe registered objects (sourced from the metadata
+    // provider, which fetches `GET /api/v1/meta/object` on mount). Service
+    // gates default to pass since there is no client-side service registry
+    // probe yet — callers should wire one when needed.
+    const registeredObjectNames = React.useMemo(() => new Set((metadataObjects || []).map((o) => o?.name).filter(Boolean)), [metadataObjects]);
+    const checkCap = React.useCallback((kind, name) => {
+        if (kind === 'object') {
+            // While metadata is still loading we have an empty set; show
+            // entries by default to avoid a "menu flicker" where everything
+            // disappears momentarily on first render.
+            if (registeredObjectNames.size === 0)
+                return true;
+            return registeredObjectNames.has(name);
+        }
+        return true;
+    }, [registeredObjectNames]);
     const basePath = activeApp ? `/apps/${activeAppName}` : '';
     // Fallback system navigation when no active app exists — routes into the Setup app.
     const systemFallbackNavigation = React.useMemo(() => [
@@ -181,22 +199,40 @@ export function AppSidebar({ activeAppName, onAppChange }) {
                                                     const AreaIcon = getIcon(area.icon);
                                                     const isActiveArea = area.id === activeAreaId;
                                                     return (_jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { isActive: isActiveArea, tooltip: area.label, onClick: () => setActiveAreaId(area.id), children: [_jsx(AreaIcon, { className: "h-4 w-4" }), _jsx("span", { children: area.label })] }) }, area.id));
-                                                }) }) })] })), _jsx(SidebarGroup, { className: "py-0", children: _jsxs(SidebarGroupContent, { className: "relative", children: [_jsx(Search, { className: "pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 select-none opacity-70" }), _jsx(SidebarInput, { placeholder: "Search navigation...", value: navSearchQuery, onChange: (e) => setNavSearchQuery(e.target.value), className: "pl-8" })] }) }), _jsx(NavigationRenderer, { items: processedNavigation, basePath: basePath, evaluateVisibility: evalVis, checkPermission: checkPerm, searchQuery: navSearchQuery, enablePinning: true, onPinToggle: togglePin, enableReorder: true, onReorder: handleReorder, resolveObjectLabel: (objectName, fallback) => resolveNavObjectLabel({ name: objectName, label: fallback }), t: t }), recentItems.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5 cursor-pointer select-none", onClick: () => setRecentExpanded(prev => !prev), children: [_jsx(ChevronRight, { className: `h-3 w-3 transition-transform duration-150 ${recentExpanded ? 'rotate-90' : ''}` }), _jsx(Clock, { className: "h-3.5 w-3.5" }), "Recent"] }), recentExpanded && (_jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: recentItems.slice(0, 5).map(item => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : '📄' }), _jsx("span", { className: "truncate", children: item.label })] }) }) }, item.id))) }) }))] })), favorites.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), "Favorites"] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": `Remove ${item.label} from favorites`, children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) : (_jsxs(SidebarGroup, { "data-testid": "system-fallback-nav", children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Settings, { className: "h-3.5 w-3.5" }), "System"] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: systemFallbackNavigation.map((item) => {
+                                                }) }) })] })), _jsx(SidebarGroup, { className: "py-0", children: _jsxs(SidebarGroupContent, { className: "relative", children: [_jsx(Search, { className: "pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 select-none opacity-70" }), _jsx(SidebarInput, { placeholder: "Search navigation...", value: navSearchQuery, onChange: (e) => setNavSearchQuery(e.target.value), className: "pl-8" })] }) }), _jsx(NavigationRenderer, { items: processedNavigation, basePath: basePath, evaluateVisibility: evalVis, checkPermission: checkPerm, checkCapability: checkCap, searchQuery: navSearchQuery, enablePinning: true, onPinToggle: togglePin, enableReorder: true, onReorder: handleReorder, resolveObjectLabel: (objectName, fallback) => resolveNavObjectLabel({ name: objectName, label: fallback }), t: t }), recentItems.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5 cursor-pointer select-none", onClick: () => setRecentExpanded(prev => !prev), children: [_jsx(ChevronRight, { className: `h-3 w-3 transition-transform duration-150 ${recentExpanded ? 'rotate-90' : ''}` }), _jsx(Clock, { className: "h-3.5 w-3.5" }), "Recent"] }), recentExpanded && (_jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: recentItems.slice(0, 5).map(item => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : '📄' }), _jsx("span", { className: "truncate", children: item.label })] }) }) }, item.id))) }) }))] })), favorites.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), "Favorites"] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": `Remove ${item.label} from favorites`, children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) : (_jsxs(SidebarGroup, { "data-testid": "system-fallback-nav", children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Settings, { className: "h-3.5 w-3.5" }), "System"] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: systemFallbackNavigation.map((item) => {
                                             const NavIcon = getIcon(item.icon);
                                             return (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.url || '/system', children: [_jsx(NavIcon, { className: "h-4 w-4" }), _jsx("span", { children: item.label })] }) }) }, item.id));
-                                        }) }) })] })) }), _jsx(SidebarFooter, { children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { size: "lg", className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] }), _jsx(ChevronsUpDown, { className: "ml-auto size-4" })] }) }), _jsxs(DropdownMenuContent, { className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg", side: isMobile ? "bottom" : "right", align: "end", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-1 py-1.5 text-left text-sm", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('user.settings', { defaultValue: 'Settings' })] }) }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] }) }) }) })] }), isMobile && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: (activeApp ? resolvedNavigation : systemFallbackNavigation).filter((n) => n.type !== 'group').slice(0, 5).map((item) => {
-                    const NavIcon = getIcon(item.icon);
-                    const baseUrl = activeApp ? `/apps/${activeAppName}` : '';
-                    let href = item.url || '#';
-                    if (item.type === 'object') {
-                        href = `${baseUrl}/${item.objectName}`;
-                        if (item.viewName)
-                            href += `/view/${item.viewName}`;
+                                        }) }) })] })) }), _jsx(SidebarFooter, { children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { size: "lg", className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] }), _jsx(ChevronsUpDown, { className: "ml-auto size-4" })] }) }), _jsxs(DropdownMenuContent, { className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg", side: isMobile ? "bottom" : "right", align: "end", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-1 py-1.5 text-left text-sm", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('user.settings', { defaultValue: 'Settings' })] }) }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] }) }) }) })] }), isMobile && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: (() => {
+                    // Flatten group items so apps that organise navigation into groups
+                    // (e.g. Setup → Overview / Administration / …) still surface real
+                    // leaf links in the mobile bottom nav instead of rendering nothing.
+                    const source = activeApp ? resolvedNavigation : systemFallbackNavigation;
+                    const leaves = [];
+                    for (const item of source) {
+                        if (item.type === 'group') {
+                            for (const child of (item.children || item.items || [])) {
+                                if (child && child.type !== 'group')
+                                    leaves.push(child);
+                            }
+                        }
+                        else {
+                            leaves.push(item);
+                        }
                     }
-                    else if (item.type === 'dashboard')
-                        href = item.dashboardName ? `${baseUrl}/dashboard/${item.dashboardName}` : '#';
-                    else if (item.type === 'page')
-                        href = item.pageName ? `${baseUrl}/page/${item.pageName}` : '#';
-                    return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
-                }) }))] }));
+                    return leaves.slice(0, 5).map((item) => {
+                        const NavIcon = getIcon(item.icon);
+                        const baseUrl = activeApp ? `/apps/${activeAppName}` : '';
+                        let href = item.url || '#';
+                        if (item.type === 'object') {
+                            href = `${baseUrl}/${item.objectName}`;
+                            if (item.viewName)
+                                href += `/view/${item.viewName}`;
+                        }
+                        else if (item.type === 'dashboard')
+                            href = item.dashboardName ? `${baseUrl}/dashboard/${item.dashboardName}` : '#';
+                        else if (item.type === 'page')
+                            href = item.pageName ? `${baseUrl}/page/${item.pageName}` : '#';
+                        return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
+                    });
+                })() }))] }));
 }

package/dist/layout/UnifiedSidebar.js

@@ -114,7 +114,7 @@ export function UnifiedSidebar({ activeAppName }) {
     }, [isMobile]);
     const { recentItems } = useRecentItems();
     const { favorites, removeFavorite } = useFavorites();
-    const { apps: metadataApps } = useMetadata();
+    const { apps: metadataApps, objects: metadataObjects } = useMetadata();
     const apps = metadataApps || [];
     const activeApps = apps.filter((a) => a.active !== false);
     const activeApp = activeApps.find((a) => a.name === (activeAppName || currentAppName)) || activeApps[0];
@@ -160,27 +160,55 @@ export function UnifiedSidebar({ activeAppName }) {
             : [perm, 'read'];
         return can(object, action);
     }), [can]);
+    // Runtime capability gate: hide nav items targeting objects/services
+    // not registered in this runtime (e.g. cloud-only `sys_app`).
+    const registeredObjectNames = React.useMemo(() => new Set((metadataObjects || []).map((o) => o?.name).filter(Boolean)), [metadataObjects]);
+    const checkCap = React.useCallback((kind, name) => {
+        if (kind === 'object') {
+            if (registeredObjectNames.size === 0)
+                return true;
+            return registeredObjectNames.has(name);
+        }
+        return true;
+    }, [registeredObjectNames]);
     const basePath = context === 'app' && activeApp ? `/apps/${activeApp.name}` : '';
     return (_jsxs(_Fragment, { children: [_jsxs(Sidebar, { collapsible: "icon", className: "!top-14 !h-[calc(100svh-3.5rem)]", children: [_jsx(SidebarContent, { className: "pt-2", children: _jsx("div", { className: "transition-opacity duration-200 ease-in-out", children: context === 'app' && activeApp ? (_jsxs(_Fragment, { children: [areas.length > 1 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Layers, { className: "h-3.5 w-3.5" }), t('sidebar.area', { defaultValue: 'Area' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: areas.map((area) => {
                                                         const AreaIcon = getIcon(area.icon);
                                                         const isActiveArea = area.id === activeAreaId;
                                                         return (_jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { isActive: isActiveArea, tooltip: area.label, onClick: () => setActiveAreaId(area.id), children: [_jsx(AreaIcon, { className: "h-4 w-4" }), _jsx("span", { children: area.label })] }) }, area.id));
-                                                    }) }) })] })), _jsx(NavigationRenderer, { items: processedNavigation, basePath: basePath, evaluateVisibility: evalVis, checkPermission: checkPerm, enablePinning: !isMobile, onPinToggle: togglePin, enableReorder: !isMobile, onReorder: handleReorder, resolveObjectLabel: (objectName, fallback) => resolveNavObjectLabel({ name: objectName, label: fallback }), resolveDashboardLabel: (dashboardName, fallback) => resolveNavDashboardLabel({ name: dashboardName, label: fallback }), resolveGroupLabel: activeApp ? (groupId, fallback) => resolveNavGroupLabel(activeApp.name, groupId, fallback) : undefined, t: t }), recentItems.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5 cursor-pointer select-none", onClick: () => setRecentExpanded(prev => !prev), children: [_jsx(ChevronRight, { className: `h-3 w-3 transition-transform duration-150 ${recentExpanded ? 'rotate-90' : ''}` }), _jsx(Clock, { className: "h-3.5 w-3.5" }), t('sidebar.recent', { defaultValue: 'Recent' })] }), recentExpanded && (_jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: recentItems.slice(0, 5).map(item => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : '📄' }), _jsx("span", { className: "truncate", children: item.label })] }) }) }, item.id))) }) }))] })), favorites.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), t('sidebar.favorites', { defaultValue: 'Favorites' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": t('sidebar.removeFromFavorites', { defaultValue: 'Remove {{name}} from favorites', name: item.label }), children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) : (_jsxs(_Fragment, { children: [_jsx(SidebarGroup, { children: _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: homeNavigation.map((item) => {
+                                                    }) }) })] })), _jsx(NavigationRenderer, { items: processedNavigation, basePath: basePath, evaluateVisibility: evalVis, checkPermission: checkPerm, checkCapability: checkCap, enablePinning: !isMobile, onPinToggle: togglePin, enableReorder: !isMobile, onReorder: handleReorder, resolveObjectLabel: (objectName, fallback) => resolveNavObjectLabel({ name: objectName, label: fallback }), resolveDashboardLabel: (dashboardName, fallback) => resolveNavDashboardLabel({ name: dashboardName, label: fallback }), resolveGroupLabel: activeApp ? (groupId, fallback) => resolveNavGroupLabel(activeApp.name, groupId, fallback) : undefined, t: t }), recentItems.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5 cursor-pointer select-none", onClick: () => setRecentExpanded(prev => !prev), children: [_jsx(ChevronRight, { className: `h-3 w-3 transition-transform duration-150 ${recentExpanded ? 'rotate-90' : ''}` }), _jsx(Clock, { className: "h-3.5 w-3.5" }), t('sidebar.recent', { defaultValue: 'Recent' })] }), recentExpanded && (_jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: recentItems.slice(0, 5).map(item => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : '📄' }), _jsx("span", { className: "truncate", children: item.label })] }) }) }, item.id))) }) }))] })), favorites.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), t('sidebar.favorites', { defaultValue: 'Favorites' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": t('sidebar.removeFromFavorites', { defaultValue: 'Remove {{name}} from favorites', name: item.label }), children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) : (_jsxs(_Fragment, { children: [_jsx(SidebarGroup, { children: _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: homeNavigation.map((item) => {
                                                     const NavIcon = getIcon(item.icon);
                                                     const isActive = location.pathname === item.url;
                                                     return (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, isActive: isActive, children: _jsxs(Link, { to: item.url || '/home', children: [_jsx(NavIcon, { className: "h-4 w-4" }), _jsx("span", { children: item.label })] }) }) }, item.id));
-                                                }) }) }) }), favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), t('sidebar.starred', { defaultValue: 'Starred' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": t('sidebar.removeFromFavorites', { defaultValue: 'Remove {{name}} from favorites', name: item.label }), children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) }) }), _jsx(SidebarFooter, { className: "border-t p-1", children: _jsx(SidebarTrigger, { className: "w-full justify-start pl-2 group-data-[state=collapsed]:justify-center group-data-[state=collapsed]:pl-0" }) })] }), isMobile && context === 'app' && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: processedNavigation.filter((n) => n.type !== 'group').slice(0, 5).map((item) => {
-                    const NavIcon = getIcon(item.icon);
-                    let href = item.url || '#';
-                    if (item.type === 'object') {
-                        href = `${basePath}/${item.objectName}`;
-                        if (item.viewName)
-                            href += `/view/${item.viewName}`;
+                                                }) }) }) }), favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), t('sidebar.starred', { defaultValue: 'Starred' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": t('sidebar.removeFromFavorites', { defaultValue: 'Remove {{name}} from favorites', name: item.label }), children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) }) }), _jsx(SidebarFooter, { className: "border-t p-1", children: _jsx(SidebarTrigger, { className: "w-full justify-start pl-2 group-data-[state=collapsed]:justify-center group-data-[state=collapsed]:pl-0" }) })] }), isMobile && context === 'app' && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: (() => {
+                    // Flatten group items so apps that organise navigation into groups
+                    // (e.g. Setup → Overview / Administration / …) still surface real
+                    // leaf links in the mobile bottom nav instead of rendering nothing.
+                    const leaves = [];
+                    for (const item of processedNavigation) {
+                        if (item.type === 'group') {
+                            for (const child of (item.children || [])) {
+                                if (child && child.type !== 'group')
+                                    leaves.push(child);
+                            }
+                        }
+                        else {
+                            leaves.push(item);
+                        }
                     }
-                    else if (item.type === 'dashboard')
-                        href = item.dashboardName ? `${basePath}/dashboard/${item.dashboardName}` : '#';
-                    else if (item.type === 'page')
-                        href = item.pageName ? `${basePath}/page/${item.pageName}` : '#';
-                    return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
-                }) }))] }));
+                    return leaves.slice(0, 5).map((item) => {
+                        const NavIcon = getIcon(item.icon);
+                        let href = item.url || '#';
+                        if (item.type === 'object') {
+                            href = `${basePath}/${item.objectName}`;
+                            if (item.viewName)
+                                href += `/view/${item.viewName}`;
+                        }
+                        else if (item.type === 'dashboard')
+                            href = item.dashboardName ? `${basePath}/dashboard/${item.dashboardName}` : '#';
+                        else if (item.type === 'page')
+                            href = item.pageName ? `${basePath}/page/${item.pageName}` : '#';
+                        return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
+                    });
+                })() }))] }));
 }

package/dist/views/CreateViewDialog.js

@@ -65,15 +65,27 @@ const REQUIRED_FIELDS_BY_TYPE = {
             filter: (f) => f.type === 'date',
             preferred: PRIMARY_DATE_PREFERRED,
         },
+        {
+            key: 'titleField',
+            i18nKey: 'console.objectView.titleField',
+            helpI18nKey: 'console.objectView.titleFieldHelp',
+            filter: (f) => f.type === 'text',
+        },
     ],
     timeline: [
         {
-            key: 'dateField',
-            i18nKey: 'console.objectView.dateField',
+            key: 'startDateField',
+            i18nKey: 'console.objectView.startDateField',
             helpI18nKey: 'console.objectView.timelineDateFieldHelp',
             filter: (f) => f.type === 'date',
             preferred: PRIMARY_DATE_PREFERRED,
         },
+        {
+            key: 'titleField',
+            i18nKey: 'console.objectView.titleField',
+            helpI18nKey: 'console.objectView.titleFieldHelp',
+            filter: (f) => f.type === 'text',
+        },
     ],
     gantt: [
         {
@@ -90,10 +102,16 @@ const REQUIRED_FIELDS_BY_TYPE = {
             filter: (f) => f.type === 'date',
             preferred: END_DATE_PREFERRED,
         },
+        {
+            key: 'titleField',
+            i18nKey: 'console.objectView.titleField',
+            helpI18nKey: 'console.objectView.titleFieldHelp',
+            filter: (f) => f.type === 'text',
+        },
     ],
     gallery: [
         {
-            key: 'imageField',
+            key: 'coverField',
             i18nKey: 'console.objectView.imageField',
             helpI18nKey: 'console.objectView.imageFieldHelp',
             filter: (f) => isImageLikeField(f),

package/dist/views/DashboardView.js

@@ -27,7 +27,7 @@ const WIDGET_TYPES = [
     { type: 'line', label: 'Line Chart', Icon: LineChart },
     { type: 'pie', label: 'Pie Chart', Icon: PieChart },
     { type: 'table', label: 'Table', Icon: Table2 },
-    { type: 'grid', label: 'Grid', Icon: LayoutGrid },
+    { type: 'pivot', label: 'Pivot', Icon: LayoutGrid },
 ];
 let widgetCounter = 0;
 function createWidgetId() {
@@ -74,12 +74,22 @@ const TOP_LEVEL_WIDGET_KEYS = new Set([
     'layoutW',
     'layoutH',
     'id',
+    // Spec-declared top-level fields that the renderer reads directly off the
+    // widget (not from options). Keeping them here ensures the unflatten path
+    // does not silently drop them into options where the renderer ignores them.
+    'searchable',
+    'pagination',
+    // Drill-down virtual flat keys are handled explicitly below — listing them
+    // here keeps the generic options-collector from duplicating them.
+    'drillDownEnabled',
+    'drillDownTarget',
 ]);
 function flattenWidgetConfig(widget) {
     // Spread options first so explicit top-level widget fields take precedence
     // on collision. This surfaces type-specific options (pivot/table/chart axes,
     // list itemTemplate, etc.) so they appear pre-filled in the config panel.
     const options = (widget.options ?? {});
+    const drillDown = (options.drillDown ?? {});
     return {
         ...options,
         title: widget.title ?? '',
@@ -93,6 +103,11 @@ function flattenWidgetConfig(widget) {
         layoutH: widget.layout?.h ?? 1,
         colorVariant: widget.colorVariant ?? options.colorVariant ?? 'default',
         actionUrl: widget.actionUrl ?? options.actionUrl ?? '',
+        searchable: widget.searchable ?? options.searchable ?? false,
+        pagination: widget.pagination ?? options.pagination ?? false,
+        // Surface drill-down nested shape as flat switches for the panel
+        drillDownEnabled: drillDown.enabled ?? false,
+        drillDownTarget: drillDown.target ?? 'drawer',
     };
 }
 function unflattenWidgetConfig(config, base) {
@@ -107,6 +122,17 @@ function unflattenWidgetConfig(config, base) {
             continue;
         newOptions[key] = value;
     }
+    // Re-nest drill-down flat keys back under options.drillDown so the renderer
+    // (which reads `options.drillDown`) picks them up.
+    const drillDownEnabled = config.drillDownEnabled;
+    const drillDownTarget = config.drillDownTarget;
+    if (drillDownEnabled !== undefined || drillDownTarget !== undefined) {
+        newOptions.drillDown = {
+            ...(baseOptions.drillDown || {}),
+            ...(drillDownEnabled !== undefined ? { enabled: !!drillDownEnabled } : {}),
+            ...(drillDownTarget !== undefined ? { target: drillDownTarget } : {}),
+        };
+    }
     return {
         title: config.title,
         description: config.description,
@@ -118,6 +144,8 @@ function unflattenWidgetConfig(config, base) {
         layout: { ...(base.layout || {}), w: config.layoutW, h: config.layoutH },
         colorVariant: config.colorVariant,
         actionUrl: config.actionUrl,
+        ...(config.searchable !== undefined ? { searchable: !!config.searchable } : {}),
+        ...(config.pagination !== undefined ? { pagination: !!config.pagination } : {}),
         ...(Object.keys(newOptions).length > 0 ? { options: newOptions } : {}),
     };
 }
@@ -129,6 +157,7 @@ function extractDashboardConfig(schema) {
         rowHeight: String(s.rowHeight ?? '120'),
         refreshInterval: String(s.refreshInterval ?? '0'),
         title: s.title ?? '',
+        description: s.description ?? '',
         showDescription: s.showDescription ?? true,
         theme: s.theme ?? 'auto',
     };
@@ -231,7 +260,12 @@ export function DashboardView({ dataSource }) {
             refresh().catch(() => { });
         }
         catch (err) {
+            // Surface the failure — previously this was a silent console.warn,
+            // which produced "I saw it work, then refresh wiped it" reports
+            // because the optimistic state update masked a server-side reject.
+            const message = err instanceof Error ? err.message : String(err);
             console.warn('[DashboardView] Auto-save failed:', err);
+            toast.error(`Failed to save dashboard: ${message}`);
         }
     }, [adapter, dashboardName, refresh]);
     // ---- Open / close config panel ------------------------------------------
@@ -279,6 +313,18 @@ export function DashboardView({ dataSource }) {
             setSelectedWidgetId(null);
         }
     }, [editSchema, selectedWidgetId, saveSchema]);
+    // Reorder widgets via drag-and-drop from DashboardRenderer's design mode.
+    const handleWidgetsReorder = useCallback((nextWidgets) => {
+        const baseSchema = editSchema || dashboard;
+        if (!baseSchema)
+            return;
+        const newSchema = {
+            ...baseSchema,
+            widgets: nextWidgets,
+        };
+        setEditSchema(newSchema);
+        saveSchema(newSchema);
+    }, [editSchema, dashboard, saveSchema]);
     // ---- Dashboard config panel handlers ------------------------------------
     // Stabilize config reference: only recompute after explicit actions (panel
     // open, save, widget add). configVersion is incremented on those actions.
@@ -301,6 +347,7 @@ export function DashboardView({ dataSource }) {
             rowHeight: toNum(config.rowHeight, editSchema.rowHeight),
             refreshInterval: toNum(config.refreshInterval, 0) ?? 0,
             title: config.title,
+            description: config.description,
             showDescription: config.showDescription,
             theme: config.theme,
         };
@@ -391,6 +438,34 @@ export function DashboardView({ dataSource }) {
             label: f.label || key,
         }));
     }, [selectedWidget?.object, metadataObjects]);
+    // ---- Runtime capability gate (must run before guards to respect Rules of Hooks)
+    // Hide widgets whose `requiresObject` is not registered (mirrors
+    // NavigationItem.requiresObject for nav entries). Defaults to widget.object
+    // when not set, so any object-bound widget disappears gracefully when its
+    // backing object isn't in this runtime (e.g. cloud-only
+    // `sys_package_installation` on system_overview).
+    const registeredObjectNamesForFilter = useMemo(() => new Set((metadataObjects || []).map((o) => o?.name).filter(Boolean)), [metadataObjects]);
+    const previewSchemaSrc = editSchema || dashboard;
+    const previewSchema = useMemo(() => {
+        if (!previewSchemaSrc)
+            return previewSchemaSrc;
+        // Defer pruning until metadata has actually loaded — otherwise the
+        // empty Set would hide every object-bound widget on first render.
+        if (registeredObjectNamesForFilter.size === 0)
+            return previewSchemaSrc;
+        const widgets = previewSchemaSrc.widgets;
+        if (!Array.isArray(widgets) || widgets.length === 0)
+            return previewSchemaSrc;
+        const filtered = widgets.filter((w) => {
+            const required = w?.requiresObject ?? w?.object;
+            if (!required)
+                return true;
+            return registeredObjectNamesForFilter.has(required);
+        });
+        if (filtered.length === widgets.length)
+            return previewSchemaSrc;
+        return { ...previewSchemaSrc, widgets: filtered };
+    }, [previewSchemaSrc, registeredObjectNamesForFilter]);
     // ---- Loading / not-found guards -----------------------------------------
     if (isLoading) {
         return _jsx(SkeletonDashboard, {});
@@ -398,14 +473,29 @@ export function DashboardView({ dataSource }) {
     if (!dashboard) {
         return (_jsx("div", { className: "h-full flex items-center justify-center p-8", children: _jsxs(Empty, { children: [_jsx("div", { className: "mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted", children: _jsx(LayoutDashboard, { className: "h-6 w-6 text-muted-foreground" }) }), _jsx(EmptyTitle, { children: t('empty.dashboardNotFound') }), _jsx(EmptyDescription, { children: t('empty.dashboardNotFoundDescription', { name: dashboardName }) })] }) }));
     }
-    const previewSchema = editSchema || dashboard;
-    return (_jsxs("div", { className: "flex flex-col h-full overflow-hidden bg-background", children: [_jsxs("div", { className: "flex flex-col sm:flex-row justify-between sm:items-center gap-3 sm:gap-4 p-4 sm:p-6 border-b shrink-0", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("h1", { className: "text-lg sm:text-xl md:text-2xl font-bold tracking-tight truncate", children: dashboardLabel({ name: dashboard.name, label: resolveI18nLabel(dashboard.label, t) }) || dashboard.name }), (() => {
+    return (_jsxs("div", { className: "flex flex-col h-full overflow-hidden bg-background", children: [_jsxs("div", { className: "flex flex-col sm:flex-row justify-between sm:items-center gap-3 sm:gap-4 p-4 sm:p-6 border-b shrink-0", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [(() => {
+                                // Per @objectstack/spec, DashboardSchema.title is "the dashboard
+                                // title displayed in the header". We prefer it when present so
+                                // edits made through the config panel (which writes `title`) are
+                                // visible after save/reload. Falls back to `label` (the metadata
+                                // display name) and finally to the raw `name`. We also follow
+                                // `previewSchema` instead of the cached `dashboard` so the H1
+                                // updates live while the user is typing in the config panel.
+                                const headerSrc = previewSchema || dashboard;
+                                const resolvedTitle = resolveI18nLabel(headerSrc.title, t);
+                                const resolvedLabel = resolveI18nLabel(dashboard.label, t);
+                                const fallbackLabel = dashboardLabel({ name: dashboard.name, label: resolvedLabel });
+                                const display = resolvedTitle || fallbackLabel || dashboard.name;
+                                return (_jsx("h1", { className: "text-lg sm:text-xl md:text-2xl font-bold tracking-tight truncate", children: display }));
+                            })(), (() => {
+                                const headerSrc = previewSchema || dashboard;
+                                const rawDesc = headerSrc.description ?? dashboard.description;
                                 const desc = dashboardDescription({
                                     name: dashboard.name,
-                                    description: resolveI18nLabel(dashboard.description, t),
+                                    description: resolveI18nLabel(rawDesc, t),
                                 });
                                 return desc ? (_jsx("p", { className: "text-sm text-muted-foreground mt-1 line-clamp-2", children: desc })) : null;
-                            })()] }), _jsxs("div", { className: "shrink-0 flex items-center gap-1.5", children: [configPanelOpen && (_jsx("div", { className: "flex items-center gap-1 mr-2", role: "toolbar", "aria-label": "Add widgets", "data-testid": "dashboard-widget-toolbar", children: WIDGET_TYPES.map(({ type, label, Icon }) => (_jsxs("button", { type: "button", "data-testid": `dashboard-add-${type}`, onClick: () => addWidget(type), className: "inline-flex items-center gap-1 rounded-md border border-input bg-background px-2 py-1.5 text-[11px] font-medium text-muted-foreground hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", title: `Add ${label}`, "aria-label": `Add ${label} widget`, children: [_jsx(Plus, { className: "h-3 w-3" }), _jsx(Icon, { className: "h-3 w-3" })] }, type))) })), _jsxs("button", { type: "button", onClick: handleOpenConfigPanel, className: "inline-flex items-center gap-1.5 rounded-md border border-input bg-background px-2.5 py-1.5 text-xs font-medium text-muted-foreground shadow-sm hover:bg-accent hover:text-accent-foreground", "data-testid": "dashboard-edit-button", children: [_jsx(Pencil, { className: "h-3.5 w-3.5" }), t('common.edit', { defaultValue: 'Edit' })] })] })] }), _jsxs("div", { className: "flex-1 overflow-hidden flex flex-col sm:flex-row relative", children: [_jsx("div", { className: "flex-1 min-w-0 overflow-auto p-2 sm:p-4 md:p-6", children: _jsx(DashboardRenderer, { schema: previewSchema, dataSource: dataSource, designMode: configPanelOpen, selectedWidgetId: selectedWidgetId, onWidgetClick: setSelectedWidgetId, modalHandler: modalHandler, scriptHandlers: scriptHandlers }) }), selectedWidget ? (_jsx(WidgetConfigPanel, { open: configPanelOpen, onClose: handleCloseConfigPanel, config: widgetConfig, onSave: handleWidgetConfigSave, onFieldChange: handleWidgetFieldChange, availableObjects: availableObjects, availableFields: availableFields, headerExtra: _jsx(Button, { size: "sm", variant: "ghost", onClick: () => removeWidget(selectedWidgetId), className: "h-7 w-7 p-0 text-destructive hover:text-destructive", "data-testid": "widget-delete-button", title: "Delete widget", children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }) }, selectedWidgetId)) : (_jsx(DashboardConfigPanel, { open: configPanelOpen, onClose: handleCloseConfigPanel, config: dashboardConfig, onSave: handleDashboardConfigSave, onFieldChange: handleDashboardFieldChange })), _jsx(MetadataPanel, { open: showDebug, sections: [{ title: 'Dashboard Configuration', data: previewSchema }] })] }), modalState && modalState.schema?.objectName ? (_jsx(ModalForm, { schema: {
+                            })()] }), _jsxs("div", { className: "shrink-0 flex items-center gap-1.5", children: [configPanelOpen && (_jsx("div", { className: "flex items-center gap-1 mr-2", role: "toolbar", "aria-label": "Add widgets", "data-testid": "dashboard-widget-toolbar", children: WIDGET_TYPES.map(({ type, label, Icon }) => (_jsxs("button", { type: "button", "data-testid": `dashboard-add-${type}`, onClick: () => addWidget(type), className: "inline-flex items-center gap-1 rounded-md border border-input bg-background px-2 py-1.5 text-[11px] font-medium text-muted-foreground hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", title: `Add ${label}`, "aria-label": `Add ${label} widget`, children: [_jsx(Plus, { className: "h-3 w-3" }), _jsx(Icon, { className: "h-3 w-3" })] }, type))) })), _jsxs("button", { type: "button", onClick: handleOpenConfigPanel, className: "inline-flex items-center gap-1.5 rounded-md border border-input bg-background px-2.5 py-1.5 text-xs font-medium text-muted-foreground shadow-sm hover:bg-accent hover:text-accent-foreground", "data-testid": "dashboard-edit-button", children: [_jsx(Pencil, { className: "h-3.5 w-3.5" }), t('common.edit', { defaultValue: 'Edit' })] })] })] }), _jsxs("div", { className: "flex-1 overflow-hidden flex flex-col sm:flex-row relative", children: [_jsx("div", { className: "flex-1 min-w-0 overflow-auto p-2 sm:p-4 md:p-6", children: _jsx(DashboardRenderer, { schema: previewSchema, dataSource: dataSource, designMode: configPanelOpen, selectedWidgetId: selectedWidgetId, onWidgetClick: setSelectedWidgetId, onWidgetsReorder: handleWidgetsReorder, modalHandler: modalHandler, scriptHandlers: scriptHandlers, hideHeaderText: true }) }), selectedWidget ? (_jsx(WidgetConfigPanel, { open: configPanelOpen, onClose: handleCloseConfigPanel, config: widgetConfig, onSave: handleWidgetConfigSave, onFieldChange: handleWidgetFieldChange, availableObjects: availableObjects, availableFields: availableFields, headerExtra: _jsx(Button, { size: "sm", variant: "ghost", onClick: () => removeWidget(selectedWidgetId), className: "h-7 w-7 p-0 text-destructive hover:text-destructive", "data-testid": "widget-delete-button", title: "Delete widget", children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }) }, selectedWidgetId)) : (_jsx(DashboardConfigPanel, { open: configPanelOpen, onClose: handleCloseConfigPanel, config: dashboardConfig, onSave: handleDashboardConfigSave, onFieldChange: handleDashboardFieldChange })), _jsx(MetadataPanel, { open: showDebug, sections: [{ title: 'Dashboard Configuration', data: previewSchema }] })] }), modalState && modalState.schema?.objectName ? (_jsx(ModalForm, { schema: {
                     type: 'object-form',
                     formType: 'modal',
                     objectName: modalState.schema.objectName,

package/dist/views/ObjectView.js

@@ -400,6 +400,20 @@ export function ObjectView({ dataSource, objects, onEdit, externalRefreshKey })
                 // the physical `sys_view` table (whose columns no longer
                 // accommodate the spec shape: arrays, nested objects, etc.).
                 const spec = { ...config, columns: incomingColumns };
+                // Per @objectstack/spec, certain view types nest their card/field
+                // list inside their type-specific subconfig (e.g. kanban.columns,
+                // gallery.visibleFields). The CreateViewDialog only collects
+                // required *picker* fields; we mirror the resolved column list
+                // into the subconfig here so the spec validator accepts the row.
+                if (config.type === 'kanban') {
+                    spec.kanban = { ...(spec.kanban || {}), columns: incomingColumns };
+                }
+                else if (config.type === 'gallery') {
+                    const existing = spec.gallery || {};
+                    if (!Array.isArray(existing.visibleFields) || existing.visibleFields.length === 0) {
+                        spec.gallery = { ...existing, visibleFields: incomingColumns };
+                    }
+                }
                 if (typeof dataSource?.createView === 'function') {
                     const created = await dataSource.createView(objectName, spec);
                     createdId = created?.name || config?.name;
@@ -1490,6 +1504,11 @@ export function ObjectView({ dataSource, objects, onEdit, externalRefreshKey })
                                         })),
                                         size: 'sm',
                                         variant: 'outline',
+                                        // On mobile, collapse all schema-driven toolbar actions
+                                        // into a single overflow menu so the icon-only New /
+                                        // Import buttons stay visible without pushing the page
+                                        // title off-screen.
+                                        mobileMaxVisible: 0,
                                     } }))] }) }), showImport && (_jsx(Suspense, { fallback: null, children: _jsx(ImportWizard, { open: showImport, onOpenChange: setShowImport, objectName: objectDef.name, objectLabel: objectLabel(objectDef), fields: Object.entries(objectDef.fields || {}).map(([name, def]) => ({
                                 name,
                                 label: def?.label || name,

package/dist/views/RecordDetailView.js

@@ -22,6 +22,14 @@ import { ActionParamDialog } from './ActionParamDialog';
 import { useRecordBreadcrumbTitle } from '../context/NavigationContext';
 import { getRecordDisplayName } from '../utils';
 const FALLBACK_USER = { id: 'current-user', name: 'Demo User' };
+/**
+ * Audit field names auto-injected by the framework's `applySystemFields`.
+ * Surfaced as a dedicated, collapsed "System Information" section on the
+ * record detail page so they don't clutter the primary content but remain
+ * discoverable. The inline-edit drawer keeps filtering them out via
+ * `DEFAULT_SYSTEM_FIELDS` in `@object-ui/plugin-detail/RecordDetailDrawer`.
+ */
+const AUDIT_FIELD_NAMES = new Set(['created_at', 'created_by', 'updated_at', 'updated_by']);
 export function RecordDetailView({ dataSource, objects, onEdit }) {
     const { appName, objectName, recordId } = useParams();
     const { showDebug } = useMetadataInspector();
@@ -226,9 +234,10 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
         });
         return () => { cancelled = true; };
     }, [dataSource, pureRecordId, childRelations]);
-    const currentUser = user
-        ? { id: user.id, name: user.name, avatar: user.image }
-        : FALLBACK_USER;
+    // Memoize so the object identity is stable across renders — otherwise
+    // any effect that depends on it (e.g. the feed loader below) would
+    // re-fire every render and create an infinite request loop.
+    const currentUser = useMemo(() => (user ? { id: user.id, name: user.name, avatar: user.image } : FALLBACK_USER), [user?.id, user?.name, user?.image]);
     // Fetch presence and comments from API
     useEffect(() => {
         if (!dataSource || !objectName || !pureRecordId)
@@ -239,28 +248,141 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
             .then((res) => { if (res.data?.length)
             setRecordViewers(res.data); })
             .catch(() => { });
-        // Fetch persisted comments and map to FeedItem[]
-        dataSource.find('sys_comment', { $filter: { threadId }, $orderby: { createdAt: 'asc' } })
+        // M10.10: Fetch persisted comments from sys_comment. Field names
+        // are snake_case to match the platform-objects schema
+        // (`packages/platform-objects/src/audit/sys-comment.object.ts`):
+        // thread_id, author_id, author_name, author_avatar_url, body,
+        // reactions (JSON string), parent_id, created_at, updated_at.
+        //
+        // Reactions are stored as a JSON object of `{ emoji: string[] }`
+        // (one array of user-ids per emoji). The aggregator below counts
+        // entries and flags the currently-signed-in user.
+        const parseReactions = (raw) => {
+            if (!raw)
+                return undefined;
+            let parsed;
+            if (typeof raw === 'string') {
+                try {
+                    parsed = JSON.parse(raw);
+                }
+                catch {
+                    return undefined;
+                }
+            }
+            else if (typeof raw === 'object') {
+                parsed = raw;
+            }
+            if (!parsed)
+                return undefined;
+            return Object.entries(parsed).map(([emoji, userIds]) => ({
+                emoji,
+                count: Array.isArray(userIds) ? userIds.length : 0,
+                reacted: Array.isArray(userIds) && userIds.includes(currentUser.id),
+            }));
+        };
+        dataSource.find('sys_comment', { $filter: { thread_id: threadId }, $orderby: { created_at: 'asc' } })
+            .then((res) => {
+            if (!res?.data?.length)
+                return;
+            const mapped = res.data.map((c) => ({
+                id: c.id,
+                type: 'comment',
+                actor: c.author_name ?? 'Unknown',
+                actorAvatarUrl: c.author_avatar_url ?? undefined,
+                body: c.body ?? '',
+                createdAt: c.created_at,
+                updatedAt: c.updated_at,
+                parentId: c.parent_id ?? undefined,
+                reactions: parseReactions(c.reactions),
+            }));
+            setFeedItems(prev => {
+                const byId = new Map();
+                for (const item of [...prev, ...mapped])
+                    byId.set(String(item.id), item);
+                return Array.from(byId.values()).sort((a, b) => {
+                    const ta = a.createdAt ? Date.parse(a.createdAt) : 0;
+                    const tb = b.createdAt ? Date.parse(b.createdAt) : 0;
+                    return ta - tb;
+                });
+            });
+        })
+            .catch(() => { });
+        // M10.11: Fetch sys_activity rows for this record and merge into the
+        // timeline. plugin-audit's writers populate sys_activity on every
+        // create/update/delete of objects that opt-in via enable.activities,
+        // so this surface — once wired here — gives us a Salesforce-style
+        // "what happened on this record" feed without any per-app glue.
+        //
+        // We map sys_activity.type to FeedItemType so the existing icon /
+        // colour map in RecordActivityTimeline keeps working:
+        //   created/updated/deleted/system → 'field_change'
+        //   assigned/shared                → 'field_change'
+        //   completed                      → 'task'
+        //   commented/mentioned            → 'comment'  (but skipped — we
+        //                                    already load these from
+        //                                    sys_comment to get reactions
+        //                                    and threading)
+        //
+        // sys_activity is system-owned so a 404 ("table not provisioned",
+        // older schemas without activities) is silently tolerated.
+        const activityTypeToFeed = {
+            created: 'field_change',
+            updated: 'field_change',
+            deleted: 'field_change',
+            assigned: 'field_change',
+            shared: 'field_change',
+            system: 'system',
+            completed: 'task',
+            commented: undefined,
+            mentioned: undefined,
+            login: undefined,
+            logout: undefined,
+        };
+        dataSource.find('sys_activity', {
+            $filter: { object_name: objectName, record_id: pureRecordId },
+            $orderby: { timestamp: 'asc' },
+            $top: 200,
+        })
             .then((res) => {
-            if (res.data?.length) {
-                setFeedItems(res.data.map((c) => ({
-                    id: c.id,
-                    type: 'comment',
-                    actor: c.author?.name ?? 'Unknown',
-                    actorAvatarUrl: c.author?.avatar,
-                    body: c.content,
-                    createdAt: c.createdAt,
-                    updatedAt: c.updatedAt,
-                    parentId: c.parentId,
-                    reactions: c.reactions
-                        ? Object.entries(c.reactions).map(([emoji, userIds]) => ({
-                            emoji,
-                            count: userIds.length,
-                            reacted: userIds.includes(currentUser.id),
-                        }))
-                        : undefined,
-                })));
+            if (!res?.data?.length)
+                return;
+            const mapped = [];
+            for (const row of res.data) {
+                const t = activityTypeToFeed[row.type];
+                if (!t)
+                    continue;
+                // Prefer the explicit `timestamp` column, but tolerate older
+                // rows where the driver leaked the literal "NOW()" — fall
+                // back to created_at (always a real ISO date).
+                let when = row.timestamp;
+                if (!when || when === 'NOW()' || Number.isNaN(Date.parse(when))) {
+                    when = row.created_at;
+                }
+                mapped.push({
+                    id: row.id,
+                    type: t,
+                    actor: row.actor_name ?? 'System',
+                    actorAvatarUrl: row.actor_avatar_url ?? undefined,
+                    body: row.summary ?? '',
+                    createdAt: when,
+                });
             }
+            if (!mapped.length)
+                return;
+            setFeedItems(prev => {
+                // Merge by id (timeline events are append-only); sort by
+                // createdAt ascending so the activity panel reads as a
+                // chronological narrative.
+                const byId = new Map();
+                for (const item of [...prev, ...mapped]) {
+                    byId.set(String(item.id), item);
+                }
+                return Array.from(byId.values()).sort((a, b) => {
+                    const ta = a.createdAt ? Date.parse(a.createdAt) : 0;
+                    const tb = b.createdAt ? Date.parse(b.createdAt) : 0;
+                    return ta - tb;
+                });
+            });
         })
             .catch(() => { });
     }, [dataSource, objectName, pureRecordId, currentUser]);
@@ -274,16 +396,18 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
             createdAt: new Date().toISOString(),
         };
         setFeedItems(prev => [...prev, newItem]);
-        // Persist to backend
+        // Persist to backend (M10.10: snake_case fields per sys_comment schema)
         if (dataSource) {
             const threadId = `${objectName}:${pureRecordId}`;
             dataSource.create('sys_comment', {
                 id: newItem.id,
-                threadId,
-                author: currentUser,
-                content: text,
-                mentions: [],
-                createdAt: newItem.createdAt,
+                thread_id: threadId,
+                author_id: currentUser.id,
+                author_name: currentUser.name,
+                author_avatar_url: 'avatar' in currentUser ? currentUser.avatar : undefined,
+                body: text,
+                mentions: '[]',
+                created_at: newItem.createdAt,
             }).catch(() => { });
         }
     }, [currentUser, dataSource, objectName, pureRecordId]);
@@ -308,12 +432,14 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
             const threadId = `${objectName}:${pureRecordId}`;
             dataSource.create('sys_comment', {
                 id: newItem.id,
-                threadId,
-                author: currentUser,
-                content: text,
-                mentions: [],
-                createdAt: newItem.createdAt,
-                parentId,
+                thread_id: threadId,
+                author_id: currentUser.id,
+                author_name: currentUser.name,
+                author_avatar_url: 'avatar' in currentUser ? currentUser.avatar : undefined,
+                body: text,
+                mentions: '[]',
+                created_at: newItem.createdAt,
+                parent_id: parentId,
             }).catch(() => { });
         }
     }, [currentUser, dataSource, objectName, pureRecordId]);
@@ -342,10 +468,31 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
                 reactions.push({ emoji, count: 1, reacted: true });
             }
             const updated = { ...item, reactions };
-            // Persist reaction toggle to backend
+            // Persist reactions to backend as JSON. The schema stores
+            // `reactions` as a textarea JSON string of `{ emoji: userIds[] }`,
+            // so we rebuild the canonical shape from the optimistic local
+            // state before writing back. A failed update silently keeps the
+            // optimistic UI change (best-effort, surfaced by RUM if needed).
             if (dataSource) {
+                const userId = currentUser.id;
+                const remoteShape = {};
+                for (const r of reactions) {
+                    // We don't have the original user-id list locally, so we
+                    // approximate by emitting the signed-in user when they are
+                    // the (only known) reactor. This is an over-simplification
+                    // for single-user pilot installs and will be replaced by a
+                    // proper backend reaction endpoint in M11.
+                    const ids = [];
+                    if (r.reacted)
+                        ids.push(userId);
+                    // Pad with a synthetic marker so count is preserved across
+                    // refreshes from other clients (best-effort).
+                    while (ids.length < r.count)
+                        ids.push('__other__');
+                    remoteShape[r.emoji] = ids;
+                }
                 dataSource.update('sys_comment', String(itemId), {
-                    $toggleReaction: { emoji, userId: currentUser.id },
+                    reactions: JSON.stringify(remoteShape),
                 }).catch(() => { });
             }
             return updated;
@@ -397,7 +544,9 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
                     // section, DetailSection flattens it (no Card chrome, no
                     // redundant "Details" heading).
                     showBorder: false,
-                    fields: Object.keys(objectDef.fields || {}).map(key => {
+                    fields: Object.keys(objectDef.fields || {})
+                        .filter(key => !AUDIT_FIELD_NAMES.has(key))
+                        .map(key => {
                         const fieldDef = objectDef.fields[key];
                         const refTarget = fieldDef.reference_to || fieldDef.reference;
                         return {
@@ -412,6 +561,32 @@ export function RecordDetailView({ dataSource, objects, onEdit }) {
                     }),
                 },
             ];
+        // Append a dedicated, collapsed "System Information" section listing
+        // audit fields (created/updated at/by) when the schema declares them
+        // and no author-defined section has already surfaced them. The framework
+        // auto-injects these as `system: true, readonly: true` via
+        // `applySystemFields`; rendering them here gives users visibility into
+        // record provenance without polluting the primary content area.
+        const fieldsAlreadyShown = new Set(sections.flatMap((s) => (s.fields || []).map((f) => f.name)));
+        const auditFieldsToShow = Array.from(AUDIT_FIELD_NAMES).filter(name => objectDef.fields?.[name] && !fieldsAlreadyShown.has(name));
+        if (auditFieldsToShow.length > 0) {
+            sections.push({
+                title: sectionLabel(objectDef.name, 'system_info', 'System Information'),
+                collapsible: true,
+                defaultCollapsed: true,
+                fields: auditFieldsToShow.map(key => {
+                    const fieldDef = objectDef.fields[key];
+                    const refTarget = fieldDef.reference_to || fieldDef.reference;
+                    return {
+                        name: key,
+                        label: fieldDef.label || key,
+                        type: fieldDef.type || 'text',
+                        readonly: true,
+                        ...(refTarget && { reference_to: refTarget }),
+                    };
+                }),
+            });
+        }
         // Filter actions for record_header location and deduplicate by name
         const recordHeaderActions = (() => {
             const seen = new Set();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@object-ui/app-shell",
-  "version": "4.0.10",
+  "version": "4.0.12",
   "type": "module",
   "license": "MIT",
   "description": "Minimal application shell for ObjectUI - framework-agnostic rendering engine",
@@ -25,39 +25,39 @@
     "./styles.css": "./src/styles.css"
   },
   "dependencies": {
-    "lucide-react": "^1.14.0",
+    "lucide-react": "^1.16.0",
     "sonner": "^2.0.7",
-    "@object-ui/auth": "4.0.10",
-    "@object-ui/collaboration": "4.0.10",
-    "@object-ui/components": "4.0.10",
-    "@object-ui/core": "4.0.10",
-    "@object-ui/data-objectstack": "4.0.10",
-    "@object-ui/fields": "4.0.10",
-    "@object-ui/i18n": "4.0.10",
-    "@object-ui/layout": "4.0.10",
-    "@object-ui/permissions": "4.0.10",
-    "@object-ui/react": "4.0.10",
-    "@object-ui/types": "4.0.10"
+    "@object-ui/auth": "4.0.12",
+    "@object-ui/collaboration": "4.0.12",
+    "@object-ui/components": "4.0.12",
+    "@object-ui/core": "4.0.12",
+    "@object-ui/data-objectstack": "4.0.12",
+    "@object-ui/fields": "4.0.12",
+    "@object-ui/i18n": "4.0.12",
+    "@object-ui/layout": "4.0.12",
+    "@object-ui/permissions": "4.0.12",
+    "@object-ui/react": "4.0.12",
+    "@object-ui/types": "4.0.12"
   },
   "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": "4.0.10",
-    "@object-ui/plugin-charts": "4.0.10",
-    "@object-ui/plugin-chatbot": "4.0.10",
-    "@object-ui/plugin-dashboard": "4.0.10",
-    "@object-ui/plugin-designer": "4.0.10",
-    "@object-ui/plugin-detail": "4.0.10",
-    "@object-ui/plugin-form": "4.0.10",
-    "@object-ui/plugin-grid": "4.0.10",
-    "@object-ui/plugin-kanban": "4.0.10",
-    "@object-ui/plugin-list": "4.0.10",
-    "@object-ui/plugin-report": "4.0.10",
-    "@object-ui/plugin-view": "4.0.10"
+    "@object-ui/plugin-calendar": "4.0.12",
+    "@object-ui/plugin-charts": "4.0.12",
+    "@object-ui/plugin-chatbot": "4.0.12",
+    "@object-ui/plugin-dashboard": "4.0.12",
+    "@object-ui/plugin-designer": "4.0.12",
+    "@object-ui/plugin-detail": "4.0.12",
+    "@object-ui/plugin-form": "4.0.12",
+    "@object-ui/plugin-grid": "4.0.12",
+    "@object-ui/plugin-kanban": "4.0.12",
+    "@object-ui/plugin-list": "4.0.12",
+    "@object-ui/plugin-report": "4.0.12",
+    "@object-ui/plugin-view": "4.0.12"
   },
   "devDependencies": {
-    "@types/node": "^25.7.0",
+    "@types/node": "^25.9.0",
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "react": "19.2.6",
@@ -65,7 +65,7 @@
     "react-router-dom": "^7.15.0",
     "sonner": "^2.0.7",
     "typescript": "^6.0.3",
-    "vite": "^8.0.12"
+    "vite": "^8.0.13"
   },
   "keywords": [
     "objectui",