@xenide-io/the-old-ui-theme 0.5.2 → 0.5.4

package/dist/suite.d.mts

@@ -4,7 +4,7 @@ import { ClassValue } from 'clsx';
 export { m } from 'motion/react';
 
 /**
- * Today page content wrapper with soft atmosphere.
+ * Today page content wrapper with a soft themed visual treatment.
  * Does not own scrolling — `#main-content` is the scrollport so sticky headers work.
  * Glow/clouds are absolute and do not create a nested scrollport.
  */
@@ -130,10 +130,12 @@ declare function TodayEmptyState({ title, description, }: {
  */
 interface SuiteDropdownMenuProps {
     trigger: ReactNode;
+    triggerId?: string;
+    triggerDataTest?: string;
     children: ReactNode;
-    'aria-label': string;
-    align?: 'start' | 'center' | 'end';
-    side?: 'top' | 'right' | 'bottom' | 'left';
+    "aria-label": string;
+    align?: "start" | "center" | "end";
+    side?: "top" | "right" | "bottom" | "left";
     sideOffset?: number;
     className?: string;
     panelClassName?: string;
@@ -155,10 +157,14 @@ type SuiteCommandPaletteComponent = ComponentType<{
     onClose: () => void;
     placeholder?: string;
     className?: string;
+    id?: string;
+    dataTest?: string;
+    inputId?: string;
+    inputDataTest?: string;
 }>;
 /** App-branded spinner (each app has its own AppSpinner design). */
 type SuiteSpinnerComponent = ComponentType<{
-    size?: 'sm' | 'md' | 'lg';
+    size?: "sm" | "md" | "lg";
     className?: string;
     label?: string;
 }>;
@@ -186,7 +192,7 @@ interface SuiteAppEntry {
  * visible app list, the cross-app navigation handler, and the theme
  * dropdown primitives.
  */
-declare function AppSwitcher({ apps, currentApp, onSelect, mark, title, collapsed, dropdownMenu: DropdownMenu, dropdownItem: DropdownItem, }: {
+declare function AppSwitcher({ apps, currentApp, onSelect, mark, title, collapsed, dropdownMenu: DropdownMenu, dropdownItem: DropdownItem, triggerId, triggerDataTest, }: {
     apps: SuiteAppEntry[];
     currentApp: string;
     onSelect: (app: SuiteAppEntry) => void;
@@ -195,6 +201,8 @@ declare function AppSwitcher({ apps, currentApp, onSelect, mark, title, collapse
     collapsed?: boolean;
     dropdownMenu: SuiteDropdownMenuComponent;
     dropdownItem: SuiteDropdownItemComponent;
+    triggerId?: string;
+    triggerDataTest?: string;
 }): react.JSX.Element;
 
 /** Cross-app (suite) notification from `/api/notifications/` — shared across ShellStack apps. */
@@ -214,23 +222,30 @@ interface SuiteNotificationsResponse {
     notifications: SuiteNotification[];
     unread_count: number;
 }
-declare function SuiteNotificationBell({ fetchNotifications, markRead, markAllRead, dropdownMenu: DropdownMenu, cacheKey, }: {
+declare function SuiteNotificationBell({ fetchNotifications, markRead, markAllRead, dropdownMenu: DropdownMenu, cacheKey, dataTest, triggerId, triggerDataTest, }: {
     fetchNotifications: () => Promise<SuiteNotificationsResponse>;
     markRead: (id: string) => Promise<unknown>;
     markAllRead: () => Promise<unknown>;
     dropdownMenu: SuiteDropdownMenuComponent;
     /** sessionStorage key for stale-while-revalidate; `null` disables caching. */
     cacheKey?: string | null;
+    dataTest?: string;
+    triggerId?: string;
+    triggerDataTest?: string;
 }): react.JSX.Element;
 
 /**
  * Cmd/Ctrl+K command palette host. Apps build the item list and inject the
  * theme CommandPalette primitive.
  */
-declare function CommandPaletteHost({ items, isAuthenticated, placeholder, commandPalette: CommandPalette, }: {
+declare function CommandPaletteHost({ items, isAuthenticated, placeholder, id, dataTest, inputId, inputDataTest, commandPalette: CommandPalette, }: {
     items: SuiteCommandItem[];
     isAuthenticated?: boolean;
     placeholder?: string;
+    id?: string;
+    dataTest?: string;
+    inputId?: string;
+    inputDataTest?: string;
     commandPalette: SuiteCommandPaletteComponent;
 }): react.JSX.Element | null;
 
@@ -244,7 +259,7 @@ declare function DeferredChrome({ children }: {
  * close, body scroll-lock and focus hand-off while open. Nav content stays
  * app-side via `children`.
  */
-declare function SuiteMobileDrawer({ open, onClose, children, side, showCloseButton, title, closeLabel, backdropLabel, dialogLabel, durationMs, dataTest, panelDataTest, panelClassName, }: {
+declare function SuiteMobileDrawer({ open, onClose, children, side, showCloseButton, title, closeLabel, backdropLabel, dialogLabel, durationMs, dataTest, panelDataTest, backdropId, backdropDataTest, closeButtonId, closeButtonDataTest, panelClassName, }: {
     open: boolean;
     onClose: () => void;
     children: ReactNode;
@@ -262,13 +277,17 @@ declare function SuiteMobileDrawer({ open, onClose, children, side, showCloseBut
     durationMs?: number;
     dataTest?: string;
     panelDataTest?: string;
+    backdropId?: string;
+    backdropDataTest?: string;
+    closeButtonId?: string;
+    closeButtonDataTest?: string;
     /** Panel surface overrides (e.g. `bg-ph-canvas`). */
     panelClassName?: string;
 }): react.JSX.Element | null;
 
 type SuiteMenuIcon = ComponentType<{
     className?: string;
-    'aria-hidden'?: boolean | 'true' | 'false';
+    "aria-hidden"?: boolean | "true" | "false";
 }>;
 /**
  * Suite mobile app bar — the standardized top of every app on phone/tablet.
@@ -276,7 +295,7 @@ type SuiteMenuIcon = ComponentType<{
  * Translucent + blurred (suite-skin.css `.suite-app-bar`), safe-area aware,
  * 44px minimum touch targets. Desktop chrome (rail/top bar) stays app-side.
  */
-declare function SuiteMobileHeader({ onMenuClick, menuIcon: MenuIcon, title, actions, menuLabel, menuDataTest, dataTest, className, }: {
+declare function SuiteMobileHeader({ onMenuClick, menuIcon: MenuIcon, title, actions, menuLabel, menuId, menuDataTest, dataTest, className, }: {
     /** Optional — omit to drop the hamburger (bottom-nav apps don't need one). */
     onMenuClick?: () => void;
     /** Leading button glyph — defaults to Menu; browse-style drawers can swap it. */
@@ -286,6 +305,7 @@ declare function SuiteMobileHeader({ onMenuClick, menuIcon: MenuIcon, title, act
     /** Right-hand slot — search, bell, avatar (keep this order). */
     actions?: ReactNode;
     menuLabel?: string;
+    menuId?: string;
     menuDataTest?: string;
     dataTest?: string;
     className?: string;
@@ -319,22 +339,25 @@ interface SuiteUserMenuProps {
     onSignOut: () => void;
     /** Fallback letter(s) when there is no avatar image. */
     fallbackInitials?: string;
+    /** Show the old desktop sidebar sign-out action beside the avatar. */
+    showSignOutAction?: boolean;
     dataTest?: string;
+    triggerId?: string;
+    triggerDataTest?: string;
     className?: string;
 }
 /**
- * Suite account context menu — one tap on the avatar opens a small menu
- * with profile settings and sign out. Used in the mobile app bar of every
- * app so account actions behave identically across the suite (no dedicated
- * logout icon cluttering the mobile chrome).
+ * Suite account context menu — one tap on the avatar opens a small menu with
+ * profile settings and sign out. Desktop sidebars can also expose the legacy
+ * adjacent sign-out action without adding it to mobile chrome.
  */
-declare function SuiteUserMenu({ name, email, image, settingsHref, onSignOut, fallbackInitials, dataTest, className, }: SuiteUserMenuProps): react.JSX.Element;
+declare function SuiteUserMenu({ name, email, image, settingsHref, onSignOut, fallbackInitials, showSignOutAction, dataTest, triggerId, triggerDataTest, className, }: SuiteUserMenuProps): react.JSX.Element;
 
 /** Any icon component that accepts sizing/stroke props (Lucide, theme icons). */
 type SuiteNavIcon = ComponentType<{
     className?: string;
     strokeWidth?: number | string;
-    'aria-hidden'?: boolean | 'true' | 'false';
+    "aria-hidden"?: boolean | "true" | "false";
 }>;
 /**
  * Suite bottom navigation — the mobile/tablet primary nav, identical in
@@ -347,6 +370,7 @@ interface SuiteBottomNavItem {
     href: string;
     label: string;
     icon: SuiteNavIcon;
+    id?: string;
     active?: boolean;
     dataTest?: string;
 }
@@ -368,7 +392,7 @@ interface SuiteAppDefinition {
     slug: SuiteAppSlug;
     name: string;
     description: string;
-    /** Public asset path — every app hosts all four icons. */
+    /** Public asset path — every app hosts its suite icon. */
     icon: string;
     /** Landing route used after cross-app SSO redirect. */
     landing: string;
@@ -506,19 +530,20 @@ declare function SuiteAiPanel({ presets, emptyState, title, fetchChat, sendMessa
  * colour like any lucide icon.
  */
 type SuiteGlyphElement = {
-    kind: 'path';
+    kind: "path";
     d: string;
     accent?: boolean;
     filled?: boolean;
+    transform?: string;
 } | {
-    kind: 'circle';
+    kind: "circle";
     cx: number;
     cy: number;
     r: number;
     accent?: boolean;
     filled?: boolean;
 } | {
-    kind: 'rect';
+    kind: "rect";
     x: number;
     y: number;
     width: number;
@@ -537,7 +562,7 @@ interface SuiteGlyph {
      */
     animatedAccent?: boolean;
 }
-type SuiteIconName = 'timer-shell' | 'kanban-wave' | 'squid-doc' | 'stack-hex' | 'crew-bot' | 'workspace' | 'organisation' | 'integration-plug' | 'suite-grid' | 'bell-wave' | 'today-sun';
+type SuiteIconName = "timer-shell" | "kanban-wave" | "squid-doc" | "stack-hex" | "crew-bot" | "nakama-fist" | "workspace" | "organisation" | "integration-plug" | "suite-grid" | "bell-wave" | "today-sun";
 declare const SUITE_GLYPHS: Record<SuiteIconName, SuiteGlyph>;
 declare const SUITE_ICON_NAMES: SuiteIconName[];
 
@@ -547,7 +572,7 @@ declare const SUITE_ICON_NAMES: SuiteIconName[];
  * `onTileAccent` drive `<SuiteAppIcon>` (the programmatic favicon-style
  * tile + glyph mark).
  */
-type SuiteAccentSlug = 'turtletime' | 'tides' | 'kraken' | 'shellstack' | 'crew' | 'nakama';
+type SuiteAccentSlug = "turtletime" | "tides" | "kraken" | "shellstack" | "crew" | "nakama";
 interface SuiteAppAccent {
     /** Display name (default aria label for app marks). */
     label: string;
@@ -618,12 +643,13 @@ declare const SIDEBAR_DEFAULT_WIDTH = 320;
  * Shared suite sidebar resizing: drag below the threshold to collapse,
  * drag the rail edge out to expand, and double-click to reset.
  */
-declare function useSidebarWidth(storageKey: string): {
+declare function useSidebarWidth(storageKey: string, defaultWidth?: number): {
     width: number;
     collapsed: boolean;
     setCollapsed: (value: boolean) => void;
     resetWidth: () => void;
     startResize: (event: PointerEvent<HTMLDivElement>) => void;
+    resizeBy: (delta: number) => void;
 };
 
 declare function cn(...inputs: ClassValue[]): string;
@@ -785,6 +811,7 @@ interface SuiteSettingsNavItem {
     label: string;
     href: string;
     icon: ElementType | ReactNode;
+    id?: string;
     testId?: string;
 }
 interface SuiteSettingsMobileNavProps {
@@ -808,6 +835,8 @@ interface SuiteSidebarNavItem {
     href: string;
     label: string;
     icon: SuiteNavIcon;
+    id?: string;
+    dataTest?: string;
     active?: boolean;
     onClick?: () => void;
     badge?: ReactNode;
@@ -857,6 +886,8 @@ interface SuiteAppLayoutProps {
     lockMainScroll?: boolean;
     /** Drag this to resize the sidebar. */
     onStartResize?: (e: PointerEvent<HTMLDivElement>) => void;
+    /** Keyboard equivalent for the resize handle. */
+    onResizeBy?: (delta: number) => void;
     /** Double-click to reset sidebar width. */
     onResetWidth?: () => void;
     className?: string;
@@ -866,6 +897,6 @@ interface SuiteAppLayoutProps {
  * one `#main-content` landmark. Desktop: fixed sidebar + scrollable main.
  * Mobile: header + main + bottom nav.
  */
-declare function SuiteAppLayout({ sidebar, children, mobileHeader, bottomNav, sidebarWidth, collapsed, lockMainScroll, onStartResize, onResetWidth, className, }: SuiteAppLayoutProps): react.JSX.Element;
+declare function SuiteAppLayout({ sidebar, children, mobileHeader, bottomNav, sidebarWidth, collapsed, lockMainScroll, onStartResize, onResizeBy, onResetWidth, className, }: SuiteAppLayoutProps): react.JSX.Element;
 
 export { APP_ACCENTS, APP_GLYPHS, AnimatedMoon, AnimatedSun, AppSwitcher, AppSwitcherChevron, AppSwitcherMark, CommandPaletteHost, DeferredChrome, SIDEBAR_COLLAPSE_THRESHOLD, SIDEBAR_DEFAULT_WIDTH, SIDEBAR_MAX_WIDTH, SIDEBAR_MIN_EXPANDED_WIDTH, SIDEBAR_RAIL_WIDTH, SUITE_APPS, SUITE_APP_MAP, SUITE_GLYPHS, SUITE_ICON_NAMES, SUITE_OPEN_ASK_AI_EVENT, SUITE_SPRINGS, SourceAppGlyph, type SuiteAccentSlug, type SuiteAiChatMessage, SuiteAiPanel, type SuiteAiPreset, type SuiteAppAccent, type SuiteAppDefinition, type SuiteAppEntry, SuiteAppIcon, type SuiteAppIconProps, SuiteAppLayout, type SuiteAppLayoutProps, type SuiteAppSlug, SuiteAppStrip, type SuiteAskAiOpenDetail, SuiteBottomNav, type SuiteBottomNavItem, SuiteBreadcrumbs, type SuiteBreadcrumbsProps, type SuiteCommandItem, type SuiteCommandPaletteComponent, type SuiteDropdownItemComponent, type SuiteDropdownMenuComponent, type SuiteDropdownMenuProps, SuiteEmptyState, type SuiteGlyph, type SuiteGlyphElement, SuiteIcon, type SuiteIconName, type SuiteIconProps, SuiteMobileDrawer, SuiteMobileHeader, SuiteMotionProvider, type SuiteNotification, SuiteNotificationBell, type SuiteNotificationsResponse, SuitePage, SuitePageHeader, type SuitePageWidth, type SuiteResolvedTheme, SuiteSectionHeader, SuiteSettingsLayout, type SuiteSettingsLayoutProps, SuiteSettingsMobileNav, type SuiteSettingsNavItem, SuiteSidebar, type SuiteSidebarNavItem, SuiteSkeleton, SuiteSkeletonCard, SuiteSkeletonList, type SuiteSpinnerComponent, type SuiteSpringName, SuiteTabList, type SuiteTheme, type SuiteThemeConfig, type SuiteThemeContextValue, SuiteThemeProvider, SuiteToolbar, SuiteUserMenu, type SuiteUserMenuProps, TodayAskAiCard, TodayCalibrating, TodayEmptyAction, TodayEmptyState, TodayHero, TodayLayout, TodayPageFrame, TodayPanel, type TodayPrimaryAccent, TodayPrimaryAction, TodaySection, TodayTimeIcon, TodayTopBar, appSwitcherMarkClass, appSwitcherMenuItemClass, appSwitcherTriggerClass, cn, getTodayGreeting, openSuiteAskAi, resolveSuiteNotificationHref, sourceToSuiteApp, suiteAppBaseUrl, suiteAppLabel, useIdleMount, useSidebarWidth, useSuiteTheme };

package/dist/suite.d.ts

@@ -4,7 +4,7 @@ import { ClassValue } from 'clsx';
 export { m } from 'motion/react';
 
 /**
- * Today page content wrapper with soft atmosphere.
+ * Today page content wrapper with a soft themed visual treatment.
  * Does not own scrolling — `#main-content` is the scrollport so sticky headers work.
  * Glow/clouds are absolute and do not create a nested scrollport.
  */
@@ -130,10 +130,12 @@ declare function TodayEmptyState({ title, description, }: {
  */
 interface SuiteDropdownMenuProps {
     trigger: ReactNode;
+    triggerId?: string;
+    triggerDataTest?: string;
     children: ReactNode;
-    'aria-label': string;
-    align?: 'start' | 'center' | 'end';
-    side?: 'top' | 'right' | 'bottom' | 'left';
+    "aria-label": string;
+    align?: "start" | "center" | "end";
+    side?: "top" | "right" | "bottom" | "left";
     sideOffset?: number;
     className?: string;
     panelClassName?: string;
@@ -155,10 +157,14 @@ type SuiteCommandPaletteComponent = ComponentType<{
     onClose: () => void;
     placeholder?: string;
     className?: string;
+    id?: string;
+    dataTest?: string;
+    inputId?: string;
+    inputDataTest?: string;
 }>;
 /** App-branded spinner (each app has its own AppSpinner design). */
 type SuiteSpinnerComponent = ComponentType<{
-    size?: 'sm' | 'md' | 'lg';
+    size?: "sm" | "md" | "lg";
     className?: string;
     label?: string;
 }>;
@@ -186,7 +192,7 @@ interface SuiteAppEntry {
  * visible app list, the cross-app navigation handler, and the theme
  * dropdown primitives.
  */
-declare function AppSwitcher({ apps, currentApp, onSelect, mark, title, collapsed, dropdownMenu: DropdownMenu, dropdownItem: DropdownItem, }: {
+declare function AppSwitcher({ apps, currentApp, onSelect, mark, title, collapsed, dropdownMenu: DropdownMenu, dropdownItem: DropdownItem, triggerId, triggerDataTest, }: {
     apps: SuiteAppEntry[];
     currentApp: string;
     onSelect: (app: SuiteAppEntry) => void;
@@ -195,6 +201,8 @@ declare function AppSwitcher({ apps, currentApp, onSelect, mark, title, collapse
     collapsed?: boolean;
     dropdownMenu: SuiteDropdownMenuComponent;
     dropdownItem: SuiteDropdownItemComponent;
+    triggerId?: string;
+    triggerDataTest?: string;
 }): react.JSX.Element;
 
 /** Cross-app (suite) notification from `/api/notifications/` — shared across ShellStack apps. */
@@ -214,23 +222,30 @@ interface SuiteNotificationsResponse {
     notifications: SuiteNotification[];
     unread_count: number;
 }
-declare function SuiteNotificationBell({ fetchNotifications, markRead, markAllRead, dropdownMenu: DropdownMenu, cacheKey, }: {
+declare function SuiteNotificationBell({ fetchNotifications, markRead, markAllRead, dropdownMenu: DropdownMenu, cacheKey, dataTest, triggerId, triggerDataTest, }: {
     fetchNotifications: () => Promise<SuiteNotificationsResponse>;
     markRead: (id: string) => Promise<unknown>;
     markAllRead: () => Promise<unknown>;
     dropdownMenu: SuiteDropdownMenuComponent;
     /** sessionStorage key for stale-while-revalidate; `null` disables caching. */
     cacheKey?: string | null;
+    dataTest?: string;
+    triggerId?: string;
+    triggerDataTest?: string;
 }): react.JSX.Element;
 
 /**
  * Cmd/Ctrl+K command palette host. Apps build the item list and inject the
  * theme CommandPalette primitive.
  */
-declare function CommandPaletteHost({ items, isAuthenticated, placeholder, commandPalette: CommandPalette, }: {
+declare function CommandPaletteHost({ items, isAuthenticated, placeholder, id, dataTest, inputId, inputDataTest, commandPalette: CommandPalette, }: {
     items: SuiteCommandItem[];
     isAuthenticated?: boolean;
     placeholder?: string;
+    id?: string;
+    dataTest?: string;
+    inputId?: string;
+    inputDataTest?: string;
     commandPalette: SuiteCommandPaletteComponent;
 }): react.JSX.Element | null;
 
@@ -244,7 +259,7 @@ declare function DeferredChrome({ children }: {
  * close, body scroll-lock and focus hand-off while open. Nav content stays
  * app-side via `children`.
  */
-declare function SuiteMobileDrawer({ open, onClose, children, side, showCloseButton, title, closeLabel, backdropLabel, dialogLabel, durationMs, dataTest, panelDataTest, panelClassName, }: {
+declare function SuiteMobileDrawer({ open, onClose, children, side, showCloseButton, title, closeLabel, backdropLabel, dialogLabel, durationMs, dataTest, panelDataTest, backdropId, backdropDataTest, closeButtonId, closeButtonDataTest, panelClassName, }: {
     open: boolean;
     onClose: () => void;
     children: ReactNode;
@@ -262,13 +277,17 @@ declare function SuiteMobileDrawer({ open, onClose, children, side, showCloseBut
     durationMs?: number;
     dataTest?: string;
     panelDataTest?: string;
+    backdropId?: string;
+    backdropDataTest?: string;
+    closeButtonId?: string;
+    closeButtonDataTest?: string;
     /** Panel surface overrides (e.g. `bg-ph-canvas`). */
     panelClassName?: string;
 }): react.JSX.Element | null;
 
 type SuiteMenuIcon = ComponentType<{
     className?: string;
-    'aria-hidden'?: boolean | 'true' | 'false';
+    "aria-hidden"?: boolean | "true" | "false";
 }>;
 /**
  * Suite mobile app bar — the standardized top of every app on phone/tablet.
@@ -276,7 +295,7 @@ type SuiteMenuIcon = ComponentType<{
  * Translucent + blurred (suite-skin.css `.suite-app-bar`), safe-area aware,
  * 44px minimum touch targets. Desktop chrome (rail/top bar) stays app-side.
  */
-declare function SuiteMobileHeader({ onMenuClick, menuIcon: MenuIcon, title, actions, menuLabel, menuDataTest, dataTest, className, }: {
+declare function SuiteMobileHeader({ onMenuClick, menuIcon: MenuIcon, title, actions, menuLabel, menuId, menuDataTest, dataTest, className, }: {
     /** Optional — omit to drop the hamburger (bottom-nav apps don't need one). */
     onMenuClick?: () => void;
     /** Leading button glyph — defaults to Menu; browse-style drawers can swap it. */
@@ -286,6 +305,7 @@ declare function SuiteMobileHeader({ onMenuClick, menuIcon: MenuIcon, title, act
     /** Right-hand slot — search, bell, avatar (keep this order). */
     actions?: ReactNode;
     menuLabel?: string;
+    menuId?: string;
     menuDataTest?: string;
     dataTest?: string;
     className?: string;
@@ -319,22 +339,25 @@ interface SuiteUserMenuProps {
     onSignOut: () => void;
     /** Fallback letter(s) when there is no avatar image. */
     fallbackInitials?: string;
+    /** Show the old desktop sidebar sign-out action beside the avatar. */
+    showSignOutAction?: boolean;
     dataTest?: string;
+    triggerId?: string;
+    triggerDataTest?: string;
     className?: string;
 }
 /**
- * Suite account context menu — one tap on the avatar opens a small menu
- * with profile settings and sign out. Used in the mobile app bar of every
- * app so account actions behave identically across the suite (no dedicated
- * logout icon cluttering the mobile chrome).
+ * Suite account context menu — one tap on the avatar opens a small menu with
+ * profile settings and sign out. Desktop sidebars can also expose the legacy
+ * adjacent sign-out action without adding it to mobile chrome.
  */
-declare function SuiteUserMenu({ name, email, image, settingsHref, onSignOut, fallbackInitials, dataTest, className, }: SuiteUserMenuProps): react.JSX.Element;
+declare function SuiteUserMenu({ name, email, image, settingsHref, onSignOut, fallbackInitials, showSignOutAction, dataTest, triggerId, triggerDataTest, className, }: SuiteUserMenuProps): react.JSX.Element;
 
 /** Any icon component that accepts sizing/stroke props (Lucide, theme icons). */
 type SuiteNavIcon = ComponentType<{
     className?: string;
     strokeWidth?: number | string;
-    'aria-hidden'?: boolean | 'true' | 'false';
+    "aria-hidden"?: boolean | "true" | "false";
 }>;
 /**
  * Suite bottom navigation — the mobile/tablet primary nav, identical in
@@ -347,6 +370,7 @@ interface SuiteBottomNavItem {
     href: string;
     label: string;
     icon: SuiteNavIcon;
+    id?: string;
     active?: boolean;
     dataTest?: string;
 }
@@ -368,7 +392,7 @@ interface SuiteAppDefinition {
     slug: SuiteAppSlug;
     name: string;
     description: string;
-    /** Public asset path — every app hosts all four icons. */
+    /** Public asset path — every app hosts its suite icon. */
     icon: string;
     /** Landing route used after cross-app SSO redirect. */
     landing: string;
@@ -506,19 +530,20 @@ declare function SuiteAiPanel({ presets, emptyState, title, fetchChat, sendMessa
  * colour like any lucide icon.
  */
 type SuiteGlyphElement = {
-    kind: 'path';
+    kind: "path";
     d: string;
     accent?: boolean;
     filled?: boolean;
+    transform?: string;
 } | {
-    kind: 'circle';
+    kind: "circle";
     cx: number;
     cy: number;
     r: number;
     accent?: boolean;
     filled?: boolean;
 } | {
-    kind: 'rect';
+    kind: "rect";
     x: number;
     y: number;
     width: number;
@@ -537,7 +562,7 @@ interface SuiteGlyph {
      */
     animatedAccent?: boolean;
 }
-type SuiteIconName = 'timer-shell' | 'kanban-wave' | 'squid-doc' | 'stack-hex' | 'crew-bot' | 'workspace' | 'organisation' | 'integration-plug' | 'suite-grid' | 'bell-wave' | 'today-sun';
+type SuiteIconName = "timer-shell" | "kanban-wave" | "squid-doc" | "stack-hex" | "crew-bot" | "nakama-fist" | "workspace" | "organisation" | "integration-plug" | "suite-grid" | "bell-wave" | "today-sun";
 declare const SUITE_GLYPHS: Record<SuiteIconName, SuiteGlyph>;
 declare const SUITE_ICON_NAMES: SuiteIconName[];
 
@@ -547,7 +572,7 @@ declare const SUITE_ICON_NAMES: SuiteIconName[];
  * `onTileAccent` drive `<SuiteAppIcon>` (the programmatic favicon-style
  * tile + glyph mark).
  */
-type SuiteAccentSlug = 'turtletime' | 'tides' | 'kraken' | 'shellstack' | 'crew' | 'nakama';
+type SuiteAccentSlug = "turtletime" | "tides" | "kraken" | "shellstack" | "crew" | "nakama";
 interface SuiteAppAccent {
     /** Display name (default aria label for app marks). */
     label: string;
@@ -618,12 +643,13 @@ declare const SIDEBAR_DEFAULT_WIDTH = 320;
  * Shared suite sidebar resizing: drag below the threshold to collapse,
  * drag the rail edge out to expand, and double-click to reset.
  */
-declare function useSidebarWidth(storageKey: string): {
+declare function useSidebarWidth(storageKey: string, defaultWidth?: number): {
     width: number;
     collapsed: boolean;
     setCollapsed: (value: boolean) => void;
     resetWidth: () => void;
     startResize: (event: PointerEvent<HTMLDivElement>) => void;
+    resizeBy: (delta: number) => void;
 };
 
 declare function cn(...inputs: ClassValue[]): string;
@@ -785,6 +811,7 @@ interface SuiteSettingsNavItem {
     label: string;
     href: string;
     icon: ElementType | ReactNode;
+    id?: string;
     testId?: string;
 }
 interface SuiteSettingsMobileNavProps {
@@ -808,6 +835,8 @@ interface SuiteSidebarNavItem {
     href: string;
     label: string;
     icon: SuiteNavIcon;
+    id?: string;
+    dataTest?: string;
     active?: boolean;
     onClick?: () => void;
     badge?: ReactNode;
@@ -857,6 +886,8 @@ interface SuiteAppLayoutProps {
     lockMainScroll?: boolean;
     /** Drag this to resize the sidebar. */
     onStartResize?: (e: PointerEvent<HTMLDivElement>) => void;
+    /** Keyboard equivalent for the resize handle. */
+    onResizeBy?: (delta: number) => void;
     /** Double-click to reset sidebar width. */
     onResetWidth?: () => void;
     className?: string;
@@ -866,6 +897,6 @@ interface SuiteAppLayoutProps {
  * one `#main-content` landmark. Desktop: fixed sidebar + scrollable main.
  * Mobile: header + main + bottom nav.
  */
-declare function SuiteAppLayout({ sidebar, children, mobileHeader, bottomNav, sidebarWidth, collapsed, lockMainScroll, onStartResize, onResetWidth, className, }: SuiteAppLayoutProps): react.JSX.Element;
+declare function SuiteAppLayout({ sidebar, children, mobileHeader, bottomNav, sidebarWidth, collapsed, lockMainScroll, onStartResize, onResizeBy, onResetWidth, className, }: SuiteAppLayoutProps): react.JSX.Element;
 
 export { APP_ACCENTS, APP_GLYPHS, AnimatedMoon, AnimatedSun, AppSwitcher, AppSwitcherChevron, AppSwitcherMark, CommandPaletteHost, DeferredChrome, SIDEBAR_COLLAPSE_THRESHOLD, SIDEBAR_DEFAULT_WIDTH, SIDEBAR_MAX_WIDTH, SIDEBAR_MIN_EXPANDED_WIDTH, SIDEBAR_RAIL_WIDTH, SUITE_APPS, SUITE_APP_MAP, SUITE_GLYPHS, SUITE_ICON_NAMES, SUITE_OPEN_ASK_AI_EVENT, SUITE_SPRINGS, SourceAppGlyph, type SuiteAccentSlug, type SuiteAiChatMessage, SuiteAiPanel, type SuiteAiPreset, type SuiteAppAccent, type SuiteAppDefinition, type SuiteAppEntry, SuiteAppIcon, type SuiteAppIconProps, SuiteAppLayout, type SuiteAppLayoutProps, type SuiteAppSlug, SuiteAppStrip, type SuiteAskAiOpenDetail, SuiteBottomNav, type SuiteBottomNavItem, SuiteBreadcrumbs, type SuiteBreadcrumbsProps, type SuiteCommandItem, type SuiteCommandPaletteComponent, type SuiteDropdownItemComponent, type SuiteDropdownMenuComponent, type SuiteDropdownMenuProps, SuiteEmptyState, type SuiteGlyph, type SuiteGlyphElement, SuiteIcon, type SuiteIconName, type SuiteIconProps, SuiteMobileDrawer, SuiteMobileHeader, SuiteMotionProvider, type SuiteNotification, SuiteNotificationBell, type SuiteNotificationsResponse, SuitePage, SuitePageHeader, type SuitePageWidth, type SuiteResolvedTheme, SuiteSectionHeader, SuiteSettingsLayout, type SuiteSettingsLayoutProps, SuiteSettingsMobileNav, type SuiteSettingsNavItem, SuiteSidebar, type SuiteSidebarNavItem, SuiteSkeleton, SuiteSkeletonCard, SuiteSkeletonList, type SuiteSpinnerComponent, type SuiteSpringName, SuiteTabList, type SuiteTheme, type SuiteThemeConfig, type SuiteThemeContextValue, SuiteThemeProvider, SuiteToolbar, SuiteUserMenu, type SuiteUserMenuProps, TodayAskAiCard, TodayCalibrating, TodayEmptyAction, TodayEmptyState, TodayHero, TodayLayout, TodayPageFrame, TodayPanel, type TodayPrimaryAccent, TodayPrimaryAction, TodaySection, TodayTimeIcon, TodayTopBar, appSwitcherMarkClass, appSwitcherMenuItemClass, appSwitcherTriggerClass, cn, getTodayGreeting, openSuiteAskAi, resolveSuiteNotificationHref, sourceToSuiteApp, suiteAppBaseUrl, suiteAppLabel, useIdleMount, useSidebarWidth, useSuiteTheme };