@koide-labs/ui 0.0.14 → 0.1.0

package/dist/components/select/select.js

@@ -0,0 +1,1263 @@
+import { jsx as C, jsxs as Ae } from "react/jsx-runtime";
+import { c as jt } from "../../clsx-OuTLNxxd.js";
+import * as n from "react";
+import { textify as $t } from "../../-utils.js";
+import { c as E, S as Yt, l as p, d as Xt, e as Kt, i as Gt, f as Jt, p as yt, t as Zt } from "../../transitions.module-D9mMAtfI.js";
+import { View as Qt } from "../view/view.js";
+import { Icon as Rt } from "../icon/icon.js";
+import { v as en } from "../../visuallyHidden-CpJ-mhai.js";
+import { b as gt, a as tn, m as St, d as It, u as Re } from "../../useRenderElement-DngNDu_P.js";
+import { u as ht } from "../../useControlled-Du4sJyMj.js";
+import { u as fe } from "../../useIsoLayoutEffect-CIDbvm3Q.js";
+import { u as xe } from "../../useStableCallback-DKZHlUAT.js";
+import { u as ct } from "../../useValueAsRef-B4EriRsI.js";
+import { f as Ke } from "../../formatErrorMessage-BqPuTBN-.js";
+import { c as nn, a as vt, u as Et, b as on, f as rn } from "../../LabelableContext-Be1u-eFg.js";
+import { u as sn } from "../../useLabelableId-CX4tcfzK.js";
+import { u as wt } from "../../useTransitionStatus-CmMyUh74.js";
+import { c as ye, n as Mt, f as ln, v as cn, w as an, x as tt } from "../../createBaseUIEventDetails-CCSfZ2vM.js";
+import { u as at, t as At } from "../../useOpenChangeComplete-BHd-N7Ig.js";
+import { u as un } from "../../useValueChanged-MJRmEWz1.js";
+import { u as dn, b as fn, a as pn, I as mn, F as gn } from "../../InternalBackdrop-BSMKU-hc.js";
+import { u as hn, a as bn, g as xn } from "../../getDisabledMountTransitionStyles-E2x-_lte.js";
+import { u as yn, a as Rn } from "../../useTypeahead-BiL5IAVb.js";
+import { o as rt } from "../../owner-rKN292Q9.js";
+import { u as _e } from "../../useTimeout-BNni6aw5.js";
+import { u as Tt } from "../../useButton-d3_JgBNr.js";
+import { g as Sn, f as bt } from "../../element-u5WgOZX1.js";
+import { h as In, m as vn } from "../../FloatingPortal-BQsQhvIr.js";
+import { i as En } from "../../inertValue-BTpPjX30.js";
+import { C as wn, u as Mn, I as An } from "../../useCompositeListItem-CZp9WTnF.js";
+import * as Tn from "react-dom";
+import { d as Vn } from "../../detectBrowser-Bl8Ki_1I.js";
+import { u as Cn } from "../../useAnimationFrame-DvK1s63A.js";
+import { u as Nn } from "../../ToolbarRootContext-CvvL0Tk1.js";
+import { C as _n } from "../../composite-BwEK5cWH.js";
+import { g as xt } from "../../floating-ui.utils.dom-cbi420Pg.js";
+import '../../select.css';function Pn(e) {
+  const t = n.useRef(!0);
+  t.current && (t.current = !1, e());
+}
+const On = (e, t) => Object.is(e, t);
+function Oe(e, t, o) {
+  return e == null || t == null ? Object.is(e, t) : o(e, t);
+}
+function nt(e, t, o) {
+  return !e || e.length === 0 ? !1 : e.some((s) => s === void 0 ? !1 : Oe(s, t, o));
+}
+function st(e, t, o) {
+  return !e || e.length === 0 ? -1 : e.findIndex((s) => s === void 0 ? !1 : Oe(s, t, o));
+}
+function Dn(e, t, o) {
+  return e.filter((s) => !Oe(s, t, o));
+}
+function it(e) {
+  if (e == null)
+    return "";
+  if (typeof e == "string")
+    return e;
+  try {
+    return JSON.stringify(e);
+  } catch {
+    return String(e);
+  }
+}
+function Hn(e) {
+  return e != null && e.length > 0 && typeof e[0] == "object" && e[0] != null && "items" in e[0];
+}
+function ke(e, t) {
+  if (t && e != null)
+    return t(e) ?? "";
+  if (e && typeof e == "object") {
+    if ("label" in e && e.label != null)
+      return String(e.label);
+    if ("value" in e)
+      return String(e.value);
+  }
+  return it(e);
+}
+function Ne(e, t) {
+  return t && e != null ? t(e) ?? "" : e && typeof e == "object" && "value" in e && "label" in e ? it(e.value) : it(e);
+}
+function Fn(e, t, o) {
+  if (o && e != null)
+    return o(e);
+  if (e && typeof e == "object" && "label" in e && e.label != null)
+    return e.label;
+  if (t && !Array.isArray(t))
+    return t[e] ?? ke(e, o);
+  if (Array.isArray(t)) {
+    const s = Hn(t) ? t.flatMap((r) => r.items) : t;
+    if (e == null) {
+      const r = s.find((i) => i.value == null);
+      return r && r.label != null ? r.label : ke(e, o);
+    }
+    if (typeof e != "object") {
+      const r = s.find((i) => i && i.value === e);
+      return r && r.label != null ? r.label : ke(e, o);
+    }
+    if ("value" in e) {
+      const r = s.find((i) => i && i.value === e.value);
+      if (r && r.label != null)
+        return r.label;
+    }
+  }
+  return ke(e, o);
+}
+function Bn(e, t) {
+  return !Array.isArray(e) || e.length === 0 ? "" : e.map((o) => ke(o, t)).join(", ");
+}
+function Un(e) {
+  const t = e.getBoundingClientRect();
+  if (process.env.NODE_ENV === "test")
+    return t;
+  const o = window.getComputedStyle(e, "::before"), s = window.getComputedStyle(e, "::after");
+  if (!(o.content !== "none" || s.content !== "none"))
+    return t;
+  const i = parseFloat(o.width) || 0, m = parseFloat(o.height) || 0, d = parseFloat(s.width) || 0, F = parseFloat(s.height) || 0, w = Math.max(t.width, i, d), v = Math.max(t.height, m, F), R = w - t.width, b = v - t.height;
+  return {
+    left: t.left - R / 2,
+    right: t.right + R / 2,
+    top: t.top - b / 2,
+    bottom: t.bottom + b / 2
+  };
+}
+const $e = "base-ui-disable-scrollbar", lt = {
+  className: $e,
+  element: /* @__PURE__ */ C("style", {
+    href: $e,
+    precedence: "base-ui:low",
+    children: `.${$e}{scrollbar-width:none}.${$e}::-webkit-scrollbar{display:none}`
+  })
+}, ut = /* @__PURE__ */ n.createContext(null);
+process.env.NODE_ENV !== "production" && (ut.displayName = "SelectRootContext");
+const dt = /* @__PURE__ */ n.createContext(null);
+process.env.NODE_ENV !== "production" && (dt.displayName = "SelectFloatingContext");
+function Se() {
+  const e = n.useContext(ut);
+  if (e === null)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: SelectRootContext is missing. Select parts must be placed within <Select.Root>." : Ke(60));
+  return e;
+}
+function Vt() {
+  const e = n.useContext(dt);
+  if (e === null)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: SelectFloatingContext is missing. Select parts must be placed within <Select.Root>." : Ke(61));
+  return e;
+}
+const a = {
+  id: E((e) => e.id),
+  modal: E((e) => e.modal),
+  multiple: E((e) => e.multiple),
+  items: E((e) => e.items),
+  itemToStringLabel: E((e) => e.itemToStringLabel),
+  itemToStringValue: E((e) => e.itemToStringValue),
+  isItemEqualToValue: E((e) => e.isItemEqualToValue),
+  value: E((e) => e.value),
+  open: E((e) => e.open),
+  mounted: E((e) => e.mounted),
+  forceMount: E((e) => e.forceMount),
+  transitionStatus: E((e) => e.transitionStatus),
+  openMethod: E((e) => e.openMethod),
+  activeIndex: E((e) => e.activeIndex),
+  selectedIndex: E((e) => e.selectedIndex),
+  isActive: E((e, t) => e.activeIndex === t),
+  isSelected: E((e, t, o) => {
+    const s = e.isItemEqualToValue, r = e.value;
+    return e.multiple ? Array.isArray(r) && r.some((i) => Oe(i, o, s)) : e.selectedIndex === t && e.selectedIndex !== null ? !0 : Oe(r, o, s);
+  }),
+  isSelectedByFocus: E((e, t) => e.selectedIndex === t),
+  popupProps: E((e) => e.popupProps),
+  triggerProps: E((e) => e.triggerProps),
+  triggerElement: E((e) => e.triggerElement),
+  positionerElement: E((e) => e.positionerElement),
+  listElement: E((e) => e.listElement),
+  scrollUpArrowVisible: E((e) => e.scrollUpArrowVisible),
+  scrollDownArrowVisible: E((e) => e.scrollDownArrowVisible),
+  hasScrollArrows: E((e) => e.hasScrollArrows),
+  serializedValue: E((e) => {
+    const {
+      multiple: t,
+      value: o,
+      itemToStringValue: s
+    } = e;
+    return t && Array.isArray(o) && o.length === 0 ? "" : Ne(o, s);
+  })
+};
+function Ln(e) {
+  const {
+    id: t,
+    value: o,
+    defaultValue: s = null,
+    onValueChange: r,
+    open: i,
+    defaultOpen: m = !1,
+    onOpenChange: d,
+    name: F,
+    disabled: w = !1,
+    readOnly: v = !1,
+    required: R = !1,
+    modal: b = !0,
+    actionsRef: q,
+    inputRef: M,
+    onOpenChangeComplete: U,
+    items: L,
+    multiple: I = !1,
+    itemToStringLabel: V,
+    itemToStringValue: f,
+    isItemEqualToValue: X = On,
+    highlightItemOnHover: se = !0,
+    children: ie
+  } = e, {
+    clearErrors: P
+  } = nn(), {
+    setDirty: N,
+    shouldValidateOnChange: ce,
+    validityData: j,
+    setFilled: S,
+    name: G,
+    disabled: $,
+    validation: x
+  } = vt(), {
+    controlId: l
+  } = Et(), A = sn({
+    id: t
+  }), B = $ || w, O = G ?? F, [u, K] = ht({
+    controlled: o,
+    default: I ? s ?? gt : s,
+    name: "Select",
+    state: "value"
+  }), [T, Q] = ht({
+    controlled: i,
+    default: m,
+    name: "Select",
+    state: "open"
+  }), ee = n.useRef([]), te = n.useRef([]), z = n.useRef(null), c = n.useRef(null), g = n.useRef(0), D = n.useRef(null), H = n.useRef([]), Z = n.useRef(!1), le = n.useRef(!1), ne = n.useRef(null), oe = n.useRef({
+    allowSelectedMouseUp: !1,
+    allowUnselectedMouseUp: !1
+  }), Ie = n.useRef(!1), {
+    mounted: re,
+    setMounted: _,
+    transitionStatus: ae
+  } = wt(T), {
+    openMethod: pe,
+    triggerProps: k,
+    reset: W
+  } = dn(T), h = tn(() => new Yt({
+    id: A,
+    modal: b,
+    multiple: I,
+    itemToStringLabel: V,
+    itemToStringValue: f,
+    isItemEqualToValue: X,
+    value: u,
+    open: T,
+    mounted: re,
+    transitionStatus: ae,
+    items: L,
+    forceMount: !1,
+    openMethod: null,
+    activeIndex: null,
+    selectedIndex: null,
+    popupProps: {},
+    triggerProps: {},
+    triggerElement: null,
+    positionerElement: null,
+    listElement: null,
+    scrollUpArrowVisible: !1,
+    scrollDownArrowVisible: !1,
+    hasScrollArrows: !1
+  })).current, ue = p(h, a.activeIndex), me = p(h, a.selectedIndex), ge = p(h, a.triggerElement), J = p(h, a.positionerElement), De = n.useMemo(() => I && Array.isArray(u) && u.length === 0 ? "" : Ne(u, f), [I, u, f]), Ge = n.useMemo(() => I && Array.isArray(u) ? u.map((y) => Ne(y, f)) : Ne(u, f), [I, u, f]), We = ct(h.state.triggerElement);
+  on({
+    id: A,
+    commit: x.commit,
+    value: u,
+    controlRef: We,
+    name: O,
+    getValue: () => Ge
+  });
+  const He = n.useRef(u);
+  fe(() => {
+    u !== He.current && h.set("forceMount", !0);
+  }, [h, u]), fe(() => {
+    S(u !== null);
+  }, [u, S]), fe(function() {
+    if (T)
+      return;
+    const Y = H.current;
+    if (I) {
+      const we = Array.isArray(u) ? u : [];
+      if (we.length === 0) {
+        h.set("selectedIndex", null);
+        return;
+      }
+      const be = we[we.length - 1], je = st(Y, be, X);
+      h.set("selectedIndex", je === -1 ? null : je);
+      return;
+    }
+    const Ee = st(Y, u, X);
+    h.set("selectedIndex", Ee === -1 ? null : Ee);
+  }, [I, T, u, H, X, h]), un(u, () => {
+    P(O), N(u !== j.initialValue), ce() ? x.commit(u) : x.commit(u, !0);
+  });
+  const Te = xe((y, Y) => {
+    if (d?.(y, Y), !Y.isCanceled && (Q(y), !y && h.state.activeIndex !== null)) {
+      const Ee = ee.current[h.state.activeIndex];
+      queueMicrotask(() => {
+        Ee?.setAttribute("tabindex", "-1");
+      });
+    }
+  }), Ve = xe(() => {
+    _(!1), h.set("activeIndex", null), W(), U?.(!1);
+  });
+  at({
+    enabled: !q,
+    open: T,
+    ref: z,
+    onComplete() {
+      T || Ve();
+    }
+  }), n.useImperativeHandle(q, () => ({
+    unmount: Ve
+  }), [Ve]);
+  const ve = xe((y, Y) => {
+    r?.(y, Y), !Y.isCanceled && K(y);
+  }), de = xe(() => {
+    const y = h.state.listElement || z.current;
+    if (!y)
+      return;
+    const Y = y.scrollTop, Ee = y.scrollTop + y.clientHeight, we = Y > 1, be = Ee < y.scrollHeight - 1;
+    h.state.scrollUpArrowVisible !== we && h.set("scrollUpArrowVisible", we), h.state.scrollDownArrowVisible !== be && h.set("scrollDownArrowVisible", be);
+  }), he = hn({
+    open: T,
+    onOpenChange: Te,
+    elements: {
+      reference: ge,
+      floating: J
+    }
+  }), Fe = fn(he, {
+    enabled: !v && !B,
+    event: "mousedown"
+  }), ze = Xt(he, {
+    bubbles: !1
+  }), Je = yn(he, {
+    enabled: !v && !B,
+    listRef: ee,
+    activeIndex: ue,
+    selectedIndex: me,
+    disabledIndices: gt,
+    onNavigate(y) {
+      y === null && !T || h.set("activeIndex", y);
+    },
+    // Implement our own listeners since `onPointerLeave` on each option fires while scrolling with
+    // the `alignItemWithTrigger=true`, causing a performance issue on Chrome.
+    focusItemOnHover: !1
+  }), Ze = Rn(he, {
+    enabled: !v && !B && (T || !I),
+    listRef: te,
+    activeIndex: ue,
+    selectedIndex: me,
+    onMatch(y) {
+      T ? h.set("activeIndex", y) : ve(H.current[y], ye("none"));
+    },
+    onTypingChange(y) {
+      Z.current = y;
+    }
+  }), {
+    getReferenceProps: Be,
+    getFloatingProps: Ce,
+    getItemProps: qe
+  } = Kt([Fe, ze, Je, Ze]), Ue = n.useMemo(() => St(Be(), k), [Be, k]);
+  Pn(() => {
+    h.update({
+      popupProps: Ce(),
+      triggerProps: Ue
+    });
+  }), fe(() => {
+    h.update({
+      id: A,
+      modal: b,
+      multiple: I,
+      value: u,
+      open: T,
+      mounted: re,
+      transitionStatus: ae,
+      popupProps: Ce(),
+      triggerProps: Ue,
+      items: L,
+      itemToStringLabel: V,
+      itemToStringValue: f,
+      isItemEqualToValue: X,
+      openMethod: pe
+    });
+  }, [h, A, b, I, u, T, re, ae, Ce, Ue, L, V, f, X, pe]);
+  const Me = n.useMemo(() => ({
+    store: h,
+    name: O,
+    required: R,
+    disabled: B,
+    readOnly: v,
+    multiple: I,
+    itemToStringLabel: V,
+    itemToStringValue: f,
+    highlightItemOnHover: se,
+    setValue: ve,
+    setOpen: Te,
+    listRef: ee,
+    popupRef: z,
+    scrollHandlerRef: c,
+    handleScrollArrowVisibility: de,
+    scrollArrowsMountedCountRef: g,
+    getItemProps: qe,
+    events: he.context.events,
+    valueRef: D,
+    valuesRef: H,
+    labelsRef: te,
+    typingRef: Z,
+    selectionRef: oe,
+    selectedItemTextRef: ne,
+    validation: x,
+    onOpenChangeComplete: U,
+    keyboardActiveRef: le,
+    alignItemWithTriggerActiveRef: Ie,
+    initialValueRef: He
+  }), [h, O, R, B, v, I, V, f, se, ve, Te, qe, he.context.events, x, U, de]), Le = It(M, x.inputRef), Qe = I && Array.isArray(u) && u.length > 0, et = n.useMemo(() => !I || !Array.isArray(u) || !O ? null : u.map((y) => {
+    const Y = Ne(y, f);
+    return /* @__PURE__ */ C("input", {
+      type: "hidden",
+      name: O,
+      value: Y
+    }, Y);
+  }), [I, u, O, f]);
+  return /* @__PURE__ */ C(ut.Provider, {
+    value: Me,
+    children: /* @__PURE__ */ Ae(dt.Provider, {
+      value: he,
+      children: [ie, /* @__PURE__ */ C("input", {
+        ...x.getInputValidationProps({
+          onFocus() {
+            h.state.triggerElement?.focus();
+          },
+          // Handle browser autofill.
+          onChange(y) {
+            if (y.nativeEvent.defaultPrevented)
+              return;
+            const Y = y.target.value, Ee = ye(Mt, y.nativeEvent);
+            function we() {
+              if (I)
+                return;
+              const be = H.current.find((je) => Ne(je, f).toLowerCase() === Y.toLowerCase());
+              be != null && (N(be !== j.initialValue), ve(be, Ee), ce() && x.commit(be));
+            }
+            h.set("forceMount", !0), queueMicrotask(we);
+          }
+        }),
+        id: t || l || void 0,
+        name: I ? void 0 : O,
+        value: De,
+        disabled: B,
+        required: R && !Qe,
+        readOnly: v,
+        ref: Le,
+        style: en,
+        tabIndex: -1,
+        "aria-hidden": !0
+      }), et]
+    })
+  });
+}
+const Ye = 2, kn = {
+  ...Gt,
+  ...rn,
+  value: () => null
+}, Ct = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    render: s,
+    className: r,
+    disabled: i = !1,
+    nativeButton: m = !0,
+    ...d
+  } = t, {
+    setTouched: F,
+    setFocused: w,
+    validationMode: v,
+    state: R,
+    disabled: b
+  } = vt(), {
+    labelId: q
+  } = Et(), {
+    store: M,
+    setOpen: U,
+    selectionRef: L,
+    validation: I,
+    readOnly: V,
+    alignItemWithTriggerActiveRef: f,
+    disabled: X,
+    keyboardActiveRef: se
+  } = Se(), ie = b || X || i, P = p(M, a.open), N = p(M, a.value), ce = p(M, a.triggerProps), j = p(M, a.positionerElement), S = p(M, a.listElement), G = p(M, a.serializedValue), $ = ct(j), x = n.useRef(null), l = _e(), A = _e(), {
+    getButtonProps: B,
+    buttonRef: O
+  } = Tt({
+    disabled: ie,
+    native: m
+  }), u = xe((c) => {
+    M.set("triggerElement", c);
+  }), K = It(o, x, O, u), T = _e(), Q = _e();
+  n.useEffect(() => {
+    if (P)
+      return Q.start(200, () => {
+        L.current.allowUnselectedMouseUp = !0, T.start(200, () => {
+          L.current.allowSelectedMouseUp = !0;
+        });
+      }), () => {
+        T.clear(), Q.clear();
+      };
+    L.current = {
+      allowSelectedMouseUp: !1,
+      allowUnselectedMouseUp: !1
+    }, A.clear();
+  }, [P, L, A, T, Q]);
+  const ee = n.useMemo(() => S?.id ?? Sn(j)?.id, [S, j]), te = St(ce, {
+    role: "combobox",
+    "aria-expanded": P ? "true" : "false",
+    "aria-haspopup": "listbox",
+    "aria-controls": P ? ee : void 0,
+    "aria-labelledby": q,
+    "aria-readonly": V || void 0,
+    tabIndex: ie ? -1 : 0,
+    ref: K,
+    onFocus(c) {
+      w(!0), P && f.current && U(!1, ye(ln, c.nativeEvent)), l.start(0, () => {
+        M.set("forceMount", !0);
+      });
+    },
+    onBlur() {
+      F(!0), w(!1), v === "onBlur" && I.commit(N);
+    },
+    onPointerMove() {
+      se.current = !1;
+    },
+    onKeyDown() {
+      se.current = !0;
+    },
+    onMouseDown(c) {
+      if (P)
+        return;
+      const g = rt(c.currentTarget);
+      function D(H) {
+        if (!x.current)
+          return;
+        const Z = H.target;
+        if (bt(x.current, Z) || bt($.current, Z) || Z === x.current)
+          return;
+        const le = Un(x.current);
+        H.clientX >= le.left - Ye && H.clientX <= le.right + Ye && H.clientY >= le.top - Ye && H.clientY <= le.bottom + Ye || U(!1, ye(cn, H));
+      }
+      A.start(0, () => {
+        g.addEventListener("mouseup", D, {
+          once: !0
+        });
+      });
+    }
+  }, I.getValidationProps, d, B);
+  te.role = "combobox";
+  const z = n.useMemo(() => ({
+    ...R,
+    open: P,
+    disabled: ie,
+    value: N,
+    readOnly: V,
+    placeholder: !G
+  }), [R, P, ie, N, V, G]);
+  return Re("button", t, {
+    ref: [o, x],
+    state: z,
+    stateAttributesMapping: kn,
+    props: te
+  });
+});
+process.env.NODE_ENV !== "production" && (Ct.displayName = "SelectTrigger");
+const Wn = {
+  value: () => null
+}, Nt = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    className: s,
+    render: r,
+    children: i,
+    ...m
+  } = t, {
+    store: d,
+    valueRef: F
+  } = Se(), w = p(d, a.value), v = p(d, a.items), R = p(d, a.itemToStringLabel), b = p(d, a.serializedValue), q = n.useMemo(() => ({
+    value: w,
+    placeholder: !b
+  }), [w, b]), M = typeof i == "function" ? i(w) : i ?? (Array.isArray(w) ? Bn(w, R) : Fn(w, v, R));
+  return Re("span", t, {
+    state: q,
+    ref: [o, F],
+    props: [{
+      children: M
+    }, m],
+    stateAttributesMapping: Wn
+  });
+});
+process.env.NODE_ENV !== "production" && (Nt.displayName = "SelectValue");
+const _t = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    className: s,
+    render: r,
+    ...i
+  } = t, {
+    store: m
+  } = Se(), d = p(m, a.open), F = n.useMemo(() => ({
+    open: d
+  }), [d]);
+  return Re("span", t, {
+    state: F,
+    ref: o,
+    props: [{
+      "aria-hidden": !0,
+      children: "▼"
+    }, i],
+    stateAttributesMapping: Jt
+  });
+});
+process.env.NODE_ENV !== "production" && (_t.displayName = "SelectIcon");
+const Pt = /* @__PURE__ */ n.createContext(void 0);
+process.env.NODE_ENV !== "production" && (Pt.displayName = "SelectPortalContext");
+const Ot = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    store: s
+  } = Se(), r = p(s, a.mounted), i = p(s, a.forceMount);
+  return r || i ? /* @__PURE__ */ C(Pt.Provider, {
+    value: !0,
+    children: /* @__PURE__ */ C(In, {
+      ref: o,
+      ...t
+    })
+  }) : null;
+});
+process.env.NODE_ENV !== "production" && (Ot.displayName = "SelectPortal");
+const ft = /* @__PURE__ */ n.createContext(void 0);
+process.env.NODE_ENV !== "production" && (ft.displayName = "SelectPositionerContext");
+function Dt() {
+  const e = n.useContext(ft);
+  if (!e)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: SelectPositionerContext is missing. SelectPositioner parts must be placed within <Select.Positioner>." : Ke(59));
+  return e;
+}
+function Xe(e, t) {
+  e && Object.assign(e.style, t);
+}
+const Ht = {
+  position: "relative",
+  maxHeight: "100%",
+  overflowX: "hidden",
+  overflowY: "auto"
+}, zn = {
+  position: "fixed"
+}, Ft = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    anchor: s,
+    positionMethod: r = "absolute",
+    className: i,
+    render: m,
+    side: d = "bottom",
+    align: F = "center",
+    sideOffset: w = 0,
+    alignOffset: v = 0,
+    collisionBoundary: R = "clipping-ancestors",
+    collisionPadding: b,
+    arrowPadding: q = 5,
+    sticky: M = !1,
+    disableAnchorTracking: U,
+    alignItemWithTrigger: L = !0,
+    collisionAvoidance: I = vn,
+    ...V
+  } = t, {
+    store: f,
+    listRef: X,
+    labelsRef: se,
+    alignItemWithTriggerActiveRef: ie,
+    selectedItemTextRef: P,
+    valuesRef: N,
+    initialValueRef: ce,
+    popupRef: j,
+    setValue: S
+  } = Se(), G = Vt(), $ = p(f, a.open), x = p(f, a.mounted), l = p(f, a.modal), A = p(f, a.value), B = p(f, a.openMethod), O = p(f, a.positionerElement), u = p(f, a.triggerElement), K = p(f, a.isItemEqualToValue), T = n.useRef(null), Q = n.useRef(null), [ee, te] = n.useState(L), z = x && ee && B !== "touch";
+  !x && ee !== L && te(L), fe(() => {
+    x || (a.scrollUpArrowVisible(f.state) && f.set("scrollUpArrowVisible", !1), a.scrollDownArrowVisible(f.state) && f.set("scrollDownArrowVisible", !1));
+  }, [f, x]), n.useImperativeHandle(ie, () => z), pn((z || l) && $ && B !== "touch", u);
+  const c = bn({
+    anchor: s,
+    floatingRootContext: G,
+    positionMethod: r,
+    mounted: x,
+    side: d,
+    sideOffset: w,
+    align: F,
+    alignOffset: v,
+    arrowPadding: q,
+    collisionBoundary: R,
+    collisionPadding: b,
+    sticky: M,
+    disableAnchorTracking: U ?? z,
+    collisionAvoidance: I,
+    keepMounted: !0
+  }), g = z ? "none" : c.side, D = z ? zn : c.positionerStyles, H = n.useMemo(() => {
+    const _ = {};
+    return $ || (_.pointerEvents = "none"), {
+      role: "presentation",
+      hidden: !x,
+      style: {
+        ...D,
+        ..._
+      }
+    };
+  }, [$, x, D]), Z = n.useMemo(() => ({
+    open: $,
+    side: g,
+    align: c.align,
+    anchorHidden: c.anchorHidden
+  }), [$, g, c.align, c.anchorHidden]), le = xe((_) => {
+    f.set("positionerElement", _);
+  }), ne = Re("div", t, {
+    ref: [o, le],
+    state: Z,
+    stateAttributesMapping: yt,
+    props: [H, V]
+  }), oe = n.useRef(0), Ie = xe((_) => {
+    if (_.size === 0 && oe.current === 0 || N.current.length === 0)
+      return;
+    const ae = oe.current;
+    if (oe.current = _.size, _.size === ae)
+      return;
+    const pe = ye(Mt);
+    if (ae !== 0 && !f.state.multiple && A !== null && st(N.current, A, K) === -1) {
+      const W = ce.current, ue = W != null && nt(N.current, W, K) ? W : null;
+      S(ue, pe), ue === null && (f.set("selectedIndex", null), P.current = null);
+    }
+    if (ae !== 0 && f.state.multiple && Array.isArray(A)) {
+      const k = A.filter((W) => nt(N.current, W, K));
+      (k.length !== A.length || k.some((W) => !nt(A, W, K))) && (S(k, pe), k.length === 0 && (f.set("selectedIndex", null), P.current = null));
+    }
+    if ($ && z) {
+      f.update({
+        scrollUpArrowVisible: !1,
+        scrollDownArrowVisible: !1
+      });
+      const k = {
+        height: ""
+      };
+      Xe(O, k), Xe(j.current, k);
+    }
+  }), re = n.useMemo(() => ({
+    ...c,
+    side: g,
+    alignItemWithTriggerActive: z,
+    setControlledAlignItemWithTrigger: te,
+    scrollUpArrowRef: T,
+    scrollDownArrowRef: Q
+  }), [c, g, z, te]);
+  return /* @__PURE__ */ C(wn, {
+    elementsRef: X,
+    labelsRef: se,
+    onMapChange: Ie,
+    children: /* @__PURE__ */ Ae(ft.Provider, {
+      value: re,
+      children: [x && l && /* @__PURE__ */ C(mn, {
+        inert: En(!$),
+        cutout: u
+      }), ne]
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (Ft.displayName = "SelectPositioner");
+function Bt(e) {
+  const t = e.currentTarget.getBoundingClientRect();
+  return t.top + 1 <= e.clientY && e.clientY <= t.bottom - 1 && t.left + 1 <= e.clientX && e.clientX <= t.right - 1;
+}
+const qn = {
+  ...yt,
+  ...At
+}, Ut = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    render: s,
+    className: r,
+    ...i
+  } = t, {
+    store: m,
+    popupRef: d,
+    onOpenChangeComplete: F,
+    setOpen: w,
+    valueRef: v,
+    selectedItemTextRef: R,
+    keyboardActiveRef: b,
+    multiple: q,
+    handleScrollArrowVisibility: M,
+    scrollHandlerRef: U
+  } = Se(), {
+    side: L,
+    align: I,
+    alignItemWithTriggerActive: V,
+    setControlledAlignItemWithTrigger: f,
+    scrollDownArrowRef: X,
+    scrollUpArrowRef: se
+  } = Dt(), ie = Nn() != null, P = Vt(), N = _e(), ce = p(m, a.id), j = p(m, a.open), S = p(m, a.mounted), G = p(m, a.popupProps), $ = p(m, a.transitionStatus), x = p(m, a.triggerElement), l = p(m, a.positionerElement), A = p(m, a.listElement), B = n.useRef(0), O = n.useRef(!1), u = n.useRef(0), K = n.useRef(!1), T = n.useRef({}), Q = Cn(), ee = xe((g) => {
+    if (!l || !d.current || !K.current)
+      return;
+    if (O.current || !V) {
+      M();
+      return;
+    }
+    const D = l.style.top === "0px", H = l.style.bottom === "0px", Z = l.getBoundingClientRect().height, le = rt(l), ne = getComputedStyle(l), oe = parseFloat(ne.marginTop), Ie = parseFloat(ne.marginBottom), re = le.documentElement.clientHeight - oe - Ie, _ = g.scrollTop, ae = g.scrollHeight, pe = g.clientHeight, k = ae - pe;
+    let W = null, h = null, ue = !1;
+    if (D) {
+      const me = k - _, ge = Z + me, J = Math.min(ge, re);
+      W = J, J !== re ? h = k : ue = !0;
+    } else if (H) {
+      const me = _ - 0, ge = Z + me, J = Math.min(ge, re), De = ge - re;
+      W = J, J !== re ? h = 0 : (ue = !0, _ < k && (h = _ - (me - De)));
+    }
+    W != null && (l.style.height = `${W}px`), h != null && (g.scrollTop = h), ue && (O.current = !0), M();
+  });
+  n.useImperativeHandle(U, () => ee, [ee]), at({
+    open: j,
+    ref: d,
+    onComplete() {
+      j && F?.(!0);
+    }
+  });
+  const te = n.useMemo(() => ({
+    open: j,
+    transitionStatus: $,
+    side: L,
+    align: I
+  }), [j, $, L, I]);
+  fe(() => {
+    !l || !d.current || Object.keys(T.current).length || (T.current = {
+      top: l.style.top || "0",
+      left: l.style.left || "0",
+      right: l.style.right,
+      height: l.style.height,
+      bottom: l.style.bottom,
+      minHeight: l.style.minHeight,
+      maxHeight: l.style.maxHeight,
+      marginTop: l.style.marginTop,
+      marginBottom: l.style.marginBottom
+    });
+  }, [d, l]), fe(() => {
+    S || V || (K.current = !1, O.current = !1, B.current = 0, u.current = 0, Xe(l, T.current));
+  }, [S, V, l, d]), fe(() => {
+    const g = d.current;
+    if (!(!S || !x || !l || !g)) {
+      if (!V) {
+        K.current = !0, Q.request(M);
+        return;
+      }
+      queueMicrotask(() => {
+        const D = getComputedStyle(l), H = getComputedStyle(g), Z = rt(x), le = xt(l), ne = x.getBoundingClientRect(), oe = l.getBoundingClientRect(), Ie = ne.left, re = ne.height, _ = A || g, ae = _.scrollHeight, pe = parseFloat(H.borderBottomWidth), k = parseFloat(D.marginTop) || 10, W = parseFloat(D.marginBottom) || 10, h = parseFloat(D.minHeight) || 100, ue = 5, me = 5, ge = 20, J = Z.documentElement.clientHeight - k - W, De = Z.documentElement.clientWidth, Ge = J - ne.bottom + re, We = R.current, He = v.current;
+        let Te = 0, Ve = 0;
+        if (We && He) {
+          const Me = He.getBoundingClientRect(), Le = We.getBoundingClientRect(), Qe = Me.left - Ie, et = Le.left - oe.left, y = Me.top - ne.top + Me.height / 2, Y = Le.top - oe.top + Le.height / 2;
+          Te = Qe - et, Ve = Y - y;
+        }
+        const ve = Ge + Ve + W + pe;
+        let de = Math.min(J, ve);
+        const he = J - k - W, Fe = ve - de, ze = Math.max(ue, Ie + Te), Je = De - me, Ze = Math.max(0, ze + oe.width - Je);
+        l.style.left = `${ze - Ze}px`, l.style.height = `${de}px`, l.style.maxHeight = "auto", l.style.marginTop = `${k}px`, l.style.marginBottom = `${W}px`, g.style.height = "100%";
+        const Be = _.scrollHeight - _.clientHeight, Ce = Fe >= Be;
+        Ce && (de = Math.min(J, oe.height) - (Fe - Be));
+        const qe = ne.top < ge || ne.bottom > J - ge || de < Math.min(ae, h), Ue = (le.visualViewport?.scale ?? 1) !== 1 && Vn;
+        if (qe || Ue) {
+          K.current = !0, Xe(l, T.current), Tn.flushSync(() => f(!1));
+          return;
+        }
+        if (Ce) {
+          const Me = Math.max(0, J - ve);
+          l.style.top = oe.height >= he ? "0" : `${Me}px`, l.style.height = `${de}px`, _.scrollTop = _.scrollHeight - _.clientHeight, B.current = Math.max(h, de);
+        } else
+          l.style.bottom = "0", B.current = Math.max(h, de), _.scrollTop = Fe;
+        B.current === J && (O.current = !0), M(), setTimeout(() => {
+          K.current = !0;
+        });
+      });
+    }
+  }, [m, S, l, x, v, R, d, M, V, f, Q, X, se, A]), n.useEffect(() => {
+    if (!V || !l || !S)
+      return;
+    const g = xt(l);
+    function D(H) {
+      w(!1, ye(an, H));
+    }
+    return g.addEventListener("resize", D), () => {
+      g.removeEventListener("resize", D);
+    };
+  }, [w, V, l, S]);
+  const z = {
+    ...A ? {
+      role: "presentation",
+      "aria-orientation": void 0
+    } : {
+      role: "listbox",
+      "aria-multiselectable": q || void 0,
+      id: `${ce}-list`
+    },
+    onKeyDown(g) {
+      b.current = !0, ie && _n.has(g.key) && g.stopPropagation();
+    },
+    onMouseMove() {
+      b.current = !1;
+    },
+    onPointerLeave(g) {
+      if (Bt(g) || g.pointerType === "touch")
+        return;
+      const D = g.currentTarget;
+      N.start(0, () => {
+        m.set("activeIndex", null), D.focus({
+          preventScroll: !0
+        });
+      });
+    },
+    onScroll(g) {
+      A || U.current?.(g.currentTarget);
+    },
+    ...V && {
+      style: A ? {
+        height: "100%"
+      } : Ht
+    }
+  }, c = Re("div", t, {
+    ref: [o, d],
+    state: te,
+    stateAttributesMapping: qn,
+    props: [G, z, xn($), {
+      className: !A && V ? lt.className : void 0
+    }, i]
+  });
+  return /* @__PURE__ */ Ae(n.Fragment, {
+    children: [lt.element, /* @__PURE__ */ C(gn, {
+      context: P,
+      modal: !1,
+      disabled: !S,
+      restoreFocus: !0,
+      children: c
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" && (Ut.displayName = "SelectPopup");
+const Lt = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    className: s,
+    render: r,
+    ...i
+  } = t, {
+    store: m,
+    scrollHandlerRef: d
+  } = Se(), {
+    alignItemWithTriggerActive: F
+  } = Dt(), w = p(m, a.hasScrollArrows), v = p(m, a.openMethod), R = p(m, a.multiple), q = {
+    id: `${p(m, a.id)}-list`,
+    role: "listbox",
+    "aria-multiselectable": R || void 0,
+    onScroll(U) {
+      d.current?.(U.currentTarget);
+    },
+    ...F && {
+      style: Ht
+    },
+    className: w && v !== "touch" ? lt.className : void 0
+  }, M = xe((U) => {
+    m.set("listElement", U);
+  });
+  return Re("div", t, {
+    ref: [o, M],
+    props: [q, i]
+  });
+});
+process.env.NODE_ENV !== "production" && (Lt.displayName = "SelectList");
+const pt = /* @__PURE__ */ n.createContext(void 0);
+process.env.NODE_ENV !== "production" && (pt.displayName = "SelectItemContext");
+function mt() {
+  const e = n.useContext(pt);
+  if (!e)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: SelectItemContext is missing. SelectItem parts must be placed within <Select.Item>." : Ke(57));
+  return e;
+}
+const kt = /* @__PURE__ */ n.memo(/* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    render: s,
+    className: r,
+    value: i = null,
+    label: m,
+    disabled: d = !1,
+    nativeButton: F = !1,
+    ...w
+  } = t, v = n.useRef(null), R = Mn({
+    label: m,
+    textRef: v,
+    indexGuessBehavior: An.GuessFromOrder
+  }), {
+    store: b,
+    getItemProps: q,
+    setOpen: M,
+    setValue: U,
+    selectionRef: L,
+    typingRef: I,
+    valuesRef: V,
+    keyboardActiveRef: f,
+    multiple: X,
+    highlightItemOnHover: se
+  } = Se(), ie = _e(), P = p(b, a.isActive, R.index), N = p(b, a.isSelected, R.index, i), ce = p(b, a.isSelectedByFocus, R.index), j = p(b, a.isItemEqualToValue), S = R.index, G = S !== -1, $ = n.useRef(null), x = ct(S);
+  fe(() => {
+    if (!G)
+      return;
+    const c = V.current;
+    return c[S] = i, () => {
+      delete c[S];
+    };
+  }, [G, S, i, V]), fe(() => {
+    if (!G)
+      return;
+    const c = b.state.value;
+    let g = c;
+    X && Array.isArray(c) && c.length > 0 && (g = c[c.length - 1]), g !== void 0 && Oe(g, i, j) && b.set("selectedIndex", S);
+  }, [G, S, X, j, b, i]);
+  const l = n.useMemo(() => ({
+    disabled: d,
+    selected: N,
+    highlighted: P
+  }), [d, N, P]), A = q({
+    active: P,
+    selected: N
+  });
+  A.onFocus = void 0, A.id = void 0;
+  const B = n.useRef(null), O = n.useRef("mouse"), u = n.useRef(!1), {
+    getButtonProps: K,
+    buttonRef: T
+  } = Tt({
+    disabled: d,
+    focusableWhenDisabled: !0,
+    native: F
+  });
+  function Q(c) {
+    const g = b.state.value;
+    if (X) {
+      const D = Array.isArray(g) ? g : [], H = N ? Dn(D, i, j) : [...D, i];
+      U(H, ye(tt, c));
+    } else
+      U(i, ye(tt, c)), M(!1, ye(tt, c));
+  }
+  const ee = {
+    role: "option",
+    "aria-selected": N,
+    "aria-disabled": d || void 0,
+    tabIndex: P ? 0 : -1,
+    onFocus() {
+      b.set("activeIndex", S);
+    },
+    onMouseEnter() {
+      !f.current && b.state.selectedIndex === null && b.set("activeIndex", S);
+    },
+    onMouseMove() {
+      se && b.set("activeIndex", S);
+    },
+    onMouseLeave(c) {
+      !se || f.current || Bt(c) || ie.start(0, () => {
+        b.state.activeIndex === S && b.set("activeIndex", null);
+      });
+    },
+    onTouchStart() {
+      L.current = {
+        allowSelectedMouseUp: !1,
+        allowUnselectedMouseUp: !1
+      };
+    },
+    onKeyDown(c) {
+      B.current = c.key, b.set("activeIndex", S);
+    },
+    onClick(c) {
+      u.current = !1, !(c.type === "keydown" && B.current === null) && (d || B.current === " " && I.current || O.current !== "touch" && !P || (B.current = null, Q(c.nativeEvent)));
+    },
+    onPointerEnter(c) {
+      O.current = c.pointerType;
+    },
+    onPointerDown(c) {
+      O.current = c.pointerType, u.current = !0;
+    },
+    onMouseUp(c) {
+      if (d)
+        return;
+      if (u.current) {
+        u.current = !1;
+        return;
+      }
+      const g = !L.current.allowSelectedMouseUp && N, D = !L.current.allowUnselectedMouseUp && !N;
+      g || D || O.current !== "touch" && !P || Q(c.nativeEvent);
+    }
+  }, te = Re("div", t, {
+    ref: [T, o, R.ref, $],
+    state: l,
+    props: [A, ee, w, K]
+  }), z = n.useMemo(() => ({
+    selected: N,
+    indexRef: x,
+    textRef: v,
+    selectedByFocus: ce,
+    hasRegistered: G
+  }), [N, x, v, ce, G]);
+  return /* @__PURE__ */ C(pt.Provider, {
+    value: z,
+    children: te
+  });
+}));
+process.env.NODE_ENV !== "production" && (kt.displayName = "SelectItem");
+const Wt = /* @__PURE__ */ n.forwardRef(function(t, o) {
+  const s = t.keepMounted ?? !1, {
+    selected: r
+  } = mt();
+  return s || r ? /* @__PURE__ */ C(zt, {
+    ...t,
+    ref: o
+  }) : null;
+});
+process.env.NODE_ENV !== "production" && (Wt.displayName = "SelectItemIndicator");
+const zt = /* @__PURE__ */ n.memo(/* @__PURE__ */ n.forwardRef((e, t) => {
+  const {
+    render: o,
+    className: s,
+    keepMounted: r,
+    ...i
+  } = e, {
+    selected: m
+  } = mt(), d = n.useRef(null), {
+    transitionStatus: F,
+    setMounted: w
+  } = wt(m), v = n.useMemo(() => ({
+    selected: m,
+    transitionStatus: F
+  }), [m, F]), R = Re("span", e, {
+    ref: [t, d],
+    state: v,
+    props: [{
+      "aria-hidden": !0,
+      children: "✔️"
+    }, i],
+    stateAttributesMapping: At
+  });
+  return at({
+    open: m,
+    ref: d,
+    onComplete() {
+      m || w(!1);
+    }
+  }), R;
+}));
+process.env.NODE_ENV !== "production" && (zt.displayName = "Inner");
+const qt = /* @__PURE__ */ n.memo(/* @__PURE__ */ n.forwardRef(function(t, o) {
+  const {
+    indexRef: s,
+    textRef: r,
+    selectedByFocus: i,
+    hasRegistered: m
+  } = mt(), {
+    selectedItemTextRef: d
+  } = Se(), {
+    className: F,
+    render: w,
+    ...v
+  } = t, R = n.useCallback((q) => {
+    if (!q || !m)
+      return;
+    const M = d.current === null || !d.current.isConnected;
+    (i || M && s.current === 0) && (d.current = q);
+  }, [d, s, i, m]);
+  return Re("div", t, {
+    ref: [R, o, r],
+    props: v
+  });
+}));
+process.env.NODE_ENV !== "production" && (qt.displayName = "SelectItemText");
+const jn = "_select__trigger_4x1b0_2", $n = "_select__list_4x1b0_21", Yn = "_select__item_4x1b0_33", Pe = {
+  select__trigger: jn,
+  "select__trigger-icon": "_select__trigger-icon_4x1b0_17",
+  select__list: $n,
+  select__item: Yn,
+  "select__item-indicator": "_select__item-indicator_4x1b0_58",
+  "select__item-text": "_select__item-text_4x1b0_62"
+};
+function No({
+  placeholder: e,
+  className: t,
+  style: o,
+  ...s
+}) {
+  return /* @__PURE__ */ Ae(Ln, { ...s, children: [
+    /* @__PURE__ */ Ae(
+      Qt,
+      {
+        interactive: "fill-outline",
+        render: /* @__PURE__ */ C(Ct, {}),
+        style: o,
+        className: jt(Pe.select__trigger, t),
+        children: [
+          /* @__PURE__ */ C(Nt, { children: Xn(e, s.items) }),
+          /* @__PURE__ */ C(_t, { children: /* @__PURE__ */ C(
+            Rt,
+            {
+              name: "arrow-down-s-line",
+              className: Pe["select__trigger-icon"]
+            }
+          ) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ C(Ot, { children: /* @__PURE__ */ C(Ft, { sideOffset: 4, alignItemWithTrigger: !1, children: /* @__PURE__ */ C(
+      Ut,
+      {
+        className: Zt.transition_scale,
+        children: /* @__PURE__ */ Ae(Lt, { className: Pe.select__list, children: [
+          e && !s.multiple ? /* @__PURE__ */ C(ot, { value: null, label: e }) : null,
+          Array.isArray(s.items) ? s.items.map(({ value: r, label: i }) => /* @__PURE__ */ C(ot, { value: r, label: i }, r)) : typeof s.items == "object" ? Object.entries(s.items).map(([r, i]) => /* @__PURE__ */ C(ot, { value: r, label: i }, r)) : null
+        ] })
+      }
+    ) }) })
+  ] });
+}
+function ot(e) {
+  return /* @__PURE__ */ Ae(
+    kt,
+    {
+      className: Pe.select__item,
+      value: e.value,
+      children: [
+        /* @__PURE__ */ C(
+          Wt,
+          {
+            className: Pe["select__item-indicator"],
+            children: /* @__PURE__ */ C(Rt, { name: "check-line" })
+          }
+        ),
+        /* @__PURE__ */ C(qt, { className: Pe["select__item-text"], children: $t(e.label) })
+      ]
+    }
+  );
+}
+function Xn(e, t) {
+  function o(r) {
+    if (Array.isArray(t))
+      return t.find((i) => i.value === r)?.label;
+    if (typeof t == "object" && r in t)
+      return t[r];
+  }
+  function s(r) {
+    return !r || !t || r.length === 0 ? e : typeof r == "string" ? o(r) : [
+      o(r[0]) || r[0],
+      r.length > 1 ? ` (+${r.length - 1} more)` : ""
+    ];
+  }
+  return s;
+}
+export {
+  No as Select
+};