@cfx-dev/ui-components 5.0.14 → 5.0.16

package/dist/{DropdownContent-BMfQCuaP.js → DropdownContent-BTzahw95.js}

@@ -1,37 +1,37 @@
 import { jsx as s } from "react/jsx-runtime";
 import * as a from "react";
 import gn from "react";
-import { c as me, P as N, a as g, b as U, u as ye, g as wn, f as Mn, h as Pe } from "./index-CfQtbUfi.js";
+import { c as me, P as N, a as g, b as U, u as ye, g as wn, f as _n, h as Pe } from "./index-CfQtbUfi.js";
 import { c as xe, u as Te } from "./index-9LBuZ7x4.js";
-import { u as le, a as ve, c as Ae, h as _n, b as hn, R as Cn, F as Rn, D as In, C as bn, d as En, A as Sn, e as Dn } from "./Combination-CcTTSYNP.js";
+import { u as le, a as ve, c as Ae, h as Mn, b as hn, R as Cn, F as Rn, D as In, C as bn, d as En, A as Sn, e as Dn } from "./Combination-CcTTSYNP.js";
 import { P as ge } from "./index-3ctv5u9o.js";
 import { clsx as Se } from "./utils/clsx.js";
 import { ui as yn } from "./utils/ui/ui.js";
-var de = "rovingFocusGroup.onEntryFocus", Pn = { bubbles: !1, cancelable: !0 }, z = "RovingFocusGroup", [fe, Ne, xn] = xe(z), [Tn, Oe] = me(
-  z,
+var de = "rovingFocusGroup.onEntryFocus", Pn = { bubbles: !1, cancelable: !0 }, Z = "RovingFocusGroup", [fe, Ne, xn] = xe(Z), [Tn, Oe] = me(
+  Z,
   [xn]
-), [An, Nn] = Tn(z), Fe = a.forwardRef(
+), [An, Nn] = Tn(Z), Fe = a.forwardRef(
   (e, t) => /* @__PURE__ */ s(fe.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ s(fe.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ s(On, { ...e, ref: t }) }) })
 );
-Fe.displayName = z;
+Fe.displayName = Z;
 var On = a.forwardRef((e, t) => {
   const {
     __scopeRovingFocusGroup: n,
     orientation: o,
     loop: r = !1,
     dir: c,
-    currentTabStopId: i,
+    currentTabStopId: d,
     defaultCurrentTabStopId: l,
     onCurrentTabStopIdChange: m,
     onEntryFocus: v,
-    preventScrollOnEntryFocus: d = !1,
-    ...u
-  } = e, f = a.useRef(null), M = U(t, f), w = Te(c), [b, _] = ye({
-    prop: i,
+    preventScrollOnEntryFocus: u = !1,
+    ...i
+  } = e, f = a.useRef(null), _ = U(t, f), w = Te(c), [b, M] = ye({
+    prop: d,
     defaultProp: l ?? null,
     onChange: m,
-    caller: z
-  }), [R, T] = a.useState(!1), h = ve(v), D = Ne(n), B = a.useRef(!1), [J, O] = a.useState(0);
+    caller: Z
+  }), [R, T] = a.useState(!1), h = ve(v), D = Ne(n), B = a.useRef(!1), [Q, O] = a.useState(0);
   return a.useEffect(() => {
     const C = f.current;
     if (C)
@@ -45,8 +45,8 @@ var On = a.forwardRef((e, t) => {
       loop: r,
       currentTabStopId: b,
       onItemFocus: a.useCallback(
-        (C) => _(C),
-        [_]
+        (C) => M(C),
+        [M]
       ),
       onItemShiftTab: a.useCallback(() => T(!0), []),
       onFocusableItemAdd: a.useCallback(
@@ -60,10 +60,10 @@ var On = a.forwardRef((e, t) => {
       children: /* @__PURE__ */ s(
         N.div,
         {
-          tabIndex: R || J === 0 ? -1 : 0,
+          tabIndex: R || Q === 0 ? -1 : 0,
           "data-orientation": o,
-          ...u,
-          ref: M,
+          ...i,
+          ref: _,
           style: { outline: "none", ...e.style },
           onMouseDown: g(e.onMouseDown, () => {
             B.current = !0;
@@ -73,10 +73,10 @@ var On = a.forwardRef((e, t) => {
             if (C.target === C.currentTarget && G && !R) {
               const F = new CustomEvent(de, Pn);
               if (C.currentTarget.dispatchEvent(F), !F.defaultPrevented) {
-                const V = D().filter((P) => P.focusable), W = V.find((P) => P.active), Q = V.find((P) => P.id === b), se = [W, Q, ...V].filter(
+                const V = D().filter((P) => P.focusable), W = V.find((P) => P.active), ee = V.find((P) => P.id === b), se = [W, ee, ...V].filter(
                   Boolean
                 ).map((P) => P.ref.current);
-                Le(se, d);
+                Le(se, u);
               }
             }
             B.current = !1;
@@ -93,13 +93,13 @@ var On = a.forwardRef((e, t) => {
       focusable: o = !0,
       active: r = !1,
       tabStopId: c,
-      children: i,
+      children: d,
       ...l
-    } = e, m = le(), v = c || m, d = Nn(ke, n), u = d.currentTabStopId === v, f = Ne(n), { onFocusableItemAdd: M, onFocusableItemRemove: w, currentTabStopId: b } = d;
+    } = e, m = le(), v = c || m, u = Nn(ke, n), i = u.currentTabStopId === v, f = Ne(n), { onFocusableItemAdd: _, onFocusableItemRemove: w, currentTabStopId: b } = u;
     return a.useEffect(() => {
       if (o)
-        return M(), () => w();
-    }, [o, M, w]), /* @__PURE__ */ s(
+        return _(), () => w();
+    }, [o, _, w]), /* @__PURE__ */ s(
       fe.ItemSlot,
       {
         scope: n,
@@ -109,35 +109,35 @@ var On = a.forwardRef((e, t) => {
         children: /* @__PURE__ */ s(
           N.span,
           {
-            tabIndex: u ? 0 : -1,
-            "data-orientation": d.orientation,
+            tabIndex: i ? 0 : -1,
+            "data-orientation": u.orientation,
             ...l,
             ref: t,
-            onMouseDown: g(e.onMouseDown, (_) => {
-              o ? d.onItemFocus(v) : _.preventDefault();
+            onMouseDown: g(e.onMouseDown, (M) => {
+              o ? u.onItemFocus(v) : M.preventDefault();
             }),
-            onFocus: g(e.onFocus, () => d.onItemFocus(v)),
-            onKeyDown: g(e.onKeyDown, (_) => {
-              if (_.key === "Tab" && _.shiftKey) {
-                d.onItemShiftTab();
+            onFocus: g(e.onFocus, () => u.onItemFocus(v)),
+            onKeyDown: g(e.onKeyDown, (M) => {
+              if (M.key === "Tab" && M.shiftKey) {
+                u.onItemShiftTab();
                 return;
               }
-              if (_.target !== _.currentTarget) return;
-              const R = Gn(_, d.orientation, d.dir);
+              if (M.target !== M.currentTarget) return;
+              const R = Gn(M, u.orientation, u.dir);
               if (R !== void 0) {
-                if (_.metaKey || _.ctrlKey || _.altKey || _.shiftKey) return;
-                _.preventDefault();
+                if (M.metaKey || M.ctrlKey || M.altKey || M.shiftKey) return;
+                M.preventDefault();
                 let h = f().filter((D) => D.focusable).map((D) => D.ref.current);
                 if (R === "last") h.reverse();
                 else if (R === "prev" || R === "next") {
                   R === "prev" && h.reverse();
-                  const D = h.indexOf(_.currentTarget);
-                  h = d.loop ? Ln(h, D + 1) : h.slice(D + 1);
+                  const D = h.indexOf(M.currentTarget);
+                  h = u.loop ? Ln(h, D + 1) : h.slice(D + 1);
                 }
                 setTimeout(() => Le(h));
               }
             }),
-            children: typeof i == "function" ? i({ isCurrentTabStop: u, hasTabStop: b != null }) : i
+            children: typeof d == "function" ? d({ isCurrentTabStop: i, hasTabStop: b != null }) : d
           }
         )
       }
@@ -177,42 +177,42 @@ var Kn = Fe, Un = Ge, pe = ["Enter", " "], $n = ["ArrowDown", "PageUp", "Home"],
 }, Wn = {
   ltr: ["ArrowLeft"],
   rtl: ["ArrowRight"]
-}, Z = "Menu", [H, Yn, Xn] = xe(Z), [k, Ue] = me(Z, [
+}, q = "Menu", [j, Yn, Xn] = xe(q), [k, Ue] = me(q, [
   Xn,
   Ae,
   Oe
-]), re = Ae(), $e = Oe(), [Hn, $] = k(Z), [jn, q] = k(Z), Be = (e) => {
-  const { __scopeMenu: t, open: n = !1, children: o, dir: r, onOpenChange: c, modal: i = !0 } = e, l = re(t), [m, v] = a.useState(null), d = a.useRef(!1), u = ve(c), f = Te(r);
+]), re = Ae(), $e = Oe(), [Hn, $] = k(q), [jn, J] = k(q), Be = (e) => {
+  const { __scopeMenu: t, open: n = !1, children: o, dir: r, onOpenChange: c, modal: d = !0 } = e, l = re(t), [m, v] = a.useState(null), u = a.useRef(!1), i = ve(c), f = Te(r);
   return a.useEffect(() => {
-    const M = () => {
-      d.current = !0, document.addEventListener("pointerdown", w, { capture: !0, once: !0 }), document.addEventListener("pointermove", w, { capture: !0, once: !0 });
-    }, w = () => d.current = !1;
-    return document.addEventListener("keydown", M, { capture: !0 }), () => {
-      document.removeEventListener("keydown", M, { capture: !0 }), document.removeEventListener("pointerdown", w, { capture: !0 }), document.removeEventListener("pointermove", w, { capture: !0 });
+    const _ = () => {
+      u.current = !0, document.addEventListener("pointerdown", w, { capture: !0, once: !0 }), document.addEventListener("pointermove", w, { capture: !0, once: !0 });
+    }, w = () => u.current = !1;
+    return document.addEventListener("keydown", _, { capture: !0 }), () => {
+      document.removeEventListener("keydown", _, { capture: !0 }), document.removeEventListener("pointerdown", w, { capture: !0 }), document.removeEventListener("pointermove", w, { capture: !0 });
     };
   }, []), /* @__PURE__ */ s(En, { ...l, children: /* @__PURE__ */ s(
     Hn,
     {
       scope: t,
       open: n,
-      onOpenChange: u,
+      onOpenChange: i,
       content: m,
       onContentChange: v,
       children: /* @__PURE__ */ s(
         jn,
         {
           scope: t,
-          onClose: a.useCallback(() => u(!1), [u]),
-          isUsingKeyboardRef: d,
+          onClose: a.useCallback(() => i(!1), [i]),
+          isUsingKeyboardRef: u,
           dir: f,
-          modal: i,
+          modal: d,
           children: o
         }
       )
     }
   ) });
 };
-Be.displayName = Z;
+Be.displayName = q;
 var zn = "MenuAnchor", we = a.forwardRef(
   (e, t) => {
     const { __scopeMenu: n, ...o } = e, r = re(n);
@@ -220,21 +220,21 @@ var zn = "MenuAnchor", we = a.forwardRef(
   }
 );
 we.displayName = zn;
-var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
+var Zn = "MenuPortal", [vo, Ve] = k(Zn, {
   forceMount: void 0
-}), S = "MenuContent", [qn, Me] = k(S), We = a.forwardRef(
+}), S = "MenuContent", [qn, _e] = k(S), We = a.forwardRef(
   (e, t) => {
-    const n = Ve(S, e.__scopeMenu), { forceMount: o = n.forceMount, ...r } = e, c = $(S, e.__scopeMenu), i = q(S, e.__scopeMenu);
-    return /* @__PURE__ */ s(H.Provider, { scope: e.__scopeMenu, children: /* @__PURE__ */ s(ge, { present: o || c.open, children: /* @__PURE__ */ s(H.Slot, { scope: e.__scopeMenu, children: i.modal ? /* @__PURE__ */ s(Jn, { ...r, ref: t }) : /* @__PURE__ */ s(Qn, { ...r, ref: t }) }) }) });
+    const n = Ve(S, e.__scopeMenu), { forceMount: o = n.forceMount, ...r } = e, c = $(S, e.__scopeMenu), d = J(S, e.__scopeMenu);
+    return /* @__PURE__ */ s(j.Provider, { scope: e.__scopeMenu, children: /* @__PURE__ */ s(ge, { present: o || c.open, children: /* @__PURE__ */ s(j.Slot, { scope: e.__scopeMenu, children: d.modal ? /* @__PURE__ */ s(Jn, { ...r, ref: t }) : /* @__PURE__ */ s(Qn, { ...r, ref: t }) }) }) });
   }
 ), Jn = a.forwardRef(
   (e, t) => {
     const n = $(S, e.__scopeMenu), o = a.useRef(null), r = U(t, o);
     return a.useEffect(() => {
       const c = o.current;
-      if (c) return _n(c);
+      if (c) return Mn(c);
     }, []), /* @__PURE__ */ s(
-      _e,
+      Me,
       {
         ...e,
         ref: r,
@@ -253,7 +253,7 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
 ), Qn = a.forwardRef((e, t) => {
   const n = $(S, e.__scopeMenu);
   return /* @__PURE__ */ s(
-    _e,
+    Me,
     {
       ...e,
       ref: t,
@@ -263,24 +263,24 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
       onDismiss: () => n.onOpenChange(!1)
     }
   );
-}), et = Mn("MenuContent.ScrollLock"), _e = a.forwardRef(
+}), et = _n("MenuContent.ScrollLock"), Me = a.forwardRef(
   (e, t) => {
     const {
       __scopeMenu: n,
       loop: o = !1,
       trapFocus: r,
       onOpenAutoFocus: c,
-      onCloseAutoFocus: i,
+      onCloseAutoFocus: d,
       disableOutsidePointerEvents: l,
       onEntryFocus: m,
       onEscapeKeyDown: v,
-      onPointerDownOutside: d,
-      onFocusOutside: u,
+      onPointerDownOutside: u,
+      onFocusOutside: i,
       onInteractOutside: f,
-      onDismiss: M,
+      onDismiss: _,
       disableOutsideScroll: w,
       ...b
-    } = e, _ = $(S, n), R = q(S, n), T = re(n), h = $e(n), D = Yn(n), [B, J] = a.useState(null), O = a.useRef(null), C = U(t, O, _.onContentChange), G = a.useRef(0), F = a.useRef(""), V = a.useRef(0), W = a.useRef(null), Q = a.useRef("right"), ee = a.useRef(0), se = w ? Cn : a.Fragment, P = w ? { as: et, allowPinchZoom: !0 } : void 0, vn = (p) => {
+    } = e, M = $(S, n), R = J(S, n), T = re(n), h = $e(n), D = Yn(n), [B, Q] = a.useState(null), O = a.useRef(null), C = U(t, O, M.onContentChange), G = a.useRef(0), F = a.useRef(""), V = a.useRef(0), W = a.useRef(null), ee = a.useRef("right"), ne = a.useRef(0), se = w ? Cn : a.Fragment, P = w ? { as: et, allowPinchZoom: !0 } : void 0, vn = (p) => {
       var K, be;
       const E = F.current + p, y = D().filter((x) => !x.disabled), A = document.activeElement, ue = (K = y.find((x) => x.ref.current === A)) == null ? void 0 : K.textValue, ie = y.map((x) => x.textValue), Ie = ft(ie, E, ue), Y = (be = y.find((x) => x.textValue === Ie)) == null ? void 0 : be.ref.current;
       (function x(Ee) {
@@ -290,7 +290,7 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
     a.useEffect(() => () => window.clearTimeout(G.current), []), hn();
     const L = a.useCallback((p) => {
       var y, A;
-      return Q.current === ((y = W.current) == null ? void 0 : y.side) && mt(p, (A = W.current) == null ? void 0 : A.area);
+      return ee.current === ((y = W.current) == null ? void 0 : y.side) && mt(p, (A = W.current) == null ? void 0 : A.area);
     }, []);
     return /* @__PURE__ */ s(
       qn,
@@ -306,7 +306,7 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
         onItemLeave: a.useCallback(
           (p) => {
             var E;
-            L(p) || ((E = O.current) == null || E.focus(), J(null));
+            L(p) || ((E = O.current) == null || E.focus(), Q(null));
           },
           [L]
         ),
@@ -329,17 +329,17 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
               var E;
               p.preventDefault(), (E = O.current) == null || E.focus({ preventScroll: !0 });
             }),
-            onUnmountAutoFocus: i,
+            onUnmountAutoFocus: d,
             children: /* @__PURE__ */ s(
               In,
               {
                 asChild: !0,
                 disableOutsidePointerEvents: l,
                 onEscapeKeyDown: v,
-                onPointerDownOutside: d,
-                onFocusOutside: u,
+                onPointerDownOutside: u,
+                onFocusOutside: i,
                 onInteractOutside: f,
-                onDismiss: M,
+                onDismiss: _,
                 children: /* @__PURE__ */ s(
                   Kn,
                   {
@@ -349,7 +349,7 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
                     orientation: "vertical",
                     loop: o,
                     currentTabStopId: B,
-                    onCurrentTabStopIdChange: J,
+                    onCurrentTabStopIdChange: Q,
                     onEntryFocus: g(m, (p) => {
                       R.isUsingKeyboardRef.current || p.preventDefault();
                     }),
@@ -359,7 +359,7 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
                       {
                         role: "menu",
                         "aria-orientation": "vertical",
-                        "data-state": cn(_.open),
+                        "data-state": cn(M.open),
                         "data-radix-menu-content": "",
                         dir: R.dir,
                         ...T,
@@ -380,11 +380,11 @@ var Zn = "MenuPortal", [mo, Ve] = k(Zn, {
                         }),
                         onPointerMove: g(
                           e.onPointerMove,
-                          j((p) => {
-                            const E = p.target, y = ee.current !== p.clientX;
+                          z((p) => {
+                            const E = p.target, y = ne.current !== p.clientX;
                             if (p.currentTarget.contains(E) && y) {
-                              const A = p.clientX > ee.current ? "right" : "left";
-                              Q.current = A, ee.current = p.clientX;
+                              const A = p.clientX > ne.current ? "right" : "left";
+                              ee.current = A, ne.current = p.clientX;
                             }
                           })
                         )
@@ -417,11 +417,11 @@ var tt = "MenuLabel", Ye = a.forwardRef(
 Ye.displayName = tt;
 var te = "MenuItem", De = "menu.itemSelect", ae = a.forwardRef(
   (e, t) => {
-    const { disabled: n = !1, onSelect: o, ...r } = e, c = a.useRef(null), i = q(te, e.__scopeMenu), l = Me(te, e.__scopeMenu), m = U(t, c), v = a.useRef(!1), d = () => {
-      const u = c.current;
-      if (!n && u) {
+    const { disabled: n = !1, onSelect: o, ...r } = e, c = a.useRef(null), d = J(te, e.__scopeMenu), l = _e(te, e.__scopeMenu), m = U(t, c), v = a.useRef(!1), u = () => {
+      const i = c.current;
+      if (!n && i) {
         const f = new CustomEvent(De, { bubbles: !0, cancelable: !0 });
-        u.addEventListener(De, (M) => o == null ? void 0 : o(M), { once: !0 }), wn(u, f), f.defaultPrevented ? v.current = !1 : i.onClose();
+        i.addEventListener(De, (_) => o == null ? void 0 : o(_), { once: !0 }), wn(i, f), f.defaultPrevented ? v.current = !1 : d.onClose();
       }
     };
     return /* @__PURE__ */ s(
@@ -430,18 +430,18 @@ var te = "MenuItem", De = "menu.itemSelect", ae = a.forwardRef(
         ...r,
         ref: m,
         disabled: n,
-        onClick: g(e.onClick, d),
-        onPointerDown: (u) => {
+        onClick: g(e.onClick, u),
+        onPointerDown: (i) => {
           var f;
-          (f = e.onPointerDown) == null || f.call(e, u), v.current = !0;
+          (f = e.onPointerDown) == null || f.call(e, i), v.current = !0;
         },
-        onPointerUp: g(e.onPointerUp, (u) => {
+        onPointerUp: g(e.onPointerUp, (i) => {
           var f;
-          v.current || (f = u.currentTarget) == null || f.click();
+          v.current || (f = i.currentTarget) == null || f.click();
         }),
-        onKeyDown: g(e.onKeyDown, (u) => {
+        onKeyDown: g(e.onKeyDown, (i) => {
           const f = l.searchRef.current !== "";
-          n || f && u.key === " " || pe.includes(u.key) && (u.currentTarget.click(), u.preventDefault());
+          n || f && i.key === " " || pe.includes(i.key) && (i.currentTarget.click(), i.preventDefault());
         })
       }
     );
@@ -450,12 +450,12 @@ var te = "MenuItem", De = "menu.itemSelect", ae = a.forwardRef(
 ae.displayName = te;
 var Xe = a.forwardRef(
   (e, t) => {
-    const { __scopeMenu: n, disabled: o = !1, textValue: r, ...c } = e, i = Me(te, n), l = $e(n), m = a.useRef(null), v = U(t, m), [d, u] = a.useState(!1), [f, M] = a.useState("");
+    const { __scopeMenu: n, disabled: o = !1, textValue: r, ...c } = e, d = _e(te, n), l = $e(n), m = a.useRef(null), v = U(t, m), [u, i] = a.useState(!1), [f, _] = a.useState("");
     return a.useEffect(() => {
       const w = m.current;
-      w && M((w.textContent ?? "").trim());
+      w && _((w.textContent ?? "").trim());
     }, [c.children]), /* @__PURE__ */ s(
-      H.ItemSlot,
+      j.ItemSlot,
       {
         scope: n,
         disabled: o,
@@ -464,23 +464,23 @@ var Xe = a.forwardRef(
           N.div,
           {
             role: "menuitem",
-            "data-highlighted": d ? "" : void 0,
+            "data-highlighted": u ? "" : void 0,
             "aria-disabled": o || void 0,
             "data-disabled": o ? "" : void 0,
             ...c,
             ref: v,
             onPointerMove: g(
               e.onPointerMove,
-              j((w) => {
-                o ? i.onItemLeave(w) : (i.onItemEnter(w), w.defaultPrevented || w.currentTarget.focus({ preventScroll: !0 }));
+              z((w) => {
+                o ? d.onItemLeave(w) : (d.onItemEnter(w), w.defaultPrevented || w.currentTarget.focus({ preventScroll: !0 }));
               })
             ),
             onPointerLeave: g(
               e.onPointerLeave,
-              j((w) => i.onItemLeave(w))
+              z((w) => d.onItemLeave(w))
             ),
-            onFocus: g(e.onFocus, () => u(!0)),
-            onBlur: g(e.onBlur, () => u(!1))
+            onFocus: g(e.onFocus, () => i(!0)),
+            onBlur: g(e.onBlur, () => i(!1))
           }
         ) })
       }
@@ -532,8 +532,8 @@ var Ze = "MenuRadioItem", qe = a.forwardRef(
         onSelect: g(
           o.onSelect,
           () => {
-            var i;
-            return (i = r.onValueChange) == null ? void 0 : i.call(r, n);
+            var d;
+            return (d = r.onValueChange) == null ? void 0 : d.call(r, n);
           },
           { checkForDefaultPrevented: !1 }
         )
@@ -587,15 +587,15 @@ var ut = "MenuArrow", nn = a.forwardRef(
   }
 );
 nn.displayName = ut;
-var it = "MenuSub", [vo, tn] = k(it), X = "MenuSubTrigger", on = a.forwardRef(
+var it = "MenuSub", [go, tn] = k(it), H = "MenuSubTrigger", on = a.forwardRef(
   (e, t) => {
-    const n = $(X, e.__scopeMenu), o = q(X, e.__scopeMenu), r = tn(X, e.__scopeMenu), c = Me(X, e.__scopeMenu), i = a.useRef(null), { pointerGraceTimerRef: l, onPointerGraceIntentChange: m } = c, v = { __scopeMenu: e.__scopeMenu }, d = a.useCallback(() => {
-      i.current && window.clearTimeout(i.current), i.current = null;
+    const n = $(H, e.__scopeMenu), o = J(H, e.__scopeMenu), r = tn(H, e.__scopeMenu), c = _e(H, e.__scopeMenu), d = a.useRef(null), { pointerGraceTimerRef: l, onPointerGraceIntentChange: m } = c, v = { __scopeMenu: e.__scopeMenu }, u = a.useCallback(() => {
+      d.current && window.clearTimeout(d.current), d.current = null;
     }, []);
-    return a.useEffect(() => d, [d]), a.useEffect(() => {
-      const u = l.current;
+    return a.useEffect(() => u, [u]), a.useEffect(() => {
+      const i = l.current;
       return () => {
-        window.clearTimeout(u), m(null);
+        window.clearTimeout(i), m(null);
       };
     }, [l, m]), /* @__PURE__ */ s(we, { asChild: !0, ...v, children: /* @__PURE__ */ s(
       Xe,
@@ -607,31 +607,31 @@ var it = "MenuSub", [vo, tn] = k(it), X = "MenuSubTrigger", on = a.forwardRef(
         "data-state": cn(n.open),
         ...e,
         ref: Pe(t, r.onTriggerChange),
-        onClick: (u) => {
+        onClick: (i) => {
           var f;
-          (f = e.onClick) == null || f.call(e, u), !(e.disabled || u.defaultPrevented) && (u.currentTarget.focus(), n.open || n.onOpenChange(!0));
+          (f = e.onClick) == null || f.call(e, i), !(e.disabled || i.defaultPrevented) && (i.currentTarget.focus(), n.open || n.onOpenChange(!0));
         },
         onPointerMove: g(
           e.onPointerMove,
-          j((u) => {
-            c.onItemEnter(u), !u.defaultPrevented && !e.disabled && !n.open && !i.current && (c.onPointerGraceIntentChange(null), i.current = window.setTimeout(() => {
-              n.onOpenChange(!0), d();
+          z((i) => {
+            c.onItemEnter(i), !i.defaultPrevented && !e.disabled && !n.open && !d.current && (c.onPointerGraceIntentChange(null), d.current = window.setTimeout(() => {
+              n.onOpenChange(!0), u();
             }, 100));
           })
         ),
         onPointerLeave: g(
           e.onPointerLeave,
-          j((u) => {
-            var M, w;
-            d();
-            const f = (M = n.content) == null ? void 0 : M.getBoundingClientRect();
+          z((i) => {
+            var _, w;
+            u();
+            const f = (_ = n.content) == null ? void 0 : _.getBoundingClientRect();
             if (f) {
-              const b = (w = n.content) == null ? void 0 : w.dataset.side, _ = b === "right", R = _ ? -5 : 5, T = f[_ ? "left" : "right"], h = f[_ ? "right" : "left"];
+              const b = (w = n.content) == null ? void 0 : w.dataset.side, M = b === "right", R = M ? -5 : 5, T = f[M ? "left" : "right"], h = f[M ? "right" : "left"];
               c.onPointerGraceIntentChange({
                 area: [
                   // Apply a bleed on clientX to ensure that our exit point is
                   // consistently within polygon bounds
-                  { x: u.clientX + R, y: u.clientY },
+                  { x: i.clientX + R, y: i.clientY },
                   { x: T, y: f.top },
                   { x: h, y: f.top },
                   { x: h, y: f.bottom },
@@ -643,51 +643,51 @@ var it = "MenuSub", [vo, tn] = k(it), X = "MenuSubTrigger", on = a.forwardRef(
                 300
               );
             } else {
-              if (c.onTriggerLeave(u), u.defaultPrevented) return;
+              if (c.onTriggerLeave(i), i.defaultPrevented) return;
               c.onPointerGraceIntentChange(null);
             }
           })
         ),
-        onKeyDown: g(e.onKeyDown, (u) => {
-          var M;
+        onKeyDown: g(e.onKeyDown, (i) => {
+          var _;
           const f = c.searchRef.current !== "";
-          e.disabled || f && u.key === " " || Vn[o.dir].includes(u.key) && (n.onOpenChange(!0), (M = n.content) == null || M.focus(), u.preventDefault());
+          e.disabled || f && i.key === " " || Vn[o.dir].includes(i.key) && (n.onOpenChange(!0), (_ = n.content) == null || _.focus(), i.preventDefault());
         })
       }
     ) });
   }
 );
-on.displayName = X;
+on.displayName = H;
 var rn = "MenuSubContent", an = a.forwardRef(
   (e, t) => {
-    const n = Ve(S, e.__scopeMenu), { forceMount: o = n.forceMount, ...r } = e, c = $(S, e.__scopeMenu), i = q(S, e.__scopeMenu), l = tn(rn, e.__scopeMenu), m = a.useRef(null), v = U(t, m);
-    return /* @__PURE__ */ s(H.Provider, { scope: e.__scopeMenu, children: /* @__PURE__ */ s(ge, { present: o || c.open, children: /* @__PURE__ */ s(H.Slot, { scope: e.__scopeMenu, children: /* @__PURE__ */ s(
-      _e,
+    const n = Ve(S, e.__scopeMenu), { forceMount: o = n.forceMount, ...r } = e, c = $(S, e.__scopeMenu), d = J(S, e.__scopeMenu), l = tn(rn, e.__scopeMenu), m = a.useRef(null), v = U(t, m);
+    return /* @__PURE__ */ s(j.Provider, { scope: e.__scopeMenu, children: /* @__PURE__ */ s(ge, { present: o || c.open, children: /* @__PURE__ */ s(j.Slot, { scope: e.__scopeMenu, children: /* @__PURE__ */ s(
+      Me,
       {
         id: l.contentId,
         "aria-labelledby": l.triggerId,
         ...r,
         ref: v,
         align: "start",
-        side: i.dir === "rtl" ? "left" : "right",
+        side: d.dir === "rtl" ? "left" : "right",
         disableOutsidePointerEvents: !1,
         disableOutsideScroll: !1,
         trapFocus: !1,
-        onOpenAutoFocus: (d) => {
-          var u;
-          i.isUsingKeyboardRef.current && ((u = m.current) == null || u.focus()), d.preventDefault();
+        onOpenAutoFocus: (u) => {
+          var i;
+          d.isUsingKeyboardRef.current && ((i = m.current) == null || i.focus()), u.preventDefault();
         },
-        onCloseAutoFocus: (d) => d.preventDefault(),
-        onFocusOutside: g(e.onFocusOutside, (d) => {
-          d.target !== l.trigger && c.onOpenChange(!1);
+        onCloseAutoFocus: (u) => u.preventDefault(),
+        onFocusOutside: g(e.onFocusOutside, (u) => {
+          u.target !== l.trigger && c.onOpenChange(!1);
         }),
-        onEscapeKeyDown: g(e.onEscapeKeyDown, (d) => {
-          i.onClose(), d.preventDefault();
+        onEscapeKeyDown: g(e.onEscapeKeyDown, (u) => {
+          d.onClose(), u.preventDefault();
         }),
-        onKeyDown: g(e.onKeyDown, (d) => {
-          var M;
-          const u = d.currentTarget.contains(d.target), f = Wn[i.dir].includes(d.key);
-          u && f && (c.onOpenChange(!1), (M = l.trigger) == null || M.focus(), d.preventDefault());
+        onKeyDown: g(e.onKeyDown, (u) => {
+          var _;
+          const i = u.currentTarget.contains(u.target), f = Wn[d.dir].includes(u.key);
+          i && f && (c.onOpenChange(!1), (_ = l.trigger) == null || _.focus(), u.preventDefault());
         })
       }
     ) }) }) });
@@ -713,9 +713,9 @@ function lt(e, t) {
 }
 function ft(e, t, n) {
   const r = t.length > 1 && Array.from(t).every((v) => v === t[0]) ? t[0] : t, c = n ? e.indexOf(n) : -1;
-  let i = lt(e, Math.max(c, 0));
-  r.length === 1 && (i = i.filter((v) => v !== n));
-  const m = i.find(
+  let d = lt(e, Math.max(c, 0));
+  r.length === 1 && (d = d.filter((v) => v !== n));
+  const m = d.find(
     (v) => v.toLowerCase().startsWith(r.toLowerCase())
   );
   return m !== n ? m : void 0;
@@ -723,9 +723,9 @@ function ft(e, t, n) {
 function pt(e, t) {
   const { x: n, y: o } = e;
   let r = !1;
-  for (let c = 0, i = t.length - 1; c < t.length; i = c++) {
-    const l = t[c], m = t[i], v = l.x, d = l.y, u = m.x, f = m.y;
-    d > o != f > o && n < (u - v) * (o - d) / (f - d) + v && (r = !r);
+  for (let c = 0, d = t.length - 1; c < t.length; d = c++) {
+    const l = t[c], m = t[d], v = l.x, u = l.y, i = m.x, f = m.y;
+    u > o != f > o && n < (i - v) * (o - u) / (f - u) + v && (r = !r);
   }
   return r;
 }
@@ -734,10 +734,10 @@ function mt(e, t) {
   const n = { x: e.clientX, y: e.clientY };
   return pt(n, t);
 }
-function j(e) {
+function z(e) {
   return (t) => t.pointerType === "mouse" ? e(t) : void 0;
 }
-var vt = Be, gt = we, wt = We, Mt = he, _t = Ye, ht = ae, Ct = He, Rt = ze, It = qe, bt = Qe, Et = en, St = nn, Dt = on, yt = an, ce = "DropdownMenu", [Pt, go] = me(
+var vt = Be, gt = we, wt = We, _t = he, Mt = Ye, ht = ae, Ct = He, Rt = ze, It = qe, bt = Qe, Et = en, St = nn, Dt = on, yt = an, ce = "DropdownMenu", [Pt, wo] = me(
   ce,
   [Ue]
 ), I = Ue(), [xt, sn] = Pt(ce), un = (e) => {
@@ -747,12 +747,12 @@ var vt = Be, gt = we, wt = We, Mt = he, _t = Ye, ht = ae, Ct = He, Rt = ze, It =
     dir: o,
     open: r,
     defaultOpen: c,
-    onOpenChange: i,
+    onOpenChange: d,
     modal: l = !0
-  } = e, m = I(t), v = a.useRef(null), [d, u] = ye({
+  } = e, m = I(t), v = a.useRef(null), [u, i] = ye({
     prop: r,
     defaultProp: c ?? !1,
-    onChange: i,
+    onChange: d,
     caller: ce
   });
   return /* @__PURE__ */ s(
@@ -762,19 +762,19 @@ var vt = Be, gt = we, wt = We, Mt = he, _t = Ye, ht = ae, Ct = He, Rt = ze, It =
       triggerId: le(),
       triggerRef: v,
       contentId: le(),
-      open: d,
-      onOpenChange: u,
-      onOpenToggle: a.useCallback(() => u((f) => !f), [u]),
+      open: u,
+      onOpenChange: i,
+      onOpenToggle: a.useCallback(() => i((f) => !f), [i]),
       modal: l,
-      children: /* @__PURE__ */ s(vt, { ...m, open: d, onOpenChange: u, dir: o, modal: l, children: n })
+      children: /* @__PURE__ */ s(vt, { ...m, open: u, onOpenChange: i, dir: o, modal: l, children: n })
     }
   );
 };
 un.displayName = ce;
 var dn = "DropdownMenuTrigger", ln = a.forwardRef(
   (e, t) => {
-    const { __scopeDropdownMenu: n, disabled: o = !1, ...r } = e, c = sn(dn, n), i = I(n);
-    return /* @__PURE__ */ s(gt, { asChild: !0, ...i, children: /* @__PURE__ */ s(
+    const { __scopeDropdownMenu: n, disabled: o = !1, ...r } = e, c = sn(dn, n), d = I(n);
+    return /* @__PURE__ */ s(gt, { asChild: !0, ...d, children: /* @__PURE__ */ s(
       N.button,
       {
         type: "button",
@@ -800,7 +800,7 @@ var dn = "DropdownMenuTrigger", ln = a.forwardRef(
 ln.displayName = dn;
 var fn = "DropdownMenuContent", pn = a.forwardRef(
   (e, t) => {
-    const { __scopeDropdownMenu: n, ...o } = e, r = sn(fn, n), c = I(n), i = a.useRef(!1);
+    const { __scopeDropdownMenu: n, ...o } = e, r = sn(fn, n), c = I(n), d = a.useRef(!1);
     return /* @__PURE__ */ s(
       wt,
       {
@@ -811,11 +811,11 @@ var fn = "DropdownMenuContent", pn = a.forwardRef(
         ref: t,
         onCloseAutoFocus: g(e.onCloseAutoFocus, (l) => {
           var m;
-          i.current || (m = r.triggerRef.current) == null || m.focus(), i.current = !1, l.preventDefault();
+          d.current || (m = r.triggerRef.current) == null || m.focus(), d.current = !1, l.preventDefault();
         }),
         onInteractOutside: g(e.onInteractOutside, (l) => {
-          const m = l.detail.originalEvent, v = m.button === 0 && m.ctrlKey === !0, d = m.button === 2 || v;
-          (!r.modal || d) && (i.current = !0);
+          const m = l.detail.originalEvent, v = m.button === 0 && m.ctrlKey === !0, u = m.button === 2 || v;
+          (!r.modal || u) && (d.current = !0);
         }),
         style: {
           ...e.style,
@@ -833,14 +833,14 @@ pn.displayName = fn;
 var Tt = "DropdownMenuGroup", At = a.forwardRef(
   (e, t) => {
     const { __scopeDropdownMenu: n, ...o } = e, r = I(n);
-    return /* @__PURE__ */ s(Mt, { ...r, ...o, ref: t });
+    return /* @__PURE__ */ s(_t, { ...r, ...o, ref: t });
   }
 );
 At.displayName = Tt;
 var Nt = "DropdownMenuLabel", Ot = a.forwardRef(
   (e, t) => {
     const { __scopeDropdownMenu: n, ...o } = e, r = I(n);
-    return /* @__PURE__ */ s(_t, { ...r, ...o, ref: t });
+    return /* @__PURE__ */ s(Mt, { ...r, ...o, ref: t });
   }
 );
 Ot.displayName = Nt;
@@ -908,26 +908,29 @@ var Zt = "DropdownMenuSubContent", qt = a.forwardRef((e, t) => {
   );
 });
 qt.displayName = Zt;
-var wo = un, Mo = ln, Jt = pn, Qt = mn;
-const eo = "cfxui__DropdownContent__fullWidth__c56c3", no = "cfxui__DropdownContent__item__8feac", to = "cfxui__DropdownContent__content__ea3aa", oo = "cfxui__DropdownContent__disabled__9002a", ne = {
+var _o = un, Mo = ln, Jt = pn, Qt = mn;
+const eo = "cfxui__DropdownContent__fullWidth__c56c3", no = "cfxui__DropdownContent__item__8feac", to = "cfxui__DropdownContent__content__ea3aa", oo = "cfxui__DropdownContent__disabled__9002a", ro = "cfxui__DropdownContent__selected__91015", X = {
   fullWidth: eo,
   item: no,
   content: to,
-  disabled: oo
+  disabled: oo,
+  selected: ro
 };
-function ro(e) {
+function ao(e) {
   const {
     triggerWidth: t,
     options: n,
-    fullWidth: o = !1,
-    className: r,
-    itemClassName: c,
-    onSelect: i
-  } = e, l = Se(
-    r,
-    ne.content,
+    selectedValue: o,
+    selectedClassName: r,
+    fullWidth: c = !1,
+    className: d,
+    itemClassName: l,
+    onSelect: m
+  } = e, v = Se(
+    d,
+    X.content,
     {
-      [ne.fullWidth]: o
+      [X.fullWidth]: c
     }
   );
   return /* @__PURE__ */ s(
@@ -935,30 +938,32 @@ function ro(e) {
     {
       align: "end",
       side: "bottom",
-      className: l,
+      className: v,
       style: {
         width: t,
         zIndex: yn.zindex("max")
       },
-      children: n.map((m) => /* @__PURE__ */ s(
+      children: n.map((u) => /* @__PURE__ */ s(
         Qt,
         {
-          disabled: m.disabled,
-          className: Se(ne.item, c, {
-            [ne.disabled]: m.disabled
+          disabled: u.disabled,
+          className: Se(X.item, l, {
+            [X.disabled]: u.disabled,
+            [X.selected]: u.value === o,
+            [r || ""]: u.value === o && r
           }),
-          onSelect: () => i(m.value),
+          onSelect: () => m(u.value),
           style: { width: t },
-          children: m.label
+          children: u.label
         },
-        m.value
+        u.value
       ))
     }
   );
 }
-const _o = gn.memo(ro);
+const ho = gn.memo(ao);
 export {
-  _o as D,
-  wo as R,
+  ho as D,
+  _o as R,
   Mo as T
 };

package/dist/assets/css/DropdownContent.css

@@ -1 +1 @@
-.cfxui__DropdownContent__fullWidth__c56c3{width:100%}.cfxui__DropdownContent__fullWidth__c56c3 .cfxui__DropdownContent__item__8feac{width:100%;padding-left:calc(var(--quant) * 2.5);padding-right:calc(var(--quant) * 2.5)}.cfxui__DropdownContent__content__ea3aa{--border-color: var(--color-input-border);border-radius:var(--border-radius-medium);box-shadow:0 0 0 var(--input-border-size, initial) var(--border-color) inset;background-color:rgba(var(--color-bg),1);overflow:hidden}.cfxui__DropdownContent__content__ea3aa.cfxui__DropdownContent__onlight__352dc{--border-color: var(--color-input-onlight-border)}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac{height:var(--button-height, initial);display:flex;align-items:center;padding:calc(var(--quant) * 2) var(--spacer-xsmall) calc(var(--quant) * 2) var(--spacer-xsmall);cursor:pointer}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac:not(:last-child){box-shadow:0 calc(-1 * var(--input-border-size, initial)) 0 0 var(--border-color) inset}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac:hover:not(.cfxui__DropdownContent__disabled__9002a){background-color:rgba(var(--color-bg-light),1)}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac.cfxui__DropdownContent__disabled__9002a{cursor:not-allowed;color:rgba(var(--color-secondary),1);background-color:rgba(var(--color-bg-dark),.5)}
+.cfxui__DropdownContent__fullWidth__c56c3{width:100%}.cfxui__DropdownContent__fullWidth__c56c3 .cfxui__DropdownContent__item__8feac{width:100%;padding-left:calc(var(--quant) * 2.5);padding-right:calc(var(--quant) * 2.5)}.cfxui__DropdownContent__content__ea3aa{--border-color: var(--color-input-border);border-radius:var(--border-radius-medium);box-shadow:0 0 0 var(--input-border-size, initial) var(--border-color) inset;background-color:rgba(var(--color-bg),1);overflow:hidden}.cfxui__DropdownContent__content__ea3aa.cfxui__DropdownContent__onlight__352dc{--border-color: var(--color-input-onlight-border)}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac{height:var(--button-height, initial);display:flex;align-items:center;padding:calc(var(--quant) * 2) var(--spacer-xsmall) calc(var(--quant) * 2) var(--spacer-xsmall);cursor:pointer}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac:not(:last-child){box-shadow:0 calc(-1 * var(--input-border-size, initial)) 0 0 var(--border-color) inset}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac:hover:not(.cfxui__DropdownContent__disabled__9002a,.cfxui__DropdownContent__selected__91015){background-color:rgba(var(--color-bg-light),1)}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac.cfxui__DropdownContent__disabled__9002a{cursor:not-allowed;color:rgba(var(--color-secondary),1);background-color:rgba(var(--color-bg-dark),.5)}.cfxui__DropdownContent__content__ea3aa .cfxui__DropdownContent__item__8feac.cfxui__DropdownContent__selected__91015{background-color:rgba(var(--color-secondary),.5);font-weight:var(--font-weight-bold)}

package/dist/components/DropdownContent/DropdownContent.d.ts

@@ -6,11 +6,14 @@ export interface DropdownOption<T extends string> {
     disabled?: boolean;
 }
 export type ExtraClassNameType = 'content' | 'trigger';
-export type DropdownContentOption = DropdownOption<string>;
+export type DropdownOptionValueType = string;
+export type DropdownContentOption = DropdownOption<DropdownOptionValueType>;
 export interface DropdownContentProps {
     options: DropdownContentOption[];
+    selectedValue?: DropdownOptionValueType;
     className?: string;
     itemClassName?: string;
+    selectedClassName?: string;
     triggerWidth?: React.CSSProperties['width'];
     fullWidth?: boolean;
     onSelect: (value: string) => void;

package/dist/components/DropdownContent/DropdownContent.js

@@ -1,5 +1,5 @@
 import "react/jsx-runtime";
-import { D as a } from "../../DropdownContent-BMfQCuaP.js";
+import { D as a } from "../../DropdownContent-BTzahw95.js";
 import "react";
 import "../../utils/clsx.js";
 import "../../utils/ui/ui.js";

package/dist/components/DropdownContent/index.d.ts

@@ -1,2 +1,2 @@
 export { default as DropdownContent } from './DropdownContent';
-export type { DropdownContentProps, DropdownContentOption, } from './DropdownContent';
+export type { DropdownContentProps, DropdownContentOption, DropdownOptionValueType, } from './DropdownContent';

package/dist/components/DropdownContent/index.js

@@ -1,4 +1,4 @@
-import { D as r } from "../../DropdownContent-BMfQCuaP.js";
+import { D as r } from "../../DropdownContent-BTzahw95.js";
 export {
   r as DropdownContent
 };

package/dist/components/DropdownMenu/DropdownMenu.js

@@ -1,5 +1,5 @@
 import { jsxs as d, jsx as o } from "react/jsx-runtime";
-import { R as m, T as c, D as p } from "../../DropdownContent-BMfQCuaP.js";
+import { R as m, T as c, D as p } from "../../DropdownContent-BTzahw95.js";
 import f from "react";
 function u(t) {
   const {

package/dist/components/DropdownSelect/DropdownSelect.js

@@ -1,5 +1,5 @@
 import { jsxs as f, jsx as r } from "react/jsx-runtime";
-import { R as D, T as W, D as C } from "../../DropdownContent-BMfQCuaP.js";
+import { R as D, T as W, D as C } from "../../DropdownContent-BTzahw95.js";
 import a, { useRef as R, useState as v, useEffect as b } from "react";
 import N from "../Flex/Flex.js";
 import { clsx as T } from "../../utils/clsx.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cfx-dev/ui-components",
   "private": false,
-  "version": "5.0.14",
+  "version": "5.0.16",
   "type": "module",
   "license": "MIT",
   "main": "dist/main.js",