@devalok/shilp-sutra 0.33.1 → 0.34.0

package/dist/ui/navigation-menu.js

@@ -3,7 +3,7 @@ import { jsxs as v, jsx as c } from "react/jsx-runtime";
 import * as a from "react";
 import { b9 as N, ba as h, bb as w, bc as x, bd as R, be as M, bf as O, bg as V } from "../_chunks/primitives.js";
 import { IconChevronDown as L } from "@tabler/icons-react";
-import { cn as u } from "./lib/utils.js";
+import { cn as d } from "./lib/utils.js";
 import { tweens as g, springs as I } from "./lib/motion.js";
 import { Icon as S } from "./icon.js";
 import { m as y } from "../_chunks/framer.js";
@@ -11,7 +11,7 @@ const W = a.forwardRef(({ className: n, children: o, ...t }, r) => /* @__PURE__
   N,
   {
     ref: r,
-    className: u(
+    className: d(
       "relative z-raised flex max-w-max flex-1 items-center justify-center",
       n
     ),
@@ -27,7 +27,7 @@ const z = a.forwardRef(({ className: n, ...o }, t) => /* @__PURE__ */ c(
   h,
   {
     ref: t,
-    className: u(
+    className: d(
       "group flex flex-1 list-none items-center justify-center space-x-ds-02",
       n
     ),
@@ -39,8 +39,8 @@ const P = O, D = a.forwardRef(({ className: n, children: o, ...t }, r) => /* @__
   w,
   {
     ref: r,
-    className: u(
-      "group inline-flex h-ds-sm-plus w-max items-center justify-center rounded-ds-md bg-transparent px-ds-05 py-ds-03 text-ds-md font-medium transition-colors hover:bg-surface-raised-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none disabled:opacity-action-disabled",
+    className: d(
+      "group inline-flex h-ds-sm-plus w-max items-center justify-center rounded-ds-md bg-transparent px-ds-05 py-ds-03 text-ds-md font-medium transition-colors hover:bg-surface-raised-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none disabled:opacity-action-disabled",
       n
     ),
     ...t,
@@ -68,8 +68,8 @@ const b = {
   a.useEffect(() => {
     const s = r.current;
     if (!s) return;
-    const d = s.getAttribute("data-motion");
-    d && l(d);
+    const u = s.getAttribute("data-motion");
+    u && l(u);
     const f = new MutationObserver((A) => {
       for (const C of A)
         if (C.attributeName === "data-motion") {
@@ -84,7 +84,7 @@ const b = {
     x,
     {
       ref: m,
-      className: u(
+      className: d(
         "left-0 top-0 w-full md:absolute md:w-auto",
         n
       ),
@@ -116,16 +116,16 @@ const Q = V, j = a.forwardRef(({ className: n, ...o }, t) => {
     if (!e) return;
     const p = e.getAttribute("data-state");
     l(p === "open");
-    const s = new MutationObserver((d) => {
-      for (const f of d)
+    const s = new MutationObserver((u) => {
+      for (const f of u)
         f.attributeName === "data-state" && l(e.getAttribute("data-state") === "open");
     });
     return s.observe(e, { attributes: !0, attributeFilter: ["data-state"] }), () => s.disconnect();
-  }, []), /* @__PURE__ */ v("div", { className: u("absolute left-0 top-full flex justify-center"), children: [
+  }, []), /* @__PURE__ */ v("div", { className: d("absolute left-0 top-full flex justify-center"), children: [
     /* @__PURE__ */ c(
       R,
       {
-        className: u(
+        className: d(
           "origin-top-center relative mt-ds-02b h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-overlay shadow-floating md:w-[var(--radix-navigation-menu-viewport-width)]",
           n
         ),
@@ -158,8 +158,8 @@ const F = a.forwardRef(({ className: n, ...o }, t) => {
     if (!e) return;
     const p = e.getAttribute("data-state");
     l(p === "visible");
-    const s = new MutationObserver((d) => {
-      for (const f of d)
+    const s = new MutationObserver((u) => {
+      for (const f of u)
         f.attributeName === "data-state" && l(e.getAttribute("data-state") === "visible");
     });
     return s.observe(e, { attributes: !0, attributeFilter: ["data-state"] }), () => s.disconnect();
@@ -167,7 +167,7 @@ const F = a.forwardRef(({ className: n, ...o }, t) => {
     M,
     {
       ref: m,
-      className: u(
+      className: d(
         "top-full z-base flex h-ds-02b items-end justify-center overflow-hidden",
         n
       ),

package/dist/ui/number-input.js

@@ -15,9 +15,9 @@ const M = w.forwardRef(
     disabled: c = !1,
     className: m,
     "aria-label": b,
-    ...u
+    ...d
   }, p) => {
-    const d = D(), h = b ?? (u.id || d.helperTextId ? void 0 : "Numeric value"), v = (s) => {
+    const u = D(), h = b ?? (d.id || u.helperTextId ? void 0 : "Numeric value"), v = (s) => {
       const e = s.target.value.trim();
       if (e === "" || e === "-") {
         n?.(t >= 0 ? t : 0);
@@ -68,9 +68,9 @@ const M = w.forwardRef(
               step: i,
               disabled: c,
               "aria-label": h,
-              "aria-describedby": u["aria-describedby"] ?? d.helperTextId,
-              className: "bg-transparent text-ds-md font-semibold w-ds-sm-plus border-0 text-center text-surface-fg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
-              ...u
+              "aria-describedby": d["aria-describedby"] ?? u.helperTextId,
+              className: "bg-transparent text-ds-md font-semibold w-ds-sm-plus border-0 text-center text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
+              ...d
             }
           ),
           /* @__PURE__ */ a(

package/dist/ui/pagination.js

@@ -34,7 +34,7 @@ const u = o.forwardRef(
       ref: t,
       "aria-current": i ? "page" : void 0,
       className: r(
-        "inline-flex items-center justify-center h-ds-sm-plus w-ds-sm-plus rounded-ds-md text-ds-md font-medium tabular-nums transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled active:scale-95",
+        "inline-flex items-center justify-center h-ds-sm-plus w-ds-sm-plus rounded-ds-md text-ds-md font-medium tabular-nums transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled active:scale-95",
         i ? "bg-accent-9 text-accent-fg" : "hover:bg-surface-raised-hover text-surface-fg",
         e
       ),

package/dist/ui/popover.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as e, jsxs as h } from "react/jsx-runtime";
-import * as n from "react";
+import * as s from "react";
 import { ab as P, a6 as R, a5 as M, a7 as w, q as N, r as y, p as A, o as O, bh as j } from "../_chunks/primitives.js";
 import { cn as g } from "./lib/utils.js";
 import { tweens as v, springs as z } from "./lib/motion.js";
@@ -8,21 +8,21 @@ import { useIsMobile as E } from "../hooks/use-mobile.js";
 import { u as k, A as b, m as p } from "../_chunks/framer.js";
 function B({
   open: t,
-  onOpenChange: s,
+  onOpenChange: a,
   children: i,
-  className: l,
-  dragHandle: c = !0,
-  swipeable: d = !0,
-  title: a
+  className: d,
+  dragHandle: l = !0,
+  swipeable: c = !0,
+  title: n
 }) {
-  const o = k(), r = n.useRef(null), u = n.useCallback(
+  const o = k(), r = s.useRef(null), u = s.useCallback(
     (f, m) => {
       const C = r.current?.getBoundingClientRect().height ?? 300;
-      (m.offset.y > C * 0.3 || m.velocity.y > 500) && s(!1);
+      (m.offset.y > C * 0.3 || m.velocity.y > 500) && a(!1);
     },
-    [s]
+    [a]
   );
-  return /* @__PURE__ */ e(P, { open: t, onOpenChange: s, children: /* @__PURE__ */ e(b, { children: t && /* @__PURE__ */ h(R, { forceMount: !0, children: [
+  return /* @__PURE__ */ e(P, { open: t, onOpenChange: a, children: /* @__PURE__ */ e(b, { children: t && /* @__PURE__ */ h(R, { forceMount: !0, children: [
     /* @__PURE__ */ e(M, { forceMount: !0, asChild: !0, children: /* @__PURE__ */ e(
       p.div,
       {
@@ -38,25 +38,25 @@ function B({
       {
         forceMount: !0,
         asChild: !0,
-        "aria-label": a,
+        "aria-label": n,
         children: /* @__PURE__ */ h(
           p.div,
           {
             ref: r,
             className: g(
-              "fixed inset-x-0 bottom-0 z-modal max-h-[85vh] overflow-y-auto rounded-t-ds-xl border-t border-surface-border-strong bg-surface-overlay shadow-overlay outline-none",
-              l
+              "fixed inset-x-0 bottom-0 z-modal max-h-[85vh] overflow-y-auto rounded-t-ds-xl border-t border-surface-border-strong bg-surface-overlay shadow-overlay outline-hidden",
+              d
             ),
             initial: { y: "100%" },
             animate: { y: 0 },
             exit: { y: "100%" },
             transition: o ? { duration: 0 } : { type: "spring", damping: 30, stiffness: 300 },
-            drag: d && !o ? "y" : !1,
+            drag: c && !o ? "y" : !1,
             dragConstraints: { top: 0 },
             dragElastic: 0.2,
             onDragEnd: u,
             children: [
-              c && /* @__PURE__ */ e("div", { className: "flex justify-center pt-ds-03 pb-ds-02", children: /* @__PURE__ */ e("div", { className: "h-1 w-8 rounded-ds-full bg-surface-border" }) }),
+              l && /* @__PURE__ */ e("div", { className: "flex justify-center pt-ds-03 pb-ds-02", children: /* @__PURE__ */ e("div", { className: "h-1 w-8 rounded-ds-full bg-surface-border" }) }),
               /* @__PURE__ */ e("div", { className: "px-ds-05 pb-ds-06", children: i })
             ]
           }
@@ -65,28 +65,28 @@ function B({
     )
   ] }) }) });
 }
-const x = n.createContext({ open: !1, onClose: () => {
+const x = s.createContext({ open: !1, onClose: () => {
 } }), D = ({
   open: t,
-  defaultOpen: s = !1,
+  defaultOpen: a = !1,
   onOpenChange: i,
-  ...l
+  ...d
 }) => {
-  const [c, d] = n.useState(s), a = t !== void 0, o = a ? t : c, r = n.useCallback(
+  const [l, c] = s.useState(a), n = t !== void 0, o = n ? t : l, r = s.useCallback(
     (f) => {
-      a || d(f), i?.(f);
+      n || c(f), i?.(f);
     },
-    [a, i]
-  ), u = n.useMemo(
+    [n, i]
+  ), u = s.useMemo(
     () => ({ open: o, onClose: () => r(!1) }),
     [o, r]
   );
-  return /* @__PURE__ */ e(x.Provider, { value: u, children: /* @__PURE__ */ e(O, { open: o, onOpenChange: r, ...l }) });
+  return /* @__PURE__ */ e(x.Provider, { value: u, children: /* @__PURE__ */ e(O, { open: o, onOpenChange: r, ...d }) });
 };
 D.displayName = "Popover";
-const _ = A, $ = j, S = n.forwardRef(({ className: t, align: s = "center", sideOffset: i = 4, children: l, ...c }, d) => {
-  const a = E(), { open: o, onClose: r } = n.useContext(x);
-  return a ? /* @__PURE__ */ e(
+const _ = A, $ = j, S = s.forwardRef(({ className: t, align: a = "center", sideOffset: i = 4, children: d, ...l }, c) => {
+  const n = E(), { open: o, onClose: r } = s.useContext(x);
+  return n ? /* @__PURE__ */ e(
     B,
     {
       open: o,
@@ -95,17 +95,17 @@ const _ = A, $ = j, S = n.forwardRef(({ className: t, align: s = "center", sideO
       },
       title: "Options",
       className: t,
-      children: l
+      children: d
     }
   ) : /* @__PURE__ */ e(b, { children: o && /* @__PURE__ */ e(N, { forceMount: !0, children: /* @__PURE__ */ e(
     y,
     {
-      ref: d,
-      align: s,
+      ref: c,
+      align: a,
       sideOffset: i,
       forceMount: !0,
       asChild: !0,
-      ...c,
+      ...l,
       children: /* @__PURE__ */ e(
         p.div,
         {
@@ -114,10 +114,10 @@ const _ = A, $ = j, S = n.forwardRef(({ className: t, align: s = "center", sideO
           exit: { opacity: 0, scale: 0.95 },
           transition: { ...z.snappy, opacity: v.fade },
           className: g(
-            "z-popover w-72 rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-05 text-surface-fg shadow-floating outline-none",
+            "z-popover w-72 rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-05 text-surface-fg shadow-floating outline-hidden",
             t
           ),
-          children: l
+          children: d
         }
       )
     }

package/dist/ui/radio.js

@@ -12,11 +12,11 @@ const p = {
   sm: "h-5 w-5",
   md: "h-6 w-6",
   lg: "h-7 w-7"
-}, b = {
+}, h = {
   sm: "h-1.5 w-1.5",
   md: "h-ds-03 w-ds-03",
   lg: "h-2.5 w-2.5"
-}, h = c.forwardRef(({ className: r, size: a = "md", ...s }, d) => /* @__PURE__ */ e(
+}, b = c.forwardRef(({ className: r, size: a = "md", ...s }, d) => /* @__PURE__ */ e(
   t,
   {
     ref: d,
@@ -25,7 +25,7 @@ const p = {
       p[a],
       "border border-surface-border-strong bg-surface-raised-hover",
       "transition-colors duration-fast-01",
-      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
+      "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
       "disabled:cursor-not-allowed disabled:opacity-action-disabled",
       "hover:border-accent-7 hover:bg-surface-raised-active",
       "data-[state=checked]:border-accent-7",
@@ -39,13 +39,13 @@ const p = {
         initial: { scale: 0 },
         animate: { scale: 1 },
         transition: m.bouncy,
-        children: /* @__PURE__ */ e(l, { className: o(b[a], "fill-accent-9 text-accent-11") })
+        children: /* @__PURE__ */ e(l, { className: o(h[a], "fill-accent-9 text-accent-11") })
       }
     ) })
   }
 ));
-h.displayName = t.displayName;
+b.displayName = t.displayName;
 export {
   u as RadioGroup,
-  h as RadioGroupItem
+  b as RadioGroupItem
 };

package/dist/ui/segmented-control.js

@@ -82,7 +82,7 @@ const C = {
               className: i(
                 "relative inline-flex items-center justify-center gap-ds-02 rounded-ds-md",
                 "font-medium transition-colors duration-fast-02 ease-productive-standard",
-                "outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
+                "outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
                 y,
                 t ? N[l] : "text-surface-fg-muted hover:text-surface-fg"
               ),

package/dist/ui/select.js

@@ -9,7 +9,7 @@ import { tweens as U, springs as G } from "./lib/motion.js";
 import { Icon as i } from "./icon.js";
 import { m as L } from "../_chunks/framer.js";
 const X = C, Y = B, Z = j, k = D(
-  "flex w-full items-center justify-between whitespace-nowrap rounded-ds-md placeholder:text-surface-fg-subtle focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-action-disabled [&>span]:line-clamp-1",
+  "flex w-full items-center justify-between whitespace-nowrap rounded-ds-md placeholder:text-surface-fg-subtle focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-action-disabled [&>span]:line-clamp-1",
   {
     variants: {
       variant: {
@@ -123,7 +123,7 @@ const $ = o.forwardRef(({ className: s, children: r, ...a }, d) => /* @__PURE__
   {
     ref: d,
     className: t(
-      "relative flex w-full cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-03 pr-ds-07 text-ds-md outline-none transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled",
+      "relative flex w-full cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-03 pr-ds-07 text-ds-md outline-hidden transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled",
       s
     ),
     ...a,

package/dist/ui/sheet.js

@@ -17,16 +17,16 @@ const j = r.createContext({ open: !1, onClose: () => {
   children: m,
   ...u
 }) => {
-  const [i, p] = r.useState(o), a = t !== void 0, c = a ? t : i, d = r.useCallback(
+  const [i, p] = r.useState(o), a = t !== void 0, d = a ? t : i, c = r.useCallback(
     (n) => {
       a || p(n), s?.(n);
     },
     [a, s]
   ), h = r.useMemo(
-    () => ({ open: c, onClose: () => d(!1) }),
-    [c, d]
+    () => ({ open: d, onClose: () => c(!1) }),
+    [d, c]
   );
-  return /* @__PURE__ */ e(j.Provider, { value: h, children: /* @__PURE__ */ e(z, { open: c, onOpenChange: d, ...u, children: m }) });
+  return /* @__PURE__ */ e(j.Provider, { value: h, children: /* @__PURE__ */ e(z, { open: d, onOpenChange: c, ...u, children: m }) });
 };
 X.displayName = "Sheet";
 const ie = A, ne = C, _ = T, O = r.forwardRef(({ className: t, ...o }, s) => /* @__PURE__ */ e(v, { forceMount: !0, asChild: !0, children: /* @__PURE__ */ e(
@@ -68,13 +68,13 @@ const y = {
     }
   }
 ), J = r.forwardRef(({ side: t = "right", responsive: o, className: s, children: m, ...u }, i) => {
-  const p = H(), a = o !== !1 && p, c = B(), { open: d, onClose: h } = r.useContext(j), n = a ? "bottom" : t ?? "right", g = r.useRef(null), P = r.useCallback(
+  const p = H(), a = o !== !1 && p, d = B(), { open: c, onClose: h } = r.useContext(j), n = a ? "bottom" : t ?? "right", g = r.useRef(null), P = r.useCallback(
     (f) => {
       g.current = f, typeof i == "function" ? i(f) : i && (i.current = f);
     },
     [i]
   );
-  return /* @__PURE__ */ e(U, { children: d && /* @__PURE__ */ b(_, { forceMount: !0, children: [
+  return /* @__PURE__ */ e(U, { children: c && /* @__PURE__ */ b(_, { forceMount: !0, children: [
     /* @__PURE__ */ e(O, {}),
     /* @__PURE__ */ e(N, { forceMount: !0, asChild: !0, children: /* @__PURE__ */ b(
       M.div,
@@ -85,7 +85,7 @@ const y = {
         animate: q[n],
         exit: y[n],
         transition: E.smooth,
-        drag: a && !c ? "y" : !1,
+        drag: a && !d ? "y" : !1,
         dragConstraints: { top: 0 },
         dragElastic: 0.2,
         onDragEnd: a ? (f, x) => {
@@ -95,7 +95,7 @@ const y = {
         ...R(u),
         children: [
           a && /* @__PURE__ */ e("div", { className: "flex justify-center pt-ds-03 pb-ds-02", children: /* @__PURE__ */ e("div", { className: "h-1 w-8 rounded-ds-full bg-surface-border" }) }),
-          /* @__PURE__ */ b(C, { title: "Close", className: "absolute right-ds-05 top-ds-05 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-sm text-surface-fg-subtle transition-colors ease-productive-standard hover:text-surface-fg-muted hover:bg-surface-raised-hover active:scale-90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none", children: [
+          /* @__PURE__ */ b(C, { title: "Close", className: "absolute right-ds-05 top-ds-05 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-sm text-surface-fg-subtle transition-colors ease-productive-standard hover:text-surface-fg-muted hover:bg-surface-raised-hover active:scale-90 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none", children: [
             /* @__PURE__ */ e(F, { icon: V, size: "sm" }),
             /* @__PURE__ */ e("span", { className: "sr-only", children: "Close" })
           ] }),

package/dist/ui/sidebar.js

@@ -339,7 +339,7 @@ const ge = o(({ className: e, asChild: a = !1, ...t }, r) => /* @__PURE__ */ s(
     ref: r,
     "data-sidebar": "group-label",
     className: i(
-      "flex h-ds-sm shrink-0 items-center rounded-ds-md px-ds-03 text-ds-sm font-medium text-surface-fg-muted outline-none ring-accent-9 transition-[margin,opacity] duration-moderate-02 ease-productive-exit focus-visible:ring-2 [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
+      "flex h-ds-sm shrink-0 items-center rounded-ds-md px-ds-03 text-ds-sm font-medium text-surface-fg-muted outline-hidden ring-accent-9 transition-[margin,opacity] duration-moderate-02 ease-productive-exit focus-visible:ring-2 [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
       "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
       e
     ),
@@ -353,7 +353,7 @@ const he = o(({ className: e, asChild: a = !1, ...t }, r) => /* @__PURE__ */ s(
     ref: r,
     "data-sidebar": "group-action",
     className: i(
-      "hover:bg-surface-raised-hover absolute right-ds-04 top-ds-04 flex aspect-square w-5 items-center justify-center rounded-ds-md p-0 text-surface-fg outline-none ring-accent-9 transition-transform hover:text-surface-fg focus-visible:ring-2 [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
+      "hover:bg-surface-raised-hover absolute right-ds-04 top-ds-04 flex aspect-square w-5 items-center justify-center rounded-ds-md p-0 text-surface-fg outline-hidden ring-accent-9 transition-transform hover:text-surface-fg focus-visible:ring-2 [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
       "after:absolute after:-inset-2 after:md:hidden",
       "group-data-[collapsible=icon]:hidden",
       e
@@ -399,7 +399,7 @@ const Se = o(
 );
 Se.displayName = "SidebarMenuItem";
 const we = T(
-  "peer/menu-button hover:bg-surface-raised-hover active:bg-accent-2 data-[active=true]:bg-accent-2 data-[state=open]:hover:bg-surface-raised-hover flex w-full items-center gap-ds-03 overflow-hidden rounded-ds-md p-ds-03 text-left outline-none ring-accent-9 transition-[width,height,padding] hover:text-surface-fg focus-visible:ring-2 active:text-surface-fg disabled:pointer-events-none disabled:opacity-action-disabled group-has-[[data-sidebar=menu-action]]/menu-item:pr-ds-07 aria-disabled:pointer-events-none aria-disabled:opacity-action-disabled data-[active=true]:font-medium data-[active=true]:text-surface-fg data-[state=open]:hover:text-surface-fg group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-ds-03 [&>span:last-child]:truncate [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
+  "peer/menu-button hover:bg-surface-raised-hover active:bg-accent-2 data-[active=true]:bg-accent-2 data-[state=open]:hover:bg-surface-raised-hover flex w-full items-center gap-ds-03 overflow-hidden rounded-ds-md p-ds-03 text-left outline-hidden ring-accent-9 transition-[width,height,padding] hover:text-surface-fg focus-visible:ring-2 active:text-surface-fg disabled:pointer-events-none disabled:opacity-action-disabled group-has-[[data-sidebar=menu-action]]/menu-item:pr-ds-07 aria-disabled:pointer-events-none aria-disabled:opacity-action-disabled data-[active=true]:font-medium data-[active=true]:text-surface-fg data-[state=open]:hover:text-surface-fg group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-ds-03 [&>span:last-child]:truncate [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
   {
     variants: {
       variant: {
@@ -473,7 +473,7 @@ const ye = o(({ className: e, asChild: a = !1, showOnHover: t = !1, ...r }, d) =
     ref: d,
     "data-sidebar": "menu-action",
     className: i(
-      "hover:bg-surface-raised-hover absolute right-ds-02 top-ds-02b flex aspect-square w-5 items-center justify-center rounded-ds-md p-0 text-surface-fg outline-none ring-accent-9 transition-transform hover:text-surface-fg focus-visible:ring-2 peer-hover/menu-button:text-surface-fg [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
+      "hover:bg-surface-raised-hover absolute right-ds-02 top-ds-02b flex aspect-square w-5 items-center justify-center rounded-ds-md p-0 text-surface-fg outline-hidden ring-accent-9 transition-transform hover:text-surface-fg focus-visible:ring-2 peer-hover/menu-button:text-surface-fg [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0",
       "after:absolute after:-inset-2 after:md:hidden",
       "peer-data-[size=sm]/menu-button:top-1",
       "peer-data-[size=md]/menu-button:top-ds-02b",
@@ -566,7 +566,7 @@ const ke = o(({ asChild: e = !1, size: a = "md", isActive: t, className: r, ...d
     "data-size": a,
     "data-active": t,
     className: i(
-      "hover:bg-surface-raised-hover active:bg-accent-2 flex h-ds-xs-plus min-w-0 -translate-x-px items-center gap-ds-03 overflow-hidden rounded-ds-md px-ds-03 text-surface-fg outline-none ring-accent-9 hover:text-surface-fg focus-visible:ring-2 active:text-surface-fg disabled:pointer-events-none disabled:opacity-action-disabled aria-disabled:pointer-events-none aria-disabled:opacity-action-disabled [&>span:last-child]:truncate [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0 [&>svg]:text-surface-fg",
+      "hover:bg-surface-raised-hover active:bg-accent-2 flex h-ds-xs-plus min-w-0 -translate-x-px items-center gap-ds-03 overflow-hidden rounded-ds-md px-ds-03 text-surface-fg outline-hidden ring-accent-9 hover:text-surface-fg focus-visible:ring-2 active:text-surface-fg disabled:pointer-events-none disabled:opacity-action-disabled aria-disabled:pointer-events-none aria-disabled:opacity-action-disabled [&>span:last-child]:truncate [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0 [&>svg]:text-surface-fg",
       "data-[active=true]:bg-accent-2 data-[active=true]:text-surface-fg",
       a === "sm" && "text-ds-sm",
       a === "md" && "text-ds-md",

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 s, aE as b, aF as u, aG as h } from "../_chunks/primitives.js";
+import { aD as s, aE as b, aF as h, aG as u } from "../_chunks/primitives.js";
 import { cn as m } from "./lib/utils.js";
 const v = f.forwardRef(({ className: i, "aria-label": l, value: a, defaultValue: o, ...t }, n) => {
   const r = (a ?? o ?? [0]).length;
@@ -17,12 +17,12 @@ const v = f.forwardRef(({ className: i, "aria-label": l, value: a, defaultValue:
       ),
       ...t,
       children: [
-        /* @__PURE__ */ e(b, { className: "relative h-ds-02b w-full grow overflow-hidden rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(u, { className: "absolute h-full bg-accent-9" }) }),
+        /* @__PURE__ */ e(b, { className: "relative h-ds-02b w-full grow overflow-hidden rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(h, { className: "absolute h-full bg-accent-9" }) }),
         Array.from({ length: r }, (g, c) => /* @__PURE__ */ e(
-          h,
+          u,
           {
             "aria-label": r === 1 ? l : void 0,
-            className: "touch-target block h-6 w-6 rounded-ds-full border-2 border-accent-7 bg-surface-overlay shadow-raised transition-[color,transform,box-shadow] duration-fast-02 ease-productive-standard hover:scale-110 hover:shadow-raised-hover active:scale-[1.15] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled"
+            className: "touch-target block h-6 w-6 rounded-ds-full border-2 border-accent-7 bg-surface-overlay shadow-raised transition-[color,transform,box-shadow] duration-fast-02 ease-productive-standard hover:scale-110 hover:shadow-raised-hover active:scale-[1.15] focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled"
           },
           c
         ))

package/dist/ui/split-button.js

@@ -189,7 +189,7 @@ const se = n.forwardRef(
                       className: o(
                         "inline-flex items-center justify-center select-none",
                         "transition-colors duration-fast-01 ease-productive-standard",
-                        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset",
+                        "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset",
                         "disabled:pointer-events-none disabled:opacity-action-disabled",
                         y,
                         N[r],
@@ -211,7 +211,7 @@ const se = n.forwardRef(
                     className: o(
                       "inline-flex items-center justify-center font-semibold select-none whitespace-nowrap",
                       "transition-colors duration-fast-01 ease-productive-standard",
-                      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset",
+                      "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset",
                       "disabled:pointer-events-none disabled:opacity-action-disabled",
                       y,
                       N[r],
@@ -236,7 +236,7 @@ const se = n.forwardRef(
                       className: o(
                         "inline-flex items-center justify-center select-none",
                         "transition-colors duration-fast-01 ease-productive-standard",
-                        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset",
+                        "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset",
                         "disabled:pointer-events-none disabled:opacity-action-disabled",
                         y,
                         N[r],

package/dist/ui/switch.js

@@ -13,7 +13,7 @@ const R = {
   accent: "data-[state=checked]:bg-accent-9",
   success: "data-[state=checked]:bg-success-9",
   warning: "data-[state=checked]:bg-warning-9"
-}, S = a.forwardRef(({ className: i, error: d, size: l = "md", color: m = "accent", thumbIcon: h, checked: e, defaultChecked: r, onCheckedChange: s, ...u }, b) => {
+}, S = a.forwardRef(({ className: i, error: d, size: l = "md", color: h = "accent", thumbIcon: m, checked: e, defaultChecked: r, onCheckedChange: s, ...u }, b) => {
   const [f, p] = a.useState(r ?? !1), g = e !== void 0 ? e : f, { track: w, thumb: v, travel: k } = R[l], x = a.useCallback(
     (o) => {
       e === void 0 && p(o), s?.(o);
@@ -24,9 +24,9 @@ const R = {
     c,
     {
       className: n(
-        "touch-target peer inline-flex shrink-0 cursor-pointer items-center rounded-ds-full border-2 border-surface-border-strong shadow-raised transition-colors duration-fast-01 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-action-disabled data-[state=checked]:border-transparent data-[state=unchecked]:bg-surface-border-strong data-[state=unchecked]:hover:bg-surface-raised-active",
+        "touch-target peer inline-flex shrink-0 cursor-pointer items-center rounded-ds-full border-2 border-surface-border-strong shadow-raised transition-colors duration-fast-01 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-action-disabled data-[state=checked]:border-transparent data-[state=unchecked]:bg-surface-border-strong data-[state=unchecked]:hover:bg-surface-raised-active",
         w,
-        j[m],
+        j[h],
         d && "border-error-7 data-[state=checked]:bg-error-9",
         i
       ),
@@ -45,7 +45,7 @@ const R = {
           animate: { x: g ? k : 0 },
           whileTap: { scale: 0.85 },
           transition: y.snappy,
-          children: h
+          children: m
         }
       ) })
     }

package/dist/ui/tabs.js

@@ -48,7 +48,7 @@ const C = e.createContext({
   },
   defaultVariants: { variant: "line", size: "md" }
 }), R = y(
-  "relative inline-flex items-center justify-center gap-ds-02 whitespace-nowrap font-sans font-medium transition-colors duration-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-action-disabled",
+  "relative inline-flex items-center justify-center gap-ds-02 whitespace-nowrap font-sans font-medium transition-colors duration-100 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-action-disabled",
   {
     variants: {
       variant: {
@@ -136,7 +136,7 @@ const S = e.forwardRef(({ className: t, children: n, ...o }, r) => /* @__PURE__
   {
     ref: r,
     className: m(
-      "mt-ds-05 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
+      "mt-ds-05 ring-offset-background focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
       t
     ),
     ...o,

package/dist/ui/textarea.js

@@ -14,7 +14,7 @@ const p = m(
     "placeholder:text-surface-fg-subtle",
     "hover:bg-surface-raised-active",
     "transition-colors duration-fast-01 ease-productive-standard",
-    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:border-accent-7",
+    "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:border-accent-7",
     "disabled:cursor-not-allowed disabled:opacity-action-disabled",
     "read-only:bg-surface-raised read-only:cursor-default"
   ],
@@ -30,8 +30,8 @@ const p = m(
     defaultVariants: { size: "md" }
   }
 ), v = l.forwardRef(
-  ({ className: a, state: i, size: o, ...s }, t) => {
-    const r = b(), e = i ?? (r.state === "helper" ? void 0 : r.state), d = s["aria-describedby"] ?? r.helperTextId, n = s["aria-required"] ?? r.required;
+  ({ className: i, state: a, size: o, ...s }, t) => {
+    const r = b(), e = a ?? (r.state === "helper" ? void 0 : r.state), d = s["aria-describedby"] ?? r.helperTextId, n = s["aria-required"] ?? r.required;
     return /* @__PURE__ */ c(
       x.textarea,
       {
@@ -43,7 +43,7 @@ const p = m(
           e === "error" && "border-error-7 focus-visible:ring-error-7",
           e === "warning" && "border-warning-7 focus-visible:ring-warning-7",
           e === "success" && "border-success-7 focus-visible:ring-success-7",
-          a
+          i
         ),
         ref: t,
         ...f(s)

package/dist/ui/toast.js

@@ -152,7 +152,7 @@ function B({
                 {
                   type: "button",
                   onClick: r.onClick,
-                  className: "text-ds-sm font-medium text-accent-11 underline-offset-2 hover:underline hover:bg-surface-raised-hover rounded-ds-sm px-ds-02 py-ds-01 transition-[color,background-color] duration-fast-01 ease-productive-standard focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:rounded-ds-sm",
+                  className: "text-ds-sm font-medium text-accent-11 underline-offset-2 hover:underline hover:bg-surface-raised-hover rounded-ds-sm px-ds-02 py-ds-01 transition-[color,background-color] duration-fast-01 ease-productive-standard focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:rounded-ds-sm",
                   children: r.label
                 }
               ),
@@ -161,7 +161,7 @@ function B({
                 {
                   type: "button",
                   onClick: n.onClick,
-                  className: "text-ds-sm text-surface-fg-muted hover:text-surface-fg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:rounded-ds-sm",
+                  className: "text-ds-sm text-surface-fg-muted hover:text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:rounded-ds-sm",
                   children: n.label
                 }
               )

package/dist/ui/toggle.js

@@ -7,7 +7,7 @@ import { springs as m, motionProps as c } from "./lib/motion.js";
 import { cn as f } from "./lib/utils.js";
 import { m as l } from "../_chunks/framer.js";
 const p = l.create(e), g = d(
-  "inline-flex items-center justify-center gap-ds-03 rounded-ds-md font-medium transition-colors duration-fast-01 ease-productive-standard focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled data-[state=on]:bg-accent-2 data-[state=on]:text-accent-11",
+  "inline-flex items-center justify-center gap-ds-03 rounded-ds-md font-medium transition-colors duration-fast-01 ease-productive-standard focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled data-[state=on]:bg-accent-2 data-[state=on]:text-accent-11",
   {
     variants: {
       variant: {
@@ -25,14 +25,14 @@ const p = l.create(e), g = d(
       size: "md"
     }
   }
-), u = n.forwardRef(({ className: t, variant: s, size: o, ...a }, r) => /* @__PURE__ */ i(
+), u = n.forwardRef(({ className: t, variant: s, size: a, ...o }, r) => /* @__PURE__ */ i(
   p,
   {
     ref: r,
     whileTap: { scale: 0.95 },
     transition: m.snappy,
-    className: f(g({ variant: s, size: o }), t),
-    ...c(a)
+    className: f(g({ variant: s, size: a }), t),
+    ...c(o)
   }
 ));
 u.displayName = e.displayName;