@alfadocs/ui-kit 0.69.0 → 0.71.0

package/dist/_chunks/{autocomplete-DOeGouCL.js → autocomplete-BrONKN8l.js}

@@ -1,17 +1,17 @@
-import { jsx as n, jsxs as E } from "react/jsx-runtime";
-import { forwardRef as We, useId as Ye, useState as $, useRef as c, useCallback as D, useEffect as R, useMemo as L } from "react";
+import { jsx as n, jsxs as C } from "react/jsx-runtime";
+import { forwardRef as Ze, useId as et, useState as $, useRef as c, useCallback as A, useEffect as R, useMemo as L } from "react";
 import { _ as f } from "./index-4xgbg-sn.js";
-import * as F from "@radix-ui/react-popover";
-import { c as T } from "./index-D2ZczOXr.js";
-import { useTranslation as Ze } from "react-i18next";
+import * as D from "@radix-ui/react-popover";
+import { c as F } from "./index-D2ZczOXr.js";
+import { useTranslation as tt } from "react-i18next";
 import { S as pe } from "./spinner-hbwuKwMf.js";
-import { u as et } from "./form-field-context-B3APVHKx.js";
-import { u as tt } from "./use-controllable-state-BiY4xTzM.js";
-import { g as st } from "./group-options-BvKhQ3xb.js";
-import { I as ot, a as Q, b as G, c as nt } from "./input-surface-xyERuLU_.js";
-import { u as at } from "./registry-DvAUVLHh.js";
-import { u as rt } from "./use-debounced-callback-BisrB-Fq.js";
-const it = {
+import { u as st } from "./form-field-context-B3APVHKx.js";
+import { u as nt } from "./use-controllable-state-BiY4xTzM.js";
+import { g as at } from "./group-options-BvKhQ3xb.js";
+import { I as ot, a as Q, b as G, c as rt } from "./input-surface-xyERuLU_.js";
+import { u as it } from "./registry-DvAUVLHh.js";
+import { u as dt } from "./use-debounced-callback-BisrB-Fq.js";
+const lt = {
   id: "autocomplete",
   capabilities: ["select_single", "filter", "open", "close"],
   state: {
@@ -46,8 +46,8 @@ const it = {
       idempotent: !0,
       descriptionKey: "ui.agent.autocomplete.actions.setValue",
       description: "Set the committed value programmatically.",
-      invoke: (s, u) => {
-        s.setValue(u.value);
+      invoke: (s, l) => {
+        s.setValue(l.value);
       }
     },
     apply_filter: {
@@ -61,8 +61,8 @@ const it = {
       idempotent: !0,
       descriptionKey: "ui.agent.autocomplete.actions.applyFilter",
       description: "Set the input query, which filters the suggestion list.",
-      invoke: (s, u) => {
-        s.setQuery(u.query);
+      invoke: (s, l) => {
+        s.setQuery(l.query);
       }
     },
     clear: {
@@ -105,8 +105,8 @@ const it = {
       description: "Each suggestion emits its value as data-option-id."
     }
   }
-}, dt = T(
-  ["ds:flex ds:w-full ds:items-center", nt].join(" "),
+}, ut = F(
+  ["ds:flex ds:w-full ds:items-center", rt].join(" "),
   {
     variants: {
       size: {
@@ -118,7 +118,7 @@ const it = {
     },
     defaultVariants: { size: "md", tone: "default" }
   }
-), ut = T(
+), ct = F(
   [
     "ds:flex-1 ds:min-w-0 ds:bg-transparent ds:text-foreground",
     "ds:placeholder:text-muted-foreground",
@@ -133,7 +133,7 @@ const it = {
     },
     defaultVariants: { hasStart: !1, hasEnd: !1 }
   }
-), lt = T(
+), pt = F(
   [
     "ds:z-[var(--z-dropdown)] ds:overflow-hidden",
     "ds:rounded-[var(--radius-sm)] ds:border ds:border-border ds:bg-background",
@@ -144,7 +144,7 @@ const it = {
     "ds:data-[state=closed]:zoom-out-95",
     "ds:motion-reduce:animate-none"
   ].join(" ")
-), me = T(
+), me = F(
   [
     "ds:relative ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
     "ds:ps-3 ds:pe-3 ds:py-2 ds:text-[length:var(--font-size-sm)] ds:text-foreground",
@@ -160,150 +160,152 @@ const it = {
   "ds:[&_[cmdk-group-heading]]:type-eyebrow",
   "ds:[&_[cmdk-group-heading]]:text-muted-foreground"
 ].join(" "), X = "ds:inline-flex ds:items-center ds:shrink-0 ds:text-muted-foreground ds:[&_svg]:size-4";
-function J(s, u, A) {
-  return `${s}-${u}-${A}`;
+function J(s, l, T) {
+  return `${s}-${l}-${T}`;
 }
-function ge(s, u) {
-  return `${s}:${u}`;
+function ge(s, l) {
+  return `${s}:${l}`;
 }
-const ct = We(
+const mt = Ze(
   function({
-    loadOptions: u,
-    debounceMs: A = 250,
+    loadOptions: l,
+    debounceMs: T = 250,
     value: he,
     defaultValue: ve,
-    onChange: ye,
-    onSelect: l,
+    onChange: be,
+    onSelect: u,
     recents: v,
     onRecentSelect: B,
-    snapOnBlur: be = !1,
+    snapOnBlur: ye = !1,
     size: we = "md",
-    tone: Ce = "default",
+    tone: xe = "default",
     startAdornment: M,
     endAdornment: q,
     placeholder: W,
-    disabled: xe,
-    readOnly: y,
+    disabled: Ce,
+    readOnly: b,
     required: ke,
-    name: Ve,
+    name: Ne,
     id: K,
-    className: Re,
-    "aria-label": Y
-  }, x) {
-    const { t: b, i18n: Ne } = Ze(), k = et(), Ie = Ye(), g = K ?? k.id ?? Ie, Z = `${g}-listbox`, _e = `${g}-live`, h = !!(k.disabled || xe), Ee = !!(k.required || ke), ee = k.invalid, $e = ee ? "error" : Ce ?? "default", De = k.describedBy || void 0, [Fe, te] = tt({
+    className: Ve,
+    "aria-label": Y,
+    "aria-invalid": Re,
+    "aria-describedby": Ie
+  }, k) {
+    const { t: y, i18n: _e } = tt(), N = st(), Ee = et(), g = K ?? N.id ?? Ee, Z = `${g}-listbox`, $e = `${g}-live`, h = !!(N.disabled || Ce), Ae = !!(N.required || ke), ee = N.invalid || !!Re, De = ee ? "error" : xe ?? "default", Fe = N.describedBy || Ie || void 0, [Te, te] = nt({
       value: he,
       defaultValue: ve ?? "",
-      onChange: ye
-    }), r = Fe ?? "", [i, d] = $(!1), [w, se] = $([]), [V, P] = $(!1), [p, Te] = $(""), N = c(!1), j = c(null), z = c(r), oe = c(/* @__PURE__ */ new Map()), ne = c(/* @__PURE__ */ new Map()), U = c(null), O = c(null), Ae = D(
+      onChange: be
+    }), r = Te ?? "", [i, d] = $(!1), [w, se] = $([]), [V, P] = $(!1), [p, Be] = $(""), I = c(!1), j = c(null), z = c(r), ne = c(/* @__PURE__ */ new Map()), ae = c(/* @__PURE__ */ new Map()), U = c(null), O = c(null), Me = A(
       (e) => {
-        U.current = e, typeof x == "function" ? x(e) : x && (x.current = e);
+        U.current = e, typeof k == "function" ? k(e) : k && (k.current = e);
       },
-      [x]
-    ), ae = Ne.language;
+      [k]
+    ), oe = _e.language;
     R(() => {
       const e = /* @__PURE__ */ new Map();
       for (const t of w) e.set(t.value, t);
-      oe.current = e;
+      ne.current = e;
     }, [w]), R(() => {
       const e = /* @__PURE__ */ new Map();
       if (v) for (const t of v) e.set(t.value, t);
-      ne.current = e;
+      ae.current = e;
     }, [v]);
-    const Be = D(
+    const qe = A(
       (e) => {
-        var o;
-        if (h || y || N.current) return;
-        (o = j.current) == null || o.abort();
+        var a;
+        if (h || b || I.current) return;
+        (a = j.current) == null || a.abort();
         const t = new AbortController();
-        j.current = t, z.current = e, P(!0), u(e, { signal: t.signal, locale: ae }).then((a) => {
-          t.signal.aborted || z.current === e && (se(a), P(!1));
-        }).catch((a) => {
-          t.signal.aborted || a && typeof a == "object" && "name" in a && a.name === "AbortError" || z.current === e && (se([]), P(!1));
+        j.current = t, z.current = e, P(!0), l(e, { signal: t.signal, locale: oe }).then((o) => {
+          t.signal.aborted || z.current === e && (se(o), P(!1));
+        }).catch((o) => {
+          t.signal.aborted || o && typeof o == "object" && "name" in o && o.name === "AbortError" || z.current === e && (se([]), P(!1));
         });
       },
-      [h, y, u, ae]
-    ), C = rt(Be, A);
+      [h, b, l, oe]
+    ), x = dt(qe, T);
     R(() => () => {
       var e;
-      C.cancel(), (e = j.current) == null || e.abort();
-    }, [C]);
-    const m = D(
+      x.cancel(), (e = j.current) == null || e.abort();
+    }, [x]);
+    const m = A(
       (e) => {
         te(e);
       },
       [te]
-    ), re = D(
+    ), re = A(
       (e) => {
-        const [t, o] = e.split(":");
-        if (!o || t !== "recent" && t !== "option") return null;
-        const ce = (t === "recent" ? ne.current : oe.current).get(o);
+        const [t, a] = e.split(":");
+        if (!a || t !== "recent" && t !== "option") return null;
+        const ce = (t === "recent" ? ae.current : ne.current).get(a);
         return ce ? { kind: t, option: ce } : null;
       },
       []
-    ), Me = (e) => {
-      m(e), !(h || y) && (i || d(!0), !N.current && C(e));
-    }, qe = (e) => {
-      N.current = !0;
-    }, Ke = (e) => {
-      N.current = !1;
-      const t = e.currentTarget.value;
-      C(t);
+    ), Ke = (e) => {
+      m(e), !(h || b) && (i || d(!0), !I.current && x(e));
     }, Pe = (e) => {
-      h || y || (d(!0), r && C(r));
+      I.current = !0;
     }, je = (e) => {
+      I.current = !1;
+      const t = e.currentTarget.value;
+      x(t);
+    }, ze = (e) => {
+      h || b || (d(!0), r && x(r));
+    }, Ue = (e) => {
       const t = e.relatedTarget;
       if (!(t && O.current && O.current.contains(t))) {
-        if (be && p) {
-          const o = re(p);
-          o && (m(o.option.label), l == null || l(o.option));
+        if (ye && p) {
+          const a = re(p);
+          a && (m(a.option.label), u == null || u(a.option));
         }
         d(!1);
       }
-    }, ze = (e) => {
+    }, Oe = (e) => {
       if (!e.nativeEvent.isComposing) {
         if (e.key === "Escape") {
           i && (e.preventDefault(), e.stopPropagation(), d(!1));
           return;
         }
         if (e.key === "ArrowDown" && !i) {
-          e.preventDefault(), d(!0), r && C(r);
+          e.preventDefault(), d(!0), r && x(r);
           return;
         }
         if (e.key === "Tab" && i && p) {
           const t = re(p);
-          t && (m(t.option.label), l == null || l(t.option), d(!1));
+          t && (m(t.option.label), u == null || u(t.option), d(!1));
         }
       }
     }, ie = (e, t) => {
-      var o;
-      m(t.label), e === "recent" ? B == null || B(t) : l == null || l(t), d(!1), (o = U.current) == null || o.focus();
+      var a;
+      m(t.label), e === "recent" ? B == null || B(t) : u == null || u(t), d(!1), (a = U.current) == null || a.focus();
     }, S = (e) => {
       e.preventDefault();
-    }, I = !!(v && v.length > 0) && r.length === 0, Ue = L(
-      () => st(w),
+    }, _ = !!(v && v.length > 0) && r.length === 0, Se = L(
+      () => at(w),
       [w]
-    ), Oe = !!M, Se = !!q || V, He = dt({
+    ), He = !!M, Le = !!q || V, Qe = ut({
       size: we,
-      tone: $e,
-      className: Re
-    }), Le = L(() => {
+      tone: De,
+      className: Ve
+    }), Ge = L(() => {
       if (!p) return;
       const [e, t] = p.split(":");
       if (!(!t || e !== "recent" && e !== "option"))
         return J(g, e, t);
-    }, [p, g]), _ = w.length > 0, de = !I && !_ && !V && r.length > 0, ue = V && !_, Qe = I || _ || de || ue, H = c(r);
+    }, [p, g]), E = w.length > 0, de = !_ && !E && !V && r.length > 0, le = V && !E, Xe = _ || E || de || le, H = c(r);
     R(() => {
       H.current = r;
     }, [r]);
-    const le = c(i);
+    const ue = c(i);
     R(() => {
-      le.current = i;
+      ue.current = i;
     }, [i]);
-    const Ge = L(
+    const Je = L(
       () => ({
         getValue: () => H.current || null,
         getQuery: () => H.current,
-        getIsOpen: () => le.current,
+        getIsOpen: () => ue.current,
         setValue: (e) => {
           m(e ?? "");
         },
@@ -322,9 +324,9 @@ const ct = We(
       }),
       [m]
     );
-    at(it, Ge, K);
-    const Xe = w.length, Je = V ? b("common.loading", "Loading…") : i && r.length > 0 ? b("inputs.autocomplete.results", {
-      count: Xe,
+    it(lt, Je, K);
+    const We = w.length, Ye = V ? y("common.loading", "Loading…") : i && r.length > 0 ? y("inputs.autocomplete.results", {
+      count: We,
       defaultValue: "{{count}} results"
     }) : "";
     return /* @__PURE__ */ n(
@@ -332,18 +334,18 @@ const ct = We(
       {
         shouldFilter: !1,
         value: p,
-        onValueChange: Te,
+        onValueChange: Be,
         label: Y ?? W,
         className: "ds:w-full",
-        children: /* @__PURE__ */ E(
-          F.Root,
+        children: /* @__PURE__ */ C(
+          D.Root,
           {
-            open: i && !h && !y && Qe,
+            open: i && !h && !b && Xe,
             children: [
-              /* @__PURE__ */ n(F.Anchor, { asChild: !0, children: /* @__PURE__ */ E(
+              /* @__PURE__ */ n(D.Anchor, { asChild: !0, children: /* @__PURE__ */ C(
                 "div",
                 {
-                  className: He,
+                  className: Qe,
                   "data-component": "autocomplete",
                   "data-component-id": K,
                   "data-disabled": h || void 0,
@@ -352,49 +354,49 @@ const ct = We(
                     /* @__PURE__ */ n(
                       f.Input,
                       {
-                        ref: Ae,
+                        ref: Me,
                         id: g,
-                        name: Ve,
+                        name: Ne,
                         placeholder: W,
                         value: r,
-                        onValueChange: Me,
-                        onFocus: Pe,
-                        onBlur: je,
-                        onKeyDown: ze,
-                        onCompositionStart: qe,
-                        onCompositionEnd: Ke,
+                        onValueChange: Ke,
+                        onFocus: ze,
+                        onBlur: Ue,
+                        onKeyDown: Oe,
+                        onCompositionStart: Pe,
+                        onCompositionEnd: je,
                         disabled: h,
-                        readOnly: y,
-                        required: Ee,
+                        readOnly: b,
+                        required: Ae,
                         role: "combobox",
                         "aria-autocomplete": "both",
                         "aria-expanded": i,
                         "aria-controls": i ? Z : void 0,
-                        "aria-activedescendant": Le,
-                        "aria-describedby": De,
+                        "aria-activedescendant": Ge,
+                        "aria-describedby": Fe,
                         "aria-invalid": ee || void 0,
-                        "aria-label": Y ?? b("inputs.autocomplete.ariaLabel"),
+                        "aria-label": Y ?? y("inputs.autocomplete.ariaLabel"),
                         autoComplete: "off",
-                        className: ut({ hasStart: Oe, hasEnd: Se })
+                        className: ct({ hasStart: He, hasEnd: Le })
                       }
                     ),
                     V ? /* @__PURE__ */ n("span", { className: `${X} ds:pe-3`, "aria-hidden": "true", children: /* @__PURE__ */ n(pe, { variant: "pulse", size: "sm" }) }) : q ? /* @__PURE__ */ n("span", { "aria-hidden": "true", className: `${X} ds:pe-3`, children: q }) : null,
                     /* @__PURE__ */ n(
                       "span",
                       {
-                        id: _e,
+                        id: $e,
                         role: "status",
                         "aria-live": "polite",
                         "aria-atomic": "true",
                         className: "ds:sr-only",
-                        children: Je
+                        children: Ye
                       }
                     )
                   ]
                 }
               ) }),
-              /* @__PURE__ */ n(F.Portal, { forceMount: !0, children: /* @__PURE__ */ n(
-                F.Content,
+              /* @__PURE__ */ n(D.Portal, { forceMount: !0, children: /* @__PURE__ */ n(
+                D.Content,
                 {
                   ref: O,
                   forceMount: !0,
@@ -405,9 +407,9 @@ const ct = We(
                   onOpenAutoFocus: (e) => e.preventDefault(),
                   onCloseAutoFocus: (e) => e.preventDefault(),
                   onPointerDownOutside: (e) => {
-                    var o;
+                    var a;
                     const t = e.target;
-                    if (t && ((o = U.current) != null && o.contains(t))) {
+                    if (t && ((a = U.current) != null && a.contains(t))) {
                       e.preventDefault();
                       return;
                     }
@@ -415,19 +417,19 @@ const ct = We(
                   },
                   onEscapeKeyDown: () => d(!1),
                   onMouseDown: S,
-                  className: lt(),
-                  children: /* @__PURE__ */ E(
+                  className: pt(),
+                  children: /* @__PURE__ */ C(
                     f.List,
                     {
                       id: Z,
                       className: "ds:max-h-[min(24rem,var(--radix-popover-content-available-height))] ds:overflow-auto ds:p-1",
                       children: [
-                        I ? /* @__PURE__ */ n(
+                        _ ? /* @__PURE__ */ n(
                           f.Group,
                           {
-                            heading: b("inputs.autocomplete.recent", "Recent"),
+                            heading: y("inputs.autocomplete.recent", "Recent"),
                             className: fe,
-                            children: (v ?? []).map((e) => /* @__PURE__ */ n(
+                            children: (v ?? []).map((e) => /* @__PURE__ */ C(
                               f.Item,
                               {
                                 id: J(g, "recent", e.value),
@@ -437,41 +439,61 @@ const ct = We(
                                 onSelect: () => ie("recent", e),
                                 onMouseDown: S,
                                 className: me(),
-                                children: e.label
+                                children: [
+                                  e.startAdornment ? /* @__PURE__ */ n(
+                                    "span",
+                                    {
+                                      "aria-hidden": "true",
+                                      className: "ds:inline-flex ds:items-center ds:shrink-0",
+                                      children: e.startAdornment
+                                    }
+                                  ) : null,
+                                  /* @__PURE__ */ n("span", { className: "ds:flex-1 ds:truncate", children: e.label })
+                                ]
                               },
                               `recent-${e.value}`
                             ))
                           }
                         ) : null,
-                        de ? /* @__PURE__ */ n("div", { className: "ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: b("inputs.autocomplete.noResults", "No results") }) : null,
-                        ue ? /* @__PURE__ */ E("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)] ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: [
+                        de ? /* @__PURE__ */ n("div", { className: "ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: y("inputs.autocomplete.noResults", "No results") }) : null,
+                        le ? /* @__PURE__ */ C("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)] ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: [
                           /* @__PURE__ */ n(pe, { variant: "pulse", size: "sm" }),
-                          /* @__PURE__ */ n("span", { children: b("common.loading", "Loading…") })
+                          /* @__PURE__ */ n("span", { children: y("common.loading", "Loading…") })
                         ] }) : null,
-                        !I && _ ? Ue.map((e, t) => {
-                          const o = e.items.map((a) => /* @__PURE__ */ n(
+                        !_ && E ? Se.map((e, t) => {
+                          const a = e.items.map((o) => /* @__PURE__ */ C(
                             f.Item,
                             {
-                              id: J(g, "option", a.value),
-                              "data-option-id": a.value,
-                              value: ge("option", a.value),
-                              disabled: a.disabled,
-                              onSelect: () => ie("option", a),
+                              id: J(g, "option", o.value),
+                              "data-option-id": o.value,
+                              value: ge("option", o.value),
+                              disabled: o.disabled,
+                              onSelect: () => ie("option", o),
                               onMouseDown: S,
                               className: me(),
-                              children: a.label
+                              children: [
+                                o.startAdornment ? /* @__PURE__ */ n(
+                                  "span",
+                                  {
+                                    "aria-hidden": "true",
+                                    className: "ds:inline-flex ds:items-center ds:shrink-0",
+                                    children: o.startAdornment
+                                  }
+                                ) : null,
+                                /* @__PURE__ */ n("span", { className: "ds:flex-1 ds:truncate", children: o.label })
+                              ]
                             },
-                            `option-${a.value}`
+                            `option-${o.value}`
                           ));
                           return e.group ? /* @__PURE__ */ n(
                             f.Group,
                             {
                               heading: e.group,
                               className: fe,
-                              children: o
+                              children: a
                             },
                             `group-${e.group}`
-                          ) : /* @__PURE__ */ n(f.Group, { children: o }, `group-${t}`);
+                          ) : /* @__PURE__ */ n(f.Group, { children: a }, `group-${t}`);
                         }) : null
                       ]
                     }
@@ -484,11 +506,11 @@ const ct = We(
       }
     );
   }
-), pt = ct;
-pt.displayName = "Autocomplete";
+), ft = mt;
+ft.displayName = "Autocomplete";
 export {
-  pt as A,
-  it as a,
-  dt as b
+  ft as A,
+  lt as a,
+  ut as b
 };
-//# sourceMappingURL=autocomplete-DOeGouCL.js.map
+//# sourceMappingURL=autocomplete-BrONKN8l.js.map

package/dist/_chunks/{badge-CqGsX32l.js → badge-DCOqV9mI.js}

@@ -39,7 +39,11 @@ const z = d(
         // trust-signal chips in hero contexts where a tonal `info` / `neutral`
         // would blend into the brand backdrop.
         brand: "ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)] ds:border ds:border-[color:color-mix(in_srgb,var(--foreground)_15%,transparent)]",
-        accent: "ds:bg-[var(--accent)] ds:text-[var(--accent-foreground)] ds:border ds:border-[color:color-mix(in_srgb,var(--foreground)_15%,transparent)]"
+        accent: "ds:bg-[var(--accent)] ds:text-[var(--accent-foreground)] ds:border ds:border-[color:color-mix(in_srgb,var(--foreground)_15%,transparent)]",
+        // Tonal accent (magenta ≈ pink) — the `info` recipe applied to accent.
+        // The kit has no paired tinted-accent foreground, so the label/edge tone
+        // is mixed toward `--foreground` to clear AA on the wash (all 4 themes).
+        accentSoft: "ds:bg-[color:color-mix(in_srgb,var(--accent)_15%,transparent)] ds:text-[color:color-mix(in_srgb,var(--accent)_40%,var(--foreground))] ds:border ds:border-[color:color-mix(in_srgb,var(--accent)_40%,var(--foreground))]"
       },
       size: {
         sm: "ds:h-4 ds:ps-1 ds:pe-1 ds:[--type-eyebrow-size:var(--font-size-2xs)]",
@@ -57,7 +61,7 @@ const z = d(
       shape: "pill"
     }
   }
-), N = d(
+), _ = d(
   "ds:text-[length:var(--font-size-dot)] ds:leading-none ds:shrink-0",
   {
     variants: {
@@ -70,12 +74,13 @@ const z = d(
         // Solid-fill variants: dot draws in the paired foreground tone so
         // it stays visible against the saturated primary/accent fill.
         brand: "ds:text-[var(--primary-foreground)]",
-        accent: "ds:text-[var(--accent-foreground)]"
+        accent: "ds:text-[var(--accent-foreground)]",
+        accentSoft: "ds:text-[var(--accent)]"
       }
     },
     defaultVariants: { variant: "neutral" }
   }
-), V = d("ds:shrink-0 ds:[&>svg]:block", {
+), N = d("ds:shrink-0 ds:[&>svg]:block", {
   variants: {
     size: {
       // Icons shrink with the compact Badge scale: sm badge is 16 px tall, so
@@ -86,43 +91,43 @@ const z = d(
     }
   },
   defaultVariants: { size: "md" }
-}), _ = w(
+}), V = w(
   ({
-    variant: o = "neutral",
-    size: a = "md",
+    variant: a = "neutral",
+    size: n = "md",
     shape: g = "pill",
-    leading: n,
-    withDot: u = !1,
-    truncate: t = !1,
-    className: f,
+    leading: t,
+    withDot: f = !1,
+    truncate: i = !1,
+    className: u,
     children: r,
-    "aria-label": i,
+    "aria-label": e,
     ...v
-  }, p) => {
-    const { t: b } = h(), e = !r && !!i, m = typeof r == "number", c = /* @__PURE__ */ l(
+  }, b) => {
+    const { t: p } = h(), o = !r && !!e, m = typeof r == "number", c = /* @__PURE__ */ l(
       "span",
       {
-        ref: p,
-        className: z({ variant: o, size: a, shape: g, className: f }),
+        ref: b,
+        className: z({ variant: a, size: n, shape: g, className: u }),
         "data-component": "badge",
-        role: e ? "img" : void 0,
-        "aria-label": e ? i : void 0,
+        role: o ? "img" : void 0,
+        "aria-label": o ? e : void 0,
         ...v,
         children: [
-          u && /* @__PURE__ */ s("span", { "aria-hidden": "true", className: N({ variant: o }), children: "●" }),
-          n && /* @__PURE__ */ s("span", { "aria-hidden": "true", className: V({ size: a }), children: n }),
-          !e && (m ? /* @__PURE__ */ l(x, { children: [
+          f && /* @__PURE__ */ s("span", { "aria-hidden": "true", className: _({ variant: a }), children: "●" }),
+          t && /* @__PURE__ */ s("span", { "aria-hidden": "true", className: N({ size: n }), children: t }),
+          !o && (m ? /* @__PURE__ */ l(x, { children: [
             /* @__PURE__ */ s("span", { "aria-hidden": "true", children: r }),
-            /* @__PURE__ */ s("span", { className: "ds:sr-only", children: b("badge.notifications", { count: r }) })
-          ] }) : t ? /* @__PURE__ */ s("span", { className: "ds:max-w-[var(--badge-truncate-max-width)] ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap", children: r }) : r)
+            /* @__PURE__ */ s("span", { className: "ds:sr-only", children: e ?? p("badge.notifications", { count: r }) })
+          ] }) : i ? /* @__PURE__ */ s("span", { className: "ds:max-w-[var(--badge-truncate-max-width)] ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap", children: r }) : r)
         ]
       }
     );
-    return t && typeof r == "string" ? /* @__PURE__ */ s(y, { label: r, children: c }) : c;
+    return i && typeof r == "string" ? /* @__PURE__ */ s(y, { label: r, children: c }) : c;
   }
 );
-_.displayName = "Badge";
+V.displayName = "Badge";
 export {
-  _ as B
+  V as B
 };
-//# sourceMappingURL=badge-CqGsX32l.js.map
+//# sourceMappingURL=badge-DCOqV9mI.js.map