@wistia/ui 0.4.6 → 0.4.7

package/dist/index.d.mts

@@ -336,6 +336,11 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
 } & Omit<ButtonAsLinkProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 
 type AvatarInstanceType = 'image' | 'initials';
+type AvatarImageLoadStateType = 'error' | 'loaded' | 'loading';
+type AvatarStatus = {
+    type: AvatarInstanceType;
+    state: AvatarImageLoadStateType;
+};
 type AvatarProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * The height and width of the avatar (overrides size prop)
@@ -358,7 +363,7 @@ type AvatarProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * A callback that is invoked after the image has loaded or failed to load
      */
-    onImageLoad?: (avatarType: AvatarInstanceType) => void;
+    onImageLoad?: (avatarStatus: AvatarStatus) => void;
 };
 /**
  * An avatar uses a photo, initials or icon to represent an entity
@@ -2163,4 +2168,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-export { ActionButton, type ActionButtonProps, Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
+export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };

package/dist/index.d.ts

@@ -336,6 +336,11 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
 } & Omit<ButtonAsLinkProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 
 type AvatarInstanceType = 'image' | 'initials';
+type AvatarImageLoadStateType = 'error' | 'loaded' | 'loading';
+type AvatarStatus = {
+    type: AvatarInstanceType;
+    state: AvatarImageLoadStateType;
+};
 type AvatarProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * The height and width of the avatar (overrides size prop)
@@ -358,7 +363,7 @@ type AvatarProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * A callback that is invoked after the image has loaded or failed to load
      */
-    onImageLoad?: (avatarType: AvatarInstanceType) => void;
+    onImageLoad?: (avatarStatus: AvatarStatus) => void;
 };
 /**
  * An avatar uses a photo, initials or icon to represent an entity
@@ -2163,4 +2168,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-export { ActionButton, type ActionButtonProps, Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
+export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.4.6
+ * @license @wistia/ui v0.4.7
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -5868,17 +5868,17 @@ var Avatar = ({
   onImageLoad,
   ...otherProps
 }) => {
-  const [imageLoadState, setImageLoadState] = useState4(null);
+  const [imageLoadState, setImageLoadState] = useState4("loading");
   useEffect3(() => {
-    setImageLoadState(null);
+    setImageLoadState("loading");
   }, [imageUrl]);
   const handleImageLoad = () => {
     setImageLoadState("loaded");
-    onImageLoad?.("image");
+    onImageLoad?.({ state: "loaded", type: "image" });
   };
   const handleImageLoadError = () => {
     setImageLoadState("error");
-    onImageLoad?.("initials");
+    onImageLoad?.({ state: "error", type: "initials" });
   };
   const avatarSize = heightAndWidth ?? avatarSizeMap[size];
   const avatarColor = useMemo3(() => chooseColorScheme(name), [name]);