@devalok/shilp-sutra 0.17.2 → 0.18.0

package/dist/shell/sidebar.js

@@ -1,12 +1,12 @@
 "use client";
-import { jsxs as t, jsx as e, Fragment as A } from "react/jsx-runtime";
+import { jsxs as r, jsx as e, Fragment as A } from "react/jsx-runtime";
 import * as m from "react";
-import { useLink as R } from "./link-context.js";
-import { S as T, a as z, b, c as H, d as U, e as $, f as q, g as E, h as J, i as L, j as M, k as j, l as I, m as K, n as Q, o as V } from "../_chunks/sidebar.js";
+import { u as R } from "../_chunks/link-context.js";
+import { S as T, a as z, b as f, c as H, d as U, e as $, f as q, g as E, h as J, i as L, j as M, k as j, l as I, m as K, n as Q, o as V } from "../_chunks/sidebar.js";
 import { Collapsible as X, CollapsibleTrigger as Y, CollapsibleContent as Z } from "../ui/collapsible.js";
 import { A as _, a as P, b as ee } from "../_chunks/avatar.js";
-import { c as v } from "../_chunks/utils.js";
-function ae({ className: r }) {
+import { c as b } from "../_chunks/utils.js";
+function ae({ className: s }) {
   return /* @__PURE__ */ e(
     "svg",
     {
@@ -19,13 +19,13 @@ function ae({ className: r }) {
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      className: r,
+      className: s,
       children: /* @__PURE__ */ e("path", { d: "m9 18 6-6-6-6" })
     }
   );
 }
-function re({ className: r }) {
-  return /* @__PURE__ */ t(
+function se({ className: s }) {
+  return /* @__PURE__ */ r(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -37,7 +37,7 @@ function re({ className: r }) {
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      className: r,
+      className: s,
       children: [
         /* @__PURE__ */ e("path", { d: "M18 6 6 18" }),
         /* @__PURE__ */ e("path", { d: "m6 6 12 12" })
@@ -45,38 +45,38 @@ function re({ className: r }) {
     }
   );
 }
-const B = "relative gap-ds-04 rounded-ds-lg px-ds-04 py-ds-03 transition-colors", F = "bg-interactive-subtle text-interactive after:absolute after:right-0 after:top-0 after:h-full after:w-ds-01 after:rounded-l-ds-full after:bg-interactive after:content-['']", G = "text-text-helper hover:bg-layer-02 hover:text-text-primary";
-function te({
-  item: r,
-  isActive: n,
-  isPathActive: p
+const B = "relative gap-ds-04 rounded-ds-lg px-ds-04 py-ds-03 transition-colors", F = "bg-accent-2 text-accent-11 after:absolute after:right-0 after:top-0 after:h-full after:w-ds-01 after:rounded-l-ds-full after:bg-accent-9 after:content-['']", G = "text-surface-fg-subtle hover:bg-surface-2 hover:text-surface-fg";
+function re({
+  item: s,
+  isActive: t,
+  isPathActive: u
 }) {
-  const h = R(), i = r.badge != null ? typeof r.badge == "number" && r.badge > 99 ? "99+" : String(r.badge) : null;
-  if (r.children && r.children.length > 0) {
-    const c = r.children.some(
-      (l) => p(l.href, l.exact)
-    ), u = c || n || (r.defaultOpen ?? !1);
-    return /* @__PURE__ */ e(X, { defaultOpen: u, className: "group/collapsible", children: /* @__PURE__ */ t(M, { children: [
-      /* @__PURE__ */ t("div", { className: "relative", children: [
+  const h = R(), i = s.badge != null ? typeof s.badge == "number" && s.badge > 99 ? "99+" : String(s.badge) : null;
+  if (s.children && s.children.length > 0) {
+    const d = s.children.some(
+      (l) => u(l.href, l.exact)
+    ), g = d || t || (s.defaultOpen ?? !1);
+    return /* @__PURE__ */ e(X, { defaultOpen: g, className: "group/collapsible", children: /* @__PURE__ */ r(M, { children: [
+      /* @__PURE__ */ r("div", { className: "relative", children: [
         /* @__PURE__ */ e(
           j,
           {
             asChild: !0,
-            isActive: n || c,
-            tooltip: r.title,
-            className: v(
+            isActive: t || d,
+            tooltip: s.title,
+            className: b(
               B,
-              n || c ? F : G
+              t || d ? F : G
             ),
-            children: /* @__PURE__ */ t(
+            children: /* @__PURE__ */ r(
               h,
               {
-                href: r.href,
-                "aria-label": r.title,
-                "aria-current": n ? "page" : void 0,
+                href: s.href,
+                "aria-label": s.title,
+                "aria-current": t ? "page" : void 0,
                 children: [
-                  /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-md [&>svg]:w-ico-md shrink-0", "aria-hidden": "true", children: r.icon }),
-                  /* @__PURE__ */ e("span", { className: "text-ds-base", children: r.title })
+                  /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-md [&>svg]:w-ico-md shrink-0", "aria-hidden": "true", children: s.icon }),
+                  /* @__PURE__ */ e("span", { className: "text-ds-base", children: s.title })
                 ]
               }
             )
@@ -86,20 +86,20 @@ function te({
         /* @__PURE__ */ e(Y, { asChild: !0, children: /* @__PURE__ */ e(
           "button",
           {
-            className: "absolute right-ds-02 top-1/2 flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-ds-md text-text-helper transition-colors hover:bg-layer-02 hover:text-text-primary group-data-[collapsible=icon]:hidden",
-            "aria-label": `Toggle ${r.title}`,
+            className: "absolute right-ds-02 top-1/2 flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors hover:bg-surface-2 hover:text-surface-fg group-data-[collapsible=icon]:hidden",
+            "aria-label": `Toggle ${s.title}`,
             children: /* @__PURE__ */ e(ae, { className: "h-4 w-4 transition-transform duration-fast-02 ease-productive-standard group-data-[state=open]/collapsible:rotate-90" })
           }
         ) })
       ] }),
-      /* @__PURE__ */ e(Z, { className: "overflow-hidden data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down", children: /* @__PURE__ */ e(K, { children: r.children.map((l) => {
-        const a = p(l.href, l.exact);
+      /* @__PURE__ */ e(Z, { children: /* @__PURE__ */ e(K, { children: s.children.map((l) => {
+        const a = u(l.href, l.exact);
         return /* @__PURE__ */ e(Q, { children: /* @__PURE__ */ e(
           V,
           {
             asChild: !0,
             isActive: a,
-            children: /* @__PURE__ */ t(
+            children: /* @__PURE__ */ r(
               h,
               {
                 href: l.href,
@@ -115,26 +115,26 @@ function te({
       }) }) })
     ] }) });
   }
-  return /* @__PURE__ */ t(M, { children: [
+  return /* @__PURE__ */ r(M, { children: [
     /* @__PURE__ */ e(
       j,
       {
         asChild: !0,
-        isActive: n,
-        tooltip: r.title,
-        className: v(
+        isActive: t,
+        tooltip: s.title,
+        className: b(
           B,
-          n ? F : G
+          t ? F : G
         ),
-        children: /* @__PURE__ */ t(
+        children: /* @__PURE__ */ r(
           h,
           {
-            href: r.href,
-            "aria-label": r.title,
-            "aria-current": n ? "page" : void 0,
+            href: s.href,
+            "aria-label": s.title,
+            "aria-current": t ? "page" : void 0,
             children: [
-              /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-md [&>svg]:w-ico-md shrink-0", "aria-hidden": "true", children: r.icon }),
-              /* @__PURE__ */ e("span", { className: "text-ds-base", children: r.title })
+              /* @__PURE__ */ e("span", { className: "[&>svg]:h-ico-md [&>svg]:w-ico-md shrink-0", "aria-hidden": "true", children: s.icon }),
+              /* @__PURE__ */ e("span", { className: "text-ds-base", children: s.title })
             ]
           }
         )
@@ -143,144 +143,144 @@ function te({
     i && /* @__PURE__ */ e(I, { children: i })
   ] });
 }
-const se = m.forwardRef(
+const ne = m.forwardRef(
   ({
-    currentPath: r = "/",
-    user: n,
-    navGroups: p = [],
+    currentPath: s = "/",
+    user: t,
+    navGroups: u = [],
     logo: h,
     headerSlot: i,
-    preFooterSlot: c,
-    preFooterClassName: u,
+    preFooterSlot: d,
+    preFooterClassName: g,
     footerLinks: l = [],
     footer: a,
-    renderItem: g,
+    renderItem: x,
     className: D,
     ...O
   }, W) => {
-    var N, w, y, C;
-    const x = R(), f = (s, d = !1) => d || s === "/" ? r === s : r.startsWith(s);
-    return /* @__PURE__ */ t(
+    var N, w, C, S;
+    const p = R(), v = (n, c = !1) => c || n === "/" ? s === n : s.startsWith(n);
+    return /* @__PURE__ */ r(
       T,
       {
         ...O,
         ref: W,
         "aria-label": "Main navigation",
-        className: v(
-          "z-raised hidden h-full flex-col border-r border-border bg-layer-01 md:flex",
+        className: b(
+          "z-raised hidden h-full flex-col border-r border-surface-border-strong bg-surface-1 md:flex",
           D
         ),
         children: [
-          /* @__PURE__ */ e(z, { className: "px-ds-06 py-ds-06", children: h ?? /* @__PURE__ */ e("span", { className: "text-ds-lg font-semibold text-text-primary", children: "Logo" }) }),
-          n && /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-04 px-ds-06 pb-ds-05", children: [
-            /* @__PURE__ */ t(_, { className: "h-ds-sm-plus w-ds-sm-plus", children: [
-              n.image ? /* @__PURE__ */ e(P, { src: n.image, alt: n.name }) : null,
-              /* @__PURE__ */ e(ee, { className: "bg-layer-03 text-text-primary", children: (N = n.name) == null ? void 0 : N.charAt(0).toUpperCase() })
+          /* @__PURE__ */ e(z, { className: "px-ds-06 py-ds-06", children: h ?? /* @__PURE__ */ e("span", { className: "text-ds-lg font-semibold text-surface-fg", children: "Logo" }) }),
+          t && /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-04 px-ds-06 pb-ds-05", children: [
+            /* @__PURE__ */ r(_, { className: "h-ds-sm-plus w-ds-sm-plus", children: [
+              t.image ? /* @__PURE__ */ e(P, { src: t.image, alt: t.name }) : null,
+              /* @__PURE__ */ e(ee, { className: "bg-surface-3 text-surface-fg", children: (N = t.name) == null ? void 0 : N.charAt(0).toUpperCase() })
             ] }),
-            /* @__PURE__ */ t("div", { className: "flex min-w-0 flex-col", children: [
-              /* @__PURE__ */ e("span", { className: "truncate text-ds-md text-text-primary", children: n.name }),
-              /* @__PURE__ */ e("span", { className: "truncate text-ds-sm text-text-placeholder", children: n.designation || n.role })
+            /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-col", children: [
+              /* @__PURE__ */ e("span", { className: "truncate text-ds-md text-surface-fg", children: t.name }),
+              /* @__PURE__ */ e("span", { className: "truncate text-ds-sm text-surface-fg-subtle", children: t.designation || t.role })
             ] })
           ] }),
-          /* @__PURE__ */ e(b, {}),
-          i && /* @__PURE__ */ t(A, { children: [
+          /* @__PURE__ */ e(f, {}),
+          i && /* @__PURE__ */ r(A, { children: [
             i,
-            /* @__PURE__ */ e(b, {})
+            /* @__PURE__ */ e(f, {})
           ] }),
-          /* @__PURE__ */ e(H, { className: "no-scrollbar px-ds-04", children: p.map((s, d) => /* @__PURE__ */ t("div", { children: [
-            d > 0 && /* @__PURE__ */ e(b, {}),
-            /* @__PURE__ */ t(U, { children: [
-              /* @__PURE__ */ e($, { className: "px-ds-04 text-ds-sm text-text-placeholder", children: s.label }),
-              s.action && /* @__PURE__ */ e(q, { asChild: !0, children: s.action }),
-              /* @__PURE__ */ e(E, { children: /* @__PURE__ */ e(J, { children: s.items.map((o) => {
-                const S = () => /* @__PURE__ */ e(
-                  te,
+          /* @__PURE__ */ e(H, { className: "no-scrollbar px-ds-04", children: u.map((n, c) => /* @__PURE__ */ r("div", { children: [
+            c > 0 && /* @__PURE__ */ e(f, {}),
+            /* @__PURE__ */ r(U, { children: [
+              /* @__PURE__ */ e($, { className: "px-ds-04 text-ds-sm text-surface-fg-subtle", children: n.label }),
+              n.action && /* @__PURE__ */ e(q, { asChild: !0, children: n.action }),
+              /* @__PURE__ */ e(E, { children: /* @__PURE__ */ e(J, { children: n.items.map((o) => {
+                const k = () => /* @__PURE__ */ e(
+                  re,
                   {
                     item: o,
-                    isActive: f(o.href, o.exact),
-                    isPathActive: f
+                    isActive: v(o.href, o.exact),
+                    isPathActive: v
                   }
                 );
-                if (g) {
-                  const k = g(o, S);
-                  if (k !== null)
-                    return /* @__PURE__ */ e(m.Fragment, { children: k }, o.href);
+                if (x) {
+                  const y = x(o, k);
+                  if (y !== null)
+                    return /* @__PURE__ */ e(m.Fragment, { children: y }, o.href);
                 }
-                return /* @__PURE__ */ e(m.Fragment, { children: S() }, o.href);
+                return /* @__PURE__ */ e(m.Fragment, { children: k() }, o.href);
               }) }) })
             ] })
-          ] }, s.label)) }),
-          c && /* @__PURE__ */ t(A, { children: [
-            /* @__PURE__ */ e(b, {}),
-            /* @__PURE__ */ e("div", { className: u, children: c })
+          ] }, n.label)) }),
+          d && /* @__PURE__ */ r(A, { children: [
+            /* @__PURE__ */ e(f, {}),
+            /* @__PURE__ */ e("div", { className: g, children: d })
           ] }),
-          a ? /* @__PURE__ */ t(L, { className: "gap-ds-03 px-ds-06 py-ds-05", children: [
+          a ? /* @__PURE__ */ r(L, { className: "gap-ds-03 px-ds-06 py-ds-05", children: [
             a.slot && /* @__PURE__ */ e("div", { children: a.slot }),
-            a.promo && /* @__PURE__ */ t("div", { className: "relative rounded-ds-lg border border-border-subtle bg-layer-02 p-ds-04", children: [
+            a.promo && /* @__PURE__ */ r("div", { className: "relative rounded-ds-lg border border-surface-border bg-surface-2 p-ds-04", children: [
               a.promo.onDismiss && /* @__PURE__ */ e(
                 "button",
                 {
                   onClick: a.promo.onDismiss,
                   "aria-label": "Dismiss",
-                  className: "absolute right-ds-02 top-ds-02 flex h-5 w-5 items-center justify-center rounded-ds-md text-text-helper transition-colors hover:bg-layer-03 hover:text-text-primary",
-                  children: /* @__PURE__ */ e(re, { className: "h-3.5 w-3.5" })
+                  className: "absolute right-ds-02 top-ds-02 flex h-5 w-5 items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors hover:bg-surface-3 hover:text-surface-fg",
+                  children: /* @__PURE__ */ e(se, { className: "h-3.5 w-3.5" })
                 }
               ),
-              /* @__PURE__ */ t("div", { className: "flex flex-col gap-ds-03", children: [
-                a.promo.icon && /* @__PURE__ */ e("span", { className: "text-interactive [&>svg]:h-ico-md [&>svg]:w-ico-md", "aria-hidden": "true", children: a.promo.icon }),
-                /* @__PURE__ */ t("div", { className: "flex min-w-0 flex-col gap-ds-03", children: [
-                  /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-primary", children: a.promo.text }),
+              /* @__PURE__ */ r("div", { className: "flex flex-col gap-ds-03", children: [
+                a.promo.icon && /* @__PURE__ */ e("span", { className: "text-accent-11 [&>svg]:h-ico-md [&>svg]:w-ico-md", "aria-hidden": "true", children: a.promo.icon }),
+                /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-col gap-ds-03", children: [
+                  /* @__PURE__ */ e("p", { className: "text-ds-sm text-surface-fg", children: a.promo.text }),
                   a.promo.action && (a.promo.action.href ? /* @__PURE__ */ e(
-                    x,
+                    p,
                     {
                       href: a.promo.action.href,
                       onClick: a.promo.action.onClick,
-                      className: "inline-flex self-start rounded-ds-md bg-interactive px-ds-04 py-ds-02 text-ds-sm font-medium text-text-on-color transition-colors hover:bg-interactive-hover",
+                      className: "inline-flex self-start rounded-ds-md bg-accent-9 px-ds-04 py-ds-02 text-ds-sm font-medium text-accent-fg transition-colors hover:bg-accent-10",
                       children: a.promo.action.label
                     }
                   ) : /* @__PURE__ */ e(
                     "button",
                     {
                       onClick: a.promo.action.onClick,
-                      className: "inline-flex self-start rounded-ds-md bg-interactive px-ds-04 py-ds-02 text-ds-sm font-medium text-text-on-color transition-colors hover:bg-interactive-hover",
+                      className: "inline-flex self-start rounded-ds-md bg-accent-9 px-ds-04 py-ds-02 text-ds-sm font-medium text-accent-fg transition-colors hover:bg-accent-10",
                       children: a.promo.action.label
                     }
                   ))
                 ] })
               ] })
             ] }),
-            (((w = a.links) == null ? void 0 : w.length) || a.version) && /* @__PURE__ */ t("div", { className: "flex items-center gap-ds-03 text-ds-sm text-text-placeholder", children: [
-              (y = a.links) == null ? void 0 : y.map((s, d) => /* @__PURE__ */ t(m.Fragment, { children: [
-                d > 0 && /* @__PURE__ */ e("span", { children: "·" }),
+            (((w = a.links) == null ? void 0 : w.length) || a.version) && /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-03 text-ds-sm text-surface-fg-subtle", children: [
+              (C = a.links) == null ? void 0 : C.map((n, c) => /* @__PURE__ */ r(m.Fragment, { children: [
+                c > 0 && /* @__PURE__ */ e("span", { children: "·" }),
                 /* @__PURE__ */ e(
-                  x,
+                  p,
                   {
-                    className: "transition-colors hover:text-interactive",
-                    href: s.href,
-                    children: s.label
+                    className: "transition-colors hover:text-accent-11",
+                    href: n.href,
+                    children: n.label
                   }
                 )
-              ] }, s.href)),
-              ((C = a.links) == null ? void 0 : C.length) && a.version && /* @__PURE__ */ e("span", { children: "·" }),
-              a.version && (typeof a.version == "string" ? /* @__PURE__ */ e("span", { children: a.version }) : /* @__PURE__ */ e(x, { className: "transition-colors hover:text-interactive", href: a.version.href, children: a.version.label }))
+              ] }, n.href)),
+              ((S = a.links) == null ? void 0 : S.length) && a.version && /* @__PURE__ */ e("span", { children: "·" }),
+              a.version && (typeof a.version == "string" ? /* @__PURE__ */ e("span", { children: a.version }) : /* @__PURE__ */ e(p, { className: "transition-colors hover:text-accent-11", href: a.version.href, children: a.version.label }))
             ] })
-          ] }) : l.length > 0 ? /* @__PURE__ */ e(L, { className: "px-ds-06 py-ds-05", children: /* @__PURE__ */ e("div", { className: "flex items-center gap-ds-03 text-ds-sm text-text-placeholder", children: l.map((s, d) => /* @__PURE__ */ t(m.Fragment, { children: [
-            d > 0 && /* @__PURE__ */ e("span", { children: "·" }),
+          ] }) : l.length > 0 ? /* @__PURE__ */ e(L, { className: "px-ds-06 py-ds-05", children: /* @__PURE__ */ e("div", { className: "flex items-center gap-ds-03 text-ds-sm text-surface-fg-subtle", children: l.map((n, c) => /* @__PURE__ */ r(m.Fragment, { children: [
+            c > 0 && /* @__PURE__ */ e("span", { children: "·" }),
             /* @__PURE__ */ e(
-              x,
+              p,
               {
-                className: "transition-colors hover:text-interactive",
-                href: s.href,
-                children: s.label
+                className: "transition-colors hover:text-accent-11",
+                href: n.href,
+                children: n.label
               }
             )
-          ] }, s.href)) }) }) : null
+          ] }, n.href)) }) }) : null
         ]
       }
     );
   }
 );
-se.displayName = "AppSidebar";
+ne.displayName = "AppSidebar";
 export {
-  se as AppSidebar
+  ne as AppSidebar
 };

package/dist/shell/top-bar.js

@@ -1,30 +1,30 @@
 "use client";
 import { jsxs as s, jsx as e, Fragment as D } from "react/jsx-runtime";
-import * as g from "react";
+import * as w from "react";
 import { useColorMode as I } from "../hooks/use-color-mode.js";
 import { A as j, a as K, b as F } from "../_chunks/avatar.js";
-import { DropdownMenu as U, DropdownMenuTrigger as B, DropdownMenuContent as E, DropdownMenuItem as a, DropdownMenuSeparator as w } from "../ui/dropdown-menu.js";
-import { a as c, b as n, c as i } from "../_chunks/tooltip.js";
+import { DropdownMenu as U, DropdownMenuTrigger as B, DropdownMenuContent as E, DropdownMenuItem as d, DropdownMenuSeparator as N } from "../ui/dropdown-menu.js";
+import { a as t, b as n, c as i } from "../_chunks/tooltip.js";
 import { p as R } from "../_chunks/sidebar.js";
 import { IconSearch as z, IconSparkles as L, IconUser as O, IconSun as P, IconMoon as q, IconLogout as G } from "@tabler/icons-react";
-import { c as d } from "../_chunks/utils.js";
-const H = g.forwardRef(
+import { c as l } from "../_chunks/utils.js";
+const H = w.forwardRef(
   ({
     pageTitle: m = "",
-    user: l,
-    onNavigate: t,
-    onLogout: p,
-    onSearchClick: h,
-    onAiChatClick: x,
-    mobileLogo: b,
-    notificationSlot: N,
+    user: a,
+    onNavigate: c,
+    onLogout: f,
+    onSearchClick: u,
+    onAiChatClick: p,
+    mobileLogo: h,
+    notificationSlot: y,
     userMenuItems: o,
     className: C,
     ...k
   }, v) => {
-    var u;
-    const { colorMode: f, toggleColorMode: M } = I(), S = () => {
-      h ? h() : document.dispatchEvent(
+    var g;
+    const { colorMode: b, toggleColorMode: M } = I(), S = () => {
+      u ? u() : document.dispatchEvent(
         new KeyboardEvent("keydown", {
           key: "k",
           ctrlKey: !0,
@@ -37,124 +37,124 @@ const H = g.forwardRef(
       {
         ...k,
         ref: v,
-        className: d(
-          "z-sticky flex w-full items-center border-b border-border bg-layer-01 px-ds-05 py-ds-04 md:px-ds-06",
+        className: l(
+          "z-sticky flex w-full items-center border-b border-surface-border-strong bg-surface-1 px-ds-05 py-ds-04 md:px-ds-06",
           C
         ),
         children: [
           /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-04", children: [
-            /* @__PURE__ */ e(R, { className: "hidden text-text-secondary md:flex" }),
-            b && /* @__PURE__ */ e("div", { className: "md:hidden", children: b }),
-            m && /* @__PURE__ */ e("h2", { className: "hidden text-ds-lg text-text-primary md:block", children: m })
+            /* @__PURE__ */ e(R, { className: "hidden text-surface-fg-muted md:flex" }),
+            h && /* @__PURE__ */ e("div", { className: "md:hidden", children: h }),
+            m && /* @__PURE__ */ e("h2", { className: "hidden text-ds-lg text-surface-fg md:block", children: m })
           ] }),
           /* @__PURE__ */ s("div", { className: "ml-auto flex items-center gap-ds-03 md:gap-ds-05", children: [
-            /* @__PURE__ */ s(c, { children: [
+            /* @__PURE__ */ s(t, { children: [
               /* @__PURE__ */ e(n, { asChild: !0, children: /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
                   onClick: S,
                   "aria-label": "Search (Ctrl+K)",
-                  className: "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-full border border-border bg-layer-02 text-text-secondary transition-colors hover:bg-layer-03",
+                  className: "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-full border border-surface-border-strong bg-surface-2 text-surface-fg-muted transition-colors hover:bg-surface-3",
                   children: /* @__PURE__ */ e(z, { className: "h-ico-sm w-ico-sm", "aria-hidden": "true" })
                 }
               ) }),
               /* @__PURE__ */ e(i, { side: "bottom", align: "center", children: "Search (Ctrl+K)" })
             ] }),
-            N,
-            x && /* @__PURE__ */ s(c, { children: [
+            y,
+            p && /* @__PURE__ */ s(t, { children: [
               /* @__PURE__ */ e(n, { asChild: !0, children: /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: x,
+                  onClick: p,
                   "aria-label": "AI Chat",
-                  className: "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-full border border-border bg-layer-02 text-text-secondary transition-colors hover:bg-layer-03",
+                  className: "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-full border border-surface-border-strong bg-surface-2 text-surface-fg-muted transition-colors hover:bg-surface-3",
                   children: /* @__PURE__ */ e(L, { className: "h-ico-sm w-ico-sm", "aria-hidden": "true" })
                 }
               ) }),
               /* @__PURE__ */ e(i, { side: "bottom", align: "center", children: "AI Chat" })
             ] }),
-            l && /* @__PURE__ */ s(U, { children: [
-              /* @__PURE__ */ s(c, { children: [
+            a && /* @__PURE__ */ s(U, { children: [
+              /* @__PURE__ */ s(t, { children: [
                 /* @__PURE__ */ e(n, { asChild: !0, children: /* @__PURE__ */ e(B, { asChild: !0, children: /* @__PURE__ */ e("button", { type: "button", className: "flex items-center gap-ds-03 outline-none", children: /* @__PURE__ */ s(j, { className: "h-ds-sm-plus w-ds-sm-plus cursor-pointer", children: [
-                  l.image ? /* @__PURE__ */ e(K, { src: l.image, alt: l.name }) : null,
-                  /* @__PURE__ */ e(F, { className: "bg-layer-02 text-text-primary", children: (u = l.name) == null ? void 0 : u.charAt(0).toUpperCase() })
+                  a.image ? /* @__PURE__ */ e(K, { src: a.image, alt: a.name }) : null,
+                  /* @__PURE__ */ e(F, { className: "bg-surface-2 text-surface-fg", children: (g = a.name) == null ? void 0 : g.charAt(0).toUpperCase() })
                 ] }) }) }) }),
                 /* @__PURE__ */ e(i, { side: "bottom", align: "center", children: "User Menu" })
               ] }),
               /* @__PURE__ */ s(
                 E,
                 {
-                  className: "w-[200px] rounded-ds-xl border border-border bg-layer-01 p-0 shadow-03",
+                  className: "w-[200px] rounded-ds-xl border border-surface-border-strong bg-surface-1 p-0 shadow-03",
                   sideOffset: 8,
                   align: "end",
                   children: [
-                    /* @__PURE__ */ s("div", { className: "border-b border-border px-ds-05 py-ds-04", children: [
-                      /* @__PURE__ */ e("p", { className: "text-ds-md text-text-primary", children: l.name }),
-                      l.email && /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-placeholder", children: l.email })
+                    /* @__PURE__ */ s("div", { className: "border-b border-surface-border-strong px-ds-05 py-ds-04", children: [
+                      /* @__PURE__ */ e("p", { className: "text-ds-md text-surface-fg", children: a.name }),
+                      a.email && /* @__PURE__ */ e("p", { className: "text-ds-sm text-surface-fg-subtle", children: a.email })
                     ] }),
                     /* @__PURE__ */ s(
-                      a,
+                      d,
                       {
-                        className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-layer-02",
-                        onClick: () => t == null ? void 0 : t("/profile"),
+                        className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-surface-2",
+                        onClick: () => c == null ? void 0 : c("/profile"),
                         children: [
-                          /* @__PURE__ */ e(O, { className: "h-ico-sm w-ico-sm text-text-secondary" }),
-                          /* @__PURE__ */ e("span", { className: "text-ds-md text-text-secondary", children: "Profile" })
+                          /* @__PURE__ */ e(O, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }),
+                          /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-muted", children: "Profile" })
                         ]
                       }
                     ),
                     o == null ? void 0 : o.map((r, T) => {
                       const A = {
-                        error: "text-error",
-                        success: "text-success",
-                        warning: "text-warning",
-                        info: "text-info"
-                      }, y = r.color ? A[r.color] ?? "text-text-secondary" : "text-text-secondary";
-                      return /* @__PURE__ */ s(g.Fragment, { children: [
-                        r.separator && /* @__PURE__ */ e(w, { className: "bg-border" }),
+                        error: "text-error-11",
+                        success: "text-success-11",
+                        warning: "text-warning-11",
+                        info: "text-info-11"
+                      }, x = r.color ? A[r.color] ?? "text-surface-fg-muted" : "text-surface-fg-muted";
+                      return /* @__PURE__ */ s(w.Fragment, { children: [
+                        r.separator && /* @__PURE__ */ e(N, { className: "bg-surface-border" }),
                         /* @__PURE__ */ s(
-                          a,
+                          d,
                           {
-                            className: d(
-                              "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-layer-02",
-                              r.disabled && "pointer-events-none opacity-[0.38]"
+                            className: l(
+                              "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-surface-2",
+                              r.disabled && "pointer-events-none opacity-action-disabled"
                             ),
                             disabled: r.disabled,
                             onClick: () => {
-                              r.disabled || (r.onClick ? r.onClick() : r.href && (t == null || t(r.href)));
+                              r.disabled || (r.onClick ? r.onClick() : r.href && (c == null || c(r.href)));
                             },
                             children: [
-                              r.icon && /* @__PURE__ */ e("span", { className: d("[&>svg]:h-ico-sm [&>svg]:w-ico-sm", y), children: r.icon }),
-                              /* @__PURE__ */ e("span", { className: d("text-ds-md", y), children: r.label }),
-                              r.badge != null && r.badge !== !1 && (typeof r.badge == "string" ? /* @__PURE__ */ e("span", { className: "ml-auto inline-flex h-[18px] min-w-[18px] items-center justify-center rounded-ds-full bg-error px-ds-02 text-[10px] font-semibold leading-none text-text-on-color", children: r.badge }) : /* @__PURE__ */ e("span", { className: "ml-auto h-[8px] w-[8px] rounded-ds-full bg-error" }))
+                              r.icon && /* @__PURE__ */ e("span", { className: l("[&>svg]:h-ico-sm [&>svg]:w-ico-sm", x), children: r.icon }),
+                              /* @__PURE__ */ e("span", { className: l("text-ds-md", x), children: r.label }),
+                              r.badge != null && r.badge !== !1 && (typeof r.badge == "string" ? /* @__PURE__ */ e("span", { className: "ml-auto inline-flex h-[18px] min-w-[18px] items-center justify-center rounded-ds-full bg-error-9 px-ds-02 text-[10px] font-semibold leading-none text-accent-fg", children: r.badge }) : /* @__PURE__ */ e("span", { className: "ml-auto h-[8px] w-[8px] rounded-ds-full bg-error-9" }))
                             ]
                           }
                         )
                       ] }, r.label + T);
                     }),
                     /* @__PURE__ */ s(
-                      a,
+                      d,
                       {
-                        className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-layer-02",
+                        className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-surface-2",
                         onClick: M,
                         children: [
-                          f === "dark" ? /* @__PURE__ */ e(P, { className: "h-ico-sm w-ico-sm text-text-secondary" }) : /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm text-text-secondary" }),
-                          /* @__PURE__ */ e("span", { className: "text-ds-md text-text-secondary", children: f === "dark" ? "Light Mode" : "Dark Mode" })
+                          b === "dark" ? /* @__PURE__ */ e(P, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) : /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }),
+                          /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-muted", children: b === "dark" ? "Light Mode" : "Dark Mode" })
                         ]
                       }
                     ),
-                    p && /* @__PURE__ */ s(D, { children: [
-                      /* @__PURE__ */ e(w, { className: "bg-border" }),
+                    f && /* @__PURE__ */ s(D, { children: [
+                      /* @__PURE__ */ e(N, { className: "bg-surface-border" }),
                       /* @__PURE__ */ s(
-                        a,
+                        d,
                         {
-                          className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-layer-02",
-                          onClick: p,
+                          className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-surface-2",
+                          onClick: f,
                           children: [
-                            /* @__PURE__ */ e(G, { className: "h-ico-sm w-ico-sm text-error" }),
-                            /* @__PURE__ */ e("span", { className: "text-ds-md text-error", children: "Logout" })
+                            /* @__PURE__ */ e(G, { className: "h-ico-sm w-ico-sm text-error-11" }),
+                            /* @__PURE__ */ e("span", { className: "text-ds-md text-error-11", children: "Logout" })
                           ]
                         }
                       )