@ariakit/react-core 0.3.14 → 0.4.0

package/cjs/select/select-store.cjs

@@ -2,19 +2,19 @@
 
 
 
-var _NONPPWSFcjs = require('../__chunks/NONPPWSF.cjs');
-require('../__chunks/3WCBE6SU.cjs');
+var _XPNDTO4Ncjs = require('../__chunks/XPNDTO4N.cjs');
+require('../__chunks/OBT2YMBC.cjs');
 require('../__chunks/LUL2YWZ3.cjs');
 require('../__chunks/CDNJPIEG.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
-require('../__chunks/RNZNGEL4.cjs');
-require('../__chunks/NRGWVSB5.cjs');
-require('../__chunks/W5LJEMLB.cjs');
-require('../__chunks/JAQJG42R.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
+require('../__chunks/Q67LZMDT.cjs');
+require('../__chunks/GOS3JJKQ.cjs');
+require('../__chunks/AD7LA3CE.cjs');
+require('../__chunks/QJZAESAR.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
@@ -22,4 +22,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-exports.useSelectStore = _NONPPWSFcjs.useSelectStore; exports.useSelectStoreProps = _NONPPWSFcjs.useSelectStoreProps;
+exports.useSelectStore = _XPNDTO4Ncjs.useSelectStore; exports.useSelectStoreProps = _XPNDTO4Ncjs.useSelectStoreProps;

package/cjs/select/select-store.d.cts

@@ -5,6 +5,8 @@ import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreStat
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store } from "../utils/store.js";
 export declare function useSelectStoreProps<T extends Core.SelectStore>(store: T, update: () => void, props: SelectStoreProps): T & {
+    disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+} & {
     combobox: ComboboxStore<import("@ariakit/core/combobox/combobox-store").ComboboxStoreSelectedValue> | null | undefined;
 };
 /**
@@ -29,9 +31,9 @@ export interface SelectStoreItem extends Core.SelectStoreItem {
 }
 export interface SelectStoreState<T extends SelectStoreValue = SelectStoreValue> extends Core.SelectStoreState<T>, CompositeStoreState<SelectStoreItem>, PopoverStoreState {
 }
-export interface SelectStoreFunctions<T extends SelectStoreValue = SelectStoreValue> extends Pick<SelectStoreOptions<T>, "combobox">, Omit<Core.SelectStoreFunctions<T>, "combobox">, CompositeStoreFunctions<SelectStoreItem>, PopoverStoreFunctions {
+export interface SelectStoreFunctions<T extends SelectStoreValue = SelectStoreValue> extends Pick<SelectStoreOptions<T>, "combobox" | "disclosure">, Omit<Core.SelectStoreFunctions<T>, "combobox" | "disclosure">, CompositeStoreFunctions<SelectStoreItem>, PopoverStoreFunctions {
 }
-export interface SelectStoreOptions<T extends SelectStoreValue = SelectStoreValue> extends Core.SelectStoreOptions<T>, CompositeStoreOptions<SelectStoreItem>, PopoverStoreOptions {
+export interface SelectStoreOptions<T extends SelectStoreValue = SelectStoreValue> extends Omit<Core.SelectStoreOptions<T>, "combobox" | "disclosure">, CompositeStoreOptions<SelectStoreItem>, PopoverStoreOptions {
     /**
      * Function that will be called when the
      * [`value`](https://ariakit.org/reference/select-provider#value) state
@@ -53,7 +55,7 @@ export interface SelectStoreOptions<T extends SelectStoreValue = SelectStoreValu
      */
     combobox?: ComboboxStore | null;
 }
-export interface SelectStoreProps<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreOptions<T>, Omit<Core.SelectStoreProps<T>, "combobox"> {
+export interface SelectStoreProps<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreOptions<T>, Omit<Core.SelectStoreProps<T>, "combobox" | "disclosure"> {
 }
-export interface SelectStore<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreFunctions<T>, Omit<Store<Core.SelectStore<T>>, "combobox"> {
+export interface SelectStore<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreFunctions<T>, Omit<Store<Core.SelectStore<T>>, "combobox" | "disclosure"> {
 }

package/cjs/select/select-store.d.ts

@@ -5,6 +5,8 @@ import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreStat
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store } from "../utils/store.js";
 export declare function useSelectStoreProps<T extends Core.SelectStore>(store: T, update: () => void, props: SelectStoreProps): T & {
+    disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+} & {
     combobox: ComboboxStore<import("@ariakit/core/combobox/combobox-store").ComboboxStoreSelectedValue> | null | undefined;
 };
 /**
@@ -29,9 +31,9 @@ export interface SelectStoreItem extends Core.SelectStoreItem {
 }
 export interface SelectStoreState<T extends SelectStoreValue = SelectStoreValue> extends Core.SelectStoreState<T>, CompositeStoreState<SelectStoreItem>, PopoverStoreState {
 }
-export interface SelectStoreFunctions<T extends SelectStoreValue = SelectStoreValue> extends Pick<SelectStoreOptions<T>, "combobox">, Omit<Core.SelectStoreFunctions<T>, "combobox">, CompositeStoreFunctions<SelectStoreItem>, PopoverStoreFunctions {
+export interface SelectStoreFunctions<T extends SelectStoreValue = SelectStoreValue> extends Pick<SelectStoreOptions<T>, "combobox" | "disclosure">, Omit<Core.SelectStoreFunctions<T>, "combobox" | "disclosure">, CompositeStoreFunctions<SelectStoreItem>, PopoverStoreFunctions {
 }
-export interface SelectStoreOptions<T extends SelectStoreValue = SelectStoreValue> extends Core.SelectStoreOptions<T>, CompositeStoreOptions<SelectStoreItem>, PopoverStoreOptions {
+export interface SelectStoreOptions<T extends SelectStoreValue = SelectStoreValue> extends Omit<Core.SelectStoreOptions<T>, "combobox" | "disclosure">, CompositeStoreOptions<SelectStoreItem>, PopoverStoreOptions {
     /**
      * Function that will be called when the
      * [`value`](https://ariakit.org/reference/select-provider#value) state
@@ -53,7 +55,7 @@ export interface SelectStoreOptions<T extends SelectStoreValue = SelectStoreValu
      */
     combobox?: ComboboxStore | null;
 }
-export interface SelectStoreProps<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreOptions<T>, Omit<Core.SelectStoreProps<T>, "combobox"> {
+export interface SelectStoreProps<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreOptions<T>, Omit<Core.SelectStoreProps<T>, "combobox" | "disclosure"> {
 }
-export interface SelectStore<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreFunctions<T>, Omit<Store<Core.SelectStore<T>>, "combobox"> {
+export interface SelectStore<T extends SelectStoreValue = SelectStoreValue> extends SelectStoreFunctions<T>, Omit<Store<Core.SelectStore<T>>, "combobox" | "disclosure"> {
 }

package/cjs/select/select.cjs

@@ -1,36 +1,36 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _LICANQTIcjs = require('../__chunks/LICANQTI.cjs');
-require('../__chunks/QCG6J6X5.cjs');
-require('../__chunks/LFHNPG2L.cjs');
-require('../__chunks/3QW6ELTG.cjs');
-require('../__chunks/5UTRYT6E.cjs');
+var _PR3MIXQDcjs = require('../__chunks/PR3MIXQD.cjs');
+require('../__chunks/K5V42RR6.cjs');
+require('../__chunks/JH5Y3M4V.cjs');
+require('../__chunks/O45NLQRZ.cjs');
+require('../__chunks/MMDU7VRJ.cjs');
 
 
-var _KQN7YDDZcjs = require('../__chunks/KQN7YDDZ.cjs');
-require('../__chunks/YU7XEYUJ.cjs');
+var _BIK2473Zcjs = require('../__chunks/BIK2473Z.cjs');
+require('../__chunks/7UBOHCYJ.cjs');
 
 
-var _6PUZ4NWRcjs = require('../__chunks/6PUZ4NWR.cjs');
+var _XSRQB4KOcjs = require('../__chunks/XSRQB4KO.cjs');
 
 
 
-var _2WCJJQSKcjs = require('../__chunks/2WCJJQSK.cjs');
-require('../__chunks/DAJUUBUI.cjs');
+var _STYNL4LLcjs = require('../__chunks/STYNL4LL.cjs');
+require('../__chunks/ZMTZTMRS.cjs');
 require('../__chunks/6ZZYUFPW.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
-require('../__chunks/Z3GCTNW4.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
+require('../__chunks/5QD55NKL.cjs');
 require('../__chunks/75KXQZJX.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 
 
 
@@ -51,6 +51,7 @@ var _dom = require('@ariakit/core/utils/dom');
 var _events = require('@ariakit/core/utils/events');
 var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
+var TagName = "button";
 function getSelectedValues(select) {
   return Array.from(select.selectedOptions).map((option) => option.value);
 }
@@ -73,230 +74,223 @@ function nextWithValue(store, next) {
     return nextItem == null ? void 0 : nextItem.id;
   };
 }
-var useSelect = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
-    var _b = _a, {
-      store,
-      name,
-      form,
-      required,
-      showOnKeyDown = true,
-      moveOnKeyDown = true,
-      toggleOnClick = false,
-      toggleOnPress = !toggleOnClick
-    } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, [
-      "store",
-      "name",
-      "form",
-      "required",
-      "showOnKeyDown",
-      "moveOnKeyDown",
-      "toggleOnClick",
-      "toggleOnPress"
-    ]);
-    const context = _2WCJJQSKcjs.useSelectProviderContext.call(void 0, );
-    store = store || context;
-    _misc.invariant.call(void 0, 
-      store,
-      process.env.NODE_ENV !== "production" && "Select must receive a `store` prop or be wrapped in a SelectProvider component."
-    );
-    toggleOnPress = toggleOnClick ? false : toggleOnPress;
-    const onKeyDownProp = props.onKeyDown;
-    const showOnKeyDownProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, showOnKeyDown);
-    const moveOnKeyDownProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, moveOnKeyDown);
-    const toggleOnPressProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, toggleOnPress);
-    const placement = store.useState("placement");
-    const dir = placement.split("-")[0];
-    const value = store.useState("value");
-    const multiSelectable = Array.isArray(value);
-    const onKeyDown = _EO6LS72Hcjs.useEvent.call(void 0, (event) => {
-      var _a2;
-      onKeyDownProp == null ? void 0 : onKeyDownProp(event);
-      if (event.defaultPrevented)
-        return;
-      if (!store)
-        return;
-      const { orientation, items: items2, activeId } = store.getState();
-      if (event.key === " " || event.key === "Enter") {
-        if (toggleOnPressProp(event)) {
-          event.preventDefault();
-          store.toggle();
-        }
-      }
-      const isVertical = orientation !== "horizontal";
-      const isHorizontal = orientation !== "vertical";
-      const isGrid = !!((_a2 = items2.find(
-        (item) => !item.disabled && item.value != null
-      )) == null ? void 0 : _a2.rowId);
-      const moveKeyMap = {
-        ArrowUp: (isGrid || isVertical) && nextWithValue(store, store.up),
-        ArrowRight: (isGrid || isHorizontal) && nextWithValue(store, store.next),
-        ArrowDown: (isGrid || isVertical) && nextWithValue(store, store.down),
-        ArrowLeft: (isGrid || isHorizontal) && nextWithValue(store, store.previous)
-      };
-      const getId = moveKeyMap[event.key];
-      if (getId && moveOnKeyDownProp(event)) {
-        event.preventDefault();
-        store.move(getId());
-      }
-      const isTopOrBottom = dir === "top" || dir === "bottom";
-      const isLeft = dir === "left";
-      const isRight = dir === "right";
-      const canShowKeyMap = {
-        ArrowDown: isTopOrBottom,
-        ArrowUp: isTopOrBottom,
-        ArrowLeft: isLeft,
-        ArrowRight: isRight
-      };
-      const canShow = canShowKeyMap[event.key];
-      if (canShow && showOnKeyDownProp(event)) {
+var useSelect = _Q67LZMDTcjs.createHook.call(void 0, function useSelect2(_a) {
+  var _b = _a, {
+    store,
+    name,
+    form,
+    required,
+    showOnKeyDown = true,
+    moveOnKeyDown = true,
+    toggleOnClick = false,
+    toggleOnPress = !toggleOnClick
+  } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, [
+    "store",
+    "name",
+    "form",
+    "required",
+    "showOnKeyDown",
+    "moveOnKeyDown",
+    "toggleOnClick",
+    "toggleOnPress"
+  ]);
+  const context = _STYNL4LLcjs.useSelectProviderContext.call(void 0, );
+  store = store || context;
+  _misc.invariant.call(void 0, 
+    store,
+    process.env.NODE_ENV !== "production" && "Select must receive a `store` prop or be wrapped in a SelectProvider component."
+  );
+  toggleOnPress = toggleOnClick ? false : toggleOnPress;
+  const onKeyDownProp = props.onKeyDown;
+  const showOnKeyDownProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, showOnKeyDown);
+  const moveOnKeyDownProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, moveOnKeyDown);
+  const toggleOnPressProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, toggleOnPress);
+  const placement = store.useState("placement");
+  const dir = placement.split("-")[0];
+  const value = store.useState("value");
+  const multiSelectable = Array.isArray(value);
+  const onKeyDown = _EO6LS72Hcjs.useEvent.call(void 0, (event) => {
+    var _a2;
+    onKeyDownProp == null ? void 0 : onKeyDownProp(event);
+    if (event.defaultPrevented)
+      return;
+    if (!store)
+      return;
+    const { orientation, items: items2, activeId } = store.getState();
+    if (event.key === " " || event.key === "Enter") {
+      if (toggleOnPressProp(event)) {
         event.preventDefault();
-        store.move(activeId);
-        _events.queueBeforeEvent.call(void 0, event.currentTarget, "keyup", store.show);
+        store.toggle();
       }
+    }
+    const isVertical = orientation !== "horizontal";
+    const isHorizontal = orientation !== "vertical";
+    const isGrid = !!((_a2 = items2.find((item) => !item.disabled && item.value != null)) == null ? void 0 : _a2.rowId);
+    const moveKeyMap = {
+      ArrowUp: (isGrid || isVertical) && nextWithValue(store, store.up),
+      ArrowRight: (isGrid || isHorizontal) && nextWithValue(store, store.next),
+      ArrowDown: (isGrid || isVertical) && nextWithValue(store, store.down),
+      ArrowLeft: (isGrid || isHorizontal) && nextWithValue(store, store.previous)
+    };
+    const getId = moveKeyMap[event.key];
+    if (getId && moveOnKeyDownProp(event)) {
+      event.preventDefault();
+      store.move(getId());
+    }
+    const isTopOrBottom = dir === "top" || dir === "bottom";
+    const isLeft = dir === "left";
+    const isRight = dir === "right";
+    const canShowKeyMap = {
+      ArrowDown: isTopOrBottom,
+      ArrowUp: isTopOrBottom,
+      ArrowLeft: isLeft,
+      ArrowRight: isRight
+    };
+    const canShow = canShowKeyMap[event.key];
+    if (canShow && showOnKeyDownProp(event)) {
+      event.preventDefault();
+      store.move(activeId);
+      _events.queueBeforeEvent.call(void 0, event.currentTarget, "keyup", store.show);
+    }
+  });
+  const onMouseDownProp = props.onMouseDown;
+  const onMouseDown = _EO6LS72Hcjs.useEvent.call(void 0, (event) => {
+    onMouseDownProp == null ? void 0 : onMouseDownProp(event);
+    if (event.defaultPrevented)
+      return;
+    if (event.button)
+      return;
+    if (event.ctrlKey)
+      return;
+    if (!toggleOnPressProp(event))
+      return;
+    const element = event.currentTarget;
+    _events.queueBeforeEvent.call(void 0, element, "focusin", () => {
+      store == null ? void 0 : store.setDisclosureElement(element);
+      store == null ? void 0 : store.toggle();
     });
-    const onMouseDownProp = props.onMouseDown;
-    const onMouseDown = _EO6LS72Hcjs.useEvent.call(void 0, (event) => {
-      onMouseDownProp == null ? void 0 : onMouseDownProp(event);
-      if (event.defaultPrevented)
-        return;
-      if (event.button)
-        return;
-      if (event.ctrlKey)
-        return;
-      if (!toggleOnPressProp(event))
-        return;
-      const element = event.currentTarget;
-      _events.queueBeforeEvent.call(void 0, element, "focusin", () => {
-        store == null ? void 0 : store.setDisclosureElement(element);
-        store == null ? void 0 : store.toggle();
-      });
-    });
-    props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
-      props,
-      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _2WCJJQSKcjs.SelectScopedContextProvider, { value: store, children: element }),
-      [store]
-    );
-    const [autofill, setAutofill] = _react.useState.call(void 0, false);
-    const nativeSelectChangedRef = _react.useRef.call(void 0, false);
-    _react.useEffect.call(void 0, () => {
-      const nativeSelectChanged = nativeSelectChangedRef.current;
-      nativeSelectChangedRef.current = false;
-      if (nativeSelectChanged)
-        return;
-      setAutofill(false);
-    }, [value]);
-    const labelId = store.useState((state) => {
-      var _a2;
-      return (_a2 = state.labelElement) == null ? void 0 : _a2.id;
-    });
-    const label = props["aria-label"];
-    const labelledBy = props["aria-labelledby"] || labelId;
-    const items = store.useState((state) => {
+  });
+  props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
+    props,
+    (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _STYNL4LLcjs.SelectScopedContextProvider, { value: store, children: element }),
+    [store]
+  );
+  const [autofill, setAutofill] = _react.useState.call(void 0, false);
+  const nativeSelectChangedRef = _react.useRef.call(void 0, false);
+  _react.useEffect.call(void 0, () => {
+    const nativeSelectChanged = nativeSelectChangedRef.current;
+    nativeSelectChangedRef.current = false;
+    if (nativeSelectChanged)
+      return;
+    setAutofill(false);
+  }, [value]);
+  const labelId = store.useState((state) => {
+    var _a2;
+    return (_a2 = state.labelElement) == null ? void 0 : _a2.id;
+  });
+  const label = props["aria-label"];
+  const labelledBy = props["aria-labelledby"] || labelId;
+  const items = store.useState((state) => {
+    if (!name)
+      return;
+    return state.items;
+  });
+  const values = _react.useMemo.call(void 0, () => {
+    return [...new Set(items == null ? void 0 : items.map((i) => i.value).filter((v) => v != null))];
+  }, [items]);
+  props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
+    props,
+    (element) => {
       if (!name)
-        return;
-      return state.items;
-    });
-    const values = _react.useMemo.call(void 0, () => {
-      return [...new Set(items == null ? void 0 : items.map((i) => i.value).filter((v) => v != null))];
-    }, [items]);
-    props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
-      props,
-      (element) => {
-        if (!name)
-          return element;
-        return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            "select",
-            {
-              style: {
-                border: 0,
-                clip: "rect(0 0 0 0)",
-                height: "1px",
-                margin: "-1px",
-                overflow: "hidden",
-                padding: 0,
-                position: "absolute",
-                whiteSpace: "nowrap",
-                width: "1px"
-              },
-              tabIndex: -1,
-              "aria-hidden": true,
-              "aria-label": label,
-              "aria-labelledby": labelledBy,
-              name,
-              form,
-              required,
-              value,
-              multiple: multiSelectable,
-              onFocus: () => {
-                var _a2;
-                return (_a2 = store == null ? void 0 : store.getState().selectElement) == null ? void 0 : _a2.focus();
-              },
-              onChange: (event) => {
-                nativeSelectChangedRef.current = true;
-                setAutofill(true);
-                store == null ? void 0 : store.setValue(
-                  multiSelectable ? getSelectedValues(event.target) : event.target.value
-                );
-              },
-              children: [
-                _array.toArray.call(void 0, value).map((value2) => {
-                  if (value2 == null)
-                    return null;
-                  if (values.includes(value2))
-                    return null;
-                  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "option", { value: value2, children: value2 }, value2);
-                }),
-                values.map((value2) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "option", { value: value2, children: value2 }, value2))
-              ]
-            }
-          ),
-          element
-        ] });
-      },
-      [
-        store,
-        label,
-        labelledBy,
-        name,
-        form,
-        required,
-        value,
-        multiSelectable,
-        values
-      ]
-    );
-    const children = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+        return element;
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          "select",
+          {
+            style: {
+              border: 0,
+              clip: "rect(0 0 0 0)",
+              height: "1px",
+              margin: "-1px",
+              overflow: "hidden",
+              padding: 0,
+              position: "absolute",
+              whiteSpace: "nowrap",
+              width: "1px"
+            },
+            tabIndex: -1,
+            "aria-hidden": true,
+            "aria-label": label,
+            "aria-labelledby": labelledBy,
+            name,
+            form,
+            required,
+            value,
+            multiple: multiSelectable,
+            onFocus: () => {
+              var _a2;
+              return (_a2 = store == null ? void 0 : store.getState().selectElement) == null ? void 0 : _a2.focus();
+            },
+            onChange: (event) => {
+              nativeSelectChangedRef.current = true;
+              setAutofill(true);
+              store == null ? void 0 : store.setValue(
+                multiSelectable ? getSelectedValues(event.target) : event.target.value
+              );
+            },
+            children: [
+              _array.toArray.call(void 0, value).map((value2) => {
+                if (value2 == null)
+                  return null;
+                if (values.includes(value2))
+                  return null;
+                return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "option", { value: value2, children: value2 }, value2);
+              }),
+              values.map((value2) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "option", { value: value2, children: value2 }, value2))
+            ]
+          }
+        ),
+        element
+      ] });
+    },
+    [
+      store,
+      label,
+      labelledBy,
+      name,
+      form,
+      required,
       value,
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _KQN7YDDZcjs.SelectArrow, {})
-    ] });
-    const contentElement = store.useState("contentElement");
-    props = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
-      role: "combobox",
-      "aria-autocomplete": "none",
-      "aria-labelledby": labelId,
-      "aria-haspopup": _dom.getPopupRole.call(void 0, contentElement, "listbox"),
-      "data-autofill": autofill ? "" : void 0,
-      "data-name": name,
-      children
-    }, props), {
-      ref: _EO6LS72Hcjs.useMergeRefs.call(void 0, store.setSelectElement, props.ref),
-      onKeyDown,
-      onMouseDown
-    });
-    props = _LICANQTIcjs.usePopoverDisclosure.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, toggleOnClick }, props));
-    props = _6PUZ4NWRcjs.useCompositeTypeahead.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
-    return props;
-  }
-);
-var Select = _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
+      multiSelectable,
+      values
+    ]
+  );
+  const children = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    value,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _BIK2473Zcjs.SelectArrow, {})
+  ] });
+  const contentElement = store.useState("contentElement");
+  props = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    role: "combobox",
+    "aria-autocomplete": "none",
+    "aria-labelledby": labelId,
+    "aria-haspopup": _dom.getPopupRole.call(void 0, contentElement, "listbox"),
+    "data-autofill": autofill || void 0,
+    "data-name": name,
+    children
+  }, props), {
+    ref: _EO6LS72Hcjs.useMergeRefs.call(void 0, store.setSelectElement, props.ref),
+    onKeyDown,
+    onMouseDown
+  });
+  props = _PR3MIXQDcjs.usePopoverDisclosure.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, toggleOnClick }, props));
+  props = _XSRQB4KOcjs.useCompositeTypeahead.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
+  return props;
+});
+var Select = _Q67LZMDTcjs.forwardRef.call(void 0, function Select2(props) {
   const htmlProps = useSelect(props);
-  return _RNZNGEL4cjs.createElement.call(void 0, "button", htmlProps);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  Select.displayName = "Select";
-}