@hopper-ui/components 1.12.10 → 1.12.12

package/dist/{chunk-6MDFPWYV.js → chunk-RPJJ4IWO.js}

@@ -1,10 +1,10 @@
 import { RadioGroupContext } from './chunk-5MBJWRZD.js';
 import { RadioFieldContext } from './chunk-DGLAGYBD.js';
 import { RadioContext } from './chunk-FU5CCPLP.js';
-import { FieldLabel } from './chunk-EFOA3ONM.js';
-import { _HelperMessage } from './chunk-XGOGILJI.js';
-import { _ErrorMessage } from './chunk-VCDBSIB6.js';
-import { useFormProps } from './chunk-Y2F3EB7C.js';
+import { FieldLabel } from './chunk-CJAVXRN6.js';
+import { _HelperMessage } from './chunk-ENPWF5RT.js';
+import { _ErrorMessage } from './chunk-OODFQTJN.js';
+import { useFormProps } from './chunk-UMD2QXPA.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
@@ -15,7 +15,7 @@ import { useContextProps, composeRenderProps, RadioGroup as RadioGroup$1 } from
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./RadioGroup.module.css#css-module
-var RadioGroup_module_default = { "hop-RadioGroup": "RadioGroup-module__hop-RadioGroup___ilK1K", "hop-RadioGroup--bordered": "RadioGroup-module__hop-RadioGroup--bordered___BdatT", "hop-RadioGroup--fluid": "RadioGroup-module__hop-RadioGroup--fluid___TEpgP", "hop-RadioGroup--sm": "RadioGroup-module__hop-RadioGroup--sm___kFSV4", "hop-RadioGroup--md": "RadioGroup-module__hop-RadioGroup--md___fjtRo", "hop-RadioGroup__label": "RadioGroup-module__hop-RadioGroup__label___DyIy5", "hop-RadioGroup__list": "RadioGroup-module__hop-RadioGroup__list___p-mi2", "hop-RadioGroup__radio": "RadioGroup-module__hop-RadioGroup__radio___Rk9F4", "hop-RadioGroup__error-message": "RadioGroup-module__hop-RadioGroup__error-message___-ybjQ", "hop-RadioGroup__helper-message": "RadioGroup-module__hop-RadioGroup__helper-message___jNLtF" };
+var RadioGroup_module_default = { "hop-RadioGroup": "RadioGroup-module__hop-RadioGroup___FCHpl", "hop-RadioGroup--bordered": "RadioGroup-module__hop-RadioGroup--bordered___j5UoZ", "hop-RadioGroup--fluid": "RadioGroup-module__hop-RadioGroup--fluid___Gw8Ie", "hop-RadioGroup--sm": "RadioGroup-module__hop-RadioGroup--sm___3Mhkd", "hop-RadioGroup--md": "RadioGroup-module__hop-RadioGroup--md___KdmvY", "hop-RadioGroup__label": "RadioGroup-module__hop-RadioGroup__label___ZWdqS", "hop-RadioGroup__list": "RadioGroup-module__hop-RadioGroup__list___BOVkD", "hop-RadioGroup__radio": "RadioGroup-module__hop-RadioGroup__radio___lXOOh", "hop-RadioGroup__error-message": "RadioGroup-module__hop-RadioGroup__error-message___Q9bUt", "hop-RadioGroup__helper-message": "RadioGroup-module__hop-RadioGroup__helper-message___0tYev" };
 var GlobalRadioGroupCssSelector = "hop-RadioGroup";
 function RadioGroup(props, ref) {
   var _a, _b, _c, _d;

package/dist/{chunk-E42M72WS.js → chunk-RPXVSO5T.js}

@@ -1,8 +1,9 @@
-import { TabsContext, InternalTabsContext } from './chunk-ZXON3BAA.js';
+import { TabsContext, InternalTabsContext } from './chunk-K2FJKV3T.js';
 import { useStyledSystem } from '@hopper-ui/styled-system';
+import { useEffectEvent } from '@react-aria/utils';
 import { useControlledState } from '@react-stately/utils';
 import clsx from 'clsx';
-import { forwardRef } from 'react';
+import { forwardRef, useRef } from 'react';
 import { useContextProps, Tabs as Tabs$1, Provider } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
@@ -24,6 +25,15 @@ function Tabs(props, ref) {
     ...otherProps
   } = ownProps;
   const [value, setValue] = useControlledState(props.selectedKey, (_a = props.defaultSelectedKey) != null ? _a : null, props.onSelectionChange);
+  const tablistRef = useRef(null);
+  const prevRef = useRef(null);
+  const onChange = useEffectEvent((val) => {
+    var _a2, _b;
+    if (tablistRef.current) {
+      prevRef.current = (_b = (_a2 = tablistRef.current.querySelector("[role=tab][data-selected=true]")) == null ? void 0 : _a2.getBoundingClientRect()) != null ? _b : null;
+    }
+    setValue(val);
+  });
   if (!props["aria-label"] && !props["aria-labelledby"]) {
     console.warn("An aria-label or aria-labelledby prop is required on Tabs for accessibility.");
   }
@@ -45,6 +55,7 @@ function Tabs(props, ref) {
       style: mergedStyles,
       isDisabled,
       disabledKeys,
+      onSelectionChange: onChange,
       ...otherProps,
       children: /* @__PURE__ */ jsx(
         Provider,
@@ -54,12 +65,14 @@ function Tabs(props, ref) {
               variant,
               size,
               selectedKey: value,
-              onSelectionChange: setValue,
               isFluid,
               isDisabled,
               disabledKeys,
               "aria-label": props["aria-label"],
-              "aria-labelledby": props["aria-labelledby"]
+              "aria-labelledby": props["aria-labelledby"],
+              tablistRef,
+              prevRef,
+              onSelectionChange: onChange
             }]
           ],
           children

package/dist/chunk-RXSSUB7W.js

@@ -0,0 +1,114 @@
+import { TagContext } from './chunk-EWMWQ2MC.js';
+import { TabContext, InternalTabsContext } from './chunk-K2FJKV3T.js';
+import { BadgeContext } from './chunk-ZSFJVMJN.js';
+import { _Text } from './chunk-6QUUX4B6.js';
+import { TextContext } from './chunk-ZNOU2CGM.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { IconContext } from '@hopper-ui/icons';
+import { useStyledSystem, useMediaQuery, useIsomorphicLayoutEffect } from '@hopper-ui/styled-system';
+import clsx from 'clsx';
+import { forwardRef, useContext, useRef } from 'react';
+import { useContextProps, Tab as Tab$1, Provider } from 'react-aria-components';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+// css-module:./Tab.module.css#css-module
+var Tab_module_default = { "hop-Tab": "Tab-module__hop-Tab___Gfc84", "hop-Tab--fluid": "Tab-module__hop-Tab--fluid___cWB8K", "hop-Tab--md": "Tab-module__hop-Tab--md___-0an0", "hop-Tab__icon": "Tab-module__hop-Tab__icon___TIOA0", "hop-Tab__text": "Tab-module__hop-Tab__text___zmrUZ", "hop-Tab__badge": "Tab-module__hop-Tab__badge___rsxIE", "hop-Tab__tag": "Tab-module__hop-Tab__tag___ZZT9t", "hop-Tab__selector": "Tab-module__hop-Tab__selector___Gz06h", "hop-Tab__selector--inner": "Tab-module__hop-Tab__selector--inner___iVOLi", "hop-Tab__selector--disabled": "Tab-module__hop-Tab__selector--disabled___sBONN" };
+var GlobalTabCssSelector = "hop-Tab";
+function Tab(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, TabContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const { size, isFluid, prevRef, tablistRef } = (_a = useContext(InternalTabsContext)) != null ? _a : {};
+  const {
+    className,
+    children,
+    style,
+    ...otherProps
+  } = ownProps;
+  const classNames = clsx(
+    GlobalTabCssSelector,
+    cssModule(
+      Tab_module_default,
+      "hop-Tab",
+      size,
+      isFluid && "fluid"
+    ),
+    stylingProps.className,
+    className
+  );
+  const mergedStyles = {
+    ...style,
+    ...stylingProps.style
+  };
+  return /* @__PURE__ */ jsx(
+    Tab$1,
+    {
+      ...otherProps,
+      style: mergedStyles,
+      className: classNames,
+      ref,
+      children: ({ isSelected, isDisabled }) => /* @__PURE__ */ jsx(
+        Provider,
+        {
+          values: [
+            [TextContext, {
+              className: Tab_module_default["hop-Tab__text"],
+              size,
+              fontWeight: size === "sm" ? "body-sm-medium" : "body-md-medium"
+            }],
+            [IconContext, {
+              className: Tab_module_default["hop-Tab__icon"],
+              size
+            }],
+            [BadgeContext, {
+              className: Tab_module_default["hop-Tab__badge"]
+            }],
+            [TagContext, {
+              className: Tab_module_default["hop-Tab__tag"],
+              size
+            }]
+          ],
+          children: /* @__PURE__ */ jsx(
+            TabInner,
+            {
+              isSelected,
+              isDisabled,
+              prevRef,
+              tablistRef,
+              children: typeof children === "string" ? /* @__PURE__ */ jsx(_Text, { children }) : children
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function TabInner({ isSelected, isDisabled, children, prevRef, tablistRef }) {
+  const reduceMotion = useMediaQuery("(prefers-reduced-motion: reduce)");
+  const ref = useRef(null);
+  useIsomorphicLayoutEffect(() => {
+    if (isSelected && (prevRef == null ? void 0 : prevRef.current) && (tablistRef == null ? void 0 : tablistRef.current) && (ref == null ? void 0 : ref.current) && !reduceMotion) {
+      const currentItem = ref == null ? void 0 : ref.current.getBoundingClientRect();
+      const deltaX = prevRef.current.left - currentItem.left;
+      ref.current.animate(
+        [
+          { transform: `translateX(${deltaX}px)`, inlineSize: `${prevRef.current.width}px` },
+          { transform: "translateX(0px)", inlineSize: "100%" }
+        ],
+        {
+          duration: 150,
+          easing: "ease-in-out"
+        }
+      );
+      prevRef.current = null;
+    }
+  }, [isSelected, reduceMotion, prevRef, tablistRef]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isSelected && /* @__PURE__ */ jsx("div", { ref, className: cssModule(Tab_module_default, "hop-Tab__selector", isDisabled && "disabled"), children: /* @__PURE__ */ jsx("div", { className: Tab_module_default["hop-Tab__selector--inner"] }) }),
+    children
+  ] });
+}
+var _Tab = forwardRef(Tab);
+_Tab.displayName = "Tab";
+
+export { GlobalTabCssSelector, _Tab };

package/dist/{chunk-KIOXCHJU.js → chunk-RYICK7Y6.js}

@@ -1,4 +1,4 @@
-import { _OverlineText } from './chunk-ZO4KL6O2.js';
+import { _OverlineText } from './chunk-WF6QU5EL.js';
 import { isNil } from './chunk-TIPN4VYD.js';
 import { BadgeContext } from './chunk-ZSFJVMJN.js';
 import { useRenderProps } from './chunk-2NSUMKNH.js';
@@ -24,7 +24,7 @@ function mapOrbiterToHopperVariants(variant) {
 }
 
 // css-module:./Badge.module.css#css-module
-var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___bNSBt", "hop-Badge--primary": "Badge-module__hop-Badge--primary___1B8mO", "hop-Badge--secondary": "Badge-module__hop-Badge--secondary___clPWP", "hop-Badge--subdued": "Badge-module__hop-Badge--subdued___cPq6P" };
+var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___VQ-VK", "hop-Badge--primary": "Badge-module__hop-Badge--primary___v6MY4", "hop-Badge--secondary": "Badge-module__hop-Badge--secondary___tTu5f", "hop-Badge--subdued": "Badge-module__hop-Badge--subdued___umycD" };
 var GlobalBadgeCssSelector = "hop-Badge";
 function Badge(props, ref) {
   [props, ref] = useContextProps(props, ref, BadgeContext);

package/dist/{chunk-NDONRTRQ.js → chunk-TIZFU3EM.js}

@@ -1,6 +1,6 @@
 import { InternalSegmentedControlContext } from './chunk-6BJLSAMM.js';
 import { SegmentedControlItemContext } from './chunk-VS3PE4S6.js';
-import { _Text } from './chunk-PR5MA5YW.js';
+import { _Text } from './chunk-6QUUX4B6.js';
 import { TextContext } from './chunk-ZNOU2CGM.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { IconContext } from '@hopper-ui/icons';
@@ -11,7 +11,7 @@ import { useContextProps, ToggleGroupStateContext, ToggleButton, Provider, DEFAU
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./SegmentedControlItem.module.css#css-module
-var SegmentedControlItem_module_default = { "hop-SegmentedControlItem": "SegmentedControlItem-module__hop-SegmentedControlItem___CbPgf", "hop-SegmentedControlItem__slider": "SegmentedControlItem-module__hop-SegmentedControlItem__slider___vniyx", "hop-SegmentedControlItem__wrapper": "SegmentedControlItem-module__hop-SegmentedControlItem__wrapper___lq-SU", "hop-SegmentedControlItem--md": "SegmentedControlItem-module__hop-SegmentedControlItem--md___y6cVN", "hop-SegmentedControlItem__icon": "SegmentedControlItem-module__hop-SegmentedControlItem__icon___vqV7k", "hop-SegmentedControlItem__text": "SegmentedControlItem-module__hop-SegmentedControlItem__text___1xIHO", "hop-SegmentedControlItem__start-icon": "SegmentedControlItem-module__hop-SegmentedControlItem__start-icon___7Aqfx", "hop-SegmentedControlItem--justified": "SegmentedControlItem-module__hop-SegmentedControlItem--justified___MD-6O" };
+var SegmentedControlItem_module_default = { "hop-SegmentedControlItem": "SegmentedControlItem-module__hop-SegmentedControlItem___HmnYy", "hop-SegmentedControlItem__slider": "SegmentedControlItem-module__hop-SegmentedControlItem__slider___sQ1f2", "hop-SegmentedControlItem__wrapper": "SegmentedControlItem-module__hop-SegmentedControlItem__wrapper___Dgg51", "hop-SegmentedControlItem--md": "SegmentedControlItem-module__hop-SegmentedControlItem--md___g7zMq", "hop-SegmentedControlItem__icon": "SegmentedControlItem-module__hop-SegmentedControlItem__icon___KWHi5", "hop-SegmentedControlItem__text": "SegmentedControlItem-module__hop-SegmentedControlItem__text___Ldkuj", "hop-SegmentedControlItem__start-icon": "SegmentedControlItem-module__hop-SegmentedControlItem__start-icon___QqK3i", "hop-SegmentedControlItem--justified": "SegmentedControlItem-module__hop-SegmentedControlItem--justified___Z6-pu" };
 var GlobalSegmentedControlItemCssSelector = "hop-SegmentedControlItem";
 var SegmentedControlItem = (props, ref) => {
   var _a;

package/dist/{chunk-XMUKQROD.js → chunk-TRESINEB.js}

@@ -1,5 +1,5 @@
 import { AvatarContext } from './chunk-FA26RZSE.js';
-import { _RichIconAvatarImage } from './chunk-4S2ZQQFH.js';
+import { _RichIconAvatarImage } from './chunk-5DKVV77A.js';
 import { useRenderProps } from './chunk-2NSUMKNH.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { AnonymousRichIcon } from '@hopper-ui/icons';

package/dist/{chunk-RTC3KDOV.js → chunk-TTTNNJAW.js}

@@ -1,11 +1,11 @@
 import { NumberFieldContext } from './chunk-ZQ3AWYRR.js';
-import { _InputGroup } from './chunk-BTUFR5RF.js';
-import { Input } from './chunk-BESHIVCO.js';
-import { FieldLabel } from './chunk-EFOA3ONM.js';
-import { _HelperMessage } from './chunk-XGOGILJI.js';
-import { _ErrorMessage } from './chunk-VCDBSIB6.js';
-import { useFormProps } from './chunk-Y2F3EB7C.js';
-import { ensureTextWrapper } from './chunk-PYB6GZIG.js';
+import { _InputGroup } from './chunk-ONWHZMKV.js';
+import { Input } from './chunk-NXM4YW6Y.js';
+import { FieldLabel } from './chunk-CJAVXRN6.js';
+import { _HelperMessage } from './chunk-ENPWF5RT.js';
+import { _ErrorMessage } from './chunk-OODFQTJN.js';
+import { useFormProps } from './chunk-UMD2QXPA.js';
+import { ensureTextWrapper } from './chunk-QFGSXBXR.js';
 import { ClearContainerSlots } from './chunk-PQSMCDAM.js';
 import { TextContext } from './chunk-ZNOU2CGM.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
@@ -22,7 +22,7 @@ import { useContextProps, composeRenderProps, NumberField as NumberField$1, Butt
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./NumberField.module.css#css-module
-var NumberField_module_default = { "hop-NumberField": "NumberField-module__hop-NumberField___7OhoD", "hop-NumberField--fluid": "NumberField-module__hop-NumberField--fluid___NfGDi", "hop-NumberField__Label": "NumberField-module__hop-NumberField__Label___MBgdD", "hop-NumberField__prefix": "NumberField-module__hop-NumberField__prefix___5Q6Ia", "hop-NumberField__InputGroup": "NumberField-module__hop-NumberField__InputGroup___tAjPe", "hop-NumberField__ErrorMessage": "NumberField-module__hop-NumberField__ErrorMessage___B0yr5", "hop-NumberField__HelperMessage": "NumberField-module__hop-NumberField__HelperMessage___oxlFB", "hop-NumberField__steppers": "NumberField-module__hop-NumberField__steppers___2aGjc", "hop-NumberField__stepper-button": "NumberField-module__hop-NumberField__stepper-button___EtzVT", "hop-NumberField__stepper-button--increment": "NumberField-module__hop-NumberField__stepper-button--increment___QZF--", "hop-NumberField__stepper-button--decrement": "NumberField-module__hop-NumberField__stepper-button--decrement___vypjJ", "hop-NumberField__stepper-button__icon": "NumberField-module__hop-NumberField__stepper-button__icon___rv3r-", "hop-NumberField__input": "NumberField-module__hop-NumberField__input___ieS1-" };
+var NumberField_module_default = { "hop-NumberField": "NumberField-module__hop-NumberField___W-GWR", "hop-NumberField--fluid": "NumberField-module__hop-NumberField--fluid___HDsPI", "hop-NumberField__Label": "NumberField-module__hop-NumberField__Label___2TO5-", "hop-NumberField__prefix": "NumberField-module__hop-NumberField__prefix___kAS1T", "hop-NumberField__InputGroup": "NumberField-module__hop-NumberField__InputGroup___eJ3O6", "hop-NumberField__ErrorMessage": "NumberField-module__hop-NumberField__ErrorMessage___6vWCi", "hop-NumberField__HelperMessage": "NumberField-module__hop-NumberField__HelperMessage___yPG2v", "hop-NumberField__steppers": "NumberField-module__hop-NumberField__steppers___Ki-EW", "hop-NumberField__stepper-button": "NumberField-module__hop-NumberField__stepper-button___Z4hnX", "hop-NumberField__stepper-button--increment": "NumberField-module__hop-NumberField__stepper-button--increment___Xe3Xp", "hop-NumberField__stepper-button--decrement": "NumberField-module__hop-NumberField__stepper-button--decrement___Fyp3m", "hop-NumberField__stepper-button__icon": "NumberField-module__hop-NumberField__stepper-button__icon___u0WQi", "hop-NumberField__input": "NumberField-module__hop-NumberField__input___10jPq" };
 var GlobalNumberFieldCssSelector = "hop-NumberField";
 var StepperButton = ({ direction }) => {
   const StepperIcon = direction === "increment" ? AngleUpIcon : AngleDownIcon;

package/dist/{chunk-OBCDRBZB.js → chunk-TUIAD25P.js}

@@ -1,6 +1,6 @@
+import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { LinkButtonContext } from './chunk-3UQFC2NQ.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
-import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { ClearProviders } from './chunk-PQSMCDAM.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
@@ -12,7 +12,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___eQIZX", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___CX3o5", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___BhF3Y", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___L-Fo5", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___AdIb6", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___5FfxJ", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___PUmbF", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___s38Ks" };
+var ButtonGroup_module_default = { "hop-ButtonGroup": "ButtonGroup-module__hop-ButtonGroup___lDCVb", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___u4Ygi", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___R0OY8", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___nLGGq", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___pvkPj", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___scsHN", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___kF0FG", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___1nEYx" };
 var GlobalButtonGroupCssSelector = "hop-ButtonGroup";
 function ButtonGroup(props, ref) {
   var _a, _b, _c, _d;

package/dist/{chunk-IXAXWQAB.js → chunk-TWL6QQPN.js}

@@ -1,18 +1,18 @@
-import { _Popover } from './chunk-ADN3JEPI.js';
+import { _Popover } from './chunk-V4VS5LBM.js';
 import { _ListBoxSection } from './chunk-PN5BRTOO.js';
-import { _ListBox } from './chunk-QRZ7CXIK.js';
-import { _ListBoxItem } from './chunk-PIRNEH2J.js';
+import { _ListBox } from './chunk-NHNBDH6W.js';
+import { _ListBoxItem } from './chunk-2SICSU24.js';
 import { _Footer } from './chunk-RN3FLBX4.js';
-import { _InputGroup } from './chunk-BTUFR5RF.js';
-import { InputContext, Input } from './chunk-BESHIVCO.js';
-import { _ToggleArrow } from './chunk-ZZWHCK3W.js';
+import { _InputGroup } from './chunk-ONWHZMKV.js';
+import { InputContext, Input } from './chunk-NXM4YW6Y.js';
+import { _ToggleArrow } from './chunk-BSRWIESI.js';
 import { ComboBoxContext } from './chunk-RFZC5CHX.js';
-import { FieldLabel } from './chunk-EFOA3ONM.js';
-import { _HelperMessage } from './chunk-XGOGILJI.js';
-import { _ErrorMessage } from './chunk-VCDBSIB6.js';
+import { FieldLabel } from './chunk-CJAVXRN6.js';
+import { _HelperMessage } from './chunk-ENPWF5RT.js';
+import { _ErrorMessage } from './chunk-OODFQTJN.js';
 import { BadgeContext } from './chunk-ZSFJVMJN.js';
-import { useFormProps } from './chunk-Y2F3EB7C.js';
-import { ensureTextWrapper } from './chunk-PYB6GZIG.js';
+import { useFormProps } from './chunk-UMD2QXPA.js';
+import { ensureTextWrapper } from './chunk-QFGSXBXR.js';
 import { ClearProviders, ClearContainerSlots } from './chunk-PQSMCDAM.js';
 import { TextContext as TextContext$1 } from './chunk-ZNOU2CGM.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
@@ -26,7 +26,7 @@ import { useContextProps, useSlottedContext, composeRenderProps, TextContext, Bu
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./ComboBox.module.css#css-module
-var ComboBox_module_default = { "hop-ComboBox": "ComboBox-module__hop-ComboBox___Ne953", "hop-ComboBox--fluid": "ComboBox-module__hop-ComboBox--fluid___eNMv6", "hop-ComboBox__label": "ComboBox-module__hop-ComboBox__label___SxVKL", "hop-ComboBox__trigger": "ComboBox-module__hop-ComboBox__trigger___yWxzO", "hop-ComboBox__button": "ComboBox-module__hop-ComboBox__button___zg64i", "hop-ComboBox__prefix": "ComboBox-module__hop-ComboBox__prefix___tGuGj", "hop-ComboBox__helper-message": "ComboBox-module__hop-ComboBox__helper-message___O-zCo", "hop-ComboBox__error-message": "ComboBox-module__hop-ComboBox__error-message___hdW8j" };
+var ComboBox_module_default = { "hop-ComboBox": "ComboBox-module__hop-ComboBox___aAEDj", "hop-ComboBox--fluid": "ComboBox-module__hop-ComboBox--fluid___I8L1A", "hop-ComboBox__label": "ComboBox-module__hop-ComboBox__label___3iGDK", "hop-ComboBox__trigger": "ComboBox-module__hop-ComboBox__trigger___JNiSg", "hop-ComboBox__button": "ComboBox-module__hop-ComboBox__button___754Kr", "hop-ComboBox__prefix": "ComboBox-module__hop-ComboBox__prefix___EO2Dy", "hop-ComboBox__helper-message": "ComboBox-module__hop-ComboBox__helper-message___of7lL", "hop-ComboBox__error-message": "ComboBox-module__hop-ComboBox__error-message___M-k9L" };
 var GlobalComboBoxCssSelector = "hop-ComboBox";
 function ComboBox(props, ref) {
   var _a, _b, _c, _d, _e;

package/dist/{chunk-5JTXBQIB.js → chunk-U5QN767A.js}

@@ -1,7 +1,7 @@
 import { PopoverTrigger } from './chunk-KHDRGFVV.js';
-import { _PopoverBase } from './chunk-4OUHOH6G.js';
+import { _PopoverBase } from './chunk-NSQZM453.js';
 import { ContextualHelpContext } from './chunk-MR5BPD6R.js';
-import { ensureTextWrapper } from './chunk-PYB6GZIG.js';
+import { ensureTextWrapper } from './chunk-QFGSXBXR.js';
 import { ClearProviders, ClearContainerSlots } from './chunk-PQSMCDAM.js';
 import { TextContext } from './chunk-ZNOU2CGM.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
@@ -14,7 +14,7 @@ import { useContextProps, ButtonContext, Button, Provider } from 'react-aria-com
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 // css-module:./ContextualHelp.module.css#css-module
-var ContextualHelp_module_default = { "hop-ContextualHelp": "ContextualHelp-module__hop-ContextualHelp___LnefO", "hop-ContextualHelp__popover": "ContextualHelp-module__hop-ContextualHelp__popover___XLi9g" };
+var ContextualHelp_module_default = { "hop-ContextualHelp": "ContextualHelp-module__hop-ContextualHelp___GnLCP", "hop-ContextualHelp__popover": "ContextualHelp-module__hop-ContextualHelp__popover___17dAH" };
 var GlobalContextualHelpCssSelector = "hop-ContextualHelp";
 function ContextualHelp(props, ref) {
   var _a;

package/dist/{chunk-KYBBJIA4.js → chunk-U7HZHKDN.js}

@@ -1,4 +1,4 @@
-import { TabPanelContext } from './chunk-ZXON3BAA.js';
+import { TabPanelContext } from './chunk-K2FJKV3T.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem } from '@hopper-ui/styled-system';
 import clsx from 'clsx';
@@ -7,7 +7,7 @@ import { useContextProps, TabPanel as TabPanel$1 } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./TabPanel.module.css#css-module
-var TabPanel_module_default = { "hop-TabPanel": "TabPanel-module__hop-TabPanel___-v91m" };
+var TabPanel_module_default = { "hop-TabPanel": "TabPanel-module__hop-TabPanel___-b0fY" };
 var GlobalTabPanelCssSelector = "hop-TabPanel";
 function TabPanel(props, ref) {
   [props, ref] = useContextProps(props, ref, TabPanelContext);

package/dist/{chunk-Y2F3EB7C.js → chunk-UMD2QXPA.js}

@@ -7,7 +7,7 @@ import { Form as Form$1 } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Form.module.css#css-module
-var Form_module_default = { "hop-Form": "Form-module__hop-Form___PEeER" };
+var Form_module_default = { "hop-Form": "Form-module__hop-Form___-f1ob" };
 var GlobalFormCssSelector = "hop-Form";
 function useFormProps(props) {
   const ctx = useContext(FormContext);

package/dist/{chunk-GARO3F2U.js → chunk-UW4G74YH.js}

@@ -1,11 +1,11 @@
 import { PasswordFieldContext } from './chunk-QW45G6K4.js';
-import { _InputGroup } from './chunk-BTUFR5RF.js';
-import { Input } from './chunk-BESHIVCO.js';
-import { FieldLabel } from './chunk-EFOA3ONM.js';
-import { _HelperMessage } from './chunk-XGOGILJI.js';
-import { _ErrorMessage } from './chunk-VCDBSIB6.js';
-import { _EmbeddedButton } from './chunk-SJL6J3IF.js';
-import { useFormProps } from './chunk-Y2F3EB7C.js';
+import { _InputGroup } from './chunk-ONWHZMKV.js';
+import { Input } from './chunk-NXM4YW6Y.js';
+import { FieldLabel } from './chunk-CJAVXRN6.js';
+import { _HelperMessage } from './chunk-ENPWF5RT.js';
+import { _ErrorMessage } from './chunk-OODFQTJN.js';
+import { _EmbeddedButton } from './chunk-NF276QWB.js';
+import { useFormProps } from './chunk-UMD2QXPA.js';
 import { useLocalizedString } from './chunk-NNLLQWDS.js';
 import { ClearContainerSlots } from './chunk-PQSMCDAM.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
@@ -20,7 +20,7 @@ import { useContextProps, composeRenderProps, TextField } from 'react-aria-compo
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./PasswordField.module.css#css-module
-var PasswordField_module_default = { "hop-PasswordField": "PasswordField-module__hop-PasswordField___Vnic9", "hop-PasswordField--fluid": "PasswordField-module__hop-PasswordField--fluid___2zsF0", "hop-PasswordField__Label": "PasswordField-module__hop-PasswordField__Label___3CMLy", "hop-PasswordField__InputGroup": "PasswordField-module__hop-PasswordField__InputGroup___GInj5", "hop-PasswordField__ErrorMessage": "PasswordField-module__hop-PasswordField__ErrorMessage___2LwLf", "hop-PasswordField__HelperMessage": "PasswordField-module__hop-PasswordField__HelperMessage___yTHk1" };
+var PasswordField_module_default = { "hop-PasswordField": "PasswordField-module__hop-PasswordField___ckvK-", "hop-PasswordField--fluid": "PasswordField-module__hop-PasswordField--fluid___nc-J5", "hop-PasswordField__Label": "PasswordField-module__hop-PasswordField__Label___YH-6t", "hop-PasswordField__InputGroup": "PasswordField-module__hop-PasswordField__InputGroup___wrn3F", "hop-PasswordField__ErrorMessage": "PasswordField-module__hop-PasswordField__ErrorMessage___OZzIU", "hop-PasswordField__HelperMessage": "PasswordField-module__hop-PasswordField__HelperMessage___nrHBG" };
 var GlobalPasswordFieldCssSelector = "hop-PasswordField";
 function PasswordField(props, ref) {
   var _a;

package/dist/{chunk-ADN3JEPI.js → chunk-V4VS5LBM.js}

@@ -4,11 +4,11 @@ import { FooterContext } from './chunk-I67NHYK4.js';
 import { useForwardedHopperContext, _HopperProvider } from './chunk-Q3CGFKER.js';
 import { LinkContext } from './chunk-MTULE7GI.js';
 import { isFunction, isNil } from './chunk-TIPN4VYD.js';
+import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { HeadingContext } from './chunk-WJRMD4JP.js';
 import { ContentContext } from './chunk-IXB2WK56.js';
 import { LinkButtonContext } from './chunk-3UQFC2NQ.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
-import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
@@ -19,7 +19,7 @@ import { useContextProps, composeRenderProps, Popover as Popover$1, Dialog } fro
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Popover.module.css#css-module
-var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___XAb88", "fade": "Popover-module__fade___3lat9", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___dXqa7", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___5BEXy", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___LXuLP", "hop-Popover__title": "Popover-module__hop-Popover__title___NP132", "hop-Popover__content": "Popover-module__hop-Popover__content___9BR-k", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___WapdK", "hop-Popover__footer": "Popover-module__hop-Popover__footer___Rzdb6", "hop-Popover__actions": "Popover-module__hop-Popover__actions___SYdqh", "hop-Popover__action": "Popover-module__hop-Popover__action___uUyaj" };
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___4TC-a", "fade": "Popover-module__fade___35obN", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___tueLH", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___qHa0R", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___zUcwu", "hop-Popover__title": "Popover-module__hop-Popover__title___eno-c", "hop-Popover__content": "Popover-module__hop-Popover__content___wZh-4", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___K6o8D", "hop-Popover__footer": "Popover-module__hop-Popover__footer___BCLYl", "hop-Popover__actions": "Popover-module__hop-Popover__actions___w1Pfz", "hop-Popover__action": "Popover-module__hop-Popover__action___h4IlB" };
 var GlobalPopoverCssSelector = "hop-Popover";
 function Popover(props, ref) {
   var _a;

package/dist/{chunk-IIGX4IUT.js → chunk-VFOPJZEX.js}

@@ -1,9 +1,9 @@
 import { ToggleButtonContext } from './chunk-BYERWFG4.js';
-import { _Spinner } from './chunk-TDYFFMUB.js';
+import { _Spinner } from './chunk-GDVHXMXO.js';
 import { IconListContext } from './chunk-GBWXEK6N.js';
 import { useLocalizedString } from './chunk-NNLLQWDS.js';
 import { useSlot } from './chunk-H5YTU3U7.js';
-import { ensureTextWrapper } from './chunk-PYB6GZIG.js';
+import { ensureTextWrapper } from './chunk-QFGSXBXR.js';
 import { ClearProviders } from './chunk-PQSMCDAM.js';
 import { TextContext } from './chunk-ZNOU2CGM.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
@@ -16,7 +16,7 @@ import { useContextProps, composeRenderProps, ToggleButton as ToggleButton$1, DE
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./ToggleButton.module.css#css-module
-var ToggleButton_module_default = { "hop-ToggleButton": "ToggleButton-module__hop-ToggleButton___TZm12 Button-module__hop-Button___UnRBz", "hop-ToggleButton--fluid": "ToggleButton-module__hop-ToggleButton--fluid___OUfK- Button-module__hop-Button--fluid___eT5-M", "hop-ToggleButton--xs": "ToggleButton-module__hop-ToggleButton--xs___eTWX2 Button-module__hop-Button--xs___-XZ4h", "hop-ToggleButton--sm": "ToggleButton-module__hop-ToggleButton--sm___dO5pr Button-module__hop-Button--sm___YuFjk", "hop-ToggleButton--md": "ToggleButton-module__hop-ToggleButton--md___6J7Av Button-module__hop-Button--md___g-k0X", "hop-ToggleButton--icon-only": "ToggleButton-module__hop-ToggleButton--icon-only___JxlI7 Button-module__hop-Button--icon-only___7HDDo", "hop-ToggleButton--primary": "ToggleButton-module__hop-ToggleButton--primary___LhZIo Button-module__hop-Button--primary___Vdyyy", "hop-ToggleButton--secondary": "ToggleButton-module__hop-ToggleButton--secondary___DMioI Button-module__hop-Button--secondary___zMvt-", "hop-ToggleButton--upsell": "ToggleButton-module__hop-ToggleButton--upsell___S5smW Button-module__hop-Button--upsell___q0WIP", "hop-ToggleButton--danger": "ToggleButton-module__hop-ToggleButton--danger___pgel3 Button-module__hop-Button--danger___rZpdW", "hop-ToggleButton--ghost-primary": "ToggleButton-module__hop-ToggleButton--ghost-primary___gMf4a Button-module__hop-Button--ghost-primary___RHYFJ", "hop-ToggleButton--ghost-secondary": "ToggleButton-module__hop-ToggleButton--ghost-secondary___mYAv8 Button-module__hop-Button--ghost-secondary___ybhvx", "hop-ToggleButton--ghost-danger": "ToggleButton-module__hop-ToggleButton--ghost-danger___8F1Sw Button-module__hop-Button--ghost-danger___Zwgj6", "hop-ToggleButton--loading": "ToggleButton-module__hop-ToggleButton--loading___GjvCo", "hop-ToggleButton__Spinner": "ToggleButton-module__hop-ToggleButton__Spinner___w0Jyq Button-module__hop-Button__Spinner___szA1E", "hop-ToggleButton__icon": "ToggleButton-module__hop-ToggleButton__icon___b0TLr Button-module__hop-Button__icon___nl-aU", "hop-ToggleButton__icon-list": "ToggleButton-module__hop-ToggleButton__icon-list___Vkva6 Button-module__hop-Button__icon___nl-aU Button-module__hop-Button__icon-list___Y-iY7", "hop-ToggleButton__text": "ToggleButton-module__hop-ToggleButton__text___ztdsA Button-module__hop-Button__text___B58B-", "hop-ToggleButton__end-icon": "ToggleButton-module__hop-ToggleButton__end-icon___L8B5T Button-module__hop-Button__end-icon___aOjY-", "hop-ToggleButton__end-icon-list": "ToggleButton-module__hop-ToggleButton__end-icon-list___LHSvf Button-module__hop-Button__end-icon___aOjY- Button-module__hop-Button__icon-list___Y-iY7" };
+var ToggleButton_module_default = { "hop-ToggleButton": "ToggleButton-module__hop-ToggleButton___Uwkxl Button-module__hop-Button___9-I0t", "hop-ToggleButton--fluid": "ToggleButton-module__hop-ToggleButton--fluid___HQ2lc Button-module__hop-Button--fluid___YJmFo", "hop-ToggleButton--xs": "ToggleButton-module__hop-ToggleButton--xs___-x-qz Button-module__hop-Button--xs___rqf-Z", "hop-ToggleButton--sm": "ToggleButton-module__hop-ToggleButton--sm___nptYe Button-module__hop-Button--sm___7G4qS", "hop-ToggleButton--md": "ToggleButton-module__hop-ToggleButton--md___srMk5 Button-module__hop-Button--md___Ivm2r", "hop-ToggleButton--icon-only": "ToggleButton-module__hop-ToggleButton--icon-only___PL1Qp Button-module__hop-Button--icon-only___E5dNi", "hop-ToggleButton--primary": "ToggleButton-module__hop-ToggleButton--primary___eEcMj Button-module__hop-Button--primary___bevo3", "hop-ToggleButton--secondary": "ToggleButton-module__hop-ToggleButton--secondary___5xl-A Button-module__hop-Button--secondary___2lN6u", "hop-ToggleButton--upsell": "ToggleButton-module__hop-ToggleButton--upsell___JBUGf Button-module__hop-Button--upsell___x5iFK", "hop-ToggleButton--danger": "ToggleButton-module__hop-ToggleButton--danger___d3Niq Button-module__hop-Button--danger___TxNzA", "hop-ToggleButton--ghost-primary": "ToggleButton-module__hop-ToggleButton--ghost-primary___3sKrJ Button-module__hop-Button--ghost-primary___zTyfn", "hop-ToggleButton--ghost-secondary": "ToggleButton-module__hop-ToggleButton--ghost-secondary___PSQ5q Button-module__hop-Button--ghost-secondary___-tiCx", "hop-ToggleButton--ghost-danger": "ToggleButton-module__hop-ToggleButton--ghost-danger___-R90- Button-module__hop-Button--ghost-danger___-uxom", "hop-ToggleButton--loading": "ToggleButton-module__hop-ToggleButton--loading___duNLA", "hop-ToggleButton__Spinner": "ToggleButton-module__hop-ToggleButton__Spinner___kXQ1- Button-module__hop-Button__Spinner___NNSKQ", "hop-ToggleButton__icon": "ToggleButton-module__hop-ToggleButton__icon___t8zzx Button-module__hop-Button__icon___fajIl", "hop-ToggleButton__icon-list": "ToggleButton-module__hop-ToggleButton__icon-list___f4GKj Button-module__hop-Button__icon___fajIl Button-module__hop-Button__icon-list___FwjZ6", "hop-ToggleButton__text": "ToggleButton-module__hop-ToggleButton__text___IUQQm Button-module__hop-Button__text___aTRCJ", "hop-ToggleButton__end-icon": "ToggleButton-module__hop-ToggleButton__end-icon___JReWC Button-module__hop-Button__end-icon___1NXlG", "hop-ToggleButton__end-icon-list": "ToggleButton-module__hop-ToggleButton__end-icon-list___dhcVl Button-module__hop-Button__end-icon___1NXlG Button-module__hop-Button__icon-list___FwjZ6" };
 var GlobalToggleButtonCssSelector = "hop-ToggleButton";
 var ToggleButtonToIconSizeAdapter = {
   xs: "sm",

package/dist/{chunk-C6AXA7GR.js → chunk-VZIO2ER4.js}

@@ -1,6 +1,6 @@
 import { ModalTrigger } from './chunk-YVZGV7LZ.js';
 import { CustomModalContext } from './chunk-AJKN2ALX.js';
-import { _BaseModal } from './chunk-XR2KMOKA.js';
+import { _BaseModal } from './chunk-YEGNTSA6.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import clsx from 'clsx';
@@ -9,7 +9,7 @@ import { useContextProps, composeRenderProps, Dialog, OverlayTriggerStateContext
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./CustomModal.module.css#css-module
-var CustomModal_module_default = { "hop-CustomModal": "CustomModal-module__hop-CustomModal___fxNwj" };
+var CustomModal_module_default = { "hop-CustomModal": "CustomModal-module__hop-CustomModal___ASN33" };
 var GlobalCustomModalCssSelector = "hop-CustomModal";
 var CustomModal = (props, ref) => {
   var _a;

package/dist/{chunk-YOSQFXTS.js → chunk-W5ULC3M5.js}

@@ -9,7 +9,7 @@ import { useContextProps, Provider } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Illustration.module.css#css-module
-var Illustration_module_default = { "hop-Illustration": "Illustration-module__hop-Illustration___Y8xrj", "hop-Illustration__image": "Illustration-module__hop-Illustration__image___-trUC", "hop-Illustration--horizontal": "Illustration-module__hop-Illustration--horizontal___BaJ8G", "hop-Illustration--vertical": "Illustration-module__hop-Illustration--vertical___LWltv", "hop-Illustration--rounded": "Illustration-module__hop-Illustration--rounded___TxYlv" };
+var Illustration_module_default = { "hop-Illustration": "Illustration-module__hop-Illustration___jTFrR", "hop-Illustration__image": "Illustration-module__hop-Illustration__image___jHBsF", "hop-Illustration--horizontal": "Illustration-module__hop-Illustration--horizontal___SNHJh", "hop-Illustration--vertical": "Illustration-module__hop-Illustration--vertical___5naCd", "hop-Illustration--rounded": "Illustration-module__hop-Illustration--rounded___ZKzCm" };
 var GlobalIllustrationCssSelector = "hop-Illustration";
 function Illustration(props, ref) {
   [props, ref] = useContextProps(props, ref, IllustrationContext);

package/dist/{chunk-ZO4KL6O2.js → chunk-WF6QU5EL.js}

@@ -7,7 +7,7 @@ import { useContextProps, Text } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./OverlineText.module.css#css-module
-var OverlineText_module_default = { "hop-OverlineText": "OverlineText-module__hop-OverlineText___PEzYS", "hop-OverlineText__text": "OverlineText-module__hop-OverlineText__text___gOQjc" };
+var OverlineText_module_default = { "hop-OverlineText": "OverlineText-module__hop-OverlineText___--ISW", "hop-OverlineText__text": "OverlineText-module__hop-OverlineText__text___Hfbg2" };
 var GlobalOverlineTextCssSelector = "hop-OverlineText";
 function OverlineText(props, ref) {
   [props, ref] = useContextProps(props, ref, OverlineTextContext);

package/dist/{chunk-FW3KW7JW.js → chunk-WXCDVL74.js}

@@ -1,14 +1,14 @@
 import { useTruncatedText } from './chunk-Z57VHYOF.js';
 import { TextFieldContext } from './chunk-O4XPUINW.js';
-import { _RemainingCharacterCount } from './chunk-DWKKMPQS.js';
-import { _InputGroup } from './chunk-BTUFR5RF.js';
-import { Input } from './chunk-BESHIVCO.js';
-import { FieldLabel } from './chunk-EFOA3ONM.js';
-import { _HelperMessage } from './chunk-XGOGILJI.js';
-import { _ErrorMessage } from './chunk-VCDBSIB6.js';
-import { _ClearButton } from './chunk-JI3EHV5X.js';
-import { useFormProps } from './chunk-Y2F3EB7C.js';
-import { ensureTextWrapper } from './chunk-PYB6GZIG.js';
+import { _RemainingCharacterCount } from './chunk-3W6I45XI.js';
+import { _InputGroup } from './chunk-ONWHZMKV.js';
+import { Input } from './chunk-NXM4YW6Y.js';
+import { FieldLabel } from './chunk-CJAVXRN6.js';
+import { _HelperMessage } from './chunk-ENPWF5RT.js';
+import { _ErrorMessage } from './chunk-OODFQTJN.js';
+import { _ClearButton } from './chunk-QGQRMUA7.js';
+import { useFormProps } from './chunk-UMD2QXPA.js';
+import { ensureTextWrapper } from './chunk-QFGSXBXR.js';
 import { ClearContainerSlots } from './chunk-PQSMCDAM.js';
 import { TextContext } from './chunk-ZNOU2CGM.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
@@ -25,7 +25,7 @@ import { useContextProps, composeRenderProps, TextField as TextField$1 } from 'r
 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___Vp6Lb", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___foCHy", "hop-TextField__Label": "TextField-module__hop-TextField__Label___SjMxV", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___U3k2R", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___IiGw2", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___K4V63", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___HFwm7" };
+var TextField_module_default = { "hop-TextField": "TextField-module__hop-TextField___2uTE9", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___NCv2I", "hop-TextField__Label": "TextField-module__hop-TextField__Label___Xhtw3", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___z37Bu", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___XAD4z", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___WyMQ6", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___9RKuq" };
 var GlobalTextFieldCssSelector = "hop-TextField";
 function TextField(props, ref) {
   var _a;

package/dist/{chunk-OFKWBVZA.js → chunk-X6RAJRZR.js}

@@ -5,7 +5,7 @@ import { MenuSection as MenuSection$1 } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./MenuSection.module.css#css-module
-var MenuSection_module_default = { "hop-MenuSection": "MenuSection-module__hop-MenuSection___uNwVk" };
+var MenuSection_module_default = { "hop-MenuSection": "MenuSection-module__hop-MenuSection___VHyYW" };
 var GlobalMenuSectionCssSelector = "hop-MenuSection";
 function MenuSection(props) {
   const { stylingProps, ...ownProps } = useStyledSystem(props);

package/dist/{chunk-7TXN6V2Z.js → chunk-XETL5DZ2.js}

@@ -2,10 +2,10 @@ import { SvgImageContext } from './chunk-M4CKZFAM.js';
 import { IllustratedMessageContext } from './chunk-W4TCUPPA.js';
 import { IllustrationContext } from './chunk-OL24RVDF.js';
 import { ImageContext } from './chunk-JAR7CXVS.js';
+import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { HeadingContext } from './chunk-WJRMD4JP.js';
 import { ContentContext } from './chunk-IXB2WK56.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
-import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, Div } from '@hopper-ui/styled-system';
@@ -15,7 +15,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./IllustratedMessage.module.css#css-module
-var IllustratedMessage_module_default = { "hop-IllustratedMessage": "IllustratedMessage-module__hop-IllustratedMessage___MvSJR", "hop-IllustratedMessage--sm": "IllustratedMessage-module__hop-IllustratedMessage--sm___ZuXh2", "hop-IllustratedMessage--md": "IllustratedMessage-module__hop-IllustratedMessage--md___GETgI", "hop-IllustratedMessage--lg": "IllustratedMessage-module__hop-IllustratedMessage--lg___UUJEc", "hop-IllustratedMessage__image": "IllustratedMessage-module__hop-IllustratedMessage__image___kkyHE", "hop-IllustratedMessage__illustration": "IllustratedMessage-module__hop-IllustratedMessage__illustration___aNE7w", "hop-IllustratedMessage__heading": "IllustratedMessage-module__hop-IllustratedMessage__heading___6NUci", "hop-IllustratedMessage__content": "IllustratedMessage-module__hop-IllustratedMessage__content___yiMF3", "hop-IllustratedMessage__buttonGroup": "IllustratedMessage-module__hop-IllustratedMessage__buttonGroup___sFYES", "hop-IllustratedMessage__button": "IllustratedMessage-module__hop-IllustratedMessage__button___tFnq1" };
+var IllustratedMessage_module_default = { "hop-IllustratedMessage": "IllustratedMessage-module__hop-IllustratedMessage___JLyrr", "hop-IllustratedMessage--sm": "IllustratedMessage-module__hop-IllustratedMessage--sm___8YdZJ", "hop-IllustratedMessage--md": "IllustratedMessage-module__hop-IllustratedMessage--md___wgdAk", "hop-IllustratedMessage--lg": "IllustratedMessage-module__hop-IllustratedMessage--lg___bu-6d", "hop-IllustratedMessage__image": "IllustratedMessage-module__hop-IllustratedMessage__image___-w00N", "hop-IllustratedMessage__illustration": "IllustratedMessage-module__hop-IllustratedMessage__illustration___9KxJt", "hop-IllustratedMessage__heading": "IllustratedMessage-module__hop-IllustratedMessage__heading___b4b7L", "hop-IllustratedMessage__content": "IllustratedMessage-module__hop-IllustratedMessage__content___xyW64", "hop-IllustratedMessage__buttonGroup": "IllustratedMessage-module__hop-IllustratedMessage__buttonGroup___OyQ7T", "hop-IllustratedMessage__button": "IllustratedMessage-module__hop-IllustratedMessage__button___mzz3b" };
 var GlobalIllustratedMessageCssSelector = "hop-IllustratedMessage";
 function IllustratedMessage(props, ref) {
   [props, ref] = useContextProps(props, ref, IllustratedMessageContext);