import { IconComponent } from '../../Icons/types';
import { ClassNameValue } from 'tailwind-merge';
import { AvatarBaseProps } from '../Avatar/AvatarBase';
export type ListItemAvatarProps = Pick<AvatarBaseProps, "imageUrl" | "name">;
export interface ListItemProps {
    size?: 'small' | 'medium' | 'large';
    elementType?: 'button' | 'a' | 'div';
    /** @deprecated not allowed anymore */
    slot?: React.ReactNode | ((state: ListItemSlotState) => React.ReactNode);
    /** @deprecated use leadingIcon instead */
    icon?: IconComponent;
    leadingIcon?: IconComponent;
    leadingSlot?: React.ReactNode | ((state: ListItemSlotState) => React.ReactNode);
    /** @deprecated not allowed anymore */
    iconClassName?: string;
    leadingIconClassName?: ClassNameValue;
    trailingIconClassName?: ClassNameValue;
    /** @deprecated use showSelectionComponent */
    checkbox?: boolean;
    showSelectionComponent?: boolean;
    selectionComponent?: 'checkbox' | 'radio-button' | 'check';
    label?: string;
    labelClassName?: ClassNameValue;
    /** @deprecated use showTrailingIcon instead */
    hiddeSecondaryIcon?: boolean;
    /** false by default */
    showTrailingIcon?: boolean;
    /** @deprecated use trailingIcon instead */
    secondaryIcon?: IconComponent;
    trailingIcon?: IconComponent;
    onTrailingIconClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
    /** @deprecated */
    secondaryIconClassName?: string;
    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
    /** Fires when the selection component (checkbox) is clicked.
     *  Stops propagation so parent containers (e.g. MenuList.Group) don't react. */
    onSelectionClick?: () => void;
    onAuxClick?: () => void;
    disabled?: boolean;
    /** @deprecated not allowed anymore. Try supporting text instead. */
    tooltipText?: string;
    supportingText?: string;
    avatarProps?: ListItemAvatarProps;
    className?: string;
    /** Only works if showSelectionComponent is true */
    isSelected?: boolean;
    /** Eje semántico de color, igual que Button/Badge. Ignora isSelected mientras disabled=true. */
    color?: "neutral" | "error";
    /** @deprecated not allowed anymore */
    children?: React.ReactNode | (() => React.ReactNode);
    showDivider?: boolean;
    role?: React.AriaRole;
}
interface ListItemSlotState {
    isSelected: boolean;
    disabled: boolean;
    checkbox: boolean;
}
/**
 * Item de lista para menús y selects.
 *
 * Está envuelto en `memo`: para aprovechar la memoización, estabilizá callbacks
 * como `onClick` y `onTrailingIconClick` con `useCallback` en el componente padre.
 */
declare const ListItem: import('react').NamedExoticComponent<ListItemProps & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLDivElement>>;
export default ListItem;