UNPKG

@trail-ui/react

Version:
63 lines (60 loc) 1.93 kB
import * as react from 'react'; import { HTMLAttributes } from 'react'; import { AvatarVariantProps, SlotsToClasses, AvatarSlots } from '@trail-ui/theme'; import { ContextValue } from 'react-aria-components'; interface AvatarProps extends Omit<HTMLAttributes<HTMLElement>, 'color'>, Omit<AvatarVariantProps, 'isInGroup' | 'isInGridGroup'> { elementType?: string; /** * The name of the person in the avatar. - * if **src** has loaded, the name will be used as the **alt** attribute of the **img** * - If **src** is not loaded, the name will be used to create the initials */ name?: string; /** * Image source. */ src?: string; /** * Image alt text. */ alt?: string; icon?: React.ReactNode; /** * If `true`, the fallback logic will be skipped. * @default false */ ignoreFallback?: boolean; /** * If `false`, the avatar will show the background color while loading. */ showFallback?: boolean; /** * Function to get the initials to display */ getInitials?: (name: string) => string; /** * Custom fallback component. */ fallback?: React.ReactElement; /** * Function called when image failed to load */ onError?: () => void; /** * The component used to render the image. * @default "img" */ ImgComponent?: React.ElementType; /** * Props to pass to the image component. */ imgProps?: React.ImgHTMLAttributes<HTMLImageElement>; /** * Classes object to style the avatar and its children. */ classNames?: SlotsToClasses<AvatarSlots>; onClick?: () => void; } declare const AvatarContext: react.Context<ContextValue<AvatarProps, HTMLSpanElement>>; declare const _Avatar: react.ForwardRefExoticComponent<AvatarProps & react.RefAttributes<HTMLSpanElement>>; export { _Avatar as Avatar, AvatarContext, AvatarProps };