@hopper-ui/components 1.0.5 → 1.0.7

package/dist/{chunk-ANVMQBBG.js → chunk-NMKBUGSO.js}

@@ -26,7 +26,18 @@ var HopperProvider = (props, ref) => {
   if (navigate) {
     content = /* @__PURE__ */ jsx(RouterProvider, { navigate, useHref, children });
   }
-  return /* @__PURE__ */ jsx(StyledSystemProvider, { ref, withBodyStyle, colorScheme, withCssVariables, className: classNames, ...rest, children: /* @__PURE__ */ jsx(I18nProvider, { locale, children: content }) });
+  return /* @__PURE__ */ jsx(
+    StyledSystemProvider,
+    {
+      ref,
+      withBodyStyle,
+      colorScheme,
+      withCssVariables,
+      className: classNames,
+      ...rest,
+      children: /* @__PURE__ */ jsx(I18nProvider, { locale, children: content })
+    }
+  );
 };
 var _HopperProvider = forwardRef(HopperProvider);
 _HopperProvider.displayName = "HopperProvider";

package/dist/{chunk-BD53A2LL.js → chunk-NQOLP5NY.js}

@@ -1,12 +1,12 @@
 import { RadioContext } from './chunk-FU5CCPLP.js';
-import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
 import { IconListContext } from './chunk-DHVVYSLB.js';
-import { _Text } from './chunk-7Q7VIED2.js';
-import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
+import { _Text } from './chunk-E7Y25WJE.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
-import { cssModule } from './chunk-KVDXQMWI.js';
+import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
 import { BulletIcon, IconContext } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import { forwardRef } from 'react';
@@ -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___U2zYL", "hop-Radio--sm": "Radio-module__hop-Radio--sm___ienBb", "hop-Radio--md": "Radio-module__hop-Radio--md___beRv8", "hop-Radio__icon": "Radio-module__hop-Radio__icon___SznKf", "hop-Radio__icon-list": "Radio-module__hop-Radio__icon-list___Hcdqe", "hop-Radio__box": "Radio-module__hop-Radio__box___b7BN6", "hop-Radio__bullet": "Radio-module__hop-Radio__bullet___Gh9LA", "hop-Radio__text": "Radio-module__hop-Radio__text___M4Ezd" };
+var Radio_module_default = { "hop-Radio": "Radio-module__hop-Radio___tvFFT", "hop-Radio--focused": "Radio-module__hop-Radio--focused___qmLB6", "hop-Radio--hovered": "Radio-module__hop-Radio--hovered___vZ50W", "hop-Radio--pressed": "Radio-module__hop-Radio--pressed___wBVf6", "hop-Radio--sm": "Radio-module__hop-Radio--sm___5kxPW", "hop-Radio--md": "Radio-module__hop-Radio--md___4M0c-", "hop-Radio__icon": "Radio-module__hop-Radio__icon___Fgjja", "hop-Radio__icon-list": "Radio-module__hop-Radio__icon-list___bQRXR", "hop-Radio__box": "Radio-module__hop-Radio__box___FserC", "hop-Radio__bullet": "Radio-module__hop-Radio__bullet___k73mE", "hop-Radio__text": "Radio-module__hop-Radio__text___qi3fJ" };
 var GlobalRadioCssSelector = "hop-Radio";
 function Radio(props, ref) {
   var _a;
@@ -25,6 +25,9 @@ function Radio(props, ref) {
     children: childrenProp,
     size: sizeProp = "md",
     style: styleProp,
+    isPressed,
+    isHovered,
+    isFocused,
     ...otherProps
   } = ownProps;
   const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "md";
@@ -34,7 +37,10 @@ function Radio(props, ref) {
     cssModule(
       Radio_module_default,
       "hop-Radio",
-      size
+      size,
+      isPressed && "pressed",
+      isHovered && "hovered",
+      isFocused && "focused"
     ),
     stylingProps.className
   );

package/dist/chunk-O5PTD6IN.js

@@ -0,0 +1,41 @@
+import { SectionContext } from './chunk-5H5AZJPQ.js';
+import { useStyledSystem } from '@hopper-ui/styled-system';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { useContextProps, Section as Section$1 } from 'react-aria-components';
+import { jsx } from 'react/jsx-runtime';
+
+var GlobalSectionCssSelector = "hop-Section";
+function Section(props, ref) {
+  [props, ref] = useContextProps(props, ref, SectionContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    children,
+    style,
+    ...otherProps
+  } = ownProps;
+  const classNames = clsx(
+    GlobalSectionCssSelector,
+    stylingProps.className,
+    className
+  );
+  const mergedStyles = {
+    ...stylingProps.style,
+    ...style
+  };
+  return /* @__PURE__ */ jsx(
+    Section$1,
+    {
+      ...otherProps,
+      ref,
+      className: classNames,
+      style: mergedStyles,
+      children
+    }
+  );
+}
+var _Section = forwardRef(Section);
+_Section.displayName = "Section";
+
+export { GlobalSectionCssSelector, _Section };

package/dist/{chunk-LUAIMTPE.js → chunk-OKAYIZ45.js}

@@ -1,15 +1,15 @@
 import { useSlot } from './chunk-H5YTU3U7.js';
-import { useRenderProps } from './chunk-NH3IVMXB.js';
-import { useLocalizedString } from './chunk-H6CDFWVR.js';
-import { _Spinner } from './chunk-BVGKXCQH.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
-import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
+import { _Spinner } from './chunk-XVKZ3Q3B.js';
+import { useLocalizedString } from './chunk-YEYNRBMQ.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
 import { IconListContext } from './chunk-DHVVYSLB.js';
-import { _Text } from './chunk-7Q7VIED2.js';
+import { _Text } from './chunk-E7Y25WJE.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
-import { cssModule } from './chunk-KVDXQMWI.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
 import { IconContext } from '@hopper-ui/icons';
 import { slot, useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import { chain, filterDOMProps, useRouter, shouldClientNavigate } from '@react-aria/utils';
@@ -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___omxTR", "hop-Button--icon-only": "Button-module__hop-Button--icon-only___mAijh", "hop-Button--fluid": "Button-module__hop-Button--fluid___tJx6A", "hop-Button--sm": "Button-module__hop-Button--sm___jBmjK", "hop-Button--primary": "Button-module__hop-Button--primary___GiYHc", "hop-Button--md": "Button-module__hop-Button--md___azhbR", "hop-Button--secondary": "Button-module__hop-Button--secondary___W9BWc", "hop-Button--upsell": "Button-module__hop-Button--upsell___RGRcm", "hop-Button--danger": "Button-module__hop-Button--danger___yqtna", "hop-Button--ghost-danger": "Button-module__hop-Button--ghost-danger___I3F3m", "hop-Button--ghost-secondary": "Button-module__hop-Button--ghost-secondary___kosyt", "hop-Button--ghost-primary": "Button-module__hop-Button--ghost-primary___fmoef", "hop-Button__Spinner": "Button-module__hop-Button__Spinner___Ib9EV", "hop-Button__icon": "Button-module__hop-Button__icon___zdZvL", "hop-Button__icon-list": "Button-module__hop-Button__icon-list___QHAI7", "hop-Button__text": "Button-module__hop-Button__text___NfHmc", "hop-Button__end-icon": "Button-module__hop-Button__end-icon___exbfl", "hop-Button__end-icon-list": "Button-module__hop-Button__end-icon-list___yyYdR" };
+var Button_module_default = { "hop-Button": "Button-module__hop-Button___UAzFm", "hop-Button--icon-only": "Button-module__hop-Button--icon-only___05dkO", "hop-Button--fluid": "Button-module__hop-Button--fluid___YVpDX", "hop-Button--sm": "Button-module__hop-Button--sm___gvwId", "hop-Button--primary": "Button-module__hop-Button--primary___A28Rq", "hop-Button--md": "Button-module__hop-Button--md___M3MyD", "hop-Button--secondary": "Button-module__hop-Button--secondary___u0ZGt", "hop-Button--upsell": "Button-module__hop-Button--upsell___arFHv", "hop-Button--danger": "Button-module__hop-Button--danger___lL8-r", "hop-Button--ghost-danger": "Button-module__hop-Button--ghost-danger___X4kNh", "hop-Button--ghost-secondary": "Button-module__hop-Button--ghost-secondary___aN7yP", "hop-Button--ghost-primary": "Button-module__hop-Button--ghost-primary___vBKjd", "hop-Button__Spinner": "Button-module__hop-Button__Spinner___kL-1-", "hop-Button__icon": "Button-module__hop-Button__icon___iMiLP", "hop-Button__icon-list": "Button-module__hop-Button__icon-list___zInte", "hop-Button__text": "Button-module__hop-Button__text___OyaRf", "hop-Button__end-icon": "Button-module__hop-Button__end-icon___noDbN", "hop-Button__end-icon-list": "Button-module__hop-Button__end-icon-list___mFNXl" };
 var GlobalButtonCssSelector = "hop-Button";
 var additionalButtonHTMLAttributes = /* @__PURE__ */ new Set(["form", "formAction", "formEncType", "formMethod", "formNoValidate", "formTarget", "name", "value"]);
 function useSimulatedRACButton(props, ref) {

package/dist/chunk-OKZYR4RF.js

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

package/dist/{chunk-CP4AWOFU.js → chunk-QACERXDV.js}

@@ -1,5 +1,5 @@
-import { cssModule } from './chunk-KVDXQMWI.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
 import { RichIconAvatarImageContext } from './chunk-JWW56J7M.js';
 import { RichIconContext } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
@@ -9,7 +9,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./RichIconAvatarImage.module.css#css-module
-var RichIconAvatarImage_module_default = { "hop-RichIconAvatarImage": "RichIconAvatarImage-module__hop-RichIconAvatarImage___oV9WF", "hop-RichIconAvatarImage--xs": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xs___kdGVl", "hop-RichIconAvatarImage--sm": "RichIconAvatarImage-module__hop-RichIconAvatarImage--sm___4WUqP", "hop-RichIconAvatarImage--md": "RichIconAvatarImage-module__hop-RichIconAvatarImage--md___fsiew", "hop-RichIconAvatarImage--lg": "RichIconAvatarImage-module__hop-RichIconAvatarImage--lg___BJtzS", "hop-RichIconAvatarImage--xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xl___MFhsm", "hop-RichIconAvatarImage--2xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--2xl___jFtFa", "hop-RichIconAvatarImage__icon": "RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___9-bD3" };
+var RichIconAvatarImage_module_default = { "hop-RichIconAvatarImage": "RichIconAvatarImage-module__hop-RichIconAvatarImage___r1-2L", "hop-RichIconAvatarImage--xs": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xs___exS4L", "hop-RichIconAvatarImage--sm": "RichIconAvatarImage-module__hop-RichIconAvatarImage--sm___tjY3E", "hop-RichIconAvatarImage--md": "RichIconAvatarImage-module__hop-RichIconAvatarImage--md___7bEZJ", "hop-RichIconAvatarImage--lg": "RichIconAvatarImage-module__hop-RichIconAvatarImage--lg___IXng-", "hop-RichIconAvatarImage--xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xl___8tAP7", "hop-RichIconAvatarImage--2xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--2xl___2PYru", "hop-RichIconAvatarImage__icon": "RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___aE4RN" };
 var GlobalRichIconAvatarImageCssSelector = "hop-RichIconAvatarImage";
 var AvatarToIconSizeAdapter = {
   xs: "md",

package/dist/{chunk-FYDLV5BM.js → chunk-R2UVMOIP.js}

@@ -1,5 +1,5 @@
 import { AvatarContext } from './chunk-AES7QBQE.js';
-import { _RichIconAvatarImage } from './chunk-CP4AWOFU.js';
+import { _RichIconAvatarImage } from './chunk-QACERXDV.js';
 import { AnonymousRichIcon } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import clsx from 'clsx';

package/dist/chunk-RW4GDPRX.js

@@ -0,0 +1,52 @@
+import { ListBoxItemSkeletonContext } from './chunk-OKZYR4RF.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+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___j-yVV", "placeholder-shimmer": "ListBoxItemSkeleton-module__placeholder-shimmer___-EhAf", "hop-ListBoxItemSkeleton--xs": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--xs___vJ3Zw", "hop-ListBoxItemSkeleton--sm": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--sm___0NFkM", "hop-ListBoxItemSkeleton--md": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--md___Q1wFA", "hop-ListBoxItemSkeleton--lg": "ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--lg___EOBf9" };
+var GlobalListBoxItemSkeletonCssSelector = "hop-ListBoxItemSkeleton";
+function ListBoxItemSkeleton(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, ListBoxItemSkeletonContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    size: sizeProp,
+    style: styleProp,
+    slot,
+    ...otherProps
+  } = ownProps;
+  const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "sm";
+  const classNames = clsx(
+    className,
+    GlobalListBoxItemSkeletonCssSelector,
+    cssModule(
+      ListBoxItemSkeleton_module_default,
+      "hop-ListBoxItemSkeleton",
+      size
+    ),
+    stylingProps.className
+  );
+  const style = {
+    ...stylingProps.style,
+    ...styleProp
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...otherProps,
+      ref,
+      className: classNames,
+      style,
+      slot: slot != null ? slot : void 0
+    }
+  );
+}
+var _ListBoxItemSkeleton = forwardRef(ListBoxItemSkeleton);
+_ListBoxItemSkeleton.displayName = "ListBoxItemSkeleton";
+
+export { GlobalListBoxItemSkeletonCssSelector, _ListBoxItemSkeleton };

package/dist/{chunk-OPFRM3JC.js → chunk-SHVSB6MD.js}

@@ -1,8 +1,8 @@
-import { _Text } from './chunk-7Q7VIED2.js';
+import { useImageFallback } from './chunk-NS3XVOQ7.js';
+import { _Text } from './chunk-E7Y25WJE.js';
 import { AvatarContext } from './chunk-AES7QBQE.js';
-import { _RichIconAvatarImage } from './chunk-CP4AWOFU.js';
+import { _RichIconAvatarImage } from './chunk-QACERXDV.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
-import { useImageFallback } from './chunk-NS3XVOQ7.js';
 import { BrokenImageRichIcon } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import { filterDOMProps } from '@react-aria/utils';
@@ -12,7 +12,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Avatar.module.css#css-module
-var Avatar_module_default = { "hop-Avatar": "Avatar-module__hop-Avatar___d9YZ9", "hop-Avatar--xs": "Avatar-module__hop-Avatar--xs___BWHEr", "hop-Avatar--sm": "Avatar-module__hop-Avatar--sm___fNWQO", "hop-Avatar--md": "Avatar-module__hop-Avatar--md___-6GnY", "hop-Avatar--lg": "Avatar-module__hop-Avatar--lg___f8yyT", "hop-Avatar--xl": "Avatar-module__hop-Avatar--xl___r5PUt", "hop-Avatar--2xl": "Avatar-module__hop-Avatar--2xl___CG0YD", "hop-Avatar--decorative-option1": "Avatar-module__hop-Avatar--decorative-option1___OIRSj", "hop-Avatar--decorative-option2": "Avatar-module__hop-Avatar--decorative-option2___-uwSb", "hop-Avatar--decorative-option3": "Avatar-module__hop-Avatar--decorative-option3___xhe3G", "hop-Avatar--decorative-option4": "Avatar-module__hop-Avatar--decorative-option4___e38Gs", "hop-Avatar--decorative-option5": "Avatar-module__hop-Avatar--decorative-option5___-GQzw", "hop-Avatar--decorative-option6": "Avatar-module__hop-Avatar--decorative-option6___CeiJh", "hop-Avatar--decorative-option7": "Avatar-module__hop-Avatar--decorative-option7___nvuXB", "hop-Avatar--decorative-option8": "Avatar-module__hop-Avatar--decorative-option8___Q4Z9Z", "hop-Avatar--decorative-option9": "Avatar-module__hop-Avatar--decorative-option9___TsOBZ", "hop-Avatar__image": "Avatar-module__hop-Avatar__image___6YUZZ" };
+var Avatar_module_default = { "hop-Avatar": "Avatar-module__hop-Avatar___xgLGn", "hop-Avatar--xs": "Avatar-module__hop-Avatar--xs___71MWt", "hop-Avatar--sm": "Avatar-module__hop-Avatar--sm___-VT24", "hop-Avatar--md": "Avatar-module__hop-Avatar--md___DhOit", "hop-Avatar--lg": "Avatar-module__hop-Avatar--lg___LhUBE", "hop-Avatar--xl": "Avatar-module__hop-Avatar--xl___nRU6l", "hop-Avatar--2xl": "Avatar-module__hop-Avatar--2xl___EvIhQ", "hop-Avatar--decorative-option1": "Avatar-module__hop-Avatar--decorative-option1___tJoic", "hop-Avatar--decorative-option2": "Avatar-module__hop-Avatar--decorative-option2___J6Alx", "hop-Avatar--decorative-option3": "Avatar-module__hop-Avatar--decorative-option3___PFZAI", "hop-Avatar--decorative-option4": "Avatar-module__hop-Avatar--decorative-option4___eUcwp", "hop-Avatar--decorative-option5": "Avatar-module__hop-Avatar--decorative-option5___ICYLl", "hop-Avatar--decorative-option6": "Avatar-module__hop-Avatar--decorative-option6___R0WGe", "hop-Avatar--decorative-option7": "Avatar-module__hop-Avatar--decorative-option7___iAAz0", "hop-Avatar--decorative-option8": "Avatar-module__hop-Avatar--decorative-option8___p03Dg", "hop-Avatar--decorative-option9": "Avatar-module__hop-Avatar--decorative-option9___DkcTO", "hop-Avatar__image": "Avatar-module__hop-Avatar__image___EMxQb" };
 var GlobalAvatarCssSelector = "hop-Avatar";
 var AvatarToTextSizeAdapter = {
   xs: "xs",

package/dist/{chunk-KQPY2D3P.js → chunk-SSCPXYN6.js}

@@ -1,20 +1,20 @@
-import { ErrorMessageContext } from './chunk-ACVMW6YD.js';
-import { HelperMessageContext } from './chunk-ESVVLTEN.js';
+import { CheckboxListContext } from './chunk-WDUQUPTE.js';
 import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
 import { CheckboxGroupContext } from './chunk-N7YDPVZL.js';
-import { CheckboxListContext } from './chunk-WDUQUPTE.js';
 import { CheckboxContext } from './chunk-2EAZPH3M.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
-import { cssModule } from './chunk-KVDXQMWI.js';
+import { HelperMessageContext } from './chunk-HZKFQ33E.js';
+import { ErrorMessageContext } from './chunk-FAE27DLF.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import { forwardRef } from 'react';
 import { useContextProps, composeRenderProps, CheckboxGroup as CheckboxGroup$1 } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./CheckboxGroup.module.css#css-module
-var CheckboxGroup_module_default = { "hop-CheckboxGroup": "CheckboxGroup-module__hop-CheckboxGroup___RPSFN", "hop-CheckboxGroup--bordered": "CheckboxGroup-module__hop-CheckboxGroup--bordered___JQ1vq", "hop-CheckboxGroup--sm": "CheckboxGroup-module__hop-CheckboxGroup--sm___toUIA", "hop-CheckboxGroup--md": "CheckboxGroup-module__hop-CheckboxGroup--md___WTdo9", "hop-CheckboxGroup__label": "CheckboxGroup-module__hop-CheckboxGroup__label___03x3Q", "hop-CheckboxGroup__list": "CheckboxGroup-module__hop-CheckboxGroup__list___Q9VIf", "hop-CheckboxGroup__checkbox": "CheckboxGroup-module__hop-CheckboxGroup__checkbox___dEHSn", "hop-CheckboxGroup__error-message": "CheckboxGroup-module__hop-CheckboxGroup__error-message___EKYu4", "hop-CheckboxGroup__helper-message": "CheckboxGroup-module__hop-CheckboxGroup__helper-message___gDUBN" };
+var CheckboxGroup_module_default = { "hop-CheckboxGroup": "CheckboxGroup-module__hop-CheckboxGroup___IJEPv", "hop-CheckboxGroup--bordered": "CheckboxGroup-module__hop-CheckboxGroup--bordered___xnlV3", "hop-CheckboxGroup--sm": "CheckboxGroup-module__hop-CheckboxGroup--sm___kPe9U", "hop-CheckboxGroup--md": "CheckboxGroup-module__hop-CheckboxGroup--md___AGdL-", "hop-CheckboxGroup__label": "CheckboxGroup-module__hop-CheckboxGroup__label___GHPL-", "hop-CheckboxGroup__list": "CheckboxGroup-module__hop-CheckboxGroup__list___n1ORj", "hop-CheckboxGroup__checkbox": "CheckboxGroup-module__hop-CheckboxGroup__checkbox___3H5YY", "hop-CheckboxGroup__error-message": "CheckboxGroup-module__hop-CheckboxGroup__error-message___OgYjL", "hop-CheckboxGroup__helper-message": "CheckboxGroup-module__hop-CheckboxGroup__helper-message___dbWhu" };
 var GlobalCheckboxGroupCssSelector = "hop-CheckboxGroup";
 function CheckboxGroup(props, ref) {
   var _a, _b;

package/dist/chunk-SXPMPVDJ.js

@@ -0,0 +1,250 @@
+import { _RadioGroup } from './chunk-3WUDQLLR.js';
+import { _RadioList } from './chunk-NKHMUPAP.js';
+import { _Radio } from './chunk-NQOLP5NY.js';
+import { _Checkbox } from './chunk-2NJ3RDMJ.js';
+import { useLocalizedString } from './chunk-YEYNRBMQ.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { ListBoxItemContext } from './chunk-Y2POLIXK.js';
+import { _ListBoxItemSkeleton } from './chunk-RW4GDPRX.js';
+import { BadgeContext } from './chunk-CQDLZ42T.js';
+import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
+import { IconListContext } from './chunk-DHVVYSLB.js';
+import { _Text } from './chunk-E7Y25WJE.js';
+import { TextContext } from './chunk-X6SER3TZ.js';
+import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { CheckmarkIcon, IconContext } from '@hopper-ui/icons';
+import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import { forwardRef, useContext, useState } from 'react';
+import { useContextProps, composeRenderProps, ListBoxItem as ListBoxItem$1, ListStateContext, DEFAULT_SLOT } from 'react-aria-components';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// css-module:./ListBoxItem.module.css#css-module
+var ListBoxItem_module_default = { "hop-ListBoxItem": "ListBoxItem-module__hop-ListBoxItem___yV2lV", "hop-ListBoxItem--xs": "ListBoxItem-module__hop-ListBoxItem--xs___zojZL", "hop-ListBoxItem--sm": "ListBoxItem-module__hop-ListBoxItem--sm___pgMdo", "hop-ListBoxItem--md": "ListBoxItem-module__hop-ListBoxItem--md___scZYZ", "hop-ListBoxItem--lg": "ListBoxItem-module__hop-ListBoxItem--lg___RGvvE", "hop-ListBoxItem__inner": "ListBoxItem-module__hop-ListBoxItem__inner___wPFzb", "hop-ListBoxItem__checkmark": "ListBoxItem-module__hop-ListBoxItem__checkmark___ojOFi", "hop-ListBoxItem__description": "ListBoxItem-module__hop-ListBoxItem__description___wOYyA", "hop-ListBoxItem__radio-group": "ListBoxItem-module__hop-ListBoxItem__radio-group___neL2N", "hop-ListBoxItem__checkbox": "ListBoxItem-module__hop-ListBoxItem__checkbox___K1mdm", "hop-ListBoxItem__avatar": "ListBoxItem-module__hop-ListBoxItem__avatar___u30th", "hop-ListBoxItem__icon-list": "ListBoxItem-module__hop-ListBoxItem__icon-list___XfSik", "hop-ListBoxItem__icon": "ListBoxItem-module__hop-ListBoxItem__icon___NYKSZ", "hop-ListBoxItem__label": "ListBoxItem-module__hop-ListBoxItem__label___csfbD", "hop-ListBoxItem__end-icon-list": "ListBoxItem-module__hop-ListBoxItem__end-icon-list___nhfer", "hop-ListBoxItem__end-icon": "ListBoxItem-module__hop-ListBoxItem__end-icon___P9SLM", "hop-ListBoxItem__badge": "ListBoxItem-module__hop-ListBoxItem__badge___f9Zb9" };
+var GlobalListBoxItemCssSelector = "hop-ListBoxItem";
+var ListBoxItemToIconSizeAdapter = {
+  xs: "sm",
+  sm: "sm",
+  md: "md",
+  lg: "md"
+};
+var ListBoxItemToTextSizeAdapter = {
+  xs: "sm",
+  sm: "sm",
+  md: "sm",
+  lg: "md"
+};
+function ListBoxItemInner(props) {
+  const stringFormatter = useLocalizedString();
+  const listStateContext = useContext(ListStateContext);
+  const {
+    selectionMode,
+    isDisabled,
+    isFocusVisible,
+    isPressed,
+    isHovered,
+    isSelected,
+    selectionIndicator,
+    isInvalid,
+    size,
+    children
+  } = props;
+  const isRadio = selectionIndicator === "input" && selectionMode === "single";
+  const isCheckbox = selectionIndicator === "input" && selectionMode === "multiple";
+  const isCheck = selectionIndicator === "check" && selectionMode !== "none";
+  const isListHasSelection = listStateContext.selectionManager.selectedKeys.size > 0;
+  const [isListHasSelectionEnd, setIsListHasSelectionEnd] = useState(isListHasSelection);
+  const handleTransitionEnd = (event) => {
+    if (event.propertyName === "grid-template-columns") {
+      setIsListHasSelectionEnd((prev) => isListHasSelection && !prev);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: ListBoxItem_module_default["hop-ListBoxItem__inner"],
+      "data-list-has-selection": isListHasSelection || void 0,
+      "data-list-has-selection-end": isListHasSelectionEnd || void 0,
+      onTransitionEnd: handleTransitionEnd,
+      children: [
+        isRadio && /* @__PURE__ */ jsx(
+          _RadioGroup,
+          {
+            size: "sm",
+            "aria-hidden": "true",
+            "aria-label": stringFormatter.format("ListBoxItem.indicatorAriaLabel"),
+            value: isSelected ? "radio" : null,
+            className: ListBoxItem_module_default["hop-ListBoxItem__radio-group"],
+            isInvalid,
+            children: /* @__PURE__ */ jsx(_RadioList, { children: /* @__PURE__ */ jsx(
+              _Radio,
+              {
+                className: ListBoxItem_module_default["hop-ListBoxItem__radio"],
+                value: "radio",
+                isDisabled,
+                isFocused: isFocusVisible,
+                isHovered,
+                isPressed
+              }
+            ) })
+          }
+        ),
+        isCheckbox && /* @__PURE__ */ jsx(
+          _Checkbox,
+          {
+            size: "sm",
+            value: "checkbox",
+            "aria-hidden": "true",
+            className: ListBoxItem_module_default["hop-ListBoxItem__checkbox"],
+            isDisabled,
+            isFocused: isFocusVisible,
+            isHovered,
+            isPressed,
+            isSelected,
+            isInvalid
+          }
+        ),
+        isCheck && /* @__PURE__ */ jsx(CheckmarkIcon, { className: ListBoxItem_module_default["hop-ListBoxItem__checkmark"], size: "sm" }),
+        /* @__PURE__ */ jsx(
+          SlotProvider,
+          {
+            values: [
+              [TextContext, {
+                slots: {
+                  [DEFAULT_SLOT]: {
+                    slot: "label",
+                    className: ListBoxItem_module_default["hop-ListBoxItem__label"],
+                    size: ListBoxItemToTextSizeAdapter[size]
+                  },
+                  label: {
+                    className: ListBoxItem_module_default["hop-ListBoxItem__label"],
+                    size: ListBoxItemToTextSizeAdapter[size]
+                  },
+                  description: {
+                    className: ListBoxItem_module_default["hop-ListBoxItem__description"],
+                    size: "xs"
+                  }
+                }
+              }],
+              [IconListContext, {
+                slots: {
+                  [DEFAULT_SLOT]: {
+                    className: ListBoxItem_module_default["hop-ListBoxItem__icon-list"],
+                    size: ListBoxItemToIconSizeAdapter[size]
+                  },
+                  "end-icon": {
+                    className: ListBoxItem_module_default["hop-ListBoxItem__end-icon-list"],
+                    size: ListBoxItemToIconSizeAdapter[size]
+                  }
+                }
+              }],
+              [IconContext, {
+                slots: {
+                  [DEFAULT_SLOT]: {
+                    className: ListBoxItem_module_default["hop-ListBoxItem__icon"],
+                    size: ListBoxItemToIconSizeAdapter[size]
+                  },
+                  "end-icon": {
+                    className: ListBoxItem_module_default["hop-ListBoxItem__end-icon"],
+                    size: ListBoxItemToIconSizeAdapter[size]
+                  }
+                }
+              }],
+              [BadgeContext, {
+                className: ListBoxItem_module_default["hop-ListBoxItem__badge"],
+                isDisabled
+              }]
+            ],
+            children
+          }
+        )
+      ]
+    }
+  );
+}
+function ListBoxItem(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, ListBoxItemContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    children: childrenProp,
+    isDisabled,
+    isInvalid,
+    isLoading,
+    size: sizeProp,
+    style: styleProp,
+    textValue: textValueProp,
+    selectionIndicator,
+    ...otherProps
+  } = ownProps;
+  const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "sm";
+  const textValue = textValueProp != null ? textValueProp : typeof childrenProp === "string" ? childrenProp : void 0;
+  const classNames = composeClassnameRenderProps(
+    className,
+    GlobalListBoxItemCssSelector,
+    cssModule(
+      ListBoxItem_module_default,
+      "hop-ListBoxItem",
+      size,
+      selectionIndicator
+    ),
+    stylingProps.className
+  );
+  const style = composeRenderProps(styleProp, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const children = composeRenderProps(childrenProp, (prev) => {
+    if (prev && isTextOnlyChildren(prev)) {
+      return /* @__PURE__ */ jsx(_Text, { slot: "label", children: prev });
+    }
+    return prev;
+  });
+  return /* @__PURE__ */ jsx(
+    ListBoxItem$1,
+    {
+      ...otherProps,
+      ref,
+      className: classNames,
+      style,
+      textValue,
+      isDisabled: isLoading || isDisabled,
+      "data-invalid": isInvalid || void 0,
+      "data-loading": isLoading || void 0,
+      children: (listBoxItemProps) => {
+        if (isLoading) {
+          return /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: ListBoxItem_module_default["hop-ListBoxItem__inner"],
+              children: /* @__PURE__ */ jsx(
+                _ListBoxItemSkeleton,
+                {
+                  size,
+                  slot: "label"
+                }
+              )
+            }
+          );
+        }
+        return /* @__PURE__ */ jsx(
+          ListBoxItemInner,
+          {
+            ...listBoxItemProps,
+            selectionIndicator,
+            isInvalid,
+            size,
+            children: children(listBoxItemProps)
+          }
+        );
+      }
+    }
+  );
+}
+var _ListBoxItem = forwardRef(ListBoxItem);
+_ListBoxItem.displayName = "ListBoxItem";
+
+export { GlobalListBoxItemCssSelector, _ListBoxItem };