import type { CSSProperties } from "react"; import React from "react"; import type { XOR } from "ts-xor"; import type { IconProps } from "../Icon"; type AvatarSize = "base" | "large" | "small"; interface AvatarFoundationProps { /** * A url for the image that will be displayed */ readonly imageUrl?: string; /** * A users name to be used for assistive technology */ readonly name?: string; /** * The initials that will be displayed if no image is set.\ */ readonly initials?: string; /** * The background and border color that represents the user. This should be * represented as a value that can be read by CSS */ readonly color?: string; /** * Change the size of the avatar * @property "large" - Make avatar to be the focal point * @property "small" - For higher-density/compact places or components * @default "base" */ readonly size?: AvatarSize; /** * **Use at your own risk:** Custom class names for specific elements. This should only be used as a * **last resort**. Using this may result in unexpected side effects. * More information in the [Customizing components Guide](https://atlantis.getjobber.com/guides/customizing-components). */ readonly UNSAFE_className?: { container?: string; } & InitialsUnsafeClassNameProps; /** * **Use at your own risk:** Custom style for specific elements. This should only be used as a * **last resort**. Using this may result in unexpected side effects. * More information in the [Customizing components Guide](https://atlantis.getjobber.com/guides/customizing-components). */ readonly UNSAFE_style?: { container?: CSSProperties; } & InitialsUnsafeStyleProps; } interface AvatarWithImageProps extends AvatarFoundationProps { readonly imageUrl: string; } interface AvatarWithInitialsProps extends AvatarFoundationProps { readonly initials: string; } export type AvatarProps = XOR; export declare function Avatar({ imageUrl, name, initials, size, color, UNSAFE_className, UNSAFE_style, }: AvatarProps): React.JSX.Element; interface InitialsUnsafeClassNameProps { initials?: string; fallbackIcon?: IconProps["UNSAFE_className"]; } interface InitialsUnsafeStyleProps { initials?: CSSProperties; fallbackIcon?: IconProps["UNSAFE_style"]; } export {};