import type { ReactNode, MouseEvent } from 'react';
/**
 * Props del componente Dropdown (trigger button)
 */
export interface DropdownProps {
    /**
     * Variante visual del dropdown
     * - 'default': Botón con texto + ícono
     * - 'icon-only': Solo ícono (sin texto)
     * @default 'default'
     */
    variant?: 'default' | 'icon-only';
    /**
     * Texto o contenido del botón trigger
     */
    children?: ReactNode;
    /**
     * Items del menú dropdown
     */
    items: DropdownItemProps[];
    /**
     * Si el dropdown está abierto (controlado)
     */
    open?: boolean;
    /**
     * Callback cuando el dropdown cambia de estado
     */
    onOpenChange?: (open: boolean) => void;
    /**
     * Si el dropdown está deshabilitado
     * @default false
     */
    disabled?: boolean;
    /**
     * Clases CSS adicionales para el trigger
     */
    className?: string;
    /**
     * Clases CSS adicionales para el menú
     */
    menuClassName?: string;
    /**
     * Label para accesibilidad (ARIA)
     */
    ariaLabel?: string;
    /**
     * Placeholder cuando no hay children
     * @default 'Options'
     */
    placeholder?: string;
    /**
     * Función para renderizar un trigger personalizado
     * Recibe el estado isOpen y debe retornar un ReactNode
     * Útil para casos de uso avanzados como menús de usuario con avatar
     *
     * @example
     * ```tsx
     * <Dropdown
     *   renderTrigger={(isOpen) => (
     *     <button className={isOpen ? 'active' : ''}>
     *       Custom Trigger
     *     </button>
     *   )}
     *   items={[...]}
     * />
     * ```
     */
    renderTrigger?: (isOpen: boolean) => ReactNode;
}
/**
 * Props del componente DropdownItem
 */
export interface DropdownItemProps {
    /**
     * Contenido del item
     * No requerido cuando isDivider es true
     */
    children?: ReactNode;
    /**
     * Icono a mostrar antes del texto (izquierda)
     */
    icon?: ReactNode;
    /**
     * Descripción secundaria del item
     */
    description?: string;
    /**
     * Atajo de teclado a mostrar (derecha)
     */
    shortcut?: string;
    /**
     * Si el item está deshabilitado
     * @default false
     */
    disabled?: boolean;
    /**
     * Si el item está seleccionado
     * @default false
     */
    selected?: boolean;
    /**
     * Función onClick del item
     */
    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
    /**
     * Clases CSS adicionales
     */
    className?: string;
    /**
     * Indica si este item es un divider (separador)
     * @default false
     */
    isDivider?: boolean;
    /**
     * Indica si este item es un heading (encabezado)
     * @default false
     */
    isHeading?: boolean;
    /**
     * Contenido personalizado que reemplaza el renderizado por defecto del item.
     * Útil para empotrar componentes complejos como selectores de idioma.
     */
    customContent?: ReactNode;
}
/**
 * Props del componente DropdownHeading
 */
export interface DropdownHeadingProps {
    /**
     * Texto del heading
     */
    children: ReactNode;
    /**
     * Clases CSS adicionales
     */
    className?: string;
}
/**
 * Props del componente DropdownDivider
 */
export interface DropdownDividerProps {
    /**
     * Clases CSS adicionales
     */
    className?: string;
}
//# sourceMappingURL=Dropdown.types.d.ts.map