@devalok/shilp-sutra 0.12.0 → 0.14.0

package/dist/ui/menubar.js

@@ -3,12 +3,12 @@ import { jsx as t, jsxs as i } from "react/jsx-runtime";
 import * as r from "react";
 import { aW as l, aX as m, aY as c, aZ as p, a_ as b, a$ as u, b0 as f, b1 as y, b2 as x, b3 as g, b4 as N, b5 as h, b6 as v, b7 as M, b8 as R, b9 as I } from "../_chunks/primitives.js";
 import { IconChevronRight as S, IconCheck as C, IconCircle as z } from "@tabler/icons-react";
-import { c as o } from "../_chunks/utils.js";
+import { c as d } from "../_chunks/utils.js";
 const D = M, E = v, F = b, H = I, J = R, k = r.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ t(
   l,
   {
     ref: s,
-    className: o(
+    className: d(
       "flex h-ds-sm-plus items-center space-x-ds-02 rounded-ds-lg border border-border bg-layer-01 p-ds-02 shadow-01",
       e
     ),
@@ -20,7 +20,7 @@ const _ = r.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ t(
   m,
   {
     ref: s,
-    className: o(
+    className: d(
       "flex cursor-default select-none items-center rounded-ds-sm px-ds-04 py-ds-02 text-ds-md font-medium outline-none transition-colors hover:bg-field focus-visible:bg-field data-[state=open]:bg-field",
       e
     ),
@@ -28,16 +28,16 @@ const _ = r.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ t(
   }
 ));
 _.displayName = m.displayName;
-const j = r.forwardRef(({ className: e, inset: a, children: s, ...d }, n) => /* @__PURE__ */ i(
+const j = r.forwardRef(({ className: e, inset: a, children: s, ...o }, n) => /* @__PURE__ */ i(
   c,
   {
     ref: n,
-    className: o(
+    className: d(
       "flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-none focus:bg-layer-02 data-[state=open]:bg-layer-02 [&_svg]:pointer-events-none [&_svg]:h-ico-sm [&_svg]:w-ico-sm [&_svg]:shrink-0",
       a && "pl-ds-07",
       e
     ),
-    ...d,
+    ...o,
     children: [
       s,
       /* @__PURE__ */ t(S, { className: "ml-auto" })
@@ -49,8 +49,8 @@ const G = r.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ t(
   p,
   {
     ref: s,
-    className: o(
-      "z-dropdown min-w-[8rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 p-ds-02 text-text-primary shadow-03 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+    className: d(
+      "z-popover min-w-[8rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 p-ds-02 text-text-primary shadow-03 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       e
     ),
     ...a
@@ -58,15 +58,15 @@ const G = r.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ t(
 ));
 G.displayName = p.displayName;
 const T = r.forwardRef(
-  ({ className: e, align: a = "start", alignOffset: s = -4, sideOffset: d = 8, ...n }, w) => /* @__PURE__ */ t(b, { children: /* @__PURE__ */ t(
+  ({ className: e, align: a = "start", alignOffset: s = -4, sideOffset: o = 8, ...n }, w) => /* @__PURE__ */ t(b, { children: /* @__PURE__ */ t(
     u,
     {
       ref: w,
       align: a,
       alignOffset: s,
-      sideOffset: d,
-      className: o(
-        "z-dropdown min-w-[12rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 p-ds-02 text-text-primary shadow-03",
+      sideOffset: o,
+      className: d(
+        "z-popover min-w-[12rem] rounded-ds-lg border border-border bg-layer-01 p-ds-02 text-text-primary shadow-03",
         "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         e
       ),
@@ -75,11 +75,11 @@ const T = r.forwardRef(
   ) })
 );
 T.displayName = u.displayName;
-const L = r.forwardRef(({ className: e, inset: a, ...s }, d) => /* @__PURE__ */ t(
+const L = r.forwardRef(({ className: e, inset: a, ...s }, o) => /* @__PURE__ */ t(
   f,
   {
-    ref: d,
-    className: o(
+    ref: o,
+    className: d(
       "relative flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-none transition-colors focus:bg-layer-02 focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-[0.38] [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
       a && "pl-ds-07",
       e
@@ -88,16 +88,16 @@ const L = r.forwardRef(({ className: e, inset: a, ...s }, d) => /* @__PURE__ */
   }
 ));
 L.displayName = f.displayName;
-const P = r.forwardRef(({ className: e, children: a, checked: s, ...d }, n) => /* @__PURE__ */ i(
+const P = r.forwardRef(({ className: e, children: a, checked: s, ...o }, n) => /* @__PURE__ */ i(
   y,
   {
     ref: n,
-    className: o(
+    className: d(
       "relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-none transition-colors focus:bg-layer-02 focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-[0.38]",
       e
     ),
     checked: s,
-    ...d,
+    ...o,
     children: [
       /* @__PURE__ */ t("span", { className: "absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center", children: /* @__PURE__ */ t(x, { children: /* @__PURE__ */ t(C, { className: "h-ico-sm w-ico-sm" }) }) }),
       a
@@ -105,11 +105,11 @@ const P = r.forwardRef(({ className: e, children: a, checked: s, ...d }, n) => /
   }
 ));
 P.displayName = y.displayName;
-const W = r.forwardRef(({ className: e, children: a, ...s }, d) => /* @__PURE__ */ i(
+const W = r.forwardRef(({ className: e, children: a, ...s }, o) => /* @__PURE__ */ i(
   g,
   {
-    ref: d,
-    className: o(
+    ref: o,
+    className: d(
       "relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-none transition-colors focus:bg-layer-02 focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-[0.38]",
       e
     ),
@@ -121,11 +121,11 @@ const W = r.forwardRef(({ className: e, children: a, ...s }, d) => /* @__PURE__
   }
 ));
 W.displayName = g.displayName;
-const X = r.forwardRef(({ className: e, inset: a, ...s }, d) => /* @__PURE__ */ t(
+const X = r.forwardRef(({ className: e, inset: a, ...s }, o) => /* @__PURE__ */ t(
   N,
   {
-    ref: d,
-    className: o(
+    ref: o,
+    className: d(
       "px-ds-03 py-ds-02b text-ds-md font-semibold",
       a && "pl-ds-07",
       e
@@ -138,7 +138,7 @@ const Y = r.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ t(
   h,
   {
     ref: s,
-    className: o("-mx-ds-01 my-ds-02 h-px bg-border-subtle", e),
+    className: d("-mx-ds-01 my-ds-02 h-px bg-border-subtle", e),
     ...a
   }
 ));
@@ -149,7 +149,7 @@ const Z = ({
 }) => /* @__PURE__ */ t(
   "span",
   {
-    className: o(
+    className: d(
       "ml-auto text-ds-sm text-text-placeholder",
       e
     ),

package/dist/ui/progress.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsxs as t, jsx as n } from "react/jsx-runtime";
-import * as p from "react";
-import { aU as i, aV as u } from "../_chunks/primitives.js";
+import * as u from "react";
+import { aU as i, aV as g } from "../_chunks/primitives.js";
 import { e as o } from "../_chunks/vendor-utils.js";
-import { c as a } from "../_chunks/utils.js";
+import { c as e } from "../_chunks/utils.js";
 const x = o(
   "relative w-full overflow-hidden rounded-ds-full bg-layer-02",
   {
@@ -17,7 +17,7 @@ const x = o(
     defaultVariants: { size: "md" }
   }
 ), h = o(
-  "h-full w-full flex-1 transition-all",
+  "h-full w-full flex-1 transition-all duration-moderate-02 ease-expressive-standard",
   {
     variants: {
       color: {
@@ -29,48 +29,48 @@ const x = o(
     },
     defaultVariants: { color: "default" }
   }
-), w = p.forwardRef(
+), v = u.forwardRef(
   ({
     className: l,
     value: r,
-    size: c,
-    color: d,
+    size: d,
+    color: c,
     indicatorClassName: m,
-    showLabel: e,
+    showLabel: s,
     ...f
-  }, g) => {
-    const s = r == null;
-    return /* @__PURE__ */ t("div", { className: a("flex items-center gap-ds-03", e && "w-full"), children: [
+  }, p) => {
+    const a = r == null;
+    return /* @__PURE__ */ t("div", { className: e("flex items-center gap-ds-03", s && "w-full"), children: [
       /* @__PURE__ */ n(
         i,
         {
-          ref: g,
-          value: s ? null : r,
-          className: a(x({ size: c }), l),
+          ref: p,
+          value: a ? null : r,
+          className: e(x({ size: d }), l),
           ...f,
           children: /* @__PURE__ */ n(
-            u,
+            g,
             {
-              className: a(
-                h({ color: d }),
-                s && "w-2/5 animate-progress-indeterminate motion-reduce:animate-none",
+              className: e(
+                h({ color: c }),
+                a && "w-2/5 animate-progress-indeterminate motion-reduce:animate-none",
                 m
               ),
-              style: s ? void 0 : { transform: `translateX(-${100 - (r || 0)}%)` }
+              style: a ? void 0 : { transform: `translateX(-${100 - (r || 0)}%)` }
             }
           )
         }
       ),
-      e && !s && /* @__PURE__ */ t("span", { className: "shrink-0 text-ds-xs text-text-secondary", children: [
+      s && !a && /* @__PURE__ */ t("span", { className: "shrink-0 text-ds-xs text-text-secondary", children: [
         r,
         "%"
       ] })
     ] });
   }
 );
-w.displayName = i.displayName;
+v.displayName = i.displayName;
 export {
-  w as Progress,
+  v as Progress,
   h as progressIndicatorVariants,
   x as progressTrackVariants
 };

package/dist/ui/select.js

@@ -61,7 +61,7 @@ const D = r.forwardRef(({ className: s, children: t, position: a = "popper", ...
   {
     ref: l,
     className: o(
-      "relative z-dropdown max-h-96 min-w-[8rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 text-text-primary shadow-03 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "relative z-popover max-h-96 min-w-[8rem] overflow-hidden rounded-ds-lg border border-border bg-layer-01 text-text-primary shadow-03 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       a === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
       s
     ),

package/dist/ui/slider.js

@@ -1,30 +1,30 @@
 "use client";
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import * as n from "react";
-import { aA as s, aB as c, aC as t, aD as d } from "../_chunks/primitives.js";
+import * as t from "react";
+import { aA as a, aB as c, aC as n, aD as d } from "../_chunks/primitives.js";
 import { c as f } from "../_chunks/utils.js";
-const m = n.forwardRef(({ className: a, "aria-label": o, ...i }, l) => /* @__PURE__ */ r(
-  s,
+const m = t.forwardRef(({ className: s, "aria-label": o, ...i }, l) => /* @__PURE__ */ r(
+  a,
   {
     ref: l,
     className: f(
       "relative flex w-full touch-none select-none items-center",
-      a
+      s
     ),
     ...i,
     children: [
-      /* @__PURE__ */ e(c, { className: "relative h-ds-02b w-full grow overflow-hidden rounded-ds-full bg-field", children: /* @__PURE__ */ e(t, { className: "absolute h-full bg-interactive" }) }),
+      /* @__PURE__ */ e(c, { className: "relative h-ds-02b w-full grow overflow-hidden rounded-ds-full bg-field", children: /* @__PURE__ */ e(n, { className: "absolute h-full bg-interactive" }) }),
       /* @__PURE__ */ e(
         d,
         {
           "aria-label": o,
-          className: "block h-ico-sm w-ico-sm rounded-ds-full border-2 border-interactive bg-layer-01 shadow-01 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-[0.38]"
+          className: "block h-ico-sm w-ico-sm rounded-ds-full border-2 border-interactive bg-layer-01 shadow-01 transition-[color,transform] duration-fast-02 hover:scale-110 active:scale-125 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-[0.38]"
         }
       )
     ]
   }
 ));
-m.displayName = s.displayName;
+m.displayName = a.displayName;
 export {
   m as Slider
 };

package/dist/ui/stat-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;KACrC,CAAA;IACD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACpE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,QAAQ,sFAiEb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;KACrC,CAAA;IACD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACpE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,QAAQ,sFAmEb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/ui/stat-card.js

@@ -1,12 +1,12 @@
 "use client";
 import { jsxs as n, jsx as s } from "react/jsx-runtime";
-import { IconTrendingUp as h, IconTrendingDown as f, IconMinus as g } from "@tabler/icons-react";
-import * as m from "react";
+import { IconTrendingUp as x, IconTrendingDown as f, IconMinus as w } from "@tabler/icons-react";
+import * as a from "react";
 import { c as d } from "../_chunks/utils.js";
-const w = m.forwardRef(
-  ({ className: o, label: c, title: a, value: u, delta: e, icon: r, loading: b, ...t }, i) => {
-    const l = a ?? c ?? "";
-    if (b)
+const N = a.forwardRef(
+  ({ className: o, label: m, title: c, value: l, delta: e, icon: r, loading: u, ...t }, i) => {
+    const b = c ?? m ?? "";
+    if (u)
       return /* @__PURE__ */ n(
         "div",
         {
@@ -23,7 +23,7 @@ const w = m.forwardRef(
           ]
         }
       );
-    const p = (e == null ? void 0 : e.direction) === "up" ? h : (e == null ? void 0 : e.direction) === "down" ? f : g, x = (e == null ? void 0 : e.direction) === "up" ? "text-success" : (e == null ? void 0 : e.direction) === "down" ? "text-error" : "text-text-secondary";
+    const p = (e == null ? void 0 : e.direction) === "up" ? x : (e == null ? void 0 : e.direction) === "down" ? f : w, h = (e == null ? void 0 : e.direction) === "up" ? "text-success" : (e == null ? void 0 : e.direction) === "down" ? "text-error" : "text-text-secondary";
     return /* @__PURE__ */ n(
       "div",
       {
@@ -35,12 +35,12 @@ const w = m.forwardRef(
         ...t,
         children: [
           /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-ds-04", children: [
-            /* @__PURE__ */ s("p", { className: "text-ds-md font-medium text-text-secondary", children: l }),
-            r && /* @__PURE__ */ s("span", { className: "text-text-secondary", "aria-hidden": "true", children: typeof r == "function" ? m.createElement(r, { className: "h-ico-lg w-ico-lg" }) : r })
+            /* @__PURE__ */ s("p", { className: "text-ds-md font-medium text-text-secondary", children: b }),
+            r && /* @__PURE__ */ s("span", { className: "text-text-secondary", "aria-hidden": "true", children: typeof r == "function" ? a.createElement(r, { className: "h-ico-lg w-ico-lg" }) : r })
           ] }),
-          /* @__PURE__ */ s("p", { className: "text-ds-3xl font-semibold text-text-primary tabular-nums", children: u }),
-          e && /* @__PURE__ */ n("div", { className: d("mt-ds-03 flex items-center gap-ds-02 text-ds-sm font-medium", x), children: [
-            /* @__PURE__ */ s(p, { className: "h-ico-sm w-ico-sm", "aria-hidden": "true" }),
+          /* @__PURE__ */ s("div", { className: "overflow-hidden", children: /* @__PURE__ */ s("p", { className: "inline-block animate-count-up text-ds-3xl font-semibold text-text-primary tabular-nums", children: l }) }),
+          e && /* @__PURE__ */ n("div", { className: d("mt-ds-03 flex items-center gap-ds-02 text-ds-sm font-medium", h), children: [
+            /* @__PURE__ */ s(p, { className: "h-ico-sm w-ico-sm animate-stamp", "aria-hidden": "true" }),
             /* @__PURE__ */ s("span", { children: e.value })
           ] })
         ]
@@ -48,7 +48,7 @@ const w = m.forwardRef(
     );
   }
 );
-w.displayName = "StatCard";
+N.displayName = "StatCard";
 export {
-  w as StatCard
+  N as StatCard
 };

package/dist/ui/stepper.js

@@ -25,7 +25,7 @@ const f = t.createContext({
             "div",
             {
               className: i(
-                "flex-1",
+                "flex-1 transition-colors duration-moderate-01 ease-productive-standard",
                 r === "vertical" ? "ml-ds-04 w-ds-01 min-h-ds-05" : "h-ds-01 min-w-ds-05",
                 a < l ? "bg-interactive" : "bg-border"
               ),
@@ -62,7 +62,7 @@ const f = t.createContext({
                 o === "active" && "bg-interactive text-text-on-color",
                 o === "pending" && "bg-layer-02 text-text-tertiary border border-border"
               ),
-              children: c || (o === "completed" ? /* @__PURE__ */ e("svg", { className: "w-ico-sm h-ico-sm", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ e("polyline", { points: "20 6 9 17 4 12" }) }) : n + 1)
+              children: c || (o === "completed" ? /* @__PURE__ */ e("svg", { className: "w-ico-sm h-ico-sm animate-check-pop", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ e("polyline", { points: "20 6 9 17 4 12" }) }) : n + 1)
             }
           ),
           /* @__PURE__ */ x("div", { className: "flex flex-col", children: [

package/dist/ui/switch.js

@@ -17,7 +17,7 @@ const c = n.forwardRef(({ className: t, error: a, ...s }, i) => /* @__PURE__ */
       d,
       {
         className: r(
-          "pointer-events-none block h-ico-md w-ico-md rounded-ds-full bg-text-on-color shadow-02 ring-0 transition-transform duration-fast-01 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+          "pointer-events-none block h-ico-md w-ico-md rounded-ds-full bg-text-on-color shadow-02 ring-0 transition-transform duration-moderate-01 ease-bounce data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
         )
       }
     )

package/dist/ui/tabs.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
 import { bl as d, bm as c, bn as l, bo as m } from "../_chunks/primitives.js";
 import * as s from "react";
 import { e as b } from "../_chunks/vendor-utils.js";
@@ -13,14 +13,14 @@ const C = m, f = s.createContext({ variant: "line" }), p = b("inline-flex items-
   },
   defaultVariants: { variant: "line" }
 }), u = b(
-  "inline-flex items-center justify-center whitespace-nowrap font-sans text-ds-md font-medium transition-[color,background-color,border-color,box-shadow] duration-fast-01 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-[0.38]",
+  "inline-flex items-center justify-center gap-ds-02 whitespace-nowrap font-sans text-ds-md font-medium transition-[color,background-color,border-color,box-shadow] duration-fast-01 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-[0.38]",
   {
     variants: {
       variant: {
         line: [
           "px-ds-05 py-ds-03 -mb-px border-b-2 border-transparent",
           "text-text-secondary hover:text-text-primary",
-          "data-[state=active]:border-interactive data-[state=active]:text-interactive"
+          "data-[state=active]:border-interactive data-[state=active]:text-interactive data-[state=active]:animate-tab-indicator"
         ],
         contained: [
           "px-ds-05 py-ds-02b rounded-ds-md",
@@ -31,39 +31,39 @@ const C = m, f = s.createContext({ variant: "line" }), p = b("inline-flex items-
     },
     defaultVariants: { variant: "line" }
   }
-), x = s.forwardRef(({ className: t, variant: e, ...a }, n) => {
-  const r = e ?? "line";
-  return /* @__PURE__ */ i(f.Provider, { value: { variant: r }, children: /* @__PURE__ */ i(
+), x = s.forwardRef(({ className: t, variant: a, ...e }, n) => {
+  const i = a ?? "line";
+  return /* @__PURE__ */ r(f.Provider, { value: { variant: i }, children: /* @__PURE__ */ r(
     d,
     {
       ref: n,
-      className: o(p({ variant: r }), t),
-      ...a
+      className: o(p({ variant: i }), t),
+      ...e
     }
   ) });
 });
 x.displayName = d.displayName;
-const g = s.forwardRef(({ className: t, variant: e, ...a }, n) => {
-  const r = s.useContext(f), v = e ?? r.variant;
-  return /* @__PURE__ */ i(
+const g = s.forwardRef(({ className: t, variant: a, ...e }, n) => {
+  const i = s.useContext(f), v = a ?? i.variant;
+  return /* @__PURE__ */ r(
     c,
     {
       ref: n,
       className: o(u({ variant: v }), t),
-      ...a
+      ...e
     }
   );
 });
 g.displayName = c.displayName;
-const y = s.forwardRef(({ className: t, ...e }, a) => /* @__PURE__ */ i(
+const y = s.forwardRef(({ className: t, ...a }, e) => /* @__PURE__ */ r(
   l,
   {
-    ref: a,
+    ref: e,
     className: o(
       "mt-ds-05 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2",
       t
     ),
-    ...e
+    ...a
   }
 ));
 y.displayName = l.displayName;

package/dist/ui/toggle.js

@@ -5,7 +5,7 @@ import { aE as e } from "../_chunks/primitives.js";
 import { e as n } from "../_chunks/vendor-utils.js";
 import { c as l } from "../_chunks/utils.js";
 const m = n(
-  "inline-flex items-center justify-center gap-ds-03 rounded-ds-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-[0.38] data-[state=on]:bg-interactive-subtle data-[state=on]:text-interactive",
+  "inline-flex items-center justify-center gap-ds-03 rounded-ds-md font-medium transition-[color,transform] duration-fast-02 active:scale-95 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-[0.38] data-[state=on]:bg-interactive-subtle data-[state=on]:text-interactive",
   {
     variants: {
       variant: {

package/llms-full.txt

@@ -5,7 +5,7 @@
 > All variant values and props verified from source CVA definitions.
 >
 > Package: @devalok/shilp-sutra
-> Version: 0.12.0
+> Version: 0.14.0
 
 ---
 
@@ -1428,9 +1428,11 @@ Note: getFormFieldA11y() was removed in favor of useFormField() hook.
 - Props:
     title: string (REQUIRED)
     description: string
-    icon: ReactNode (default: Devalok chakra icon)
+    icon: ReactNode | ComponentType<{ className?: string }> (default: Devalok chakra icon)
     action: ReactNode (e.g. a Button)
     compact: boolean (smaller layout)
+- Gotchas:
+    - icon accepts both JSX elements (`<IconFolder />`) and component references (`IconFolder`). Component references are auto-instantiated with correct sizing classes.
 - Example:
   <EmptyState
     title="No tasks found"
@@ -1697,9 +1699,16 @@ New fields on NavGroup:
     action: ReactNode — action button rendered next to the group label
 
 New type SidebarFooterConfig:
-    links: Array<{ label: string, href: string }> — legal/utility links as a row
-    version: string — version or build info text
+    links: Array<{ label: string, href: string }> — legal/utility links rendered inline with · dividers
+    version: string | { label: string, href: string } — version text or clickable version link, rendered inline after links
     slot: ReactNode — custom content above the links row
+    promo: SidebarPromo — dismissable promo/upsell banner
+
+New type SidebarPromo:
+    text: string — promo message text
+    icon: ReactNode — optional icon rendered above the text
+    action: { label: string, href?: string, onClick?: () => void } — CTA button
+    onDismiss: () => void — when provided, renders a dismiss X button
 
 Deprecated props:
     footerLinks — use footer.links instead (footerLinks still works for backwards compat)
@@ -1805,7 +1814,8 @@ Deprecated props:
 - Import: @devalok/shilp-sutra/shell/notification-center
 - Server-safe: No
 - Props:
-    notifications: Notification[] — { id, title, body?, tier: "INFO"|"IMPORTANT"|"CRITICAL", isRead, createdAt, entityType?, entityId?, projectId?, project? }
+    notifications: Notification[] — { id, title, body?, tier: "INFO"|"IMPORTANT"|"CRITICAL", isRead, createdAt, entityType?, entityId?, projectId?, project?, actions?: NotificationAction[] }
+    NotificationAction: { label: string, variant?: "primary"|"default"|"danger", onClick: (id: string) => void }
     unreadCount: number (derived from notifications if not provided)
     open: boolean (controlled mode)
     onOpenChange: (open: boolean) => void

package/llms.txt

@@ -4,6 +4,20 @@
 > Built on the same primitives as shadcn/ui but with key API differences.
 > Read this file BEFORE writing any UI code. Do NOT guess from shadcn/ui knowledge.
 
+## CHANGES (v0.14.0)
+- **BREAKING z-index**: Select, Combobox, Autocomplete, DropdownMenu, ContextMenu, Menubar, HoverCard promoted from z-dropdown (1000) to z-popover (1400). Fixes dropdowns rendering behind Sheet/Dialog. If you had custom z-index overrides (e.g. `[data-radix-popper-content-wrapper] { z-index: 1400 !important }`) you can now remove them.
+- TabsTrigger: Added gap-ds-02 (4px) between icon and label
+- AppSidebar: footer.version now accepts string | { label, href } for clickable version links
+
+## CHANGES (v0.13.0)
+- EmptyState: icon prop now accepts ComponentType (e.g. Tabler icon references) in addition to ReactNode
+- NotificationCenter: Notification.actions?: NotificationAction[] — inline action buttons (Approve/Deny) per notification
+- NotificationCenter: Tier dot now doubles as read/unread marker; separate unread dot removed
+- AppSidebar: footer.promo?: SidebarPromo — dismissable promo banner with icon, text, action button
+- AppSidebar: Footer links + version render on same line with · dividers
+- Collapsible: Now uses height-based expand/collapse animation (animate-collapsible-down/up)
+- Tailwind preset: 4 new keyframes + utilities — accordion-down, accordion-up, collapsible-down, collapsible-up
+
 ## CHANGES (v0.12.0)
 - Input: Softer resting border (border-subtle instead of border), subtler focus ring (ring-1 ring-focus/50 instead of ring-2 ring-focus)
 - Tailwind preset: 9 animation keyframes + utilities (fade-in, fade-out, slide-up, slide-right, scale-in, scale-out, glow-pulse, scale-bounce, lift)
@@ -157,7 +171,7 @@ NOTIFICATION SELECTION GUIDE:
 - AvatarGroup: users[], max(number), size(sm|md|lg), showTooltip
 - StatusBadge: DISCRIMINATED UNION — pass status OR color, not both. status(active|pending|approved|rejected|completed|blocked|cancelled|draft) color(success|warning|error|info|neutral) size(sm|md)
 - ContentCard: variant(default|outline|ghost) padding(default|compact|spacious|none)
-- EmptyState: icon, title(required), description, action(ReactNode), compact
+- EmptyState: icon(ReactNode or ComponentType), title(required), description, action(ReactNode), compact
 - PriorityIndicator: priority(LOW|MEDIUM|HIGH|URGENT) display(compact|full)
 - SimpleTooltip: wraps Tooltip compound into single component
 - DatePicker, DateRangePicker, DateTimePicker, TimePicker
@@ -176,13 +190,13 @@ NOTIFICATION SELECTION GUIDE:
 - NavItem.defaultOpen?: boolean — control initial collapsed state
 - NavItem.badge?: string | number — badge on nav item (99+ cap for numbers)
 - NavGroup.action?: ReactNode — action button next to group label
-- footer?: SidebarFooterConfig — structured footer with links, version, slot (replaces footerLinks)
+- footer?: SidebarFooterConfig — structured footer with links, version, slot, promo (replaces footerLinks)
 - headerSlot?: ReactNode — content between user info and navigation
 - preFooterSlot?: ReactNode — content between navigation and footer
 - renderItem?: (item, defaultRender) => ReactNode | null — custom item rendering
 
 - BottomNavbar: mobile navigation, user is optional (not required to render)
-- NotificationCenter: notifications[], onMarkRead, onMarkAllRead, onNavigate, getNotificationRoute?(returns string|null, fallback null), footerSlot?, emptyState?, headerActions?, popoverClassName?, onDismiss?(id)
+- NotificationCenter: notifications[], onMarkRead, onMarkAllRead, onNavigate, getNotificationRoute?(returns string|null, fallback null), footerSlot?, emptyState?, headerActions?, popoverClassName?, onDismiss?(id). Notification.actions?: NotificationAction[] for inline buttons (e.g. Approve/Deny)
 - AppCommandPalette: user, isAdmin, onNavigate, onSearch, searchResults, isSearching, onSearchResultSelect
 
 ### Hooks

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devalok/shilp-sutra",
-  "version": "0.12.0",
+  "version": "0.14.0",
   "description": "Devalok Design System — tokens, components, and patterns for Next.js",
   "license": "MIT",
   "type": "module",