@accelint/design-toolkit/dist/components/avatar/index.d.ts

An open-source component library to serve as part of the entire ecosystem of UX for Accelint.

import * as react_jsx_runtime from 'react/jsx-runtime';
import * as react from 'react';
import { ContextValue } from 'react-aria-components';
import { ProviderProps } from '../../lib/types.js';
import { AvatarProps } from './types.js';
import '@radix-ui/react-avatar';
import 'tailwind-variants';
import './styles.js';
import 'tailwind-merge';

declare const AvatarContext: react.Context<ContextValue<AvatarProps, HTMLSpanElement>>;
declare function AvatarProvider({ children, ...props }: ProviderProps<AvatarProps>): react_jsx_runtime.JSX.Element;
declare namespace AvatarProvider {
    var displayName: string;
}
/**
 * Avatar - A user profile image component with fallback support
 *
 * Displays a user's profile image with automatic fallback to a default person icon
 * when the image fails to load. Supports multiple sizes and can include status badges.
 * Built on Radix UI Avatar for accessibility and reliability.
 *
 * @example
 * // Basic avatar with image
 * <Avatar imageProps={{ src: "/user.jpg", alt: "User Name" }} />
 *
 * @example
 * // Avatar with fallback and custom size
 * <Avatar
 *   size="large"
 *   imageProps={{ src: "/user.jpg", alt: "User Name" }}
 *   fallbackProps={{ children: "UN" }}
 * />
 *
 * @example
 * // Avatar with status badge
 * <Avatar imageProps={{ src: "/user.jpg", alt: "User Name" }}>
 *   <Badge variant="success" />
 * </Avatar>
 *
 * @example
 * // Avatar with only initials fallback
 * <Avatar fallbackProps={{ children: "JD" }} />
 */
declare function Avatar({ ref, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
declare namespace Avatar {
    var displayName: string;
    var Provider: typeof AvatarProvider;
}

export { Avatar, AvatarContext };