@hopper-ui/components 1.0.13 → 1.2.0

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

@@ -12,7 +12,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./RadioField.module.css#css-module
-var RadioField_module_default = { "hop-RadioField": "RadioField-module__hop-RadioField___WTErz", "hop-RadioField--sm": "RadioField-module__hop-RadioField--sm___CHfcV", "hop-RadioField--md": "RadioField-module__hop-RadioField--md___g1iHe", "hop-RadioField__description": "RadioField-module__hop-RadioField__description___LgMd1", "hop-RadioField__radio": "RadioField-module__hop-RadioField__radio___SByLu" };
+var RadioField_module_default = { "hop-RadioField": "RadioField-module__hop-RadioField___uuirX", "hop-RadioField--sm": "RadioField-module__hop-RadioField--sm___1lfkD", "hop-RadioField--md": "RadioField-module__hop-RadioField--md___ytruf", "hop-RadioField__description": "RadioField-module__hop-RadioField__description___waqNk", "hop-RadioField__radio": "RadioField-module__hop-RadioField__radio___ySRK1" };
 var GlobalRadioFieldCssSelector = "hop-RadioField";
 var RadioToDescriptionSizeAdapter = {
   sm: "xs",

package/dist/{chunk-ERE2XRQA.js → chunk-PQXVL3YJ.js}

@@ -7,7 +7,7 @@ import { useContextProps, Heading as Heading$1 } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Heading.module.css#css-module
-var Heading_module_default = { "hop-Heading": "Heading-module__hop-Heading___FB1PP", "hop-Heading--xs": "Heading-module__hop-Heading--xs___ZJL3P", "hop-Heading--sm": "Heading-module__hop-Heading--sm___fp3A6", "hop-Heading--md": "Heading-module__hop-Heading--md___rEF7K", "hop-Heading--lg": "Heading-module__hop-Heading--lg___kCSub", "hop-Heading--xl": "Heading-module__hop-Heading--xl___5VyFh", "hop-Heading--2xl": "Heading-module__hop-Heading--2xl___-qmiM", "hop-Heading--3xl": "Heading-module__hop-Heading--3xl___xDM3d" };
+var Heading_module_default = { "hop-Heading": "Heading-module__hop-Heading___FVhfN", "hop-Heading--xs": "Heading-module__hop-Heading--xs___t30s-", "hop-Heading--sm": "Heading-module__hop-Heading--sm___R6y6i", "hop-Heading--md": "Heading-module__hop-Heading--md___d6d9m", "hop-Heading--lg": "Heading-module__hop-Heading--lg___yqjzy", "hop-Heading--xl": "Heading-module__hop-Heading--xl___U0Gfz", "hop-Heading--2xl": "Heading-module__hop-Heading--2xl___B7lym", "hop-Heading--3xl": "Heading-module__hop-Heading--3xl___P65x-" };
 var GlobalHeadingCssSelector = "hop-Heading";
 function Heading(props, ref) {
   [props, ref] = useContextProps(props, ref, HeadingContext);

package/dist/{chunk-CCIVRIKG.js → chunk-Q63YLWI6.js}

@@ -4,12 +4,12 @@ import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import { mergeRefs } from '@react-aria/utils';
-import { forwardRef, useRef, useCallback } from 'react';
-import { useContextProps, useSlottedContext, InputContext, composeRenderProps, Group } from 'react-aria-components';
+import { forwardRef, useRef, useContext, useCallback } from 'react';
+import { useContextProps, useSlottedContext, InputContext, TextAreaContext, FieldErrorContext, composeRenderProps, Group } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./InputGroup.module.css#css-module
-var InputGroup_module_default = { "hop-InputGroup": "InputGroup-module__hop-InputGroup___yPMIO", "hop-InputGroup--fluid": "InputGroup-module__hop-InputGroup--fluid___SDrjN", "hop-InputGroup--sm": "InputGroup-module__hop-InputGroup--sm___uk-A0", "hop-InputGroup__input": "InputGroup-module__hop-InputGroup__input___aerYh" };
+var InputGroup_module_default = { "hop-InputGroup": "InputGroup-module__hop-InputGroup___PiLz0", "hop-InputGroup--fluid": "InputGroup-module__hop-InputGroup--fluid___Cp15-", "hop-InputGroup--sm": "InputGroup-module__hop-InputGroup--sm___ZeMr9", "hop-InputGroup__input": "InputGroup-module__hop-InputGroup__input___xLgn9", "hop-InputGroup__textarea": "InputGroup-module__hop-InputGroup__textarea___6Go7N" };
 var GlobalInputGroupCssSelector = "hop-InputGroup";
 function InputGroup(props, ref) {
   var _a, _b;
@@ -17,6 +17,9 @@ function InputGroup(props, ref) {
   const inputRef = useRef(null);
   const inputContext = useSlottedContext(InputContext);
   const mergedRefs = (inputContext == null ? void 0 : inputContext.ref) ? mergeRefs(inputRef, inputContext == null ? void 0 : inputContext.ref) : inputRef;
+  const textAreaRef = useRef(null);
+  const textAreaContext = useSlottedContext(TextAreaContext);
+  const mergedTextAreaRefs = (textAreaContext == null ? void 0 : textAreaContext.ref) ? mergeRefs(textAreaRef, textAreaContext == null ? void 0 : textAreaContext.ref) : textAreaRef;
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
     className,
@@ -24,7 +27,9 @@ function InputGroup(props, ref) {
     children,
     size: sizeProp,
     isFluid: isFluidProp,
+    isInvalid,
     inputClassName,
+    inputType = "text",
     onMouseDown,
     ...otherProps
   } = ownProps;
@@ -41,6 +46,7 @@ function InputGroup(props, ref) {
     ),
     stylingProps.className
   );
+  const validation = useContext(FieldErrorContext);
   const style = composeRenderProps(styleProp, (prev) => {
     return {
       ...stylingProps.style,
@@ -62,16 +68,23 @@ function InputGroup(props, ref) {
           ...inputContext,
           ref: mergedRefs,
           className: composeClassnameRenderProps(inputContext == null ? void 0 : inputContext.className, inputClassName, InputGroup_module_default["hop-InputGroup__input"])
+        }],
+        [TextAreaContext, {
+          ...textAreaContext,
+          ref: mergedTextAreaRefs,
+          className: composeClassnameRenderProps(textAreaContext == null ? void 0 : textAreaContext.className, inputClassName, InputGroup_module_default["hop-InputGroup__textarea"])
         }]
       ],
       children: /* @__PURE__ */ jsx(
         Group,
         {
           ...otherProps,
+          isInvalid: (validation == null ? void 0 : validation.isInvalid) || isInvalid,
           onMouseDown: handleMouseDown,
           ref,
           className: classNames,
           style,
+          "data-input-type": inputType,
           children
         }
       )

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

@@ -10,7 +10,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./ButtonGroup.module.css#css-module
-var ButtonGroup_module_default = { "hop-ButtonGroup": "ButtonGroup-module__hop-ButtonGroup___0hm3B", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___EoJ-O", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___oZqn2", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___Jf3Eh", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___b2RH-", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___Cah50", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___l0jS3", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___8sZ-4" };
+var ButtonGroup_module_default = { "hop-ButtonGroup": "ButtonGroup-module__hop-ButtonGroup___pg9lD", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___IeYfB", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___20OwE", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___8cAOO", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___bXsRU", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___QRAcI", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___72Z7i", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___cVwde" };
 var GlobalButtonGroupCssSelector = "hop-ButtonGroup";
 function ButtonGroup(props, ref) {
   var _a, _b, _c, _d, _e;

package/dist/chunk-RWAVMW7T.js

@@ -0,0 +1,70 @@
+import { LabelContext } from './chunk-QCA3ZR56.js';
+import { useLocalizedString } from './chunk-F4H76S4H.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { useStyledSystem } from '@hopper-ui/styled-system';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { useContextProps, Label as Label$1 } from 'react-aria-components';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// css-module:./Label.module.css#css-module
+var Label_module_default = { "hop-Label": "Label-module__hop-Label___L4zrw", "hop-Label__indicator": "Label-module__hop-Label__indicator___mWy1n" };
+var GlobalLabelCssSelector = "hop-Label";
+function Label(props, ref) {
+  [props, ref] = useContextProps(props, ref, LabelContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    children,
+    style,
+    isRequired,
+    necessityIndicator = isRequired != null ? "icon" : null,
+    ...otherProps
+  } = ownProps;
+  const stringFormatter = useLocalizedString();
+  const classNames = clsx(
+    className,
+    GlobalLabelCssSelector,
+    cssModule(
+      Label_module_default,
+      "hop-Label"
+    ),
+    stylingProps.className
+  );
+  const mergedStyles = {
+    ...stylingProps.style,
+    ...style
+  };
+  const necessityLabel = isRequired ? stringFormatter.format("Label.necessityLabel.required") : stringFormatter.format("Label.necessityLabel.optional");
+  const requiredIndicator = /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": "true",
+      "aria-label": necessityLabel,
+      className: Label_module_default["hop-Label__indicator"],
+      children: "*"
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    Label$1,
+    {
+      ...otherProps,
+      ref,
+      className: classNames,
+      style: mergedStyles,
+      children: [
+        children,
+        necessityIndicator === "label" && /* @__PURE__ */ jsxs("span", { children: [
+          " (",
+          necessityLabel,
+          ")"
+        ] }),
+        necessityIndicator === "icon" && isRequired && requiredIndicator
+      ]
+    }
+  );
+}
+var _Label = forwardRef(Label);
+_Label.displayName = "Label";
+
+export { GlobalLabelCssSelector, _Label };

package/dist/{chunk-TNVYVDLF.js → chunk-S5CK32KM.js}

@@ -1,6 +1,6 @@
 import { SearchFieldContext } from './chunk-3NKF5TPD.js';
-import { _InputGroup } from './chunk-CCIVRIKG.js';
-import { _ClearButton } from './chunk-KARK64JC.js';
+import { _InputGroup } from './chunk-Q63YLWI6.js';
+import { _ClearButton } from './chunk-2XO5CZBO.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { HelperMessageContext } from './chunk-HZKFQ33E.js';
@@ -17,7 +17,7 @@ import { useContextProps, composeRenderProps, Input, SearchField as SearchField$
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./SearchField.module.css#css-module
-var SearchField_module_default = { "hop-SearchField": "SearchField-module__hop-SearchField___0Volv", "hop-SearchField--fluid": "SearchField-module__hop-SearchField--fluid___LVKwh", "hop-SearchField__Label": "SearchField-module__hop-SearchField__Label___mDMF5", "hop-SearchField__prefix": "SearchField-module__hop-SearchField__prefix___Rw0TX", "hop-SearchField__InputGroup": "SearchField-module__hop-SearchField__InputGroup___L69-q", "hop-SearchField--clearable": "SearchField-module__hop-SearchField--clearable___22XQJ", "hop-SearchField__ErrorMessage": "SearchField-module__hop-SearchField__ErrorMessage___JMZPT", "hop-SearchField__HelperMessage": "SearchField-module__hop-SearchField__HelperMessage___DoWSS", "hop-SearchField__ClearButton": "SearchField-module__hop-SearchField__ClearButton___sXW23" };
+var SearchField_module_default = { "hop-SearchField": "SearchField-module__hop-SearchField___eeVrI", "hop-SearchField--fluid": "SearchField-module__hop-SearchField--fluid___tJI3Z", "hop-SearchField__Label": "SearchField-module__hop-SearchField__Label___FHalK", "hop-SearchField__prefix": "SearchField-module__hop-SearchField__prefix___051pF", "hop-SearchField__InputGroup": "SearchField-module__hop-SearchField__InputGroup___4Vkaq", "hop-SearchField--clearable": "SearchField-module__hop-SearchField--clearable___yge5P", "hop-SearchField__ErrorMessage": "SearchField-module__hop-SearchField__ErrorMessage___TgcwI", "hop-SearchField__HelperMessage": "SearchField-module__hop-SearchField__HelperMessage___ACElD", "hop-SearchField__ClearButton": "SearchField-module__hop-SearchField__ClearButton___zKqjG" };
 var GlobalSearchFieldCssSelector = "hop-SearchField";
 function SearchField(props, ref) {
   var _a;
@@ -38,6 +38,7 @@ function SearchField(props, ref) {
     icon = /* @__PURE__ */ jsx(SearchIcon, {}),
     isDisabled,
     isInvalid,
+    isRequired,
     ...otherProps
   } = ownProps;
   const inputRef = useObjectRef(mergeRefs(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null));
@@ -89,7 +90,7 @@ function SearchField(props, ref) {
         SlotProvider,
         {
           values: [
-            [LabelContext, { className: SearchField_module_default["hop-SearchField__Label"] }],
+            [LabelContext, { className: SearchField_module_default["hop-SearchField__Label"], isRequired }],
             [HelperMessageContext, { className: SearchField_module_default["hop-SearchField__HelperMessage"] }],
             [ErrorMessageContext, { className: SearchField_module_default["hop-SearchField__ErrorMessage"] }]
           ],
@@ -107,6 +108,7 @@ function SearchField(props, ref) {
       className: classNames,
       isDisabled,
       isInvalid,
+      isRequired,
       ...otherProps,
       children: childrenMarkup
     }

package/dist/{chunk-LDORNYHF.js → chunk-SZSQZ4C7.js}

@@ -1,8 +1,8 @@
 import { LinkContext } from './chunk-4VVNSXIB.js';
-import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { IconListContext } from './chunk-DHVVYSLB.js';
-import { _Text } from './chunk-PAYZGXTT.js';
+import { _Text } from './chunk-XT2MZWEV.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
@@ -13,7 +13,7 @@ import { useContextProps, composeRenderProps, DEFAULT_SLOT, Link as Link$1 } fro
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Link.module.css#css-module
-var Link_module_default = { "hop-Link": "Link-module__hop-Link___Hq4l1", "hop-Link--quiet": "Link-module__hop-Link--quiet___ozYD8", "hop-Link--primary": "Link-module__hop-Link--primary___AKRce", "hop-Link--secondary": "Link-module__hop-Link--secondary___kYwz9", "hop-Link__icon": "Link-module__hop-Link__icon___mxuev", "hop-Link__icon-list": "Link-module__hop-Link__icon-list___tQIDd", "hop-Link__text": "Link-module__hop-Link__text___-UVs-", "hop-Link__start-icon": "Link-module__hop-Link__start-icon___OeHzX", "hop-Link__start-icon-list": "Link-module__hop-Link__start-icon-list___zZt0A" };
+var Link_module_default = { "hop-Link": "Link-module__hop-Link___7j4hs", "hop-Link--quiet": "Link-module__hop-Link--quiet___qnop0", "hop-Link--primary": "Link-module__hop-Link--primary___rpo9E", "hop-Link--secondary": "Link-module__hop-Link--secondary___SMBNe", "hop-Link__icon": "Link-module__hop-Link__icon___vyHs-", "hop-Link__icon-list": "Link-module__hop-Link__icon-list___6SUHC", "hop-Link__text": "Link-module__hop-Link__text___y7rFF", "hop-Link__start-icon": "Link-module__hop-Link__start-icon___tiWhC", "hop-Link__start-icon-list": "Link-module__hop-Link__start-icon-list___kbqc7" };
 var GlobalLinkCssSelector = "hop-Link";
 var LinkToIconSizeAdapter = {
   inherit: void 0,

package/dist/{chunk-UPR32DV5.js → chunk-T6MAOVLH.js}

@@ -1,6 +1,6 @@
 import { useRenderProps } from './chunk-NH3IVMXB.js';
 import { ErrorMessageContext } from './chunk-FAE27DLF.js';
-import { _Text } from './chunk-PAYZGXTT.js';
+import { _Text } from './chunk-XT2MZWEV.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { WarningIcon } from '@hopper-ui/icons';
 import { useStyledSystem } from '@hopper-ui/styled-system';
@@ -10,7 +10,7 @@ import { FieldErrorContext, useContextProps } from 'react-aria-components';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./ErrorMessage.module.css#css-module
-var ErrorMessage_module_default = { "hop-ErrorMessage": "ErrorMessage-module__hop-ErrorMessage___hGjrh", "hop-ErrorMessage__icon": "ErrorMessage-module__hop-ErrorMessage__icon___wE1hg" };
+var ErrorMessage_module_default = { "hop-ErrorMessage": "ErrorMessage-module__hop-ErrorMessage___6qmlS", "hop-ErrorMessage__icon": "ErrorMessage-module__hop-ErrorMessage__icon___m4Mae" };
 var GlobalErrorMessageCssSelector = "hop-ErrorMessage";
 function ErrorMessage(props, ref) {
   const validation = useContext(FieldErrorContext);

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

@@ -1,142 +1,107 @@
 import { PopoverContext } from './chunk-SC6ZK5ON.js';
-import { TagContext } from './chunk-EWMWQ2MC.js';
 import { ContentContext } from './chunk-IXB2WK56.js';
 import { FooterContext } from './chunk-I67NHYK4.js';
+import { PasswordFieldContext } from './chunk-QW45G6K4.js';
+import { SearchFieldContext } from './chunk-3NKF5TPD.js';
+import { TextAreaContext } from './chunk-MHQZXLKW.js';
+import { TextFieldContext } from './chunk-O4XPUINW.js';
+import { NumberFieldContext } from './chunk-ZQ3AWYRR.js';
 import { HeadingContext } from './chunk-TXZ6BMFR.js';
+import { CheckboxFieldContext } from './chunk-ZGNK4GWA.js';
+import { CheckboxGroupContext } from './chunk-N7YDPVZL.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
 import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
-import { _ClearButton } from './chunk-KARK64JC.js';
-import { _Spinner } from './chunk-AMXRADUV.js';
 import { LinkContext } from './chunk-4VVNSXIB.js';
 import { isFunction, isNil } from './chunk-TIPN4VYD.js';
-import { useLocalizedString } from './chunk-YEYNRBMQ.js';
+import { RadioGroupContext } from './chunk-5MBJWRZD.js';
+import { CheckboxContext } from './chunk-2EAZPH3M.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { _HopperProvider } from './chunk-NMKBUGSO.js';
-import { BadgeContext } from './chunk-CQDLZ42T.js';
-import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
-import { IconListContext } from './chunk-DHVVYSLB.js';
-import { _Text } from './chunk-PAYZGXTT.js';
-import { TextContext } from './chunk-X6SER3TZ.js';
-import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
+import { FormContext } from './chunk-EURJK4ZT.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
-import { IconContext } from '@hopper-ui/icons';
-import { useStyledSystem, useResponsiveValue, useColorSchemeContext } from '@hopper-ui/styled-system';
+import { useStyledSystem, useColorSchemeContext, useResponsiveValue } from '@hopper-ui/styled-system';
 export * from '@hopper-ui/styled-system';
+import clsx from 'clsx';
 import { forwardRef, useReducer, useRef, useEffect } from 'react';
-import { useContextProps, composeRenderProps, Tag as Tag$1, Popover as Popover$1, Dialog } from 'react-aria-components';
+import { useContextProps, Popover as Popover$1, Dialog, Form as Form$1 } from 'react-aria-components';
 export { Collection } from 'react-aria-components';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import clsx from 'clsx';
+import { jsx } from 'react/jsx-runtime';
 
-// css-module:./Tag.module.css#css-module
-var Tag_module_default = { "hop-Tag": "Tag-module__hop-Tag___uLop7", "hop-Tag--md": "Tag-module__hop-Tag--md___zQef7", "hop-Tag__icon": "Tag-module__hop-Tag__icon___1WuBJ", "hop-Tag__icon-list": "Tag-module__hop-Tag__icon-list___VWSnJ", "hop-Tag__badge": "Tag-module__hop-Tag__badge___6wq28", "hop-Tag__remove-btn": "Tag-module__hop-Tag__remove-btn___ltB14", "hop-Tag__Spinner": "Tag-module__hop-Tag__Spinner___ASKZ9", "hop-Tag--lg": "Tag-module__hop-Tag--lg___bwIxr", "hop-Tag__text": "Tag-module__hop-Tag__text___vJciq", "hop-Badge--secondary": "Tag-module__hop-Badge--secondary___tSUkl" };
-var GlobalTagCssSelector = "hop-Tag";
-var TagToTextSizeAdapter = {
-  md: "xs",
-  lg: "sm"
-};
-function Tag(props, ref) {
-  var _a;
-  [props, ref] = useContextProps(props, ref, TagContext);
+// css-module:./Popover.module.css#css-module
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___nKZak", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___vnp7r", "hop-Popover__title": "Popover-module__hop-Popover__title___NazSs", "hop-Popover__actions": "Popover-module__hop-Popover__actions___VImV7", "hop-Popover__action": "Popover-module__hop-Popover__action___fsXDT", "hop-Popover__content": "Popover-module__hop-Popover__content___fZfhh", "hop-Popover__footer": "Popover-module__hop-Popover__footer___GPaEX" };
+var GlobalPopoverCssSelector = "hop-Popover";
+function Popover(props, ref) {
+  [props, ref] = useContextProps(props, ref, PopoverContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
+    children,
     className,
-    children: childrenProp,
-    isInvalid,
-    isLoading,
-    size: sizeProp = "md",
-    style: styleProp,
-    textValue: textValueProp,
+    offset = 4,
+    boundaryOffset,
     ...otherProps
   } = ownProps;
-  const stringFormatter = useLocalizedString();
-  const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "md";
-  const textValue = textValueProp != null ? textValueProp : typeof childrenProp === "string" ? childrenProp : void 0;
-  const classNames = composeClassnameRenderProps(
+  const { colorScheme } = useColorSchemeContext();
+  const popoverClassNames = composeClassnameRenderProps(
     className,
-    GlobalTagCssSelector,
+    GlobalPopoverCssSelector,
     cssModule(
-      Tag_module_default,
-      "hop-Tag",
-      size
-    ),
-    stylingProps.className
+      Popover_module_default,
+      "hop-Popover"
+    )
   );
-  const style = composeRenderProps(styleProp, (prev) => {
-    return {
-      ...stylingProps.style,
-      ...prev
-    };
-  });
-  const children = composeRenderProps(childrenProp, (prev) => {
-    if (prev && isTextOnlyChildren(prev)) {
-      return /* @__PURE__ */ jsx(_Text, { children: prev });
-    }
-    return prev;
-  });
   return /* @__PURE__ */ jsx(
-    Tag$1,
+    Popover$1,
     {
       ...otherProps,
+      offset,
       ref,
-      className: classNames,
-      style,
-      textValue,
-      "data-invalid": isInvalid || void 0,
-      "data-loading": isLoading || void 0,
-      children: (tagProps) => {
-        const { allowsRemoving, isDisabled } = tagProps;
-        return /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(ClearContainerSlots, { children: /* @__PURE__ */ jsx(
+      className: popoverClassNames,
+      arrowBoundaryOffset: boundaryOffset,
+      children: (state) => /* @__PURE__ */ jsx(_HopperProvider, { colorScheme, children: /* @__PURE__ */ jsx(
+        Dialog,
+        {
+          className: clsx(stylingProps.className, Popover_module_default["hop-Popover__dialog"]),
+          style: stylingProps.style,
+          children: /* @__PURE__ */ jsx(
             SlotProvider,
             {
               values: [
-                [TextContext, {
-                  className: Tag_module_default["hop-Tag__text"],
-                  size: TagToTextSizeAdapter[size]
+                [HeadingContext, {
+                  className: Popover_module_default["hop-Popover__title"],
+                  size: "xs"
+                }],
+                [ButtonContext, {
+                  size: "sm",
+                  className: Popover_module_default["hop-Popover__action"]
+                }],
+                [ButtonGroupContext, {
+                  size: "sm",
+                  align: "end",
+                  className: Popover_module_default["hop-Popover__actions"]
                 }],
-                [IconListContext, {
-                  className: Tag_module_default["hop-Tag__icon-list"],
-                  size: "sm"
+                [ContentContext, {
+                  className: Popover_module_default["hop-Popover__content"]
                 }],
-                [IconContext, {
-                  className: Tag_module_default["hop-Tag__icon"],
-                  size: "sm"
+                [FooterContext, {
+                  className: Popover_module_default["hop-Popover__footer"]
                 }],
-                [BadgeContext, {
-                  className: Tag_module_default["hop-Tag__badge"],
-                  isDisabled
+                [LinkContext, {
+                  size: "sm",
+                  variant: "primary",
+                  isQuiet: true
                 }]
               ],
-              children: children(tagProps)
-            }
-          ) }),
-          allowsRemoving && !isLoading && /* @__PURE__ */ jsx(
-            _ClearButton,
-            {
-              slot: "remove",
-              isDisabled,
-              className: Tag_module_default["hop-Tag__remove-btn"],
-              "aria-label": stringFormatter.format("Tag.removeAriaLabel"),
-              size
-            }
-          ),
-          isLoading && /* @__PURE__ */ jsx(
-            _Spinner,
-            {
-              "aria-label": stringFormatter.format("Tag.spinnerAriaLabel"),
-              size: "sm",
-              className: Tag_module_default["hop-Tag__Spinner"]
+              children: isFunction(children) && !isNil(children) ? children(state) : children
             }
           )
-        ] });
-      }
+        }
+      ) })
     }
   );
 }
-var _Tag = forwardRef(Tag);
-_Tag.displayName = "Tag";
+var _Popover = forwardRef(Popover);
+_Popover.displayName = "Popover";
 function $0d86e9c8f07f9a7b$export$79c0c687a5963b0a(opts, dispatch) {
   let { cursor, getKey } = opts;
   return {
@@ -547,79 +512,97 @@ function $f86e6c1ec7da6ebb$export$bc3384a35de93d66(options) {
   };
 }
 
-// css-module:./Popover.module.css#css-module
-var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___NgSy-", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___7Vmsr", "hop-Popover__title": "Popover-module__hop-Popover__title___Ej7kd", "hop-Popover__actions": "Popover-module__hop-Popover__actions___KA---", "hop-Popover__action": "Popover-module__hop-Popover__action___fjhx-", "hop-Popover__content": "Popover-module__hop-Popover__content___-cu9Q", "hop-Popover__footer": "Popover-module__hop-Popover__footer___ri-Tk" };
-var GlobalPopoverCssSelector = "hop-Popover";
-function Popover(props, ref) {
-  [props, ref] = useContextProps(props, ref, PopoverContext);
+// css-module:./Form.module.css#css-module
+var Form_module_default = { "hop-Form": "Form-module__hop-Form___WWA27" };
+var GlobalFormCssSelector = "hop-Form";
+function Form(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, FormContext);
   const { stylingProps, ...ownProps } = useStyledSystem(props);
   const {
-    children,
     className,
-    offset = 4,
-    boundaryOffset,
+    children,
+    style,
+    isFluid,
+    isDisabled,
+    size: sizeProp,
     ...otherProps
   } = ownProps;
-  const { colorScheme } = useColorSchemeContext();
-  const popoverClassNames = composeClassnameRenderProps(
-    className,
-    GlobalPopoverCssSelector,
+  const size = (_a = useResponsiveValue(sizeProp)) != null ? _a : "md";
+  const classNames = clsx(
+    GlobalFormCssSelector,
     cssModule(
-      Popover_module_default,
-      "hop-Popover"
-    )
+      Form_module_default,
+      "hop-Form"
+    ),
+    stylingProps.className,
+    className
   );
+  const mergedStyles = {
+    ...stylingProps.style,
+    ...style
+  };
   return /* @__PURE__ */ jsx(
-    Popover$1,
+    SlotProvider,
     {
-      ...otherProps,
-      offset,
-      ref,
-      className: popoverClassNames,
-      arrowBoundaryOffset: boundaryOffset,
-      children: (state) => /* @__PURE__ */ jsx(_HopperProvider, { colorScheme, children: /* @__PURE__ */ jsx(
-        Dialog,
+      values: [
+        [TextFieldContext, {
+          isDisabled,
+          isFluid,
+          size
+        }],
+        [PasswordFieldContext, {
+          isDisabled,
+          isFluid,
+          size
+        }],
+        [SearchFieldContext, {
+          isDisabled,
+          isFluid,
+          size
+        }],
+        [NumberFieldContext, {
+          isDisabled,
+          size,
+          isFluid
+        }],
+        [TextAreaContext, {
+          isDisabled,
+          size,
+          isFluid
+        }],
+        [RadioGroupContext, {
+          isDisabled,
+          size
+        }],
+        [CheckboxContext, {
+          isDisabled,
+          size
+        }],
+        [CheckboxFieldContext, {
+          isDisabled,
+          size
+        }],
+        [CheckboxGroupContext, {
+          isDisabled,
+          size
+        }],
+        [ButtonContext, { isDisabled, size }]
+      ],
+      children: /* @__PURE__ */ jsx(
+        Form$1,
         {
-          className: clsx(stylingProps.className, Popover_module_default["hop-Popover__dialog"]),
-          style: stylingProps.style,
-          children: /* @__PURE__ */ jsx(
-            SlotProvider,
-            {
-              values: [
-                [HeadingContext, {
-                  className: Popover_module_default["hop-Popover__title"],
-                  size: "xs"
-                }],
-                [ButtonContext, {
-                  size: "sm",
-                  className: Popover_module_default["hop-Popover__action"]
-                }],
-                [ButtonGroupContext, {
-                  size: "sm",
-                  align: "end",
-                  className: Popover_module_default["hop-Popover__actions"]
-                }],
-                [ContentContext, {
-                  className: Popover_module_default["hop-Popover__content"]
-                }],
-                [FooterContext, {
-                  className: Popover_module_default["hop-Popover__footer"]
-                }],
-                [LinkContext, {
-                  size: "sm",
-                  variant: "primary",
-                  isQuiet: true
-                }]
-              ],
-              children: isFunction(children) && !isNil(children) ? children(state) : children
-            }
-          )
+          ...otherProps,
+          ref,
+          className: classNames,
+          style: mergedStyles,
+          children
         }
-      ) })
+      )
     }
   );
 }
-var _Popover = forwardRef(Popover);
-_Popover.displayName = "Popover";
+var _Form = forwardRef(Form);
+_Form.displayName = "Form";
 
-export { $f86e6c1ec7da6ebb$export$bc3384a35de93d66, GlobalPopoverCssSelector, GlobalTagCssSelector, _Popover, _Tag };
+export { $f86e6c1ec7da6ebb$export$bc3384a35de93d66, GlobalFormCssSelector, GlobalPopoverCssSelector, _Form, _Popover };