@marimo-team/islands 0.19.12-dev1 → 0.20.0

package/dist/{label-CxU5JNBW.js → label-Cc5tEavt.js}

@@ -1,15 +1,15 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
 import { t as require_react } from "./react-Bs6Z0kvn.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-B_OLMU9S.js";
-import { C as useLayoutEffect2, E as Primitive$1, M as composeEventHandlers, N as createLucideIcon, O as createSlot$1, S as useId, T as useCallbackRef, _ as Arrow, b as createPopperScope, c as withSmartCollisionBoundary, f as VISUALLY_HIDDEN_STYLES, g as Anchor, h as Portal, i as useFocusGuards, j as createContextScope, n as hideOthers, p as useControllableState, r as FocusScope, s as withFullScreenAsRoot, t as Combination_default, u as StyleNamespace, v as Content, w as DismissableLayer, y as Root2$1 } from "./Combination-BTMrlhzT.js";
-import { t as Check } from "./check-DkNR52Mm.js";
-import { a as cva, c as useComposedRefs, i as createSlot, l as Events, u as cn } from "./button-Cy0ElmIm.js";
-import { s as Logger } from "./hotkeys-B5WnGZXF.js";
+import { a as Content, i as Arrow, l as createLucideIcon, n as VISUALLY_HIDDEN_STYLES, o as Root2$1, r as Anchor, s as createPopperScope } from "./dist-B8Y11RWn.js";
+import { t as Check } from "./check-C50jsehH.js";
+import { a as cva, g as Logger, h as Events, i as createSlot, m as useComposedRefs, y as cn } from "./button-KYalaJYu.js";
+import { _t as createContextScope, at as useControllableState, ct as useId, dt as useCallbackRef, ft as Primitive$1, i as useFocusGuards, it as StyleNamespace, lt as useLayoutEffect2, mt as createSlot$1, n as hideOthers, nt as withSmartCollisionBoundary, r as FocusScope, st as Portal, t as Combination_default, tt as withFullScreenAsRoot, ut as DismissableLayer, vt as composeEventHandlers } from "./Combination-Du-o_hC9.js";
 import { t as require_jsx_runtime } from "./jsx-runtime-CTBg5pdT.js";
 import { t as require_react_dom } from "./react-dom-CqtLRVZP.js";
-import { t as toString_default } from "./toString-C4TLO6FA.js";
-import { t as _hasUnicode_default } from "./_hasUnicode-Bz2x6u6r.js";
-import { t as invariant } from "./invariant-D9QLJ4SZ.js";
+import { t as toString_default } from "./toString-BwTJvlyD.js";
+import { t as _hasUnicode_default } from "./_hasUnicode-DrSAc5A5.js";
+import { t as invariant } from "./invariant-D-K49MfV.js";
 var ChevronDown = createLucideIcon("chevron-down", [["path", {
   d: "m6 9 6 6 6-6",
   key: "qrunsl"
@@ -336,42 +336,42 @@ function createCollection(e) {
     });
   };
   l.displayName = i;
-  let d = e + "CollectionSlot", f = createSlot$1(d), p = import_react.forwardRef((e2, i2) => {
+  let u = e + "CollectionSlot", d = createSlot$1(u), f = import_react.forwardRef((e2, i2) => {
     let { scope: a2, children: o2 } = e2;
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f, {
-      ref: useComposedRefs(i2, c(d, a2).collectionRef),
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(d, {
+      ref: useComposedRefs(i2, c(u, a2).collectionRef),
       children: o2
     });
   });
-  p.displayName = d;
-  let m = e + "CollectionItemSlot", h = "data-radix-collection-item", g = createSlot$1(m), _ = import_react.forwardRef((e2, i2) => {
-    let { scope: a2, children: o2, ...s2 } = e2, l2 = import_react.useRef(null), u = useComposedRefs(i2, l2), d2 = c(m, a2);
+  f.displayName = u;
+  let p = e + "CollectionItemSlot", m = "data-radix-collection-item", h = createSlot$1(p), g = import_react.forwardRef((e2, i2) => {
+    let { scope: a2, children: o2, ...s2 } = e2, l2 = import_react.useRef(null), u2 = useComposedRefs(i2, l2), d2 = c(p, a2);
     return import_react.useEffect(() => (d2.itemMap.set(l2, {
       ref: l2,
       ...s2
-    }), () => void d2.itemMap.delete(l2))), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(g, {
-      [h]: "",
-      ref: u,
+    }), () => void d2.itemMap.delete(l2))), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(h, {
+      [m]: "",
+      ref: u2,
       children: o2
     });
   });
-  _.displayName = m;
-  function v(i2) {
+  g.displayName = p;
+  function _(i2) {
     let a2 = c(e + "CollectionConsumer", i2);
     return import_react.useCallback(() => {
       let e2 = a2.collectionRef.current;
       if (!e2) return [];
-      let i3 = Array.from(e2.querySelectorAll(`[${h}]`));
+      let i3 = Array.from(e2.querySelectorAll(`[${m}]`));
       return Array.from(a2.itemMap.values()).sort((e3, a3) => i3.indexOf(e3.ref.current) - i3.indexOf(a3.ref.current));
     }, [a2.collectionRef, a2.itemMap]);
   }
   return [
     {
       Provider: l,
-      Slot: p,
-      ItemSlot: _
+      Slot: f,
+      ItemSlot: g
     },
-    v,
+    _,
     o
   ];
 }
@@ -386,14 +386,14 @@ var import_react_dom$1 = /* @__PURE__ */ __toESM(require_react_dom(), 1), OPEN_K
   "ArrowUp",
   "ArrowDown"
 ], SELECTION_KEYS = [" ", "Enter"], SELECT_NAME = "Select", [Collection, useCollection, createCollectionScope] = createCollection(SELECT_NAME), [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME, [createCollectionScope, createPopperScope]), usePopperScope = createPopperScope(), [SelectProvider, useSelectContext] = createSelectContext(SELECT_NAME), [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME), Select$1 = (e) => {
-  let { __scopeSelect: i, children: a, open: o, defaultOpen: s, onOpenChange: c, value: l, defaultValue: u, onValueChange: f, dir: p, name: m, autoComplete: h, disabled: g, required: _, form: v } = e, y = usePopperScope(i), [b, x] = import_react.useState(null), [C, w] = import_react.useState(null), [T, E] = import_react.useState(false), D = useDirection(p), [O, A] = useControllableState({
+  let { __scopeSelect: i, children: a, open: o, defaultOpen: s, onOpenChange: c, value: l, defaultValue: d, onValueChange: f, dir: p, name: m, autoComplete: h, disabled: g, required: _, form: v } = e, y = usePopperScope(i), [b, C] = import_react.useState(null), [w, T] = import_react.useState(null), [E, D] = import_react.useState(false), O = useDirection(p), [k, A] = useControllableState({
     prop: o,
     defaultProp: s ?? false,
     onChange: c,
     caller: SELECT_NAME
   }), [j, M] = useControllableState({
     prop: l,
-    defaultProp: u,
+    defaultProp: d,
     onChange: f,
     caller: SELECT_NAME
   }), N = import_react.useRef(null), P = b ? v || !!b.closest("form") : true, [F, I] = import_react.useState(/* @__PURE__ */ new Set()), L = Array.from(F).map((e2) => e2.props.value).join(";");
@@ -403,17 +403,17 @@ var import_react_dom$1 = /* @__PURE__ */ __toESM(require_react_dom(), 1), OPEN_K
       required: _,
       scope: i,
       trigger: b,
-      onTriggerChange: x,
-      valueNode: C,
-      onValueNodeChange: w,
-      valueNodeHasChildren: T,
-      onValueNodeHasChildrenChange: E,
+      onTriggerChange: C,
+      valueNode: w,
+      onValueNodeChange: T,
+      valueNodeHasChildren: E,
+      onValueNodeHasChildrenChange: D,
       contentId: useId(),
       value: j,
       onValueChange: M,
-      open: O,
+      open: k,
       onOpenChange: A,
-      dir: D,
+      dir: O,
       triggerPointerDownPosRef: N,
       disabled: g,
       children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Provider, {
@@ -448,65 +448,65 @@ var import_react_dom$1 = /* @__PURE__ */ __toESM(require_react_dom(), 1), OPEN_K
 };
 Select$1.displayName = SELECT_NAME;
 var TRIGGER_NAME = "SelectTrigger", SelectTrigger$1 = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, disabled: o = false, ...l } = e, u = usePopperScope(a), d = useSelectContext(TRIGGER_NAME, a), f = d.disabled || o, p = useComposedRefs(i, d.onTriggerChange), m = useCollection(a), h = import_react.useRef("touch"), [g, v, y] = useTypeaheadSearch((e2) => {
-    let i2 = m().filter((e3) => !e3.disabled), a2 = findNextItem(i2, e2, i2.find((e3) => e3.value === d.value));
-    a2 !== void 0 && d.onValueChange(a2.value);
-  }), b = (e2) => {
-    f || (d.onOpenChange(true), y()), e2 && (d.triggerPointerDownPosRef.current = {
+  let { __scopeSelect: a, disabled: o = false, ...s } = e, c = usePopperScope(a), l = useSelectContext(TRIGGER_NAME, a), u = l.disabled || o, f = useComposedRefs(i, l.onTriggerChange), p = useCollection(a), m = import_react.useRef("touch"), [h, g, _] = useTypeaheadSearch((e2) => {
+    let i2 = p().filter((e3) => !e3.disabled), a2 = findNextItem(i2, e2, i2.find((e3) => e3.value === l.value));
+    a2 !== void 0 && l.onValueChange(a2.value);
+  }), y = (e2) => {
+    u || (l.onOpenChange(true), _()), e2 && (l.triggerPointerDownPosRef.current = {
       x: Math.round(e2.pageX),
       y: Math.round(e2.pageY)
     });
   };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Anchor, {
     asChild: true,
-    ...u,
+    ...c,
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.button, {
       type: "button",
       role: "combobox",
-      "aria-controls": d.contentId,
-      "aria-expanded": d.open,
-      "aria-required": d.required,
+      "aria-controls": l.contentId,
+      "aria-expanded": l.open,
+      "aria-required": l.required,
       "aria-autocomplete": "none",
-      dir: d.dir,
-      "data-state": d.open ? "open" : "closed",
-      disabled: f,
-      "data-disabled": f ? "" : void 0,
-      "data-placeholder": shouldShowPlaceholder(d.value) ? "" : void 0,
-      ...l,
-      ref: p,
-      onClick: composeEventHandlers(l.onClick, (e2) => {
-        e2.currentTarget.focus(), h.current !== "mouse" && b(e2);
+      dir: l.dir,
+      "data-state": l.open ? "open" : "closed",
+      disabled: u,
+      "data-disabled": u ? "" : void 0,
+      "data-placeholder": shouldShowPlaceholder(l.value) ? "" : void 0,
+      ...s,
+      ref: f,
+      onClick: composeEventHandlers(s.onClick, (e2) => {
+        e2.currentTarget.focus(), m.current !== "mouse" && y(e2);
       }),
-      onPointerDown: composeEventHandlers(l.onPointerDown, (e2) => {
-        h.current = e2.pointerType;
+      onPointerDown: composeEventHandlers(s.onPointerDown, (e2) => {
+        m.current = e2.pointerType;
         let i2 = e2.target;
-        i2.hasPointerCapture(e2.pointerId) && i2.releasePointerCapture(e2.pointerId), e2.button === 0 && e2.ctrlKey === false && e2.pointerType === "mouse" && (b(e2), e2.preventDefault());
+        i2.hasPointerCapture(e2.pointerId) && i2.releasePointerCapture(e2.pointerId), e2.button === 0 && e2.ctrlKey === false && e2.pointerType === "mouse" && (y(e2), e2.preventDefault());
       }),
-      onKeyDown: composeEventHandlers(l.onKeyDown, (e2) => {
-        let i2 = g.current !== "";
-        !(e2.ctrlKey || e2.altKey || e2.metaKey) && e2.key.length === 1 && v(e2.key), !(i2 && e2.key === " ") && OPEN_KEYS.includes(e2.key) && (b(), e2.preventDefault());
+      onKeyDown: composeEventHandlers(s.onKeyDown, (e2) => {
+        let i2 = h.current !== "";
+        !(e2.ctrlKey || e2.altKey || e2.metaKey) && e2.key.length === 1 && g(e2.key), !(i2 && e2.key === " ") && OPEN_KEYS.includes(e2.key) && (y(), e2.preventDefault());
       })
     })
   });
 });
 SelectTrigger$1.displayName = TRIGGER_NAME;
 var VALUE_NAME = "SelectValue", SelectValue$1 = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, className: c, style: l, children: u, placeholder: d = "", ...f } = e, p = useSelectContext(VALUE_NAME, a), { onValueNodeHasChildrenChange: m } = p, h = u !== void 0, g = useComposedRefs(i, p.onValueNodeChange);
+  let { __scopeSelect: a, className: o, style: s, children: c, placeholder: l = "", ...u } = e, d = useSelectContext(VALUE_NAME, a), { onValueNodeHasChildrenChange: f } = d, p = c !== void 0, m = useComposedRefs(i, d.onValueNodeChange);
   return useLayoutEffect2(() => {
-    m(h);
-  }, [m, h]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.span, {
-    ...f,
-    ref: g,
+    f(p);
+  }, [f, p]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.span, {
+    ...u,
+    ref: m,
     style: { pointerEvents: "none" },
-    children: shouldShowPlaceholder(p.value) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: d }) : u
+    children: shouldShowPlaceholder(d.value) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: l }) : c
   });
 });
 SelectValue$1.displayName = VALUE_NAME;
 var ICON_NAME = "SelectIcon", SelectIcon = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, children: o, ...c } = e;
+  let { __scopeSelect: a, children: o, ...s } = e;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.span, {
     "aria-hidden": true,
-    ...c,
+    ...s,
     ref: i,
     children: o || "\u25BC"
   });
@@ -518,11 +518,11 @@ var PORTAL_NAME = "SelectPortal", SelectPortal$1 = (e) => /* @__PURE__ */ (0, im
 });
 SelectPortal$1.displayName = PORTAL_NAME;
 var CONTENT_NAME = "SelectContent", SelectContent$1 = import_react.forwardRef((e, i) => {
-  let a = useSelectContext(CONTENT_NAME, e.__scopeSelect), [s, c] = import_react.useState();
+  let a = useSelectContext(CONTENT_NAME, e.__scopeSelect), [o, s] = import_react.useState();
   if (useLayoutEffect2(() => {
-    c(new DocumentFragment());
+    s(new DocumentFragment());
   }, []), !a.open) {
-    let i2 = s;
+    let i2 = o;
     return i2 ? import_react_dom$1.createPortal(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentProvider, {
       scope: e.__scopeSelect,
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, {
@@ -538,24 +538,24 @@ var CONTENT_NAME = "SelectContent", SelectContent$1 = import_react.forwardRef((e
 });
 SelectContent$1.displayName = CONTENT_NAME;
 var CONTENT_MARGIN = 10, [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME), CONTENT_IMPL_NAME = "SelectContentImpl", Slot = createSlot$1("SelectContent.RemoveScroll"), SelectContentImpl = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, position: o = "item-aligned", onCloseAutoFocus: s, onEscapeKeyDown: l, onPointerDownOutside: u, side: d, sideOffset: f, align: p, alignOffset: m, arrowPadding: h, collisionBoundary: g, collisionPadding: _, sticky: v, hideWhenDetached: b, avoidCollisions: S, ...w } = e, E = useSelectContext(CONTENT_NAME, a), [D, k] = import_react.useState(null), [A, j] = import_react.useState(null), N = useComposedRefs(i, (e2) => k(e2)), [P, F] = import_react.useState(null), [I, L] = import_react.useState(null), R = useCollection(a), [z, B] = import_react.useState(false), V = import_react.useRef(false);
+  let { __scopeSelect: a, position: o = "item-aligned", onCloseAutoFocus: s, onEscapeKeyDown: c, onPointerDownOutside: l, side: u, sideOffset: d, align: f, alignOffset: p, arrowPadding: m, collisionBoundary: h, collisionPadding: g, sticky: _, hideWhenDetached: y, avoidCollisions: b, ...x } = e, S = useSelectContext(CONTENT_NAME, a), [C, w] = import_react.useState(null), [E, D] = import_react.useState(null), O = useComposedRefs(i, (e2) => w(e2)), [A, M] = import_react.useState(null), [P, L] = import_react.useState(null), R = useCollection(a), [z, B] = import_react.useState(false), V = import_react.useRef(false);
   import_react.useEffect(() => {
-    if (D) return hideOthers(D);
-  }, [D]), useFocusGuards();
+    if (C) return hideOthers(C);
+  }, [C]), useFocusGuards();
   let H = import_react.useCallback((e2) => {
     let [i2, ...a2] = R().map((e3) => e3.ref.current), [o2] = a2.slice(-1), s2 = document.activeElement;
-    for (let a3 of e2) if (a3 === s2 || (a3 == null ? void 0 : a3.scrollIntoView({ block: "nearest" }), a3 === i2 && A && (A.scrollTop = 0), a3 === o2 && A && (A.scrollTop = A.scrollHeight), a3 == null ? void 0 : a3.focus(), document.activeElement !== s2)) return;
-  }, [R, A]), U = import_react.useCallback(() => H([P, D]), [
+    for (let a3 of e2) if (a3 === s2 || (a3 == null ? void 0 : a3.scrollIntoView({ block: "nearest" }), a3 === i2 && E && (E.scrollTop = 0), a3 === o2 && E && (E.scrollTop = E.scrollHeight), a3 == null ? void 0 : a3.focus(), document.activeElement !== s2)) return;
+  }, [R, E]), U = import_react.useCallback(() => H([A, C]), [
     H,
-    P,
-    D
+    A,
+    C
   ]);
   import_react.useEffect(() => {
     z && U();
   }, [z, U]);
-  let { onOpenChange: W, triggerPointerDownPosRef: G } = E;
+  let { onOpenChange: W, triggerPointerDownPosRef: G } = S;
   import_react.useEffect(() => {
-    if (D) {
+    if (C) {
       let e2 = {
         x: 0,
         y: 0
@@ -566,7 +566,7 @@ var CONTENT_MARGIN = 10, [SelectContentProvider, useSelectContentContext] = crea
           y: Math.abs(Math.round(i3.pageY) - (((_b = G.current) == null ? void 0 : _b.y) ?? 0))
         };
       }, a2 = (a3) => {
-        e2.x <= 10 && e2.y <= 10 ? a3.preventDefault() : D.contains(a3.target) || W(false), document.removeEventListener("pointermove", i2), G.current = null;
+        e2.x <= 10 && e2.y <= 10 ? a3.preventDefault() : C.contains(a3.target) || W(false), document.removeEventListener("pointermove", i2), G.current = null;
       };
       return G.current !== null && (document.addEventListener("pointermove", i2), document.addEventListener("pointerup", a2, {
         capture: true,
@@ -576,7 +576,7 @@ var CONTENT_MARGIN = 10, [SelectContentProvider, useSelectContentContext] = crea
       };
     }
   }, [
-    D,
+    C,
     W,
     G
   ]), import_react.useEffect(() => {
@@ -590,33 +590,33 @@ var CONTENT_MARGIN = 10, [SelectContentProvider, useSelectContentContext] = crea
     a2 && setTimeout(() => a2.ref.current.focus());
   }), J = import_react.useCallback((e2, i2, a2) => {
     let o2 = !V.current && !a2;
-    (E.value !== void 0 && E.value === i2 || o2) && (F(e2), o2 && (V.current = true));
-  }, [E.value]), Y = import_react.useCallback(() => D == null ? void 0 : D.focus(), [D]), Z = import_react.useCallback((e2, i2, a2) => {
+    (S.value !== void 0 && S.value === i2 || o2) && (M(e2), o2 && (V.current = true));
+  }, [S.value]), Y = import_react.useCallback(() => C == null ? void 0 : C.focus(), [C]), Z = import_react.useCallback((e2, i2, a2) => {
     let o2 = !V.current && !a2;
-    (E.value !== void 0 && E.value === i2 || o2) && L(e2);
-  }, [E.value]), Q = o === "popper" ? SelectPopperPosition : SelectItemAlignedPosition, $ = Q === SelectPopperPosition ? {
-    side: d,
-    sideOffset: f,
-    align: p,
-    alignOffset: m,
-    arrowPadding: h,
-    collisionBoundary: g,
-    collisionPadding: _,
-    sticky: v,
-    hideWhenDetached: b,
-    avoidCollisions: S
+    (S.value !== void 0 && S.value === i2 || o2) && L(e2);
+  }, [S.value]), Q = o === "popper" ? SelectPopperPosition : SelectItemAlignedPosition, $ = Q === SelectPopperPosition ? {
+    side: u,
+    sideOffset: d,
+    align: f,
+    alignOffset: p,
+    arrowPadding: m,
+    collisionBoundary: h,
+    collisionPadding: g,
+    sticky: _,
+    hideWhenDetached: y,
+    avoidCollisions: b
   } : {};
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentProvider, {
     scope: a,
-    content: D,
-    viewport: A,
-    onViewportChange: j,
+    content: C,
+    viewport: E,
+    onViewportChange: D,
     itemRefCallback: J,
-    selectedItem: P,
+    selectedItem: A,
     onItemLeave: Y,
     itemTextRefCallback: Z,
     focusSelectedItem: U,
-    selectedItemText: I,
+    selectedItemText: P,
     position: o,
     isPositioned: z,
     searchRef: K,
@@ -625,38 +625,38 @@ var CONTENT_MARGIN = 10, [SelectContentProvider, useSelectContentContext] = crea
       allowPinchZoom: true,
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FocusScope, {
         asChild: true,
-        trapped: E.open,
+        trapped: S.open,
         onMountAutoFocus: (e2) => {
           e2.preventDefault();
         },
         onUnmountAutoFocus: composeEventHandlers(s, (e2) => {
           var _a;
-          (_a = E.trigger) == null ? void 0 : _a.focus({ preventScroll: true }), e2.preventDefault();
+          (_a = S.trigger) == null ? void 0 : _a.focus({ preventScroll: true }), e2.preventDefault();
         }),
         children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DismissableLayer, {
           asChild: true,
           disableOutsidePointerEvents: true,
-          onEscapeKeyDown: l,
-          onPointerDownOutside: u,
+          onEscapeKeyDown: c,
+          onPointerDownOutside: l,
           onFocusOutside: (e2) => e2.preventDefault(),
-          onDismiss: () => E.onOpenChange(false),
+          onDismiss: () => S.onOpenChange(false),
           children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Q, {
             role: "listbox",
-            id: E.contentId,
-            "data-state": E.open ? "open" : "closed",
-            dir: E.dir,
+            id: S.contentId,
+            "data-state": S.open ? "open" : "closed",
+            dir: S.dir,
             onContextMenu: (e2) => e2.preventDefault(),
-            ...w,
+            ...x,
             ...$,
             onPlaced: () => B(true),
-            ref: N,
+            ref: O,
             style: {
               display: "flex",
               flexDirection: "column",
               outline: "none",
-              ...w.style
+              ...x.style
             },
-            onKeyDown: composeEventHandlers(w.onKeyDown, (e2) => {
+            onKeyDown: composeEventHandlers(x.onKeyDown, (e2) => {
               let i2 = e2.ctrlKey || e2.altKey || e2.metaKey;
               if (e2.key === "Tab" && e2.preventDefault(), !i2 && e2.key.length === 1 && q(e2.key), [
                 "ArrowUp",
@@ -680,55 +680,55 @@ var CONTENT_MARGIN = 10, [SelectContentProvider, useSelectContentContext] = crea
 });
 SelectContentImpl.displayName = CONTENT_IMPL_NAME;
 var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition", SelectItemAlignedPosition = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, onPlaced: c, ...l } = e, u = useSelectContext(CONTENT_NAME, a), d = useSelectContentContext(CONTENT_NAME, a), [f, p] = import_react.useState(null), [m, h] = import_react.useState(null), g = useComposedRefs(i, (e2) => h(e2)), _ = useCollection(a), v = import_react.useRef(false), y = import_react.useRef(true), { viewport: b, selectedItem: x, selectedItemText: S, focusSelectedItem: C } = d, w = import_react.useCallback(() => {
-    if (u.trigger && u.valueNode && f && m && b && x && S) {
-      let e2 = u.trigger.getBoundingClientRect(), i2 = m.getBoundingClientRect(), a2 = u.valueNode.getBoundingClientRect(), o = S.getBoundingClientRect();
-      if (u.dir !== "rtl") {
-        let s2 = o.left - i2.left, c2 = a2.left - s2, l3 = e2.left - c2, u2 = e2.width + l3, d3 = Math.max(u2, i2.width), p3 = window.innerWidth - CONTENT_MARGIN, m2 = clamp(c2, [CONTENT_MARGIN, Math.max(CONTENT_MARGIN, p3 - d3)]);
-        f.style.minWidth = u2 + "px", f.style.left = m2 + "px";
+  let { __scopeSelect: a, onPlaced: o, ...s } = e, c = useSelectContext(CONTENT_NAME, a), l = useSelectContentContext(CONTENT_NAME, a), [u, d] = import_react.useState(null), [f, p] = import_react.useState(null), m = useComposedRefs(i, (e2) => p(e2)), h = useCollection(a), g = import_react.useRef(false), _ = import_react.useRef(true), { viewport: y, selectedItem: b, selectedItemText: x, focusSelectedItem: S } = l, C = import_react.useCallback(() => {
+    if (c.trigger && c.valueNode && u && f && y && b && x) {
+      let e2 = c.trigger.getBoundingClientRect(), i2 = f.getBoundingClientRect(), a2 = c.valueNode.getBoundingClientRect(), s2 = x.getBoundingClientRect();
+      if (c.dir !== "rtl") {
+        let o2 = s2.left - i2.left, c2 = a2.left - o2, l3 = e2.left - c2, d3 = e2.width + l3, f2 = Math.max(d3, i2.width), p3 = window.innerWidth - CONTENT_MARGIN, m3 = clamp(c2, [CONTENT_MARGIN, Math.max(CONTENT_MARGIN, p3 - f2)]);
+        u.style.minWidth = d3 + "px", u.style.left = m3 + "px";
       } else {
-        let s2 = i2.right - o.right, c2 = window.innerWidth - a2.right - s2, l3 = window.innerWidth - e2.right - c2, u2 = e2.width + l3, d3 = Math.max(u2, i2.width), p3 = window.innerWidth - CONTENT_MARGIN, m2 = clamp(c2, [CONTENT_MARGIN, Math.max(CONTENT_MARGIN, p3 - d3)]);
-        f.style.minWidth = u2 + "px", f.style.right = m2 + "px";
+        let o2 = i2.right - s2.right, c2 = window.innerWidth - a2.right - o2, l3 = window.innerWidth - e2.right - c2, d3 = e2.width + l3, f2 = Math.max(d3, i2.width), p3 = window.innerWidth - CONTENT_MARGIN, m3 = clamp(c2, [CONTENT_MARGIN, Math.max(CONTENT_MARGIN, p3 - f2)]);
+        u.style.minWidth = d3 + "px", u.style.right = m3 + "px";
       }
-      let s = _(), l2 = window.innerHeight - CONTENT_MARGIN * 2, d2 = b.scrollHeight, p2 = window.getComputedStyle(m), h2 = parseInt(p2.borderTopWidth, 10), g2 = parseInt(p2.paddingTop, 10), y2 = parseInt(p2.borderBottomWidth, 10), C2 = parseInt(p2.paddingBottom, 10), w2 = h2 + g2 + d2 + C2 + y2, T2 = Math.min(x.offsetHeight * 5, w2), E2 = window.getComputedStyle(b), D = parseInt(E2.paddingTop, 10), O = parseInt(E2.paddingBottom, 10), k = e2.top + e2.height / 2 - CONTENT_MARGIN, A = l2 - k, j = x.offsetHeight / 2, M = x.offsetTop + j, N = h2 + g2 + M, P = w2 - N;
+      let l2 = h(), d2 = window.innerHeight - CONTENT_MARGIN * 2, p2 = y.scrollHeight, m2 = window.getComputedStyle(f), _2 = parseInt(m2.borderTopWidth, 10), v = parseInt(m2.paddingTop, 10), S2 = parseInt(m2.borderBottomWidth, 10), C2 = parseInt(m2.paddingBottom, 10), w = _2 + v + p2 + C2 + S2, T2 = Math.min(b.offsetHeight * 5, w), E2 = window.getComputedStyle(y), D = parseInt(E2.paddingTop, 10), O = parseInt(E2.paddingBottom, 10), k = e2.top + e2.height / 2 - CONTENT_MARGIN, A = d2 - k, j = b.offsetHeight / 2, M = b.offsetTop + j, N = _2 + v + M, P = w - N;
       if (N <= k) {
-        let e3 = s.length > 0 && x === s[s.length - 1].ref.current;
-        f.style.bottom = "0px";
-        let i3 = m.clientHeight - b.offsetTop - b.offsetHeight, a3 = N + Math.max(A, j + (e3 ? O : 0) + i3 + y2);
-        f.style.height = a3 + "px";
+        let e3 = l2.length > 0 && b === l2[l2.length - 1].ref.current;
+        u.style.bottom = "0px";
+        let i3 = f.clientHeight - y.offsetTop - y.offsetHeight, a3 = N + Math.max(A, j + (e3 ? O : 0) + i3 + S2);
+        u.style.height = a3 + "px";
       } else {
-        let e3 = s.length > 0 && x === s[0].ref.current;
-        f.style.top = "0px";
-        let i3 = Math.max(k, h2 + b.offsetTop + (e3 ? D : 0) + j) + P;
-        f.style.height = i3 + "px", b.scrollTop = N - k + b.offsetTop;
+        let e3 = l2.length > 0 && b === l2[0].ref.current;
+        u.style.top = "0px";
+        let i3 = Math.max(k, _2 + y.offsetTop + (e3 ? D : 0) + j) + P;
+        u.style.height = i3 + "px", y.scrollTop = N - k + y.offsetTop;
       }
-      f.style.margin = `${CONTENT_MARGIN}px 0`, f.style.minHeight = T2 + "px", f.style.maxHeight = l2 + "px", c == null ? void 0 : c(), requestAnimationFrame(() => v.current = true);
+      u.style.margin = `${CONTENT_MARGIN}px 0`, u.style.minHeight = T2 + "px", u.style.maxHeight = d2 + "px", o == null ? void 0 : o(), requestAnimationFrame(() => g.current = true);
     }
   }, [
-    _,
-    u.trigger,
-    u.valueNode,
+    h,
+    c.trigger,
+    c.valueNode,
+    u,
     f,
-    m,
+    y,
     b,
     x,
-    S,
-    u.dir,
-    c
+    c.dir,
+    o
   ]);
-  useLayoutEffect2(() => w(), [w]);
+  useLayoutEffect2(() => C(), [C]);
   let [T, E] = import_react.useState();
   return useLayoutEffect2(() => {
-    m && E(window.getComputedStyle(m).zIndex);
-  }, [m]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectViewportProvider, {
+    f && E(window.getComputedStyle(f).zIndex);
+  }, [f]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectViewportProvider, {
     scope: a,
-    contentWrapper: f,
-    shouldExpandOnScrollRef: v,
+    contentWrapper: u,
+    shouldExpandOnScrollRef: g,
     onScrollButtonChange: import_react.useCallback((e2) => {
-      e2 && y.current === true && (w(), C == null ? void 0 : C(), y.current = false);
-    }, [w, C]),
+      e2 && _.current === true && (C(), S == null ? void 0 : S(), _.current = false);
+    }, [C, S]),
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
-      ref: p,
+      ref: d,
       style: {
         display: "flex",
         flexDirection: "column",
@@ -736,12 +736,12 @@ var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition", SelectItemAlignedP
         zIndex: T
       },
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
-        ...l,
-        ref: g,
+        ...s,
+        ref: m,
         style: {
           boxSizing: "border-box",
           maxHeight: "100%",
-          ...l.style
+          ...s.style
         }
       })
     })
@@ -749,16 +749,16 @@ var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition", SelectItemAlignedP
 });
 SelectItemAlignedPosition.displayName = ITEM_ALIGNED_POSITION_NAME;
 var POPPER_POSITION_NAME = "SelectPopperPosition", SelectPopperPosition = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, align: o = "start", collisionPadding: s = CONTENT_MARGIN, ...c } = e, l = usePopperScope(a);
+  let { __scopeSelect: a, align: s = "start", collisionPadding: c = CONTENT_MARGIN, ...l } = e, u = usePopperScope(a);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Content, {
+    ...u,
     ...l,
-    ...c,
     ref: i,
-    align: o,
-    collisionPadding: s,
+    align: s,
+    collisionPadding: c,
     style: {
       boxSizing: "border-box",
-      ...c.style,
+      ...l.style,
       "--radix-select-content-transform-origin": "var(--radix-popper-transform-origin)",
       "--radix-select-content-available-width": "var(--radix-popper-available-width)",
       "--radix-select-content-available-height": "var(--radix-popper-available-height)",
@@ -769,7 +769,7 @@ var POPPER_POSITION_NAME = "SelectPopperPosition", SelectPopperPosition = import
 });
 SelectPopperPosition.displayName = POPPER_POSITION_NAME;
 var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME, {}), VIEWPORT_NAME = "SelectViewport", SelectViewport = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, nonce: o, ...l } = e, u = useSelectContentContext(VIEWPORT_NAME, a), d = useSelectViewportContext(VIEWPORT_NAME, a), f = useComposedRefs(i, u.onViewportChange), p = import_react.useRef(0);
+  let { __scopeSelect: a, nonce: o, ...s } = e, c = useSelectContentContext(VIEWPORT_NAME, a), l = useSelectViewportContext(VIEWPORT_NAME, a), u = useComposedRefs(i, c.onViewportChange), d = import_react.useRef(0);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", {
     dangerouslySetInnerHTML: { __html: "[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}" },
     nonce: o
@@ -778,40 +778,40 @@ var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CON
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
       "data-radix-select-viewport": "",
       role: "presentation",
-      ...l,
-      ref: f,
+      ...s,
+      ref: u,
       style: {
         position: "relative",
         flex: 1,
         overflow: "hidden auto",
-        ...l.style
+        ...s.style
       },
-      onScroll: composeEventHandlers(l.onScroll, (e2) => {
-        let i2 = e2.currentTarget, { contentWrapper: a2, shouldExpandOnScrollRef: o2 } = d;
+      onScroll: composeEventHandlers(s.onScroll, (e2) => {
+        let i2 = e2.currentTarget, { contentWrapper: a2, shouldExpandOnScrollRef: o2 } = l;
         if ((o2 == null ? void 0 : o2.current) && a2) {
-          let e3 = Math.abs(p.current - i2.scrollTop);
+          let e3 = Math.abs(d.current - i2.scrollTop);
           if (e3 > 0) {
-            let o3 = window.innerHeight - CONTENT_MARGIN * 2, s = parseFloat(a2.style.minHeight), c = parseFloat(a2.style.height), l2 = Math.max(s, c);
+            let o3 = window.innerHeight - CONTENT_MARGIN * 2, s2 = parseFloat(a2.style.minHeight), c2 = parseFloat(a2.style.height), l2 = Math.max(s2, c2);
             if (l2 < o3) {
-              let s2 = l2 + e3, c2 = Math.min(o3, s2), u2 = s2 - c2;
-              a2.style.height = c2 + "px", a2.style.bottom === "0px" && (i2.scrollTop = u2 > 0 ? u2 : 0, a2.style.justifyContent = "flex-end");
+              let s3 = l2 + e3, c3 = Math.min(o3, s3), u2 = s3 - c3;
+              a2.style.height = c3 + "px", a2.style.bottom === "0px" && (i2.scrollTop = u2 > 0 ? u2 : 0, a2.style.justifyContent = "flex-end");
             }
           }
         }
-        p.current = i2.scrollTop;
+        d.current = i2.scrollTop;
       })
     })
   })] });
 });
 SelectViewport.displayName = VIEWPORT_NAME;
 var GROUP_NAME = "SelectGroup", [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME), SelectGroup$1 = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, ...o } = e, c = useId();
+  let { __scopeSelect: a, ...o } = e, s = useId();
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectGroupContextProvider, {
     scope: a,
-    id: c,
+    id: s,
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
       role: "group",
-      "aria-labelledby": c,
+      "aria-labelledby": s,
       ...o,
       ref: i
     })
@@ -819,69 +819,69 @@ var GROUP_NAME = "SelectGroup", [SelectGroupContextProvider, useSelectGroupConte
 });
 SelectGroup$1.displayName = GROUP_NAME;
 var LABEL_NAME = "SelectLabel", SelectLabel$1 = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, ...o } = e, c = useSelectGroupContext(LABEL_NAME, a);
+  let { __scopeSelect: a, ...o } = e, s = useSelectGroupContext(LABEL_NAME, a);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
-    id: c.id,
+    id: s.id,
     ...o,
     ref: i
   });
 });
 SelectLabel$1.displayName = LABEL_NAME;
 var ITEM_NAME = "SelectItem", [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME), SelectItem$1 = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, value: o, disabled: l = false, textValue: u, ...f } = e, p = useSelectContext(ITEM_NAME, a), m = useSelectContentContext(ITEM_NAME, a), h = p.value === o, [g, _] = import_react.useState(u ?? ""), [v, y] = import_react.useState(false), b = useComposedRefs(i, (e2) => {
+  let { __scopeSelect: a, value: o, disabled: s = false, textValue: c, ...l } = e, u = useSelectContext(ITEM_NAME, a), d = useSelectContentContext(ITEM_NAME, a), f = u.value === o, [p, m] = import_react.useState(c ?? ""), [h, g] = import_react.useState(false), _ = useComposedRefs(i, (e2) => {
     var _a;
-    return (_a = m.itemRefCallback) == null ? void 0 : _a.call(m, e2, o, l);
-  }), x = useId(), S = import_react.useRef("touch"), C = () => {
-    l || (p.onValueChange(o), p.onOpenChange(false));
+    return (_a = d.itemRefCallback) == null ? void 0 : _a.call(d, e2, o, s);
+  }), y = useId(), b = import_react.useRef("touch"), x = () => {
+    s || (u.onValueChange(o), u.onOpenChange(false));
   };
   if (o === "") throw Error("A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder.");
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectItemContextProvider, {
     scope: a,
     value: o,
-    disabled: l,
-    textId: x,
-    isSelected: h,
+    disabled: s,
+    textId: y,
+    isSelected: f,
     onItemTextChange: import_react.useCallback((e2) => {
-      _((i2) => i2 || ((e2 == null ? void 0 : e2.textContent) ?? "").trim());
+      m((i2) => i2 || ((e2 == null ? void 0 : e2.textContent) ?? "").trim());
     }, []),
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.ItemSlot, {
       scope: a,
       value: o,
-      disabled: l,
-      textValue: g,
+      disabled: s,
+      textValue: p,
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
         role: "option",
-        "aria-labelledby": x,
-        "data-highlighted": v ? "" : void 0,
-        "aria-selected": h && v,
-        "data-state": h ? "checked" : "unchecked",
-        "aria-disabled": l || void 0,
-        "data-disabled": l ? "" : void 0,
-        tabIndex: l ? void 0 : -1,
-        ...f,
-        ref: b,
-        onFocus: composeEventHandlers(f.onFocus, () => y(true)),
-        onBlur: composeEventHandlers(f.onBlur, () => y(false)),
-        onClick: composeEventHandlers(f.onClick, () => {
-          S.current !== "mouse" && C();
+        "aria-labelledby": y,
+        "data-highlighted": h ? "" : void 0,
+        "aria-selected": f && h,
+        "data-state": f ? "checked" : "unchecked",
+        "aria-disabled": s || void 0,
+        "data-disabled": s ? "" : void 0,
+        tabIndex: s ? void 0 : -1,
+        ...l,
+        ref: _,
+        onFocus: composeEventHandlers(l.onFocus, () => g(true)),
+        onBlur: composeEventHandlers(l.onBlur, () => g(false)),
+        onClick: composeEventHandlers(l.onClick, () => {
+          b.current !== "mouse" && x();
         }),
-        onPointerUp: composeEventHandlers(f.onPointerUp, () => {
-          S.current === "mouse" && C();
+        onPointerUp: composeEventHandlers(l.onPointerUp, () => {
+          b.current === "mouse" && x();
         }),
-        onPointerDown: composeEventHandlers(f.onPointerDown, (e2) => {
-          S.current = e2.pointerType;
+        onPointerDown: composeEventHandlers(l.onPointerDown, (e2) => {
+          b.current = e2.pointerType;
         }),
-        onPointerMove: composeEventHandlers(f.onPointerMove, (e2) => {
+        onPointerMove: composeEventHandlers(l.onPointerMove, (e2) => {
           var _a;
-          S.current = e2.pointerType, l ? (_a = m.onItemLeave) == null ? void 0 : _a.call(m) : S.current === "mouse" && e2.currentTarget.focus({ preventScroll: true });
+          b.current = e2.pointerType, s ? (_a = d.onItemLeave) == null ? void 0 : _a.call(d) : b.current === "mouse" && e2.currentTarget.focus({ preventScroll: true });
         }),
-        onPointerLeave: composeEventHandlers(f.onPointerLeave, (e2) => {
+        onPointerLeave: composeEventHandlers(l.onPointerLeave, (e2) => {
           var _a;
-          e2.currentTarget === document.activeElement && ((_a = m.onItemLeave) == null ? void 0 : _a.call(m));
+          e2.currentTarget === document.activeElement && ((_a = d.onItemLeave) == null ? void 0 : _a.call(d));
         }),
-        onKeyDown: composeEventHandlers(f.onKeyDown, (e2) => {
+        onKeyDown: composeEventHandlers(l.onKeyDown, (e2) => {
           var _a;
-          ((_a = m.searchRef) == null ? void 0 : _a.current) !== "" && e2.key === " " || (SELECTION_KEYS.includes(e2.key) && C(), e2.key === " " && e2.preventDefault());
+          ((_a = d.searchRef) == null ? void 0 : _a.current) !== "" && e2.key === " " || (SELECTION_KEYS.includes(e2.key) && x(), e2.key === " " && e2.preventDefault());
         })
       })
     })
@@ -889,27 +889,27 @@ var ITEM_NAME = "SelectItem", [SelectItemContextProvider, useSelectItemContext]
 });
 SelectItem$1.displayName = ITEM_NAME;
 var ITEM_TEXT_NAME = "SelectItemText", SelectItemText = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, className: c, style: l, ...u } = e, d = useSelectContext(ITEM_TEXT_NAME, a), f = useSelectContentContext(ITEM_TEXT_NAME, a), p = useSelectItemContext(ITEM_TEXT_NAME, a), m = useSelectNativeOptionsContext(ITEM_TEXT_NAME, a), [h, g] = import_react.useState(null), _ = useComposedRefs(i, (e2) => g(e2), p.onItemTextChange, (e2) => {
+  let { __scopeSelect: a, className: o, style: s, ...c } = e, l = useSelectContext(ITEM_TEXT_NAME, a), u = useSelectContentContext(ITEM_TEXT_NAME, a), d = useSelectItemContext(ITEM_TEXT_NAME, a), f = useSelectNativeOptionsContext(ITEM_TEXT_NAME, a), [p, m] = import_react.useState(null), h = useComposedRefs(i, (e2) => m(e2), d.onItemTextChange, (e2) => {
     var _a;
-    return (_a = f.itemTextRefCallback) == null ? void 0 : _a.call(f, e2, p.value, p.disabled);
-  }), v = h == null ? void 0 : h.textContent, y = import_react.useMemo(() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", {
-    value: p.value,
-    disabled: p.disabled,
-    children: v
-  }, p.value), [
-    p.disabled,
-    p.value,
-    v
-  ]), { onNativeOptionAdd: b, onNativeOptionRemove: x } = m;
-  return useLayoutEffect2(() => (b(y), () => x(y)), [
+    return (_a = u.itemTextRefCallback) == null ? void 0 : _a.call(u, e2, d.value, d.disabled);
+  }), g = p == null ? void 0 : p.textContent, _ = import_react.useMemo(() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", {
+    value: d.value,
+    disabled: d.disabled,
+    children: g
+  }, d.value), [
+    d.disabled,
+    d.value,
+    g
+  ]), { onNativeOptionAdd: y, onNativeOptionRemove: b } = f;
+  return useLayoutEffect2(() => (y(_), () => b(_)), [
+    y,
     b,
-    x,
-    y
+    _
   ]), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.span, {
-    id: p.textId,
-    ...u,
-    ref: _
-  }), p.isSelected && d.valueNode && !d.valueNodeHasChildren ? import_react_dom$1.createPortal(u.children, d.valueNode) : null] });
+    id: d.textId,
+    ...c,
+    ref: h
+  }), d.isSelected && l.valueNode && !l.valueNodeHasChildren ? import_react_dom$1.createPortal(c.children, l.valueNode) : null] });
 });
 SelectItemText.displayName = ITEM_TEXT_NAME;
 var ITEM_INDICATOR_NAME = "SelectItemIndicator", SelectItemIndicator = import_react.forwardRef((e, i) => {
@@ -922,17 +922,17 @@ var ITEM_INDICATOR_NAME = "SelectItemIndicator", SelectItemIndicator = import_re
 });
 SelectItemIndicator.displayName = ITEM_INDICATOR_NAME;
 var SCROLL_UP_BUTTON_NAME = "SelectScrollUpButton", SelectScrollUpButton = import_react.forwardRef((e, i) => {
-  let a = useSelectContentContext(SCROLL_UP_BUTTON_NAME, e.__scopeSelect), s = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, e.__scopeSelect), [c, l] = import_react.useState(false), u = useComposedRefs(i, s.onScrollButtonChange);
+  let a = useSelectContentContext(SCROLL_UP_BUTTON_NAME, e.__scopeSelect), o = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, e.__scopeSelect), [s, c] = import_react.useState(false), l = useComposedRefs(i, o.onScrollButtonChange);
   return useLayoutEffect2(() => {
     if (a.viewport && a.isPositioned) {
       let e2 = function() {
-        l(i2.scrollTop > 0);
+        c(i2.scrollTop > 0);
       }, i2 = a.viewport;
       return e2(), i2.addEventListener("scroll", e2), () => i2.removeEventListener("scroll", e2);
     }
-  }, [a.viewport, a.isPositioned]), c ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectScrollButtonImpl, {
+  }, [a.viewport, a.isPositioned]), s ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectScrollButtonImpl, {
     ...e,
-    ref: u,
+    ref: l,
     onAutoScroll: () => {
       let { viewport: e2, selectedItem: i2 } = a;
       e2 && i2 && (e2.scrollTop -= i2.offsetHeight);
@@ -941,18 +941,18 @@ var SCROLL_UP_BUTTON_NAME = "SelectScrollUpButton", SelectScrollUpButton = impor
 });
 SelectScrollUpButton.displayName = SCROLL_UP_BUTTON_NAME;
 var SCROLL_DOWN_BUTTON_NAME = "SelectScrollDownButton", SelectScrollDownButton = import_react.forwardRef((e, i) => {
-  let a = useSelectContentContext(SCROLL_DOWN_BUTTON_NAME, e.__scopeSelect), s = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, e.__scopeSelect), [c, l] = import_react.useState(false), u = useComposedRefs(i, s.onScrollButtonChange);
+  let a = useSelectContentContext(SCROLL_DOWN_BUTTON_NAME, e.__scopeSelect), o = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, e.__scopeSelect), [s, c] = import_react.useState(false), l = useComposedRefs(i, o.onScrollButtonChange);
   return useLayoutEffect2(() => {
     if (a.viewport && a.isPositioned) {
       let e2 = function() {
         let e3 = i2.scrollHeight - i2.clientHeight;
-        l(Math.ceil(i2.scrollTop) < e3);
+        c(Math.ceil(i2.scrollTop) < e3);
       }, i2 = a.viewport;
       return e2(), i2.addEventListener("scroll", e2), () => i2.removeEventListener("scroll", e2);
     }
-  }, [a.viewport, a.isPositioned]), c ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectScrollButtonImpl, {
+  }, [a.viewport, a.isPositioned]), s ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectScrollButtonImpl, {
     ...e,
-    ref: u,
+    ref: l,
     onAutoScroll: () => {
       let { viewport: e2, selectedItem: i2 } = a;
       e2 && i2 && (e2.scrollTop += i2.offsetHeight);
@@ -961,29 +961,29 @@ var SCROLL_DOWN_BUTTON_NAME = "SelectScrollDownButton", SelectScrollDownButton =
 });
 SelectScrollDownButton.displayName = SCROLL_DOWN_BUTTON_NAME;
 var SelectScrollButtonImpl = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, onAutoScroll: l, ...u } = e, d = useSelectContentContext("SelectScrollButton", a), f = import_react.useRef(null), p = useCollection(a), m = import_react.useCallback(() => {
-    f.current !== null && (window.clearInterval(f.current), f.current = null);
+  let { __scopeSelect: a, onAutoScroll: o, ...s } = e, c = useSelectContentContext("SelectScrollButton", a), l = import_react.useRef(null), u = useCollection(a), d = import_react.useCallback(() => {
+    l.current !== null && (window.clearInterval(l.current), l.current = null);
   }, []);
-  return import_react.useEffect(() => () => m(), [m]), useLayoutEffect2(() => {
+  return import_react.useEffect(() => () => d(), [d]), useLayoutEffect2(() => {
     var _a, _b;
-    (_b = (_a = p().find((e2) => e2.ref.current === document.activeElement)) == null ? void 0 : _a.ref.current) == null ? void 0 : _b.scrollIntoView({ block: "nearest" });
-  }, [p]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
+    (_b = (_a = u().find((e2) => e2.ref.current === document.activeElement)) == null ? void 0 : _a.ref.current) == null ? void 0 : _b.scrollIntoView({ block: "nearest" });
+  }, [u]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Primitive$1.div, {
     "aria-hidden": true,
-    ...u,
+    ...s,
     ref: i,
     style: {
       flexShrink: 0,
-      ...u.style
+      ...s.style
     },
-    onPointerDown: composeEventHandlers(u.onPointerDown, () => {
-      f.current === null && (f.current = window.setInterval(l, 50));
+    onPointerDown: composeEventHandlers(s.onPointerDown, () => {
+      l.current === null && (l.current = window.setInterval(o, 50));
     }),
-    onPointerMove: composeEventHandlers(u.onPointerMove, () => {
+    onPointerMove: composeEventHandlers(s.onPointerMove, () => {
       var _a;
-      (_a = d.onItemLeave) == null ? void 0 : _a.call(d), f.current === null && (f.current = window.setInterval(l, 50));
+      (_a = c.onItemLeave) == null ? void 0 : _a.call(c), l.current === null && (l.current = window.setInterval(o, 50));
     }),
-    onPointerLeave: composeEventHandlers(u.onPointerLeave, () => {
-      m();
+    onPointerLeave: composeEventHandlers(s.onPointerLeave, () => {
+      d();
     })
   });
 }), SEPARATOR_NAME = "SelectSeparator", SelectSeparator$1 = import_react.forwardRef((e, i) => {
@@ -996,18 +996,18 @@ var SelectScrollButtonImpl = import_react.forwardRef((e, i) => {
 });
 SelectSeparator$1.displayName = SEPARATOR_NAME;
 var ARROW_NAME = "SelectArrow", SelectArrow = import_react.forwardRef((e, i) => {
-  let { __scopeSelect: a, ...o } = e, s = usePopperScope(a), c = useSelectContext(ARROW_NAME, a), l = useSelectContentContext(ARROW_NAME, a);
-  return c.open && l.position === "popper" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Arrow, {
-    ...s,
+  let { __scopeSelect: a, ...o } = e, c = usePopperScope(a), l = useSelectContext(ARROW_NAME, a), u = useSelectContentContext(ARROW_NAME, a);
+  return l.open && u.position === "popper" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Arrow, {
+    ...c,
     ...o,
     ref: i
   }) : null;
 });
 SelectArrow.displayName = ARROW_NAME;
 var BUBBLE_INPUT_NAME = "SelectBubbleInput", SelectBubbleInput = import_react.forwardRef(({ __scopeSelect: e, value: i, ...a }, o) => {
-  let c = import_react.useRef(null), l = useComposedRefs(o, c), u = usePrevious(i);
+  let s = import_react.useRef(null), c = useComposedRefs(o, s), u = usePrevious(i);
   return import_react.useEffect(() => {
-    let e2 = c.current;
+    let e2 = s.current;
     if (!e2) return;
     let a2 = window.HTMLSelectElement.prototype, o2 = Object.getOwnPropertyDescriptor(a2, "value").set;
     if (u !== i && o2) {
@@ -1020,7 +1020,7 @@ var BUBBLE_INPUT_NAME = "SelectBubbleInput", SelectBubbleInput = import_react.fo
       ...VISUALLY_HIDDEN_STYLES,
       ...a.style
     },
-    ref: l,
+    ref: c,
     defaultValue: i
   });
 });
@@ -1187,23 +1187,23 @@ var SelectItem = import_react.forwardRef((e, i) => {
     className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center",
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Check, { className: "h-3 w-3" }) })
   }), a[7] = d) : d = a[7];
-  let f = typeof o == "string" ? void 0 : true, p;
-  a[8] !== o || a[9] !== f ? (p = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ItemText, {
+  let f = typeof o == "string" ? void 0 : true, m;
+  a[8] !== o || a[9] !== f ? (m = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ItemText, {
     asChild: f,
     className: "flex w-full flex-1",
     children: o
-  }), a[8] = o, a[9] = f, a[10] = p) : p = a[10];
-  let m;
-  return a[11] !== c || a[12] !== i || a[13] !== l || a[14] !== u || a[15] !== p ? (m = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Item, {
+  }), a[8] = o, a[9] = f, a[10] = m) : m = a[10];
+  let h;
+  return a[11] !== c || a[12] !== i || a[13] !== l || a[14] !== u || a[15] !== m ? (h = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Item, {
     ref: i,
     className: u,
     ...c,
     children: [
       d,
-      p,
+      m,
       l
     ]
-  }), a[11] = c, a[12] = i, a[13] = l, a[14] = u, a[15] = p, a[16] = m) : m = a[16], m;
+  }), a[11] = c, a[12] = i, a[13] = l, a[14] = u, a[15] = m, a[16] = h) : h = a[16], h;
 });
 SelectItem.displayName = Item.displayName;
 var SelectSeparator = import_react.forwardRef((e, i) => {