@hopper-ui/components 1.3.16 → 1.3.18

package/dist/{chunk-V2Z4BWEP.js → chunk-N3LRCSUZ.js}

@@ -1,295 +1,128 @@
-import { PopoverContext } from './chunk-SC6ZK5ON.js';
 import { TagGroupContext } from './chunk-LCAS3YQV.js';
 import { RadioGroupContext } from './chunk-5MBJWRZD.js';
-import { TextFieldContext } from './chunk-O4XPUINW.js';
 import { ContentContext } from './chunk-IXB2WK56.js';
 import { _Footer } from './chunk-GTM56LGX.js';
 import { FooterContext } from './chunk-I67NHYK4.js';
-import { NumberFieldContext } from './chunk-ZQ3AWYRR.js';
-import { PasswordFieldContext } from './chunk-QW45G6K4.js';
 import { SearchFieldContext } from './chunk-3NKF5TPD.js';
 import { TextAreaContext } from './chunk-MHQZXLKW.js';
+import { TextFieldContext } from './chunk-O4XPUINW.js';
+import { NumberFieldContext } from './chunk-ZQ3AWYRR.js';
+import { PasswordFieldContext } from './chunk-QW45G6K4.js';
 import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
 import { CheckboxGroupContext } from './chunk-N7YDPVZL.js';
-import { ButtonContext as ButtonContext$1 } from './chunk-WMTWFKKP.js';
 import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
+import { ButtonContext as ButtonContext$1 } from './chunk-WMTWFKKP.js';
 import { SelectContext } from './chunk-T24MBA34.js';
-import { _SelectValue } from './chunk-SOS2KEKX.js';
-import { _ListBox } from './chunk-HG4WPVDQ.js';
+import { SelectOptionsContext } from './chunk-CQFXGAJK.js';
+import { _ListBox } from './chunk-XPPRHRLO.js';
 import { isFunction, isNil } from './chunk-TIPN4VYD.js';
-import { ListBoxContext } from './chunk-UIEP5BA5.js';
-import { _ListBoxItem } from './chunk-BWBS4H3T.js';
 import { CheckboxContext } from './chunk-2EAZPH3M.js';
 import { _HopperProvider } from './chunk-NMKBUGSO.js';
-import { EnsureTextWrapper } from './chunk-TU4QEQE4.js';
-import { HeadingContext } from './chunk-TXZ6BMFR.js';
-import { LabelContext } from './chunk-QCA3ZR56.js';
 import { LinkContext } from './chunk-4VVNSXIB.js';
 import { FormContext } from './chunk-EURJK4ZT.js';
-import { HelperMessageContext } from './chunk-HZKFQ33E.js';
-import { ErrorMessageContext } from './chunk-FAE27DLF.js';
+import { ComboBoxOptionsContext } from './chunk-XGOJ7VOE.js';
 import { BadgeContext } from './chunk-CQDLZ42T.js';
+import { PopoverContext } from './chunk-SC6ZK5ON.js';
+import { ListBoxContext } from './chunk-UIEP5BA5.js';
+import { EnsureTextWrapper } from './chunk-UDPW7R42.js';
+import { HeadingContext } from './chunk-TXZ6BMFR.js';
+import { LabelContext } from './chunk-QCA3ZR56.js';
 import { ComboBoxContext } from './chunk-4XHTP4GX.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
-import { ClearContainerSlots, ClearProviders } from './chunk-HXI3MEEK.js';
+import { ClearProviders } from './chunk-HXI3MEEK.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
-import { IconContext, AngleUpIcon, AngleDownIcon } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue, useColorSchemeContext } from '@hopper-ui/styled-system';
 export * from '@hopper-ui/styled-system';
-import { useObjectRef, mergeRefs, useResizeObserver } from '@react-aria/utils';
-import { forwardRef, useRef, useState, useCallback, useReducer, useEffect } from 'react';
-import { useContextProps, useSlottedContext, InputContext, composeRenderProps, TextContext as TextContext$1, ButtonContext, ComboBox as ComboBox$1, Group, Input, Button, Form as Form$1, Select as Select$1, Popover as Popover$1, Dialog } from 'react-aria-components';
+import { forwardRef, useReducer, useRef, useEffect } from 'react';
+import { mergeProps } from 'react-aria';
+import { useContextProps, useSlottedContext, composeRenderProps, TextContext as TextContext$1, ButtonContext, Form as Form$1, Popover as Popover$1, Dialog } from 'react-aria-components';
 export { Collection } from 'react-aria-components';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx2 from 'clsx';
 
-// css-module:./ComboBox.module.css#css-module
-var ComboBox_module_default = { "hop-ComboBox": "ComboBox-module__hop-ComboBox___8q7vx", "hop-ComboBox--fluid": "ComboBox-module__hop-ComboBox--fluid___S83--", "hop-ComboBox__label": "ComboBox-module__hop-ComboBox__label___mgTl0", "hop-ComboBox__trigger": "ComboBox-module__hop-ComboBox__trigger___S9CSx", "hop-ComboBox__trigger--sm": "ComboBox-module__hop-ComboBox__trigger--sm___owSwv", "hop-ComboBox__trigger--md": "ComboBox-module__hop-ComboBox__trigger--md___-jvFb", "hop-ComboBox__input": "ComboBox-module__hop-ComboBox__input___Zy6ug", "hop-ComboBox__button": "ComboBox-module__hop-ComboBox__button___2c3xH", "hop-ComboBox__prefix": "ComboBox-module__hop-ComboBox__prefix___kkNtz", "hop-ComboBox__button-icon": "ComboBox-module__hop-ComboBox__button-icon___qKd1R", "hop-ComboBox__helper-message": "ComboBox-module__hop-ComboBox__helper-message___yUZf6", "hop-ComboBox__error-message": "ComboBox-module__hop-ComboBox__error-message___aDha9" };
-var GlobalComboBoxCssSelector = "hop-ComboBox";
-function ComboBox(props, ref) {
-  var _a, _b, _c;
-  const {
-    inputRef: userProvidedInputRef = null,
-    ...propsWithoutRef
-  } = props;
-  [props, ref] = useContextProps(propsWithoutRef, ref, ComboBoxContext);
+var GlobalComboBoxOptionsCssSelector = "hop-ComboBoxOptions";
+function ComboBoxOptions(props, ref) {
+  [props, ref] = useContextProps(props, ref, ComboBoxOptionsContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
     className,
     children,
-    fieldChildren,
     footer,
     isAutoMenuWidth,
-    isFluid: isFluidProp,
-    isInvalid,
-    isRequired,
-    items,
-    menuTrigger = "focus",
     listBoxProps,
-    necessityIndicator,
-    placeholder,
-    popoverProps,
-    prefix,
-    size: sizeProp,
+    placement = "bottom start",
+    slot,
     style: styleProp,
-    triggerProps,
     footerProps,
     ...otherProps
   } = ownProps;
-  const inputRef = useObjectRef(mergeRefs(userProvidedInputRef, (_a = props.inputRef) != null ? _a : null));
-  const inputContext = useSlottedContext(InputContext);
-  const mergedInputRefs = (inputContext == null ? void 0 : inputContext.ref) ? mergeRefs(inputRef, inputContext.ref) : inputRef;
-  const triggerRef = useRef(null);
-  const buttonRef = useRef(null);
-  const [triggerWidth, setTriggerWidth] = useState(null);
-  const onResize = useCallback(() => {
-    if (triggerRef.current) {
-      setTriggerWidth(triggerRef.current.offsetWidth + "px");
-    }
-  }, [triggerRef]);
-  useResizeObserver({
-    ref: triggerRef,
-    onResize
-  });
-  const { stylingProps: triggerStylingProps, ...triggerOwnProps } = useStyledSystem(triggerProps != null ? triggerProps : {});
-  const {
-    className: triggerClassName,
-    style: triggerStyleProp,
-    ...otherTriggerProps
-  } = triggerOwnProps;
-  const { stylingProps: popoverStylingProps, ...popoverOwnProps } = useStyledSystem(popoverProps != null ? popoverProps : {});
-  const {
-    placement = "bottom start",
-    style: popoverStyleProp,
-    ...otherPopoverProps
-  } = popoverOwnProps;
-  const size = (_b = useResponsiveValue(sizeProp)) != null ? _b : "sm";
-  const isFluid = (_c = useResponsiveValue(isFluidProp)) != null ? _c : false;
+  const listBoxCtx = useSlottedContext(ListBoxContext);
+  const textCtx = useSlottedContext(TextContext);
   const classNames = composeClassnameRenderProps(
     className,
-    GlobalComboBoxCssSelector,
-    cssModule(
-      ComboBox_module_default,
-      "hop-ComboBox",
-      isFluid && "fluid",
-      size
-    ),
+    GlobalComboBoxOptionsCssSelector,
     stylingProps.className
   );
-  const triggerClassNames = composeClassnameRenderProps(
-    triggerClassName,
-    cssModule(
-      ComboBox_module_default,
-      "hop-ComboBox__trigger",
-      size
-    ),
-    triggerStylingProps.className
-  );
-  const buttonClassNames = composeClassnameRenderProps(
-    cssModule(
-      ComboBox_module_default,
-      "hop-ComboBox__button"
-    )
-  );
-  const inputClassNames = composeClassnameRenderProps(
-    inputContext == null ? void 0 : inputContext.className,
-    ComboBox_module_default["hop-ComboBox__input"]
-  );
   const style = composeRenderProps(styleProp, (prev) => {
     return {
       ...stylingProps.style,
       ...prev
     };
   });
-  const triggerStyle = composeRenderProps(triggerStyleProp, (prev) => {
-    return {
-      ...triggerStylingProps.style,
-      ...prev
-    };
-  });
-  const popoverStyle = composeRenderProps(popoverStyleProp, (prev) => {
-    return {
-      ...popoverStylingProps.style,
-      ...prev,
-      "--custom-trigger-width": triggerWidth
-    };
-  });
-  const handleMouseDown = useCallback((e) => {
-    if (inputRef.current && e.target !== inputRef.current && buttonRef.current && e.target !== buttonRef.current) {
-      inputRef.current.focus();
-      e.preventDefault();
-    }
-  }, [inputRef]);
-  const prefixMarkup = prefix ? /* @__PURE__ */ jsx(
-    SlotProvider,
-    {
-      values: [
-        [TextContext, { size, className: ComboBox_module_default["hop-ComboBox__prefix"] }],
-        [IconContext, { size, className: ComboBox_module_default["hop-ComboBox__prefix"] }]
-      ],
-      children: /* @__PURE__ */ jsx(ClearContainerSlots, { children: /* @__PURE__ */ jsx(EnsureTextWrapper, { children: prefix }) })
-    }
-  ) : null;
   const footerMarkup = footer ? /* @__PURE__ */ jsx(
-    SlotProvider,
+    ClearProviders,
     {
       values: [
-        [TextContext, { size, className: ComboBox_module_default["hop-ComboBox__footer-text"] }]
+        TextContext$1,
+        TextContext,
+        ButtonContext
       ],
       children: /* @__PURE__ */ jsx(
-        ClearProviders,
+        SlotProvider,
         {
           values: [
-            TextContext$1,
-            TextContext,
-            ButtonContext
+            [TextContext, { size: textCtx == null ? void 0 : textCtx.size }]
           ],
           children: /* @__PURE__ */ jsx(_Footer, { ...footerProps, children: /* @__PURE__ */ jsx(EnsureTextWrapper, { children: footer }) })
         }
       )
     }
   ) : null;
-  return /* @__PURE__ */ jsx(
-    ComboBox$1,
+  return /* @__PURE__ */ jsxs(
+    _Popover,
     {
+      ...otherProps,
       ref,
       className: classNames,
+      isAutoWidth: isAutoMenuWidth,
+      isNonDialog: true,
+      placement,
       style,
-      isInvalid,
-      isRequired,
-      menuTrigger,
-      ...otherProps,
-      children: (comboBoxRenderProps) => {
-        const { isOpen } = comboBoxRenderProps;
-        const ButtonIcon = isOpen ? AngleUpIcon : AngleDownIcon;
-        return /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
-            SlotProvider,
-            {
-              values: [
-                [LabelContext, {
-                  className: ComboBox_module_default["hop-ComboBox__label"],
-                  isRequired,
-                  necessityIndicator
-                }],
-                [HelperMessageContext, {
-                  className: ComboBox_module_default["hop-ComboBox__helper-message"]
-                }],
-                [ErrorMessageContext, {
-                  className: ComboBox_module_default["hop-ComboBox__error-message"]
-                }]
-              ],
-              children: fieldChildren
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            Group,
-            {
-              ref: triggerRef,
-              className: triggerClassNames,
-              style: triggerStyle,
-              onMouseDown: handleMouseDown,
-              "data-selected": isOpen || void 0,
-              ...otherTriggerProps,
-              children: [
-                prefixMarkup,
-                /* @__PURE__ */ jsx(
-                  Input,
-                  {
-                    ref: mergedInputRefs,
-                    className: inputClassNames,
-                    placeholder
-                  }
-                ),
-                /* @__PURE__ */ jsx(Button, { className: buttonClassNames, ref: buttonRef, children: /* @__PURE__ */ jsx(ButtonIcon, { size: "sm", className: ComboBox_module_default["hop-ComboBox__button-icon"] }) })
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            _Popover,
-            {
-              placement,
-              isNonDialog: true,
-              autoWidth: isAutoMenuWidth,
-              style: popoverStyle,
-              triggerRef,
-              ...otherPopoverProps,
-              children: [
-                /* @__PURE__ */ jsx(
-                  SlotProvider,
-                  {
-                    values: [
-                      [BadgeContext, {
-                        variant: "secondary"
-                      }]
-                    ],
-                    children: /* @__PURE__ */ jsx(_ListBox, { items, size, isInvalid, ...listBoxProps, children })
-                  }
-                ),
-                footerMarkup
-              ]
-            }
-          )
-        ] });
-      }
+      slot: slot != null ? slot : void 0,
+      children: [
+        /* @__PURE__ */ jsx(
+          SlotProvider,
+          {
+            values: [
+              [BadgeContext, {
+                variant: "secondary"
+              }]
+            ],
+            children: /* @__PURE__ */ jsx(_ListBox, { ...mergeProps(listBoxCtx, listBoxProps), children })
+          }
+        ),
+        footerMarkup
+      ]
     }
   );
 }
-var _ComboBox = forwardRef(ComboBox);
-_ComboBox.displayName = "ComboBox";
-var CompoundComboBox = Object.assign(_ComboBox, {
-  /**
-   * A combo box option is an item that is displayed in a combo box.
-   *
-   * [View Documentation](TODO)
-   */
-  Option: _ListBoxItem
-});
+var _ComboBoxOptions = forwardRef(ComboBoxOptions);
+_ComboBoxOptions.displayName = "ComboBoxOptions";
 
 // css-module:./Form.module.css#css-module
-var Form_module_default = { "hop-Form": "Form-module__hop-Form___CQrTo" };
+var Form_module_default = { "hop-Form": "Form-module__hop-Form___MqgRc" };
 var GlobalFormCssSelector = "hop-Form";
 function Form(props, ref) {
   var _a;
@@ -414,173 +247,84 @@ function Form(props, ref) {
 }
 var _Form = forwardRef(Form);
 _Form.displayName = "Form";
-
-// css-module:./Select.module.css#css-module
-var Select_module_default = { "hop-Select": "Select-module__hop-Select___VEhAu", "hop-Select--fluid": "Select-module__hop-Select--fluid___bBzN-", "hop-Select__label": "Select-module__hop-Select__label___2P5DJ", "hop-Select__button": "Select-module__hop-Select__button___jrEtq", "hop-Select__button--sm": "Select-module__hop-Select__button--sm___AxUcT", "hop-Select__button--md": "Select-module__hop-Select__button--md___2ZsyY", "hop-Select__prefix": "Select-module__hop-Select__prefix___l34cb", "hop-Select__button-icon": "Select-module__hop-Select__button-icon___qEX-R", "hop-Select__helper-message": "Select-module__hop-Select__helper-message___3bw-s", "hop-Select__error-message": "Select-module__hop-Select__error-message___mA5hF" };
-var GlobalSelectCssSelector = "hop-Select";
-function Select(props, ref) {
-  var _a, _b;
-  [props, ref] = useContextProps(props, ref, SelectContext);
+var GlobalSelectOptionsCssSelector = "hop-SelectOptions";
+function SelectOptions(props, ref) {
+  [props, ref] = useContextProps(props, ref, SelectOptionsContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
     className,
     children,
-    fieldChildren,
     footer,
+    footerProps,
     isAutoMenuWidth,
-    isFluid: isFluidProp,
-    isInvalid,
-    isRequired,
-    items,
     listBoxProps,
-    necessityIndicator,
-    popoverProps,
-    prefix,
-    renderValue,
-    size: sizeProp,
+    placement = "bottom start",
+    slot,
     style: styleProp,
-    triggerProps,
-    footerProps,
     ...otherProps
   } = ownProps;
-  const { stylingProps: triggerStylingProps, ...triggerOwnProps } = useStyledSystem(triggerProps != null ? triggerProps : {});
-  const {
-    className: triggerClassName,
-    style: triggerStyleProp,
-    ...otherTriggerProps
-  } = triggerOwnProps;
-  const { placement = "bottom start", ...otherPopoverProps } = popoverProps != null ? popoverProps : {};
-  const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "sm";
-  const isFluid = (_b = useResponsiveValue(isFluidProp)) != null ? _b : false;
+  const listBoxCtx = useSlottedContext(ListBoxContext);
+  const textCtx = useSlottedContext(TextContext);
   const classNames = composeClassnameRenderProps(
     className,
-    GlobalSelectCssSelector,
-    cssModule(
-      Select_module_default,
-      "hop-Select",
-      isFluid && "fluid",
-      size
-    ),
+    GlobalSelectOptionsCssSelector,
     stylingProps.className
   );
-  const buttonClassNames = composeClassnameRenderProps(
-    triggerClassName,
-    cssModule(
-      Select_module_default,
-      "hop-Select__button",
-      size
-    ),
-    triggerStylingProps.className
-  );
   const style = composeRenderProps(styleProp, (prev) => {
     return {
       ...stylingProps.style,
       ...prev
     };
   });
-  const triggerStyle = composeRenderProps(triggerStyleProp, (prev) => {
-    return {
-      ...triggerStylingProps.style,
-      ...prev
-    };
-  });
-  const prefixMarkup = prefix ? /* @__PURE__ */ jsx(
-    SlotProvider,
-    {
-      values: [
-        [TextContext, { size, className: Select_module_default["hop-Select__prefix"] }],
-        [IconContext, { size, className: Select_module_default["hop-Select__prefix"] }]
-      ],
-      children: /* @__PURE__ */ jsx(ClearContainerSlots, { children: /* @__PURE__ */ jsx(EnsureTextWrapper, { children: prefix }) })
-    }
-  ) : null;
   const footerMarkup = footer ? /* @__PURE__ */ jsx(
-    SlotProvider,
+    ClearProviders,
     {
       values: [
-        [TextContext, { size, className: Select_module_default["hop-Select__footer-text"] }]
+        TextContext$1,
+        TextContext,
+        ButtonContext
       ],
       children: /* @__PURE__ */ jsx(
-        ClearProviders,
+        SlotProvider,
         {
           values: [
-            TextContext$1,
-            TextContext,
-            ButtonContext
+            [TextContext, { size: textCtx == null ? void 0 : textCtx.size }]
           ],
           children: /* @__PURE__ */ jsx(_Footer, { ...footerProps, children: /* @__PURE__ */ jsx(EnsureTextWrapper, { children: footer }) })
         }
       )
     }
   ) : null;
-  return /* @__PURE__ */ jsx(
-    Select$1,
+  return /* @__PURE__ */ jsxs(
+    _Popover,
     {
       ...otherProps,
       ref,
       className: classNames,
+      isAutoWidth: isAutoMenuWidth,
+      isNonDialog: true,
+      placement,
       style,
-      isInvalid,
-      isRequired,
-      children: (selectRenderProps) => {
-        const { isOpen } = selectRenderProps;
-        const ButtonIcon = isOpen ? AngleUpIcon : AngleDownIcon;
-        return /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
-            SlotProvider,
-            {
-              values: [
-                [LabelContext, {
-                  className: Select_module_default["hop-Select__label"],
-                  isRequired,
-                  necessityIndicator
-                }],
-                [HelperMessageContext, {
-                  className: Select_module_default["hop-Select__helper-message"]
-                }],
-                [ErrorMessageContext, {
-                  className: Select_module_default["hop-Select__error-message"]
-                }]
-              ],
-              children: fieldChildren
-            }
-          ),
-          /* @__PURE__ */ jsxs(Button, { className: buttonClassNames, style: triggerStyle, "data-invalid": isInvalid || void 0, ...otherTriggerProps, children: [
-            prefixMarkup,
-            /* @__PURE__ */ jsx(_SelectValue, { size, children: (valueRenderProps) => {
-              return renderValue == null ? void 0 : renderValue(valueRenderProps);
-            } }),
-            /* @__PURE__ */ jsx(ButtonIcon, { size: "sm", className: Select_module_default["hop-Select__button-icon"] })
-          ] }),
-          /* @__PURE__ */ jsxs(_Popover, { ...otherPopoverProps, placement, isNonDialog: true, autoWidth: isAutoMenuWidth, children: [
-            /* @__PURE__ */ jsx(
-              SlotProvider,
-              {
-                values: [
-                  [BadgeContext, {
-                    variant: "secondary"
-                  }]
-                ],
-                children: /* @__PURE__ */ jsx(_ListBox, { items, size, isInvalid, ...listBoxProps, children })
-              }
-            ),
-            footerMarkup
-          ] })
-        ] });
-      }
+      slot: slot != null ? slot : void 0,
+      children: [
+        /* @__PURE__ */ jsx(
+          SlotProvider,
+          {
+            values: [
+              [BadgeContext, {
+                variant: "secondary"
+              }]
+            ],
+            children: /* @__PURE__ */ jsx(_ListBox, { ...mergeProps(listBoxCtx, listBoxProps), children })
+          }
+        ),
+        footerMarkup
+      ]
     }
   );
 }
-var _Select = forwardRef(Select);
-_Select.displayName = "Select";
-var CompoundSelect = Object.assign(_Select, {
-  /**
-   * A select option is an item that is displayed in a select.
-   *
-   * [View Documentation](TODO)
-   */
-  Option: _ListBoxItem
-});
+var _SelectOptions = forwardRef(SelectOptions);
+_SelectOptions.displayName = "SelectOptions";
 function $0d86e9c8f07f9a7b$export$79c0c687a5963b0a(opts, dispatch) {
   let { cursor, getKey } = opts;
   return {
@@ -992,14 +736,14 @@ function $f86e6c1ec7da6ebb$export$bc3384a35de93d66(options) {
 }
 
 // css-module:./Popover.module.css#css-module
-var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___51rSf", "fade": "Popover-module__fade___U-9K6", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___XjIgv", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___aRsgz", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___kPkG5", "hop-Popover__title": "Popover-module__hop-Popover__title___-DuN5", "hop-Popover__content": "Popover-module__hop-Popover__content___gVlVS", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___5Z2TA", "hop-Popover__footer": "Popover-module__hop-Popover__footer___bIx0B", "hop-Popover__actions": "Popover-module__hop-Popover__actions___bgaPu", "hop-Popover__action": "Popover-module__hop-Popover__action___Msglb" };
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___DYbof", "fade": "Popover-module__fade___fnFGM", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___-bLX3", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___Mz1P2", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___G2P2B", "hop-Popover__title": "Popover-module__hop-Popover__title___m-XxR", "hop-Popover__content": "Popover-module__hop-Popover__content___bCwia", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___posdL", "hop-Popover__footer": "Popover-module__hop-Popover__footer___FHCir", "hop-Popover__actions": "Popover-module__hop-Popover__actions___N1Qf3", "hop-Popover__action": "Popover-module__hop-Popover__action___EXz-c" };
 var GlobalPopoverCssSelector = "hop-Popover";
 function Popover(props, ref) {
   var _a;
   [props, ref] = useContextProps(props, ref, PopoverContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
-    autoWidth,
+    isAutoWidth,
     children,
     className,
     offset = 4,
@@ -1050,7 +794,7 @@ function Popover(props, ref) {
       ref,
       className: popoverClassNames,
       arrowBoundaryOffset: boundaryOffset,
-      "data-auto-width": autoWidth || void 0,
+      "data-auto-width": isAutoWidth || void 0,
       containerPadding,
       style,
       placement,
@@ -1125,4 +869,4 @@ function Popover(props, ref) {
 var _Popover = forwardRef(Popover);
 _Popover.displayName = "Popover";
 
-export { $f86e6c1ec7da6ebb$export$bc3384a35de93d66, CompoundComboBox, CompoundSelect, GlobalComboBoxCssSelector, GlobalFormCssSelector, GlobalPopoverCssSelector, GlobalSelectCssSelector, _Form, _Popover };
+export { $f86e6c1ec7da6ebb$export$bc3384a35de93d66, GlobalComboBoxOptionsCssSelector, GlobalFormCssSelector, GlobalPopoverCssSelector, GlobalSelectOptionsCssSelector, _ComboBoxOptions, _Form, _Popover, _SelectOptions };

package/dist/{chunk-KBDTTZPD.js → chunk-NVDHY6W4.js}

@@ -1,5 +1,5 @@
-import { _OverlineText } from './chunk-AUEHFPNX.js';
 import { BadgeContext } from './chunk-CQDLZ42T.js';
+import { _OverlineText } from './chunk-IPM7WRBC.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { useRenderProps } from './chunk-NH3IVMXB.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
@@ -12,7 +12,7 @@ import { useContextProps, composeRenderProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Badge.module.css#css-module
-var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___WmQnH" };
+var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___wJQ3c" };
 var GlobalBadgeCssSelector = "hop-Badge";
 function Badge(props, ref) {
   [props, ref] = useContextProps(props, ref, BadgeContext);

package/dist/{chunk-BK4B5TOE.js → chunk-O25LM3KC.js}

@@ -1,5 +1,5 @@
 import { AvatarContext } from './chunk-AES7QBQE.js';
-import { _RichIconAvatarImage } from './chunk-PBFGUMTY.js';
+import { _RichIconAvatarImage } from './chunk-BRBEVRVF.js';
 import { useRenderProps } from './chunk-NH3IVMXB.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { DeletedUserRichIcon } from '@hopper-ui/icons';

package/dist/{chunk-3RRF33G3.js → chunk-OK4ANEAT.js}

@@ -1,9 +1,9 @@
-import { TextFieldContext } from './chunk-O4XPUINW.js';
 import { useTruncatedText } from './chunk-Z57VHYOF.js';
-import { _RemainingCharacterCount } from './chunk-7A6CYDDX.js';
-import { _InputGroup } from './chunk-RLNCYCEL.js';
-import { _ClearButton } from './chunk-PXMJ2JSP.js';
-import { EnsureTextWrapper } from './chunk-TU4QEQE4.js';
+import { _RemainingCharacterCount } from './chunk-EWAN3WSB.js';
+import { TextFieldContext } from './chunk-O4XPUINW.js';
+import { _InputGroup } from './chunk-D3533FNR.js';
+import { _ClearButton } from './chunk-MPJYOQU5.js';
+import { EnsureTextWrapper } from './chunk-UDPW7R42.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { HelperMessageContext } from './chunk-HZKFQ33E.js';
 import { ErrorMessageContext } from './chunk-FAE27DLF.js';
@@ -23,7 +23,7 @@ import { useContextProps, composeRenderProps, Input, TextField as TextField$1 }
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./TextField.module.css#css-module
-var TextField_module_default = { "hop-TextField": "TextField-module__hop-TextField___WG58k", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___w7M0z", "hop-TextField__Label": "TextField-module__hop-TextField__Label___RiuC2", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___qRXj9", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___wc4Dz", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___lyCoP", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___30MpS" };
+var TextField_module_default = { "hop-TextField": "TextField-module__hop-TextField___D128F", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___EZzsd", "hop-TextField__Label": "TextField-module__hop-TextField__Label___0-t5h", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___RfHJ1", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___LVNN3", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___X2LAX", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___4kYmY" };
 var GlobalTextFieldCssSelector = "hop-TextField";
 function TextField(props, ref) {
   var _a;

package/dist/{chunk-BOFZY7AG.js → chunk-OZKEVEPI.js}

@@ -1,6 +1,6 @@
 import { RadioContext } from './chunk-FU5CCPLP.js';
-import { EnsureTextWrapper } from './chunk-TU4QEQE4.js';
 import { IconListContext } from './chunk-DHVVYSLB.js';
+import { EnsureTextWrapper } from './chunk-UDPW7R42.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
@@ -13,7 +13,7 @@ import { useContextProps, composeRenderProps, Radio as Radio$1 } from 'react-ari
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./Radio.module.css#css-module
-var Radio_module_default = { "hop-Radio": "Radio-module__hop-Radio___Mve6d", "hop-Radio--sm": "Radio-module__hop-Radio--sm___2bpSq", "hop-Radio--md": "Radio-module__hop-Radio--md___8FGP5", "hop-Radio__icon": "Radio-module__hop-Radio__icon___u8vYi", "hop-Radio__icon-list": "Radio-module__hop-Radio__icon-list___ZnA-D", "hop-Radio__box": "Radio-module__hop-Radio__box___wPjxC", "hop-Radio__bullet": "Radio-module__hop-Radio__bullet___IaqWB", "hop-Radio__text": "Radio-module__hop-Radio__text___ommSg" };
+var Radio_module_default = { "hop-Radio": "Radio-module__hop-Radio___faJuK", "hop-Radio--sm": "Radio-module__hop-Radio--sm___W--x6", "hop-Radio--md": "Radio-module__hop-Radio--md___1vAWK", "hop-Radio__icon": "Radio-module__hop-Radio__icon___ic6xU", "hop-Radio__icon-list": "Radio-module__hop-Radio__icon-list___QKwEe", "hop-Radio__box": "Radio-module__hop-Radio__box___98f-A", "hop-Radio__bullet": "Radio-module__hop-Radio__bullet___Xd-hd", "hop-Radio__text": "Radio-module__hop-Radio__text___BcX3d" };
 var GlobalRadioCssSelector = "hop-Radio";
 function Radio(props, ref) {
   var _a;