@xenide-io/the-old-ui-theme 0.4.0 → 0.4.3

package/dist/suite.js

@@ -22,6 +22,18 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -99,7 +111,7 @@ __export(suite_exports, {
   appSwitcherTriggerClass: () => appSwitcherTriggerClass,
   cn: () => cn,
   getTodayGreeting: () => getTodayGreeting,
-  m: () => import_react9.m,
+  m: () => import_react8.m,
   sourceToSuiteApp: () => sourceToSuiteApp,
   suiteAppBaseUrl: () => suiteAppBaseUrl,
   suiteAppLabel: () => suiteAppLabel,
@@ -860,12 +872,12 @@ function AppSwitcher({
   mark,
   title,
   collapsed = false,
-  dropdownMenu: DropdownMenu,
-  dropdownItem: DropdownItem
+  dropdownMenu: DropdownMenu2,
+  dropdownItem: DropdownItem2
 }) {
   const [open, setOpen] = (0, import_react.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    DropdownMenu,
+    DropdownMenu2,
     {
       "aria-label": "Switch application",
       className: collapsed ? "w-11 shrink-0" : "min-w-0 flex-1",
@@ -892,7 +904,7 @@ function AppSwitcher({
       children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "p-1", "data-test": "app-switcher-menu", children: [
         /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "px-3 py-2 text-[10px] font-semibold uppercase tracking-[0.14em] text-ph-mutedtext", children: "Switch application" }),
         apps.map((app) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-          DropdownItem,
+          DropdownItem2,
           {
             "data-test": `switch-app-${app.slug}`,
             onMouseDown: (e) => e.preventDefault(),
@@ -953,7 +965,7 @@ function SuiteNotificationBell({
   fetchNotifications,
   markRead,
   markAllRead,
-  dropdownMenu: DropdownMenu,
+  dropdownMenu: DropdownMenu2,
   cacheKey = "suite-notifications-cache"
 }) {
   const router = (0, import_navigation.useRouter)();
@@ -1048,7 +1060,7 @@ function SuiteNotificationBell({
     }
   }, [markAllRead]);
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-    DropdownMenu,
+    DropdownMenu2,
     {
       "aria-label": "Notifications",
       align: "end",
@@ -1333,10 +1345,125 @@ function SuiteMobileHeader({
 
 // src/suite/components/suite-user-menu.tsx
 var import_image2 = __toESM(require("next/image"));
-var import_link = __toESM(require("next/link"));
-var import_react6 = require("react");
+var import_navigation2 = require("next/navigation");
 var import_iconoir_react6 = require("iconoir-react");
+
+// src/components/ui/DropdownMenu.tsx
+var DropdownPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
+
+// src/lib/cn.ts
+function cn2(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+
+// src/components/ui/DropdownMenu.tsx
 var import_jsx_runtime12 = require("react/jsx-runtime");
+function DropdownContent({
+  children,
+  align = "start",
+  side = "bottom",
+  sideOffset = 7,
+  alignOffset = 0,
+  collisionPadding = 8,
+  avoidCollisions = true,
+  panelClassName
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+    DropdownPrimitive.Content,
+    {
+      className: cn2("ph-dropdown-panel", panelClassName),
+      align,
+      side,
+      sideOffset,
+      alignOffset,
+      collisionPadding,
+      avoidCollisions,
+      sticky: "partial",
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Arrow, { className: "ph-dropdown-arrow", width: 12, height: 6 })
+      ]
+    }
+  ) });
+}
+function DropdownMenu(_a) {
+  var _b = _a, {
+    trigger,
+    children,
+    align,
+    side,
+    sideOffset,
+    alignOffset,
+    collisionPadding,
+    avoidCollisions,
+    className,
+    panelClassName,
+    "aria-label": ariaLabel,
+    open,
+    defaultOpen,
+    onOpenChange,
+    modal = false,
+    disabled
+  } = _b, props = __objRest(_b, [
+    "trigger",
+    "children",
+    "align",
+    "side",
+    "sideOffset",
+    "alignOffset",
+    "collisionPadding",
+    "avoidCollisions",
+    "className",
+    "panelClassName",
+    "aria-label",
+    "open",
+    "defaultOpen",
+    "onOpenChange",
+    "modal",
+    "disabled"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", __spreadProps(__spreadValues({ className: cn2("ph-dropdown", className) }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+    DropdownPrimitive.Root,
+    {
+      open,
+      defaultOpen,
+      onOpenChange,
+      modal,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Trigger, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { type: "button", className: "ph-dropdown-trigger", "aria-label": ariaLabel, children: trigger }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          DropdownContent,
+          {
+            align,
+            side,
+            sideOffset,
+            alignOffset,
+            collisionPadding,
+            avoidCollisions,
+            panelClassName,
+            children
+          }
+        )
+      ]
+    }
+  ) }));
+}
+function DropdownItem(_a) {
+  var _b = _a, { className, children, disabled } = _b, props = __objRest(_b, ["className", "children", "disabled"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Item, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    "button",
+    __spreadProps(__spreadValues({
+      type: "button",
+      disabled,
+      className: cn2("ph-dropdown-item w-full text-left", className)
+    }, props), {
+      children
+    })
+  ) });
+}
+
+// src/suite/components/suite-user-menu.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
 function computeInitials(name, email) {
   const source = (name || email || "?").trim();
   return source.split(/[\s@]+/).filter(Boolean).slice(0, 2).map((part) => part[0]).join("").toUpperCase();
@@ -1351,94 +1478,67 @@ function SuiteUserMenu({
   dataTest = "suite-user-menu",
   className
 }) {
-  const [open, setOpen] = (0, import_react6.useState)(false);
+  const router = (0, import_navigation2.useRouter)();
   const initials = fallbackInitials != null ? fallbackInitials : computeInitials(name, email);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: cn("relative", className), "data-test": dataTest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-      "button",
-      {
-        type: "button",
-        "aria-label": "Account menu",
-        "aria-expanded": open,
-        "aria-haspopup": "menu",
-        title: "Account",
-        onClick: () => setOpen((value) => !value),
-        className: "suite-press inline-flex h-11 w-11 items-center justify-center rounded-full transition-colors hover:bg-ph-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
-        children: image ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-          import_image2.default,
+  const avatar = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "inline-flex h-11 w-11 items-center justify-center rounded-full transition-colors hover:bg-ph-muted", children: image ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    import_image2.default,
+    {
+      src: image,
+      alt: "",
+      width: 32,
+      height: 32,
+      className: "h-8 w-8 rounded-full object-cover",
+      unoptimized: true
+    }
+  ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-ph-muted text-sm font-semibold text-ph-brand", children: initials }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    DropdownMenu,
+    {
+      trigger: avatar,
+      "aria-label": "Account menu",
+      align: "end",
+      side: "bottom",
+      sideOffset: 6,
+      collisionPadding: 16,
+      modal: false,
+      className,
+      "data-test": dataTest,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "px-2 py-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "truncate text-sm font-medium text-ph-ink", children: name || email || "Account" }),
+          email ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "truncate text-xs text-ph-mutedtext", children: email }) : null
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "my-1 border-t border-ph-border" }),
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+          DropdownItem,
           {
-            src: image,
-            alt: "",
-            width: 32,
-            height: 32,
-            className: "h-8 w-8 rounded-full object-cover",
-            unoptimized: true
+            "data-test": `${dataTest}-settings`,
+            onClick: () => router.push(settingsHref),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_iconoir_react6.Settings, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
+              "Profile settings"
+            ]
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-ph-muted text-sm font-semibold text-ph-brand", children: initials })
-      }
-    ),
-    open ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-        "button",
-        {
-          type: "button",
-          "aria-label": "Close account menu",
-          className: "fixed inset-0 z-40 cursor-default",
-          onClick: () => setOpen(false)
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-        "div",
-        {
-          role: "menu",
-          className: "absolute right-0 top-full z-50 mt-1 w-56 rounded-xl border border-ph-border bg-ph-surface p-1 shadow-xl",
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "px-2 py-1.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "truncate text-sm font-medium text-ph-ink", children: name || email || "Account" }),
-              email ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "truncate text-xs text-ph-mutedtext", children: email }) : null
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "my-1 border-t border-ph-border" }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-              import_link.default,
-              {
-                role: "menuitem",
-                href: settingsHref,
-                "data-test": `${dataTest}-settings`,
-                className: "flex min-h-11 items-center gap-2 rounded-lg px-2 text-sm text-ph-ink transition-colors hover:bg-ph-muted",
-                onClick: () => setOpen(false),
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_iconoir_react6.Settings, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
-                  "Profile settings"
-                ]
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-              "button",
-              {
-                role: "menuitem",
-                type: "button",
-                "data-test": `${dataTest}-sign-out`,
-                className: "flex min-h-11 w-full items-center gap-2 rounded-lg px-2 text-left text-sm text-ph-ink transition-colors hover:bg-ph-muted",
-                onClick: () => {
-                  setOpen(false);
-                  onSignOut();
-                },
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_iconoir_react6.LogOut, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
-                  "Sign out"
-                ]
-              }
-            )
-          ]
-        }
-      )
-    ] }) : null
-  ] });
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+          DropdownItem,
+          {
+            "data-test": `${dataTest}-sign-out`,
+            onClick: onSignOut,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_iconoir_react6.LogOut, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
+              "Sign out"
+            ]
+          }
+        )
+      ]
+    }
+  );
 }
 
 // src/suite/components/suite-bottom-nav.tsx
-var import_link2 = __toESM(require("next/link"));
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_link = __toESM(require("next/link"));
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function SuiteBottomNav({
   items,
   ariaLabel = "Primary navigation",
@@ -1451,8 +1551,8 @@ function SuiteBottomNav({
     );
   }
   const activeIndex = items.findIndex((item) => item.active);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "div",
       {
         "aria-hidden": true,
@@ -1460,7 +1560,7 @@ function SuiteBottomNav({
         style: { height: "calc(60px + env(safe-area-inset-bottom))" }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
       "nav",
       {
         "aria-label": ariaLabel,
@@ -1475,13 +1575,13 @@ function SuiteBottomNav({
           "--suite-nav-active": activeIndex >= 0 ? activeIndex : 0
         },
         children: [
-          activeIndex >= 0 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { "aria-hidden": true, className: "suite-bottom-nav__indicator" }) : null,
+          activeIndex >= 0 ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { "aria-hidden": true, className: "suite-bottom-nav__indicator" }) : null,
           items.map((item) => {
             var _a;
             const Icon = item.icon;
             const active = Boolean(item.active);
-            return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
-              import_link2.default,
+            return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+              import_link.default,
               {
                 href: item.href,
                 "data-test": (_a = item.dataTest) != null ? _a : `suite-nav-${item.label.toLowerCase().replace(/\s+/g, "-")}`,
@@ -1491,14 +1591,14 @@ function SuiteBottomNav({
                   active && "font-semibold text-ph-brand"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                     "span",
                     {
                       className: cn(
                         "suite-bottom-nav__icon relative z-10 inline-flex items-center justify-center",
                         active && "suite-bottom-nav__icon--active"
                       ),
-                      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                         Icon,
                         {
                           className: "h-6 w-6",
@@ -1508,7 +1608,7 @@ function SuiteBottomNav({
                       )
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "relative z-10 max-w-full truncate", children: item.label })
+                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "relative z-10 max-w-full truncate", children: item.label })
                 ]
               },
               item.href
@@ -1526,7 +1626,7 @@ var SUITE_APPS2 = [
     slug: "shellstack",
     name: "ShellStack",
     description: "Organisation and billing",
-    icon: "/logo-shellstack-static.svg",
+    icon: "/icon-shellstack.svg",
     landing: "/home",
     baseUrlEnv: "NEXT_PUBLIC_SHELLSTACK_URL",
     baseUrlFallback: "http://localhost:3002"
@@ -1568,7 +1668,7 @@ function suiteAppBaseUrl(slug) {
 
 // src/suite/components/today-calibrating.tsx
 var import_iconoir_react7 = require("iconoir-react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function TodayCalibrating({
   onRetry,
   retrying = false,
@@ -1577,7 +1677,7 @@ function TodayCalibrating({
   variant = "ring",
   retrySpinnerClassName = "text-ph-brand"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "div",
     {
       className: cn(
@@ -1586,16 +1686,16 @@ function TodayCalibrating({
       ),
       "data-test": "today-calibrating",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "div",
           {
             className: "pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_50%_35%,rgba(251,191,36,0.12),transparent_55%)]",
             "aria-hidden": true
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "relative mb-6 flex h-24 w-24 items-center justify-center", children: [
-          variant === "ring" ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "relative mb-6 flex h-24 w-24 items-center justify-center", children: [
+          variant === "ring" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               Spinner,
               {
                 size: "lg",
@@ -1603,7 +1703,7 @@ function TodayCalibrating({
                 label: "Loading today"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               "span",
               {
                 className: "bg-ph-muted/30 absolute inset-2 animate-ping rounded-full",
@@ -1611,7 +1711,7 @@ function TodayCalibrating({
               }
             )
           ] }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "relative flex h-14 w-14 items-center justify-center rounded-2xl border border-ph-border bg-ph-surface text-ph-ink shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "relative flex h-14 w-14 items-center justify-center rounded-2xl border border-ph-border bg-ph-surface text-ph-ink shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             import_iconoir_react7.SunLight,
             {
               className: cn("h-9 w-9", variant === "pulse" && "animate-pulse"),
@@ -1620,9 +1720,9 @@ function TodayCalibrating({
             }
           ) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("h2", { className: "relative text-base font-semibold tracking-tight text-ph-ink sm:text-lg md:text-xl", children: "Calibrating your day" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "relative mt-1.5 max-w-sm text-sm sm:text-[15px] leading-relaxed text-ph-subtle", children: "Pulling together tasks, time and updates from your workspace\u2026" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "relative mt-5 flex gap-1.5", "aria-hidden": true, children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("h2", { className: "relative text-base font-semibold tracking-tight text-ph-ink sm:text-lg md:text-xl", children: "Calibrating your day" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "relative mt-1.5 max-w-sm text-sm sm:text-[15px] leading-relaxed text-ph-subtle", children: "Pulling together tasks, time and updates from your workspace\u2026" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "relative mt-5 flex gap-1.5", "aria-hidden": true, children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "span",
           {
             className: "h-1.5 w-5 animate-pulse rounded-full bg-ph-muted",
@@ -1630,7 +1730,7 @@ function TodayCalibrating({
           },
           i
         )) }),
-        onRetry ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+        onRetry ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
           "button",
           {
             type: "button",
@@ -1638,7 +1738,7 @@ function TodayCalibrating({
             disabled: retrying,
             className: "relative mt-6 inline-flex items-center gap-2 rounded-xl border border-ph-border bg-ph-canvas px-4 py-2 text-sm font-medium text-ph-ink transition hover:bg-ph-muted disabled:opacity-60",
             children: [
-              retrying ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Spinner, { size: "sm", className: retrySpinnerClassName }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_iconoir_react7.Refresh, { className: "h-4 w-4", "aria-hidden": true }),
+              retrying ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Spinner, { size: "sm", className: retrySpinnerClassName }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_iconoir_react7.Refresh, { className: "h-4 w-4", "aria-hidden": true }),
               "Try again"
             ]
           }
@@ -1649,9 +1749,9 @@ function TodayCalibrating({
 }
 
 // src/suite/components/theme-provider.tsx
-var import_react7 = require("react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var SuiteThemeContext = (0, import_react7.createContext)(null);
+var import_react6 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var SuiteThemeContext = (0, import_react6.createContext)(null);
 function systemTheme(fallback) {
   if (typeof window === "undefined") return fallback;
   return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
@@ -1688,7 +1788,7 @@ function SuiteThemeProvider({
   config,
   children
 }) {
-  const [state, setState] = (0, import_react7.useState)(() => {
+  const [state, setState] = (0, import_react6.useState)(() => {
     const theme2 = readStoredTheme(config.storageKey);
     if (typeof document === "undefined") {
       return { theme: theme2, resolvedTheme: config.fallbackTheme };
@@ -1698,7 +1798,7 @@ function SuiteThemeProvider({
     return { theme: theme2, resolvedTheme: resolvedTheme2 };
   });
   const { theme, resolvedTheme } = state;
-  (0, import_react7.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (theme !== "system") return;
     const media = window.matchMedia("(prefers-color-scheme: dark)");
     const update = () => {
@@ -1708,7 +1808,7 @@ function SuiteThemeProvider({
     media.addEventListener("change", update);
     return () => media.removeEventListener("change", update);
   }, [theme, config]);
-  const setTheme = (0, import_react7.useCallback)(
+  const setTheme = (0, import_react6.useCallback)(
     (next) => {
       const resolved = applyTheme(next, config);
       setState({ theme: next, resolvedTheme: resolved });
@@ -1716,7 +1816,7 @@ function SuiteThemeProvider({
     },
     [config]
   );
-  const toggleTheme = (0, import_react7.useCallback)(() => {
+  const toggleTheme = (0, import_react6.useCallback)(() => {
     setState((prev) => {
       const next = resolveTheme(prev.theme, config.fallbackTheme) === "dark" ? "light" : "dark";
       const resolved = applyTheme(next, config);
@@ -1724,22 +1824,22 @@ function SuiteThemeProvider({
       return { theme: next, resolvedTheme: resolved };
     });
   }, [config]);
-  const value = (0, import_react7.useMemo)(
+  const value = (0, import_react6.useMemo)(
     () => ({ theme, resolvedTheme, setTheme, toggleTheme }),
     [theme, resolvedTheme, setTheme, toggleTheme]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SuiteThemeContext.Provider, { value, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SuiteThemeContext.Provider, { value, children });
 }
 function useSuiteTheme() {
-  const ctx = (0, import_react7.useContext)(SuiteThemeContext);
+  const ctx = (0, import_react6.useContext)(SuiteThemeContext);
   if (!ctx) throw new Error("useTheme must be used within ThemeProvider");
   return ctx;
 }
 
 // src/suite/components/ai-panel.tsx
-var import_react8 = require("react");
+var import_react7 = require("react");
 var import_iconoir_react8 = require("iconoir-react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function SuiteAiPanel({
   presets,
   emptyState,
@@ -1748,12 +1848,12 @@ function SuiteAiPanel({
   brandIcon: BrandIcon,
   spinner: Spinner
 }) {
-  const [open, setOpen] = (0, import_react8.useState)(false);
-  const [prompt, setPrompt] = (0, import_react8.useState)("");
-  const [loading, setLoading] = (0, import_react8.useState)(false);
-  const [answer, setAnswer] = (0, import_react8.useState)("");
-  const [error, setError] = (0, import_react8.useState)("");
-  const [copied, setCopied] = (0, import_react8.useState)(false);
+  const [open, setOpen] = (0, import_react7.useState)(false);
+  const [prompt, setPrompt] = (0, import_react7.useState)("");
+  const [loading, setLoading] = (0, import_react7.useState)(false);
+  const [answer, setAnswer] = (0, import_react7.useState)("");
+  const [error, setError] = (0, import_react7.useState)("");
+  const [copied, setCopied] = (0, import_react7.useState)(false);
   async function ask(text) {
     const trimmed = text.trim();
     if (!trimmed || loading) return;
@@ -1786,8 +1886,8 @@ function SuiteAiPanel({
     } catch (e) {
     }
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
       "button",
       {
         type: "button",
@@ -1796,13 +1896,13 @@ function SuiteAiPanel({
         className: "fixed bottom-5 right-5 z-30 flex items-center gap-2 rounded-full border border-ph-border bg-ph-surface px-4 py-2.5 text-sm font-medium text-ph-ink shadow-ph hover:bg-ph-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
         "aria-label": "Open ShellStack AI",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(BrandIcon, { className: "h-4 w-4 text-ph-brand" }),
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(BrandIcon, { className: "h-4 w-4 text-ph-brand" }),
           "Ask AI"
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "fixed inset-0 z-40", role: "dialog", "aria-modal": "true", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "fixed inset-0 z-40", role: "dialog", "aria-modal": "true", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "button",
         {
           type: "button",
@@ -1811,24 +1911,24 @@ function SuiteAiPanel({
           "aria-label": "Close AI panel"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("aside", { className: "absolute inset-y-0 right-0 flex w-full max-w-md flex-col border-l border-ph-border bg-ph-surface shadow-2xl", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center justify-between border-b border-ph-border px-4 py-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(BrandIcon, { className: "h-4 w-4 text-ph-brand" }),
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-sm font-semibold text-ph-ink", children: "ShellStack AI" })
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("aside", { className: "absolute inset-y-0 right-0 flex w-full max-w-md flex-col border-l border-ph-border bg-ph-surface shadow-2xl", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between border-b border-ph-border px-4 py-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(BrandIcon, { className: "h-4 w-4 text-ph-brand" }),
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm font-semibold text-ph-ink", children: "ShellStack AI" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
             "button",
             {
               type: "button",
               onClick: () => setOpen(false),
               className: "rounded p-1 hover:bg-ph-muted",
               "aria-label": "Close",
-              children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_iconoir_react8.Xmark, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react8.Xmark, { className: "h-4 w-4" })
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-wrap gap-1.5 border-b border-ph-border px-4 py-2", children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex flex-wrap gap-1.5 border-b border-ph-border px-4 py-2", children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           "button",
           {
             type: "button",
@@ -1842,31 +1942,31 @@ function SuiteAiPanel({
           },
           preset.label
         )) }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
-          error && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "bg-ph-danger/10 rounded-lg px-3 py-2 text-sm text-ph-danger", children: error }),
-          loading && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
+          error && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "bg-ph-danger/10 rounded-lg px-3 py-2 text-sm text-ph-danger", children: error }),
+          loading && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
             "Thinking\u2026"
           ] }),
-          answer && !loading && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "rounded-lg bg-ph-muted px-3 py-2 text-sm text-ph-ink", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "whitespace-pre-wrap", children: answer }),
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+          answer && !loading && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "rounded-lg bg-ph-muted px-3 py-2 text-sm text-ph-ink", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "whitespace-pre-wrap", children: answer }),
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
               "button",
               {
                 type: "button",
                 onClick: () => void copyAnswer(),
                 className: "mt-2 inline-flex items-center gap-1 text-xs text-ph-mutedtext hover:text-ph-ink",
                 children: [
-                  copied ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_iconoir_react8.Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_iconoir_react8.Copy, { className: "h-3 w-3" }),
+                  copied ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react8.Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react8.Copy, { className: "h-3 w-3" }),
                   copied ? "Copied" : "Copy"
                 ]
               }
             )
           ] }),
-          !answer && !loading && !error && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "mt-8 text-center text-xs text-ph-mutedtext", children: emptyState })
+          !answer && !loading && !error && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "mt-8 text-center text-xs text-ph-mutedtext", children: emptyState })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "border-t border-ph-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "border-t border-ph-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
             "textarea",
             {
               value: prompt,
@@ -1883,7 +1983,7 @@ function SuiteAiPanel({
               className: "flex-1 resize-none rounded-lg border border-ph-border bg-ph-canvas p-2 text-sm text-ph-ink outline-none focus:ring-1 focus:ring-ph-brand"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
             "button",
             {
               type: "button",
@@ -1900,10 +2000,10 @@ function SuiteAiPanel({
 }
 
 // src/suite/lib/motion.tsx
-var import_react9 = require("motion/react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_react8 = require("motion/react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function SuiteMotionProvider({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react9.LazyMotion, { features: import_react9.domAnimation, strict: true, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react8.LazyMotion, { features: import_react8.domAnimation, strict: true, children });
 }
 var SUITE_SPRINGS = {
   /** Snappy panel/sheet entrances — small overshoot. */
@@ -1915,7 +2015,7 @@ var SUITE_SPRINGS = {
 };
 
 // src/suite/components/suite-layout.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var WIDTHS = {
   full: "max-w-none",
   wide: "max-w-7xl",
@@ -1923,18 +2023,18 @@ var WIDTHS = {
   narrow: "max-w-4xl"
 };
 function SuiteBreadcrumbs({ items, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("nav", { "aria-label": "Breadcrumb", className, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("ol", { className: "flex min-w-0 items-center gap-1.5", children: items.map((item, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("nav", { "aria-label": "Breadcrumb", className, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("ol", { className: "flex min-w-0 items-center gap-1.5", children: items.map((item, index) => {
     const isLast = index === items.length - 1;
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("li", { className: "flex min-w-0 items-center gap-1.5", children: [
-      index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "select-none text-ph-border", "aria-hidden": "true", children: "/" }) : null,
-      item.href && !isLast ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("li", { className: "flex min-w-0 items-center gap-1.5", children: [
+      index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "select-none text-ph-border", "aria-hidden": "true", children: "/" }) : null,
+      item.href && !isLast ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         "a",
         {
           href: item.href,
           className: "truncate transition hover:text-ph-ink",
           children: item.label
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      ) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         "span",
         {
           className: cn(
@@ -1959,7 +2059,7 @@ function SuitePage({
   role,
   "aria-live": ariaLive
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     Component,
     {
       id,
@@ -1969,9 +2069,8 @@ function SuitePage({
       className: cn(
         "mx-auto flex w-full min-w-0 flex-col",
         WIDTHS[width],
-        // Same inset as TodayPageFrame so every page title sits at the
-        // same baseline regardless of app.
-        inset && "px-4 pb-10 pt-5 sm:px-6 sm:pt-6 lg:px-8",
+        // Tight inset keeps page titles aligned without excessive whitespace.
+        inset && "px-4 pb-6 pt-4 sm:px-6 sm:pb-7 sm:pt-5 lg:px-8",
         className
       ),
       children
@@ -1996,7 +2095,7 @@ function SuitePageHeader({
   /** Breadcrumb line rendered above the title. */
   breadcrumb
 }) {
-  const resolvedIcon = todayIcon ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  const resolvedIcon = todayIcon ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     TodayTimeIcon,
     {
       className: cn(
@@ -2005,17 +2104,17 @@ function SuitePageHeader({
       )
     }
   ) : icon;
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "header",
     {
       "data-test": dataTest,
       className: cn(
-        "flex items-start justify-between gap-4 pb-6 sm:pb-7",
+        "flex items-start justify-between gap-4 pb-4 sm:pb-5",
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex min-w-0 items-start gap-3", children: [
-          resolvedIcon ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex min-w-0 items-start gap-3", children: [
+          resolvedIcon ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             "div",
             {
               className: "hidden shrink-0 pt-1 sm:block",
@@ -2023,11 +2122,11 @@ function SuitePageHeader({
               children: resolvedIcon
             }
           ) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex min-w-0 flex-col gap-1", children: [
-            eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: eyebrow }) : null,
-            breadcrumb ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: breadcrumb }) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex min-w-0 flex-col gap-1", children: [
+            eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: eyebrow }) : null,
+            breadcrumb ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: breadcrumb }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                 "h1",
                 {
                   className: cn(
@@ -2037,12 +2136,12 @@ function SuitePageHeader({
                   children: title
                 }
               ),
-              badge ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "rounded-md bg-ph-muted px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-ph-subtle", children: badge }) : null
+              badge ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "rounded-md bg-ph-muted px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-ph-subtle", children: badge }) : null
             ] }),
-            description ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
+            description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
           ] })
         ] }),
-        actions ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex shrink-0 items-center gap-2 pt-1", children: actions }) : null
+        actions ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex shrink-0 items-center gap-2 pt-1", children: actions }) : null
       ]
     }
   );
@@ -2053,7 +2152,7 @@ function SuiteToolbar({
   label = "Page tools",
   dataTest
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "div",
     {
       role: "toolbar",
@@ -2070,7 +2169,7 @@ function SuiteTabList({
   label,
   dataTest
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "nav",
     {
       "aria-label": label,
@@ -2089,7 +2188,7 @@ function SuiteSectionHeader({
   action,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "div",
     {
       className: cn(
@@ -2097,35 +2196,35 @@ function SuiteSectionHeader({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h2", { className: "font-display text-balance text-lg font-semibold tracking-tight text-ph-ink sm:text-xl", children: title }),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("h2", { className: "font-display text-balance text-lg font-semibold tracking-tight text-ph-ink sm:text-xl", children: title }),
+          description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
         ] }),
-        action ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex min-h-[44px] shrink-0 items-center", children: action }) : null
+        action ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex min-h-[44px] shrink-0 items-center", children: action }) : null
       ]
     }
   );
 }
 
 // src/suite/components/suite-skeleton.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function SuiteSkeleton({
   className,
   lines = 1,
   circle,
   width
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     {
       className: cn("space-y-2", circle ? "flex flex-col items-center" : ""),
       "aria-hidden": true,
-      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "div",
         {
           className: "animate-[skeleton-stagger_0.6s_ease-out_both]",
           style: { animationDelay: `${index * 80}ms` },
-          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
             "div",
             {
               className: cn(
@@ -2149,7 +2248,7 @@ function SuiteSkeletonCard({
   rows = 3,
   header = true
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "div",
     {
       className: cn(
@@ -2158,26 +2257,26 @@ function SuiteSkeletonCard({
       ),
       "aria-hidden": true,
       children: [
-        header ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+        header ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
           "div",
           {
             className: "mb-5 flex items-center gap-3 animate-[skeleton-stagger_0.5s_ease-out_both]",
             style: { animationDelay: "100ms" },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-xl" }),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 space-y-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "ph-skeleton h-4 w-1/3" }),
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-xl" }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 space-y-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-4 w-1/3" }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
               ] })
             ]
           }
         ) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "space-y-3", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "space-y-3", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "div",
           {
             className: "animate-[skeleton-stagger_0.5s_ease-out_both]",
             style: { animationDelay: `${200 + index * 80}ms` },
-            children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
               "div",
               {
                 className: "ph-skeleton h-3",
@@ -2195,16 +2294,16 @@ function SuiteSkeletonList({
   className,
   items = 4
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: cn("space-y-3", className), "aria-hidden": true, children: Array.from({ length: items }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("space-y-3", className), "aria-hidden": true, children: Array.from({ length: items }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     {
       className: "animate-[skeleton-stagger_0.6s_ease-out_both]",
       style: { animationDelay: `${index * 100}ms` },
-      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-3 rounded-xl border border-ph-border/60 bg-ph-surface p-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-lg" }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "min-w-0 flex-1 space-y-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "ph-skeleton h-3.5 w-3/4" }),
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-3 rounded-xl border border-ph-border/60 bg-ph-surface p-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-lg" }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "min-w-0 flex-1 space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-3.5 w-3/4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
         ] })
       ] })
     },
@@ -2219,7 +2318,7 @@ function SuiteEmptyState({
   className,
   size = "md"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "div",
     {
       className: cn(
@@ -2228,13 +2327,13 @@ function SuiteEmptyState({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "pointer-events-none absolute inset-0 overflow-hidden opacity-60", "aria-hidden": true, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-ph-brand/10 blur-3xl" }),
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-ph-accent/10 blur-3xl" })
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "pointer-events-none absolute inset-0 overflow-hidden opacity-60", "aria-hidden": true, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-ph-brand/10 blur-3xl" }),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-ph-accent/10 blur-3xl" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "relative", children: [
-          icon ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mx-auto mb-4 inline-flex items-center justify-center rounded-2xl bg-ph-muted p-3 shadow-sm ring-1 ring-black/[0.06]", children: icon }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "relative", children: [
+          icon ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "mx-auto mb-4 inline-flex items-center justify-center rounded-2xl bg-ph-muted p-3 shadow-sm ring-1 ring-black/[0.06]", children: icon }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
             "h3",
             {
               className: cn(
@@ -2244,8 +2343,8 @@ function SuiteEmptyState({
               children: title
             }
           ),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "mx-auto mt-2 max-w-sm text-sm leading-relaxed text-ph-subtle", children: description }) : null,
-          action ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: action }) : null
+          description ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "mx-auto mt-2 max-w-sm text-sm leading-relaxed text-ph-subtle", children: description }) : null,
+          action ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: action }) : null
         ] })
       ]
     }
@@ -2253,24 +2352,24 @@ function SuiteEmptyState({
 }
 
 // src/suite/components/suite-settings-mobile-nav.tsx
-var import_react10 = require("react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_react9 = require("react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function SuiteSettingsMobileNav({
   items,
   activeHref,
   onSelect,
   dataTest
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "nav",
     {
       "data-test": dataTest,
       "aria-label": "Settings sections",
       className: "-mx-4 px-4 lg:hidden",
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex snap-x gap-2 overflow-x-auto pb-3 pt-1 scrollbar-hide [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: items.map((item) => {
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex snap-x gap-2 overflow-x-auto pb-3 pt-1 scrollbar-hide [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: items.map((item) => {
         const Icon = item.icon;
         const active = activeHref === item.href || activeHref.startsWith(`${item.href}/`);
-        const iconNode = (0, import_react10.isValidElement)(item.icon) ? item.icon : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        const iconNode = (0, import_react9.isValidElement)(item.icon) ? item.icon : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           Icon,
           {
             className: cn(
@@ -2280,7 +2379,7 @@ function SuiteSettingsMobileNav({
             "aria-hidden": true
           }
         );
-        return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
           "button",
           {
             type: "button",
@@ -2294,8 +2393,8 @@ function SuiteSettingsMobileNav({
             ),
             children: [
               iconNode,
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "whitespace-nowrap", children: item.label }),
-              active ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "absolute inset-x-0 -bottom-3 h-0.5 rounded-full bg-ph-ink lg:hidden" }) : null
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "whitespace-nowrap", children: item.label }),
+              active ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "absolute inset-x-0 -bottom-3 h-0.5 rounded-full bg-ph-ink lg:hidden" }) : null
             ]
           },
           item.href
@@ -2306,8 +2405,145 @@ function SuiteSettingsMobileNav({
 }
 
 // src/suite/components/suite-sidebar.tsx
-var import_link3 = __toESM(require("next/link"));
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_link2 = __toESM(require("next/link"));
+
+// src/components/ui/Tooltip.tsx
+var import_react10 = require("react");
+var import_react_dom = require("react-dom");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var TooltipDelayContext = (0, import_react10.createContext)(0);
+function tooltipPosition(trigger, side, align, offset) {
+  const horizontal = align === "start" ? trigger.left : align === "end" ? trigger.right : trigger.left + trigger.width / 2;
+  const vertical = align === "start" ? trigger.top : align === "end" ? trigger.bottom : trigger.top + trigger.height / 2;
+  if (side === "top")
+    return {
+      left: horizontal,
+      top: trigger.top - offset,
+      transform: "translate(-50%, -100%)"
+    };
+  if (side === "bottom")
+    return {
+      left: horizontal,
+      top: trigger.bottom + offset,
+      transform: "translate(-50%, 0)"
+    };
+  if (side === "left")
+    return {
+      left: trigger.left - offset,
+      top: vertical,
+      transform: "translate(-100%, -50%)"
+    };
+  return {
+    left: trigger.right + offset,
+    top: vertical,
+    transform: "translate(0, -50%)"
+  };
+}
+function Tooltip({
+  content,
+  children,
+  side = "top",
+  align = "center",
+  sideOffset = 7,
+  className,
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  delayDuration
+}) {
+  const providerDelay = (0, import_react10.useContext)(TooltipDelayContext);
+  const generatedId = (0, import_react10.useId)().replace(/:/g, "");
+  const triggerRef = (0, import_react10.useRef)(null);
+  const timerRef = (0, import_react10.useRef)(null);
+  const [internalOpen, setInternalOpen] = (0, import_react10.useState)(defaultOpen);
+  const [position, setPosition] = (0, import_react10.useState)(null);
+  const isOpen = open != null ? open : internalOpen;
+  const triggerId = children.props.id;
+  const tooltipId = triggerId ? `${triggerId}-tooltip` : `ph-tooltip-${generatedId}`;
+  function setOpen(next) {
+    if (open === void 0) setInternalOpen(next);
+    onOpenChange == null ? void 0 : onOpenChange(next);
+  }
+  function clearTimer() {
+    if (timerRef.current) clearTimeout(timerRef.current);
+    timerRef.current = null;
+  }
+  function updatePosition() {
+    if (!triggerRef.current) return;
+    setPosition(
+      tooltipPosition(
+        triggerRef.current.getBoundingClientRect(),
+        side,
+        align,
+        sideOffset
+      )
+    );
+  }
+  function show(immediate) {
+    clearTimer();
+    updatePosition();
+    const delay = immediate ? 0 : delayDuration != null ? delayDuration : providerDelay;
+    if (!delay) setOpen(true);
+    else timerRef.current = setTimeout(() => setOpen(true), delay);
+  }
+  function hide() {
+    clearTimer();
+    setOpen(false);
+  }
+  (0, import_react10.useEffect)(() => {
+    if (!isOpen) return;
+    const reposition = () => updatePosition();
+    window.addEventListener("resize", reposition);
+    window.addEventListener("scroll", reposition, true);
+    return () => {
+      window.removeEventListener("resize", reposition);
+      window.removeEventListener("scroll", reposition, true);
+    };
+  });
+  (0, import_react10.useEffect)(() => () => clearTimer(), []);
+  const describedBy = [children.props["aria-describedby"], tooltipId].filter(Boolean).join(" ");
+  const trigger = (0, import_react10.cloneElement)(children, { "aria-describedby": describedBy });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "span",
+      {
+        ref: triggerRef,
+        className: "inline-flex",
+        onMouseEnter: () => show(false),
+        onMouseLeave: hide,
+        onFocusCapture: () => show(true),
+        onBlurCapture: hide,
+        onKeyDown: (event) => {
+          if (event.key === "Escape") hide();
+        },
+        children: trigger
+      }
+    ),
+    isOpen && position && typeof document !== "undefined" ? (0, import_react_dom.createPortal)(
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        "span",
+        {
+          style: __spreadValues({ position: "fixed" }, position),
+          className: "pointer-events-none z-[200]",
+          children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            "span",
+            {
+              id: tooltipId,
+              role: "tooltip",
+              "data-side": side,
+              className: cn2("ph-tooltip-content", className),
+              children: content
+            }
+          )
+        }
+      ),
+      document.body
+    ) : null
+  ] });
+}
+
+// src/suite/components/suite-sidebar.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function renderNode(node, collapsed) {
   if (typeof node === "function") return node(collapsed);
   return node;
@@ -2324,7 +2560,7 @@ function SuiteSidebar({
   className,
   surface = false
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "div",
     {
       className: cn(
@@ -2333,7 +2569,7 @@ function SuiteSidebar({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
           "div",
           {
             className: cn(
@@ -2342,36 +2578,35 @@ function SuiteSidebar({
               collapsed ? "flex-col items-center gap-1 px-1 py-2" : "h-14 items-center justify-between gap-2 px-3"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("min-w-0", collapsed ? "shrink-0" : "flex-1"), children: renderNode(appSwitcher, collapsed) }),
-              collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "shrink-0", children: renderNode(notificationBell, collapsed) })
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cn("min-w-0", collapsed ? "shrink-0" : "flex-1"), children: renderNode(appSwitcher, collapsed) }),
+              collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "shrink-0", children: renderNode(notificationBell, collapsed) })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
           "div",
           {
             className: cn(
-              "flex min-h-0 flex-1 flex-col",
+              "flex min-h-0 flex-1 flex-col overflow-y-auto",
               surface ? "bg-ph-surface" : "bg-ph-canvas",
               collapsed ? "px-1.5 py-2" : "p-2"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
                 "nav",
                 {
                   "aria-label": "Pages",
                   className: "shrink-0 space-y-0.5",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "space-y-0.5", children: navItems.map((item) => {
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "space-y-0.5", children: navItems.map((item) => {
                       const Icon = item.icon;
                       const active = Boolean(item.active);
-                      return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
-                        import_link3.default,
+                      const link = /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                        import_link2.default,
                         {
                           href: item.href,
                           "data-test": "nav-link",
-                          title: collapsed ? item.label : void 0,
                           "aria-current": active ? "page" : void 0,
                           onClick: item.onClick,
                           className: cn(
@@ -2380,7 +2615,7 @@ function SuiteSidebar({
                             collapsed ? "mx-auto size-10 shrink-0 justify-center gap-0 px-0 py-0" : "w-full px-2.5 py-2"
                           ),
                           children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                               "span",
                               {
                                 className: cn(
@@ -2388,7 +2623,7 @@ function SuiteSidebar({
                                   item.iconClassName
                                 ),
                                 "aria-hidden": true,
-                                children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                                children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                                   Icon,
                                   {
                                     className: "h-full w-full",
@@ -2397,7 +2632,7 @@ function SuiteSidebar({
                                 )
                               }
                             ),
-                            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                               "span",
                               {
                                 className: cn(
@@ -2408,19 +2643,20 @@ function SuiteSidebar({
                                 children: item.label
                               }
                             ),
-                            !collapsed && item.badge ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
+                            !collapsed && item.badge ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
                           ]
                         },
                         item.label
                       );
+                      return collapsed ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
                     }) })
                   ]
                 }
               ),
-              secondaryNav ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+              secondaryNav ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                 "div",
                 {
-                  className: "min-h-0 flex-1 overflow-y-auto",
+                  className: "min-h-0 flex-1",
                   "data-test": "suite-sidebar-secondary-nav",
                   children: secondaryNav
                 }
@@ -2428,7 +2664,7 @@ function SuiteSidebar({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "div",
           {
             className: cn(
@@ -2436,7 +2672,7 @@ function SuiteSidebar({
               surface ? "bg-ph-surface" : "bg-ph-canvas",
               collapsed ? "p-1.5" : "p-3"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
               "div",
               {
                 className: cn(
@@ -2445,7 +2681,7 @@ function SuiteSidebar({
                 ),
                 children: [
                   renderNode(userMenu, collapsed),
-                  !collapsed && footerExtras ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
+                  !collapsed && footerExtras ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
                 ]
               }
             )
@@ -2457,7 +2693,7 @@ function SuiteSidebar({
 }
 
 // src/suite/components/suite-app-layout.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function SuiteAppLayout({
   sidebar,
   children,
@@ -2469,16 +2705,16 @@ function SuiteAppLayout({
   onResetWidth,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { "data-test": "app-shell", className: cn("min-h-screen", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "hidden lg:flex h-screen overflow-hidden", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { "data-test": "app-shell", className: cn("min-h-screen", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "hidden lg:flex h-screen overflow-hidden", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
         "aside",
         {
           className: "relative flex shrink-0 flex-col border-r border-ph-border transition-[width] duration-200 ease-out",
           style: { width: `${sidebarWidth}px` },
           children: [
             sidebar,
-            onStartResize ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            onStartResize ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
               "div",
               {
                 role: "separator",
@@ -2492,12 +2728,12 @@ function SuiteAppLayout({
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("main", { className: "min-w-0 flex-1 overflow-y-auto bg-ph-canvas", children })
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("main", { className: "min-w-0 flex-1 overflow-y-auto bg-ph-canvas", children })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex min-h-screen flex-col lg:hidden", children: [
-      mobileHeader ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "shrink-0", children: mobileHeader }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("main", { className: "min-w-0 flex-1 overflow-y-auto bg-ph-canvas", children }),
-      bottomNav ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "shrink-0", children: bottomNav }) : null
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-h-screen flex-col lg:hidden", children: [
+      mobileHeader ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0", children: mobileHeader }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("main", { className: "min-w-0 flex-1 overflow-y-auto bg-ph-canvas", children }),
+      bottomNav ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0", children: bottomNav }) : null
     ] })
   ] });
 }