@hopper-ui/components 1.2.0 → 1.3.0

package/dist/{chunk-TCOZUCPD.js → chunk-SCXYAGZI.js}

@@ -1,55 +1,99 @@
 import { PopoverContext } from './chunk-SC6ZK5ON.js';
-import { ContentContext } from './chunk-IXB2WK56.js';
+import { _Footer } from './chunk-AQITZWYM.js';
 import { FooterContext } from './chunk-I67NHYK4.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 { ContentContext } from './chunk-IXB2WK56.js';
 import { NumberFieldContext } from './chunk-ZQ3AWYRR.js';
-import { HeadingContext } from './chunk-TXZ6BMFR.js';
-import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
+import { PasswordFieldContext } from './chunk-QW45G6K4.js';
+import { SearchFieldContext } from './chunk-3NKF5TPD.js';
 import { CheckboxGroupContext } from './chunk-N7YDPVZL.js';
+import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
 import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
+import { SelectContext } from './chunk-T24MBA34.js';
+import { _SelectValue } from './chunk-YB7IYQW4.js';
+import { HeadingContext } from './chunk-TXZ6BMFR.js';
 import { LinkContext } from './chunk-4VVNSXIB.js';
+import { _ListBox } from './chunk-QQI3KNHZ.js';
 import { isFunction, isNil } from './chunk-TIPN4VYD.js';
+import { ListBoxContext } from './chunk-UIEP5BA5.js';
+import { _ListBoxItem } from './chunk-6C5RI4RT.js';
 import { RadioGroupContext } from './chunk-5MBJWRZD.js';
 import { CheckboxContext } from './chunk-2EAZPH3M.js';
+import { LabelContext } from './chunk-QCA3ZR56.js';
+import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { HelperMessageContext } from './chunk-HZKFQ33E.js';
 import { _HopperProvider } from './chunk-NMKBUGSO.js';
 import { FormContext } from './chunk-EURJK4ZT.js';
+import { BadgeContext } from './chunk-CQDLZ42T.js';
+import { ErrorMessageContext } from './chunk-FAE27DLF.js';
+import { _Text } from './chunk-D5PBETXF.js';
+import { TextContext } from './chunk-X6SER3TZ.js';
+import { ClearContainerSlots, ClearProviders } from './chunk-HXI3MEEK.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
-import { useStyledSystem, useColorSchemeContext, useResponsiveValue } from '@hopper-ui/styled-system';
+import { useStyledSystem, useResponsiveValue, useColorSchemeContext } from '@hopper-ui/styled-system';
 export * from '@hopper-ui/styled-system';
 import clsx from 'clsx';
 import { forwardRef, useReducer, useRef, useEffect } from 'react';
-import { useContextProps, Popover as Popover$1, Dialog, Form as Form$1 } from 'react-aria-components';
+import { useContextProps, composeRenderProps, Popover as Popover$1, Dialog, Select as Select$1, Button, TextContext as TextContext$1, ButtonContext as ButtonContext$1, Form as Form$1 } from 'react-aria-components';
 export { Collection } from 'react-aria-components';
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { IconContext, AngleUpIcon, AngleDownIcon } from '@hopper-ui/icons';
 
 // css-module:./Popover.module.css#css-module
-var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___nKZak", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___vnp7r", "hop-Popover__title": "Popover-module__hop-Popover__title___NazSs", "hop-Popover__actions": "Popover-module__hop-Popover__actions___VImV7", "hop-Popover__action": "Popover-module__hop-Popover__action___fsXDT", "hop-Popover__content": "Popover-module__hop-Popover__content___fZfhh", "hop-Popover__footer": "Popover-module__hop-Popover__footer___GPaEX" };
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___VDTYB", "fade": "Popover-module__fade___uwIjr", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___rBazX", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___6ncUU", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___kjrcJ", "hop-Popover__title": "Popover-module__hop-Popover__title___qZBhF", "hop-Popover__content": "Popover-module__hop-Popover__content___e35rK", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___uD0ue", "hop-Popover__footer": "Popover-module__hop-Popover__footer___OyNk-", "hop-Popover__actions": "Popover-module__hop-Popover__actions___l8RIe", "hop-Popover__action": "Popover-module__hop-Popover__action___xdB8e" };
 var GlobalPopoverCssSelector = "hop-Popover";
 function Popover(props, ref) {
+  var _a;
   [props, ref] = useContextProps(props, ref, PopoverContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
+    autoWidth,
     children,
     className,
     offset = 4,
     boundaryOffset,
+    isNonDialog,
+    containerPadding = 16,
+    containerProps,
+    placement: placementProp,
+    style: styleProp,
     ...otherProps
   } = ownProps;
+  const placement = (_a = useResponsiveValue(placementProp)) != null ? _a : "bottom";
+  const { stylingProps: containerStylingProps, ...containerOwnProps } = useStyledSystem(containerProps != null ? containerProps : {});
+  const {
+    className: containerClassName,
+    style: containerStyleProp,
+    slot,
+    ...containerOtherProps
+  } = containerOwnProps;
   const { colorScheme } = useColorSchemeContext();
   const popoverClassNames = composeClassnameRenderProps(
     className,
     GlobalPopoverCssSelector,
     cssModule(
       Popover_module_default,
-      "hop-Popover"
-    )
+      "hop-Popover",
+      isNonDialog && "non-dialog"
+    ),
+    stylingProps.className
   );
+  const containerClassNames = isNonDialog ? clsx(containerClassName, Popover_module_default["hop-Popover__dropdown"], containerStylingProps.className) : clsx(containerClassName, Popover_module_default["hop-Popover__dialog"], containerStylingProps.className);
+  const style = composeRenderProps(styleProp, (prev) => {
+    return {
+      ...stylingProps.style,
+      "--container-padding": `${containerPadding}px`,
+      ...prev
+    };
+  });
+  const containerStyle = {
+    ...containerStylingProps.style,
+    ...containerStyleProp
+  };
   return /* @__PURE__ */ jsx(
     Popover$1,
     {
@@ -58,50 +102,231 @@ function Popover(props, ref) {
       ref,
       className: popoverClassNames,
       arrowBoundaryOffset: boundaryOffset,
-      children: (state) => /* @__PURE__ */ jsx(_HopperProvider, { colorScheme, children: /* @__PURE__ */ jsx(
-        Dialog,
-        {
-          className: clsx(stylingProps.className, Popover_module_default["hop-Popover__dialog"]),
-          style: stylingProps.style,
-          children: /* @__PURE__ */ jsx(
+      "data-auto-width": autoWidth || void 0,
+      containerPadding,
+      style,
+      placement,
+      children: (state) => {
+        const content = isFunction(children) && !isNil(children) ? children(state) : children;
+        if (isNonDialog) {
+          return /* @__PURE__ */ jsx(_HopperProvider, { colorScheme, className: Popover_module_default["hop-Popover__wrapper"], children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              ...containerOtherProps,
+              className: containerClassNames,
+              style: containerStyle,
+              slot: slot || void 0,
+              children: /* @__PURE__ */ jsx(
+                SlotProvider,
+                {
+                  values: [
+                    [ListBoxContext, {
+                      className: Popover_module_default["hop-Popover__list-box"]
+                    }],
+                    [FooterContext, {
+                      className: Popover_module_default["hop-Popover__footer"]
+                    }],
+                    [LinkContext, {
+                      size: "sm",
+                      variant: "primary",
+                      isQuiet: true
+                    }]
+                  ],
+                  children: content
+                }
+              )
+            }
+          ) });
+        }
+        return /* @__PURE__ */ jsx(_HopperProvider, { colorScheme, children: /* @__PURE__ */ jsx(Dialog, { ...containerOtherProps, className: containerClassNames, style: containerStyle, children: /* @__PURE__ */ jsx(
+          SlotProvider,
+          {
+            values: [
+              [HeadingContext, {
+                className: Popover_module_default["hop-Popover__title"],
+                size: "xs"
+              }],
+              [ButtonContext, {
+                size: "sm",
+                className: Popover_module_default["hop-Popover__action"]
+              }],
+              [ButtonGroupContext, {
+                size: "sm",
+                align: "end",
+                className: Popover_module_default["hop-Popover__actions"]
+              }],
+              [ContentContext, {
+                className: Popover_module_default["hop-Popover__content"]
+              }],
+              [FooterContext, {
+                className: Popover_module_default["hop-Popover__footer"]
+              }],
+              [LinkContext, {
+                size: "sm",
+                variant: "primary",
+                isQuiet: true
+              }]
+            ],
+            children: content
+          }
+        ) }) });
+      }
+    }
+  );
+}
+var _Popover = forwardRef(Popover);
+_Popover.displayName = "Popover";
+
+// css-module:./Select.module.css#css-module
+var Select_module_default = { "hop-Select": "Select-module__hop-Select___-8SYI", "hop-Select--fluid": "Select-module__hop-Select--fluid___xc7Ku", "hop-Select__label": "Select-module__hop-Select__label___g3Dp1", "hop-Select__button": "Select-module__hop-Select__button___bVgEW", "hop-Select__button--sm": "Select-module__hop-Select__button--sm___lAmUR", "hop-Select__button--md": "Select-module__hop-Select__button--md___imFfM", "hop-Select__prefix": "Select-module__hop-Select__prefix___IpM32", "hop-Select__button-icon": "Select-module__hop-Select__button-icon___nOSOw", "hop-Select__helper-message": "Select-module__hop-Select__helper-message___sMWir", "hop-Select__error-message": "Select-module__hop-Select__error-message___co23W" };
+var GlobalSelectCssSelector = "hop-Select";
+function Select(props, ref) {
+  var _a, _b;
+  [props, ref] = useContextProps(props, ref, SelectContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    children,
+    fieldChildren,
+    footer,
+    isAutoMenuWidth,
+    isFluid: isFluidProp,
+    isInvalid,
+    items,
+    listBoxProps,
+    popoverProps,
+    prefix,
+    renderValue,
+    size: sizeProp,
+    style: styleProp,
+    triggerProps,
+    ...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 classNames = composeClassnameRenderProps(
+    className,
+    GlobalSelectCssSelector,
+    cssModule(
+      Select_module_default,
+      "hop-Select",
+      isFluid && "fluid",
+      size
+    ),
+    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 = {
+    ...triggerStylingProps.style,
+    ...triggerStyleProp
+  };
+  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: isTextOnlyChildren(prefix) ? /* @__PURE__ */ jsx(_Text, { children: prefix }) : prefix })
+    }
+  ) : null;
+  const footerMarkup = footer ? /* @__PURE__ */ jsx(_Footer, { children: isTextOnlyChildren(footer) ? /* @__PURE__ */ jsx(_Text, { children: footer }) : footer }) : null;
+  return /* @__PURE__ */ jsx(
+    Select$1,
+    {
+      ...otherProps,
+      ref,
+      className: classNames,
+      style,
+      isInvalid,
+      children: (selectRenderProps) => {
+        const { isOpen } = selectRenderProps;
+        const ButtonIcon = isOpen ? AngleUpIcon : AngleDownIcon;
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
             SlotProvider,
             {
               values: [
-                [HeadingContext, {
-                  className: Popover_module_default["hop-Popover__title"],
-                  size: "xs"
+                [LabelContext, {
+                  className: Select_module_default["hop-Select__label"]
                 }],
-                [ButtonContext, {
-                  size: "sm",
-                  className: Popover_module_default["hop-Popover__action"]
+                [HelperMessageContext, {
+                  className: Select_module_default["hop-Select__helper-message"]
                 }],
-                [ButtonGroupContext, {
-                  size: "sm",
-                  align: "end",
-                  className: Popover_module_default["hop-Popover__actions"]
-                }],
-                [ContentContext, {
-                  className: Popover_module_default["hop-Popover__content"]
-                }],
-                [FooterContext, {
-                  className: Popover_module_default["hop-Popover__footer"]
-                }],
-                [LinkContext, {
-                  size: "sm",
-                  variant: "primary",
-                  isQuiet: true
+                [ErrorMessageContext, {
+                  className: Select_module_default["hop-Select__error-message"]
                 }]
               ],
-              children: isFunction(children) && !isNil(children) ? children(state) : children
+              children: fieldChildren
             }
-          )
-        }
-      ) })
+          ),
+          /* @__PURE__ */ jsxs(Button, { ...otherTriggerProps, className: buttonClassNames, style: triggerStyle, "data-invalid": isInvalid || void 0, 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, { ...listBoxProps, items, size, isInvalid, children })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              ClearProviders,
+              {
+                values: [
+                  TextContext$1,
+                  TextContext,
+                  ButtonContext$1
+                ],
+                children: footerMarkup
+              }
+            )
+          ] })
+        ] });
+      }
     }
   );
 }
-var _Popover = forwardRef(Popover);
-_Popover.displayName = "Popover";
+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
+});
 function $0d86e9c8f07f9a7b$export$79c0c687a5963b0a(opts, dispatch) {
   let { cursor, getKey } = opts;
   return {
@@ -513,7 +738,7 @@ function $f86e6c1ec7da6ebb$export$bc3384a35de93d66(options) {
 }
 
 // css-module:./Form.module.css#css-module
-var Form_module_default = { "hop-Form": "Form-module__hop-Form___WWA27" };
+var Form_module_default = { "hop-Form": "Form-module__hop-Form___tKcK9" };
 var GlobalFormCssSelector = "hop-Form";
 function Form(props, ref) {
   var _a;
@@ -605,4 +830,4 @@ function Form(props, ref) {
 var _Form = forwardRef(Form);
 _Form.displayName = "Form";
 
-export { $f86e6c1ec7da6ebb$export$bc3384a35de93d66, GlobalFormCssSelector, GlobalPopoverCssSelector, _Form, _Popover };
+export { $f86e6c1ec7da6ebb$export$bc3384a35de93d66, CompoundSelect, GlobalFormCssSelector, GlobalPopoverCssSelector, GlobalSelectCssSelector, _Form, _Popover };

package/dist/{chunk-PFABSIDM.js → chunk-SKEMSZ63.js}

@@ -1,5 +1,5 @@
-import { RadioContext } from './chunk-FU5CCPLP.js';
 import { RadioFieldContext } from './chunk-DGLAGYBD.js';
+import { RadioContext } from './chunk-FU5CCPLP.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
@@ -12,7 +12,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./RadioField.module.css#css-module
-var RadioField_module_default = { "hop-RadioField": "RadioField-module__hop-RadioField___uuirX", "hop-RadioField--sm": "RadioField-module__hop-RadioField--sm___1lfkD", "hop-RadioField--md": "RadioField-module__hop-RadioField--md___ytruf", "hop-RadioField__description": "RadioField-module__hop-RadioField__description___waqNk", "hop-RadioField__radio": "RadioField-module__hop-RadioField__radio___ySRK1" };
+var RadioField_module_default = { "hop-RadioField": "RadioField-module__hop-RadioField___7cWiA", "hop-RadioField--sm": "RadioField-module__hop-RadioField--sm___Q6gn3", "hop-RadioField--md": "RadioField-module__hop-RadioField--md___mzMoL", "hop-RadioField__description": "RadioField-module__hop-RadioField__description___-wcF0", "hop-RadioField__radio": "RadioField-module__hop-RadioField__radio___yCxtZ" };
 var GlobalRadioFieldCssSelector = "hop-RadioField";
 var RadioToDescriptionSizeAdapter = {
   sm: "xs",

package/dist/{chunk-EJUIYBAC.js → chunk-SSDFINDD.js}

@@ -1,7 +1,7 @@
+import { RadioFieldContext } from './chunk-DGLAGYBD.js';
 import { RadioGroupContext } from './chunk-5MBJWRZD.js';
 import { RadioListContext } from './chunk-A7TZHALP.js';
 import { RadioContext } from './chunk-FU5CCPLP.js';
-import { RadioFieldContext } from './chunk-DGLAGYBD.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { HelperMessageContext } from './chunk-HZKFQ33E.js';
@@ -14,7 +14,7 @@ import { useContextProps, composeRenderProps, RadioGroup as RadioGroup$1 } from
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./RadioGroup.module.css#css-module
-var RadioGroup_module_default = { "hop-RadioGroup": "RadioGroup-module__hop-RadioGroup___v9ff9", "hop-RadioGroup--bordered": "RadioGroup-module__hop-RadioGroup--bordered___R-avt", "hop-RadioGroup--sm": "RadioGroup-module__hop-RadioGroup--sm___y9WU9", "hop-RadioGroup--md": "RadioGroup-module__hop-RadioGroup--md___P8zUK", "hop-RadioGroup__label": "RadioGroup-module__hop-RadioGroup__label___jZY0d", "hop-RadioGroup__list": "RadioGroup-module__hop-RadioGroup__list___HGSkD", "hop-RadioGroup__radio": "RadioGroup-module__hop-RadioGroup__radio___8y02f", "hop-RadioGroup__error-message": "RadioGroup-module__hop-RadioGroup__error-message___2aZin", "hop-RadioGroup__helper-message": "RadioGroup-module__hop-RadioGroup__helper-message___ip2nD" };
+var RadioGroup_module_default = { "hop-RadioGroup": "RadioGroup-module__hop-RadioGroup___3D-CQ", "hop-RadioGroup--bordered": "RadioGroup-module__hop-RadioGroup--bordered___xUBDY", "hop-RadioGroup--sm": "RadioGroup-module__hop-RadioGroup--sm___Wuezk", "hop-RadioGroup--md": "RadioGroup-module__hop-RadioGroup--md___qDKnW", "hop-RadioGroup__label": "RadioGroup-module__hop-RadioGroup__label___RPhTV", "hop-RadioGroup__list": "RadioGroup-module__hop-RadioGroup__list___fsKD3", "hop-RadioGroup__radio": "RadioGroup-module__hop-RadioGroup__radio___uu6mp", "hop-RadioGroup__error-message": "RadioGroup-module__hop-RadioGroup__error-message___VVQJs", "hop-RadioGroup__helper-message": "RadioGroup-module__hop-RadioGroup__helper-message___0axK9" };
 var GlobalRadioGroupCssSelector = "hop-RadioGroup";
 function RadioGroup(props, ref) {
   var _a, _b;

package/dist/chunk-T24MBA34.js

@@ -0,0 +1,7 @@
+import { createContext } from 'react';
+
+// src/Select/src/SelectContext.ts
+var SelectContext = createContext({});
+SelectContext.displayName = "SelectContext";
+
+export { SelectContext };

package/dist/{chunk-RQKU3XDG.js → chunk-T37HTUEU.js}

@@ -10,7 +10,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./ButtonGroup.module.css#css-module
-var ButtonGroup_module_default = { "hop-ButtonGroup": "ButtonGroup-module__hop-ButtonGroup___pg9lD", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___IeYfB", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___20OwE", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___8cAOO", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___bXsRU", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___QRAcI", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___72Z7i", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___cVwde" };
+var ButtonGroup_module_default = { "hop-ButtonGroup": "ButtonGroup-module__hop-ButtonGroup___V-GZD", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___ZRbG5", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___v3JGj", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___sc1iw", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___hfVSv", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___OwOEL", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___lgR5H", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___M4OVp" };
 var GlobalButtonGroupCssSelector = "hop-ButtonGroup";
 function ButtonGroup(props, ref) {
   var _a, _b, _c, _d, _e;

package/dist/{chunk-UT4CSUUM.js → chunk-T3CLGQI6.js}

@@ -7,7 +7,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./ListBoxItemSkeleton.module.css#css-module
-var ListBoxItemSkeleton_module_default = { "hop-ListBoxItemSkeleton": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton___wrIL3", "placeholder-shimmer": "ListBoxItemSkeleton-module__placeholder-shimmer___kPWk2", "hop-ListBoxItemSkeleton--xs": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--xs___cHo6m", "hop-ListBoxItemSkeleton--sm": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--sm___Kyk8k", "hop-ListBoxItemSkeleton--md": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--md___a5cds", "hop-ListBoxItemSkeleton--lg": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--lg___dn0c2" };
+var ListBoxItemSkeleton_module_default = { "hop-ListBoxItemSkeleton": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton___TYOGA", "placeholder-shimmer": "ListBoxItemSkeleton-module__placeholder-shimmer___yey8v", "hop-ListBoxItemSkeleton--xs": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--xs___DQWyN", "hop-ListBoxItemSkeleton--sm": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--sm___dV4JT", "hop-ListBoxItemSkeleton--md": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--md___RExw1", "hop-ListBoxItemSkeleton--lg": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--lg___jni6f" };
 var GlobalListBoxItemSkeletonCssSelector = "hop-ListBoxItemSkeleton";
 function ListBoxItemSkeleton(props, ref) {
   var _a;

package/dist/{chunk-BKCMCC7V.js → chunk-T742LIIS.js}

@@ -11,7 +11,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./CheckboxField.module.css#css-module
-var CheckboxField_module_default = { "hop-CheckboxField": "CheckboxField-module__hop-CheckboxField___5uBr4", "hop-CheckboxField--sm": "CheckboxField-module__hop-CheckboxField--sm___xPpv7", "hop-CheckboxField--md": "CheckboxField-module__hop-CheckboxField--md___QtMwz", "hop-CheckboxField__description": "CheckboxField-module__hop-CheckboxField__description___6r3ox", "hop-CheckboxField__checkbox": "CheckboxField-module__hop-CheckboxField__checkbox___4P-Q8" };
+var CheckboxField_module_default = { "hop-CheckboxField": "CheckboxField-module__hop-CheckboxField___EeawF", "hop-CheckboxField--sm": "CheckboxField-module__hop-CheckboxField--sm___QGCXc", "hop-CheckboxField--md": "CheckboxField-module__hop-CheckboxField--md___Qm0Er", "hop-CheckboxField__description": "CheckboxField-module__hop-CheckboxField__description___TlNzS", "hop-CheckboxField__checkbox": "CheckboxField-module__hop-CheckboxField__checkbox___srYzU" };
 var GlobalCheckboxFieldCssSelector = "hop-CheckboxField";
 var CheckboxToDescriptionSizeAdapter = {
   sm: "xs",

package/dist/{chunk-F4H76S4H.js → chunk-TFVDF4YH.js}

@@ -14,7 +14,8 @@ var require_en_US = __commonJS({
       "ListBoxItem.loadingTextValue": `Loading Item`,
       "ListBoxItem.indicatorAriaLabel": `List Item Selection Indicator`,
       "Label.necessityLabel.required": `Required`,
-      "Label.necessityLabel.optional": `Optional`
+      "Label.necessityLabel.optional": `Optional`,
+      "Select.placeholder": `Select an item`
     };
   }
 });
@@ -32,7 +33,8 @@ var require_fr_CA = __commonJS({
       "ListBoxItem.loadingTextValue": `\xC9l\xE9ment en cours de chargement`,
       "ListBoxItem.indicatorAriaLabel": `Indicateur de s\xE9lection d'\xE9l\xE9ment de liste`,
       "Label.necessityLabel.required": `Obligatoire`,
-      "Label.necessityLabel.optional": `Facultatif`
+      "Label.necessityLabel.optional": `Facultatif`,
+      "Select.placeholder": `S\xE9lectionner un \xE9l\xE9ment`
     };
   }
 });

package/dist/{chunk-U56LEEEA.js → chunk-TOWSC7FO.js}

@@ -1,12 +1,12 @@
 import { useSlot } from './chunk-H5YTU3U7.js';
+import { _Spinner } from './chunk-3573Q6QG.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
-import { _Spinner } from './chunk-CKKLDA5J.js';
-import { useLocalizedString } from './chunk-F4H76S4H.js';
+import { useLocalizedString } from './chunk-TFVDF4YH.js';
 import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { IconListContext } from './chunk-DHVVYSLB.js';
 import { useRenderProps } from './chunk-NH3IVMXB.js';
-import { _Text } from './chunk-XT2MZWEV.js';
+import { _Text } from './chunk-D5PBETXF.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
@@ -19,7 +19,7 @@ import { useContextProps, ButtonContext as ButtonContext$1, composeRenderProps,
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 // css-module:./Button.module.css#css-module
-var Button_module_default = { "hop-Button": "Button-module__hop-Button___ot9lw", "hop-Button--icon-only": "Button-module__hop-Button--icon-only___i5ahP", "hop-Button--fluid": "Button-module__hop-Button--fluid___7p5MN", "hop-Button--sm": "Button-module__hop-Button--sm___8f5C7", "hop-Button--primary": "Button-module__hop-Button--primary___eGhk1", "hop-Button--md": "Button-module__hop-Button--md___Nq4Ho", "hop-Button--secondary": "Button-module__hop-Button--secondary___EK4MQ", "hop-Button--upsell": "Button-module__hop-Button--upsell___tKts9", "hop-Button--danger": "Button-module__hop-Button--danger___kCc82", "hop-Button--ghost-danger": "Button-module__hop-Button--ghost-danger___p0AWu", "hop-Button--ghost-secondary": "Button-module__hop-Button--ghost-secondary___Mh--L", "hop-Button--ghost-primary": "Button-module__hop-Button--ghost-primary___bHqEG", "hop-Button__Spinner": "Button-module__hop-Button__Spinner___pYUr5", "hop-Button__icon": "Button-module__hop-Button__icon___8a7Yy", "hop-Button__icon-list": "Button-module__hop-Button__icon-list___7KNrU", "hop-Button__text": "Button-module__hop-Button__text___a4lmJ", "hop-Button__end-icon": "Button-module__hop-Button__end-icon___oJS-s", "hop-Button__end-icon-list": "Button-module__hop-Button__end-icon-list___iyDSw" };
+var Button_module_default = { "hop-Button": "Button-module__hop-Button___mVpRP", "hop-Button--icon-only": "Button-module__hop-Button--icon-only___xAh-6", "hop-Button--fluid": "Button-module__hop-Button--fluid___EFWA-", "hop-Button--sm": "Button-module__hop-Button--sm___-ue3C", "hop-Button--primary": "Button-module__hop-Button--primary___EKPMl", "hop-Button--md": "Button-module__hop-Button--md___BDVkz", "hop-Button--secondary": "Button-module__hop-Button--secondary___bcVUb", "hop-Button--upsell": "Button-module__hop-Button--upsell___6nknl", "hop-Button--danger": "Button-module__hop-Button--danger___MkovL", "hop-Button--ghost-danger": "Button-module__hop-Button--ghost-danger___zlbPD", "hop-Button--ghost-secondary": "Button-module__hop-Button--ghost-secondary___l-orO", "hop-Button--ghost-primary": "Button-module__hop-Button--ghost-primary___F6-yL", "hop-Button__Spinner": "Button-module__hop-Button__Spinner___1RnXX", "hop-Button__icon": "Button-module__hop-Button__icon___MFwf2", "hop-Button__icon-list": "Button-module__hop-Button__icon-list___jC-21", "hop-Button__text": "Button-module__hop-Button__text___ebwCf", "hop-Button__end-icon": "Button-module__hop-Button__end-icon___oyHTu", "hop-Button__end-icon-list": "Button-module__hop-Button__end-icon-list___1U3mE" };
 var GlobalButtonCssSelector = "hop-Button";
 var additionalButtonHTMLAttributes = /* @__PURE__ */ new Set(["form", "formAction", "formEncType", "formMethod", "formNoValidate", "formTarget", "name", "value"]);
 function useSimulatedRACButton(props, ref) {

package/dist/{chunk-J44DIB5J.js → chunk-TTY5HDLL.js}

@@ -2,7 +2,7 @@ import { RadioContext } from './chunk-FU5CCPLP.js';
 import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { IconListContext } from './chunk-DHVVYSLB.js';
-import { _Text } from './chunk-XT2MZWEV.js';
+import { _Text } from './chunk-D5PBETXF.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
@@ -14,7 +14,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___2E1Ba", "hop-Radio--focused": "Radio-module__hop-Radio--focused___uZjvZ", "hop-Radio--hovered": "Radio-module__hop-Radio--hovered___I3nXi", "hop-Radio--pressed": "Radio-module__hop-Radio--pressed___g-XN4", "hop-Radio--sm": "Radio-module__hop-Radio--sm___fb-Zv", "hop-Radio--md": "Radio-module__hop-Radio--md___WvIhk", "hop-Radio__icon": "Radio-module__hop-Radio__icon___f49M7", "hop-Radio__icon-list": "Radio-module__hop-Radio__icon-list___65C4k", "hop-Radio__box": "Radio-module__hop-Radio__box___HLxF3", "hop-Radio__bullet": "Radio-module__hop-Radio__bullet___SgKK1", "hop-Radio__text": "Radio-module__hop-Radio__text___uZHkI" };
+var Radio_module_default = { "hop-Radio": "Radio-module__hop-Radio___8KZXA", "hop-Radio--focused": "Radio-module__hop-Radio--focused___UOv6k", "hop-Radio--hovered": "Radio-module__hop-Radio--hovered___3648m", "hop-Radio--pressed": "Radio-module__hop-Radio--pressed___M5r4O", "hop-Radio--sm": "Radio-module__hop-Radio--sm___9nkSB", "hop-Radio--md": "Radio-module__hop-Radio--md___FD8ks", "hop-Radio__icon": "Radio-module__hop-Radio__icon___Axpaq", "hop-Radio__icon-list": "Radio-module__hop-Radio__icon-list___TH7pN", "hop-Radio__box": "Radio-module__hop-Radio__box___wDQH6", "hop-Radio__bullet": "Radio-module__hop-Radio__bullet___oXHWw", "hop-Radio__text": "Radio-module__hop-Radio__text___Kqa3G" };
 var GlobalRadioCssSelector = "hop-Radio";
 function Radio(props, ref) {
   var _a;