@devalok/shilp-sutra 0.21.0 → 0.22.0

package/dist/shell/notification-center.js

@@ -1,37 +1,37 @@
 "use client";
-import { jsxs as l, jsx as t, Fragment as H } from "react/jsx-runtime";
-import * as O from "react";
-import { useRef as $, useCallback as x } from "react";
-import { formatRelativeTime as z } from "../ui/lib/date-utils.js";
-import { Popover as B, PopoverTrigger as G, PopoverContent as X } from "../ui/popover.js";
-import { Tooltip as _, TooltipTrigger as q, TooltipContent as F } from "../ui/tooltip.js";
-import { IconBell as J, IconChecks as L, IconInbox as Q, IconX as U } from "@tabler/icons-react";
+import { jsxs as a, jsx as e, Fragment as $ } from "react/jsx-runtime";
+import * as z from "react";
+import { useRef as B, useCallback as x } from "react";
+import { formatRelativeTime as G } from "../ui/lib/date-utils.js";
+import { Popover as X, PopoverTrigger as _, PopoverContent as q } from "../ui/popover.js";
+import { Tooltip as F, TooltipTrigger as J, TooltipContent as L } from "../ui/tooltip.js";
+import { IconBell as Q, IconChecks as U, IconInbox as V, IconX as W } from "@tabler/icons-react";
 import { cn as p } from "../ui/lib/utils.js";
-import { Spinner as V } from "../ui/spinner.js";
-import { m as W } from "../_chunks/framer.js";
-function y(e, a) {
-  return e.getFullYear() === a.getFullYear() && e.getMonth() === a.getMonth() && e.getDate() === a.getDate();
+import { Spinner as Z } from "../ui/spinner.js";
+import { m as N } from "../_chunks/framer.js";
+function v(t, d) {
+  return t.getFullYear() === d.getFullYear() && t.getMonth() === d.getMonth() && t.getDate() === d.getDate();
 }
-function Z(e) {
-  const a = new Date(e), i = /* @__PURE__ */ new Date(), d = /* @__PURE__ */ new Date();
-  return d.setDate(i.getDate() - 1), y(a, i) ? "Today" : y(a, d) ? "Yesterday" : "Earlier";
+function M(t) {
+  const d = new Date(t), i = /* @__PURE__ */ new Date(), l = /* @__PURE__ */ new Date();
+  return l.setDate(i.getDate() - 1), v(d, i) ? "Today" : v(d, l) ? "Yesterday" : "Earlier";
 }
-const v = {
+const w = {
   INFO: "bg-info-9",
   IMPORTANT: "bg-warning-9",
   CRITICAL: "bg-error-9"
 };
-function M({
-  notification: e,
-  onRead: a,
+function ee({
+  notification: t,
+  onRead: d,
   onNavigate: i,
-  getRoute: d,
+  getRoute: l,
   onDismiss: u
 }) {
-  const g = d(e), o = () => {
-    e.isRead || a(e.id), g && i(g);
+  const g = l(t), o = () => {
+    t.isRead || d(t.id), g && i(g);
   };
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ a(
     "div",
     {
       role: "button",
@@ -41,50 +41,50 @@ function M({
         (r.key === "Enter" || r.key === " ") && (r.preventDefault(), o());
       },
       className: p(
-        "group relative flex w-full cursor-pointer items-start gap-ds-04 px-ds-05 py-ds-04 text-left transition-colors duration-fast-02",
+        "group relative flex w-full cursor-pointer items-start gap-ds-04 px-ds-05 py-ds-04 text-left transition-colors duration-fast-02 ease-productive-standard",
         "hover:bg-surface-2",
-        !e.isRead && "bg-accent-1"
+        !t.isRead && "bg-accent-1"
       ),
       children: [
-        /* @__PURE__ */ t("div", { className: "mt-ds-02b flex shrink-0", children: /* @__PURE__ */ t(
+        /* @__PURE__ */ e("div", { className: "mt-ds-02b flex shrink-0", children: /* @__PURE__ */ e(
           "span",
           {
             className: p(
-              "h-[8px] w-[8px] rounded-ds-full transition-opacity duration-fast-02",
-              v[e.tier] || v.INFO,
-              e.isRead ? "opacity-20" : "opacity-100"
+              "h-[8px] w-[8px] rounded-ds-full transition-opacity duration-fast-02 ease-productive-standard",
+              w[t.tier] || w.INFO,
+              t.isRead ? "opacity-20" : "opacity-100"
             )
           }
         ) }),
-        /* @__PURE__ */ l("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ t(
+        /* @__PURE__ */ a("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ e(
             "p",
             {
               className: p(
                 "truncate text-ds-md text-surface-fg",
-                !e.isRead && "font-semibold"
+                !t.isRead && "font-semibold"
               ),
-              children: e.title
+              children: t.title
             }
           ),
-          e.body && /* @__PURE__ */ t("p", { className: "mt-ds-01 line-clamp-2 text-ds-sm text-surface-fg-subtle", children: e.body }),
-          /* @__PURE__ */ l("div", { className: "mt-ds-02 flex items-center gap-ds-03", children: [
-            /* @__PURE__ */ t("span", { className: "text-ds-sm text-surface-fg-subtle", children: z(e.createdAt) }),
-            e.project && /* @__PURE__ */ l(H, { children: [
-              /* @__PURE__ */ t("span", { className: "text-surface-fg-subtle", children: "·" }),
-              /* @__PURE__ */ t("span", { className: "truncate text-ds-sm text-surface-fg-subtle", children: e.project.title })
+          t.body && /* @__PURE__ */ e("p", { className: "mt-ds-01 line-clamp-2 text-ds-sm text-surface-fg-subtle", children: t.body }),
+          /* @__PURE__ */ a("div", { className: "mt-ds-02 flex items-center gap-ds-03", children: [
+            /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-subtle", children: G(t.createdAt) }),
+            t.project && /* @__PURE__ */ a($, { children: [
+              /* @__PURE__ */ e("span", { className: "text-surface-fg-subtle", children: "·" }),
+              /* @__PURE__ */ e("span", { className: "truncate text-ds-sm text-surface-fg-subtle", children: t.project.title })
             ] })
           ] }),
-          e.actions && e.actions.length > 0 && /* @__PURE__ */ t("div", { className: "mt-ds-03 flex items-center gap-ds-02", children: e.actions.map((r) => /* @__PURE__ */ t(
+          t.actions && t.actions.length > 0 && /* @__PURE__ */ e("div", { className: "mt-ds-03 flex items-center gap-ds-02", children: t.actions.map((r) => /* @__PURE__ */ e(
             "button",
             {
               type: "button",
               onClick: (c) => {
-                c.stopPropagation(), r.onClick(e.id);
+                c.stopPropagation(), r.onClick(t.id);
               },
               onKeyDown: (c) => c.stopPropagation(),
               className: p(
-                "rounded-ds-md px-ds-03 py-ds-01 text-ds-sm font-medium transition-colors duration-fast-02",
+                "rounded-ds-md px-ds-03 py-ds-01 text-ds-sm font-medium transition-colors duration-fast-02 ease-productive-standard",
                 r.variant === "primary" ? "bg-accent-9 text-accent-fg hover:bg-accent-10" : r.variant === "danger" ? "text-error-11 hover:bg-error-3" : "text-surface-fg-muted hover:bg-surface-3"
               ),
               children: r.label
@@ -92,80 +92,80 @@ function M({
             r.label
           )) })
         ] }),
-        u && /* @__PURE__ */ t(
+        u && /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            "aria-label": `Dismiss notification: ${e.title}`,
+            "aria-label": `Dismiss notification: ${t.title}`,
             onClick: (r) => {
-              r.stopPropagation(), u(e.id);
+              r.stopPropagation(), u(t.id);
             },
             onKeyDown: (r) => r.stopPropagation(),
-            className: "absolute right-ds-03 top-ds-03 hidden rounded-ds-sm p-ds-01 text-surface-fg-subtle transition-colors duration-fast-02 hover:bg-surface-3 hover:text-surface-fg-muted group-hover:flex group-focus-within:flex",
-            children: /* @__PURE__ */ t(U, { className: "h-ico-sm w-ico-sm" })
+            className: "absolute right-ds-03 top-ds-03 hidden rounded-ds-sm p-ds-01 text-surface-fg-subtle transition-[color,background-color,opacity] duration-fast-01 ease-productive-standard hover:bg-surface-3 hover:text-surface-fg-muted group-hover:flex group-focus-within:flex",
+            children: /* @__PURE__ */ e(W, { className: "h-ico-sm w-ico-sm" })
           }
         )
       ]
     }
   );
 }
-const ee = O.forwardRef(
+const te = z.forwardRef(
   ({
-    notifications: e = [],
-    unreadCount: a,
+    notifications: t = [],
+    unreadCount: d,
     open: i,
-    onOpenChange: d,
+    onOpenChange: l,
     isLoading: u = !1,
     hasMore: g = !1,
     onFetchMore: o,
     onMarkRead: h,
     onMarkAllRead: r,
     onNavigate: c,
-    getNotificationRoute: w,
-    onDismiss: D,
-    headerActions: I,
-    emptyState: C,
+    getNotificationRoute: D,
+    onDismiss: I,
+    headerActions: C,
+    emptyState: T,
     footerSlot: b,
-    popoverClassName: T,
-    className: j,
-    ...R
-  }, k) => {
-    const N = $(null), n = a ?? e.filter((s) => !s.isRead).length, P = w ?? (() => null), K = x(
+    popoverClassName: j,
+    className: R,
+    ...k
+  }, P) => {
+    const y = B(null), n = d ?? t.filter((s) => !s.isRead).length, K = D ?? (() => null), Y = x(
       (s) => {
-        d == null || d(!1), c == null || c(s);
+        l == null || l(!1), c == null || c(s);
       },
-      [c, d]
-    ), Y = x(
+      [c, l]
+    ), E = x(
       (s) => {
         h == null || h(s);
       },
       [h]
-    ), E = x(() => {
-      const s = N.current;
+    ), S = x(() => {
+      const s = y.current;
       !s || u || !g || s.scrollTop + s.clientHeight >= s.scrollHeight - 50 && (o == null || o());
-    }, [u, g, o]), S = e.reduce(
+    }, [u, g, o]), A = t.reduce(
       (s, m) => {
-        const f = Z(m.createdAt);
+        const f = M(m.createdAt);
         return s[f] || (s[f] = []), s[f].push(m), s;
       },
       {}
-    ), A = ["Today", "Yesterday", "Earlier"];
-    return /* @__PURE__ */ l(B, { open: i, onOpenChange: d, children: [
-      /* @__PURE__ */ l(_, { children: [
-        /* @__PURE__ */ t(q, { asChild: !0, children: /* @__PURE__ */ t(G, { asChild: !0, children: /* @__PURE__ */ l(
+    ), H = ["Today", "Yesterday", "Earlier"];
+    return /* @__PURE__ */ a(X, { open: i, onOpenChange: l, children: [
+      /* @__PURE__ */ a(F, { children: [
+        /* @__PURE__ */ e(J, { asChild: !0, children: /* @__PURE__ */ e(_, { asChild: !0, children: /* @__PURE__ */ a(
           "button",
           {
-            ...R,
-            ref: k,
+            ...k,
+            ref: P,
             "aria-label": n > 0 ? `Notifications, ${n} unread` : "Notifications",
             className: p(
-              "relative 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",
-              j
+              "relative 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 ease-productive-standard hover:bg-surface-3",
+              R
             ),
             children: [
-              /* @__PURE__ */ t(J, { className: "h-ico-sm w-ico-sm", "aria-hidden": "true" }),
-              n > 0 && /* @__PURE__ */ t(
-                W.span,
+              /* @__PURE__ */ e(Q, { className: "h-ico-sm w-ico-sm", "aria-hidden": "true" }),
+              n > 0 && /* @__PURE__ */ e(
+                N.span,
                 {
                   initial: { rotate: 0 },
                   animate: { rotate: [0, -3, 3, -1, 1, 0] },
@@ -177,79 +177,87 @@ const ee = O.forwardRef(
             ]
           }
         ) }) }),
-        /* @__PURE__ */ t(F, { side: "bottom", align: "center", children: "Notifications" })
+        /* @__PURE__ */ e(L, { side: "bottom", align: "center", children: "Notifications" })
       ] }),
-      /* @__PURE__ */ l(
-        X,
+      /* @__PURE__ */ a(
+        q,
         {
           className: p(
             "w-[380px] rounded-ds-xl border border-surface-border-strong bg-surface-1 p-0 shadow-03",
-            T
+            j
           ),
           sideOffset: 8,
           align: "end",
           children: [
-            /* @__PURE__ */ l("div", { className: "flex items-center justify-between border-b border-surface-border-strong px-ds-05 py-ds-04", children: [
-              /* @__PURE__ */ l("div", { className: "flex items-center gap-ds-03", children: [
-                /* @__PURE__ */ t("h3", { className: "text-ds-md font-semibold text-surface-fg", children: "Notifications" }),
-                n > 0 && /* @__PURE__ */ t("span", { className: "flex h-5 min-w-5 items-center justify-center rounded-ds-full bg-accent-2 px-ds-02b text-ds-sm font-semibold text-accent-11", children: n })
+            /* @__PURE__ */ a("div", { className: "flex items-center justify-between border-b border-surface-border-strong px-ds-05 py-ds-04", children: [
+              /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-03", children: [
+                /* @__PURE__ */ e("h3", { className: "text-ds-md font-semibold text-surface-fg", children: "Notifications" }),
+                n > 0 && /* @__PURE__ */ e("span", { className: "flex h-5 min-w-5 items-center justify-center rounded-ds-full bg-accent-2 px-ds-02b text-ds-sm font-semibold text-accent-11", children: n })
               ] }),
-              /* @__PURE__ */ l("div", { className: "flex items-center gap-ds-03", children: [
-                n > 0 && r && /* @__PURE__ */ l(
+              /* @__PURE__ */ a("div", { className: "flex items-center gap-ds-03", children: [
+                n > 0 && r && /* @__PURE__ */ a(
                   "button",
                   {
                     type: "button",
                     onClick: r,
                     className: "flex items-center gap-ds-02 text-ds-sm text-surface-fg-subtle transition-colors hover:text-accent-11",
                     children: [
-                      /* @__PURE__ */ t(L, { className: "h-ico-sm w-ico-sm" }),
+                      /* @__PURE__ */ e(U, { className: "h-ico-sm w-ico-sm" }),
                       "Mark all read"
                     ]
                   }
                 ),
-                I
+                C
               ] })
             ] }),
-            /* @__PURE__ */ l(
+            /* @__PURE__ */ a(
               "div",
               {
-                ref: N,
-                onScroll: E,
+                ref: y,
+                onScroll: S,
                 className: "max-h-[420px] overflow-y-auto",
                 children: [
-                  e.length === 0 ? C || /* @__PURE__ */ l("div", { className: "flex flex-col items-center justify-center px-ds-05 py-ds-09", children: [
-                    /* @__PURE__ */ t("div", { className: "flex h-ds-lg w-ds-lg items-center justify-center rounded-ds-full bg-surface-2", children: /* @__PURE__ */ t(Q, { className: "h-ico-lg w-ico-lg text-surface-fg-subtle" }) }),
-                    /* @__PURE__ */ t("p", { className: "mt-ds-04 text-ds-md text-surface-fg-subtle", children: "No notifications yet" }),
-                    /* @__PURE__ */ t("p", { className: "mt-ds-02 text-ds-sm text-surface-fg-subtle", children: "You're all caught up!" })
-                  ] }) : A.map((s) => {
-                    const m = S[s];
-                    return !m || m.length === 0 ? null : /* @__PURE__ */ l("div", { children: [
-                      /* @__PURE__ */ t("div", { className: "sticky top-0 z-raised bg-surface-1 px-ds-05 py-ds-02b", children: /* @__PURE__ */ t("span", { className: "text-ds-sm font-medium text-surface-fg-subtle", children: s }) }),
-                      m.map((f) => /* @__PURE__ */ t(
-                        M,
+                  t.length === 0 ? T || /* @__PURE__ */ a("div", { className: "flex flex-col items-center justify-center px-ds-05 py-ds-09", children: [
+                    /* @__PURE__ */ e("div", { className: "flex h-ds-lg w-ds-lg items-center justify-center rounded-ds-full bg-surface-2", children: /* @__PURE__ */ e(V, { className: "h-ico-lg w-ico-lg text-surface-fg-subtle" }) }),
+                    /* @__PURE__ */ e("p", { className: "mt-ds-04 text-ds-md text-surface-fg-subtle", children: "No notifications yet" }),
+                    /* @__PURE__ */ e("p", { className: "mt-ds-02 text-ds-sm text-surface-fg-subtle", children: "You're all caught up!" })
+                  ] }) : H.map((s) => {
+                    const m = A[s];
+                    return !m || m.length === 0 ? null : /* @__PURE__ */ a("div", { children: [
+                      /* @__PURE__ */ e("div", { className: "sticky top-0 z-raised bg-surface-1 px-ds-05 py-ds-02b", children: /* @__PURE__ */ e("span", { className: "text-ds-sm font-medium text-surface-fg-subtle", children: s }) }),
+                      m.map((f, O) => /* @__PURE__ */ e(
+                        N.div,
                         {
-                          notification: f,
-                          onRead: Y,
-                          onNavigate: K,
-                          getRoute: P,
-                          onDismiss: D
+                          initial: { opacity: 0 },
+                          animate: { opacity: 1 },
+                          transition: { delay: O * 0.03 },
+                          children: /* @__PURE__ */ e(
+                            ee,
+                            {
+                              notification: f,
+                              onRead: E,
+                              onNavigate: Y,
+                              getRoute: K,
+                              onDismiss: I
+                            }
+                          )
                         },
                         f.id
                       ))
                     ] }, s);
                   }),
-                  u && /* @__PURE__ */ t("div", { className: "flex items-center justify-center py-ds-05", children: /* @__PURE__ */ t(V, {}) })
+                  u && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-ds-05", children: /* @__PURE__ */ e(Z, {}) })
                 ]
               }
             ),
-            b && /* @__PURE__ */ t("div", { className: "border-t border-surface-border-strong px-ds-05 py-ds-03", children: b })
+            b && /* @__PURE__ */ e("div", { className: "border-t border-surface-border-strong px-ds-05 py-ds-03", children: b })
           ]
         }
       )
     ] });
   }
 );
-ee.displayName = "NotificationCenter";
+te.displayName = "NotificationCenter";
 export {
-  ee as NotificationCenter
+  te as NotificationCenter
 };

package/dist/shell/sidebar.js

@@ -45,7 +45,7 @@ function re({ className: r }) {
     }
   );
 }
-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-3 hover:text-surface-fg";
+const B = "relative gap-ds-04 rounded-ds-lg px-ds-04 py-ds-03 transition-colors duration-fast-02", 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-3 hover:text-surface-fg";
 function se({
   item: r,
   isActive: t,
@@ -216,7 +216,7 @@ const ne = m.forwardRef(
           ] }),
           a ? /* @__PURE__ */ s(M, { className: "gap-ds-03 px-ds-06 py-ds-05", children: [
             a.slot && /* @__PURE__ */ e("div", { children: a.slot }),
-            a.promo && /* @__PURE__ */ s("div", { className: "relative rounded-ds-lg border border-surface-border bg-surface-2 p-ds-04", children: [
+            a.promo && /* @__PURE__ */ s("div", { className: "relative rounded-ds-lg border border-surface-border bg-surface-2 p-ds-04 shadow-01", children: [
               a.promo.onDismiss && /* @__PURE__ */ e(
                 "button",
                 {

package/dist/shell/top-bar.js

@@ -87,7 +87,7 @@ const C = l.forwardRef(({ icon: r, tooltip: s, className: t, ...a }, n) => /* @_
       ref: n,
       type: "button",
       className: d(
-        "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-full border border-surface-border-strong bg-surface-3 text-surface-fg-muted transition-colors hover:bg-surface-4",
+        "flex h-ds-sm-plus w-ds-sm-plus items-center justify-center rounded-ds-full border border-surface-border-strong bg-surface-3 text-surface-fg-muted transition-[color,background-color,border-color,transform] hover:bg-surface-4 active:scale-90 duration-fast-01 ease-productive-standard",
         t
       ),
       ...a,
@@ -97,7 +97,7 @@ const C = l.forwardRef(({ icon: r, tooltip: s, className: t, ...a }, n) => /* @_
   /* @__PURE__ */ e(w, { side: "bottom", align: "center", children: s })
 ] }));
 C.displayName = "TopBar.IconButton";
-const M = l.forwardRef(
+const k = l.forwardRef(
   ({ className: r, children: s, ...t }, a) => /* @__PURE__ */ e(
     "h2",
     {
@@ -111,11 +111,11 @@ const M = l.forwardRef(
     }
   )
 );
-M.displayName = "TopBar.Title";
-const R = l.forwardRef(
+k.displayName = "TopBar.Title";
+const M = l.forwardRef(
   ({ user: r, onNavigate: s, onLogout: t, userMenuItems: a, className: n }, i) => {
     var u;
-    const { colorMode: m, toggleColorMode: k } = U();
+    const { colorMode: m, toggleColorMode: R } = U();
     return /* @__PURE__ */ c(S, { children: [
       /* @__PURE__ */ c(x, { children: [
         /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ e(F, { asChild: !0, children: /* @__PURE__ */ e(
@@ -196,7 +196,7 @@ const R = l.forwardRef(
               f,
               {
                 className: "flex w-full cursor-pointer items-center gap-ds-03 px-ds-05 py-ds-04 hover:bg-surface-2",
-                onClick: k,
+                onClick: R,
                 children: [
                   m === "dark" ? /* @__PURE__ */ e(z, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) : /* @__PURE__ */ e(E, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }),
                   /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg-muted", children: m === "dark" ? "Light Mode" : "Dark Mode" })
@@ -223,15 +223,15 @@ const R = l.forwardRef(
     ] });
   }
 );
-R.displayName = "TopBar.UserMenu";
+M.displayName = "TopBar.UserMenu";
 const X = Object.assign(N, {
   Left: T,
   Center: p,
   Right: y,
   Section: B,
   IconButton: C,
-  Title: M,
-  UserMenu: R
+  Title: k,
+  UserMenu: M
 });
 export {
   X as TopBar

package/dist/tailwind/index.cjs

@@ -1,4 +1,5 @@
-const r = {
+import { aj as a } from "../_chunks/vendor-utils.js";
+const o = {
   /**
    * Dark mode uses the `.dark` class strategy. If your app uses `darkMode: 'media'`,
    * set it explicitly in your own tailwind.config — your config takes precedence.
@@ -345,10 +346,36 @@ const r = {
         popover: "var(--z-popover)",
         toast: "var(--z-toast)",
         tooltip: "var(--z-tooltip)"
+      },
+      fontVariantNumeric: {
+        tabular: "tabular-nums"
       }
     }
   },
-  plugins: []
+  plugins: [
+    a(({ addUtilities: r }) => {
+      r({
+        ".focus-ring": {
+          "&:focus-visible": {
+            outline: "none",
+            "box-shadow": "0 0 0 2px var(--color-surface-1), 0 0 0 4px var(--color-accent-9)"
+          }
+        },
+        ".focus-ring-inset": {
+          "&:focus-visible": {
+            outline: "none",
+            "box-shadow": "inset 0 0 0 2px var(--color-accent-9)"
+          }
+        },
+        ".focus-ring-sm": {
+          "&:focus-visible": {
+            outline: "none",
+            "box-shadow": "0 0 0 1px var(--color-accent-7)"
+          }
+        }
+      });
+    })
+  ]
 };
-module.exports = r;
+module.exports = o;
 module.exports.default = module.exports;

package/dist/tailwind/preset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preset.d.ts","sourceRoot":"","sources":["../../src/tailwind/preset.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CAsW3B,CAAA;AAED,eAAe,MAAM,CAAA"}
+{"version":3,"file":"preset.d.ts","sourceRoot":"","sources":["../../src/tailwind/preset.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CAiY3B,CAAA;AAED,eAAe,MAAM,CAAA"}

package/dist/tailwind/preset.js

@@ -1,4 +1,5 @@
-const r = {
+import { aj as a } from "../_chunks/vendor-utils.js";
+const o = {
   /**
    * Dark mode uses the `.dark` class strategy. If your app uses `darkMode: 'media'`,
    * set it explicitly in your own tailwind.config — your config takes precedence.
@@ -345,11 +346,37 @@ const r = {
         popover: "var(--z-popover)",
         toast: "var(--z-toast)",
         tooltip: "var(--z-tooltip)"
+      },
+      fontVariantNumeric: {
+        tabular: "tabular-nums"
       }
     }
   },
-  plugins: []
+  plugins: [
+    a(({ addUtilities: r }) => {
+      r({
+        ".focus-ring": {
+          "&:focus-visible": {
+            outline: "none",
+            "box-shadow": "0 0 0 2px var(--color-surface-1), 0 0 0 4px var(--color-accent-9)"
+          }
+        },
+        ".focus-ring-inset": {
+          "&:focus-visible": {
+            outline: "none",
+            "box-shadow": "inset 0 0 0 2px var(--color-accent-9)"
+          }
+        },
+        ".focus-ring-sm": {
+          "&:focus-visible": {
+            outline: "none",
+            "box-shadow": "0 0 0 1px var(--color-accent-7)"
+          }
+        }
+      });
+    })
+  ]
 };
 export {
-  r as default
+  o as default
 };

package/dist/tokens/semantic.css

@@ -258,11 +258,11 @@
   /* ═══════════════════════════════════════════════════════════
      SHADOWS
      ═══════════════════════════════════════════════════════════ */
-  --shadow-01: 0 1px 2px oklch(0 0 0 / 0.10);
-  --shadow-02: 0 2px 6px oklch(0 0 0 / 0.12);
-  --shadow-03: 0 4px 16px oklch(0 0 0 / 0.14);
-  --shadow-04: 0 8px 32px oklch(0 0 0 / 0.18);
-  --shadow-05: 0 16px 48px oklch(0 0 0 / 0.22);
+  --shadow-01: 0 1px 1px oklch(0 0 0 / 0.06), 0 1px 3px oklch(0 0 0 / 0.10), 0 2px 6px oklch(0 0 0 / 0.08);
+  --shadow-02: 0 1px 2px oklch(0 0 0 / 0.08), 0 4px 8px oklch(0 0 0 / 0.12), 0 8px 24px oklch(0 0 0 / 0.10);
+  --shadow-03: 0 2px 4px oklch(0 0 0 / 0.08), 0 8px 16px oklch(0 0 0 / 0.12), 0 16px 40px oklch(0 0 0 / 0.10);
+  --shadow-04: 0 2px 4px oklch(0 0 0 / 0.10), 0 12px 24px oklch(0 0 0 / 0.14), 0 24px 56px oklch(0 0 0 / 0.12);
+  --shadow-05: 0 4px 8px oklch(0 0 0 / 0.10), 0 16px 32px oklch(0 0 0 / 0.16), 0 32px 64px oklch(0 0 0 / 0.14);
   --shadow-brand: 0 4px 16px oklch(0.55 0.19 360 / 0.25);
 
   /* ═══════════════════════════════════════════════════════════
@@ -372,11 +372,11 @@
   --color-skeleton-shimmer: var(--neutral-3);
 
   /* Shadows (heavier in dark mode) */
-  --shadow-01: 0 1px 2px oklch(0 0 0 / 0.30);
-  --shadow-02: 0 2px 6px oklch(0 0 0 / 0.40);
-  --shadow-03: 0 4px 16px oklch(0 0 0 / 0.50);
-  --shadow-04: 0 8px 32px oklch(0 0 0 / 0.60);
-  --shadow-05: 0 16px 48px oklch(0 0 0 / 0.70);
+  --shadow-01: 0 1px 1px oklch(0 0 0 / 0.15), 0 1px 3px oklch(0 0 0 / 0.25), 0 2px 6px oklch(0 0 0 / 0.20);
+  --shadow-02: 0 1px 2px oklch(0 0 0 / 0.20), 0 4px 8px oklch(0 0 0 / 0.30), 0 8px 24px oklch(0 0 0 / 0.25);
+  --shadow-03: 0 2px 4px oklch(0 0 0 / 0.20), 0 8px 16px oklch(0 0 0 / 0.30), 0 16px 40px oklch(0 0 0 / 0.25);
+  --shadow-04: 0 2px 4px oklch(0 0 0 / 0.25), 0 12px 24px oklch(0 0 0 / 0.35), 0 24px 56px oklch(0 0 0 / 0.30);
+  --shadow-05: 0 4px 8px oklch(0 0 0 / 0.25), 0 16px 32px oklch(0 0 0 / 0.40), 0 32px 64px oklch(0 0 0 / 0.35);
   --shadow-brand: 0 4px 16px oklch(0.55 0.19 360 / 0.35);
 
   /* Gradients */

package/dist/tokens/typography-semantic.css

@@ -18,12 +18,12 @@
   --typo-heading-2xl-size:     var(--font-size-6xl);
   --typo-heading-2xl-weight:   var(--font-weight-regular);
   --typo-heading-2xl-leading:  var(--line-height-tight);
-  --typo-heading-2xl-tracking: -0.02em;
+  --typo-heading-2xl-tracking: -0.025em;
 
   --typo-heading-xl-size:      var(--font-size-5xl);
   --typo-heading-xl-weight:    var(--font-weight-regular);
   --typo-heading-xl-leading:   var(--line-height-tight);
-  --typo-heading-xl-tracking:  -0.02em;
+  --typo-heading-xl-tracking:  -0.025em;
 
   --typo-heading-lg-size:      var(--font-size-4xl);
   --typo-heading-lg-weight:    var(--font-weight-regular);
@@ -38,7 +38,7 @@
   --typo-heading-sm-size:      var(--font-size-2xl);
   --typo-heading-sm-weight:    var(--font-weight-regular);
   --typo-heading-sm-leading:   var(--line-height-snug);
-  --typo-heading-sm-tracking:  -0.02em;
+  --typo-heading-sm-tracking:  -0.015em;
 
   --typo-heading-xs-size:      var(--font-size-xl);
   --typo-heading-xs-weight:    var(--font-weight-regular);