@devalok/shilp-sutra 0.33.2 → 0.34.0

package/dist/_chunks/badge-group.js

@@ -81,8 +81,8 @@ const J = I(
     className: n,
     variant: d,
     color: e,
-    size: x,
-    asChild: h,
+    size: h,
+    asChild: x,
     startIcon: s,
     endIcon: i,
     dot: g,
@@ -97,7 +97,7 @@ const J = I(
     style: G,
     ...w
   }, K) => {
-    const k = X(), u = d ?? "subtle", C = e ?? "default", f = x ?? "md", m = h ? T : r && t ? "div" : r ? "button" : "span", M = C === "custom" ? {
+    const k = X(), u = d ?? "subtle", C = e ?? "default", f = h ?? "md", m = x ? T : r && t ? "div" : r ? "button" : "span", M = C === "custom" ? {
       ...u === "subtle" && {
         backgroundColor: "color-mix(in oklch, var(--badge-color) 15%, transparent)",
         color: "var(--badge-color)",
@@ -130,7 +130,7 @@ const J = I(
           H(u, C),
           P && Q[f],
           V && U[f],
-          r && "cursor-pointer hover:brightness-[0.97] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 transition-[color,background-color,border-color,transform,filter] duration-moderate-01 ease-productive-exit hover:duration-fast-02 hover:ease-productive-entrance active:scale-[0.95] active:brightness-[0.92] active:duration-[0ms]",
+          r && "cursor-pointer hover:brightness-[0.97] focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 transition-[color,background-color,border-color,transform,filter] duration-moderate-01 ease-productive-exit hover:duration-fast-02 hover:ease-productive-entrance active:scale-[0.95] active:brightness-[0.92] active:duration-[0ms]",
           l && "ring-1 ring-current/20 transition-shadow duration-fast-02",
           p && "opacity-action-disabled pointer-events-none saturate-[0.3]",
           j && "justify-center px-0 aspect-square",
@@ -196,7 +196,7 @@ const J = I(
                 c.stopPropagation(), t();
               },
               className: a(
-                "shrink-0 rounded-full text-current/60 hover:text-current hover:bg-current/10 transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent-9",
+                "shrink-0 rounded-full text-current/60 hover:text-current hover:bg-current/10 transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-accent-9",
                 f === "xs" ? "p-0 -mr-0.5 min-w-[16px] min-h-[16px]" : "p-px"
               ),
               "aria-label": `Remove ${typeof b == "string" ? b : ""}`.trim() || "Remove",
@@ -221,12 +221,12 @@ function B({
   max: n,
   gap: d = "default",
   size: e,
-  onOverflowClick: x,
-  className: h,
+  onOverflowClick: h,
+  className: x,
   children: s
 }) {
   const i = R.Children.toArray(s), g = i.length, t = n !== void 0 && g > n, r = t ? i.slice(0, n) : i, l = t ? g - n : 0;
-  return /* @__PURE__ */ v("div", { className: a("flex flex-wrap items-center", Y[d], h), children: [
+  return /* @__PURE__ */ v("div", { className: a("flex flex-wrap items-center", Y[d], x), children: [
     r,
     t && /* @__PURE__ */ v(
       W,
@@ -234,7 +234,7 @@ function B({
         variant: "outline",
         color: "neutral",
         size: e ?? "sm",
-        onClick: x,
+        onClick: h,
         children: [
           "+",
           l

package/dist/_chunks/date-time-picker.js

@@ -240,7 +240,7 @@ const ke = d.forwardRef(
           className: N(
             "inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-ds-lg border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard",
             "hover:border-surface-border-strong",
-            "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",
             h
           ),
           children: [
@@ -337,7 +337,7 @@ const Ne = {
             "h-ds-sm w-full rounded-ds-md px-ds-03 text-left text-ds-sm",
             "text-surface-fg transition-colors",
             "hover:bg-surface-raised-hover",
-            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9"
+            "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9"
           ),
           children: y.label
         },
@@ -463,7 +463,7 @@ const Se = d.forwardRef(
           className: N(
             "inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-ds-lg border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard",
             "hover:border-surface-border-strong",
-            "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",
             S
           ),
           children: [
@@ -557,7 +557,7 @@ const ve = d.forwardRef(
           className: N(
             "inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-ds-lg border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard",
             "hover:border-surface-border-strong",
-            "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",
             Y && "opacity-action-disabled pointer-events-none",
             C
           ),
@@ -751,7 +751,7 @@ const Ce = d.forwardRef(
             }
           );
       }
-    }, p = "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-overlay px-ds-02 text-ds-md text-surface-fg transition-colors duration-fast-01 ease-productive-standard hover:border-surface-border-strong focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 cursor-pointer appearance-none";
+    }, p = "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-overlay px-ds-02 text-ds-md text-surface-fg transition-colors duration-fast-01 ease-productive-standard hover:border-surface-border-strong focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 cursor-pointer appearance-none";
     return /* @__PURE__ */ M(X, { open: k, onOpenChange: R, children: [
       /* @__PURE__ */ t(Z, { asChild: !0, children: /* @__PURE__ */ M(
         "button",
@@ -762,7 +762,7 @@ const Ce = d.forwardRef(
           className: N(
             "inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-ds-lg border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard",
             "hover:border-surface-border-strong",
-            "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",
             Y
           ),
           "aria-label": D ? `Selected: ${D}` : C,

package/dist/_chunks/document-preview.js

@@ -9,7 +9,7 @@ import { IconChevronLeft as N, IconChevronRight as I } from "@tabler/icons-react
 import { pdfjs as b, Document as A, Page as F } from "react-pdf";
 import { E as k, T as C } from "./file-preview.js";
 import { A as M, m as j } from "./framer.js";
-function $({ url: l, initialPage: u, onError: w }) {
+function $({ url: d, initialPage: u, onError: w }) {
   n.useEffect(() => {
     b.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${b.version}/build/pdf.worker.min.mjs`;
   }, []);
@@ -19,7 +19,7 @@ function $({ url: l, initialPage: u, onError: w }) {
   }, [o]), n.useEffect(() => {
     function t(r) {
       const h = f.current;
-      !h || !h.contains(document.activeElement) && !p || (r.key === "ArrowRight" || r.key === "ArrowDown" ? (r.preventDefault(), s((d) => Math.min(a, d + 1))) : (r.key === "ArrowLeft" || r.key === "ArrowUp") && (r.preventDefault(), s((d) => Math.max(1, d - 1))));
+      !h || !h.contains(document.activeElement) && !p || (r.key === "ArrowRight" || r.key === "ArrowDown" ? (r.preventDefault(), s((l) => Math.min(a, l + 1))) : (r.key === "ArrowLeft" || r.key === "ArrowUp") && (r.preventDefault(), s((l) => Math.max(1, l - 1))));
     }
     return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
   }, [a, p]);
@@ -29,7 +29,7 @@ function $({ url: l, initialPage: u, onError: w }) {
       r >= 1 && r <= a ? s(r) : i(String(o));
     }
   }
-  return P ? /* @__PURE__ */ e(k, { message: "Could not load PDF", url: l }) : /* @__PURE__ */ c(
+  return P ? /* @__PURE__ */ e(k, { message: "Could not load PDF", url: d }) : /* @__PURE__ */ c(
     "div",
     {
       ref: f,
@@ -41,13 +41,13 @@ function $({ url: l, initialPage: u, onError: w }) {
         /* @__PURE__ */ e("div", { className: "overflow-auto max-h-[70vh] rounded-ds-md bg-surface-sunken border border-surface-border", children: /* @__PURE__ */ e(
           A,
           {
-            file: l,
+            file: d,
             onLoadSuccess: ({ numPages: t }) => y(t),
             onLoadError: () => {
               S(!0), w?.("PDF failed to load");
             },
             loading: /* @__PURE__ */ e(L, { className: "h-[500px] w-[400px]" }),
-            error: /* @__PURE__ */ e(k, { message: "Failed to load PDF", url: l }),
+            error: /* @__PURE__ */ e(k, { message: "Failed to load PDF", url: d }),
             children: /* @__PURE__ */ e(M, { mode: "wait", children: /* @__PURE__ */ e(
               j.div,
               {
@@ -72,7 +72,7 @@ function $({ url: l, initialPage: u, onError: w }) {
                 onChange: (t) => i(t.target.value),
                 onKeyDown: E,
                 onBlur: () => i(String(o)),
-                className: "w-8 bg-transparent text-center font-mono text-surface-fg outline-none focus:bg-surface-raised-hover rounded-ds-sm",
+                className: "w-8 bg-transparent text-center font-mono text-surface-fg outline-hidden focus:bg-surface-raised-hover rounded-ds-sm",
                 "aria-label": "Page number"
               }
             ),

package/dist/_chunks/file-preview.js

@@ -27,7 +27,7 @@ function pe({ children: t, className: o }) {
       animate: { opacity: 1, y: 0 },
       transition: j.fade,
       className: D(
-        "flex items-center gap-ds-01 rounded-ds-md border border-surface-border bg-surface-overlay/95 px-ds-02 py-ds-01 shadow-floating backdrop-blur-sm",
+        "flex items-center gap-ds-01 rounded-ds-md border border-surface-border bg-surface-overlay/95 px-ds-02 py-ds-01 shadow-floating backdrop-blur-xs",
         o
       ),
       children: t

package/dist/_chunks/image-preview.js

@@ -24,7 +24,7 @@ function Y({ url: d, alt: g, onError: z }) {
     "div",
     {
       ref: p,
-      className: o ? "fixed inset-0 z-50 flex flex-col items-center justify-center bg-black/90 backdrop-blur-sm" : "relative flex flex-col items-center gap-ds-03",
+      className: o ? "fixed inset-0 z-50 flex flex-col items-center justify-center bg-black/90 backdrop-blur-xs" : "relative flex flex-col items-center gap-ds-03",
       onMouseEnter: () => x(!0),
       onMouseLeave: () => x(!1),
       tabIndex: -1,
@@ -36,7 +36,7 @@ function Y({ url: d, alt: g, onError: z }) {
           maxScale: 8,
           centerOnInit: !0,
           doubleClick: { mode: "toggle", step: 2 },
-          onTransformed: (s, e) => I(Math.round(e.scale * 100)),
+          onTransform: (s, e) => I(Math.round(e.scale * 100)),
           children: ({ zoomIn: s, zoomOut: e, resetTransform: a, centerView: b }) => (v.current = { zoomIn: s, zoomOut: e, resetTransform: a, centerView: b }, /* @__PURE__ */ c(S, { children: [
             /* @__PURE__ */ c("div", { className: u(
               "overflow-hidden rounded-ds-md bg-surface-sunken",
@@ -46,8 +46,8 @@ function Y({ url: d, alt: g, onError: z }) {
               /* @__PURE__ */ t(
                 O,
                 {
-                  wrapperClass: u("!w-full", o && "!h-full"),
-                  contentClass: "!w-full !flex !items-center !justify-center",
+                  wrapperClass: u("w-full!", o && "h-full!"),
+                  contentClass: "w-full! flex! items-center! justify-center!",
                   children: /* @__PURE__ */ t(
                     K.img,
                     {

package/dist/_chunks/tree-view.js

@@ -94,7 +94,7 @@ const R = l.forwardRef(
               className: E(
                 "flex items-center gap-ds-02 py-ds-02 px-ds-02 rounded-ds-md cursor-pointer transition-colors duration-fast-01",
                 "hover:bg-surface-raised",
-                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
+                "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
                 d && "bg-accent-3 text-accent-11",
                 c && "opacity-action-disabled cursor-not-allowed pointer-events-none",
                 y

package/dist/_chunks/typing-indicator.js

@@ -278,7 +278,7 @@ function Y({
         onChange: (c) => h(c.target.value),
         onKeyDown: v,
         onBlur: b,
-        className: "w-full resize-none rounded-ds-sm border border-surface-border-strong bg-surface-raised-hover px-ds-02 py-ds-01 text-[13px] leading-relaxed text-surface-fg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
+        className: "w-full resize-none rounded-ds-sm border border-surface-border-strong bg-surface-raised-hover px-ds-02 py-ds-01 text-[13px] leading-relaxed text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
         rows: 2
       }
     ),
@@ -488,7 +488,7 @@ const de = n.forwardRef(
                 placeholder: s,
                 disabled: r,
                 rows: 1,
-                className: "flex-1 resize-none bg-transparent px-ds-02 py-ds-01 text-ds-sm text-surface-fg placeholder:text-surface-fg-subtle/50 focus:outline-none disabled:opacity-50",
+                className: "flex-1 resize-none bg-transparent px-ds-02 py-ds-01 text-ds-sm text-surface-fg placeholder:text-surface-fg-subtle/50 focus:outline-hidden disabled:opacity-50",
                 style: { maxHeight: 160 }
               }
             ),

package/dist/_chunks/use-calendar.js

@@ -95,7 +95,7 @@ const be = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], he = w.forwardRef(
           {
             type: "button",
             onClick: () => u(z(c, 1)),
-            className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
+            className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
             "aria-label": "Previous month",
             children: /* @__PURE__ */ i(P, { icon: me, size: "sm", stroke: "light" })
           }
@@ -118,7 +118,7 @@ const be = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], he = w.forwardRef(
           {
             type: "button",
             onClick: () => u(B(c, 1)),
-            className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
+            className: "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
             "aria-label": "Next month",
             children: /* @__PURE__ */ i(P, { icon: pe, size: "sm", stroke: "light" })
           }

package/dist/ai/command-bar.js

@@ -264,7 +264,7 @@ const Ue = s.forwardRef(
                     "aria-autocomplete": c ? "list" : void 0,
                     "aria-label": te ? `Ask ${te}` : "AI Command Bar",
                     className: u(
-                      "flex-1 bg-transparent text-surface-fg outline-none",
+                      "flex-1 bg-transparent text-surface-fg outline-hidden",
                       "placeholder:text-surface-fg-subtle",
                       D ? "h-9 text-ds-sm" : "h-12 text-ds-base",
                       A && "cursor-wait",
@@ -290,7 +290,7 @@ const Ue = s.forwardRef(
                 {
                   type: "button",
                   onClick: Ce,
-                  className: "shrink-0 rounded-ds-sm p-ds-01 text-surface-fg-subtle transition-colors duration-fast-01 hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
+                  className: "shrink-0 rounded-ds-sm p-ds-01 text-surface-fg-subtle transition-colors duration-fast-01 hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
                   "aria-label": "Clear",
                   title: "Clear",
                   children: /* @__PURE__ */ e(

package/dist/composed/command-palette.js

@@ -174,7 +174,7 @@ const ke = r.forwardRef(
                   "aria-activedescendant": y[f] ? `command-item-${I}-${y[f].id}` : void 0,
                   "aria-autocomplete": "list",
                   className: N(
-                    "flex-1 bg-transparent text-ds-base text-surface-fg outline-none",
+                    "flex-1 bg-transparent text-ds-base text-surface-fg outline-hidden",
                     "placeholder:text-surface-fg-subtle"
                   ),
                   autoComplete: "off",

package/dist/composed/inline-edit.js

@@ -7,9 +7,9 @@ import { cn as C } from "../ui/lib/utils.js";
 import { Spinner as z } from "../ui/spinner.js";
 const K = i.forwardRef(({
   value: r,
-  onSave: R,
+  onSave: h,
   placeholder: d = "Click to edit",
-  textClassName: h,
+  textClassName: R,
   readOnly: o = !1,
   maxLength: a,
   saving: b = !1,
@@ -34,7 +34,7 @@ const K = i.forwardRef(({
     f(!1);
     const n = (t.current.textContent ?? "").trim(), c = a ? n.slice(0, a) : n;
     if (t.current.textContent = c || r, c === r) return;
-    const g = R(c);
+    const g = h(c);
     if (g instanceof Promise) {
       m(!0);
       try {
@@ -84,8 +84,8 @@ const K = i.forwardRef(({
         onPaste: F,
         spellCheck: s,
         className: C(
-          "font-sans text-surface-fg outline-none",
-          h,
+          "font-sans text-surface-fg outline-hidden",
+          R,
           // Idle: subtle hover hint
           !o && !s && "cursor-text rounded-ds-sm -mx-ds-01 px-ds-01 hover:bg-surface-raised-hover transition-colors duration-fast-01",
           // Focused: subtle underline to indicate editing

package/dist/composed/master-detail.js

@@ -12,15 +12,15 @@ const E = {
   md: "768px",
   lg: "1024px"
 };
-function N(s) {
+function N(o) {
   const [i, c] = e.useState(!1);
   return e.useEffect(() => {
     if (typeof window > "u") return;
-    const r = window.matchMedia(s);
-    c(r.matches);
+    const s = window.matchMedia(o);
+    c(s.matches);
     const t = (a) => c(a.matches);
-    return r.addEventListener("change", t), () => r.removeEventListener("change", t);
-  }, [s]), i;
+    return s.addEventListener("change", t), () => s.removeEventListener("change", t);
+  }, [o]), i;
 }
 const y = e.createContext({
   selected: null,
@@ -34,26 +34,26 @@ const y = e.createContext({
   setItemCount: () => {
   }
 });
-function K({ children: s, className: i, ...c }) {
-  const { selected: r, isMobile: t, onNavigate: a, activeIndex: l, setActiveIndex: m, registerItemRef: u, setItemCount: x } = e.useContext(y), f = e.useRef([]), p = e.Children.count(s);
+function K({ children: o, className: i, ...c }) {
+  const { selected: s, isMobile: t, onNavigate: a, activeIndex: l, setActiveIndex: m, registerItemRef: u, setItemCount: x } = e.useContext(y), f = e.useRef([]), p = e.Children.count(o);
   if (e.useEffect(() => {
     x(p);
-  }, [p, x]), t && r) return null;
+  }, [p, x]), t && s) return null;
   function h(n) {
     if (n.key === "ArrowDown") {
       n.preventDefault();
-      const o = Math.min(l + 1, p - 1);
-      m(o), f.current[o]?.focus(), a?.("down");
+      const r = Math.min(l + 1, p - 1);
+      m(r), f.current[r]?.focus(), a?.("down");
     } else if (n.key === "ArrowUp") {
       n.preventDefault();
-      const o = Math.max(l - 1, 0);
-      m(o), f.current[o]?.focus(), a?.("up");
+      const r = Math.max(l - 1, 0);
+      m(r), f.current[r]?.focus(), a?.("up");
     } else if (n.key === "Home")
       n.preventDefault(), m(0), f.current[0]?.focus();
     else if (n.key === "End") {
       n.preventDefault();
-      const o = p - 1;
-      m(o), f.current[o]?.focus();
+      const r = p - 1;
+      m(r), f.current[r]?.focus();
     }
   }
   return /* @__PURE__ */ d(
@@ -62,24 +62,24 @@ function K({ children: s, className: i, ...c }) {
       role: "listbox",
       tabIndex: -1,
       className: b(
-        "overflow-y-auto focus-visible:outline-none",
+        "overflow-y-auto focus-visible:outline-hidden",
         !t && "border-r border-surface-border",
         i
       ),
       onKeyDown: h,
       ...c,
-      children: e.Children.map(s, (n, o) => e.isValidElement(n) ? e.cloneElement(n, {
+      children: e.Children.map(o, (n, r) => e.isValidElement(n) ? e.cloneElement(n, {
         ref: (v) => {
-          f.current[o] = v, u(o, v);
+          f.current[r] = v, u(r, v);
         },
-        tabIndex: o === l ? 0 : -1
+        tabIndex: r === l ? 0 : -1
       }) : n)
     }
   );
 }
-function S({ children: s, className: i, ...c }) {
-  const { selected: r, isMobile: t, onBack: a, emptyState: l } = e.useContext(y);
-  return t && !r ? null : /* @__PURE__ */ D("div", { className: b("flex-1 overflow-y-auto", i), ...c, children: [
+function S({ children: o, className: i, ...c }) {
+  const { selected: s, isMobile: t, onBack: a, emptyState: l } = e.useContext(y);
+  return t && !s ? null : /* @__PURE__ */ D("div", { className: b("flex-1 overflow-y-auto", i), ...c, children: [
     t && a && /* @__PURE__ */ d("div", { className: "border-b border-surface-border px-ds-04 py-ds-03", children: /* @__PURE__ */ d(C, { variant: "ghost", size: "xs", onClick: a, startIcon: /* @__PURE__ */ d(k, { icon: M }), children: "Back" }) }),
     /* @__PURE__ */ d(L, { mode: "wait", children: /* @__PURE__ */ d(
       A.div,
@@ -88,14 +88,14 @@ function S({ children: s, className: i, ...c }) {
         animate: { x: 0, opacity: 1 },
         exit: t ? { x: -20, opacity: 0 } : void 0,
         transition: R.snappy,
-        children: r ? s : l ?? s
+        children: s ? o : l ?? o
       },
-      r ?? "empty"
+      s ?? "empty"
     ) })
   ] });
 }
 const j = e.forwardRef(
-  function({ active: i = !1, children: c, className: r, onKeyDown: t, ...a }, l) {
+  function({ active: i = !1, children: c, className: s, onKeyDown: t, ...a }, l) {
     function m(u) {
       (u.key === "Enter" || u.key === " ") && (u.preventDefault(), u.target.click()), t?.(u);
     }
@@ -112,9 +112,9 @@ const j = e.forwardRef(
           "flex w-full items-center px-ds-04 py-ds-03 text-left text-ds-md font-sans text-surface-fg",
           "transition-colors duration-fast-01 ease-productive-standard",
           "hover:bg-surface-raised-hover",
-          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-7 focus-visible:ring-inset",
+          "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-7 focus-visible:ring-inset",
           i && "bg-accent-2 text-accent-11 border-l-2 border-accent-9",
-          r
+          s
         ),
         ...a,
         children: c
@@ -123,10 +123,10 @@ const j = e.forwardRef(
   }
 );
 function B({
-  selected: s = null,
+  selected: o = null,
   onBack: i,
   masterWidth: c = "280px",
-  breakpoint: r = "md",
+  breakpoint: s = "md",
   emptyState: t,
   onNavigate: a,
   children: l,
@@ -134,10 +134,10 @@ function B({
   style: u,
   ...x
 }) {
-  const f = N(`(max-width: ${E[r]})`), [p, h] = e.useState(0), [n, o] = e.useState(0), v = e.useRef([]), I = e.useCallback((g, w) => {
+  const f = N(`(max-width: ${E[s]})`), [p, h] = e.useState(0), [n, r] = e.useState(0), v = e.useRef([]), I = e.useCallback((g, w) => {
     v.current[g] = w;
   }, []);
-  return /* @__PURE__ */ d(y.Provider, { value: { selected: s, isMobile: f, onBack: i, emptyState: t, onNavigate: a, activeIndex: p, setActiveIndex: h, registerItemRef: I, itemCount: n, setItemCount: o }, children: /* @__PURE__ */ d(
+  return /* @__PURE__ */ d(y.Provider, { value: { selected: o, isMobile: f, onBack: i, emptyState: t, onNavigate: a, activeIndex: p, setActiveIndex: h, registerItemRef: I, itemCount: n, setItemCount: r }, children: /* @__PURE__ */ d(
     "div",
     {
       className: b(

package/dist/composed/multi-select-popover.js

@@ -156,7 +156,7 @@ const V = r.forwardRef(
                   onKeyDown: B,
                   "aria-label": "Search",
                   "aria-activedescendant": a >= 0 ? `msp-item-${a}` : void 0,
-                  className: "w-full bg-transparent text-ds-md font-body text-surface-fg placeholder:text-surface-fg-subtle outline-none"
+                  className: "w-full bg-transparent text-ds-md font-body text-surface-fg placeholder:text-surface-fg-subtle outline-hidden"
                 }
               ),
               S && /* @__PURE__ */ n(_, { size: "sm" })

package/dist/composed/page-header.js

@@ -1,6 +1,6 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import * as o from "react";
-import { cn as d } from "../ui/lib/utils.js";
+import { cn as n } from "../ui/lib/utils.js";
 const x = o.forwardRef(
   ({ title: c, subtitle: r, actions: a, breadcrumbs: s, titleClassName: f, className: h, ...g }, m) => {
     const i = c ?? s?.[s.length - 1]?.label ?? "";
@@ -8,14 +8,14 @@ const x = o.forwardRef(
       "div",
       {
         ref: m,
-        className: d(
+        className: n(
           "flex flex-col gap-ds-05 border-b border-surface-border-strong pb-ds-06",
           h
         ),
         ...g,
         children: [
-          s && s.length > 0 && /* @__PURE__ */ e("nav", { "aria-label": "Breadcrumb", className: "flex items-center gap-ds-02b", children: s.map((t, n) => /* @__PURE__ */ l(o.Fragment, { children: [
-            n > 0 && /* @__PURE__ */ e(
+          s && s.length > 0 && /* @__PURE__ */ e("nav", { "aria-label": "Breadcrumb", className: "flex items-center gap-ds-02b", children: s.map((t, d) => /* @__PURE__ */ l(o.Fragment, { children: [
+            d > 0 && /* @__PURE__ */ e(
               "svg",
               {
                 width: 16,
@@ -35,26 +35,26 @@ const x = o.forwardRef(
               "a",
               {
                 href: t.href,
-                className: "text-ds-sm text-surface-fg-subtle transition-colors hover:text-surface-fg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 rounded-ds-sm",
+                className: "text-ds-sm text-surface-fg-subtle transition-colors hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 rounded-ds-sm",
                 children: t.label
               }
             ) : /* @__PURE__ */ e(
               "span",
               {
-                className: d(
+                className: n(
                   "text-ds-sm",
-                  n === s.length - 1 ? "text-surface-fg" : "text-surface-fg-subtle"
+                  d === s.length - 1 ? "text-surface-fg" : "text-surface-fg-subtle"
                 ),
                 children: t.label
               }
             )
-          ] }, n)) }),
+          ] }, d)) }),
           (i || r || a) && /* @__PURE__ */ l("div", { className: "flex items-start justify-between gap-ds-05", children: [
             /* @__PURE__ */ l("div", { className: "flex flex-col gap-ds-02b", children: [
               i && /* @__PURE__ */ e(
                 "h1",
                 {
-                  className: d(
+                  className: n(
                     "text-ds-2xl font-semibold text-surface-fg",
                     f
                   ),

package/dist/composed/rich-chat-input.js

@@ -226,7 +226,7 @@ function nt({ value: r, onChange: n }) {
       {
         value: t,
         onChange: (o) => d(Number(o.target.value)),
-        className: "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02 text-ds-sm text-surface-fg focus:outline-none focus:ring-2 focus:ring-accent-9",
+        className: "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02 text-ds-sm text-surface-fg focus:outline-hidden focus:ring-2 focus:ring-accent-9",
         "aria-label": "Hour",
         children: Array.from({ length: 12 }, (o, c) => c + 1).map((o) => /* @__PURE__ */ e("option", { value: o, children: o }, o))
       }
@@ -237,7 +237,7 @@ function nt({ value: r, onChange: n }) {
       {
         value: i - i % 5,
         onChange: (o) => u(Number(o.target.value)),
-        className: "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02 text-ds-sm text-surface-fg focus:outline-none focus:ring-2 focus:ring-accent-9",
+        className: "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02 text-ds-sm text-surface-fg focus:outline-hidden focus:ring-2 focus:ring-accent-9",
         "aria-label": "Minute",
         children: Array.from({ length: 12 }, (o, c) => c * 5).map((o) => /* @__PURE__ */ e("option", { value: o, children: String(o).padStart(2, "0") }, o))
       }
@@ -294,7 +294,7 @@ function kr({
           value: d,
           min: f,
           onChange: u,
-          className: "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-03 text-ds-sm text-surface-fg focus:outline-none focus:ring-2 focus:ring-accent-9"
+          className: "h-ds-sm rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-03 text-ds-sm text-surface-fg focus:outline-hidden focus:ring-2 focus:ring-accent-9"
         }
       )
     ] }),
@@ -1007,7 +1007,7 @@ const ot = a.forwardRef(
               onClick: k,
               onKeyDown: T,
               "aria-label": c ? "Pause voice message" : "Play voice message",
-              className: "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-ds-full bg-accent-9 text-accent-fg hover:bg-accent-10 active:scale-95 transition-colors duration-fast-01 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
+              className: "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-ds-full bg-accent-9 text-accent-fg hover:bg-accent-10 active:scale-95 transition-colors duration-fast-01 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
               children: c ? /* @__PURE__ */ e(er, { size: 16, stroke: 2, "aria-hidden": "true" }) : /* @__PURE__ */ e(tr, { size: 16, stroke: 2, "aria-hidden": "true" })
             }
           ),
@@ -1033,7 +1033,7 @@ const ot = a.forwardRef(
               type: "button",
               onClick: A,
               "aria-label": `Playback speed ${M}x`,
-              className: "shrink-0 text-ds-xs bg-surface-raised rounded-ds-full px-ds-02 py-[1px] hover:bg-surface-raised-hover tabular-nums transition-colors duration-fast-01 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
+              className: "shrink-0 text-ds-xs bg-surface-raised rounded-ds-full px-ds-02 py-[1px] hover:bg-surface-raised-hover tabular-nums transition-colors duration-fast-01 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
               children: [
                 M,
                 "x"
@@ -1141,7 +1141,7 @@ const Wr = {
   minimal: { minHeight: 44, maxHeight: 128, showToolbar: !1, toolbarPosition: "bottom" },
   inline: { minHeight: 40, maxHeight: 160, showToolbar: !1, toolbarPosition: "top" }
 }, Vr = [
-  "prose prose-sm max-w-none focus:outline-none",
+  "prose prose-sm max-w-none focus:outline-hidden",
   "font-body text-ds-md leading-relaxed text-surface-fg",
   "[&_p.is-editor-empty:first-child]:relative",
   "[&_p.is-editor-empty:first-child::before]:text-surface-fg-subtle [&_p.is-editor-empty:first-child::before]:content-[attr(data-placeholder)] [&_p.is-editor-empty:first-child::before]:pointer-events-none [&_p.is-editor-empty:first-child::before]:absolute [&_p.is-editor-empty:first-child::before]:left-0 [&_p.is-editor-empty:first-child::before]:top-0 [&_p.is-editor-empty:first-child::before]:w-full [&_p.is-editor-empty:first-child::before]:truncate",
@@ -1151,7 +1151,7 @@ const Wr = {
   "[&_li]:text-surface-fg",
   "[&_code]:rounded [&_code]:bg-surface-raised [&_code]:px-ds-02 [&_code]:py-[1px] [&_code]:text-ds-md [&_code]:text-accent-11",
   "[&_strong]:font-semibold [&_strong]:text-surface-fg",
-  "[&_mark]:rounded-sm [&_mark]:bg-warning-3 [&_mark]:px-[2px]",
+  "[[&_mark]:rounded-sm_mark]:rounded-xs [&_mark]:bg-warning-3 [&_mark]:px-[2px]",
   "[&_a]:text-accent-11 [&_a]:underline",
   "[&_.mention]:rounded-ds-sm [&_.mention]:bg-accent-2 [&_.mention]:px-ds-02 [&_.mention]:py-[1px] [&_.mention]:font-medium [&_.mention]:text-accent-11"
 ].join(" ");
@@ -1591,7 +1591,7 @@ const Jr = a.forwardRef(
                     {
                       ref: ut,
                       className: z(
-                        "flex items-center px-ds-04 py-ds-03 cursor-text [&_.tiptap]:w-full [&_.tiptap]:outline-none",
+                        "flex items-center px-ds-04 py-ds-03 cursor-text [&_.tiptap]:w-full [&_.tiptap]:outline-hidden",
                         D === "recording" && "invisible"
                       ),
                       style: {