@radix-ui/react-select 2.3.3 → 2.3.4-rc.1784059564143

package/dist/index.mjs

@@ -1,4 +1,6 @@
 "use client";
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 
 // src/select.tsx
 import * as React from "react";
@@ -38,7 +40,6 @@ var [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME, [
 var usePopperScope = createPopperScope();
 var [SelectProviderImpl, useSelectContext] = createSelectContext(SELECT_NAME);
 var [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME);
-var PROVIDER_NAME = "SelectProvider";
 function SelectProvider(props) {
   const {
     __scopeSelect,
@@ -80,7 +81,7 @@ function SelectProvider(props) {
   React.useEffect(() => {
     const associatedForm = form ? trigger?.ownerDocument.getElementById(form) : trigger?.form;
     if (associatedForm instanceof HTMLFormElement) {
-      const reset = () => setValue(initialValueRef.current);
+      const reset = /* @__PURE__ */ __name(() => setValue(initialValueRef.current), "reset");
       associatedForm.addEventListener("reset", reset);
       return () => associatedForm.removeEventListener("reset", reset);
     }
@@ -132,8 +133,8 @@ function SelectProvider(props) {
     }
   ) }) }) });
 }
-SelectProvider.displayName = PROVIDER_NAME;
-var Select = (props) => {
+__name(SelectProvider, "SelectProvider");
+var Select = /* @__PURE__ */ __name((props) => {
   const { __scopeSelect, children, ...providerProps } = props;
   return /* @__PURE__ */ jsx(
     SelectProvider,
@@ -151,11 +152,10 @@ var Select = (props) => {
       ] })
     }
   );
-};
-Select.displayName = SELECT_NAME;
+}, "Select");
 var TRIGGER_NAME = "SelectTrigger";
-var SelectTrigger = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectTrigger = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectTrigger2(props, forwardedRef) {
     const { __scopeSelect, disabled = false, ...triggerProps } = props;
     const popperScope = usePopperScope(__scopeSelect);
     const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
@@ -171,7 +171,7 @@ var SelectTrigger = React.forwardRef(
         context.onValueChange(nextItem.value);
       }
     });
-    const handleOpen = (pointerEvent) => {
+    const handleOpen = /* @__PURE__ */ __name((pointerEvent) => {
       if (!isDisabled) {
         context.onOpenChange(true);
         resetTypeahead();
@@ -182,7 +182,7 @@ var SelectTrigger = React.forwardRef(
           y: Math.round(pointerEvent.pageY)
         };
       }
-    };
+    }, "handleOpen");
     return /* @__PURE__ */ jsx(PopperPrimitive.Anchor, { asChild: true, ...popperScope, children: /* @__PURE__ */ jsx(
       Primitive.button,
       {
@@ -228,12 +228,11 @@ var SelectTrigger = React.forwardRef(
         })
       }
     ) });
-  }
+  }, "SelectTrigger")
 );
-SelectTrigger.displayName = TRIGGER_NAME;
 var VALUE_NAME = "SelectValue";
-var SelectValue = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectValue = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectValue2(props, forwardedRef) {
     const { __scopeSelect, className, style, children, placeholder = "", ...valueProps } = props;
     const context = useSelectContext(VALUE_NAME, __scopeSelect);
     const { onValueNodeHasChildrenChange } = context;
@@ -253,29 +252,25 @@ var SelectValue = React.forwardRef(
         children: /* @__PURE__ */ jsx(React.Fragment, { children: showPlaceholder ? placeholder : children }, showPlaceholder ? "placeholder" : "value")
       }
     );
-  }
+  }, "SelectValue")
 );
-SelectValue.displayName = VALUE_NAME;
-var ICON_NAME = "SelectIcon";
-var SelectIcon = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectIcon = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectIcon2(props, forwardedRef) {
     const { __scopeSelect, children, ...iconProps } = props;
     return /* @__PURE__ */ jsx(Primitive.span, { "aria-hidden": true, ...iconProps, ref: forwardedRef, children: children || "\u25BC" });
-  }
+  }, "SelectIcon")
 );
-SelectIcon.displayName = ICON_NAME;
 var PORTAL_NAME = "SelectPortal";
 var [PortalProvider, usePortalContext] = createSelectContext(PORTAL_NAME, {
   forceMount: void 0
 });
-var SelectPortal = (props) => {
+var SelectPortal = /* @__PURE__ */ __name((props) => {
   const { __scopeSelect, forceMount, ...portalProps } = props;
   return /* @__PURE__ */ jsx(PortalProvider, { scope: props.__scopeSelect, forceMount, children: /* @__PURE__ */ jsx(PortalPrimitive, { asChild: true, ...portalProps }) });
-};
-SelectPortal.displayName = PORTAL_NAME;
+}, "SelectPortal");
 var CONTENT_NAME = "SelectContent";
-var SelectContent = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectContent = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectContent2(props, forwardedRef) {
     const portalContext = usePortalContext(CONTENT_NAME, props.__scopeSelect);
     const { forceMount = portalContext.forceMount, ...contentProps } = props;
     const context = useSelectContext(CONTENT_NAME, props.__scopeSelect);
@@ -284,24 +279,22 @@ var SelectContent = React.forwardRef(
       setFragment(new DocumentFragment());
     }, []);
     return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: ({ present }) => present ? /* @__PURE__ */ jsx(SelectContentImpl, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(SelectContentFragment, { ...contentProps, fragment }) });
-  }
+  }, "SelectContent")
 );
-SelectContent.displayName = CONTENT_NAME;
-var SelectContentFragment = React.forwardRef((props, forwardedRef) => {
+var SelectContentFragment = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function SelectContentFragment2(props, forwardedRef) {
   const { __scopeSelect, children, fragment } = props;
   if (!fragment) return null;
   return ReactDOM.createPortal(
     /* @__PURE__ */ jsx(SelectContentProvider, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(Collection.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ jsx("div", { ref: forwardedRef, children }) }) }),
     fragment
   );
-});
-SelectContentFragment.displayName = "SelectContentFragment";
+}, "SelectContentFragment"));
 var CONTENT_MARGIN = 10;
 var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME);
-var CONTENT_IMPL_NAME = "SelectContentImpl";
 var Slot = createSlot("SelectContent.RemoveScroll");
-var SelectContentImpl = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectContentImpl = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function SelectContentImpl2(props, forwardedRef) {
     const { __scopeSelect } = props;
     const {
       position = "item-aligned",
@@ -367,13 +360,13 @@ var SelectContentImpl = React.forwardRef(
     React.useEffect(() => {
       if (content) {
         let pointerMoveDelta = { x: 0, y: 0 };
-        const handlePointerMove = (event) => {
+        const handlePointerMove = /* @__PURE__ */ __name((event) => {
           pointerMoveDelta = {
             x: Math.abs(Math.round(event.pageX) - (triggerPointerDownPosRef.current?.x ?? 0)),
             y: Math.abs(Math.round(event.pageY) - (triggerPointerDownPosRef.current?.y ?? 0))
           };
-        };
-        const handlePointerUp = (event) => {
+        }, "handlePointerMove");
+        const handlePointerUp = /* @__PURE__ */ __name((event) => {
           if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) {
             event.preventDefault();
           } else {
@@ -383,7 +376,7 @@ var SelectContentImpl = React.forwardRef(
           }
           document.removeEventListener("pointermove", handlePointerMove);
           triggerPointerDownPosRef.current = null;
-        };
+        }, "handlePointerUp");
         if (triggerPointerDownPosRef.current !== null) {
           document.addEventListener("pointermove", handlePointerMove);
           document.addEventListener("pointerup", handlePointerUp, { capture: true, once: true });
@@ -395,7 +388,7 @@ var SelectContentImpl = React.forwardRef(
       }
     }, [content, onOpenChange, triggerPointerDownPosRef]);
     React.useEffect(() => {
-      const close = () => onOpenChange(false);
+      const close = /* @__PURE__ */ __name(() => onOpenChange(false), "close");
       window.addEventListener("blur", close);
       window.addEventListener("resize", close);
       return () => {
@@ -530,11 +523,9 @@ var SelectContentImpl = React.forwardRef(
         ) })
       }
     );
-  }
+  }, "SelectContentImpl")
 );
-SelectContentImpl.displayName = CONTENT_IMPL_NAME;
-var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition";
-var SelectItemAlignedPosition = React.forwardRef((props, forwardedRef) => {
+var SelectItemAlignedPosition = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function SelectItemAlignedPosition2(props, forwardedRef) {
   const { __scopeSelect, onPlaced, ...popperProps } = props;
   const context = useSelectContext(CONTENT_NAME, __scopeSelect);
   const contentContext = useSelectContentContext(CONTENT_NAME, __scopeSelect);
@@ -695,10 +686,8 @@ var SelectItemAlignedPosition = React.forwardRef((props, forwardedRef) => {
       )
     }
   );
-});
-SelectItemAlignedPosition.displayName = ITEM_ALIGNED_POSITION_NAME;
-var POPPER_POSITION_NAME = "SelectPopperPosition";
-var SelectPopperPosition = React.forwardRef((props, forwardedRef) => {
+}, "SelectItemAlignedPosition"));
+var SelectPopperPosition = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function SelectPopperPosition2(props, forwardedRef) {
   const {
     __scopeSelect,
     align = "start",
@@ -729,12 +718,11 @@ var SelectPopperPosition = React.forwardRef((props, forwardedRef) => {
       }
     }
   );
-});
-SelectPopperPosition.displayName = POPPER_POSITION_NAME;
+}, "SelectPopperPosition"));
 var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME, {});
 var VIEWPORT_NAME = "SelectViewport";
-var SelectViewport = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectViewport = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectViewport2(props, forwardedRef) {
     const { __scopeSelect, nonce, ...viewportProps } = props;
     const contentContext = useSelectContentContext(VIEWPORT_NAME, __scopeSelect);
     const viewportContext = useSelectViewportContext(VIEWPORT_NAME, __scopeSelect);
@@ -797,32 +785,29 @@ var SelectViewport = React.forwardRef(
         }
       ) })
     ] });
-  }
+  }, "SelectViewport")
 );
-SelectViewport.displayName = VIEWPORT_NAME;
 var GROUP_NAME = "SelectGroup";
 var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME);
-var SelectGroup = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectGroup = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectGroup2(props, forwardedRef) {
     const { __scopeSelect, ...groupProps } = props;
     const groupId = useId();
     return /* @__PURE__ */ jsx(SelectGroupContextProvider, { scope: __scopeSelect, id: groupId, children: /* @__PURE__ */ jsx(Primitive.div, { role: "group", "aria-labelledby": groupId, ...groupProps, ref: forwardedRef }) });
-  }
+  }, "SelectGroup")
 );
-SelectGroup.displayName = GROUP_NAME;
 var LABEL_NAME = "SelectLabel";
-var SelectLabel = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectLabel = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectLabel2(props, forwardedRef) {
     const { __scopeSelect, ...labelProps } = props;
     const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
     return /* @__PURE__ */ jsx(Primitive.div, { id: groupContext.id, ...labelProps, ref: forwardedRef });
-  }
+  }, "SelectLabel")
 );
-SelectLabel.displayName = LABEL_NAME;
 var ITEM_NAME = "SelectItem";
 var [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME);
-var SelectItem = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectItem = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectItem2(props, forwardedRef) {
     const {
       __scopeSelect,
       value,
@@ -841,12 +826,12 @@ var SelectItem = React.forwardRef(
     const composedRefs = useComposedRefs(forwardedRef, handleItemRefCallback);
     const textId = useId();
     const pointerTypeRef = React.useRef("touch");
-    const handleSelect = () => {
+    const handleSelect = /* @__PURE__ */ __name(() => {
       if (!disabled) {
         context.onValueChange(value);
         context.onOpenChange(false);
       }
-    };
+    }, "handleSelect");
     return /* @__PURE__ */ jsx(
       SelectItemContextProvider,
       {
@@ -923,12 +908,11 @@ var SelectItem = React.forwardRef(
         )
       }
     );
-  }
+  }, "SelectItem")
 );
-SelectItem.displayName = ITEM_NAME;
 var ITEM_TEXT_NAME = "SelectItemText";
-var SelectItemText = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectItemText = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectItemText2(props, forwardedRef) {
     const { __scopeSelect, className, style, ...itemTextProps } = props;
     const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect);
     const contentContext = useSelectContentContext(ITEM_TEXT_NAME, __scopeSelect);
@@ -958,20 +942,19 @@ var SelectItemText = React.forwardRef(
       /* @__PURE__ */ jsx(Primitive.span, { id: itemContext.textId, ...itemTextProps, ref: composedRefs }),
       itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren && !shouldShowPlaceholder(context.value) ? ReactDOM.createPortal(itemTextProps.children, context.valueNode) : null
     ] });
-  }
+  }, "SelectItemText")
 );
-SelectItemText.displayName = ITEM_TEXT_NAME;
 var ITEM_INDICATOR_NAME = "SelectItemIndicator";
-var SelectItemIndicator = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectItemIndicator = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function SelectItemIndicator2(props, forwardedRef) {
     const { __scopeSelect, ...itemIndicatorProps } = props;
     const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect);
     return itemContext.isSelected ? /* @__PURE__ */ jsx(Primitive.span, { "aria-hidden": true, ...itemIndicatorProps, ref: forwardedRef }) : null;
-  }
+  }, "SelectItemIndicator")
 );
-SelectItemIndicator.displayName = ITEM_INDICATOR_NAME;
 var SCROLL_UP_BUTTON_NAME = "SelectScrollUpButton";
-var SelectScrollUpButton = React.forwardRef((props, forwardedRef) => {
+var SelectScrollUpButton = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function SelectScrollUpButton2(props, forwardedRef) {
   const contentContext = useSelectContentContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
   const viewportContext = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
   const [canScrollUp, setCanScrollUp] = React.useState(false);
@@ -983,6 +966,7 @@ var SelectScrollUpButton = React.forwardRef((props, forwardedRef) => {
         setCanScrollUp(canScrollUp2);
       };
       var handleScroll = handleScroll2;
+      __name(handleScroll2, "handleScroll");
       const viewport = contentContext.viewport;
       handleScroll2();
       viewport.addEventListener("scroll", handleScroll2);
@@ -1002,10 +986,9 @@ var SelectScrollUpButton = React.forwardRef((props, forwardedRef) => {
       }
     }
   ) : null;
-});
-SelectScrollUpButton.displayName = SCROLL_UP_BUTTON_NAME;
+}, "SelectScrollUpButton"));
 var SCROLL_DOWN_BUTTON_NAME = "SelectScrollDownButton";
-var SelectScrollDownButton = React.forwardRef((props, forwardedRef) => {
+var SelectScrollDownButton = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function SelectScrollDownButton2(props, forwardedRef) {
   const contentContext = useSelectContentContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
   const viewportContext = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
   const [canScrollDown, setCanScrollDown] = React.useState(false);
@@ -1018,6 +1001,7 @@ var SelectScrollDownButton = React.forwardRef((props, forwardedRef) => {
         setCanScrollDown(canScrollDown2);
       };
       var handleScroll = handleScroll2;
+      __name(handleScroll2, "handleScroll");
       const viewport = contentContext.viewport;
       handleScroll2();
       viewport.addEventListener("scroll", handleScroll2);
@@ -1037,9 +1021,8 @@ var SelectScrollDownButton = React.forwardRef((props, forwardedRef) => {
       }
     }
   ) : null;
-});
-SelectScrollDownButton.displayName = SCROLL_DOWN_BUTTON_NAME;
-var SelectScrollButtonImpl = React.forwardRef((props, forwardedRef) => {
+}, "SelectScrollDownButton"));
+var SelectScrollButtonImpl = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function SelectScrollButtonImpl2(props, forwardedRef) {
   const { __scopeSelect, onAutoScroll, ...scrollIndicatorProps } = props;
   const contentContext = useSelectContentContext("SelectScrollButton", __scopeSelect);
   const autoScrollTimerRef = React.useRef(null);
@@ -1080,28 +1063,27 @@ var SelectScrollButtonImpl = React.forwardRef((props, forwardedRef) => {
       })
     }
   );
-});
-var SEPARATOR_NAME = "SelectSeparator";
-var SelectSeparator = React.forwardRef(
-  (props, forwardedRef) => {
+}, "SelectScrollButtonImpl"));
+var SelectSeparator = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function SelectSeparator2(props, forwardedRef) {
     const { __scopeSelect, ...separatorProps } = props;
     return /* @__PURE__ */ jsx(Primitive.div, { "aria-hidden": true, ...separatorProps, ref: forwardedRef });
-  }
+  }, "SelectSeparator")
 );
-SelectSeparator.displayName = SEPARATOR_NAME;
 var ARROW_NAME = "SelectArrow";
-var SelectArrow = React.forwardRef(
-  (props, forwardedRef) => {
+var SelectArrow = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function SelectArrow2(props, forwardedRef) {
     const { __scopeSelect, ...arrowProps } = props;
     const popperScope = usePopperScope(__scopeSelect);
     const contentContext = useSelectContentContext(ARROW_NAME, __scopeSelect);
     return contentContext.position === "popper" ? /* @__PURE__ */ jsx(PopperPrimitive.Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
-  }
+  }, "SelectArrow")
 );
-SelectArrow.displayName = ARROW_NAME;
 var BUBBLE_INPUT_NAME = "SelectBubbleInput";
-var SelectBubbleInput = React.forwardRef(
-  ({ __scopeSelect, ...props }, forwardedRef) => {
+var SelectBubbleInput = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function SelectBubbleInput2({ __scopeSelect, ...props }, forwardedRef) {
     const context = useSelectContext(BUBBLE_INPUT_NAME, __scopeSelect);
     const { value, onValueChange, required, disabled, name, autoComplete, form } = context;
     const { nativeOptions, nativeSelectKey } = context;
@@ -1149,15 +1131,16 @@ var SelectBubbleInput = React.forwardRef(
       },
       nativeSelectKey
     );
-  }
+  }, "SelectBubbleInput")
 );
-SelectBubbleInput.displayName = BUBBLE_INPUT_NAME;
 function isFunction(value) {
   return typeof value === "function";
 }
+__name(isFunction, "isFunction");
 function shouldShowPlaceholder(value) {
   return value === "" || value === void 0;
 }
+__name(shouldShowPlaceholder, "shouldShowPlaceholder");
 function useTypeaheadSearch(onSearchChange) {
   const handleSearchChange = useCallbackRef(onSearchChange);
   const searchRef = React.useRef("");
@@ -1166,11 +1149,11 @@ function useTypeaheadSearch(onSearchChange) {
     (key) => {
       const search = searchRef.current + key;
       handleSearchChange(search);
-      (function updateSearch(value) {
+      (/* @__PURE__ */ __name((function updateSearch(value) {
         searchRef.current = value;
         window.clearTimeout(timerRef.current);
         if (value !== "") timerRef.current = window.setTimeout(() => updateSearch(""), 1e3);
-      })(search);
+      }), "updateSearch"))(search);
     },
     [handleSearchChange]
   );
@@ -1183,6 +1166,7 @@ function useTypeaheadSearch(onSearchChange) {
   }, []);
   return [searchRef, handleTypeaheadSearch, resetTypeahead];
 }
+__name(useTypeaheadSearch, "useTypeaheadSearch");
 function findNextItem(items, search, currentItem) {
   const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
   const normalizedSearch = isRepeated ? search[0] : search;
@@ -1195,9 +1179,11 @@ function findNextItem(items, search, currentItem) {
   );
   return nextItem !== currentItem ? nextItem : void 0;
 }
+__name(findNextItem, "findNextItem");
 function wrapArray(array, startIndex) {
   return array.map((_, index) => array[(startIndex + index) % array.length]);
 }
+__name(wrapArray, "wrapArray");
 export {
   SelectArrow as Arrow,
   SelectContent as Content,