@hopper-ui/components 1.0.3 → 1.0.5

package/dist/chunk-OPFRM3JC.js

@@ -0,0 +1,161 @@
+import { _Text } from './chunk-7Q7VIED2.js';
+import { AvatarContext } from './chunk-AES7QBQE.js';
+import { _RichIconAvatarImage } from './chunk-CP4AWOFU.js';
+import { cssModule } from './chunk-KVDXQMWI.js';
+import { useImageFallback } from './chunk-NS3XVOQ7.js';
+import { BrokenImageRichIcon } from '@hopper-ui/icons';
+import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import { filterDOMProps } from '@react-aria/utils';
+import clsx from 'clsx';
+import { forwardRef, useMemo } from 'react';
+import { useContextProps } from 'react-aria-components';
+import { jsx } from 'react/jsx-runtime';
+
+// css-module:./Avatar.module.css#css-module
+var Avatar_module_default = { "hop-Avatar": "Avatar-module__hop-Avatar___d9YZ9", "hop-Avatar--xs": "Avatar-module__hop-Avatar--xs___BWHEr", "hop-Avatar--sm": "Avatar-module__hop-Avatar--sm___fNWQO", "hop-Avatar--md": "Avatar-module__hop-Avatar--md___-6GnY", "hop-Avatar--lg": "Avatar-module__hop-Avatar--lg___f8yyT", "hop-Avatar--xl": "Avatar-module__hop-Avatar--xl___r5PUt", "hop-Avatar--2xl": "Avatar-module__hop-Avatar--2xl___CG0YD", "hop-Avatar--decorative-option1": "Avatar-module__hop-Avatar--decorative-option1___OIRSj", "hop-Avatar--decorative-option2": "Avatar-module__hop-Avatar--decorative-option2___-uwSb", "hop-Avatar--decorative-option3": "Avatar-module__hop-Avatar--decorative-option3___xhe3G", "hop-Avatar--decorative-option4": "Avatar-module__hop-Avatar--decorative-option4___e38Gs", "hop-Avatar--decorative-option5": "Avatar-module__hop-Avatar--decorative-option5___-GQzw", "hop-Avatar--decorative-option6": "Avatar-module__hop-Avatar--decorative-option6___CeiJh", "hop-Avatar--decorative-option7": "Avatar-module__hop-Avatar--decorative-option7___nvuXB", "hop-Avatar--decorative-option8": "Avatar-module__hop-Avatar--decorative-option8___Q4Z9Z", "hop-Avatar--decorative-option9": "Avatar-module__hop-Avatar--decorative-option9___TsOBZ", "hop-Avatar__image": "Avatar-module__hop-Avatar__image___6YUZZ" };
+var GlobalAvatarCssSelector = "hop-Avatar";
+var AvatarToTextSizeAdapter = {
+  xs: "xs",
+  sm: "xs",
+  md: "md",
+  lg: "lg",
+  xl: "xl",
+  "2xl": "xl"
+};
+function getColorIndex(name, maxNumberOfColor) {
+  let hashCode = 0;
+  for (let i = name.length - 1; i >= 0; i--) {
+    const character = name.charCodeAt(i);
+    const shift = i % 8;
+    hashCode ^= (character << shift) + (character >> 8 - shift);
+  }
+  return hashCode % maxNumberOfColor;
+}
+function getColorName(name) {
+  const variantToUse = `option${getColorIndex(name, 8) + 1}`;
+  return `decorative-${variantToUse}`;
+}
+function AvatarInitials(props) {
+  var _a;
+  const {
+    name,
+    size: sizeValue
+  } = props;
+  const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
+  const initials = useMemo(() => {
+    const cleanName = name.replace(/\s+/g, " ").trim();
+    const [firstName, lastName] = cleanName.split(" ");
+    const letters = firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
+    return size === "xs" && letters.length > 1 ? letters.charAt(0) : letters;
+  }, [name, size]);
+  return /* @__PURE__ */ jsx(
+    _Text,
+    {
+      size: AvatarToTextSizeAdapter[size],
+      className: Avatar_module_default["hop-Avatar__initials"],
+      children: initials
+    }
+  );
+}
+function Avatar(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, AvatarContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    "aria-label": ariaLabel,
+    className,
+    fallbackSrc,
+    imageProps,
+    isDisabled,
+    name,
+    size: sizeValue,
+    slot,
+    src,
+    style,
+    ...otherProps
+  } = ownProps;
+  const domProps = filterDOMProps(otherProps);
+  const { onError, onLoad, ...otherImageProps } = imageProps != null ? imageProps : {};
+  const { imageUrl, status } = useImageFallback({ src, fallbackSrc, onError, onLoad });
+  const imageLoaded = status === "loaded";
+  const imageFailed = status === "failed";
+  const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
+  const isBrokenImage = src && imageFailed && fallbackSrc !== null;
+  const isImage = src && !imageFailed;
+  const isInitials = !src || src && imageFailed && fallbackSrc === null;
+  const classNames = clsx(
+    className,
+    GlobalAvatarCssSelector,
+    cssModule(
+      Avatar_module_default,
+      "hop-Avatar",
+      size,
+      isBrokenImage && "broken-image",
+      isImage && "image",
+      isInitials && getColorName(name)
+    ),
+    stylingProps.className
+  );
+  const mergedStyles = {
+    ...stylingProps.style,
+    ...style
+  };
+  if (imageFailed && fallbackSrc !== null) {
+    return /* @__PURE__ */ jsx(
+      _RichIconAvatarImage,
+      {
+        ...domProps,
+        "aria-label": ariaLabel != null ? ariaLabel : name,
+        className: classNames,
+        isDisabled,
+        ref,
+        size,
+        slot,
+        style: mergedStyles,
+        children: /* @__PURE__ */ jsx(BrokenImageRichIcon, {})
+      }
+    );
+  }
+  let content = null;
+  if (isInitials || imageLoaded) {
+    content = /* @__PURE__ */ jsx(
+      AvatarInitials,
+      {
+        ...otherProps,
+        name,
+        size
+      }
+    );
+  }
+  if (imageLoaded) {
+    content = /* @__PURE__ */ jsx(
+      "img",
+      {
+        ...filterDOMProps(otherImageProps),
+        alt: "",
+        "aria-hidden": true,
+        className: Avatar_module_default["hop-Avatar__image"],
+        onError,
+        src: imageUrl
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...domProps,
+      "aria-label": ariaLabel != null ? ariaLabel : name,
+      className: classNames,
+      "data-disabled": isDisabled || void 0,
+      role: "img",
+      slot: slot != null ? slot : void 0,
+      ref,
+      style: mergedStyles,
+      children: content
+    }
+  );
+}
+var _Avatar = forwardRef(Avatar);
+_Avatar.displayName = "Avatar";
+
+export { AvatarToTextSizeAdapter, GlobalAvatarCssSelector, _Avatar };

package/dist/{chunk-UARL5M2W.js → chunk-P7JRKXBD.js}

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

package/dist/{chunk-XFKAXBB5.js → chunk-T6VFQSII.js}

@@ -1,12 +1,12 @@
 import { SwitchContext } from './chunk-YHBJAXUY.js';
 import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
-import { _Text } from './chunk-4RIAVSLK.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { IconListContext } from './chunk-DHVVYSLB.js';
+import { _Text } from './chunk-7Q7VIED2.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
-import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
-import { IconListContext } from './chunk-DHVVYSLB.js';
 import { IconContext } from '@hopper-ui/icons';
 import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
 import { forwardRef } from 'react';
@@ -14,7 +14,7 @@ import { useContextProps, composeRenderProps, Switch as Switch$1 } from 'react-a
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./Switch.module.css#css-module
-var Switch_module_default = { "hop-Switch": "Switch-module__hop-Switch___n4jxE", "hop-Switch--sm": "Switch-module__hop-Switch--sm___-f1X2", "hop-Switch--md": "Switch-module__hop-Switch--md___QZsov", "hop-Switch__indicator": "Switch-module__hop-Switch__indicator___iRVTh", "hop-Switch__text": "Switch-module__hop-Switch__text___QeO6o", "hop-Switch__icon-list": "Switch-module__hop-Switch__icon-list___ka5FC", "hop-Switch__icon": "Switch-module__hop-Switch__icon___j9U5W" };
+var Switch_module_default = { "hop-Switch": "Switch-module__hop-Switch___g-wMP", "hop-Switch--sm": "Switch-module__hop-Switch--sm___x4P0y", "hop-Switch--md": "Switch-module__hop-Switch--md___5n6kY", "hop-Switch__indicator": "Switch-module__hop-Switch__indicator___zoC1a", "hop-Switch__text": "Switch-module__hop-Switch__text___zwJVh", "hop-Switch__icon-list": "Switch-module__hop-Switch__icon-list___tBX-Z", "hop-Switch__icon": "Switch-module__hop-Switch__icon___TKU4w" };
 var GlobalSwitchCssSelector = "hop-Switch";
 function Switch(props, ref) {
   var _a;

package/dist/{chunk-OUN5KSHD.js → chunk-THCG3QCD.js}

@@ -11,7 +11,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./SwitchField.module.css#css-module
-var SwitchField_module_default = { "hop-SwitchField": "SwitchField-module__hop-SwitchField___OlYHx", "hop-SwitchField--sm": "SwitchField-module__hop-SwitchField--sm___7s7Ty", "hop-SwitchField--md": "SwitchField-module__hop-SwitchField--md___gIbMI", "hop-SwitchField__description": "SwitchField-module__hop-SwitchField__description___Jj-gO", "hop-SwitchField__switch": "SwitchField-module__hop-SwitchField__switch___OZkSD" };
+var SwitchField_module_default = { "hop-SwitchField": "SwitchField-module__hop-SwitchField___nmxTu", "hop-SwitchField--sm": "SwitchField-module__hop-SwitchField--sm___cVtQp", "hop-SwitchField--md": "SwitchField-module__hop-SwitchField--md___DpMwX", "hop-SwitchField__description": "SwitchField-module__hop-SwitchField__description___hUNKc", "hop-SwitchField__switch": "SwitchField-module__hop-SwitchField__switch___-gZNo" };
 var GlobalSwitchFieldCssSelector = "hop-SwitchField";
 var SwitchToDescriptionSizeAdapter = {
   sm: "xs",

package/dist/{chunk-BAKCRZAG.js → chunk-TM6742MU.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___J-bP3", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___5DrPu", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___6mZqj", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___OQ5-x", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___Wa8qq", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___Bnq-S", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___w7xGi", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___cYLTZ" };
+var ButtonGroup_module_default = { "hop-ButtonGroup": "ButtonGroup-module__hop-ButtonGroup___nzEIB", "hop-ButtonGroup--horizontal": "ButtonGroup-module__hop-ButtonGroup--horizontal___-b5iJ", "hop-ButtonGroup--vertical": "ButtonGroup-module__hop-ButtonGroup--vertical___bArOc", "hop-ButtonGroup--start": "ButtonGroup-module__hop-ButtonGroup--start___5BJTJ", "hop-ButtonGroup--center": "ButtonGroup-module__hop-ButtonGroup--center___bPHp6", "hop-ButtonGroup--end": "ButtonGroup-module__hop-ButtonGroup--end___RtzB4", "hop-ButtonGroup--wrap": "ButtonGroup-module__hop-ButtonGroup--wrap___PiEGR", "hop-ButtonGroup--fluid": "ButtonGroup-module__hop-ButtonGroup--fluid___9BHBE" };
 var GlobalButtonGroupCssSelector = "hop-ButtonGroup";
 function ButtonGroup(props, ref) {
   var _a, _b, _c, _d, _e;

package/dist/{chunk-CTOL6AVF.js → chunk-UOBWYTW7.js}

@@ -1,15 +1,15 @@
 import { TextFieldContext } from './chunk-O4XPUINW.js';
-import { _InputGroup } from './chunk-RXBKOHT2.js';
+import { _InputGroup } from './chunk-GWEUWPLT.js';
 import { ErrorMessageContext } from './chunk-ACVMW6YD.js';
 import { HelperMessageContext } from './chunk-ESVVLTEN.js';
-import { _ClearButton } from './chunk-UARL5M2W.js';
+import { _ClearButton } from './chunk-P7JRKXBD.js';
 import { useLocalizedString } from './chunk-H6CDFWVR.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
 import { isTextOnlyChildren } from './chunk-ZWU6DRRZ.js';
-import { _Text } from './chunk-4RIAVSLK.js';
+import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { _Text } from './chunk-7Q7VIED2.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { TextContext } from './chunk-X6SER3TZ.js';
-import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
 import { IconContext } from '@hopper-ui/icons';
@@ -22,7 +22,7 @@ import { useContextProps, composeRenderProps, Input, TextField as TextField$1 }
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // css-module:./TextField.module.css#css-module
-var TextField_module_default = { "hop-TextField": "TextField-module__hop-TextField___LVxGo", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___Zxhx8", "hop-TextField__Label": "TextField-module__hop-TextField__Label___j-hHO", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___W7szZ", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___6TfYD", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___rDG7U", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___l-32U" };
+var TextField_module_default = { "hop-TextField": "TextField-module__hop-TextField___kinvO", "hop-TextField--fluid": "TextField-module__hop-TextField--fluid___9n2wP", "hop-TextField__Label": "TextField-module__hop-TextField__Label___C1veN", "hop-TextField__prefix": "TextField-module__hop-TextField__prefix___Hw8Cr", "hop-TextField__InputGroup": "TextField-module__hop-TextField__InputGroup___or9FG", "hop-TextField__ErrorMessage": "TextField-module__hop-TextField__ErrorMessage___zXsFu", "hop-TextField__HelperMessage": "TextField-module__hop-TextField__HelperMessage___yHZ0J" };
 var GlobalTextFieldCssSelector = "hop-TextField";
 function TextField(props, ref) {
   var _a;

package/dist/{chunk-IOLNBXZM.js → chunk-UYVKDU2W.js}

@@ -1,5 +1,5 @@
-import { RadioContext } from './chunk-FU5CCPLP.js';
 import { RadioFieldContext } from './chunk-DGLAGYBD.js';
+import { RadioContext } from './chunk-FU5CCPLP.js';
 import { ClearContainerSlots } from './chunk-HXI3MEEK.js';
 import { TextContext } from './chunk-X6SER3TZ.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:./RadioField.module.css#css-module
-var RadioField_module_default = { "hop-RadioField": "RadioField-module__hop-RadioField___ZaNAp", "hop-RadioField--sm": "RadioField-module__hop-RadioField--sm___7g2-S", "hop-RadioField--md": "RadioField-module__hop-RadioField--md___-5Row", "hop-RadioField__description": "RadioField-module__hop-RadioField__description___5wJkd", "hop-RadioField__radio": "RadioField-module__hop-RadioField__radio___exdNe" };
+var RadioField_module_default = { "hop-RadioField": "RadioField-module__hop-RadioField___XLgwE", "hop-RadioField--sm": "RadioField-module__hop-RadioField--sm___mQpVi", "hop-RadioField--md": "RadioField-module__hop-RadioField--md___GTmnH", "hop-RadioField__description": "RadioField-module__hop-RadioField__description___-HL2K", "hop-RadioField__radio": "RadioField-module__hop-RadioField__radio___7qSUo" };
 var GlobalRadioFieldCssSelector = "hop-RadioField";
 var RadioToDescriptionSizeAdapter = {
   sm: "xs",

package/dist/{chunk-7NT6M6KM.js → chunk-W2SKBBWE.js}

@@ -1,7 +1,7 @@
 import { RadioGroupContext } from './chunk-5MBJWRZD.js';
 import { RadioListContext } from './chunk-A7TZHALP.js';
-import { RadioContext } from './chunk-FU5CCPLP.js';
 import { RadioFieldContext } from './chunk-DGLAGYBD.js';
+import { RadioContext } from './chunk-FU5CCPLP.js';
 import { ErrorMessageContext } from './chunk-ACVMW6YD.js';
 import { HelperMessageContext } from './chunk-ESVVLTEN.js';
 import { LabelContext } from './chunk-QCA3ZR56.js';
@@ -14,7 +14,7 @@ import { useContextProps, composeRenderProps, RadioGroup as RadioGroup$1 } from
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./RadioGroup.module.css#css-module
-var RadioGroup_module_default = { "hop-RadioGroup": "RadioGroup-module__hop-RadioGroup___2BFRj", "hop-RadioGroup--bordered": "RadioGroup-module__hop-RadioGroup--bordered___TWlEk", "hop-RadioGroup--sm": "RadioGroup-module__hop-RadioGroup--sm___sU8V8", "hop-RadioGroup--md": "RadioGroup-module__hop-RadioGroup--md___o0jW4", "hop-RadioGroup__label": "RadioGroup-module__hop-RadioGroup__label___DohOP", "hop-RadioGroup__list": "RadioGroup-module__hop-RadioGroup__list___csilJ", "hop-RadioGroup__radio": "RadioGroup-module__hop-RadioGroup__radio___SpMaJ", "hop-RadioGroup__error-message": "RadioGroup-module__hop-RadioGroup__error-message___4TlqM", "hop-RadioGroup__helper-message": "RadioGroup-module__hop-RadioGroup__helper-message___FFuEK" };
+var RadioGroup_module_default = { "hop-RadioGroup": "RadioGroup-module__hop-RadioGroup___ZkN81", "hop-RadioGroup--bordered": "RadioGroup-module__hop-RadioGroup--bordered___Bi-0Z", "hop-RadioGroup--sm": "RadioGroup-module__hop-RadioGroup--sm___rknTP", "hop-RadioGroup--md": "RadioGroup-module__hop-RadioGroup--md___hXQE8", "hop-RadioGroup__label": "RadioGroup-module__hop-RadioGroup__label___2-otR", "hop-RadioGroup__list": "RadioGroup-module__hop-RadioGroup__list___HI--g", "hop-RadioGroup__radio": "RadioGroup-module__hop-RadioGroup__radio___Y2PHm", "hop-RadioGroup__error-message": "RadioGroup-module__hop-RadioGroup__error-message___fsKgY", "hop-RadioGroup__helper-message": "RadioGroup-module__hop-RadioGroup__helper-message___qULS3" };
 var GlobalRadioGroupCssSelector = "hop-RadioGroup";
 function RadioGroup(props, ref) {
   var _a, _b;

package/dist/{chunk-3XFTRBIC.js → chunk-WFPCHFJI.js}

@@ -11,7 +11,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./CheckboxField.module.css#css-module
-var CheckboxField_module_default = { "hop-CheckboxField": "CheckboxField-module__hop-CheckboxField___9AeZ6", "hop-CheckboxField--sm": "CheckboxField-module__hop-CheckboxField--sm___f2P7p", "hop-CheckboxField--md": "CheckboxField-module__hop-CheckboxField--md___B8YaW", "hop-CheckboxField__description": "CheckboxField-module__hop-CheckboxField__description___3d2RO", "hop-CheckboxField__checkbox": "CheckboxField-module__hop-CheckboxField__checkbox___gYG3u" };
+var CheckboxField_module_default = { "hop-CheckboxField": "CheckboxField-module__hop-CheckboxField___1AqAL", "hop-CheckboxField--sm": "CheckboxField-module__hop-CheckboxField--sm___OJnAa", "hop-CheckboxField--md": "CheckboxField-module__hop-CheckboxField--md___tIMZu", "hop-CheckboxField__description": "CheckboxField-module__hop-CheckboxField__description___66dnG", "hop-CheckboxField__checkbox": "CheckboxField-module__hop-CheckboxField__checkbox___wXN2n" };
 var GlobalCheckboxFieldCssSelector = "hop-CheckboxField";
 var CheckboxToDescriptionSizeAdapter = {
   sm: "xs",

package/dist/{chunk-GF2U6E4D.js → chunk-WNVTTHBK.js}

@@ -1,4 +1,4 @@
-import { _OverlineText } from './chunk-5EPNXRCT.js';
+import { _OverlineText } from './chunk-3IEED7AY.js';
 import { BadgeContext } from './chunk-ZSFJVMJN.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { useStyledSystem } from '@hopper-ui/styled-system';
@@ -8,7 +8,7 @@ import { useContextProps } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Badge.module.css#css-module
-var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___HtEMK", "hop-Badge--primary": "Badge-module__hop-Badge--primary___-cwxH", "hop-Badge--secondary": "Badge-module__hop-Badge--secondary___FXeeD" };
+var Badge_module_default = { "hop-Badge": "Badge-module__hop-Badge___6JEMi", "hop-Badge--primary": "Badge-module__hop-Badge--primary___fXWYG", "hop-Badge--secondary": "Badge-module__hop-Badge--secondary___vxWGy" };
 var GlobalBadgeCssSelector = "hop-Badge";
 function Badge(props, ref) {
   [props, ref] = useContextProps(props, ref, BadgeContext);

package/dist/chunk-Z33QZKRG.js

@@ -0,0 +1,46 @@
+import { AvatarContext } from './chunk-AES7QBQE.js';
+import { _RichIconAvatarImage } from './chunk-CP4AWOFU.js';
+import { DeletedUserRichIcon } from '@hopper-ui/icons';
+import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { useContextProps } from 'react-aria-components';
+import { jsx } from 'react/jsx-runtime';
+
+var GlobalDeletedAvatarCssSelector = "hop-DeletedAvatar";
+function DeletedAvatar(props, ref) {
+  var _a;
+  [props, ref] = useContextProps(props, ref, AvatarContext);
+  const { stylingProps, ...ownProps } = useStyledSystem(props);
+  const {
+    className,
+    size: sizeValue,
+    style,
+    ...otherProps
+  } = ownProps;
+  const size = (_a = useResponsiveValue(sizeValue)) != null ? _a : "md";
+  const classNames = clsx(
+    className,
+    GlobalDeletedAvatarCssSelector,
+    stylingProps.className
+  );
+  const mergedStyles = {
+    ...stylingProps.style,
+    ...style
+  };
+  return /* @__PURE__ */ jsx(
+    _RichIconAvatarImage,
+    {
+      ...otherProps,
+      className: classNames,
+      ref,
+      size,
+      style: mergedStyles,
+      children: /* @__PURE__ */ jsx(DeletedUserRichIcon, {})
+    }
+  );
+}
+var _DeletedAvatar = forwardRef(DeletedAvatar);
+_DeletedAvatar.displayName = "DeletedAvatar";
+
+export { GlobalDeletedAvatarCssSelector, _DeletedAvatar };

package/dist/{chunk-YQHNOQ3N.js → chunk-ZCEVY7LM.js}

@@ -1,5 +1,5 @@
 import { PopoverContext } from './chunk-SC6ZK5ON.js';
-import { src_exports } from './chunk-OQW6BT6B.js';
+import { src_exports } from './chunk-NXNV5JDN.js';
 import { HeadingContext } from './chunk-TXZ6BMFR.js';
 import { isFunction, isNil } from './chunk-TIPN4VYD.js';
 import { ContentContext } from './chunk-IXB2WK56.js';
@@ -8,9 +8,9 @@ import { ButtonGroupContext } from './chunk-VJQ7M2BK.js';
 import { ButtonContext } from './chunk-WMTWFKKP.js';
 import { _HopperProvider } from './chunk-ANVMQBBG.js';
 import { composeClassnameRenderProps } from './chunk-65JPI4FL.js';
+import { LinkContext } from './chunk-4VVNSXIB.js';
 import { cssModule } from './chunk-KVDXQMWI.js';
 import { SlotProvider } from './chunk-M36KANKC.js';
-import { LinkContext } from './chunk-4VVNSXIB.js';
 import { useStyledSystem } from '@hopper-ui/styled-system';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
@@ -18,7 +18,7 @@ import { DialogTrigger, useContextProps, Popover as Popover$1, Dialog } from 're
 import { jsx } from 'react/jsx-runtime';
 
 // css-module:./Popover.module.css#css-module
-var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___h8MZi", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___Av8Rn", "hop-Popover__title": "Popover-module__hop-Popover__title___-fd6i", "hop-Popover__actions": "Popover-module__hop-Popover__actions___annkX", "hop-Popover__action": "Popover-module__hop-Popover__action___YjIHH", "hop-Popover__content": "Popover-module__hop-Popover__content___17dUJ", "hop-Popover__footer": "Popover-module__hop-Popover__footer___m-UuZ" };
+var Popover_module_default = { "hop-Popover": "Popover-module__hop-Popover___c-Ekg", "hop-Popover__dialog": "Popover-module__hop-Popover__dialog___oxAHL", "hop-Popover__title": "Popover-module__hop-Popover__title___R9VLN", "hop-Popover__actions": "Popover-module__hop-Popover__actions___gTQ99", "hop-Popover__action": "Popover-module__hop-Popover__action___gI-Mg", "hop-Popover__content": "Popover-module__hop-Popover__content___t34xa", "hop-Popover__footer": "Popover-module__hop-Popover__footer___9yOCm" };
 var GlobalPopoverCssSelector = "hop-Popover";
 var PopoverTrigger = (props) => /* @__PURE__ */ jsx(DialogTrigger, { ...props, children: props.children });
 function Popover(props, ref) {

package/dist/errorMessage/src/ErrorMessage.css

@@ -1,5 +1,5 @@
 /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/Text/src/Text.module.css/#css-module-data */
-.Text-module__hop-Text___M-T6r {
+.Text-module__hop-Text___xYoYb {
   --hop-Text-xs-font-size: var(--hop-body-xs-font-size);
   --hop-Text-xs-font-family: var(--hop-body-xs-font-family);
   --hop-Text-xs-font-weight: var(--hop-body-xs-font-weight);
@@ -29,49 +29,49 @@
   --hop-Text-inherit-size-font-weight: inherit;
   --hop-Text-inherit-size-line-height: inherit;
 }
-:where(.Text-module__hop-Text___M-T6r) {
+:where(.Text-module__hop-Text___xYoYb) {
   font-family: var(--font-family);
   font-size: var(--font-size);
   font-weight: var(--font-weight);
   line-height: var(--line-height);
 }
-:where(.Text-module__hop-Text--xs___4XQLX) {
+:where(.Text-module__hop-Text--xs___nPUGu) {
   --font-size: var(--hop-Text-xs-font-size);
   --font-family: var(--hop-Text-xs-font-family);
   --font-weight: var(--hop-Text-xs-font-weight);
   --line-height: var(--hop-Text-xs-line-height);
 }
-:where(.Text-module__hop-Text--sm___dM76a) {
+:where(.Text-module__hop-Text--sm___nMPq3) {
   --font-size: var(--hop-Text-sm-font-size);
   --font-family: var(--hop-Text-sm-font-family);
   --font-weight: var(--hop-Text-sm-font-weight);
   --line-height: var(--hop-Text-sm-line-height);
 }
-:where(.Text-module__hop-Text--md___M60JS) {
+:where(.Text-module__hop-Text--md___HT-Wz) {
   --font-size: var(--hop-Text-md-font-size);
   --font-family: var(--hop-Text-md-font-family);
   --font-weight: var(--hop-Text-md-font-weight);
   --line-height: var(--hop-Text-md-line-height);
 }
-:where(.Text-module__hop-Text--lg___5mCtN) {
+:where(.Text-module__hop-Text--lg___NL7tS) {
   --font-size: var(--hop-Text-lg-font-size);
   --font-family: var(--hop-Text-lg-font-family);
   --font-weight: var(--hop-Text-lg-font-weight);
   --line-height: var(--hop-Text-lg-line-height);
 }
-:where(.Text-module__hop-Text--xl___bi1Vo) {
+:where(.Text-module__hop-Text--xl___3aFN2) {
   --font-size: var(--hop-Text-xl-font-size);
   --font-family: var(--hop-Text-xl-font-family);
   --font-weight: var(--hop-Text-xl-font-weight);
   --line-height: var(--hop-Text-xl-line-height);
 }
-:where(.Text-module__hop-Text--2xl___5SCg1) {
+:where(.Text-module__hop-Text--2xl___bsEDq) {
   --font-size: var(--hop-Text-2xl-font-size);
   --font-family: var(--hop-Text-2xl-font-family);
   --font-weight: var(--hop-Text-2xl-font-weight);
   --line-height: var(--hop-Text-2xl-line-height);
 }
-:where(.Text-module__hop-Text--inherit___X6rIb) {
+:where(.Text-module__hop-Text--inherit___xKxgn) {
   --font-size: var(--hop-Text-inherit-size-font-size);
   --font-family: var(--hop-Text-inherit-size-font-family);
   --font-weight: var(--hop-Text-inherit-size-font-weight);
@@ -79,7 +79,7 @@
 }
 
 /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/errorMessage/src/ErrorMessage.module.css/#css-module-data */
-.ErrorMessage-module__hop-ErrorMessage___rwfLE {
+.ErrorMessage-module__hop-ErrorMessage___r0-aG {
   --hop-ErrorMessage-color: var(--hop-danger-text-weak);
   --hop-ErrorMessage-font-family: var(--hop-body-xs-font-family);
   --hop-ErrorMessage-font-size: var(--hop-body-xs-font-size);
@@ -96,7 +96,7 @@
   line-height: var(--hop-ErrorMessage-line-height);
   color: var(--hop-ErrorMessage-color);
 }
-.ErrorMessage-module__hop-ErrorMessage__icon___OY9OV {
+.ErrorMessage-module__hop-ErrorMessage__icon___Kkk3g {
   flex: 0 0 auto;
   align-self: flex-start;
 }

package/dist/errorMessage/src/ErrorMessage.js

@@ -1,7 +1,7 @@
-export { _ErrorMessage as ErrorMessage, GlobalErrorMessageCssSelector } from '../../chunk-3DWVMCIV.js';
+export { _ErrorMessage as ErrorMessage, GlobalErrorMessageCssSelector } from '../../chunk-22YUFCHD.js';
 import '../../chunk-ACVMW6YD.js';
 import '../../chunk-NH3IVMXB.js';
-import '../../chunk-4RIAVSLK.js';
+import '../../chunk-7Q7VIED2.js';
 import '../../chunk-HXI3MEEK.js';
 import '../../chunk-X6SER3TZ.js';
 import '../../chunk-KVDXQMWI.js';

package/dist/errorMessage/src/index.css

@@ -1,5 +1,5 @@
 /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/Text/src/Text.module.css/#css-module-data */
-.Text-module__hop-Text___M-T6r {
+.Text-module__hop-Text___xYoYb {
   --hop-Text-xs-font-size: var(--hop-body-xs-font-size);
   --hop-Text-xs-font-family: var(--hop-body-xs-font-family);
   --hop-Text-xs-font-weight: var(--hop-body-xs-font-weight);
@@ -29,49 +29,49 @@
   --hop-Text-inherit-size-font-weight: inherit;
   --hop-Text-inherit-size-line-height: inherit;
 }
-:where(.Text-module__hop-Text___M-T6r) {
+:where(.Text-module__hop-Text___xYoYb) {
   font-family: var(--font-family);
   font-size: var(--font-size);
   font-weight: var(--font-weight);
   line-height: var(--line-height);
 }
-:where(.Text-module__hop-Text--xs___4XQLX) {
+:where(.Text-module__hop-Text--xs___nPUGu) {
   --font-size: var(--hop-Text-xs-font-size);
   --font-family: var(--hop-Text-xs-font-family);
   --font-weight: var(--hop-Text-xs-font-weight);
   --line-height: var(--hop-Text-xs-line-height);
 }
-:where(.Text-module__hop-Text--sm___dM76a) {
+:where(.Text-module__hop-Text--sm___nMPq3) {
   --font-size: var(--hop-Text-sm-font-size);
   --font-family: var(--hop-Text-sm-font-family);
   --font-weight: var(--hop-Text-sm-font-weight);
   --line-height: var(--hop-Text-sm-line-height);
 }
-:where(.Text-module__hop-Text--md___M60JS) {
+:where(.Text-module__hop-Text--md___HT-Wz) {
   --font-size: var(--hop-Text-md-font-size);
   --font-family: var(--hop-Text-md-font-family);
   --font-weight: var(--hop-Text-md-font-weight);
   --line-height: var(--hop-Text-md-line-height);
 }
-:where(.Text-module__hop-Text--lg___5mCtN) {
+:where(.Text-module__hop-Text--lg___NL7tS) {
   --font-size: var(--hop-Text-lg-font-size);
   --font-family: var(--hop-Text-lg-font-family);
   --font-weight: var(--hop-Text-lg-font-weight);
   --line-height: var(--hop-Text-lg-line-height);
 }
-:where(.Text-module__hop-Text--xl___bi1Vo) {
+:where(.Text-module__hop-Text--xl___3aFN2) {
   --font-size: var(--hop-Text-xl-font-size);
   --font-family: var(--hop-Text-xl-font-family);
   --font-weight: var(--hop-Text-xl-font-weight);
   --line-height: var(--hop-Text-xl-line-height);
 }
-:where(.Text-module__hop-Text--2xl___5SCg1) {
+:where(.Text-module__hop-Text--2xl___bsEDq) {
   --font-size: var(--hop-Text-2xl-font-size);
   --font-family: var(--hop-Text-2xl-font-family);
   --font-weight: var(--hop-Text-2xl-font-weight);
   --line-height: var(--hop-Text-2xl-line-height);
 }
-:where(.Text-module__hop-Text--inherit___X6rIb) {
+:where(.Text-module__hop-Text--inherit___xKxgn) {
   --font-size: var(--hop-Text-inherit-size-font-size);
   --font-family: var(--hop-Text-inherit-size-font-family);
   --font-weight: var(--hop-Text-inherit-size-font-weight);
@@ -79,7 +79,7 @@
 }
 
 /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/errorMessage/src/ErrorMessage.module.css/#css-module-data */
-.ErrorMessage-module__hop-ErrorMessage___rwfLE {
+.ErrorMessage-module__hop-ErrorMessage___r0-aG {
   --hop-ErrorMessage-color: var(--hop-danger-text-weak);
   --hop-ErrorMessage-font-family: var(--hop-body-xs-font-family);
   --hop-ErrorMessage-font-size: var(--hop-body-xs-font-size);
@@ -96,7 +96,7 @@
   line-height: var(--hop-ErrorMessage-line-height);
   color: var(--hop-ErrorMessage-color);
 }
-.ErrorMessage-module__hop-ErrorMessage__icon___OY9OV {
+.ErrorMessage-module__hop-ErrorMessage__icon___Kkk3g {
   flex: 0 0 auto;
   align-self: flex-start;
 }

package/dist/errorMessage/src/index.js

@@ -1,7 +1,7 @@
-export { _ErrorMessage as ErrorMessage, GlobalErrorMessageCssSelector } from '../../chunk-3DWVMCIV.js';
+export { _ErrorMessage as ErrorMessage, GlobalErrorMessageCssSelector } from '../../chunk-22YUFCHD.js';
 export { ErrorMessageContext } from '../../chunk-ACVMW6YD.js';
 import '../../chunk-NH3IVMXB.js';
-import '../../chunk-4RIAVSLK.js';
+import '../../chunk-7Q7VIED2.js';
 import '../../chunk-HXI3MEEK.js';
 import '../../chunk-X6SER3TZ.js';
 import '../../chunk-KVDXQMWI.js';