import type { BoxProps } from '@mui/material/Box';
import type { HTMLAttributes, ReactNode } from 'react';
/**
 * Controls both the render mode and (for fanout variants) the fan-out direction.
 *
 * - `"static"` — overlapping row, no hover animation **(default)**
 * - `"fanout-right"` — fans right on hover (anchor: leftmost chip)
 * - `"fanout-left"` — fans left on hover (anchor: rightmost chip)
 * - `"fanout-center"` — fans both ways on hover (anchor: middle chip)
 */
export type ChipStackVariant = 'static' | 'fanout-right' | 'fanout-left' | 'fanout-center';
/** All variant values — useful for building selects/controls. */
export declare const CHIP_STACK_VARIANTS: readonly ["static", "fanout-right", "fanout-left", "fanout-center"];
/** Default variant when `variant` is omitted. */
export declare const DEFAULT_CHIP_STACK_VARIANT: ChipStackVariant;
/** Resolved internally from `variant` — not exposed as a prop. */
export type ChipStackFanOutDirection = 'right' | 'left' | 'center';
/** Passed to `renderItem` so the callback knows how large to render each chip. */
export type ChipStackItemRenderContext = {
    slotSize: number;
};
/**
 * Passed to `renderOverflow` when items exceed `maxItems`.
 *
 * @template T — matches the `items` array type on `ChipStackProps<T>`.
 *               `ReactNode` for compositional (children) usage.
 */
export type ChipStackOverflowRenderArgs<T = unknown> = {
    /** The full `items` array passed to `ChipStack`. */
    items: readonly T[];
    /** The hidden items that overflowed past `maxItems`. */
    overflowItems: readonly T[];
    /** Chip diameter in px — size your overflow chip to this value. */
    size: number;
};
export type ChipStackFaceItem = {
    /** Optional stable key — defaults to `first-last-index`. */
    id?: string;
    first: string;
    last: string;
    /** Omitted or broken → initials on gradient. */
    logo?: string;
    /** Custom tooltip content — defaults to `"First Last"`. Pass `null` to disable. */
    tooltip?: ReactNode | null;
};
/**
 * Fine-grained style/prop overrides for internal slots.
 */
export type ChipStackSlotProps = {
    /** Outer flex shell wrapping the chip track (`Box`). */
    shell?: BoxProps;
    /** Positioned `<div>` holding all chip slots — use for `aria-label` and other HTML attributes. */
    track?: HTMLAttributes<HTMLDivElement>;
    /**
     * Layout dimensions for the animated track.
     * Pass here instead of as top-level props to keep the component surface clean.
     */
    layout?: {
        /** Z-index of the track while hovered. @default 1000 */
        zIndex?: number;
        /** Chip diameter in px. @default 24 */
        size?: number;
        /** Horizontal distance between stacked chips in px. */
        stackStep?: number;
        /** Space between chips when fully expanded in px. */
        gap?: number;
        /** Minimum width of the chip track container in px. */
        minTrackWidth?: number;
    };
};
/**
 * Props for `ChipStack`.
 *
 * Two input styles:
 * - **Data-driven** — `items` + `getItemKey` + `renderItem`
 * - **Compositional** — `children` (wrap in `OverlapChip` for static, or pass raw nodes)
 *
 * When both are provided, `children` takes precedence and `items` is ignored.
 */
export type ChipStackProps<T = unknown> = {
    /**
     * Controls render mode and fan-out direction.
     *
     * - `"static"` — overlapping row, no animation **(default)**
     * - `"fanout-right"` — fans right on hover
     * - `"fanout-left"` — fans left on hover
     * - `"fanout-center"` — fans both ways on hover
     */
    variant?: ChipStackVariant;
    /** Data array. Requires `getItemKey` and `renderItem`. */
    items?: readonly T[];
    getItemKey?: (item: T, index: number) => string;
    renderItem?: (item: T, index: number, ctx: ChipStackItemRenderContext) => ReactNode;
    /** Rendered as-is. Wrap in `OverlapChip` for static variants. */
    children?: ReactNode;
    /** Cap visible chips; collapse the rest into a `+N` indicator. */
    maxItems?: number;
    /**
     * **Fanout variants only.** When `true`, only the anchor chip is visible while idle.
     * Hovering reveals all chips with the fan-out animation defined by `variant`.
     *
     * Pairs with any `fanout-*` variant:
     * ```tsx
     * <ChipStack variant="fanout-right" compact items={apps} ... />
     * ```
     *
     * @default false
     */
    compact?: boolean;
    /**
     * Fully replace the `+N` overflow slot.
     * Receives `{ items, overflowItems, size }` where `items` is the full data array
     * and `overflowItems` is the hidden slice.
     *
     * ```tsx
     * renderOverflow={({ items, overflowItems, size }) => (
     *   <MyPopover trigger={`+${overflowItems.length}`} chipSize={size} data={items} />
     * )}
     * ```
     */
    renderOverflow?: (args: ChipStackOverflowRenderArgs<T>) => ReactNode;
    sx?: BoxProps['sx'];
    className?: string;
    /** Style/prop overrides for internal slots and layout dimensions. */
    slotProps?: ChipStackSlotProps;
    'data-testid'?: string;
};