@hopper-ui/components 1.5.12 → 1.5.13

package/dist/chunk-WBSUD7UN.js

@@ -0,0 +1,174 @@
+import { TextFieldContext } from './chunk-O4XPUINW.js';
+import { useTruncatedText } from './chunk-Z57VHYOF.js';
+import { _RemainingCharacterCount } from './chunk-H3CEJLCO.js';
+import { Input } from './chunk-AAMIUZW2.js';
+import { _InputGroup } from './chunk-X7VALEJB.js';
+import { _Label } from './chunk-SA322LHS.js';
+import { _HelperMessage } from './chunk-HANWII4T.js';
+import { _ErrorMessage } from './chunk-CFXK2ZSA.js';
+import { _ClearButton } from './chunk-CHA2MOQZ.js';
+import { useFormProps } from './chunk-YMTZYK3U.js';
+import { ensureTextWrapper } from './chunk-WPIH4OAE.js';
+import { ClearContainerSlots } from './chunk-WJ55ZV54.js';
+import { TextContext } from './chunk-ZNOU2CGM.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';
+import { useStyledSystem, useResponsiveValue, useIsomorphicLayoutEffect } from '@hopper-ui/styled-system';
+import { mergeRefs } from '@react-aria/utils';
+import { useControlledState } from '@react-stately/utils';
+import clsx from 'clsx';
+import { forwardRef, useState, useCallback } from 'react';
+import { useObjectRef } from 'react-aria';
+import { useContextProps, composeRenderProps, TextField as TextField$1 } from 'react-aria-components';
+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___EANDN", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___6Lfyy", "hop-TextField__Label": "TextField-module__hop-TextField__Label___rCGQ-", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___3tKVM", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___Ov5s7", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___RFHuM", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___Bn5QI" };
+var GlobalTextFieldCssSelector = "hop-TextField";
+function TextField(props, ref) {
+  var _a;
+  const {
+    inputRef: userProvidedInputRef = null,
+    ...propsWithoutRef
+  } = props;
+  [props, ref] = useContextProps(propsWithoutRef, ref, TextFieldContext);
+  props = useFormProps(props);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const [characterCount, setCharacterCount] = useState(() => {
+    var _a2, _b, _c, _d;
+    return (_d = (_c = (_a2 = props.value) == null ? void 0 : _a2.length) != null ? _c : (_b = props.defaultValue) == null ? void 0 : _b.length) != null ? _d : 0;
+  });
+  const {
+    className,
+    style: styleProp,
+    size,
+    prefix,
+    showCharacterCount,
+    maxLength,
+    placeholder,
+    isClearable,
+    onChange: onChangeProp,
+    onClear,
+    defaultValue,
+    value: valueProp,
+    isFluid: isFluidProp,
+    isDisabled,
+    isInvalid,
+    isRequired,
+    allowExceedingMaxLength,
+    necessityIndicator,
+    inputGroupProps,
+    remainingCharacterCountProps,
+    label,
+    description,
+    errorMessage,
+    ...otherProps
+  } = ownProps;
+  const inputRef = useObjectRef(mergeRefs(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null));
+  const isFluid = (_a = useResponsiveValue(isFluidProp)) != null ? _a : false;
+  const overMaxLength = !!maxLength && characterCount > maxLength;
+  const classNames = composeClassnameRenderProps(
+    className,
+    GlobalTextFieldCssSelector,
+    cssModule(
+      TextField_module_default,
+      "hop-TextField",
+      isClearable && "clearable",
+      isFluid && "fluid"
+    ),
+    stylingProps.className
+  );
+  const style = composeRenderProps(styleProp, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const handleTextChanged = useCallback((value2) => {
+    setCharacterCount(value2.length);
+    onChangeProp == null ? void 0 : onChangeProp(value2);
+  }, [onChangeProp]);
+  const truncateText = useTruncatedText();
+  const [value, onChange] = useControlledState(valueProp, defaultValue || "", handleTextChanged);
+  const handleClear = useCallback(() => {
+    onChange("");
+    onClear == null ? void 0 : onClear();
+  }, [onChange, onClear]);
+  const showClearButton = isClearable && characterCount !== 0;
+  if (showCharacterCount && !maxLength) {
+    console.warn("If showCharacterCount is true, maxLength must be set to the maximum number of characters allowed in the TextField.");
+  }
+  if (allowExceedingMaxLength && !showCharacterCount) {
+    console.warn("If allowExceedingMaxLength is true, showCharacterCount must also be true.");
+  }
+  const prefixMarkup = prefix ? /* @__PURE__ */ jsx(
+    SlotProvider,
+    {
+      values: [
+        [TextContext, { size, className: TextField_module_default["hop-TextField__prefix"] }],
+        [IconContext, { size, className: TextField_module_default["hop-TextField__prefix"] }]
+      ],
+      children: ensureTextWrapper(prefix)
+    }
+  ) : null;
+  useIsomorphicLayoutEffect(() => {
+    if (!allowExceedingMaxLength) {
+      const newValue = truncateText(value, maxLength);
+      onChange(newValue);
+    }
+  }, [value]);
+  const { className: inputGroupClassName, ...otherInputGroupProps } = inputGroupProps != null ? inputGroupProps : {};
+  const inputGroupClassNames = clsx(TextField_module_default["hop-TextField__InputGroup"], inputGroupClassName);
+  const inputMarkup = /* @__PURE__ */ jsx(ClearContainerSlots, { children: /* @__PURE__ */ jsxs(
+    _InputGroup,
+    {
+      isFluid: true,
+      className: inputGroupClassNames,
+      isDisabled,
+      isInvalid,
+      ...otherInputGroupProps,
+      children: [
+        prefixMarkup,
+        /* @__PURE__ */ jsx(Input, { ref: inputRef, placeholder, size }),
+        showCharacterCount && maxLength && /* @__PURE__ */ jsx(
+          _RemainingCharacterCount,
+          {
+            count: maxLength - characterCount,
+            isInvalid: overMaxLength,
+            isDisabled,
+            ...remainingCharacterCountProps
+          }
+        ),
+        showClearButton && /* @__PURE__ */ jsx(_ClearButton, { isDisabled, size: "lg", onPress: handleClear })
+      ]
+    }
+  ) });
+  const childrenMarkup = /* @__PURE__ */ jsxs(Fragment, { children: [
+    label && /* @__PURE__ */ jsx(_Label, { className: TextField_module_default["hop-TextField__Label"], isRequired, necessityIndicator, children: label }),
+    inputMarkup,
+    description && /* @__PURE__ */ jsx(_HelperMessage, { className: TextField_module_default["hop-TextField__HelperMessage"], children: description }),
+    /* @__PURE__ */ jsx(_ErrorMessage, { className: TextField_module_default["hop-TextField__ErrorMessage"], children: errorMessage })
+  ] });
+  return /* @__PURE__ */ jsx(
+    TextField$1,
+    {
+      ref,
+      value,
+      style,
+      className: classNames,
+      maxLength: !allowExceedingMaxLength ? maxLength : void 0,
+      onChange,
+      isDisabled,
+      isInvalid,
+      isRequired,
+      ...otherProps,
+      children: childrenMarkup
+    }
+  );
+}
+var _TextField = forwardRef(TextField);
+_TextField.displayName = "TextField";
+
+export { GlobalTextFieldCssSelector, _TextField };

package/dist/chunk-WCUPQIIB.js

@@ -0,0 +1,160 @@
+import { PopoverContext } from './chunk-RNGNPV6Q.js';
+import { isFunction, isNil } from './chunk-TIPN4VYD.js';
+import { ListBoxContext } from './chunk-4HEOTMP7.js';
+import { FooterContext } from './chunk-I67NHYK4.js';
+import { useForwardedHopperContext, _HopperProvider } from './chunk-Q3CGFKER.js';
+import { LinkContext } from './chunk-MTULE7GI.js';
+import { HeadingContext } from './chunk-WJRMD4JP.js';
+import { ContentContext } from './chunk-IXB2WK56.js';
+import { LinkButtonContext } from './chunk-3UQFC2NQ.js';
+import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
+import { ButtonContext } from './chunk-WMTWFKKP.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 { useContextProps, composeRenderProps, Popover as Popover$1, Dialog } from 'react-aria-components';
+import { jsx } from 'react/jsx-runtime';
+
+// css-module:./Popover.module.css#css-module
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___XuKsd", "fade": "Popover-module__fade___kJYH7", "hop-Popover__wrapper": "Popover-module__hop-Popover__wrapper___EEl-1", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___gq-kv", "hop-Popover__dropdown": "Popover-module__hop-Popover__dropdown___JIArA", "hop-Popover__title": "Popover-module__hop-Popover__title___-561r", "hop-Popover__content": "Popover-module__hop-Popover__content___5ejvz", "hop-Popover__list-box": "Popover-module__hop-Popover__list-box___ba-dp", "hop-Popover__footer": "Popover-module__hop-Popover__footer___CtY9r", "hop-Popover__actions": "Popover-module__hop-Popover__actions___3Y12f", "hop-Popover__action": "Popover-module__hop-Popover__action___TIPOT" };
+var GlobalPopoverCssSelector = "hop-Popover";
+function Popover(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, PopoverContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const prevContextProps = useForwardedHopperContext();
+  const {
+    isAutoWidth,
+    children,
+    className,
+    offset = 4,
+    boundaryOffset,
+    isNonDialog,
+    containerPadding = 16,
+    containerProps,
+    placement: placementProp,
+    style: styleProp,
+    ...otherProps
+  } = ownProps;
+  const placement = (_a = useResponsiveValue(placementProp)) != null ? _a : "bottom";
+  const { stylingProps: containerStylingProps, ...containerOwnProps } = useStyledSystem(containerProps != null ? containerProps : {});
+  const {
+    className: containerClassName,
+    style: containerStyleProp,
+    slot,
+    ...containerOtherProps
+  } = containerOwnProps;
+  const popoverClassNames = composeClassnameRenderProps(
+    className,
+    GlobalPopoverCssSelector,
+    cssModule(
+      Popover_module_default,
+      "hop-Popover",
+      isNonDialog && "non-dialog"
+    ),
+    stylingProps.className
+  );
+  const containerClassNames = isNonDialog ? clsx(containerClassName, Popover_module_default["hop-Popover__dropdown"], containerStylingProps.className) : clsx(containerClassName, Popover_module_default["hop-Popover__dialog"], containerStylingProps.className);
+  const style = composeRenderProps(styleProp, (prev) => {
+    return {
+      ...stylingProps.style,
+      "--container-padding": `${containerPadding}px`,
+      ...prev
+    };
+  });
+  const containerStyle = {
+    ...containerStylingProps.style,
+    ...containerStyleProp
+  };
+  return /* @__PURE__ */ jsx(
+    Popover$1,
+    {
+      offset,
+      ref,
+      className: popoverClassNames,
+      arrowBoundaryOffset: boundaryOffset,
+      "data-auto-width": isAutoWidth || void 0,
+      containerPadding,
+      style,
+      placement,
+      ...otherProps,
+      children: (state) => {
+        const content = isFunction(children) && !isNil(children) ? children(state) : children;
+        if (isNonDialog) {
+          return /* @__PURE__ */ jsx(_HopperProvider, { ...prevContextProps, className: Popover_module_default["hop-Popover__wrapper"], children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              ...containerOtherProps,
+              className: containerClassNames,
+              style: containerStyle,
+              slot: slot || void 0,
+              children: /* @__PURE__ */ jsx(
+                SlotProvider,
+                {
+                  values: [
+                    [ListBoxContext, {
+                      className: Popover_module_default["hop-Popover__list-box"]
+                    }],
+                    [FooterContext, {
+                      className: Popover_module_default["hop-Popover__footer"]
+                    }],
+                    [LinkContext, {
+                      size: "sm",
+                      variant: "primary",
+                      isQuiet: true
+                    }]
+                  ],
+                  children: content
+                }
+              )
+            }
+          ) });
+        }
+        return /* @__PURE__ */ jsx(_HopperProvider, { ...prevContextProps, children: /* @__PURE__ */ jsx(Dialog, { ...containerOtherProps, className: containerClassNames, style: containerStyle, children: /* @__PURE__ */ jsx(
+          SlotProvider,
+          {
+            values: [
+              [HeadingContext, {
+                slot: "title",
+                className: Popover_module_default["hop-Popover__title"],
+                size: "xs"
+              }],
+              [ButtonContext, {
+                size: "sm",
+                className: Popover_module_default["hop-Popover__action"]
+              }],
+              [LinkButtonContext, {
+                size: "sm",
+                className: Popover_module_default["hop-Popover__action"]
+              }],
+              [ButtonGroupContext, {
+                size: "sm",
+                align: "end",
+                className: Popover_module_default["hop-Popover__actions"]
+              }],
+              [ContentContext, {
+                className: Popover_module_default["hop-Popover__content"]
+              }],
+              [FooterContext, {
+                className: Popover_module_default["hop-Popover__footer"]
+              }],
+              [LinkContext, {
+                size: "sm",
+                variant: "primary",
+                isQuiet: true
+              }]
+            ],
+            children: content
+          }
+        ) }) });
+      }
+    }
+  );
+}
+var _Popover = forwardRef(Popover);
+_Popover.displayName = "Popover";
+
+export { GlobalPopoverCssSelector, _Popover };

package/dist/chunk-WJ55ZV54.js

@@ -0,0 +1,27 @@
+import { TextContext as TextContext$1 } from './chunk-ZNOU2CGM.js';
+import { TextContext } from 'react-aria-components';
+import { jsx } from 'react/jsx-runtime';
+
+function ClearProviders({
+  values,
+  children
+}) {
+  for (const Context of values) {
+    children = /* @__PURE__ */ jsx(Context.Provider, { value: null, children });
+  }
+  return children;
+}
+function ClearContainerSlots({ children }) {
+  return /* @__PURE__ */ jsx(
+    ClearProviders,
+    {
+      values: [
+        TextContext,
+        TextContext$1
+      ],
+      children
+    }
+  );
+}
+
+export { ClearContainerSlots, ClearProviders };

package/dist/chunk-WJRMD4JP.js

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

package/dist/chunk-WPIH4OAE.js

@@ -0,0 +1,12 @@
+import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
+import { _Text } from './chunk-LKH3JL3P.js';
+import { jsx } from 'react/jsx-runtime';
+
+function ensureTextWrapper(children, elementType) {
+  if (children && isTextOnlyChildren(children)) {
+    return /* @__PURE__ */ jsx(_Text, { elementType, children });
+  }
+  return children;
+}
+
+export { ensureTextWrapper };

package/dist/chunk-WUU53CNO.js

@@ -0,0 +1,124 @@
+import { SearchFieldContext } from './chunk-3NKF5TPD.js';
+import { Input } from './chunk-AAMIUZW2.js';
+import { _InputGroup } from './chunk-X7VALEJB.js';
+import { _Label } from './chunk-SA322LHS.js';
+import { _HelperMessage } from './chunk-HANWII4T.js';
+import { _ErrorMessage } from './chunk-CFXK2ZSA.js';
+import { _ClearButton } from './chunk-CHA2MOQZ.js';
+import { useFormProps } from './chunk-YMTZYK3U.js';
+import { ClearContainerSlots } from './chunk-WJ55ZV54.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { SearchIcon, IconContext } from '@hopper-ui/icons';
+import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import { mergeRefs } from '@react-aria/utils';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { useObjectRef } from 'react-aria';
+import { useContextProps, composeRenderProps, SearchField as SearchField$1 } from 'react-aria-components';
+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___8ooCP", "hop-SearchField--fluid": "SearchField-module__hop-SearchField--fluid___U7eg7", "hop-SearchField__Label": "SearchField-module__hop-SearchField__Label___tp-OA", "hop-SearchField__prefix": "SearchField-module__hop-SearchField__prefix___tn7pE", "hop-SearchField__InputGroup": "SearchField-module__hop-SearchField__InputGroup___mEDcq", "hop-SearchField--clearable": "SearchField-module__hop-SearchField--clearable___nInFH", "hop-SearchField__ErrorMessage": "SearchField-module__hop-SearchField__ErrorMessage___syD94", "hop-SearchField__HelperMessage": "SearchField-module__hop-SearchField__HelperMessage___oXsjK", "hop-SearchField__ClearButton": "SearchField-module__hop-SearchField__ClearButton___im7vS" };
+var GlobalSearchFieldCssSelector = "hop-SearchField";
+function SearchField(props, ref) {
+  var _a;
+  const {
+    inputRef: userProvidedInputRef = null,
+    ...propsWithoutRef
+  } = props;
+  [props, ref] = useContextProps(propsWithoutRef, ref, SearchFieldContext);
+  props = useFormProps(props);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    style: styleProp,
+    size,
+    placeholder,
+    isClearable = true,
+    isFluid: isFluidProp,
+    icon = /* @__PURE__ */ jsx(SearchIcon, {}),
+    isDisabled,
+    isInvalid,
+    isRequired,
+    necessityIndicator,
+    inputGroupProps,
+    clearButtonProps,
+    isReadOnly,
+    label,
+    description,
+    errorMessage,
+    ...otherProps
+  } = ownProps;
+  const inputRef = useObjectRef(mergeRefs(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null));
+  const isFluid = (_a = useResponsiveValue(isFluidProp)) != null ? _a : false;
+  const classNames = composeClassnameRenderProps(
+    className,
+    GlobalSearchFieldCssSelector,
+    cssModule(
+      SearchField_module_default,
+      "hop-SearchField",
+      isFluid && "fluid"
+    ),
+    stylingProps.className
+  );
+  const style = composeRenderProps(styleProp, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const { className: inputGroupClassName, ...otherInputGroupProps } = inputGroupProps != null ? inputGroupProps : {};
+  const inputGroupClassNames = clsx(SearchField_module_default["hop-SearchField__InputGroup"], inputGroupClassName);
+  const { className: clearButtonClassName, ...otherClearButtonProps } = clearButtonProps != null ? clearButtonProps : {};
+  const clearButtonClassNames = clsx(SearchField_module_default["hop-SearchField__ClearButton"], clearButtonClassName);
+  const inputMarkup = /* @__PURE__ */ jsx(ClearContainerSlots, { children: /* @__PURE__ */ jsxs(
+    _InputGroup,
+    {
+      isDisabled,
+      isInvalid,
+      isFluid: true,
+      className: inputGroupClassNames,
+      ...otherInputGroupProps,
+      children: [
+        /* @__PURE__ */ jsx(
+          SlotProvider,
+          {
+            values: [
+              [IconContext, {
+                className: SearchField_module_default["hop-SearchField__prefix"]
+              }]
+            ],
+            children: icon
+          }
+        ),
+        /* @__PURE__ */ jsx(Input, { size, ref: inputRef, placeholder }),
+        isClearable && !isReadOnly && /* @__PURE__ */ jsx(_ClearButton, { size: "lg", isDisabled, className: clearButtonClassNames, ...otherClearButtonProps })
+      ]
+    }
+  ) });
+  const childrenMarkup = /* @__PURE__ */ jsxs(Fragment, { children: [
+    label && /* @__PURE__ */ jsx(_Label, { className: SearchField_module_default["hop-SearchField__Label"], isRequired, necessityIndicator, children: label }),
+    inputMarkup,
+    description && /* @__PURE__ */ jsx(_HelperMessage, { className: SearchField_module_default["hop-SearchField__HelperMessage"], children: description }),
+    /* @__PURE__ */ jsx(_ErrorMessage, { className: SearchField_module_default["hop-SearchField__ErrorMessage"], children: errorMessage })
+  ] });
+  return /* @__PURE__ */ jsx(
+    SearchField$1,
+    {
+      ref,
+      style,
+      className: classNames,
+      isDisabled,
+      isInvalid,
+      isRequired,
+      ...otherProps,
+      children: childrenMarkup
+    }
+  );
+}
+var _SearchField = forwardRef(SearchField);
+_SearchField.displayName = "SearchField";
+
+export { GlobalSearchFieldCssSelector, _SearchField };

package/dist/chunk-X7VALEJB.js

@@ -0,0 +1,73 @@
+import { InputGroupContext } from './chunk-6BFSSZCY.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import { forwardRef, useContext } from 'react';
+import { useContextProps, 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___pTusQ", "hop-InputGroup--fluid": "InputGroup-module__hop-InputGroup--fluid___74fKH" };
+var GlobalInputGroupCssSelector = "hop-InputGroup";
+function InputGroup(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, InputGroupContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    style: styleProp,
+    children,
+    isFluid: isFluidProp,
+    isInvalid,
+    ...otherProps
+  } = ownProps;
+  const isFluid = (_a = useResponsiveValue(isFluidProp)) != null ? _a : false;
+  const classNames = composeClassnameRenderProps(
+    className,
+    GlobalInputGroupCssSelector,
+    cssModule(
+      InputGroup_module_default,
+      "hop-InputGroup",
+      isFluid && "fluid"
+    ),
+    stylingProps.className
+  );
+  const validation = useContext(FieldErrorContext);
+  const style = composeRenderProps(styleProp, (prev) => {
+    return {
+      ...stylingProps.style,
+      ...prev
+    };
+  });
+  const handlePointerUp = (e) => {
+    var _a2;
+    if (e.pointerType !== "mouse" && !e.target.closest("button,input,textarea")) {
+      e.preventDefault();
+      (_a2 = e.currentTarget.querySelector("input")) == null ? void 0 : _a2.focus();
+    }
+  };
+  const handlePointerDown = (e) => {
+    var _a2;
+    if (e.pointerType === "mouse" && !e.target.closest("button,input,textarea")) {
+      e.preventDefault();
+      (_a2 = e.currentTarget.querySelector("input")) == null ? void 0 : _a2.focus();
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    Group,
+    {
+      isInvalid: (validation == null ? void 0 : validation.isInvalid) || isInvalid,
+      onPointerDown: handlePointerDown,
+      onPointerUp: handlePointerUp,
+      ref,
+      className: classNames,
+      style,
+      ...otherProps,
+      children
+    }
+  );
+}
+var _InputGroup = forwardRef(InputGroup);
+_InputGroup.displayName = "InputGroup";
+
+export { GlobalInputGroupCssSelector, _InputGroup };

package/dist/chunk-XDFCDNZP.js

@@ -0,0 +1,90 @@
+import { RichIconAvatarImageContext } from './chunk-YKZRBQ6B.js';
+import { useRenderProps } from './chunk-2NSUMKNH.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { SlotProvider } from './chunk-M36KANKC.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { RichIconContext } from '@hopper-ui/icons';
+import { slot, useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import { forwardRef } from 'react';
+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___gxLJ1", "hop-RichIconAvatarImage--xs": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xs___tUVc-", "hop-RichIconAvatarImage--sm": "RichIconAvatarImage-module__hop-RichIconAvatarImage--sm___PJkMt", "hop-RichIconAvatarImage--md": "RichIconAvatarImage-module__hop-RichIconAvatarImage--md___NXx-H", "hop-RichIconAvatarImage--lg": "RichIconAvatarImage-module__hop-RichIconAvatarImage--lg___9eT8I", "hop-RichIconAvatarImage--xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--xl___-i5Eg", "hop-RichIconAvatarImage--2xl": "RichIconAvatarImage-module__hop-RichIconAvatarImage--2xl___D3-gx", "hop-RichIconAvatarImage__icon": "RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___iAyIu" };
+var GlobalRichIconAvatarImageCssSelector = "hop-RichIconAvatarImage";
+var AvatarToIconSizeAdapter = {
+  xs: "md",
+  sm: "md",
+  md: "lg",
+  lg: "xl",
+  xl: "xl",
+  "2xl": "xl"
+};
+function RichIconAvatarImage(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, RichIconAvatarImageContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    isDisabled,
+    style,
+    slot,
+    size: sizeValue,
+    ...otherProps
+  } = ownProps;
+  const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
+  const classNames = composeClassnameRenderProps(
+    className,
+    GlobalRichIconAvatarImageCssSelector,
+    cssModule(
+      RichIconAvatarImage_module_default,
+      "hop-RichIconAvatarImage",
+      size
+    ),
+    stylingProps.className
+  );
+  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",
+    {
+      ...mergeProps(otherProps, renderProps),
+      ref,
+      slot: slot != null ? slot : void 0,
+      role: "img",
+      "data-disabled": isDisabled || void 0,
+      children: /* @__PURE__ */ jsx(
+        SlotProvider,
+        {
+          values: [
+            [RichIconContext, {
+              className: RichIconAvatarImage_module_default["hop-RichIconAvatarImage__icon"],
+              size: AvatarToIconSizeAdapter[size]
+            }]
+          ],
+          children: renderProps.children
+        }
+      )
+    }
+  );
+}
+var _RichIconAvatarImage = slot("avatar", forwardRef(RichIconAvatarImage));
+_RichIconAvatarImage.displayName = "RichIconAvatarImage";
+
+export { AvatarToIconSizeAdapter, GlobalRichIconAvatarImageCssSelector, _RichIconAvatarImage };

package/dist/chunk-XFG3CXMD.js

@@ -0,0 +1,6 @@
+import { DialogTrigger } from 'react-aria-components';
+
+// src/alert/src/AlertTrigger.tsx
+var AlertTrigger = DialogTrigger;
+
+export { AlertTrigger };