React Avatar.Api

import type { ComponentProps } from '@fluentui/react-utilities';
import type { ComponentState } from '@fluentui/react-utilities';
import { ContextSelector } from '@fluentui/react-context-selector';
import { FC } from 'react';
import type { ForwardRefComponent } from '@fluentui/react-utilities';
import type { JSXElement } from '@fluentui/react-utilities';
import type { PopoverProps } from '@fluentui/react-popover';
import type { PopoverSurface } from '@fluentui/react-popover';
import { PresenceBadge } from '@fluentui/react-badge';
import { Provider } from 'react';
import { ProviderProps } from 'react';
import * as React_2 from 'react';
import type { Slot } from '@fluentui/react-utilities';
import type { SlotClassNames } from '@fluentui/react-utilities';
import type { TooltipProps } from '@fluentui/react-tooltip';

// @public (undocumented)
export const Avatar: ForwardRefComponent<AvatarProps>;

// @public (undocumented)
export const avatarClassNames: SlotClassNames<AvatarSlots>;

// @internal (undocumented)
export const AvatarContextProvider: React_2.Provider<AvatarContextValue | undefined>;

// @internal (undocumented)
export interface AvatarContextValue {
    // (undocumented)
    shape?: AvatarShape;
    // (undocumented)
    size?: AvatarSize;
}

// @public
export const AvatarGroup: ForwardRefComponent<AvatarGroupProps>;

// @public (undocumented)
export const avatarGroupClassNames: SlotClassNames<AvatarGroupSlots>;

// @public (undocumented)
export type AvatarGroupContextValue = Pick<AvatarGroupProps, 'size' | 'layout'> & {
    isOverflow?: boolean;
};

// @public (undocumented)
export type AvatarGroupContextValues = {
    avatarGroup: AvatarGroupContextValue;
};

// @public
export const AvatarGroupItem: ForwardRefComponent<AvatarGroupItemProps>;

// @public (undocumented)
export const avatarGroupItemClassNames: SlotClassNames<AvatarGroupItemSlots>;

// @public
export type AvatarGroupItemProps = Omit<ComponentProps<Partial<AvatarGroupItemSlots>, 'avatar'>, 'size' | 'shape'>;

// @public (undocumented)
export type AvatarGroupItemSlots = {
    root: NonNullable<Slot<'div', 'li'>>;
    avatar: NonNullable<Slot<typeof Avatar>>;
    overflowLabel: NonNullable<Slot<'span'>>;
};

// @public
export type AvatarGroupItemState = ComponentState<AvatarGroupItemSlots> & {
    isOverflowItem?: boolean;
    layout: AvatarGroupProps['layout'];
    size: AvatarSize;
};

// @public
export const AvatarGroupPopover: React_2.FC<AvatarGroupPopoverProps>;

// @public (undocumented)
export const avatarGroupPopoverClassNames: SlotClassNames<AvatarGroupPopoverSlots>;

// @public
export type AvatarGroupPopoverProps = Omit<ComponentProps<Partial<AvatarGroupPopoverSlots>>, 'children'> & {
    indicator?: 'count' | 'icon';
    count?: number;
    children: React_2.ReactNode;
};

// @public (undocumented)
export type AvatarGroupPopoverSlots = {
    root: NonNullable<Slot<PopoverProps>>;
    triggerButton: NonNullable<Slot<'button'>>;
    content: NonNullable<Slot<'ul'>>;
    popoverSurface: NonNullable<Slot<typeof PopoverSurface>>;
    tooltip: NonNullable<Slot<TooltipProps>>;
};

// @public
export type AvatarGroupPopoverState = ComponentState<AvatarGroupPopoverSlots> & Required<Pick<AvatarGroupPopoverProps, 'count' | 'indicator'>> & {
    popoverOpen: boolean;
    layout: AvatarGroupProps['layout'];
    size: AvatarSize;
};

// @public
export type AvatarGroupProps = ComponentProps<AvatarGroupSlots> & {
    layout?: 'spread' | 'stack' | 'pie';
    size?: AvatarSize;
};

// @public (undocumented)
export const AvatarGroupProvider: Provider<AvatarGroupContextValue> & FC<ProviderProps<AvatarGroupContextValue>>;

// @public (undocumented)
export type AvatarGroupSlots = {
    root: NonNullable<Slot<'div'>>;
};

// @public
export type AvatarGroupState = ComponentState<AvatarGroupSlots> & Required<Pick<AvatarGroupProps, 'layout' | 'size'>>;

// @public
export type AvatarNamedColor = 'dark-red' | 'cranberry' | 'red' | 'pumpkin' | 'peach' | 'marigold' | 'gold' | 'brass' | 'brown' | 'forest' | 'seafoam' | 'dark-green' | 'light-teal' | 'teal' | 'steel' | 'blue' | 'royal-blue' | 'cornflower' | 'navy' | 'lavender' | 'purple' | 'grape' | 'lilac' | 'pink' | 'magenta' | 'plum' | 'beige' | 'mink' | 'platinum' | 'anchor';

// @public
export type AvatarProps = Omit<ComponentProps<AvatarSlots>, 'color'> & {
    active?: 'active' | 'inactive' | 'unset';
    activeAppearance?: 'ring' | 'shadow' | 'ring-shadow';
    color?: 'neutral' | 'brand' | 'colorful' | AvatarNamedColor;
    idForColor?: string | undefined;
    name?: string;
    shape?: AvatarShape;
    size?: AvatarSize;
};

// @public
export type AvatarShape = 'circular' | 'square';

// @public
export type AvatarSize = 16 | 20 | 24 | 28 | 32 | 36 | 40 | 48 | 56 | 64 | 72 | 96 | 120 | 128;

// @public @deprecated
export type AvatarSizes = AvatarSize;

// @public (undocumented)
export type AvatarSlots = {
    root: Slot<'span'>;
    image?: Slot<'img'>;
    initials?: Slot<'span'>;
    icon?: Slot<'span'>;
    badge?: Slot<typeof PresenceBadge>;
};

// @public
export type AvatarState = ComponentState<AvatarSlots> & Required<Pick<AvatarProps, 'active' | 'activeAppearance' | 'shape' | 'size'>> & {
    color: NonNullable<Exclude<AvatarProps['color'], 'colorful'>>;
    activeAriaLabelElement?: JSXElement;
};

// @internal
export function getInitials(displayName: string | undefined | null, isRtl: boolean, options?: {
    allowPhoneInitials?: boolean;
    firstInitialOnly?: boolean;
}): string;

// @public (undocumented)
export type PartitionAvatarGroupItems<T> = {
    inlineItems: readonly T[];
    overflowItems?: readonly T[];
};

// @public
export const partitionAvatarGroupItems: <T>(options: PartitionAvatarGroupItemsOptions<T>) => PartitionAvatarGroupItems<T>;

// @public (undocumented)
export type PartitionAvatarGroupItemsOptions<T> = {
    items: readonly T[];
    layout?: 'spread' | 'stack' | 'pie';
    maxInlineItems?: number;
};

// @public (undocumented)
export const renderAvatar_unstable: (state: AvatarState) => JSXElement;

// @public
export const renderAvatarGroup_unstable: (state: AvatarGroupState, contextValues: AvatarGroupContextValues) => JSXElement;

// @public
export const renderAvatarGroupItem_unstable: (state: AvatarGroupItemState) => JSXElement;

// @public
export const renderAvatarGroupPopover_unstable: (state: AvatarGroupPopoverState, contextValues: AvatarGroupContextValues) => JSXElement;

// @public (undocumented)
export const useAvatar_unstable: (props: AvatarProps, ref: React_2.Ref<HTMLElement>) => AvatarState;

// @internal (undocumented)
export const useAvatarContext: () => AvatarContextValue;

// @public
export const useAvatarGroup_unstable: (props: AvatarGroupProps, ref: React_2.Ref<HTMLElement>) => AvatarGroupState;

// @public (undocumented)
export const useAvatarGroupContext_unstable: <T>(selector: ContextSelector<AvatarGroupContextValue, T>) => T;

// @public (undocumented)
export const useAvatarGroupContextValues: (state: AvatarGroupState) => AvatarGroupContextValues;

// @public
export const useAvatarGroupItem_unstable: (props: AvatarGroupItemProps, ref: React_2.Ref<HTMLElement>) => AvatarGroupItemState;

// @public
export const useAvatarGroupItemStyles_unstable: (state: AvatarGroupItemState) => AvatarGroupItemState;

// @public
export const useAvatarGroupPopover_unstable: (props: AvatarGroupPopoverProps) => AvatarGroupPopoverState;

// @public (undocumented)
export const useAvatarGroupPopoverContextValues_unstable: (state: AvatarGroupPopoverState) => AvatarGroupContextValues;

// @public
export const useAvatarGroupPopoverStyles_unstable: (state: AvatarGroupPopoverState) => AvatarGroupPopoverState;

// @public
export const useAvatarGroupStyles_unstable: (state: AvatarGroupState) => AvatarGroupState;

// @public (undocumented)
export const useAvatarStyles_unstable: (state: AvatarState) => AvatarState;

// (No @packageDocumentation comment for this package)