@qredence/fleet 0.6.1 → 0.6.3

package/dist/web/server/{chunk-NNKJTKOQ.js → chunk-ADYZWC5L.js}

@@ -7,8 +7,15 @@ import {
   useFormContext,
   useLabelableContext,
   useLabelableId,
-  useRegisterFieldControl
-} from "./chunk-5UCAJBAH.js";
+  useRegisterFieldControl,
+  useValueChanged
+} from "./chunk-5RTGRTPD.js";
+import {
+  Check
+} from "./chunk-4QD4PCVP.js";
+import {
+  useControlled
+} from "./chunk-OVJYUWSQ.js";
 import {
   COMPOSITE_KEYS,
   FOCUSABLE_POPUP_PROPS,
@@ -31,7 +38,7 @@ import {
   useFloatingTree,
   useScrollLock,
   useSurface
-} from "./chunk-4WBFCB4O.js";
+} from "./chunk-YDDDSVNB.js";
 import {
   ARROW_DOWN,
   ARROW_LEFT,
@@ -57,25 +64,19 @@ import {
   isTypeableElement,
   jsdom,
   ownerDocument,
-  useStore,
   useTimeout,
   visuallyHidden,
   visuallyHiddenInput,
   webkit
-} from "./chunk-WNCAL4HN.js";
-import {
-  Check
-} from "./chunk-4QD4PCVP.js";
-import {
-  useControlled
-} from "./chunk-S3PQ6HKH.js";
+} from "./chunk-HQ5TEXHT.js";
 import {
   useTransitionStatus,
   useValueAsRef
-} from "./chunk-MNBGB2SP.js";
+} from "./chunk-E5HALE4M.js";
 import {
   EMPTY_ARRAY,
   EMPTY_OBJECT,
+  NOOP,
   addEventListener,
   cancelOpen,
   createChangeEventDetails,
@@ -114,12 +115,12 @@ import {
   useRenderElement,
   useStableCallback,
   windowResize
-} from "./chunk-XIB6XNUX.js";
+} from "./chunk-XJ6TGSUB.js";
 import {
   cn
-} from "./chunk-DJMHPJBP.js";
+} from "./chunk-CHEC7TWB.js";
 
-// web/app/dist/server/assets/useRender-C0Ot31pO.js
+// web/app/dist/server/assets/select-DFrKxOMt.js
 import * as React$1 from "react";
 import { useLayoutEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -796,18 +797,18 @@ var size$2 = function(options) {
       const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
       const shiftData = state.middlewareData.shift;
       const noShift = !shiftData;
-      let availableHeight = overflowAvailableHeight;
-      let availableWidth = overflowAvailableWidth;
-      if (shiftData != null && shiftData.enabled.x) availableWidth = maximumClippingWidth;
-      if (shiftData != null && shiftData.enabled.y) availableHeight = maximumClippingHeight;
+      let availableHeight2 = overflowAvailableHeight;
+      let availableWidth2 = overflowAvailableWidth;
+      if (shiftData != null && shiftData.enabled.x) availableWidth2 = maximumClippingWidth;
+      if (shiftData != null && shiftData.enabled.y) availableHeight2 = maximumClippingHeight;
       if (noShift && !alignment) {
-        if (isYAxis) availableWidth = width - 2 * max(overflow.left, overflow.right);
-        else availableHeight = height - 2 * max(overflow.top, overflow.bottom);
+        if (isYAxis) availableWidth2 = width - 2 * max(overflow.left, overflow.right);
+        else availableHeight2 = height - 2 * max(overflow.top, overflow.bottom);
       }
       await apply({
         ...state,
-        availableWidth,
-        availableHeight
+        availableWidth: availableWidth2,
+        availableHeight: availableHeight2
       });
       const nextDimensions = await platform2.getDimensions(elements.floating);
       if (width !== nextDimensions.width || height !== nextDimensions.height) return { reset: { rects: true } };
@@ -2037,7 +2038,6 @@ function useListNavigation(context, props) {
   ]);
   const floating = React$1.useMemo(() => {
     return {
-      "aria-orientation": orientation === "both" ? void 0 : orientation,
       ...!typeableComboboxReference ? ariaActiveDescendantProp : {},
       onKeyDown(event) {
         if (event.key === "Tab" && event.shiftKey && open && !virtual) {
@@ -2059,7 +2059,6 @@ function useListNavigation(context, props) {
     ariaActiveDescendantProp,
     commonOnKeyDown,
     floatingFocusElementRef,
-    orientation,
     typeableComboboxReference,
     store,
     open,
@@ -2294,10 +2293,14 @@ var baseArrow = (options) => ({
     };
   }
 });
-var arrow = (options, deps) => ({
-  ...baseArrow(options),
-  options: [options, deps]
-});
+var arrow = (options, deps) => {
+  const { name, fn } = baseArrow(options);
+  return {
+    name,
+    fn,
+    options: [options, deps]
+  };
+};
 var hide = {
   name: "hide",
   async fn(state) {
@@ -2311,8 +2314,13 @@ var DEFAULT_SIDES = {
   sideX: "left",
   sideY: "top"
 };
-var AVAILABLE_WIDTH_VAR = "--available-width";
-var AVAILABLE_HEIGHT_VAR = "--available-height";
+var availableWidth = "--available-width";
+var availableHeight = "--available-height";
+var anchorWidth = "--anchor-width";
+var anchorHeight = "--anchor-height";
+var transformOrigin$1 = "--transform-origin";
+var AVAILABLE_WIDTH_VAR = availableWidth;
+var AVAILABLE_HEIGHT_VAR = availableHeight;
 function getLogicalSide(sideParam, renderedSide, isRtl) {
   const isLogicalSideParam = sideParam === "inline-start" || sideParam === "inline-end";
   return {
@@ -2447,47 +2455,37 @@ function useAnchorPositioningWithHook(params, useFloatingHook) {
   else middleware.push(flipMiddleware, shiftMiddleware);
   middleware.push(size({
     ...commonCollisionProps,
-    apply({ elements: { floating }, availableWidth, availableHeight, rects }) {
+    apply({ elements: { floating }, availableWidth: availableWidth2, availableHeight: availableHeight2, rects }) {
       if (!mountedRef.current) return;
       const floatingStyle = floating.style;
-      floatingStyle.setProperty(AVAILABLE_WIDTH_VAR, `${availableWidth}px`);
-      floatingStyle.setProperty(AVAILABLE_HEIGHT_VAR, `${availableHeight}px`);
+      floatingStyle.setProperty(AVAILABLE_WIDTH_VAR, `${availableWidth2}px`);
+      floatingStyle.setProperty(AVAILABLE_HEIGHT_VAR, `${availableHeight2}px`);
       const dpr = getWindow(floating).devicePixelRatio || 1;
       const { x: x2, y: y2, width, height } = rects.reference;
-      const anchorWidth = (Math.round((x2 + width) * dpr) - Math.round(x2 * dpr)) / dpr;
-      const anchorHeight = (Math.round((y2 + height) * dpr) - Math.round(y2 * dpr)) / dpr;
-      floatingStyle.setProperty("--anchor-width", `${anchorWidth}px`);
-      floatingStyle.setProperty("--anchor-height", `${anchorHeight}px`);
+      const anchorWidth$1 = (Math.round((x2 + width) * dpr) - Math.round(x2 * dpr)) / dpr;
+      const anchorHeight$1 = (Math.round((y2 + height) * dpr) - Math.round(y2 * dpr)) / dpr;
+      floatingStyle.setProperty(anchorWidth, `${anchorWidth$1}px`);
+      floatingStyle.setProperty(anchorHeight, `${anchorHeight$1}px`);
     }
   }), arrow((state) => ({
     element: arrowRef.current || ownerDocument(state.elements.floating).createElement("div"),
-    padding: arrowPadding,
+    padding: arrowRef.current ? arrowPadding : 0,
     offsetParent: "floating"
   }), [arrowPadding]), {
     name: "transformOrigin",
     fn(state) {
-      const { elements: elements2, middlewareData: middlewareData2, placement: renderedPlacement2, rects, y: y2 } = state;
-      const currentRenderedSide = getSide(renderedPlacement2);
-      const currentRenderedAxis = getSideAxis(currentRenderedSide);
+      const { elements: { floating }, middlewareData: middlewareData2, placement: renderedPlacement2, platform: platform2, rects, y: y2 } = state;
+      const renderedSide2 = getSide(renderedPlacement2);
+      const renderedAlign2 = getAlignment(renderedPlacement2);
+      const isVertical = getSideAxis(renderedSide2) === "y";
       const arrowEl = arrowRef.current;
-      const arrowX = middlewareData2.arrow?.x || 0;
-      const arrowY = middlewareData2.arrow?.y || 0;
-      const arrowWidth = arrowEl?.clientWidth || 0;
-      const arrowHeight = arrowEl?.clientHeight || 0;
-      const transformX = arrowX + arrowWidth / 2;
-      const transformY = arrowY + arrowHeight / 2;
-      const shiftY = Math.abs(middlewareData2.shift?.y || 0);
-      const halfAnchorHeight = rects.reference.height / 2;
       const sideOffsetValue = typeof sideOffset === "function" ? sideOffset(getOffsetData(state, sideParam, isRtl)) : sideOffset;
-      const isOverlappingAnchor = shiftY > sideOffsetValue;
-      const adjacentTransformOrigin = {
-        top: `${transformX}px calc(100% + ${sideOffsetValue}px)`,
-        bottom: `${transformX}px ${-sideOffsetValue}px`,
-        left: `calc(100% + ${sideOffsetValue}px) ${transformY}px`,
-        right: `${-sideOffsetValue}px ${transformY}px`
-      }[currentRenderedSide];
-      const overlapTransformOrigin = `${transformX}px ${rects.reference.y + halfAnchorHeight - y2}px`;
-      elements2.floating.style.setProperty("--transform-origin", crossAxisShiftEnabled && currentRenderedAxis === "y" && isOverlappingAnchor ? overlapTransformOrigin : adjacentTransformOrigin);
+      let crossOrigin;
+      if (!arrowEl && renderedAlign2 && Math.abs(isVertical ? middlewareData2.shift?.x || 0 : middlewareData2.shift?.y || 0) <= 1) crossOrigin = renderedAlign2 === "start" === (isVertical && platform2.isRTL?.(floating) === true) ? "100%" : "0%";
+      else crossOrigin = `${(isVertical ? middlewareData2.arrow?.x || 0 : middlewareData2.arrow?.y || 0) + (isVertical ? arrowEl?.clientWidth || 0 : arrowEl?.clientHeight || 0) / 2}px`;
+      let sideOrigin = renderedSide2 === "top" || renderedSide2 === "left" ? `calc(100% + ${sideOffsetValue}px)` : `${-sideOffsetValue}px`;
+      if (crossAxisShiftEnabled && isVertical && Math.abs(middlewareData2.shift?.y || 0) > sideOffsetValue) sideOrigin = `${rects.reference.y + rects.reference.height / 2 - y2}px`;
+      floating.style.setProperty(transformOrigin$1, isVertical ? `${crossOrigin} ${sideOrigin}` : `${sideOrigin} ${crossOrigin}`);
       return {};
     }
   }, hide, adaptiveOrigin);
@@ -2500,6 +2498,7 @@ function useAnchorPositioningWithHook(params, useFloatingHook) {
     });
   }, [mounted, floatingRootContext]);
   const autoUpdateOptions = React$1.useMemo(() => ({
+    ancestorScroll: !disableAnchorTracking,
     elementResize: !disableAnchorTracking && typeof ResizeObserver !== "undefined",
     layoutShift: !disableAnchorTracking && typeof IntersectionObserver !== "undefined"
   }), [disableAnchorTracking]);
@@ -2676,24 +2675,67 @@ function usePreviousValue(value) {
 function isElementDisabled(element) {
   return element == null || element.hasAttribute("disabled") || element.getAttribute("aria-disabled") === "true";
 }
-var SelectRootContext = /* @__PURE__ */ React$1.createContext(null);
+var SelectRootContext = /* @__PURE__ */ React$1.createContext(void 0);
+var SelectRootPropsContext = /* @__PURE__ */ React$1.createContext(void 0);
+var SelectFloatingContext = /* @__PURE__ */ React$1.createContext(void 0);
 function useSelectRootContext() {
-  const context = React$1.useContext(SelectRootContext);
-  if (context === null) throw new Error(formatErrorMessage(60));
+  const store = React$1.useContext(SelectRootContext);
+  if (store === void 0) throw new Error(formatErrorMessage(60));
+  return store;
+}
+function useSelectRootPropsContext() {
+  const context = React$1.useContext(SelectRootPropsContext);
+  if (context === void 0) throw new Error(formatErrorMessage(101));
   return context;
 }
+function useSelectFloatingContext() {
+  const context = React$1.useContext(SelectFloatingContext);
+  if (context === void 0) throw new Error(formatErrorMessage(61));
+  return context;
+}
+function areArraysEqual(array1, array2, itemComparer = Object.is) {
+  const { length } = array1;
+  if (length !== array2.length) return false;
+  for (let i = 0; i < length; i += 1) if (!itemComparer(array1[i], array2[i])) return false;
+  return true;
+}
 var defaultItemEquality = (itemValue, selectedValue) => Object.is(itemValue, selectedValue);
 function compareItemEquality(itemValue, selectedValue, comparer) {
   if (itemValue == null || selectedValue == null) return Object.is(itemValue, selectedValue);
   return comparer(itemValue, selectedValue);
 }
+function isSelectedValueDirty(currentValue, initialValue, comparer) {
+  if (Array.isArray(currentValue) && Array.isArray(initialValue)) return !areArraysEqual(currentValue, initialValue, (itemValue, initialItemValue) => compareItemEquality(itemValue, initialItemValue, comparer));
+  return currentValue !== initialValue;
+}
+function selectedValueIncludes(selectedValues, itemValue, comparer) {
+  if (!selectedValues) return false;
+  return selectedValues.some((selectedValue) => {
+    if (selectedValue === void 0) return false;
+    return compareItemEquality(itemValue, selectedValue, comparer);
+  });
+}
 function findItemIndex(itemValues, selectedValue, comparer) {
-  if (!itemValues || itemValues.length === 0) return -1;
+  if (!itemValues) return -1;
   return itemValues.findIndex((itemValue) => {
     if (itemValue === void 0) return false;
     return compareItemEquality(itemValue, selectedValue, comparer);
   });
 }
+function createSelectionMatcher(selectedValues, comparer) {
+  if (comparer !== defaultItemEquality) return (itemValue) => selectedValueIncludes(selectedValues, itemValue, comparer);
+  const index2 = new Set(selectedValues);
+  index2.delete(void 0);
+  return (itemValue) => index2.has(itemValue) && (itemValue !== 0 || selectedValues.some((v) => Object.is(itemValue, v)));
+}
+function findSelectionIndex(itemValues, selectedValue, comparer, multiple) {
+  const index2 = multiple && Array.isArray(selectedValue) ? itemValues.findIndex(createSelectionMatcher(selectedValue, comparer)) : findItemIndex(itemValues, selectedValue, comparer);
+  return index2 === -1 ? null : index2;
+}
+function resolveSelectedIndex(index2, itemValue, registry, selectedValues, comparer, currentIndex) {
+  if (selectedValueIncludes(selectedValues, itemValue, comparer)) return currentIndex != null && index2 > currentIndex && selectedValueIncludes(selectedValues, registry[currentIndex], comparer) ? currentIndex : index2;
+  return index2 === currentIndex ? findSelectionIndex(registry, selectedValues, comparer, true) : currentIndex;
+}
 function removeItem(selectedValues, itemValue, comparer) {
   return selectedValues.filter((selectedValue) => !compareItemEquality(itemValue, selectedValue, comparer));
 }
@@ -2706,8 +2748,14 @@ function serializeValue(value) {
     return String(value);
   }
 }
+function isGroup(item) {
+  return typeof item === "object" && item != null && Array.isArray(item.items);
+}
 function isGroupedItems(items) {
-  return items != null && items.length > 0 && typeof items[0] === "object" && items[0] != null && "items" in items[0];
+  return isGroup(items?.[0]);
+}
+function flattenLeafItems(items) {
+  return isGroupedItems(items) ? items.flatMap((group) => group.items) : items;
 }
 function hasNullItemLabel(items) {
   if (!Array.isArray(items)) return items != null && "null" in items;
@@ -2738,10 +2786,9 @@ function resolveSelectedLabel(value, items, itemToStringLabel) {
   }
   if (itemToStringLabel && value != null) return itemToStringLabel(value);
   if (value && typeof value === "object" && "label" in value && value.label != null) return value.label;
-  if (items && !Array.isArray(items)) return items[value] ?? fallback();
+  if (items && !Array.isArray(items)) return (Object.hasOwn(items, value) ? items[value] : void 0) ?? fallback();
   if (Array.isArray(items)) {
-    const arrayItems = items;
-    const flatItems = isGroupedItems(arrayItems) ? arrayItems.flatMap((group) => group.items) : arrayItems;
+    const flatItems = flattenLeafItems(items);
     if (value == null || typeof value !== "object") {
       const match = flatItems.find((item) => item.value === value);
       if (match && match.label != null) return match.label;
@@ -2805,17 +2852,6 @@ var selectors = {
   scrollDownArrowVisible: (state) => state.scrollDownArrowVisible,
   hasScrollArrows: (state) => state.hasScrollArrows
 };
-function areArraysEqual(array1, array2, itemComparer = (a, b) => a === b) {
-  return array1.length === array2.length && array1.every((value, index2) => itemComparer(value, array2[index2]));
-}
-function useValueChanged(value, onChange) {
-  const valueRef = React$1.useRef(value);
-  const onChangeCallback = useStableCallback(onChange);
-  useIsoLayoutEffect(() => {
-    if (valueRef.current !== value) onChangeCallback(valueRef.current);
-    valueRef.current = value;
-  }, [value, onChangeCallback]);
-}
 function useEnhancedClickHandler(handler) {
   const lastClickInteractionTypeRef = React$1.useRef("");
   const handlePointerDown = React$1.useCallback((event) => {
@@ -2906,6 +2942,7 @@ function SelectRoot(props) {
     dragY: 0
   });
   const alignItemWithTriggerActiveRef = React$1.useRef(false);
+  const initialValueRef = React$1.useRef(value);
   const { mounted, setMounted, transitionStatus } = useTransitionStatus(open);
   const { openMethod, triggerProps: interactionTypeProps } = useOpenInteractionType(open);
   const store = useRefWithInit(() => new ReactStore({
@@ -2925,8 +2962,8 @@ function SelectRoot(props) {
     openMethod: null,
     activeIndex: null,
     selectedIndex: null,
-    popupProps: {},
-    triggerProps: {},
+    popupProps: EMPTY_OBJECT,
+    triggerProps: EMPTY_OBJECT,
     triggerElement: null,
     positionerElement: null,
     listElement: null,
@@ -2934,11 +2971,29 @@ function SelectRoot(props) {
     scrollUpArrowVisible: false,
     scrollDownArrowVisible: false,
     hasScrollArrows: false
-  })).current;
-  const activeIndex = useStore(store, selectors.activeIndex);
-  const selectedIndex = useStore(store, selectors.selectedIndex);
-  const triggerElement = useStore(store, selectors.triggerElement);
-  const positionerElement = useStore(store, selectors.positionerElement);
+  }, {
+    setValue: NOOP,
+    setOpen: NOOP,
+    handleScrollArrowVisibility: NOOP,
+    onOpenChangeComplete: NOOP,
+    listRef,
+    popupRef,
+    scrollHandlerRef,
+    scrollArrowsMountedCountRef,
+    valueRef,
+    valuesRef,
+    labelsRef,
+    typingRef,
+    selectionRef,
+    firstItemTextRef,
+    selectedItemTextRef,
+    alignItemWithTriggerActiveRef,
+    initialValueRef
+  }, selectors)).current;
+  const activeIndex = store.useState("activeIndex");
+  const selectedIndex = store.useState("selectedIndex");
+  const triggerElement = store.useState("triggerElement");
+  const positionerElement = store.useState("positionerElement");
   const previousOpenMethod = usePreviousValue(openMethod);
   const renderedOpenMethod = openMethod ?? previousOpenMethod;
   const serializedValue = React$1.useMemo(() => {
@@ -2960,21 +3015,12 @@ function SelectRoot(props) {
   const controlRef = useValueAsRef(triggerElement);
   const getStringifiedValueForForm = useStableCallback(() => fieldStringValue);
   useRegisterFieldControl(controlRef, generatedId, value, getStringifiedValueForForm, !disabled, nameProp);
-  const initialValueRef = React$1.useRef(value);
   const hasSelectedValue = multiple ? Array.isArray(value) && value.length > 0 : value != null && serializedValue !== "";
   useIsoLayoutEffect(() => {
     setFilled(hasSelectedValue);
   }, [hasSelectedValue, setFilled]);
   useIsoLayoutEffect(function syncSelectedIndex() {
-    let target = value;
-    let empty = false;
-    if (multiple) {
-      const currentValue = Array.isArray(value) ? value : [];
-      empty = currentValue.length === 0;
-      target = currentValue[currentValue.length - 1];
-    }
-    const index2 = empty ? -1 : findItemIndex(valuesRef.current, target, isItemEqualToValue);
-    const nextIndex = index2 === -1 ? null : index2;
+    const nextIndex = findSelectionIndex(valuesRef.current, value, isItemEqualToValue, multiple);
     if (nextIndex === null) selectedItemTextRef.current = null;
     if (open) return;
     store.set("selectedIndex", nextIndex);
@@ -2985,14 +3031,9 @@ function SelectRoot(props) {
     isItemEqualToValue,
     store
   ]);
-  function isSelectedValueDirty(currentValue) {
-    const initialValue = validityData.initialValue;
-    if (Array.isArray(currentValue) && Array.isArray(initialValue)) return !areArraysEqual(currentValue, initialValue, (itemValue, initialItemValue) => compareItemEquality(itemValue, initialItemValue, isItemEqualToValue));
-    return currentValue !== initialValue;
-  }
   useValueChanged(value, () => {
     clearErrors(name);
-    setDirty(isSelectedValueDirty(value));
+    setDirty(isSelectedValueDirty(value, validityData.initialValue, isItemEqualToValue));
     validation.change(value);
   });
   const setOpen = useStableCallback((nextOpen, eventDetails) => {
@@ -3046,12 +3087,12 @@ function SelectRoot(props) {
     }
   });
   const click = useClick(floatingContext, {
-    enabled: !readOnly && !disabled,
+    enabled: !disabled,
     event: "mousedown"
   });
   const dismiss = useDismiss(floatingContext);
   const listNavigation2 = useListNavigation(floatingContext, {
-    enabled: !readOnly && !disabled,
+    enabled: !disabled,
     listRef,
     activeIndex,
     selectedIndex,
@@ -3063,7 +3104,7 @@ function SelectRoot(props) {
     focusItemOnHover: highlightItemOnHover
   });
   const typeahead = useTypeahead(floatingContext, {
-    enabled: !readOnly && !disabled && (open || !multiple),
+    enabled: !disabled && (open || !readOnly && !multiple),
     listRef: labelsRef,
     activeIndex,
     selectedIndex,
@@ -3089,6 +3130,10 @@ function SelectRoot(props) {
     dismiss.floating
   ]);
   const itemProps = listNavigation2.item ?? EMPTY_OBJECT;
+  store.useContextCallback("setValue", setValue);
+  store.useContextCallback("setOpen", setOpen);
+  store.useContextCallback("handleScrollArrowVisibility", handleScrollArrowVisibility);
+  store.useContextCallback("onOpenChangeComplete", onOpenChangeComplete);
   useOnFirstRender(() => {
     store.update({
       popupProps,
@@ -3111,47 +3156,20 @@ function SelectRoot(props) {
     isItemEqualToValue,
     openMethod: renderedOpenMethod
   });
-  const contextValue = React$1.useMemo(() => ({
-    store,
-    floatingContext,
-    required,
+  const rootPropsContextValue = React$1.useMemo(() => ({
     disabled,
     readOnly,
+    required,
     multiple,
     highlightItemOnHover,
-    setValue,
-    setOpen,
-    listRef,
-    popupRef,
-    scrollHandlerRef,
-    handleScrollArrowVisibility,
-    scrollArrowsMountedCountRef,
-    itemProps,
-    valueRef,
-    valuesRef,
-    labelsRef,
-    typingRef,
-    selectionRef,
-    firstItemTextRef,
-    selectedItemTextRef,
-    validation,
-    onOpenChangeComplete,
-    alignItemWithTriggerActiveRef,
-    initialValueRef
+    itemProps
   }), [
-    store,
-    floatingContext,
-    required,
     disabled,
     readOnly,
+    required,
     multiple,
     highlightItemOnHover,
-    setValue,
-    setOpen,
-    itemProps,
-    validation,
-    onOpenChangeComplete,
-    handleScrollArrowVisibility
+    itemProps
   ]);
   const ref = useMergedRefs(inputRef, validation.inputRef);
   const hiddenInputName = multiple ? void 0 : name;
@@ -3176,9 +3194,15 @@ function SelectRoot(props) {
     disabled
   ]);
   return /* @__PURE__ */ jsxs(SelectRootContext.Provider, {
-    value: contextValue,
+    value: store,
     children: [
-      children,
+      /* @__PURE__ */ jsx(SelectRootPropsContext.Provider, {
+        value: rootPropsContextValue,
+        children: /* @__PURE__ */ jsx(SelectFloatingContext.Provider, {
+          value: floatingContext,
+          children
+        })
+      }),
       /* @__PURE__ */ jsx("input", {
         ...validation.getValidationProps(disabled, {
           onFocus() {
@@ -3251,33 +3275,35 @@ function getPseudoElementBounds(element) {
     bottom: elementRect.bottom + heightDiff / 2
   };
 }
+var popupSide = "data-popup-side";
 var SELECTED_DELAY = 400;
 var stateAttributesMapping$2 = {
   ...pressableTriggerOpenStateMapping,
   ...fieldValidityMapping,
-  popupSide: (side) => side ? { "data-popup-side": side } : null,
+  popupSide: (side) => side ? { [popupSide]: side } : null,
   value: () => null
 };
 var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(componentProps, forwardedRef) {
   const { render, className, id: idProp, disabled: disabledProp = false, nativeButton = true, style, ...elementProps } = componentProps;
-  const { setTouched, setFocused, validationMode, state: fieldState, disabled: fieldDisabled } = useFieldRootContext();
+  const { setTouched, setFocused, validationMode, validation, state: fieldState, disabled: fieldDisabled } = useFieldRootContext();
   const { labelId: fieldLabelId } = useLabelableContext();
-  const { store, setOpen, selectionRef, validation, readOnly, required, alignItemWithTriggerActiveRef, disabled: selectDisabled } = useSelectRootContext();
+  const store = useSelectRootContext();
+  const { readOnly, required, disabled: selectDisabled } = useSelectRootPropsContext();
   const disabled = fieldDisabled || selectDisabled || disabledProp;
-  const open = useStore(store, selectors.open);
-  const mounted = useStore(store, selectors.mounted);
-  const value = useStore(store, selectors.value);
-  const triggerProps = useStore(store, selectors.triggerProps);
-  const positionerElement = useStore(store, selectors.positionerElement);
-  const listElement = useStore(store, selectors.listElement);
-  const popupSideValue = useStore(store, selectors.popupSide);
-  const rootId = useStore(store, selectors.id);
-  const selectLabelId = useStore(store, selectors.labelId);
-  const hasSelectedValue = useStore(store, selectors.hasSelectedValue);
-  const popupSide = mounted && positionerElement ? popupSideValue : null;
+  const open = store.useState("open");
+  const mounted = store.useState("mounted");
+  const value = store.useState("value");
+  const triggerProps = store.useState("triggerProps");
+  const positionerElement = store.useState("positionerElement");
+  const listElement = store.useState("listElement");
+  const popupSideValue = store.useState("popupSide");
+  const rootId = store.useState("id");
+  const selectLabelId = store.useState("labelId");
+  const hasSelectedValue = store.useState("hasSelectedValue");
+  const popupSide2 = mounted && positionerElement ? popupSideValue : null;
   const id = idProp ?? rootId;
   const ariaLabelledBy = resolveAriaLabelledBy(fieldLabelId, selectLabelId);
-  useLabelableId({ id });
+  useLabelableId({ id: idProp });
   const positionerRef = useValueAsRef(positionerElement);
   const triggerRef = React$1.useRef(null);
   const { getButtonProps, buttonRef } = useButton({
@@ -3291,14 +3317,14 @@ var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(c
   React$1.useEffect(() => {
     if (open) {
       selectedDelayTimeout.start(SELECTED_DELAY, () => {
-        selectionRef.current.allowUnselectedMouseUp = true;
-        selectionRef.current.allowSelectedMouseUp = true;
+        store.context.selectionRef.current.allowUnselectedMouseUp = true;
+        store.context.selectionRef.current.allowSelectedMouseUp = true;
       });
       return () => {
         selectedDelayTimeout.clear();
       };
     }
-    selectionRef.current = {
+    store.context.selectionRef.current = {
       allowSelectedMouseUp: false,
       allowUnselectedMouseUp: false,
       dragY: 0
@@ -3306,7 +3332,7 @@ var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(c
     timeoutMouseDown.clear();
   }, [
     open,
-    selectionRef,
+    store,
     timeoutMouseDown,
     selectedDelayTimeout
   ]);
@@ -3322,7 +3348,7 @@ var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(c
     tabIndex: disabled ? -1 : 0,
     onFocus(event) {
       setFocused(true);
-      if (open && alignItemWithTriggerActiveRef.current) setOpen(false, createChangeEventDetails(none, event.nativeEvent));
+      if (open && store.context.alignItemWithTriggerActiveRef.current) store.context.setOpen(false, createChangeEventDetails(none, event.nativeEvent));
       timeoutFocus.start(0, () => {
         store.set("forceMount", true);
       });
@@ -3341,7 +3367,7 @@ var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(c
         const mouseUpTarget = mouseEvent.target;
         if (contains(triggerRef.current, mouseUpTarget) || contains(positionerRef.current, mouseUpTarget)) return;
         if (isMouseWithinBounds(mouseEvent, triggerRef.current)) return;
-        setOpen(false, createChangeEventDetails(cancelOpen, mouseEvent));
+        store.context.setOpen(false, createChangeEventDetails(cancelOpen, mouseEvent));
       }
       timeoutMouseDown.start(0, () => {
         doc.addEventListener("mouseup", handleMouseUp, { once: true });
@@ -3356,7 +3382,7 @@ var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(c
     disabled,
     value,
     readOnly,
-    popupSide,
+    popupSide: popupSide2,
     placeholder: !hasSelectedValue
   };
   return useRenderElement("button", componentProps, {
@@ -3374,13 +3400,13 @@ var SelectTrigger = /* @__PURE__ */ React$1.forwardRef(function SelectTrigger2(c
 var stateAttributesMapping$1 = { value: () => null };
 var SelectValue = /* @__PURE__ */ React$1.forwardRef(function SelectValue2(componentProps, forwardedRef) {
   const { className, render, children: childrenProp, placeholder, style, ...elementProps } = componentProps;
-  const { store, valueRef } = useSelectRootContext();
-  const value = useStore(store, selectors.value);
-  const items = useStore(store, selectors.items);
-  const itemToStringLabel = useStore(store, selectors.itemToStringLabel);
-  const hasSelectedValue = useStore(store, selectors.hasSelectedValue);
+  const store = useSelectRootContext();
+  const value = store.useState("value");
+  const items = store.useState("items");
+  const itemToStringLabel = store.useState("itemToStringLabel");
+  const hasSelectedValue = store.useState("hasSelectedValue");
   const shouldCheckNullItemLabel = !hasSelectedValue && placeholder != null && childrenProp == null;
-  const hasNullLabel = useStore(store, selectors.hasNullItemLabel, shouldCheckNullItemLabel);
+  const hasNullLabel = store.useState("hasNullItemLabel", shouldCheckNullItemLabel);
   const state = {
     value,
     placeholder: !hasSelectedValue
@@ -3393,15 +3419,14 @@ var SelectValue = /* @__PURE__ */ React$1.forwardRef(function SelectValue2(compo
   else children = resolveSelectedLabel(value, items, itemToStringLabel);
   return useRenderElement("span", componentProps, {
     state,
-    ref: [forwardedRef, valueRef],
+    ref: [forwardedRef, store.context.valueRef],
     props: [{ children }, elementProps],
     stateAttributesMapping: stateAttributesMapping$1
   });
 });
 var SelectIcon = /* @__PURE__ */ React$1.forwardRef(function SelectIcon2(componentProps, forwardedRef) {
   const { render, className, style, ...elementProps } = componentProps;
-  const { store } = useSelectRootContext();
-  const state = { open: useStore(store, selectors.open) };
+  const state = { open: useSelectRootContext().useState("open") };
   return useRenderElement("span", componentProps, {
     state,
     ref: forwardedRef,
@@ -3413,9 +3438,9 @@ var SelectIcon = /* @__PURE__ */ React$1.forwardRef(function SelectIcon2(compone
   });
 });
 var SelectPortal = /* @__PURE__ */ React$1.forwardRef(function SelectPortal2(portalProps, forwardedRef) {
-  const { store } = useSelectRootContext();
-  const mounted = useStore(store, selectors.mounted);
-  const forceMount = useStore(store, selectors.forceMount);
+  const store = useSelectRootContext();
+  const mounted = store.useState("mounted");
+  const forceMount = store.useState("forceMount");
   if (!(mounted || forceMount)) return null;
   return /* @__PURE__ */ jsx(FloatingPortal, {
     ref: forwardedRef,
@@ -3442,7 +3467,7 @@ function CompositeList(props) {
   const map = useRefWithInit(createMap).current;
   const nextIndexRef = React$1.useRef(0);
   const isDirtyRef = React$1.useRef(true);
-  const itemsRef = React$1.useRef([]);
+  const itemsRef = React$1.useRef(null);
   const mutationObserverRef = React$1.useRef(null);
   const scheduleMapUpdate = useStableCallback(() => {
     if (isDirtyRef.current) return;
@@ -3500,14 +3525,20 @@ function CompositeList(props) {
   const flush = useStableCallback(() => {
     const [items, automaticNodes] = getCompositeListSnapshot(map);
     const nextMap = syncRefs(items);
+    const previousItems = itemsRef.current;
+    const changed = !previousItems || previousItems.length !== items.length || items.some((item, index2) => {
+      const previousItem = previousItems[index2];
+      return item.index !== previousItem.index || item.element !== previousItem.element || item.registration.index !== previousItem.registration.index || item.registration.metadata !== previousItem.registration.metadata;
+    });
     observe(automaticNodes);
     itemsRef.current = items;
     isDirtyRef.current = false;
+    if (!changed) return;
     listeners.forEach((listener) => listener(nextMap));
     onMapChange(nextMap);
   });
   useIsoLayoutEffect(() => {
-    if (!isDirtyRef.current) syncRefs(itemsRef.current);
+    if (!isDirtyRef.current && itemsRef.current) syncRefs(itemsRef.current);
     return () => {
       elementsRef.current = [];
       if (labelsRef) labelsRef.current = [];
@@ -3631,22 +3662,23 @@ function useAnchoredPopupScrollLock(enabled, touchOpen, positionerElement, refer
 var FIXED = { position: "fixed" };
 var SelectPositioner = /* @__PURE__ */ React$1.forwardRef(function SelectPositioner2(componentProps, forwardedRef) {
   const { anchor, className, render, positionMethod, side, align, sideOffset, alignOffset, collisionBoundary = "clipping-ancestors", collisionPadding, arrowPadding, sticky, disableAnchorTracking, alignItemWithTrigger = true, collisionAvoidance = DROPDOWN_COLLISION_AVOIDANCE, style, ...elementProps } = componentProps;
-  const { store, listRef, labelsRef, alignItemWithTriggerActiveRef, selectedItemTextRef, valuesRef, initialValueRef, popupRef, setValue, floatingContext: floatingRootContext } = useSelectRootContext();
-  const open = useStore(store, selectors.open);
-  const mounted = useStore(store, selectors.mounted);
-  const modal = useStore(store, selectors.modal);
-  const value = useStore(store, selectors.value);
-  const openMethod = useStore(store, selectors.openMethod);
-  const positionerElement = useStore(store, selectors.positionerElement);
-  const triggerElement = useStore(store, selectors.triggerElement);
-  const isItemEqualToValue = useStore(store, selectors.isItemEqualToValue);
-  const transitionStatus = useStore(store, selectors.transitionStatus);
+  const store = useSelectRootContext();
+  const floatingRootContext = useSelectFloatingContext();
+  const open = store.useState("open");
+  const mounted = store.useState("mounted");
+  const modal = store.useState("modal");
+  const value = store.useState("value");
+  const openMethod = store.useState("openMethod");
+  const positionerElement = store.useState("positionerElement");
+  const triggerElement = store.useState("triggerElement");
+  const isItemEqualToValue = store.useState("isItemEqualToValue");
+  const transitionStatus = store.useState("transitionStatus");
   const scrollUpArrowRef = React$1.useRef(null);
   const scrollDownArrowRef = React$1.useRef(null);
   const [controlledAlignItemWithTrigger, setControlledAlignItemWithTrigger] = React$1.useState(alignItemWithTrigger);
   const alignItemWithTriggerActive = mounted && controlledAlignItemWithTrigger && openMethod !== "touch";
   if (!mounted && controlledAlignItemWithTrigger !== alignItemWithTrigger) setControlledAlignItemWithTrigger(alignItemWithTrigger);
-  React$1.useImperativeHandle(alignItemWithTriggerActiveRef, () => alignItemWithTriggerActive);
+  React$1.useImperativeHandle(store.context.alignItemWithTriggerActiveRef, () => alignItemWithTriggerActive);
   useAnchoredPopupScrollLock((alignItemWithTriggerActive || modal) && open, openMethod === "touch", positionerElement, triggerElement);
   const positioning = useAnchorPositioning({
     anchor,
@@ -3686,29 +3718,28 @@ var SelectPositioner = /* @__PURE__ */ React$1.forwardRef(function SelectPositio
   });
   const prevMapSizeRef = React$1.useRef(0);
   const onMapChange = useStableCallback((map) => {
-    if (valuesRef.current.length === 0) return;
+    if (store.context.valuesRef.current.length === 0) return;
     const prevSize = prevMapSizeRef.current;
     prevMapSizeRef.current = map.size;
-    if (map.size === prevSize) return;
     const eventDetails = createChangeEventDetails(none);
     if (prevSize !== 0 && !store.state.multiple && value !== null) {
-      if (findItemIndex(valuesRef.current, value, isItemEqualToValue) === -1) {
-        const initialSelectedValue = initialValueRef.current;
-        const nextValue = initialSelectedValue != null && findItemIndex(valuesRef.current, initialSelectedValue, isItemEqualToValue) !== -1 ? initialSelectedValue : null;
-        setValue(nextValue, eventDetails);
+      if (findItemIndex(store.context.valuesRef.current, value, isItemEqualToValue) === -1) {
+        const initialSelectedValue = store.context.initialValueRef.current;
+        const nextValue = initialSelectedValue != null && findItemIndex(store.context.valuesRef.current, initialSelectedValue, isItemEqualToValue) !== -1 ? initialSelectedValue : null;
+        store.context.setValue(nextValue, eventDetails);
         if (nextValue === null) {
           store.set("selectedIndex", null);
-          selectedItemTextRef.current = null;
+          store.context.selectedItemTextRef.current = null;
         }
       }
     }
     if (prevSize !== 0 && store.state.multiple && Array.isArray(value)) {
-      const nextValue = value.filter((selectedItemValue) => findItemIndex(valuesRef.current, selectedItemValue, isItemEqualToValue) !== -1);
+      const nextValue = value.filter((selectedItemValue) => findItemIndex(store.context.valuesRef.current, selectedItemValue, isItemEqualToValue) !== -1);
       if (nextValue.length !== value.length) {
-        setValue(nextValue, eventDetails);
+        store.context.setValue(nextValue, eventDetails);
         if (nextValue.length === 0) {
           store.set("selectedIndex", null);
-          selectedItemTextRef.current = null;
+          store.context.selectedItemTextRef.current = null;
         }
       }
     }
@@ -3719,7 +3750,7 @@ var SelectPositioner = /* @__PURE__ */ React$1.forwardRef(function SelectPositio
       });
       const stylesToClear = { height: "" };
       clearStyles(positionerElement, stylesToClear);
-      clearStyles(popupRef.current, stylesToClear);
+      clearStyles(store.context.popupRef.current, stylesToClear);
     }
   });
   const contextValue = React$1.useMemo(() => ({
@@ -3736,8 +3767,8 @@ var SelectPositioner = /* @__PURE__ */ React$1.forwardRef(function SelectPositio
     setControlledAlignItemWithTrigger
   ]);
   return /* @__PURE__ */ jsx(CompositeList, {
-    elementsRef: listRef,
-    labelsRef,
+    elementsRef: store.context.listRef,
+    labelsRef: store.context.labelsRef,
     onMapChange,
     children: /* @__PURE__ */ jsxs(SelectPositionerContext.Provider, {
       value: contextValue,
@@ -3771,36 +3802,39 @@ var DEFAULT_CSP_CONTEXT_VALUE = { disableStyleElements: false };
 function useCSPContext() {
   return React$1.useContext(CSPContext) ?? DEFAULT_CSP_CONTEXT_VALUE;
 }
+var transformOrigin = "--transform-origin";
 var stateAttributesMapping = {
   ...popupStateMapping,
   ...transitionStatusMapping
 };
 var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(componentProps, forwardedRef) {
   const { render, className, style, finalFocus, ...elementProps } = componentProps;
-  const { store, popupRef, onOpenChangeComplete, setOpen, valueRef, firstItemTextRef, selectedItemTextRef, multiple, handleScrollArrowVisibility, scrollHandlerRef, listRef, highlightItemOnHover, floatingContext: floatingRootContext } = useSelectRootContext();
+  const store = useSelectRootContext();
+  const { multiple, readOnly, highlightItemOnHover } = useSelectRootPropsContext();
+  const floatingRootContext = useSelectFloatingContext();
   const { side, align, alignItemWithTriggerActive, isPositioned, setControlledAlignItemWithTrigger } = useSelectPositionerContext();
   const insideToolbar = useToolbarRootContext(true) != null;
   const direction = useDirection();
   const { nonce, disableStyleElements } = useCSPContext();
-  const id = useStore(store, selectors.id);
-  const open = useStore(store, selectors.open);
-  const openMethod = useStore(store, selectors.openMethod);
-  const mounted = useStore(store, selectors.mounted);
-  const popupProps = useStore(store, selectors.popupProps);
-  const transitionStatus = useStore(store, selectors.transitionStatus);
-  const triggerElement = useStore(store, selectors.triggerElement);
-  const positionerElement = useStore(store, selectors.positionerElement);
-  const listElement = useStore(store, selectors.listElement);
+  const id = store.useState("id");
+  const open = store.useState("open");
+  const openMethod = store.useState("openMethod");
+  const mounted = store.useState("mounted");
+  const popupProps = store.useState("popupProps");
+  const transitionStatus = store.useState("transitionStatus");
+  const triggerElement = store.useState("triggerElement");
+  const positionerElement = store.useState("positionerElement");
+  const listElement = store.useState("listElement");
   const reachedMaxHeightRef = React$1.useRef(false);
   const initialPlacedRef = React$1.useRef(false);
   const originalPositionerStylesRef = React$1.useRef({});
   const scrollArrowFrame = useAnimationFrame();
   const handleScroll = useStableCallback((scroller) => {
-    if (!positionerElement || !popupRef.current || !initialPlacedRef.current) return;
+    if (!positionerElement || !store.context.popupRef.current || !initialPlacedRef.current) return;
     const isTopPositioned = positionerElement.style.top === "0px";
     const isBottomPositioned = positionerElement.style.bottom === "0px";
     if (reachedMaxHeightRef.current || !alignItemWithTriggerActive || !isTopPositioned && !isBottomPositioned) {
-      handleScrollArrowVisibility(scroller);
+      store.context.handleScrollArrowVisibility(scroller);
       return;
     }
     const scale = getScale(positionerElement);
@@ -3810,7 +3844,7 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
     const positionerStyles = win.getComputedStyle(positionerElement);
     const marginTop = parseFloat(positionerStyles.marginTop);
     const marginBottom = parseFloat(positionerStyles.marginBottom);
-    const maxPopupHeight = getMaxPopupHeight(win.getComputedStyle(popupRef.current));
+    const maxPopupHeight = getMaxPopupHeight(win.getComputedStyle(store.context.popupRef.current));
     const maxAvailableHeight = Math.min(doc.documentElement.clientHeight - marginTop - marginBottom, maxPopupHeight);
     const scrollTop = scroller.scrollTop;
     const maxScrollTop = getMaxScrollTop(scroller);
@@ -3825,7 +3859,7 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
       if (heightDelta > 0) setHeight(currentHeight + heightDelta);
       scroller.scrollTop = isTopPositioned ? maxScrollTop : 0;
       if (maxAvailableHeight - (currentHeight + heightDelta) <= 1) reachedMaxHeightRef.current = true;
-      handleScrollArrowVisibility(scroller);
+      store.context.handleScrollArrowVisibility(scroller);
       return;
     }
     if (maxAvailableHeight - nextHeight > 1) nextScrollTop = isTopPositioned ? Infinity : 0;
@@ -3837,14 +3871,14 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
       if (Math.abs(scroller.scrollTop - target) > 1) scroller.scrollTop = target;
     }
     if (nextPositionerHeight >= maxAvailableHeight - 1) reachedMaxHeightRef.current = true;
-    handleScrollArrowVisibility(scroller);
+    store.context.handleScrollArrowVisibility(scroller);
   });
-  React$1.useImperativeHandle(scrollHandlerRef, () => handleScroll, [handleScroll]);
+  React$1.useImperativeHandle(store.context.scrollHandlerRef, () => handleScroll, [handleScroll]);
   useOpenChangeComplete({
     open,
-    ref: popupRef,
+    ref: store.context.popupRef,
     onComplete() {
-      if (open) onOpenChangeComplete?.(true);
+      if (open) store.context.onOpenChangeComplete(true);
     }
   });
   const state = {
@@ -3854,7 +3888,7 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
     align
   };
   useIsoLayoutEffect(() => {
-    if (!positionerElement || !popupRef.current || Object.keys(originalPositionerStylesRef.current).length) return;
+    if (!positionerElement || !store.context.popupRef.current || Object.keys(originalPositionerStylesRef.current).length) return;
     originalPositionerStylesRef.current = {
       top: positionerElement.style.top || "0",
       left: positionerElement.style.left || "0",
@@ -3866,7 +3900,7 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
       marginTop: positionerElement.style.marginTop,
       marginBottom: positionerElement.style.marginBottom
     };
-  }, [popupRef, positionerElement]);
+  }, [store, positionerElement]);
   useIsoLayoutEffect(() => {
     if (open || alignItemWithTriggerActive) return;
     initialPlacedRef.current = false;
@@ -3875,23 +3909,22 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
   }, [
     open,
     alignItemWithTriggerActive,
-    positionerElement,
-    popupRef
+    positionerElement
   ]);
   useIsoLayoutEffect(() => {
-    const popupElement = popupRef.current;
+    const popupElement = store.context.popupRef.current;
     if (!open || !triggerElement || !positionerElement || !popupElement || alignItemWithTriggerActive && !isPositioned || store.state.transitionStatus === "ending") return;
     initialPlacedRef.current = true;
-    popupElement.style.removeProperty("--transform-origin");
+    popupElement.style.removeProperty(transformOrigin);
     if (!alignItemWithTriggerActive) {
-      scrollArrowFrame.request(() => handleScrollArrowVisibility(listElement || popupElement));
+      scrollArrowFrame.request(() => store.context.handleScrollArrowVisibility(listElement || popupElement));
       return;
     }
     const restoreTransformStyles = unsetTransformStyles(popupElement);
     try {
-      let textElement = selectedItemTextRef.current;
-      if (!textElement?.isConnected) textElement = !selectors.hasSelectedValue(store.state) && firstItemTextRef.current?.isConnected ? firstItemTextRef.current : null;
-      const valueElement = valueRef.current;
+      let textElement = store.context.selectedItemTextRef.current;
+      if (!textElement?.isConnected) textElement = !store.select("hasSelectedValue") && store.context.firstItemTextRef.current?.isConnected ? store.context.firstItemTextRef.current : null;
+      const valueElement = store.context.valueRef.current;
       const win = getWindow(positionerElement);
       const positionerStyles = win.getComputedStyle(positionerElement);
       const popupStyles = win.getComputedStyle(popupElement);
@@ -3959,11 +3992,11 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
         const popupHeight = positionerRect.height;
         const textCenterY = textRect.top + textRect.height / 2;
         const clampedY = clamp(popupHeight > 0 ? (textCenterY - popupTop) / popupHeight * 100 : 50, 0, 100);
-        popupElement.style.setProperty("--transform-origin", `50% ${clampedY}%`);
+        popupElement.style.setProperty(transformOrigin, `50% ${clampedY}%`);
       }
       if (initialHeight === viewportHeight || height >= maxPopupHeight) reachedMaxHeightRef.current = true;
-      handleScrollArrowVisibility(scroller);
-      if (highlightItemOnHover && store.state.selectedIndex === null && store.state.activeIndex === null && listRef.current[0] != null) store.set("activeIndex", 0);
+      store.context.handleScrollArrowVisibility(scroller);
+      if (highlightItemOnHover && store.state.selectedIndex === null && store.state.activeIndex === null && store.context.listRef.current[0] != null) store.set("activeIndex", 0);
     } finally {
       restoreTransformStyles();
     }
@@ -3972,16 +4005,10 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
     open,
     positionerElement,
     triggerElement,
-    valueRef,
-    firstItemTextRef,
-    selectedItemTextRef,
-    popupRef,
-    handleScrollArrowVisibility,
     alignItemWithTriggerActive,
     setControlledAlignItemWithTrigger,
     scrollArrowFrame,
     listElement,
-    listRef,
     highlightItemOnHover,
     direction,
     isPositioned
@@ -3990,22 +4017,20 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
     if (!alignItemWithTriggerActive || !positionerElement || !open) return;
     const win = getWindow(positionerElement);
     function handleResize(event) {
-      setOpen(false, createChangeEventDetails(windowResize, event));
+      store.context.setOpen(false, createChangeEventDetails(windowResize, event));
     }
     return addEventListener(win, "resize", handleResize);
   }, [
-    setOpen,
+    store,
     alignItemWithTriggerActive,
     positionerElement,
     open
   ]);
   const defaultProps = {
-    ...listElement ? {
-      role: "presentation",
-      "aria-orientation": void 0
-    } : {
+    ...listElement ? { role: "presentation" } : {
       role: "listbox",
       "aria-multiselectable": multiple || void 0,
+      "aria-readonly": readOnly || void 0,
       id: `${id}-list`
     },
     onKeyDown(event) {
@@ -4019,7 +4044,7 @@ var SelectPopup = /* @__PURE__ */ React$1.forwardRef(function SelectPopup2(compo
     className: !listElement && alignItemWithTriggerActive ? styleDisableScrollbar.className : void 0
   };
   const element = useRenderElement("div", componentProps, {
-    ref: [forwardedRef, popupRef],
+    ref: [forwardedRef, store.context.popupRef],
     state,
     stateAttributesMapping,
     props: [
@@ -4082,16 +4107,18 @@ function unsetTransformStyles(popupElement) {
 }
 var SelectList = /* @__PURE__ */ React$1.forwardRef(function SelectList2(componentProps, forwardedRef) {
   const { render, className, style, ...elementProps } = componentProps;
-  const { store, scrollHandlerRef, multiple } = useSelectRootContext();
+  const store = useSelectRootContext();
+  const { multiple, readOnly } = useSelectRootPropsContext();
   const { alignItemWithTriggerActive } = useSelectPositionerContext();
-  const hasScrollArrows = useStore(store, selectors.hasScrollArrows);
-  const openMethod = useStore(store, selectors.openMethod);
+  const hasScrollArrows = store.useState("hasScrollArrows");
+  const openMethod = store.useState("openMethod");
   const defaultProps = {
-    id: `${useStore(store, selectors.id)}-list`,
+    id: `${store.useState("id")}-list`,
     role: "listbox",
     "aria-multiselectable": multiple || void 0,
+    "aria-readonly": readOnly || void 0,
     onScroll(event) {
-      scrollHandlerRef.current?.(event.currentTarget);
+      store.context.scrollHandlerRef.current?.(event.currentTarget);
     },
     ...alignItemWithTriggerActive && { style: LIST_FUNCTIONAL_STYLES },
     className: hasScrollArrows && openMethod !== "touch" ? styleDisableScrollbar.className : void 0
@@ -4160,17 +4187,18 @@ var SelectItem = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef
     label,
     textRef
   });
-  const { store, itemProps, setOpen, setValue, selectionRef, typingRef, valuesRef, multiple, selectedItemTextRef, disabled: selectDisabled, readOnly } = useSelectRootContext();
+  const store = useSelectRootContext();
+  const { itemProps, multiple, disabled: selectDisabled, readOnly } = useSelectRootPropsContext();
   const disabled = selectDisabled || disabledProp;
-  const highlighted = useStore(store, selectors.isActive, listItem.index);
-  const open = useStore(store, selectors.open);
-  const selected = useStore(store, selectors.isSelected, itemValue);
-  const selectedByFocus = useStore(store, selectors.isSelectedByFocus, listItem.index);
-  const isItemEqualToValue = useStore(store, selectors.isItemEqualToValue);
+  const highlighted = store.useState("isActive", listItem.index);
+  const open = store.useState("open");
+  const selected = store.useState("isSelected", itemValue);
+  const selectedByFocus = store.useState("isSelectedByFocus", listItem.index);
+  const isItemEqualToValue = store.useState("isItemEqualToValue");
   const index2 = listItem.index;
   const itemRef = React$1.useRef(null);
   useIsoLayoutEffect(() => {
-    const values = valuesRef.current;
+    const values = store.context.valuesRef.current;
     values[index2] = itemValue;
     return () => {
       delete values[index2];
@@ -4178,23 +4206,29 @@ var SelectItem = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef
   }, [
     index2,
     itemValue,
-    valuesRef
+    store
   ]);
   useIsoLayoutEffect(() => {
     const selectedValue = store.state.value;
-    let selectedCandidate = selectedValue;
-    if (multiple && Array.isArray(selectedValue)) selectedCandidate = selectedValue.length > 0 ? selectedValue[selectedValue.length - 1] : void 0;
-    if (selectedCandidate !== void 0 && compareItemEquality(itemValue, selectedCandidate, isItemEqualToValue)) {
-      store.set("selectedIndex", index2);
-      if (textRef.current) selectedItemTextRef.current = textRef.current;
+    const currentIndex = store.state.selectedIndex;
+    let nextIndex = currentIndex;
+    let claims;
+    if (multiple && Array.isArray(selectedValue)) {
+      nextIndex = resolveSelectedIndex(index2, itemValue, store.context.valuesRef.current, selectedValue, isItemEqualToValue, currentIndex);
+      claims = nextIndex === index2;
+      if (index2 === currentIndex && !claims) store.context.selectedItemTextRef.current = null;
+    } else {
+      claims = selectedValue !== void 0 && compareItemEquality(itemValue, selectedValue, isItemEqualToValue);
+      if (claims) nextIndex = index2;
     }
+    store.set("selectedIndex", nextIndex);
+    if (claims && textRef.current) store.context.selectedItemTextRef.current = textRef.current;
   }, [
     index2,
     multiple,
     isItemEqualToValue,
     store,
-    itemValue,
-    selectedItemTextRef
+    itemValue
   ]);
   const pointerTypeRef = React$1.useRef("mouse");
   const allowMouseSelectionRef = React$1.useRef(false);
@@ -4215,14 +4249,14 @@ var SelectItem = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef
     if (multiple) {
       const currentValue = Array.isArray(selectedValue) ? selectedValue : [];
       const nextValue = selected ? removeItem(currentValue, itemValue, isItemEqualToValue) : [...currentValue, itemValue];
-      setValue(nextValue, createChangeEventDetails(itemPress, event));
+      store.context.setValue(nextValue, createChangeEventDetails(itemPress, event));
     } else {
-      setValue(itemValue, createChangeEventDetails(itemPress, event));
-      setOpen(false, createChangeEventDetails(itemPress, event));
+      store.context.setValue(itemValue, createChangeEventDetails(itemPress, event));
+      store.context.setOpen(false, createChangeEventDetails(itemPress, event));
     }
   }
   function resetDragMovement() {
-    selectionRef.current.dragY = 0;
+    store.context.selectionRef.current.dragY = 0;
   }
   const defaultProps = {
     role: "option",
@@ -4230,7 +4264,7 @@ var SelectItem = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef
     tabIndex: open && highlighted ? 0 : -1,
     onKeyDown(event) {
       store.set("activeIndex", index2);
-      if (event.key === " " && typingRef.current) event.preventDefault();
+      if (event.key === " " && store.context.typingRef.current) event.preventDefault();
     },
     onClick(event) {
       const isMouseClick = pointerTypeRef.current !== "touch";
@@ -4246,7 +4280,7 @@ var SelectItem = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef
     },
     onPointerMove(event) {
       if (event.pointerType === "mouse" && event.buttons === 1) {
-        const selection = selectionRef.current;
+        const selection = store.context.selectionRef.current;
         selection.dragY += event.movementY;
         if (selection.dragY ** 2 >= 64) selection.allowUnselectedMouseUp = true;
       }
@@ -4260,8 +4294,8 @@ var SelectItem = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef
       resetDragMovement();
       if (disabled || pointerTypeRef.current === "touch") return;
       if (allowMouseSelectionRef.current) return;
-      const disallowSelectedMouseUp = !selectionRef.current.allowSelectedMouseUp && selected;
-      const disallowUnselectedMouseUp = !selectionRef.current.allowUnselectedMouseUp && !selected;
+      const disallowSelectedMouseUp = !store.context.selectionRef.current.allowSelectedMouseUp && selected;
+      const disallowUnselectedMouseUp = !store.context.selectionRef.current.allowUnselectedMouseUp && !selected;
       if (disallowSelectedMouseUp || disallowUnselectedMouseUp) return;
       allowMouseSelectionRef.current = true;
       itemRef.current?.click();
@@ -4325,6 +4359,8 @@ var Inner = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef((com
     stateAttributesMapping: transitionStatusMapping
   });
   useOpenChangeComplete({
+    batch: true,
+    enabled: !selected,
     open: selected,
     ref: indicatorRef,
     onComplete() {
@@ -4335,15 +4371,14 @@ var Inner = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef((com
 }));
 var SelectItemText = /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef(function SelectItemText2(componentProps, forwardedRef) {
   const { index: index2, textRef, selectedByFocus } = useSelectItemContext();
-  const { firstItemTextRef, selectedItemTextRef } = useSelectRootContext();
+  const store = useSelectRootContext();
   const { render, className, style, ...elementProps } = componentProps;
   const localRef = React$1.useCallback((node) => {
     if (!node) return;
-    if (index2 === 0) firstItemTextRef.current = node;
-    if (selectedByFocus) selectedItemTextRef.current = node;
+    if (index2 === 0) store.context.firstItemTextRef.current = node;
+    if (selectedByFocus) store.context.selectedItemTextRef.current = node;
   }, [
-    firstItemTextRef,
-    selectedItemTextRef,
+    store,
     index2,
     selectedByFocus
   ]);
@@ -4415,9 +4450,6 @@ function Select({ className, onValueChange, options, placeholder, triggerId, val
     }) })]
   });
 }
-function useRender(params) {
-  return useRenderElement(params.defaultTagName ?? "div", params, params);
-}
 
 export {
   clamp,
@@ -4436,7 +4468,6 @@ export {
   getDisabledMountTransitionStyles,
   usePositioner,
   isElementDisabled,
-  useValueChanged,
   useOpenMethodTriggerProps,
   normalizeScrollOffset,
   CompositeList,
@@ -4445,6 +4476,5 @@ export {
   useToolbarRootContext,
   useCSPContext,
   useCompositeListItem,
-  Select,
-  useRender
+  Select
 };