@hopper-ui/components 1.3.4 → 1.3.6

package/dist/{chunk-24TFXRVQ.js → chunk-NUB4BYRF.js}

@@ -1,10 +1,12 @@
 import { AvatarContext } from './chunk-AES7QBQE.js';
-import { _RichIconAvatarImage } from './chunk-TXW35G4W.js';
+import { _RichIconAvatarImage } from './chunk-NZKS5OKD.js';
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { AnonymousRichIcon } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
-import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useContextProps } from 'react-aria-components';
+import { mergeProps } from 'react-aria';
+import { useContextProps, composeRenderProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 var GlobalAnonymousAvatarCssSelector = "hop-AnonymousAvatar";
@@ -14,28 +16,36 @@ function AnonymousAvatar(props, ref) {
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
     className,
-    size: sizeValue,
     style,
+    size: sizeValue,
     ...otherProps
   } = ownProps;
   const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
-  const classNames = clsx(
+  const classNames = composeClassnameRenderProps(
     className,
     GlobalAnonymousAvatarCssSelector,
     stylingProps.className
   );
-  const mergedStyles = {
-    ...stylingProps.style,
-    ...style
-  };
+  const mergedStyles = composeRenderProps(style, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const renderProps = useRenderProps({
+    ...otherProps,
+    className: classNames,
+    style: mergedStyles,
+    values: {
+      isDisabled: props.isDisabled || false
+    }
+  });
   return /* @__PURE__ */ jsx(
     _RichIconAvatarImage,
     {
-      ...otherProps,
-      className: classNames,
+      ...mergeProps(otherProps, renderProps),
       ref,
       size,
-      style: mergedStyles,
       children: /* @__PURE__ */ jsx(AnonymousRichIcon, {})
     }
   );

package/dist/{chunk-TXW35G4W.js → chunk-NZKS5OKD.js}

@@ -1,15 +1,17 @@
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.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';
-import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useContextProps } from 'react-aria-components';
+import { mergeProps } from 'react-aria';
+import { useContextProps, composeRenderProps } 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___fkc4Q", "hop-RichIconAvatarImage--xs": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xs___aNzbC", "hop-RichIconAvatarImage--sm": "RichIconAvatarImage-module__hop-RichIconAvatarImage--sm___d3oUV", "hop-RichIconAvatarImage--md": "RichIconAvatarImage-module__hop-RichIconAvatarImage--md___yxjvO", "hop-RichIconAvatarImage--lg": "RichIconAvatarImage-module__hop-RichIconAvatarImage--lg___vWr2k", "hop-RichIconAvatarImage--xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xl___7jGcb", "hop-RichIconAvatarImage--2xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--2xl___sAhUb", "hop-RichIconAvatarImage__icon": "RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___8OyF9" };
+var RichIconAvatarImage_module_default = { "hop-RichIconAvatarImage": "RichIconAvatarImage-module__hop-RichIconAvatarImage___3-4v6", "hop-RichIconAvatarImage--xs": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xs___bQsOe", "hop-RichIconAvatarImage--sm": "RichIconAvatarImage-module__hop-RichIconAvatarImage--sm___XA19V", "hop-RichIconAvatarImage--md": "RichIconAvatarImage-module__hop-RichIconAvatarImage--md___xr-lR", "hop-RichIconAvatarImage--lg": "RichIconAvatarImage-module__hop-RichIconAvatarImage--lg___Xtfzn", "hop-RichIconAvatarImage--xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xl___fUQr1", "hop-RichIconAvatarImage--2xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--2xl___Qkwlw", "hop-RichIconAvatarImage__icon": "RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___-LdB5" };
 var GlobalRichIconAvatarImageCssSelector = "hop-RichIconAvatarImage";
 var AvatarToIconSizeAdapter = {
   xs: "md",
@@ -24,7 +26,6 @@ function RichIconAvatarImage(props, ref) {
   [props, ref] = useContextProps(props, ref, RichIconAvatarImageContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
-    children,
     className,
     isDisabled,
     style,
@@ -33,7 +34,7 @@ function RichIconAvatarImage(props, ref) {
     ...otherProps
   } = ownProps;
   const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
-  const classNames = clsx(
+  const classNames = composeClassnameRenderProps(
     className,
     GlobalRichIconAvatarImageCssSelector,
     cssModule(
@@ -43,20 +44,28 @@ function RichIconAvatarImage(props, ref) {
     ),
     stylingProps.className
   );
-  const mergedStyles = {
-    ...stylingProps.style,
-    ...style
-  };
+  const mergedStyles = composeRenderProps(style, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const renderProps = useRenderProps({
+    ...props,
+    className: classNames,
+    style: mergedStyles,
+    values: {
+      isDisabled: isDisabled || false
+    }
+  });
   if (!props["aria-label"] && !props["aria-labelledby"]) {
     console.warn("An aria-label or aria-labelledby prop is required for accessibility.");
   }
   return /* @__PURE__ */ jsx(
     "div",
     {
-      ...otherProps,
+      ...mergeProps(otherProps, renderProps),
       ref,
-      className: classNames,
-      style: mergedStyles,
       slot: slot != null ? slot : void 0,
       role: "img",
       "data-disabled": isDisabled || void 0,
@@ -69,7 +78,7 @@ function RichIconAvatarImage(props, ref) {
               size: AvatarToIconSizeAdapter[size]
             }]
           ],
-          children
+          children: renderProps.children
         }
       )
     }

package/dist/{chunk-LEG7NAKL.js → chunk-ODXA2UZN.js}

@@ -1,22 +1,23 @@
-import { _OverlineText } from './chunk-MDUON6B4.js';
+import { _OverlineText } from './chunk-EUXXCRBZ.js';
 import { BadgeContext } from './chunk-CQDLZ42T.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem } from '@hopper-ui/styled-system';
-import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useContextProps } from 'react-aria-components';
+import { mergeProps } from 'react-aria';
+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___R1VU8" };
+var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___RGKDc" };
 var GlobalBadgeCssSelector = "hop-Badge";
 function Badge(props, ref) {
   [props, ref] = useContextProps(props, ref, BadgeContext);
   const { isHovered, isPressed, isSelected } = props;
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
-    children,
     className,
     isDisabled,
     isIndeterminate,
@@ -25,8 +26,7 @@ function Badge(props, ref) {
     variant = "primary",
     ...otherProps
   } = ownProps;
-  const isDot = isIndeterminate || !children;
-  const classNames = clsx(
+  const classNames = composeClassnameRenderProps(
     className,
     GlobalBadgeCssSelector,
     cssModule(
@@ -35,17 +35,30 @@ function Badge(props, ref) {
     ),
     stylingProps.className
   );
-  const mergedStyles = {
-    ...stylingProps.style,
-    ...style
-  };
+  const mergedStyles = composeRenderProps(style, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const renderProps = useRenderProps({
+    ...props,
+    className: classNames,
+    style: mergedStyles,
+    values: {
+      isDisabled: isDisabled || false,
+      isIndeterminate: isIndeterminate || false,
+      isHovered: isHovered || false,
+      isPressed: isPressed || false,
+      isSelected: isSelected || false
+    }
+  });
+  const isDot = isIndeterminate || !renderProps.children;
   return /* @__PURE__ */ jsx(ClearContainerSlots, { children: /* @__PURE__ */ jsx(
     _OverlineText,
     {
-      ...otherProps,
+      ...mergeProps(otherProps, renderProps),
       ref,
-      className: classNames,
-      style: mergedStyles,
       slot: slot != null ? slot : void 0,
       "data-disabled": isDisabled || void 0,
       "aria-disabled": isDisabled || void 0,
@@ -54,7 +67,7 @@ function Badge(props, ref) {
       "data-pressed": isPressed || void 0,
       "data-selected": isSelected || void 0,
       "data-variant": variant,
-      children: !isDot && children
+      children: !isDot && renderProps.children
     }
   ) });
 }

package/dist/{chunk-XTQ3H3SE.js → chunk-OGIBVQFW.js}

@@ -1,17 +1,18 @@
 import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
 import { CheckboxContext } from './chunk-2EAZPH3M.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
-import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useId } from 'react-aria';
-import { useContextProps } from 'react-aria-components';
+import { useId, mergeProps } from 'react-aria';
+import { useContextProps, composeRenderProps } 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___Ishj0", "hop-CheckboxField--sm": "CheckboxField-module__hop-CheckboxField--sm___l02bq", "hop-CheckboxField--md": "CheckboxField-module__hop-CheckboxField--md___nSl-t", "hop-CheckboxField__description": "CheckboxField-module__hop-CheckboxField__description___-NlFz", "hop-CheckboxField__checkbox": "CheckboxField-module__hop-CheckboxField__checkbox___vIoFU" };
+var CheckboxField_module_default = { "hop-CheckboxField": "CheckboxField-module__hop-CheckboxField___vf1MO", "hop-CheckboxField--sm": "CheckboxField-module__hop-CheckboxField--sm___g7W5A", "hop-CheckboxField--md": "CheckboxField-module__hop-CheckboxField--md___4kKpo", "hop-CheckboxField__description": "CheckboxField-module__hop-CheckboxField__description___nhfiF", "hop-CheckboxField__checkbox": "CheckboxField-module__hop-CheckboxField__checkbox___6R77t" };
 var GlobalCheckboxFieldCssSelector = "hop-CheckboxField";
 var CheckboxToDescriptionSizeAdapter = {
   sm: "xs",
@@ -23,7 +24,6 @@ function CheckboxField(props, ref) {
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
     className,
-    children,
     isDisabled,
     size: sizeProp = "md",
     style,
@@ -31,7 +31,7 @@ function CheckboxField(props, ref) {
     ...otherProps
   } = ownProps;
   const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "md";
-  const classNames = clsx(
+  const classNames = composeClassnameRenderProps(
     className,
     GlobalCheckboxFieldCssSelector,
     cssModule(
@@ -41,10 +41,20 @@ function CheckboxField(props, ref) {
     ),
     stylingProps.className
   );
-  const mergedStyles = {
-    ...stylingProps.style,
-    ...style
-  };
+  const mergedStyles = composeRenderProps(style, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const renderProps = useRenderProps({
+    ...props,
+    className: classNames,
+    style: mergedStyles,
+    values: {
+      isDisabled: isDisabled || false
+    }
+  });
   const descriptionId = useId();
   return /* @__PURE__ */ jsx(
     SlotProvider,
@@ -65,13 +75,11 @@ function CheckboxField(props, ref) {
       children: /* @__PURE__ */ jsx(
         "div",
         {
-          ...otherProps,
+          ...mergeProps(otherProps, renderProps),
           ref,
-          className: classNames,
-          style: mergedStyles,
           slot: slot != null ? slot : void 0,
           "data-disabled": isDisabled,
-          children
+          children: renderProps.children
         }
       )
     }

package/dist/{chunk-L7K2RI3N.js → chunk-OMF56Z2Y.js}

@@ -1,6 +1,6 @@
+import { TagContext } from './chunk-EWMWQ2MC.js';
 import { TagGroupContext } from './chunk-LCAS3YQV.js';
 import { TagListContext } from './chunk-XLKYXKWE.js';
-import { TagContext } from './chunk-EWMWQ2MC.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { HelperMessageContext } from './chunk-HZKFQ33E.js';
 import { ErrorMessageContext } from './chunk-FAE27DLF.js';
@@ -13,7 +13,7 @@ import { useContextProps, FieldErrorContext, TagGroup as TagGroup$1 } from 'reac
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./TagGroup.module.css#css-module
-var TagGroup_module_default = { "hop-TagGroup": "TagGroup-module__hop-TagGroup___EG4ar", "hop-TagGroup__label": "TagGroup-module__hop-TagGroup__label___zzjLY", "hop-TagGroup__list": "TagGroup-module__hop-TagGroup__list___jXuw3", "hop-TagGroup__error-message": "TagGroup-module__hop-TagGroup__error-message___n8l-j", "hop-TagGroup__helper-message": "TagGroup-module__hop-TagGroup__helper-message___ZhhTu" };
+var TagGroup_module_default = { "hop-TagGroup": "TagGroup-module__hop-TagGroup___41aHV", "hop-TagGroup__label": "TagGroup-module__hop-TagGroup__label___wHna0", "hop-TagGroup__list": "TagGroup-module__hop-TagGroup__list___CGwly", "hop-TagGroup__error-message": "TagGroup-module__hop-TagGroup__error-message___Lhj6I", "hop-TagGroup__helper-message": "TagGroup-module__hop-TagGroup__helper-message___5mwOJ" };
 var GlobalTagGroupCssSelector = "hop-TagGroup";
 function TagGroup(props, ref) {
   var _a;

package/dist/{chunk-F2UGOH5F.js → chunk-PNWMICY7.js}

@@ -8,7 +8,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./IconList.module.css#css-module
-var IconList_module_default = { "hop-IconList": "IconList-module__hop-IconList___DLmNv" };
+var IconList_module_default = { "hop-IconList": "IconList-module__hop-IconList___Q3MT-" };
 var GlobalIconListCssSelector = "hop-IconList";
 function IconList(props, ref) {
   [props, ref] = useContextProps(props, ref, IconListContext);

package/dist/{chunk-OZRPGA34.js → chunk-QLR77TGC.js}

@@ -1,5 +1,5 @@
 import { ClearButtonContext } from './chunk-DXVKHP4V.js';
-import { _EmbeddedButton } from './chunk-Q2VOGHVA.js';
+import { _EmbeddedButton } from './chunk-NKZRZZMH.js';
 import { useLocalizedString } from './chunk-TFVDF4YH.js';
 import { DismissIcon } from '@hopper-ui/icons';
 import { forwardRef } from 'react';

package/dist/{chunk-AGLZTGGC.js → chunk-R4LJYEOV.js}

@@ -1,16 +1,16 @@
 import { useTruncatedText } from './chunk-Z57VHYOF.js';
 import { TextFieldContext } from './chunk-O4XPUINW.js';
-import { _InputGroup } from './chunk-ZGJENXEU.js';
-import { _ClearButton } from './chunk-OZRPGA34.js';
+import { _InputGroup } from './chunk-ZSOGDKV5.js';
+import { _ClearButton } from './chunk-QLR77TGC.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { useLocalizedString } from './chunk-TFVDF4YH.js';
 import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
-import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { HelperMessageContext } from './chunk-HZKFQ33E.js';
 import { ErrorMessageContext } from './chunk-FAE27DLF.js';
-import { _Text } from './chunk-NLLH6YL3.js';
+import { _Text } from './chunk-MYAC6TLH.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { IconContext } from '@hopper-ui/icons';
@@ -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___Wfbdo", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___ViA6M", "hop-TextField__Label": "TextField-module__hop-TextField__Label___5AeoX", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___-PH68", "hop-TextField__char-count": "TextField-module__hop-TextField__char-count___YIU-F", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___9Jn-0", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___qkdL4", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___izq-D" };
+var TextField_module_default = { "hop-TextField": "TextField-module__hop-TextField___PTMtk", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___avhOT", "hop-TextField__Label": "TextField-module__hop-TextField__Label___u2Ks9", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___Fiyv5", "hop-TextField__char-count": "TextField-module__hop-TextField__char-count___5KbZ5", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___JLzkG", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___aJHcq", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___2GFwW" };
 var GlobalTextFieldCssSelector = "hop-TextField";
 function TextField(props, ref) {
   var _a;

package/dist/{chunk-BITEHGS4.js → chunk-RDPNKPZ3.js}

@@ -1,10 +1,12 @@
 import { AvatarContext } from './chunk-AES7QBQE.js';
-import { _RichIconAvatarImage } from './chunk-TXW35G4W.js';
+import { _RichIconAvatarImage } from './chunk-NZKS5OKD.js';
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { DeletedUserRichIcon } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
-import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useContextProps } from 'react-aria-components';
+import { mergeProps } from 'react-aria';
+import { useContextProps, composeRenderProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 var GlobalDeletedAvatarCssSelector = "hop-DeletedAvatar";
@@ -16,26 +18,36 @@ function DeletedAvatar(props, ref) {
     className,
     size: sizeValue,
     style,
+    isDisabled,
     ...otherProps
   } = ownProps;
   const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
-  const classNames = clsx(
+  const classNames = composeClassnameRenderProps(
     className,
     GlobalDeletedAvatarCssSelector,
     stylingProps.className
   );
-  const mergedStyles = {
-    ...stylingProps.style,
-    ...style
-  };
+  const mergedStyles = composeRenderProps(style, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const renderProps = useRenderProps({
+    ...props,
+    className: classNames,
+    style: mergedStyles,
+    values: {
+      isDisabled: isDisabled || false
+    }
+  });
   return /* @__PURE__ */ jsx(
     _RichIconAvatarImage,
     {
-      ...otherProps,
-      className: classNames,
+      ...mergeProps(otherProps, renderProps),
+      isDisabled,
       ref,
       size,
-      style: mergedStyles,
       children: /* @__PURE__ */ jsx(DeletedUserRichIcon, {})
     }
   );

package/dist/{chunk-5BCWNYYC.js → chunk-SSCVAJ2H.js}

@@ -1,14 +1,14 @@
 import { useFontFaceReady } from './chunk-IU6XMS2X.js';
 import { TextAreaContext } from './chunk-MHQZXLKW.js';
 import { useTruncatedText } from './chunk-Z57VHYOF.js';
-import { _InputGroup } from './chunk-ZGJENXEU.js';
+import { _InputGroup } from './chunk-ZSOGDKV5.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { useLocalizedString } from './chunk-TFVDF4YH.js';
-import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { HelperMessageContext } from './chunk-HZKFQ33E.js';
 import { ErrorMessageContext } from './chunk-FAE27DLF.js';
-import { _Text } from './chunk-NLLH6YL3.js';
+import { _Text } from './chunk-MYAC6TLH.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, useResponsiveValue, useIsomorphicLayoutEffect } from '@hopper-ui/styled-system';
@@ -79,7 +79,7 @@ function $b5e257d569688ac6$export$535bd6ca7f90a273() {
 }
 
 // css-module:./TextArea.module.css#css-module
-var TextArea_module_default = { "hop-TextArea": "TextArea-module__hop-TextArea___8dXyC", "hop-TextArea--fluid": "TextArea-module__hop-TextArea--fluid___ivXkV", "hop-TextArea__Label": "TextArea-module__hop-TextArea__Label___F46Nt", "hop-TextArea__prefix": "TextArea-module__hop-TextArea__prefix___F2c7V", "hop-TextArea__InputGroup": "TextArea-module__hop-TextArea__InputGroup___DQ-6Y", "hop-TextArea__textarea": "TextArea-module__hop-TextArea__textarea___HEpbB", "hop-TextArea__char-count": "TextArea-module__hop-TextArea__char-count___MIdX-", "hop-TextArea__ErrorMessage": "TextArea-module__hop-TextArea__ErrorMessage___eXVmT", "hop-TextArea__HelperMessage": "TextArea-module__hop-TextArea__HelperMessage___Tqb2w" };
+var TextArea_module_default = { "hop-TextArea": "TextArea-module__hop-TextArea___qaonI", "hop-TextArea--fluid": "TextArea-module__hop-TextArea--fluid___Cyf8M", "hop-TextArea__Label": "TextArea-module__hop-TextArea__Label___Hrr66", "hop-TextArea__prefix": "TextArea-module__hop-TextArea__prefix___2BdDx", "hop-TextArea__InputGroup": "TextArea-module__hop-TextArea__InputGroup___d4oXY", "hop-TextArea__textarea": "TextArea-module__hop-TextArea__textarea___3wZu0", "hop-TextArea__char-count": "TextArea-module__hop-TextArea__char-count___-1sD-", "hop-TextArea__ErrorMessage": "TextArea-module__hop-TextArea__ErrorMessage___RTzEd", "hop-TextArea__HelperMessage": "TextArea-module__hop-TextArea__HelperMessage___yeQUs" };
 var GlobalTextAreaCssSelector = "hop-TextArea";
 var DefaultMinimumTextAreaRows = 3;
 var pxToInt = (value) => {

package/dist/{chunk-37572JO3.js → chunk-UJVTDWNG.js}

@@ -1,37 +1,37 @@
 import { PopoverContext } from './chunk-SC6ZK5ON.js';
+import { RadioGroupContext } from './chunk-5MBJWRZD.js';
+import { ContentContext } from './chunk-IXB2WK56.js';
 import { _Footer } from './chunk-AQITZWYM.js';
 import { FooterContext } from './chunk-I67NHYK4.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 { PasswordFieldContext } from './chunk-QW45G6K4.js';
 import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
 import { CheckboxGroupContext } from './chunk-N7YDPVZL.js';
 import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { SelectContext } from './chunk-T24MBA34.js';
-import { _SelectValue } from './chunk-OZQT5F42.js';
+import { _SelectValue } from './chunk-AAV7H2PI.js';
 import { HeadingContext } from './chunk-TXZ6BMFR.js';
+import { LabelContext } from './chunk-QCA3ZR56.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
 import { LinkContext } from './chunk-4VVNSXIB.js';
-import { _ListBox } from './chunk-7HQIQPIT.js';
+import { _ListBox } from './chunk-NQYHB7S3.js';
 import { isFunction, isNil } from './chunk-TIPN4VYD.js';
 import { ListBoxContext } from './chunk-UIEP5BA5.js';
-import { _ListBoxItem } from './chunk-CJU6B2CE.js';
-import { RadioGroupContext } from './chunk-5MBJWRZD.js';
+import { _ListBoxItem } from './chunk-CGL75FSH.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 { ErrorMessageContext } from './chunk-FAE27DLF.js';
 import { FormContext } from './chunk-EURJK4ZT.js';
 import { BadgeContext } from './chunk-CQDLZ42T.js';
-import { _Text } from './chunk-NLLH6YL3.js';
+import { _Text } from './chunk-MYAC6TLH.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { ClearContainerSlots, ClearProviders } from './chunk-HXI3MEEK.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, useResponsiveValue, useColorSchemeContext } from '@hopper-ui/styled-system';
@@ -44,7 +44,7 @@ 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___CkiNY", "fade": "Popover-module__fade___TJq1s", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___twn54", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___l1JY2", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___XRPX9", "hop-Popover__title": "Popover-module__hop-Popover__title___S9NjG", "hop-Popover__content": "Popover-module__hop-Popover__content___FgMHC", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___a195y", "hop-Popover__footer": "Popover-module__hop-Popover__footer___Y8kpa", "hop-Popover__actions": "Popover-module__hop-Popover__actions___kTaHi", "hop-Popover__action": "Popover-module__hop-Popover__action___VW7G3" };
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___pOS32", "fade": "Popover-module__fade___0AhRl", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___Gpx6-", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___KwJ4t", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___Ydsf8", "hop-Popover__title": "Popover-module__hop-Popover__title___Ac5V0", "hop-Popover__content": "Popover-module__hop-Popover__content___LsWgM", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___jhPeo", "hop-Popover__footer": "Popover-module__hop-Popover__footer___KvfnC", "hop-Popover__actions": "Popover-module__hop-Popover__actions___3EQON", "hop-Popover__action": "Popover-module__hop-Popover__action___lVwso" };
 var GlobalPopoverCssSelector = "hop-Popover";
 function Popover(props, ref) {
   var _a;
@@ -178,7 +178,7 @@ var _Popover = forwardRef(Popover);
 _Popover.displayName = "Popover";
 
 // css-module:./Select.module.css#css-module
-var Select_module_default = { "hop-Select": "Select-module__hop-Select___x9r3n", "hop-Select--fluid": "Select-module__hop-Select--fluid___N0zE6", "hop-Select__label": "Select-module__hop-Select__label___14Fj4", "hop-Select__button": "Select-module__hop-Select__button___rfs3w", "hop-Select__button--sm": "Select-module__hop-Select__button--sm___EqZOm", "hop-Select__button--md": "Select-module__hop-Select__button--md___JdvYA", "hop-Select__prefix": "Select-module__hop-Select__prefix___iPTZF", "hop-Select__button-icon": "Select-module__hop-Select__button-icon___n7ly9", "hop-Select__helper-message": "Select-module__hop-Select__helper-message___At-V5", "hop-Select__error-message": "Select-module__hop-Select__error-message___Cu6pN" };
+var Select_module_default = { "hop-Select": "Select-module__hop-Select___dZacu", "hop-Select--fluid": "Select-module__hop-Select--fluid___RMUq3", "hop-Select__label": "Select-module__hop-Select__label___yCY4A", "hop-Select__button": "Select-module__hop-Select__button___pty-P", "hop-Select__button--sm": "Select-module__hop-Select__button--sm___ybcFD", "hop-Select__button--md": "Select-module__hop-Select__button--md___w1cwq", "hop-Select__prefix": "Select-module__hop-Select__prefix___QGcJO", "hop-Select__button-icon": "Select-module__hop-Select__button-icon___UCJ9e", "hop-Select__helper-message": "Select-module__hop-Select__helper-message___gU1Rh", "hop-Select__error-message": "Select-module__hop-Select__error-message___p0QAg" };
 var GlobalSelectCssSelector = "hop-Select";
 function Select(props, ref) {
   var _a, _b;
@@ -738,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___pIeoK" };
+var Form_module_default = { "hop-Form": "Form-module__hop-Form___Kd5fG" };
 var GlobalFormCssSelector = "hop-Form";
 function Form(props, ref) {
   var _a;

package/dist/{chunk-36KWPNRH.js → chunk-YZ676IC2.js}

@@ -1,13 +1,13 @@
 import { useSlot } from './chunk-H5YTU3U7.js';
-import { _Spinner } from './chunk-LLQHZY4A.js';
+import { _Spinner } from './chunk-CVYYW7J4.js';
 import { ButtonContext } from './chunk-WMTWFKKP.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-NLLH6YL3.js';
+import { _Text } from './chunk-MYAC6TLH.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
+import { useRenderProps } from './chunk-NH3IVMXB.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { IconContext } from '@hopper-ui/icons';
@@ -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___Fcu-c", "hop-Button--icon-only": "Button-module__hop-Button--icon-only___V1KwF", "hop-Button--fluid": "Button-module__hop-Button--fluid___VtD-n", "hop-Button--sm": "Button-module__hop-Button--sm___vceOS", "hop-Button--primary": "Button-module__hop-Button--primary___X0ELV", "hop-Button--md": "Button-module__hop-Button--md___5LgAr", "hop-Button--secondary": "Button-module__hop-Button--secondary___O8fOQ", "hop-Button--upsell": "Button-module__hop-Button--upsell___UPfK0", "hop-Button--danger": "Button-module__hop-Button--danger___jYyiQ", "hop-Button--ghost-danger": "Button-module__hop-Button--ghost-danger___wYJWN", "hop-Button--ghost-secondary": "Button-module__hop-Button--ghost-secondary___uFHzl", "hop-Button--ghost-primary": "Button-module__hop-Button--ghost-primary___MHVgd", "hop-Button__Spinner": "Button-module__hop-Button__Spinner___ZS3kZ", "hop-Button__icon": "Button-module__hop-Button__icon___Sdj-F", "hop-Button__icon-list": "Button-module__hop-Button__icon-list___EegTX", "hop-Button__text": "Button-module__hop-Button__text___RmSoN", "hop-Button__end-icon": "Button-module__hop-Button__end-icon___wquAL", "hop-Button__end-icon-list": "Button-module__hop-Button__end-icon-list___horek" };
+var Button_module_default = { "hop-Button": "Button-module__hop-Button___5iBZz", "hop-Button--icon-only": "Button-module__hop-Button--icon-only___TPK5R", "hop-Button--fluid": "Button-module__hop-Button--fluid___Zb3Z4", "hop-Button--sm": "Button-module__hop-Button--sm___xENmf", "hop-Button--primary": "Button-module__hop-Button--primary___zbhJ9", "hop-Button--md": "Button-module__hop-Button--md___KZwYW", "hop-Button--secondary": "Button-module__hop-Button--secondary___PKbCY", "hop-Button--upsell": "Button-module__hop-Button--upsell___61sYX", "hop-Button--danger": "Button-module__hop-Button--danger___AxMDH", "hop-Button--ghost-danger": "Button-module__hop-Button--ghost-danger___2TdbY", "hop-Button--ghost-secondary": "Button-module__hop-Button--ghost-secondary___6I7vD", "hop-Button--ghost-primary": "Button-module__hop-Button--ghost-primary___--qrr", "hop-Button__Spinner": "Button-module__hop-Button__Spinner___jwKkE", "hop-Button__icon": "Button-module__hop-Button__icon___hTxKS", "hop-Button__icon-list": "Button-module__hop-Button__icon-list___bUhP9", "hop-Button__text": "Button-module__hop-Button__text___hOS-u", "hop-Button__end-icon": "Button-module__hop-Button__end-icon___groP0", "hop-Button__end-icon-list": "Button-module__hop-Button__end-icon-list___9WVoR" };
 var GlobalButtonCssSelector = "hop-Button";
 var additionalButtonHTMLAttributes = /* @__PURE__ */ new Set(["form", "formAction", "formEncType", "formMethod", "formNoValidate", "formTarget", "name", "value"]);
 function useSimulatedRACButton(props, ref) {

package/dist/{chunk-ZGJENXEU.js → chunk-ZSOGDKV5.js}

@@ -10,7 +10,7 @@ import { useContextProps, useSlottedContext, InputContext, TextAreaContext, Fiel
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./InputGroup.module.css#css-module
-var InputGroup_module_default = { "hop-InputGroup": "InputGroup-module__hop-InputGroup___a632X", "hop-InputGroup--fluid": "InputGroup-module__hop-InputGroup--fluid___6yyPX", "hop-InputGroup--sm": "InputGroup-module__hop-InputGroup--sm___tXEbu", "hop-InputGroup__input": "InputGroup-module__hop-InputGroup__input___Ve7UI", "hop-InputGroup__textarea": "InputGroup-module__hop-InputGroup__textarea___TNfOB", "hop-InputGroup__embedded-button": "InputGroup-module__hop-InputGroup__embedded-button___NOJxI" };
+var InputGroup_module_default = { "hop-InputGroup": "InputGroup-module__hop-InputGroup___WcTzE", "hop-InputGroup--fluid": "InputGroup-module__hop-InputGroup--fluid___nS6mP", "hop-InputGroup--sm": "InputGroup-module__hop-InputGroup--sm___JnRFs", "hop-InputGroup__input": "InputGroup-module__hop-InputGroup__input___IXkwy", "hop-InputGroup__textarea": "InputGroup-module__hop-InputGroup__textarea___bj7DV", "hop-InputGroup__embedded-button": "InputGroup-module__hop-InputGroup__embedded-button___aJeH4" };
 var GlobalInputGroupCssSelector = "hop-InputGroup";
 function InputGroup(props, ref) {
   var _a, _b;