@devalok/shilp-sutra 0.27.2 → 0.29.0

package/dist/ui/skeleton.js

@@ -1,6 +1,6 @@
 import { jsx as l, jsxs as f } from "react/jsx-runtime";
 import * as o from "react";
-import { c as g } from "../_chunks/vendor-utils.js";
+import { a as g } from "../_chunks/vendor-utils.js";
 import { cn as r } from "./lib/utils.js";
 const k = g("bg-skeleton-base", {
   variants: {

package/dist/ui/slider.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs as d, jsx as e } from "react/jsx-runtime";
 import * as f from "react";
-import { aD as r, aE as m, aF as b, aG as u } from "../_chunks/primitives.js";
+import { aE as r, aF as m, aG as b, aH as u } from "../_chunks/primitives.js";
 import { cn as h } from "./lib/utils.js";
 const v = f.forwardRef(({ className: i, "aria-label": l, value: a, defaultValue: o, ...n }, t) => {
   const s = (a ?? o ?? [0]).length;

package/dist/ui/spinner.js

@@ -1,202 +1,202 @@
 "use client";
-import { jsxs as M, jsx as t } from "react/jsx-runtime";
-import * as g from "react";
+import { jsxs as M, jsx as e } from "react/jsx-runtime";
+import * as y from "react";
 import { cn as $ } from "./lib/utils.js";
-import { u as C, m as l, A as L } from "../_chunks/framer.js";
+import { u as v, m as c, A as g } from "../_chunks/framer.js";
 const N = {
   sm: "h-ico-sm w-ico-sm",
   md: "h-ico-md w-ico-md",
   lg: "h-ico-lg w-ico-lg"
-}, S = { sm: 3, md: 3, lg: 4 }, K = { sm: 1.8, md: 2, lg: 2.5 }, o = 10, e = 2 * Math.PI * o, T = {
+}, S = { sm: 3, md: 3, lg: 4 }, K = { sm: 1.8, md: 2, lg: 2.5 }, n = 10, o = 2 * Math.PI * n, T = {
   spinning: "Loading...",
   success: "Complete",
   error: "Error"
-}, F = {
+}, b = {
   spinning: "var(--color-accent-9)",
   success: "var(--color-success-9)",
   error: "var(--color-error-9)"
-}, P = "M7 12.5l3 3 7-7", b = "M8 8l8 8M16 8l-8 8", j = "M5 12.5l4 4 10-10", U = "M6 6l12 12M18 6l-12 12", B = g.forwardRef(
-  ({ size: m = "md", state: n = "spinning", variant: O = "filled", delay: d = 0, onComplete: i, className: E }, I) => {
-    const a = C(), [_, x] = g.useState(d === 0);
-    if (g.useEffect(() => {
-      if (d <= 0) {
+}, F = "M7 12.5l3 3 7-7", P = "M8 8l8 8M16 8l-8 8", j = "M5 12.5l4 4 10-10", U = "M6 6l12 12M18 6l-12 12", B = y.forwardRef(
+  ({ size: k = "md", state: r = "spinning", variant: L = "filled", delay: l = 0, onComplete: C, className: O }, E) => {
+    const s = v(), [I, x] = y.useState(l === 0);
+    if (y.useEffect(() => {
+      if (l <= 0) {
         x(!0);
         return;
       }
-      const W = setTimeout(() => x(!0), d);
+      const W = setTimeout(() => x(!0), l);
       return () => clearTimeout(W);
-    }, [d]), !_) return null;
-    const s = S[m], u = K[m], h = n === "spinning", c = n === "success" || n === "error", r = O === "filled", p = F[n], k = r ? "white" : "currentColor", A = r ? P : j, R = r ? b : U, y = 0.4, w = 0.3, v = 0.25, f = r ? 0.5 : 0.35, D = 0.35;
-    return /* @__PURE__ */ M("span", { ref: I, role: "status", className: $("inline-flex", E), children: [
+    }, [l]), !I) return null;
+    const i = S[k], d = K[k], p = r === "spinning", a = r === "success" || r === "error", t = L === "filled", u = L === "bare" && r === "spinning" ? "currentColor" : b[r], h = t ? "white" : "currentColor", A = t ? F : j, R = t ? P : U, f = 0.4, _ = 0.3, w = 0.25, m = t ? 0.5 : 0.35, D = 0.35;
+    return /* @__PURE__ */ M("span", { ref: E, role: "status", className: $("inline-flex", O), children: [
       /* @__PURE__ */ M(
         "svg",
         {
-          className: N[m],
+          className: N[k],
           viewBox: "0 0 24 24",
           fill: "none",
           xmlns: "http://www.w3.org/2000/svg",
           children: [
-            a ? !(c && !r) && /* @__PURE__ */ t(
+            s ? !(a && !t) && /* @__PURE__ */ e(
               "circle",
               {
                 cx: "12",
                 cy: "12",
-                r: o,
+                r: n,
                 stroke: "var(--color-surface-border)",
-                strokeWidth: s,
+                strokeWidth: i,
                 fill: "none"
               }
-            ) : /* @__PURE__ */ t(
-              l.circle,
+            ) : /* @__PURE__ */ e(
+              c.circle,
               {
                 cx: "12",
                 cy: "12",
-                r: o,
+                r: n,
                 stroke: "var(--color-surface-border)",
-                strokeWidth: s,
+                strokeWidth: i,
                 fill: "none",
-                animate: { opacity: c && !r ? 0 : 1 },
-                transition: { duration: 0.2, delay: c && !r ? y : 0 }
+                animate: { opacity: a && !t ? 0 : 1 },
+                transition: { duration: 0.2, delay: a && !t ? f : 0 }
               }
             ),
-            a ? /* @__PURE__ */ t(
+            s ? /* @__PURE__ */ e(
               "circle",
               {
                 cx: "12",
                 cy: "12",
-                r: o,
-                stroke: p,
-                strokeWidth: s,
+                r: n,
+                stroke: u,
+                strokeWidth: i,
                 fill: "none",
                 strokeLinecap: "round",
-                strokeDasharray: h ? `${e * 0.75} ${e * 0.25}` : `${e} 0`,
+                strokeDasharray: p ? `${o * 0.75} ${o * 0.25}` : `${o} 0`,
                 style: {
                   transformOrigin: "center",
-                  transform: h ? "rotate(-90deg)" : void 0,
-                  opacity: c && !r ? 0 : 1
+                  transform: p ? "rotate(-90deg)" : void 0,
+                  opacity: a && !t ? 0 : 1
                 }
               }
-            ) : /* @__PURE__ */ t(
-              l.circle,
+            ) : /* @__PURE__ */ e(
+              c.circle,
               {
                 cx: "12",
                 cy: "12",
-                r: o,
-                stroke: p,
-                strokeWidth: s,
+                r: n,
+                stroke: u,
+                strokeWidth: i,
                 fill: "none",
                 strokeLinecap: "round",
                 style: { transformOrigin: "center" },
-                animate: h ? {
+                animate: p ? {
                   rotate: [0, 360],
                   strokeDasharray: [
-                    `${e * 0.1} ${e * 0.9}`,
-                    `${e * 0.75} ${e * 0.25}`,
-                    `${e * 0.1} ${e * 0.9}`
+                    `${o * 0.1} ${o * 0.9}`,
+                    `${o * 0.75} ${o * 0.25}`,
+                    `${o * 0.1} ${o * 0.9}`
                   ]
                 } : {
                   rotate: 0,
-                  strokeDasharray: `${e} 0`,
+                  strokeDasharray: `${o} 0`,
                   // In bare mode, fade out the arc after it completes
-                  ...!r && { opacity: 0 }
+                  ...!t && { opacity: 0 }
                 },
-                transition: h ? {
+                transition: p ? {
                   rotate: { duration: 1, repeat: 1 / 0, ease: "linear" },
                   strokeDasharray: { duration: 1.5, repeat: 1 / 0, ease: "easeInOut" }
                 } : {
                   rotate: { duration: 0.3, ease: "easeOut" },
-                  strokeDasharray: { duration: y, ease: "easeInOut" },
-                  ...!r && { opacity: { duration: 0.2, delay: y } }
+                  strokeDasharray: { duration: f, ease: "easeInOut" },
+                  ...!t && { opacity: { duration: 0.2, delay: f } }
                 }
               }
             ),
-            /* @__PURE__ */ t(L, { children: c && r && (a ? /* @__PURE__ */ t(
+            /* @__PURE__ */ e(g, { children: a && t && (s ? /* @__PURE__ */ e(
               "circle",
               {
                 cx: "12",
                 cy: "12",
-                r: o + s / 2,
-                fill: p,
+                r: n + i / 2,
+                fill: u,
                 stroke: "none"
               },
               "fill-static"
-            ) : /* @__PURE__ */ t(
-              l.circle,
+            ) : /* @__PURE__ */ e(
+              c.circle,
               {
                 cx: "12",
                 cy: "12",
-                r: o + s / 2,
-                fill: p,
+                r: n + i / 2,
+                fill: u,
                 stroke: "none",
                 initial: { opacity: 0 },
                 animate: { opacity: 1 },
-                transition: { duration: v, delay: w, ease: "easeOut" },
+                transition: { duration: w, delay: _, ease: "easeOut" },
                 style: { transformOrigin: "center" }
               },
               "fill"
             )) }),
-            /* @__PURE__ */ t(L, { children: n === "success" && (a ? /* @__PURE__ */ t(
+            /* @__PURE__ */ e(g, { children: r === "success" && (s ? /* @__PURE__ */ e(
               "path",
               {
                 d: A,
-                stroke: k,
-                strokeWidth: u,
+                stroke: h,
+                strokeWidth: d,
                 strokeLinecap: "round",
                 strokeLinejoin: "round",
                 fill: "none"
               },
               "check-static"
-            ) : /* @__PURE__ */ t(
-              l.path,
+            ) : /* @__PURE__ */ e(
+              c.path,
               {
                 d: A,
-                stroke: k,
-                strokeWidth: u,
+                stroke: h,
+                strokeWidth: d,
                 strokeLinecap: "round",
                 strokeLinejoin: "round",
                 fill: "none",
                 initial: { pathLength: 0, opacity: 0 },
                 animate: { pathLength: 1, opacity: 1 },
                 transition: {
-                  pathLength: { duration: D, ease: "easeOut", delay: f },
-                  opacity: { duration: 0.1, delay: f }
+                  pathLength: { duration: D, ease: "easeOut", delay: m },
+                  opacity: { duration: 0.1, delay: m }
                 },
-                onAnimationComplete: () => i == null ? void 0 : i()
+                onAnimationComplete: () => C?.()
               },
               "check"
             )) }),
-            /* @__PURE__ */ t(L, { children: n === "error" && (a ? /* @__PURE__ */ t(
+            /* @__PURE__ */ e(g, { children: r === "error" && (s ? /* @__PURE__ */ e(
               "path",
               {
                 d: R,
-                stroke: k,
-                strokeWidth: u,
+                stroke: h,
+                strokeWidth: d,
                 strokeLinecap: "round",
                 fill: "none"
               },
               "x-static"
-            ) : /* @__PURE__ */ t(
-              l.path,
+            ) : /* @__PURE__ */ e(
+              c.path,
               {
                 d: R,
-                stroke: k,
-                strokeWidth: u,
+                stroke: h,
+                strokeWidth: d,
                 strokeLinecap: "round",
                 fill: "none",
                 initial: { pathLength: 0, opacity: 0 },
                 animate: { pathLength: 1, opacity: 1 },
                 transition: {
-                  pathLength: { duration: D, ease: "easeOut", delay: f },
-                  opacity: { duration: 0.1, delay: f }
+                  pathLength: { duration: D, ease: "easeOut", delay: m },
+                  opacity: { duration: 0.1, delay: m }
                 },
-                onAnimationComplete: () => i == null ? void 0 : i()
+                onAnimationComplete: () => C?.()
               },
               "x"
             )) })
           ]
         }
       ),
-      /* @__PURE__ */ t("span", { className: "sr-only", children: T[n] })
+      /* @__PURE__ */ e("span", { className: "sr-only", children: T[r] })
     ] });
   }
 );

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":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,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;IACjB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kEAAkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,kDAAkD;IAClD,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC7D,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAuGD,QAAA,MAAM,QAAQ,sFA4Nb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,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;IACjB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kEAAkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,kDAAkD;IAClD,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC7D,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAuGD,QAAA,MAAM,QAAQ,sFA0Nb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/ui/stat-card.js

@@ -1,53 +1,54 @@
 "use client";
-import { jsxs as o, jsx as e, Fragment as T } from "react/jsx-runtime";
-import { IconTrendingUp as A, IconTrendingDown as O, IconMinus as W } from "@tabler/icons-react";
-import * as f from "react";
+import { jsxs as o, jsx as e, Fragment as A } from "react/jsx-runtime";
+import { IconTrendingUp as E, IconTrendingDown as O, IconMinus as W } from "@tabler/icons-react";
+import * as b from "react";
 import { u as G } from "../_chunks/link-context.js";
 import { tweens as v, springs as w } from "./lib/motion.js";
-import { cn as p } from "./lib/utils.js";
-import { m as c } from "../_chunks/framer.js";
-const R = {
+import { cn as f } from "./lib/utils.js";
+import { Icon as R } from "./icon.js";
+import { m as l } from "../_chunks/framer.js";
+const S = {
   default: "border-l-accent-9",
   success: "border-l-success-9",
   warning: "border-l-warning-9",
   error: "border-l-error-9",
   info: "border-l-info-9"
 };
-function H(d, l, r) {
-  const t = d.filter((n) => Number.isFinite(n));
-  if (t.length < 2) return "";
-  const a = Math.min(...t), s = Math.max(...t) - a || 1, i = l / (t.length - 1);
-  return t.map((n, m) => {
-    const g = m * i, x = r - (n - a) / s * r;
-    return `${m === 0 ? "M" : "L"}${g.toFixed(1)},${x.toFixed(1)}`;
+function H(d, c, t) {
+  const r = d.filter((n) => Number.isFinite(n));
+  if (r.length < 2) return "";
+  const s = Math.min(...r), a = Math.max(...r) - s || 1, i = c / (r.length - 1);
+  return r.map((n, u) => {
+    const g = u * i, x = t - (n - s) / a * t;
+    return `${u === 0 ? "M" : "L"}${g.toFixed(1)},${x.toFixed(1)}`;
   }).join(" ");
 }
 function K({
   data: d,
-  colorClass: l
+  colorClass: c
 }) {
-  const r = f.useId(), t = f.useRef(null), [a, h] = f.useState(0), s = 80, i = 32, n = H(d, s, i);
-  if (f.useEffect(() => {
-    t.current && h(t.current.getTotalLength());
+  const t = b.useId(), r = b.useRef(null), [s, p] = b.useState(0), a = 80, i = 32, n = H(d, a, i);
+  if (b.useEffect(() => {
+    r.current && p(r.current.getTotalLength());
   }, [n]), !n) return null;
-  const m = `${n} L${s.toFixed(1)},${i.toFixed(1)} L0,${i.toFixed(1)} Z`;
-  return /* @__PURE__ */ o("div", { className: p("w-20 h-8", l), "aria-hidden": "true", children: [
+  const u = `${n} L${a.toFixed(1)},${i.toFixed(1)} L0,${i.toFixed(1)} Z`;
+  return /* @__PURE__ */ o("div", { className: f("w-20 h-8", c), "aria-hidden": "true", children: [
     /* @__PURE__ */ o(
       "svg",
       {
-        viewBox: `0 0 ${s} ${i}`,
+        viewBox: `0 0 ${a} ${i}`,
         className: "w-full h-full overflow-visible",
         preserveAspectRatio: "none",
         children: [
-          /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ o("linearGradient", { id: `sparkline-fill-${r}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+          /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ o("linearGradient", { id: `sparkline-fill-${t}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
             /* @__PURE__ */ e("stop", { offset: "0%", stopColor: "currentColor", stopOpacity: "0.1" }),
             /* @__PURE__ */ e("stop", { offset: "100%", stopColor: "currentColor", stopOpacity: "0" })
           ] }) }),
-          /* @__PURE__ */ e("path", { d: m, fill: `url(#sparkline-fill-${r})` }),
+          /* @__PURE__ */ e("path", { d: u, fill: `url(#sparkline-fill-${t})` }),
           /* @__PURE__ */ e(
             "path",
             {
-              ref: t,
+              ref: r,
               d: n,
               fill: "none",
               stroke: "currentColor",
@@ -55,62 +56,62 @@ function K({
               strokeLinecap: "round",
               strokeLinejoin: "round",
               style: {
-                opacity: a === 0 ? 0 : 1,
-                strokeDasharray: a,
-                strokeDashoffset: a,
-                animation: a > 0 ? `sparkline-draw-${r.replace(/:/g, "")} 1s ease-out forwards` : "none"
+                opacity: s === 0 ? 0 : 1,
+                strokeDasharray: s,
+                strokeDashoffset: s,
+                animation: s > 0 ? `sparkline-draw-${t.replace(/:/g, "")} 1s ease-out forwards` : "none"
               }
             }
           )
         ]
       }
     ),
-    a > 0 && /* @__PURE__ */ e("style", { children: `@keyframes sparkline-draw-${r.replace(/:/g, "")} { to { stroke-dashoffset: 0; } }` })
+    s > 0 && /* @__PURE__ */ e("style", { children: `@keyframes sparkline-draw-${t.replace(/:/g, "")} { to { stroke-dashoffset: 0; } }` })
   ] });
 }
-function U({ progress: d, label: l }) {
-  const r = Math.max(0, Math.min(100, d)), t = r >= 90 ? "bg-success-9" : r >= 70 ? "bg-warning-9" : "bg-accent-9";
-  return /* @__PURE__ */ e("div", { className: "h-1 w-full rounded-ds-full bg-surface-raised mt-ds-04", role: "progressbar", "aria-label": `${l} progress`, "aria-valuenow": r, "aria-valuemin": 0, "aria-valuemax": 100, children: /* @__PURE__ */ e(
+function U({ progress: d, label: c }) {
+  const t = Math.max(0, Math.min(100, d)), r = t >= 90 ? "bg-success-9" : t >= 70 ? "bg-warning-9" : "bg-accent-9";
+  return /* @__PURE__ */ e("div", { className: "h-1 w-full rounded-ds-full bg-surface-raised mt-ds-04", role: "progressbar", "aria-label": `${c} progress`, "aria-valuenow": t, "aria-valuemin": 0, "aria-valuemax": 100, children: /* @__PURE__ */ e(
     "div",
     {
-      className: p("h-full rounded-ds-full transition-[width] duration-moderate-02 ease-productive-standard", t),
-      style: { width: `${r}%` }
+      className: f("h-full rounded-ds-full transition-[width] duration-moderate-02 ease-productive-standard", r),
+      style: { width: `${t}%` }
     }
   ) });
 }
-const V = f.forwardRef(
+const V = b.forwardRef(
   ({
     className: d,
-    label: l,
-    title: r,
-    value: t,
-    prefix: a,
-    suffix: h,
-    delta: s,
+    label: c,
+    title: t,
+    value: r,
+    prefix: s,
+    suffix: p,
+    delta: a,
     icon: i,
     loading: n,
-    comparisonLabel: m,
+    comparisonLabel: u,
     secondaryLabel: g,
     progress: x,
     accent: y,
     sparkline: N,
-    onClick: u,
+    onClick: m,
     href: $,
     footer: F,
-    ...b
+    ...h
   }, k) => {
-    const S = G(), L = r ?? l ?? "", M = !!(u || $), D = M && !b["aria-label"] ? `View ${L}` : b["aria-label"];
+    const P = G(), L = t ?? c ?? "", I = !!(m || $), M = I && !h["aria-label"] ? `View ${L}` : h["aria-label"];
     if (n)
       return /* @__PURE__ */ o(
         "div",
         {
           ref: k,
-          className: p(
+          className: f(
             "rounded-ds-lg border border-surface-border bg-surface-raised shadow-raised p-ds-05b",
-            y && `border-l-[3px] ${R[y]}`,
+            y && `border-l-[3px] ${S[y]}`,
             d
           ),
-          ...b,
+          ...h,
           children: [
             /* @__PURE__ */ e("div", { className: "h-ds-04 w-24 rounded-ds-sm bg-skeleton-base animate-pulse mb-ds-05" }),
             /* @__PURE__ */ e("div", { className: "h-ds-sm w-32 rounded-ds-md bg-skeleton-base animate-pulse mb-ds-03" }),
@@ -118,10 +119,10 @@ const V = f.forwardRef(
           ]
         }
       );
-    const P = (s == null ? void 0 : s.direction) === "up" ? A : (s == null ? void 0 : s.direction) === "down" ? O : W, B = (s == null ? void 0 : s.direction) === "up" ? "text-success-11" : (s == null ? void 0 : s.direction) === "down" ? "text-error-11" : "text-surface-fg-muted", E = (s == null ? void 0 : s.direction) === "up" ? "text-success-11" : (s == null ? void 0 : s.direction) === "down" ? "text-error-11" : "text-accent-11", I = /* @__PURE__ */ o(T, { children: [
+    const B = a?.direction === "up" ? E : a?.direction === "down" ? O : W, T = a?.direction === "up" ? "text-success-11" : a?.direction === "down" ? "text-error-11" : "text-surface-fg-muted", z = a?.direction === "up" ? "text-success-11" : a?.direction === "down" ? "text-error-11" : "text-accent-11", D = /* @__PURE__ */ o(A, { children: [
       /* @__PURE__ */ o("div", { className: "flex items-center justify-between mb-ds-04", children: [
         /* @__PURE__ */ e(
-          c.p,
+          l.p,
           {
             className: "text-ds-md font-medium text-surface-fg-muted",
             initial: { opacity: 0 },
@@ -131,38 +132,36 @@ const V = f.forwardRef(
           }
         ),
         /* @__PURE__ */ o("div", { className: "flex items-center gap-ds-03", children: [
-          N && N.length >= 2 && /* @__PURE__ */ e(K, { data: N, colorClass: E }),
+          N && N.length >= 2 && /* @__PURE__ */ e(K, { data: N, colorClass: z }),
           i && /* @__PURE__ */ e(
-            c.span,
+            l.span,
             {
               className: "text-surface-fg-muted",
               initial: { opacity: 0, scale: 0.96 },
               animate: { opacity: 1, scale: 1 },
               transition: w.snappy,
               "aria-hidden": "true",
-              children: typeof i == "function" ? f.createElement(i, {
-                className: "h-ico-lg w-ico-lg"
-              }) : i
+              children: typeof i == "function" ? /* @__PURE__ */ e(R, { icon: i, size: "lg" }) : i
             }
           )
         ] })
       ] }),
       /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ o(
-        c.p,
+        l.p,
         {
           className: "inline-block text-ds-3xl font-semibold text-surface-fg",
           initial: { opacity: 0, y: "100%" },
           animate: { opacity: 1, y: 0 },
           transition: w.smooth,
           children: [
-            a && /* @__PURE__ */ e("span", { className: "text-surface-fg-muted text-ds-lg", children: a }),
-            /* @__PURE__ */ e("span", { className: "tabular-nums", children: t }),
-            h && /* @__PURE__ */ e("span", { className: "text-surface-fg-muted text-ds-lg", children: h })
+            s && /* @__PURE__ */ e("span", { className: "text-surface-fg-muted text-ds-lg", children: s }),
+            /* @__PURE__ */ e("span", { className: "tabular-nums", children: r }),
+            p && /* @__PURE__ */ e("span", { className: "text-surface-fg-muted text-ds-lg", children: p })
           ]
         }
       ) }),
       g && /* @__PURE__ */ e(
-        c.p,
+        l.p,
         {
           className: "text-ds-sm text-surface-fg-subtle mt-ds-01",
           initial: { opacity: 0 },
@@ -172,7 +171,7 @@ const V = f.forwardRef(
         }
       ),
       x != null && /* @__PURE__ */ e(
-        c.div,
+        l.div,
         {
           initial: { opacity: 0 },
           animate: { opacity: 1 },
@@ -180,34 +179,34 @@ const V = f.forwardRef(
           children: /* @__PURE__ */ e(U, { progress: x, label: L })
         }
       ),
-      s && /* @__PURE__ */ o(
-        c.div,
+      a && /* @__PURE__ */ o(
+        l.div,
         {
-          className: p(
+          className: f(
             "mt-ds-03 flex items-center gap-ds-02 text-ds-sm font-medium",
-            B
+            T
           ),
           initial: { opacity: 0, y: 8 },
           animate: { opacity: 1, y: 0 },
           transition: { ...w.smooth, delay: 0.2 },
           children: [
             /* @__PURE__ */ e(
-              c.span,
+              l.span,
               {
                 className: "inline-flex",
                 initial: { opacity: 0.5, scale: 1.4 },
                 animate: { opacity: 1, scale: 1 },
                 transition: w.bouncy,
-                children: /* @__PURE__ */ e(P, { className: "h-ico-sm w-ico-sm", "aria-hidden": "true" })
+                children: /* @__PURE__ */ e(R, { icon: B, size: "sm" })
               }
             ),
-            /* @__PURE__ */ e("span", { children: s.value }),
-            m && /* @__PURE__ */ e("span", { className: "text-surface-fg-subtle font-normal", children: m })
+            /* @__PURE__ */ e("span", { children: a.value }),
+            u && /* @__PURE__ */ e("span", { className: "text-surface-fg-subtle font-normal", children: u })
           ]
         }
       ),
       F && /* @__PURE__ */ e(
-        c.div,
+        l.div,
         {
           className: "mt-ds-04 pt-ds-04 border-t border-surface-border text-ds-sm",
           initial: { opacity: 0 },
@@ -216,37 +215,37 @@ const V = f.forwardRef(
           children: F
         }
       )
-    ] }), j = p(
+    ] }), j = f(
       "rounded-ds-lg border border-surface-border bg-surface-raised shadow-raised p-ds-05b",
-      y && `border-l-[3px] ${R[y]}`,
-      M && "cursor-pointer hover:shadow-raised-hover hover:border-surface-border-strong transition-[box-shadow,border-color] duration-fast-02 ease-productive-standard group",
+      y && `border-l-[3px] ${S[y]}`,
+      I && "cursor-pointer hover:shadow-raised-hover hover:border-surface-border-strong transition-[box-shadow,border-color] duration-fast-02 ease-productive-standard group",
       d
     );
     return $ ? /* @__PURE__ */ e(
-      S,
+      P,
       {
         ref: k,
         href: $,
-        onClick: u,
-        className: p(j, "block no-underline"),
-        "aria-label": D,
-        ...b,
-        children: I
+        onClick: m,
+        className: f(j, "block no-underline"),
+        "aria-label": M,
+        ...h,
+        children: D
       }
     ) : /* @__PURE__ */ e(
       "div",
       {
         ref: k,
         className: j,
-        onClick: u,
-        role: u ? "button" : void 0,
-        tabIndex: u ? 0 : void 0,
-        "aria-label": D,
-        onKeyDown: u ? (C) => {
-          (C.key === "Enter" || C.key === " ") && (C.preventDefault(), u());
+        onClick: m,
+        role: m ? "button" : void 0,
+        tabIndex: m ? 0 : void 0,
+        "aria-label": M,
+        onKeyDown: m ? (C) => {
+          (C.key === "Enter" || C.key === " ") && (C.preventDefault(), m());
         } : void 0,
-        ...b,
-        children: I
+        ...h,
+        children: D
       }
     );
   }