@devalok/shilp-sutra 0.12.0 → 0.14.0

package/dist/tailwind/preset.js

@@ -326,6 +326,110 @@ const a = {
         lift: {
           "0%": { transform: "scale(1) translateY(0)" },
           "100%": { transform: "scale(1.03) translateY(-2px)" }
+        },
+        "slide-down": {
+          "0%": { opacity: "0", transform: "translateY(-8px)" },
+          "100%": { opacity: "1", transform: "translateY(0)" }
+        },
+        "slide-left": {
+          "0%": { opacity: "0", transform: "translateX(20px)" },
+          "100%": { opacity: "1", transform: "translateX(0)" }
+        },
+        "slide-out-up": {
+          "0%": { opacity: "1", transform: "translateY(0)" },
+          "100%": { opacity: "0", transform: "translateY(-8px)" }
+        },
+        "slide-out-down": {
+          "0%": { opacity: "1", transform: "translateY(0)" },
+          "100%": { opacity: "0", transform: "translateY(8px)" }
+        },
+        "check-pop": {
+          "0%": { transform: "scale(0)" },
+          "60%": { transform: "scale(1.2)" },
+          "100%": { transform: "scale(1)" }
+        },
+        "tab-indicator": {
+          "0%": { transform: "scaleX(0)", transformOrigin: "left" },
+          "100%": { transform: "scaleX(1)", transformOrigin: "left" }
+        },
+        "count-up": {
+          "0%": { opacity: "0", transform: "translateY(100%)" },
+          "100%": { opacity: "1", transform: "translateY(0)" }
+        },
+        wiggle: {
+          "0%, 100%": { transform: "rotate(0deg)" },
+          "20%": { transform: "rotate(-3deg)" },
+          "40%": { transform: "rotate(3deg)" },
+          "60%": { transform: "rotate(-1deg)" },
+          "80%": { transform: "rotate(1deg)" }
+        },
+        "pulse-ring": {
+          "0%": { boxShadow: "0 0 0 0 currentColor", opacity: "0.4" },
+          "100%": { boxShadow: "0 0 0 6px currentColor", opacity: "0" }
+        },
+        "rubber-band": {
+          "0%": { transform: "scaleX(1)" },
+          "20%": { transform: "scaleX(1.15)" },
+          "40%": { transform: "scaleX(0.9)" },
+          "60%": { transform: "scaleX(1.05)" },
+          "80%": { transform: "scaleX(0.98)" },
+          "100%": { transform: "scaleX(1)" }
+        },
+        "collapse-out": {
+          "0%": { gridTemplateRows: "1fr", opacity: "1" },
+          "100%": { gridTemplateRows: "0fr", opacity: "0" }
+        },
+        "expand-in": {
+          "0%": { gridTemplateRows: "0fr", opacity: "0" },
+          "100%": { gridTemplateRows: "1fr", opacity: "1" }
+        },
+        "accordion-down": {
+          "0%": { height: "0", opacity: "0" },
+          "100%": { height: "var(--radix-accordion-content-height)", opacity: "1" }
+        },
+        "accordion-up": {
+          "0%": { height: "var(--radix-accordion-content-height)", opacity: "1" },
+          "100%": { height: "0", opacity: "0" }
+        },
+        "collapsible-down": {
+          "0%": { height: "0", opacity: "0" },
+          "100%": { height: "var(--radix-collapsible-content-height)", opacity: "1" }
+        },
+        "collapsible-up": {
+          "0%": { height: "var(--radix-collapsible-content-height)", opacity: "1" },
+          "100%": { height: "0", opacity: "0" }
+        },
+        "shimmer-sweep": {
+          "0%": { backgroundPosition: "-200% 0" },
+          "100%": { backgroundPosition: "200% 0" }
+        },
+        "swing-in": {
+          "0%": { opacity: "0", transform: "perspective(800px) rotateX(-60deg)" },
+          "70%": { opacity: "1", transform: "perspective(800px) rotateX(5deg)" },
+          "100%": { opacity: "1", transform: "perspective(800px) rotateX(0deg)" }
+        },
+        "pop-in": {
+          "0%": { opacity: "0", transform: "scale(0.5)" },
+          "70%": { opacity: "1", transform: "scale(1.05)" },
+          "100%": { opacity: "1", transform: "scale(1)" }
+        },
+        float: {
+          "0%, 100%": { transform: "translateY(0)" },
+          "50%": { transform: "translateY(-4px)" }
+        },
+        "subtle-bounce": {
+          "0%": { transform: "translateY(0)" },
+          "40%": { transform: "translateY(-2px)" },
+          "100%": { transform: "translateY(0)" }
+        },
+        "spin-in": {
+          "0%": { opacity: "0", transform: "rotate(0deg) scale(0)" },
+          "100%": { opacity: "1", transform: "rotate(360deg) scale(1)" }
+        },
+        stamp: {
+          "0%": { opacity: "0.5", transform: "scale(1.4)" },
+          "60%": { opacity: "1", transform: "scale(0.95)" },
+          "100%": { opacity: "1", transform: "scale(1)" }
         }
       },
       animation: {
@@ -343,7 +447,30 @@ const a = {
         "scale-out": "scale-out var(--duration-moderate-01) var(--ease-expressive-exit) both",
         "glow-pulse": "glow-pulse var(--duration-slow-01) var(--ease-expressive-standard) 1",
         "scale-bounce": "scale-bounce var(--duration-moderate-02) var(--ease-bounce) both",
-        lift: "lift var(--duration-moderate-02) var(--ease-expressive-entrance) both"
+        lift: "lift var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "slide-down": "slide-down var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "slide-left": "slide-left var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "slide-out-up": "slide-out-up var(--duration-moderate-01) var(--ease-expressive-exit) both",
+        "slide-out-down": "slide-out-down var(--duration-moderate-01) var(--ease-expressive-exit) both",
+        "check-pop": "check-pop var(--duration-moderate-02) var(--ease-bounce) both",
+        "tab-indicator": "tab-indicator var(--duration-moderate-01) var(--ease-expressive-entrance) both",
+        "count-up": "count-up var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        wiggle: "wiggle var(--duration-moderate-02) var(--ease-productive-standard) both",
+        "pulse-ring": "pulse-ring var(--duration-slow-01) var(--ease-expressive-standard) infinite",
+        "rubber-band": "rubber-band var(--duration-moderate-02) var(--ease-productive-standard) both",
+        "collapse-out": "collapse-out var(--duration-moderate-01) var(--ease-productive-exit) both",
+        "expand-in": "expand-in var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "accordion-down": "accordion-down var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "accordion-up": "accordion-up var(--duration-moderate-01) var(--ease-productive-exit) both",
+        "collapsible-down": "collapsible-down var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "collapsible-up": "collapsible-up var(--duration-moderate-01) var(--ease-productive-exit) both",
+        "shimmer-sweep": "shimmer-sweep var(--duration-slow-02) var(--ease-linear) infinite",
+        "swing-in": "swing-in var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        "pop-in": "pop-in var(--duration-moderate-02) var(--ease-bounce) both",
+        float: "float 3s var(--ease-expressive-standard) infinite",
+        "subtle-bounce": "subtle-bounce var(--duration-fast-02) var(--ease-bounce) both",
+        "spin-in": "spin-in var(--duration-moderate-02) var(--ease-expressive-entrance) both",
+        stamp: "stamp var(--duration-moderate-02) var(--ease-bounce) both"
       },
       backgroundImage: {
         "gradient-brand": "var(--gradient-brand-light)",

package/dist/ui/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../src/ui/alert.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,aAAa;;;8EAuClB,CAAA;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,QAAA,MAAM,KAAK,mFAwBV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../src/ui/alert.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,aAAa;;;8EAuClB,CAAA;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,QAAA,MAAM,KAAK,mFA8BV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}

package/dist/ui/alert.js

@@ -1,10 +1,10 @@
 "use client";
-import { jsxs as a, jsx as r } from "react/jsx-runtime";
-import { IconInfoCircle as s, IconAlertCircle as x, IconAlertTriangle as m, IconCircleCheck as u, IconX as f } from "@tabler/icons-react";
-import * as g from "react";
-import { e as v } from "../_chunks/vendor-utils.js";
-import { c as p } from "../_chunks/utils.js";
-const N = v(
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { IconInfoCircle as n, IconAlertCircle as g, IconAlertTriangle as v, IconCircleCheck as p, IconX as N } from "@tabler/icons-react";
+import * as t from "react";
+import { e as w } from "../_chunks/vendor-utils.js";
+import { c as h } from "../_chunks/utils.js";
+const y = w(
   "relative flex gap-ds-04 rounded-ds-lg border p-ds-05",
   {
     variants: {
@@ -43,36 +43,38 @@ const N = v(
     ],
     defaultVariants: { variant: "subtle", color: "info" }
   }
-), w = {
-  info: s,
-  success: u,
-  warning: m,
-  error: x,
-  neutral: s
-}, y = g.forwardRef(
-  ({ className: n, variant: c = "subtle", color: e = "info", title: t, onDismiss: o, children: i, ...l }, d) => {
-    const b = w[e ?? "info"];
-    return /* @__PURE__ */ a("div", { ref: d, className: p(N({ variant: c, color: e }), n), role: "alert", ...l, children: [
-      /* @__PURE__ */ r(b, { className: "mt-ds-01 h-ico-md w-ico-md shrink-0", "aria-hidden": "true" }),
-      /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: [
-        t && /* @__PURE__ */ r("p", { className: "text-ds-md font-semibold mb-ds-01", children: t }),
-        /* @__PURE__ */ r("div", { className: "text-ds-md opacity-[0.9]", children: i })
+), I = {
+  info: n,
+  success: p,
+  warning: v,
+  error: g,
+  neutral: n
+}, C = t.forwardRef(
+  ({ className: c, variant: l = "subtle", color: o = "info", title: a, onDismiss: r, children: i, ...d }, b) => {
+    const x = I[o ?? "info"], [u, m] = t.useState(!1), f = t.useCallback(() => {
+      m(!0), setTimeout(() => r == null ? void 0 : r(), 150);
+    }, [r]);
+    return /* @__PURE__ */ s("div", { ref: b, className: h(y({ variant: l, color: o }), u && "animate-slide-out-up", c), role: "alert", ...d, children: [
+      /* @__PURE__ */ e(x, { className: "mt-ds-01 h-ico-md w-ico-md shrink-0", "aria-hidden": "true" }),
+      /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
+        a && /* @__PURE__ */ e("p", { className: "text-ds-md font-semibold mb-ds-01", children: a }),
+        /* @__PURE__ */ e("div", { className: "text-ds-md opacity-[0.9]", children: i })
       ] }),
-      o && /* @__PURE__ */ r(
+      r && /* @__PURE__ */ e(
         "button",
         {
           type: "button",
-          onClick: o,
+          onClick: f,
           className: "shrink-0 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-sm text-icon-secondary transition-colors hover:text-icon-primary hover:bg-field focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
           "aria-label": "Dismiss",
-          children: /* @__PURE__ */ r(f, { className: "h-ico-sm w-ico-sm" })
+          children: /* @__PURE__ */ e(N, { className: "h-ico-sm w-ico-sm" })
         }
       )
     ] });
   }
 );
-y.displayName = "Alert";
+C.displayName = "Alert";
 export {
-  y as Alert,
-  N as alertVariants
+  C as Alert,
+  y as alertVariants
 };

package/dist/ui/autocomplete.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsxs as O, jsx as p } from "react/jsx-runtime";
+import { jsxs as O, jsx as m } from "react/jsx-runtime";
 import * as t from "react";
 import { c as b } from "../_chunks/utils.js";
 const T = t.forwardRef(
@@ -13,7 +13,7 @@ const T = t.forwardRef(
     className: R,
     id: N
   }, i) => {
-    const E = t.useId(), w = N || E, k = `${w}-listbox`, v = `${w}-option`, [f, g] = t.useState((o == null ? void 0 : o.label) ?? ""), [c, a] = t.useState(!1), [r, l] = t.useState(-1), $ = t.useRef(null), A = t.useRef(null), y = t.useRef(), M = t.useCallback(
+    const E = t.useId(), w = N || E, v = `${w}-listbox`, k = `${w}-option`, [f, g] = t.useState((o == null ? void 0 : o.label) ?? ""), [c, a] = t.useState(!1), [r, l] = t.useState(-1), $ = t.useRef(null), A = t.useRef(null), y = t.useRef(), M = t.useCallback(
       (e) => {
         $.current = e, typeof i == "function" ? i(e) : i && (i.current = e);
       },
@@ -25,7 +25,7 @@ const T = t.forwardRef(
     const n = t.useMemo(
       () => f ? x.filter((e) => e.label.toLowerCase().includes(f.toLowerCase())) : x,
       [x, f]
-    ), m = t.useCallback(
+    ), p = t.useCallback(
       (e) => {
         g(e.label), a(!1), l(-1), u == null || u(e);
       },
@@ -44,17 +44,17 @@ const T = t.forwardRef(
             e.preventDefault(), l((s) => Math.max(s - 1, 0));
             break;
           case "Enter":
-            e.preventDefault(), r >= 0 && n[r] && m(n[r]);
+            e.preventDefault(), r >= 0 && n[r] && p(n[r]);
             break;
           case "Escape":
             a(!1), l(-1);
             break;
         }
       },
-      [c, n, r, m]
-    ), K = r >= 0 ? `${v}-${r}` : void 0;
+      [c, n, r, p]
+    ), K = r >= 0 ? `${k}-${r}` : void 0;
     return /* @__PURE__ */ O("div", { className: b("relative", R), children: [
-      /* @__PURE__ */ p(
+      /* @__PURE__ */ m(
         "input",
         {
           ref: M,
@@ -62,7 +62,7 @@ const T = t.forwardRef(
           role: "combobox",
           "aria-expanded": c,
           "aria-autocomplete": "list",
-          "aria-controls": c ? k : void 0,
+          "aria-controls": c ? v : void 0,
           "aria-activedescendant": K,
           value: f,
           placeholder: D,
@@ -83,20 +83,20 @@ const T = t.forwardRef(
           onKeyDown: S
         }
       ),
-      c && /* @__PURE__ */ p(
+      c && /* @__PURE__ */ m(
         "ul",
         {
-          id: k,
+          id: v,
           ref: A,
           role: "listbox",
           className: b(
-            "absolute z-dropdown mt-ds-02 w-full overflow-auto rounded-ds-md border border-border bg-layer-01 shadow-02",
+            "absolute z-popover mt-ds-02 w-full overflow-auto rounded-ds-md border border-border bg-layer-01 shadow-02",
             "max-h-60"
           ),
-          children: n.length === 0 ? /* @__PURE__ */ p("li", { className: "px-ds-04 py-ds-03 text-ds-md text-text-secondary", children: I }) : n.map((e, s) => /* @__PURE__ */ p(
+          children: n.length === 0 ? /* @__PURE__ */ m("li", { className: "px-ds-04 py-ds-03 text-ds-md text-text-secondary", children: I }) : n.map((e, s) => /* @__PURE__ */ m(
             "li",
             {
-              id: `${v}-${s}`,
+              id: `${k}-${s}`,
               role: "option",
               "aria-selected": r === s,
               className: b(
@@ -105,9 +105,9 @@ const T = t.forwardRef(
                 (o == null ? void 0 : o.value) === e.value && "font-semibold"
               ),
               onMouseDown: (d) => d.preventDefault(),
-              onClick: () => m(e),
+              onClick: () => p(e),
               onKeyDown: (d) => {
-                (d.key === "Enter" || d.key === " ") && (d.preventDefault(), m(e));
+                (d.key === "Enter" || d.key === " ") && (d.preventDefault(), p(e));
               },
               onMouseEnter: () => l(s),
               children: e.label

package/dist/ui/badge.js

@@ -103,7 +103,7 @@ const u = x(
     n && /* @__PURE__ */ r(
       "span",
       {
-        className: "h-ds-02b w-ds-02b rounded-ds-full bg-current opacity-[0.7] shrink-0",
+        className: "h-ds-02b w-ds-02b rounded-ds-full bg-current opacity-[0.7] shrink-0 animate-pulse-ring",
         "aria-hidden": "true"
       }
     ),
@@ -113,7 +113,7 @@ const u = x(
       {
         type: "button",
         onClick: e,
-        className: "ml-ds-01 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-full text-icon-secondary transition-colors hover:text-icon-primary hover:bg-field focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
+        className: "ml-ds-01 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-full text-icon-secondary hover:rotate-90 transition-[color,transform] duration-fast-02 hover:text-icon-primary hover:bg-field focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
         "aria-label": "Remove",
         children: /* @__PURE__ */ r(b, { className: "h-ico-sm w-ico-sm" })
       }

package/dist/ui/banner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../../src/ui/banner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,cAAc;;8EAmBnB,CAAA;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,QAAA,MAAM,MAAM,oFAsBX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../../src/ui/banner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,cAAc;;8EAmBnB,CAAA;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,QAAA,MAAM,MAAM,oFA4BX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/banner.js

@@ -1,10 +1,10 @@
 "use client";
-import { jsxs as l, jsx as r } from "react/jsx-runtime";
-import { IconInfoCircle as n, IconAlertCircle as f, IconAlertTriangle as m, IconCircleCheck as b, IconX as u } from "@tabler/icons-react";
-import * as x from "react";
-import { e as g } from "../_chunks/vendor-utils.js";
-import { c as p } from "../_chunks/utils.js";
-const h = g(
+import { jsxs as b, jsx as r } from "react/jsx-runtime";
+import { IconInfoCircle as n, IconAlertCircle as x, IconAlertTriangle as g, IconCircleCheck as p, IconX as h } from "@tabler/icons-react";
+import * as s from "react";
+import { e as v } from "../_chunks/vendor-utils.js";
+import { c as w } from "../_chunks/utils.js";
+const N = v(
   "flex items-center gap-ds-04 px-ds-06 py-ds-04 text-ds-md font-medium border-b",
   {
     variants: {
@@ -18,34 +18,36 @@ const h = g(
     },
     defaultVariants: { color: "info" }
   }
-), N = {
+), y = {
   info: n,
-  success: b,
-  warning: m,
-  error: f,
+  success: p,
+  warning: g,
+  error: x,
   neutral: n
-}, v = x.forwardRef(
-  ({ className: t, color: e = "info", action: s, onDismiss: o, children: i, ...c }, a) => {
-    const d = N[e ?? "info"];
-    return /* @__PURE__ */ l("div", { ref: a, className: p(h({ color: e }), t), role: "alert", ...c, children: [
+}, I = s.forwardRef(
+  ({ className: a, color: t = "info", action: o, onDismiss: e, children: i, ...c }, l) => {
+    const d = y[t ?? "info"], [f, m] = s.useState(!1), u = s.useCallback(() => {
+      m(!0), setTimeout(() => e == null ? void 0 : e(), 150);
+    }, [e]);
+    return /* @__PURE__ */ b("div", { ref: l, className: w(N({ color: t }), f && "animate-collapse-out overflow-hidden", a), role: "alert", ...c, children: [
       /* @__PURE__ */ r(d, { className: "h-ico-md w-ico-md shrink-0", "aria-hidden": "true" }),
       /* @__PURE__ */ r("span", { className: "flex-1", children: i }),
-      s && /* @__PURE__ */ r("span", { className: "shrink-0", children: s }),
-      o && /* @__PURE__ */ r(
+      o && /* @__PURE__ */ r("span", { className: "shrink-0", children: o }),
+      e && /* @__PURE__ */ r(
         "button",
         {
           type: "button",
-          onClick: o,
+          onClick: u,
           className: "shrink-0 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-sm text-icon-secondary transition-colors hover:text-icon-primary hover:bg-field focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
           "aria-label": "Dismiss",
-          children: /* @__PURE__ */ r(u, { className: "h-ico-sm w-ico-sm" })
+          children: /* @__PURE__ */ r(h, { className: "h-ico-sm w-ico-sm" })
         }
       )
     ] });
   }
 );
-v.displayName = "Banner";
+I.displayName = "Banner";
 export {
-  v as Banner,
-  h as bannerVariants
+  I as Banner,
+  N as bannerVariants
 };

package/dist/ui/button.js

@@ -6,7 +6,7 @@ import * as G from "react";
 import { u as M, S as q } from "../_chunks/spinner.js";
 import { c as s } from "../_chunks/utils.js";
 const p = B(
-  "inline-flex items-center justify-center gap-ds-03 whitespace-nowrap font-sans font-semibold select-none border border-transparent transition-[color,background-color,border-color,box-shadow] duration-fast-01 ease-productive-standard 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]",
+  "inline-flex items-center justify-center gap-ds-03 whitespace-nowrap font-sans font-semibold select-none border border-transparent transition-[color,background-color,border-color,box-shadow,transform] duration-fast-01 ease-productive-standard active:translate-y-px 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]",
   {
     variants: {
       variant: {
@@ -89,14 +89,14 @@ const p = B(
     loadingPosition: t = "start",
     fullWidth: m = !1,
     disabled: v,
-    children: i,
+    children: a,
     ...u
   }, h) => {
-    const a = M(), b = w ?? a.variant, g = N ?? a.color, o = y ?? a.size ?? "md", f = A[o], z = D[o], n = e ? /* @__PURE__ */ r(q, { size: z }) : null;
+    const i = M(), b = w ?? i.variant, f = N ?? i.color, o = y ?? i.size ?? "md", g = A[o], z = D[o], n = e ? /* @__PURE__ */ r(q, { size: z }) : null;
     if (S) {
       const V = {
         className: s(
-          p({ variant: b, color: g, size: o }),
+          p({ variant: b, color: f, size: o }),
           m && "w-full",
           c
         ),
@@ -105,17 +105,17 @@ const p = B(
         "aria-busy": e || void 0,
         ...u
       };
-      return /* @__PURE__ */ r(R, { ...V, children: /* @__PURE__ */ r(E, { children: i }) });
+      return /* @__PURE__ */ r(R, { ...V, children: /* @__PURE__ */ r(E, { children: a }) });
     }
-    const j = () => e && t === "start" ? n : d ? /* @__PURE__ */ r("span", { className: s("inline-flex shrink-0 items-center justify-center", f), children: d }) : null, k = () => e && t === "end" ? n : l ? /* @__PURE__ */ r("span", { className: s("inline-flex shrink-0 items-center justify-center", f), children: l }) : null, C = () => e && t === "center" ? /* @__PURE__ */ x("span", { className: "relative inline-flex items-center justify-center", children: [
-      /* @__PURE__ */ r("span", { className: "invisible", children: i }),
+    const j = () => e && t === "start" ? n : d ? /* @__PURE__ */ r("span", { className: s("inline-flex shrink-0 items-center justify-center", g), children: d }) : null, k = () => e && t === "end" ? n : l ? /* @__PURE__ */ r("span", { className: s("inline-flex shrink-0 items-center justify-center", g), children: l }) : null, C = () => e && t === "center" ? /* @__PURE__ */ x("span", { className: "relative inline-flex items-center justify-center", children: [
+      /* @__PURE__ */ r("span", { className: "invisible", children: a }),
       /* @__PURE__ */ r("span", { className: "absolute inset-0 flex items-center justify-center", children: n })
-    ] }) : i;
+    ] }) : a;
     return /* @__PURE__ */ x(
       "button",
       {
         className: s(
-          p({ variant: b, color: g, size: o }),
+          p({ variant: b, color: f, size: o }),
           m && "w-full",
           c
         ),

package/dist/ui/card.js

@@ -23,7 +23,7 @@ const l = i(
       ref: n,
       className: o(
         l({ variant: a }),
-        e && "hover:shadow-02 hover:border-border-strong cursor-pointer transition-shadow duration-fast-01",
+        e && "hover:shadow-02 hover:border-border-strong hover:-translate-y-px active:scale-[0.98] cursor-pointer transition-all duration-fast-02 ease-productive-standard",
         r
       ),
       ...s
@@ -60,7 +60,7 @@ const p = t.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ d(
 p.displayName = "CardDescription";
 const b = t.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ d("div", { ref: e, className: o("p-ds-06 pt-0", r), ...a }));
 b.displayName = "CardContent";
-const C = t.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ d(
+const v = t.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ d(
   "div",
   {
     ref: e,
@@ -68,12 +68,12 @@ const C = t.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ d(
     ...a
   }
 ));
-C.displayName = "CardFooter";
+v.displayName = "CardFooter";
 export {
   c as Card,
   b as CardContent,
   p as CardDescription,
-  C as CardFooter,
+  v as CardFooter,
   f as CardHeader,
   m as CardTitle,
   l as cardVariants

package/dist/ui/checkbox.js

@@ -4,8 +4,8 @@ import { C as r, b as d } from "../_chunks/primitives.js";
 import { IconMinus as m, IconCheck as l } from "@tabler/icons-react";
 import * as b from "react";
 import { c as f } from "../_chunks/utils.js";
-const h = b.forwardRef(({ className: i, error: o, indeterminate: a, checked: s, ...c }, n) => {
-  const t = a ? "indeterminate" : s;
+const h = b.forwardRef(({ className: i, error: o, indeterminate: a, checked: c, ...s }, n) => {
+  const t = a ? "indeterminate" : c;
   return /* @__PURE__ */ e(
     r,
     {
@@ -23,8 +23,8 @@ const h = b.forwardRef(({ className: i, error: o, indeterminate: a, checked: s,
         o && "border-border-error",
         i
       ),
-      ...c,
-      children: /* @__PURE__ */ e(d, { className: "flex items-center justify-center text-current", children: t === "indeterminate" ? /* @__PURE__ */ e(m, { className: "h-ico-sm w-ico-sm" }) : /* @__PURE__ */ e(l, { className: "h-3 w-3" }) })
+      ...s,
+      children: /* @__PURE__ */ e(d, { className: "flex items-center justify-center text-current animate-check-pop", children: t === "indeterminate" ? /* @__PURE__ */ e(m, { className: "h-ico-sm w-ico-sm" }) : /* @__PURE__ */ e(l, { className: "h-3 w-3" }) })
     }
   );
 });

package/dist/ui/chip.js

@@ -67,7 +67,7 @@ const w = N(
   }
 ), C = f.forwardRef(
   ({ label: a, variant: n, size: l, color: i, icon: o, onClick: s, onDismiss: c, disabled: t, className: d, ...b }, g) => {
-    const e = !!s, m = e ? "button" : "span", x = e && !t ? "cursor-pointer hover:bg-field-hover" : "", u = t ? "opacity-action-disabled cursor-not-allowed" : "";
+    const e = !!s, m = e ? "button" : "span", x = e && !t ? "cursor-pointer hover:bg-field-hover active:scale-95" : "", u = t ? "opacity-action-disabled cursor-not-allowed" : "";
     return /* @__PURE__ */ v(
       m,
       {
@@ -85,7 +85,7 @@ const w = N(
             {
               type: "button",
               "aria-label": `Remove ${a}`,
-              className: "flex-shrink-0 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-full p-ds-01 hover:bg-layer-03 transition-colors duration-fast-01 [&>svg]:w-ico-sm [&>svg]:h-ico-sm",
+              className: "flex-shrink-0 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-full p-ds-01 hover:bg-layer-03 hover:rotate-90 transition-[color,transform] duration-fast-02 [&>svg]:w-ico-sm [&>svg]:h-ico-sm",
               onClick: (y) => {
                 y.stopPropagation(), c();
               },

package/dist/ui/collapsible.js

@@ -1,22 +1,22 @@
 "use client";
 import { jsx as s } from "react/jsx-runtime";
-import * as i from "react";
-import { U as a, V as l, W as n } from "../_chunks/primitives.js";
-import { c as r } from "../_chunks/utils.js";
-const f = l, C = n, d = i.forwardRef(({ className: t, ...o }, e) => /* @__PURE__ */ s(
+import * as l from "react";
+import { U as a, V as i, W as r } from "../_chunks/primitives.js";
+import { c as p } from "../_chunks/utils.js";
+const f = i, b = r, m = l.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ s(
   a,
   {
-    ref: e,
-    className: r(
-      "overflow-hidden transition-all data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
-      t
+    ref: t,
+    className: p(
+      "overflow-hidden data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down",
+      o
     ),
-    ...o
+    ...e
   }
 ));
-d.displayName = a.displayName;
+m.displayName = a.displayName;
 export {
   f as Collapsible,
-  d as CollapsibleContent,
-  C as CollapsibleTrigger
+  m as CollapsibleContent,
+  b as CollapsibleTrigger
 };