@alfadocs/ui-kit 1.54.3 → 1.56.0

package/dist/_chunks/{select-DHPmASkG.js → select-Ce5RMk93.js}

@@ -1,19 +1,20 @@
-import { jsx as e, jsxs as u } from "react/jsx-runtime";
-import { forwardRef as p, useId as je, useContext as ke, useState as A, useRef as z, useEffect as Re, useMemo as Ve } from "react";
-import { u as Be } from "./registry-DvAUVLHh.js";
-import * as o from "@radix-ui/react-select";
-import { c as _ } from "./index-D2ZczOXr.js";
-import { useTranslation as Oe } from "react-i18next";
-import { u as De, F as Ee, a as Fe } from "./form-field-context-DtiROUJV.js";
-import { g as Ge } from "./group-options-BvKhQ3xb.js";
-import { u as Ae } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
-import { b as _e } from "./menu-row-BAr8bx1I.js";
-import { C as Le } from "./chevron-up-umRGgtJA.js";
-import { C as ee } from "./chevron-down-DWE7GSq9.js";
-import { C as Ke } from "./check-DrFSN__t.js";
-import { u as Pe } from "./use-direction-Dp8h70PP.js";
-import { X as $e } from "./x-B5YnXwCz.js";
-const qe = {
+import { jsx as e, jsxs as p } from "react/jsx-runtime";
+import { forwardRef as m, useId as re, useContext as Be, useState as H, useRef as B, useEffect as _e, useMemo as Oe } from "react";
+import { u as De } from "./registry-DvAUVLHh.js";
+import * as n from "@radix-ui/react-select";
+import { c as U } from "./index-D2ZczOXr.js";
+import { useTranslation as Ae } from "react-i18next";
+import { u as Le, F as Fe, a as Ge } from "./form-field-context-DtiROUJV.js";
+import { g as Pe } from "./group-options-BvKhQ3xb.js";
+import { u as Ke } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { b as We } from "./menu-row-BAr8bx1I.js";
+import { o as le, b as $e, d as qe, c as He } from "./option-row-Dc7BrbK8.js";
+import { C as Me } from "./chevron-up-umRGgtJA.js";
+import { C as ce } from "./chevron-down-DWE7GSq9.js";
+import { C as Ue } from "./check-DrFSN__t.js";
+import { u as Xe } from "./use-direction-Dp8h70PP.js";
+import { X as Je } from "./x-B5YnXwCz.js";
+const Qe = {
   id: "select",
   // Persisted single choice (value state + set_value) → select_single + set_value,
   // plus open/close of the option list.
@@ -97,10 +98,10 @@ const qe = {
       description: "Stable opaque option value emitted on each rendered option."
     }
   }
-}, te = _(
+}, ue = U(
   [
     "ds:group ds:inline-flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)] ds:w-full",
-    "ds:rounded-[var(--radius-sm)] ds:border ds:border-border ds:bg-input",
+    "ds:rounded-[var(--radius-sm)] ds:border ds:border-[color:var(--control-border)] ds:bg-input",
     "ds:shadow-[var(--shadow-input)]",
     "ds:text-foreground ds:placeholder:text-muted-foreground",
     "ds:data-[placeholder]:text-muted-foreground",
@@ -127,9 +128,12 @@ const qe = {
       tone: "default"
     }
   }
-), He = _(
+), Ye = U(
   [
     "ds:z-[var(--z-dropdown)] ds:overflow-hidden",
+    // Never wider than the screen allows: a long option wraps or ends in an
+    // ellipsis instead of running past the edge, where it would be clipped.
+    "ds:max-w-[var(--radix-select-content-available-width)]",
     "ds:rounded-[var(--radius-md)] ds:border ds:border-border ds:bg-background ds:text-foreground",
     "ds:shadow-[var(--shadow-lg)]",
     "ds:animate-in ds:fade-in ds:zoom-in-95",
@@ -139,12 +143,12 @@ const qe = {
     "ds:data-[side=top]:slide-in-from-bottom-2",
     "ds:motion-reduce:animate-none"
   ].join(" ")
-), We = _(
+), Ze = U(
   [
     "ds:relative ds:flex ds:cursor-pointer ds:items-center",
     "ds:rounded-[var(--radius-sm)]",
     "ds:text-foreground ds:outline-none ds:select-none",
-    _e.highlighted,
+    We.highlighted,
     "ds:data-[disabled]:pointer-events-none ds:data-[disabled]:opacity-50"
   ].join(" "),
   {
@@ -159,87 +163,96 @@ const qe = {
       size: "md"
     }
   }
-), Me = [
+), et = [
   "ds:ps-8 ds:pe-3 ds:py-1.5",
   "type-eyebrow ds:text-muted-foreground",
   "ds:sticky ds:top-0 ds:bg-background"
-].join(" "), Ue = {
+].join(" "), tt = {
   sm: "ds:size-3.5",
   md: "ds:size-4",
   lg: "ds:size-5"
-}, Xe = {
+}, st = {
   sm: "ds:start-2",
   md: "ds:start-2",
   lg: "ds:start-3"
 };
-function Je(...t) {
+function at(...t) {
   return (a) => {
-    for (const n of t)
-      n && (typeof n == "function" ? n(a) : n.current = a);
+    for (const o of t)
+      o && (typeof o == "function" ? o(a) : o.current = a);
   };
 }
-const se = (t) => /* @__PURE__ */ e(o.Root, { ...t });
-se.displayName = "Select.Root";
-const ae = p(
-  ({ size: t, tone: a, className: n, children: i, ...m }, r) => /* @__PURE__ */ e(
-    o.Trigger,
+const pe = (t) => /* @__PURE__ */ e(n.Root, { ...t });
+pe.displayName = "Select.Root";
+const me = m(
+  ({ size: t, tone: a, className: o, children: d, ...g }, r) => /* @__PURE__ */ e(
+    n.Trigger,
     {
       ref: r,
-      className: te({ size: t, tone: a, className: n }),
-      ...m,
-      children: i
+      className: ue({ size: t, tone: a, className: o }),
+      ...g,
+      children: d
     }
   )
 );
-ae.displayName = "Select.Trigger";
-const ne = p((t, a) => /* @__PURE__ */ e(o.Value, { ref: a, ...t }));
-ne.displayName = "Select.Value";
-const L = p(
+me.displayName = "Select.Trigger";
+const M = { "data-select-value": "" }, ot = [
+  "ds:[[data-select-value]_&]:block",
+  "ds:[[data-select-value]_&]:truncate"
+].join(" "), fe = m((t, a) => /* @__PURE__ */ e(n.Value, { ref: a, ...M, ...t }));
+fe.displayName = "Select.Value";
+const X = m(
   ({
     className: t,
     children: a,
-    position: n = "popper",
-    sideOffset: i = 4,
-    container: m,
+    position: o = "popper",
+    sideOffset: d = 4,
+    container: g,
     ...r
-  }, S) => /* @__PURE__ */ e(o.Portal, { container: m ?? void 0, children: /* @__PURE__ */ u(
-    o.Content,
+  }, N) => /* @__PURE__ */ e(n.Portal, { container: g ?? void 0, children: /* @__PURE__ */ p(
+    n.Content,
     {
-      ref: S,
-      position: n,
-      sideOffset: i,
+      ref: N,
+      position: o,
+      sideOffset: d,
       "data-component": "select-content",
-      className: He({ className: t }),
+      className: Ye({ className: t }),
       ...r,
       children: [
-        /* @__PURE__ */ e(o.ScrollUpButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ e(Le, { "aria-hidden": "true", className: "ds:size-4" }) }),
+        /* @__PURE__ */ e(n.ScrollUpButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ e(Me, { "aria-hidden": "true", className: "ds:size-4" }) }),
         a,
-        /* @__PURE__ */ e(o.ScrollDownButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ e(ee, { "aria-hidden": "true", className: "ds:size-4" }) })
+        /* @__PURE__ */ e(n.ScrollDownButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ e(ce, { "aria-hidden": "true", className: "ds:size-4" }) })
       ]
     }
   ) })
 );
-L.displayName = "Select.Content";
-const K = p(({ className: t, ...a }, n) => /* @__PURE__ */ e(
-  o.Viewport,
+X.displayName = "Select.Content";
+const J = m(({ className: t, ...a }, o) => /* @__PURE__ */ e(
+  n.Viewport,
   {
-    ref: n,
+    ref: o,
     className: ["ds:p-1", t].filter(Boolean).join(" "),
     ...a
   }
 ));
-K.displayName = "Select.Viewport";
-const P = p(
+J.displayName = "Select.Viewport";
+const Q = m(
   ({
     size: t = "md",
     className: a,
-    children: n,
-    startAdornment: i,
-    endContent: m,
+    children: o,
+    startAdornment: d,
+    endContent: g,
     description: r,
-    ...S
-  }, T) => {
-    const j = Xe[t ?? "md"], N = Ue[t ?? "md"], h = je(), f = r != null && r !== "", b = f ? "ds:group-data-[disabled]/select-item:opacity-50" : "", w = m ? (
+    descriptionTone: N,
+    descriptionInName: _ = !1,
+    wrapLabel: v = !1,
+    ...I
+  }, b) => {
+    const R = st[t ?? "md"], O = tt[t ?? "md"], w = re(), z = re(), l = r != null && r !== "", C = l && _, j = C ? { id: z } : {}, D = C ? { "aria-labelledby": `${z} ${w}` } : {}, V = v ? le({
+      wrap: !0,
+      className: ot
+    }) : "", y = l ? "ds:group-data-[disabled]/select-item:opacity-50" : "", k = g ? (
       // Radix points the item's `aria-labelledby` at `ItemText`, so
       // anything rendered outside it is dropped from the accessible
       // name — a price there would be visible but never announced.
@@ -261,90 +274,98 @@ const P = p(
       // chip would sit against the label instead of the row's end —
       // the ragged column this change exists to remove. `asChild` makes
       // our own span become the ItemText element, so `flex-1` lands.
-      /* @__PURE__ */ e(o.ItemText, { asChild: !0, children: /* @__PURE__ */ u(
+      //
+      // A wrapping label keeps the end content on its first line.
+      /* @__PURE__ */ e(n.ItemText, { asChild: !0, ...j, children: /* @__PURE__ */ p(
         "span",
         {
-          className: `ds:flex ds:flex-1 ds:min-w-0 ds:items-center ds:gap-[var(--spacing-sm)] ${b}`,
+          className: qe({
+            wrap: v,
+            className: y
+          }),
           children: [
-            /* @__PURE__ */ e("span", { className: "ds:min-w-0 ds:truncate", children: n }),
-            /* @__PURE__ */ e("span", { className: "ds:inline-flex ds:items-center ds:ms-auto ds:shrink-0", children: m })
+            /* @__PURE__ */ e("span", { className: V || le(), children: o }),
+            /* @__PURE__ */ e("span", { className: $e, children: g })
           ]
         }
       ) })
-    ) : f ? /* @__PURE__ */ e(o.ItemText, { asChild: !0, children: /* @__PURE__ */ e("span", { className: b, children: n }) }) : /* @__PURE__ */ e(o.ItemText, { children: n });
-    return /* @__PURE__ */ u(
-      o.Item,
+    ) : l || v ? /* @__PURE__ */ e(n.ItemText, { asChild: !0, ...j, children: /* @__PURE__ */ e("span", { className: [V, y].filter(Boolean).join(" "), children: o }) }) : /* @__PURE__ */ e(n.ItemText, { children: o });
+    return /* @__PURE__ */ p(
+      n.Item,
       {
-        ref: T,
-        "aria-describedby": f ? h : void 0,
-        className: We({
+        ref: b,
+        ...D,
+        "aria-describedby": l && !C ? w : void 0,
+        className: Ze({
           size: t,
-          className: f ? [
+          className: l ? [
             "ds:group/select-item ds:data-[disabled]:!opacity-100",
             a
           ].filter(Boolean).join(" ") : a
         }),
-        ...S,
+        ...I,
         children: [
           /* @__PURE__ */ e(
             "span",
             {
-              className: `ds:absolute ${j} ds:inline-flex ds:items-center ds:justify-center ${b}`,
+              className: `ds:absolute ${R} ds:inline-flex ds:items-center ds:justify-center ${y}`,
               "aria-hidden": "true",
-              children: /* @__PURE__ */ e(o.ItemIndicator, { children: /* @__PURE__ */ e(Ke, { className: N }) })
+              children: /* @__PURE__ */ e(n.ItemIndicator, { children: /* @__PURE__ */ e(Ue, { className: O }) })
             }
           ),
-          i ? (
+          d ? (
             // Decorative by contract — accessible name comes from the item text.
             /* @__PURE__ */ e(
               "span",
               {
                 "aria-hidden": "true",
-                className: `ds:inline-flex ds:items-center ds:shrink-0 ds:me-[var(--spacing-xs)] ${b}`,
-                children: i
+                className: `ds:inline-flex ds:items-center ds:shrink-0 ds:me-[var(--spacing-xs)] ${y}`,
+                children: d
               }
             )
           ) : null,
-          f ? /* @__PURE__ */ u("span", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:py-[var(--spacing-xs)]", children: [
-            w,
-            /* @__PURE__ */ e(
+          l || v ? /* @__PURE__ */ p("span", { className: "ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:py-[var(--spacing-xs)]", children: [
+            k,
+            l ? /* @__PURE__ */ e(
               "span",
               {
-                id: h,
-                className: "type-meta ds:text-muted-foreground",
+                id: w,
+                className: He({
+                  tone: N
+                }),
                 children: r
               }
-            )
-          ] }) : w
+            ) : null
+          ] }) : k
         ]
       }
     );
   }
 );
-P.displayName = "Select.Item";
-const oe = p((t, a) => /* @__PURE__ */ e(o.ItemText, { ref: a, ...t }));
-oe.displayName = "Select.ItemText";
-const de = p((t, a) => /* @__PURE__ */ e(o.Group, { ref: a, ...t }));
-de.displayName = "Select.Group";
-const $ = p(({ className: t, ...a }, n) => /* @__PURE__ */ e(
-  o.Label,
+Q.displayName = "Select.Item";
+const ge = m((t, a) => /* @__PURE__ */ e(n.ItemText, { ref: a, ...t }));
+ge.displayName = "Select.ItemText";
+const he = m((t, a) => /* @__PURE__ */ e(n.Group, { ref: a, ...t }));
+he.displayName = "Select.Group";
+const Y = m(({ className: t, ...a }, o) => /* @__PURE__ */ e(
+  n.Label,
   {
-    ref: n,
-    className: [Me, t].filter(Boolean).join(" "),
+    ref: o,
+    className: [et, t].filter(Boolean).join(" "),
     ...a
   }
 ));
-$.displayName = "Select.Label";
-const ie = p(({ className: t, ...a }, n) => /* @__PURE__ */ e(
-  o.Separator,
+Y.displayName = "Select.Label";
+const ve = m(({ className: t, ...a }, o) => /* @__PURE__ */ e(
+  n.Separator,
   {
-    ref: n,
+    ref: o,
     className: ["ds:my-1 ds:h-px ds:bg-border", t].filter(Boolean).join(" "),
     ...a
   }
 ));
-ie.displayName = "Select.Separator";
-const Qe = "ds-select-detached", Ye = /* @__PURE__ */ new Set([
+ve.displayName = "Select.Separator";
+const nt = "ds-select-detached", it = /* @__PURE__ */ new Set([
   "data-component",
   "data-component-id",
   "data-state",
@@ -353,123 +374,137 @@ const Qe = "ds-select-detached", Ye = /* @__PURE__ */ new Set([
   "aria-expanded",
   "aria-controls"
 ]);
-function Ze(t) {
+function dt(t) {
   const a = {};
-  for (const [n, i] of Object.entries(t))
-    i === void 0 || Ye.has(n) || (n.startsWith("data-") || n.startsWith("aria-")) && (a[n] = i);
+  for (const [o, d] of Object.entries(t))
+    d === void 0 || it.has(o) || (o.startsWith("data-") || o.startsWith("aria-")) && (a[o] = d);
   return a;
 }
-const re = p(function({
+const be = m(function({
   options: a,
-  value: n,
-  defaultValue: i,
-  onValueChange: m,
+  value: o,
+  defaultValue: d,
+  onValueChange: g,
   placeholder: r,
-  clearable: S = !1,
-  disabled: T,
-  required: j,
-  name: N,
-  id: h,
-  size: f = "md",
-  tone: b = "default",
+  clearable: N = !1,
+  disabled: _,
+  required: v,
+  name: I,
+  id: b,
+  size: R = "md",
+  tone: O = "default",
   className: w,
-  container: le,
-  "aria-label": q,
-  "aria-describedby": ce,
-  adornmentInTrigger: ue = !1,
-  showDescriptions: pe = !1,
-  ...me
-}, fe) {
-  var Y;
-  const { t: k } = Oe("ui"), y = De(), v = ke(Ee) !== null, [ge, C] = A(
-    n ?? i ?? ""
-  ), x = n !== void 0, l = x ? n : ge, [R, V] = A(!1), H = z(l);
-  H.current = l;
-  const he = Fe(y, h), ve = h ?? (v ? he : void 0), B = (v ? y.disabled : !1) || !!T, O = (v ? y.required : !1) || !!j, W = v ? y.invalid : !1, be = W ? "error" : b, ye = [v ? y.describedBy : void 0, ce].filter(Boolean).join(" ") || void 0, M = ue ? (Y = a.find((s) => s.value === l)) == null ? void 0 : Y.startAdornment : void 0, I = z(null), xe = Je(fe, I), Se = Pe(I), [Ne, Ie] = A(!0);
-  Ae(() => {
+  container: z,
+  "aria-label": l,
+  "aria-describedby": C,
+  adornmentInTrigger: j = !1,
+  showDescriptions: D = !1,
+  descriptionInName: V = !1,
+  wrapOptionLabels: y = !1,
+  ...k
+}, ye) {
+  var ie;
+  const { t: A } = Ae("ui"), x = Le(), h = Be(Fe) !== null, [xe, E] = H(
+    o ?? d ?? ""
+  ), S = o !== void 0, c = S ? o : xe, [L, F] = H(!1), Z = B(c);
+  Z.current = c;
+  const Se = Ge(x, b), Ne = b ?? (h ? Se : void 0), G = (h ? x.disabled : !1) || !!_, P = (h ? x.required : !1) || !!v, ee = h ? x.invalid : !1, Ie = ee ? "error" : O, we = [h ? x.describedBy : void 0, C].filter(Boolean).join(" ") || void 0, te = j ? (ie = a.find((s) => s.value === c)) == null ? void 0 : ie.startAdornment : void 0, T = B(null), Ce = at(ye, T), Te = Xe(T), [Re, ze] = H(!0);
+  Ke(() => {
     var s;
-    l === "" && Ie(!!((s = I.current) != null && s.closest("form")));
+    c === "" && ze(!!((s = T.current) != null && s.closest("form")));
   });
-  const D = l === "" && Ne, U = z(null), E = z(l !== "");
-  Re(() => {
+  const K = c === "" && Re, se = B(null), W = B(c !== "");
+  _e(() => {
     var s;
-    if (l !== "") {
-      E.current = !0;
+    if (c !== "") {
+      W.current = !0;
       return;
     }
-    E.current && (E.current = !1, (s = U.current) == null || s.dispatchEvent(new Event("change", { bubbles: !0 })));
-  }, [l]);
-  const d = m, X = (s) => {
-    x || C(s), d == null || d(s);
-  }, we = (s) => {
-    var c;
-    s.preventDefault(), s.stopPropagation(), x || C(""), d == null || d(""), (c = I.current) == null || c.focus();
-  }, F = r ?? k("inputs.select.placeholder", "Select…"), Ce = S && !!l && !B, J = q ?? (v ? void 0 : F), Q = !q && v ? `${y.id}-label` : void 0, ze = Ge(a), Te = Ve(
+    W.current && (W.current = !1, (s = se.current) == null || s.dispatchEvent(new Event("change", { bubbles: !0 })));
+  }, [c]);
+  const i = g, ae = (s) => {
+    S || E(s), i == null || i(s);
+  }, je = (s) => {
+    var u;
+    s.preventDefault(), s.stopPropagation(), S || E(""), i == null || i(""), (u = T.current) == null || u.focus();
+  }, $ = r ?? A("inputs.select.placeholder", "Select…"), Ve = N && !!c && !G, oe = l ?? (h ? void 0 : $), ne = !l && h ? `${x.id}-label` : void 0, ke = Pe(a), Ee = Oe(
     () => ({
-      getValue: () => H.current,
+      getValue: () => Z.current,
       setValue: (s) => {
-        const c = a.find((G) => G.value === s);
-        !c || c.disabled || (x || C(s), d == null || d(s));
+        const u = a.find((q) => q.value === s);
+        !u || u.disabled || (S || E(s), i == null || i(s));
       },
       clear: () => {
-        x || C(""), d == null || d("");
+        S || E(""), i == null || i("");
       },
-      open: () => V(!0),
-      close: () => V(!1),
-      isOpen: () => R
+      open: () => F(!0),
+      close: () => F(!1),
+      isOpen: () => L
     }),
-    [d, x, R, a]
+    [i, S, L, a]
   );
-  return Be(qe, Te, h), /* @__PURE__ */ u(
-    o.Root,
+  return De(Qe, Ee, b), /* @__PURE__ */ p(
+    n.Root,
     {
-      value: l,
-      onValueChange: X,
-      open: R,
-      onOpenChange: V,
-      disabled: B,
-      required: O,
-      name: D ? void 0 : N,
-      form: D ? Qe : void 0,
-      dir: Se,
+      value: c,
+      onValueChange: ae,
+      open: L,
+      onOpenChange: F,
+      disabled: G,
+      required: P,
+      name: K ? void 0 : I,
+      form: K ? nt : void 0,
+      dir: Te,
       children: [
-        /* @__PURE__ */ u(
-          o.Trigger,
+        /* @__PURE__ */ p(
+          n.Trigger,
           {
-            ref: xe,
-            id: ve,
-            "aria-label": J,
-            "aria-labelledby": Q,
-            "aria-describedby": ye,
-            "aria-invalid": W || void 0,
-            ...Ze(me),
+            ref: Ce,
+            id: Ne,
+            "aria-label": oe,
+            "aria-labelledby": ne,
+            "aria-describedby": we,
+            "aria-invalid": ee || void 0,
+            ...dt(k),
             "data-component": "select",
-            "data-component-id": h,
-            className: te({
-              size: f,
-              tone: be,
+            "data-component-id": b,
+            className: ue({
+              size: R,
+              tone: Ie,
               className: w
             }),
             children: [
-              M ? /* @__PURE__ */ u("span", { className: "ds:flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+              te ? /* @__PURE__ */ p("span", { className: "ds:flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-sm)]", children: [
                 /* @__PURE__ */ e(
                   "span",
                   {
                     "aria-hidden": "true",
                     "data-select-trigger-adornment": "",
                     className: "ds:inline-flex ds:shrink-0 ds:items-center",
-                    children: M
+                    children: te
                   }
                 ),
-                /* @__PURE__ */ e("span", { className: "ds:min-w-0 ds:truncate ds:text-start", children: /* @__PURE__ */ e(o.Value, { placeholder: F }) })
-              ] }) : /* @__PURE__ */ e("span", { className: "ds:min-w-0 ds:truncate ds:text-start", children: /* @__PURE__ */ e(o.Value, { placeholder: F }) }),
-              /* @__PURE__ */ u("span", { className: "ds:ms-auto ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
-                Ce ? /* @__PURE__ */ e(
+                /* @__PURE__ */ e("span", { className: "ds:min-w-0 ds:truncate ds:text-start", children: /* @__PURE__ */ e(
+                  n.Value,
+                  {
+                    ...M,
+                    placeholder: $
+                  }
+                ) })
+              ] }) : /* @__PURE__ */ e("span", { className: "ds:min-w-0 ds:truncate ds:text-start", children: /* @__PURE__ */ e(
+                n.Value,
+                {
+                  ...M,
+                  placeholder: $
+                }
+              ) }),
+              /* @__PURE__ */ p("span", { className: "ds:ms-auto ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+                Ve ? /* @__PURE__ */ e(
                   "button",
                   {
                     type: "button",
-                    "aria-label": k("inputs.select.clear", "Clear selection"),
-                    onClick: we,
+                    "aria-label": A("inputs.select.clear", "Clear selection"),
+                    onClick: je,
                     onPointerDown: (s) => s.stopPropagation(),
                     onKeyDown: (s) => {
                       (s.key === "Enter" || s.key === " ") && s.stopPropagation();
@@ -482,11 +517,11 @@ const re = p(function({
                       "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
                       "ds:size-4"
                     ].join(" "),
-                    children: /* @__PURE__ */ e($e, { "aria-hidden": "true", className: "ds:size-3.5" })
+                    children: /* @__PURE__ */ e(Je, { "aria-hidden": "true", className: "ds:size-3.5" })
                   }
                 ) : null,
-                /* @__PURE__ */ e(o.Icon, { asChild: !0, children: /* @__PURE__ */ e(
-                  ee,
+                /* @__PURE__ */ e(n.Icon, { asChild: !0, children: /* @__PURE__ */ e(
+                  ce,
                   {
                     "aria-hidden": "true",
                     className: [
@@ -500,22 +535,22 @@ const re = p(function({
             ]
           }
         ),
-        D && (N !== void 0 || O) ? /* @__PURE__ */ u(
+        K && (I !== void 0 || P) ? /* @__PURE__ */ p(
           "select",
           {
-            ref: U,
+            ref: se,
             "data-component": "select-field",
             "aria-hidden": !0,
             tabIndex: -1,
-            "aria-label": J,
-            "aria-labelledby": Q,
-            name: N,
-            required: O,
-            disabled: B,
+            "aria-label": oe,
+            "aria-labelledby": ne,
+            name: I,
+            required: P,
+            disabled: G,
             value: "",
             onChange: (s) => {
-              var c;
-              s.target.value !== "" && (document.activeElement === s.target && ((c = I.current) == null || c.focus()), X(s.target.value));
+              var u;
+              s.target.value !== "" && (document.activeElement === s.target && ((u = T.current) == null || u.focus()), ae(s.target.value));
             },
             className: "ds:sr-only",
             children: [
@@ -532,55 +567,58 @@ const re = p(function({
             ]
           }
         ) : null,
-        /* @__PURE__ */ e(L, { container: le, children: /* @__PURE__ */ e(K, { children: a.length === 0 ? /* @__PURE__ */ e("div", { className: "ds:ps-8 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: k("inputs.select.noOptions", "No options") }) : ze.map(({ group: s, items: c }, G) => {
-          const Z = c.map((g) => /* @__PURE__ */ e(
-            P,
+        /* @__PURE__ */ e(X, { container: z, children: /* @__PURE__ */ e(J, { children: a.length === 0 ? /* @__PURE__ */ e("div", { className: "ds:ps-8 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: A("inputs.select.noOptions", "No options") }) : ke.map(({ group: s, items: u }, q) => {
+          const de = u.map((f) => /* @__PURE__ */ e(
+            Q,
             {
-              value: g.value,
-              disabled: g.disabled,
-              size: f,
-              "data-option-id": g.value,
-              startAdornment: g.startAdornment,
-              endContent: g.endContent,
-              description: pe ? g.description : void 0,
-              children: g.label
+              value: f.value,
+              disabled: f.disabled,
+              size: R,
+              "data-option-id": f.value,
+              startAdornment: f.startAdornment,
+              endContent: f.endContent,
+              description: D ? f.description : void 0,
+              descriptionTone: f.descriptionTone,
+              descriptionInName: V,
+              wrapLabel: y,
+              children: f.label
             },
-            g.value
+            f.value
           ));
-          return s ? /* @__PURE__ */ u(o.Group, { children: [
-            /* @__PURE__ */ e($, { children: s }),
-            Z
-          ] }, `group-${s}`) : /* @__PURE__ */ e(o.Group, { children: Z }, `group-${G}`);
+          return s ? /* @__PURE__ */ p(n.Group, { children: [
+            /* @__PURE__ */ e(Y, { children: s }),
+            de
+          ] }, `group-${s}`) : /* @__PURE__ */ e(n.Group, { children: de }, `group-${q}`);
         }) }) })
       ]
     }
   );
 });
-re.displayName = "Select";
-const et = Object.assign(re, {
-  Root: se,
-  Trigger: ae,
-  Value: ne,
-  Content: L,
-  Viewport: K,
-  Item: P,
-  ItemText: oe,
-  Group: de,
-  Label: $,
-  Separator: ie
-}), gt = et;
+be.displayName = "Select";
+const rt = Object.assign(be, {
+  Root: pe,
+  Trigger: me,
+  Value: fe,
+  Content: X,
+  Viewport: J,
+  Item: Q,
+  ItemText: ge,
+  Group: he,
+  Label: Y,
+  Separator: ve
+}), wt = rt;
 export {
-  gt as S,
-  L as a,
-  de as b,
-  P as c,
-  oe as d,
-  $ as e,
-  se as f,
-  ie as g,
-  ae as h,
-  ne as i,
-  K as j,
-  te as s
+  wt as S,
+  X as a,
+  he as b,
+  Q as c,
+  ge as d,
+  Y as e,
+  pe as f,
+  ve as g,
+  me as h,
+  fe as i,
+  J as j,
+  ue as s
 };
-//# sourceMappingURL=select-DHPmASkG.js.map
+//# sourceMappingURL=select-Ce5RMk93.js.map