import { ReactNode, RefObject } from 'react';
import { ButtonProps } from './button';
import { ModalBadge, ModalButton, ModalIcon } from './modal';
export interface PopupRef {
    open: () => void;
    close: () => void;
    isOpen: () => boolean;
}
/** Lado del panel donde se dibuja la flecha hacia el ancla. */
export type PopupArrowEdge = 'top' | 'bottom' | 'left' | 'right';
/** Posición calculada de la flecha (centro del triángulo sobre el borde del panel). */
export interface PopupArrowPlacement {
    edge: PopupArrowEdge;
    /** px desde el borde izquierdo del panel (edge top/bottom) o superior (edge left/right) */
    offsetPx: number;
}
/**
 * Flecha hacia el origen (trigger).
 * - `false` (por defecto): sin flecha, comportamiento actual.
 * - `auto`: lado según `position`; alineación hacia el centro del trigger.
 * - objeto: lado y alineación fijos (p. ej. para alinear a Figma).
 */
export type PopupArrowMode = false | 'auto' | {
    edge: PopupArrowEdge;
    align: 'start' | 'center' | 'end';
    /** Desplazamiento adicional en px desde el inicio del lado */
    offsetPx?: number;
};
export interface PopupProps extends Omit<ButtonProps, 'tooltipColor'> {
    children: React.ReactNode;
    /**
     * Ref al elemento DOM que abre el panel y sirve de ancla (puede vivir fuera del `Popup`).
     * Si se define, **no** se renderiza el `InnerButton` interno: enlazamos clic (toggle) y, si aplica,
     * `openOnHover` en ese nodo. El panel sigue renderizándose en portal o `absolute` según props.
     * Con `absolute={true}`, el ancla externa debería estar en el mismo subárbol posicionado que el
     * portal del panel para que `offsetTop`/`offsetLeft` sean coherentes; si no, usa `absolute={false}`.
     */
    triggerRef?: RefObject<HTMLElement | null>;
    /** Texto o nodo del botón disparador (p. ej. JSX con hover personalizado). */
    label?: ReactNode;
    position?: 'top' | 'top-left' | 'top-right' | 'bottom' | 'left' | 'right' | 'bottom-right' | 'bottom-center' | 'bottom-left';
    /**
     * Separación en px entre el trigger y el borde del panel. Con `popoverArrow` activo, el valor
     * se interpreta como separación deseada entre trigger y **punta** de la flecha (mínimo 6px).
     */
    offset?: number;
    closeOnClickOutside?: boolean;
    closeOnEscape?: boolean;
    popupId?: string;
    className?: string;
    /**
     * Borde del panel flotante (`ui-border ui-border-default`). Por defecto `true`.
     * Con `false`: sin contorno, sombra más marcada (`ui-shadow-xl`) y flecha sin trazo con sombra acorde.
     */
    showPanelBorder?: boolean;
    onOpen?: () => void;
    onClose?: () => void;
    disabled?: boolean;
    absolute?: boolean;
    /**
     * Si es `true`, el panel no fuerza `overflow: hidden`, de modo que descendientes posicionados en
     * absoluto (p. ej. `Dropdown` con `popover.absolute: true`) puedan pintarse fuera del rectángulo
     * del popup. Por defecto `false` (mejor recorte con bordes redondeados y scroll interno).
     */
    allowOverflow?: boolean;
    /**
     * Abrir el panel al pasar el ratón por el trigger, tras un retardo.
     * - `false` / omitido: desactivado (por defecto).
     * - `true`: retardo por defecto (200 ms).
     * - número ≥ 0: retardo en ms (`0` = al instante).
     * El clic en el trigger sigue alternando el panel. Para ir al panel sin cerrar, hay un margen al salir del trigger.
     */
    openOnHover?: boolean | number;
    /**
     * Con `openOnHover` activo: el panel se ancla al puntero dentro del trigger (rectángulo 1×1
     * que sigue el ratón), actualizado en cada frame vía `requestAnimationFrame` para un movimiento fluido.
     * Sin efecto si `openOnHover` está desactivado. Aplica al botón interno y a `triggerRef`.
     */
    hoverAnchorFollowPointer?: boolean;
    /**
     * Con `openOnHover` activo: si es `true` (por defecto), pasar el puntero del trigger al panel
     * cancela el cierre programado (comportamiento “puente”). Si es `false`, el panel no cuenta como
     * zona hover: al salir del trigger el popup se cierra aunque el puntero quede sobre el panel.
     */
    openOnHoverAllowPanelPointer?: boolean;
    closeOnClick?: boolean;
    buttonClassName?: string;
    containerClassName?: string;
    buttonTransition?: boolean;
    buttonStyle?: React.CSSProperties;
    borderRadius?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
    stopPropagationList?: boolean;
    /**
     * Flecha tipo “beak” hacia el trigger. Por defecto `'auto'` (lado según `position`, punta al centro del trigger).
     * Con `absolute={true}`, `'auto'` no dibuja flecha; usa un objeto `{ edge, align }` o `false` para desactivarla.
     */
    popoverArrow?: PopupArrowMode;
    /**
     * Layout tipo modal (header / cuerpo / footer) reutilizando `ModalProvider` y `Modal.Header|Body|Footer` sin modificar el Modal.
     * El contenido de `children` se renderiza en el cuerpo.
     */
    popoverStructured?: boolean;
    /** Título del encabezado (tipografía H6 del sistema). */
    popoverTitle?: string;
    /** Subtítulo / descripción bajo el título. */
    popoverDescription?: string;
    /** Mostrar bloque de cabecera cuando `popoverStructured` es true. */
    popoverShowHeader?: boolean;
    /** Mostrar botón cerrar en cabecera (contexto Modal). */
    popoverShowCloseButton?: boolean;
    /** Icono principal del header (mismo modelo que Modal). */
    popoverIconConfig?: ModalIcon;
    popoverBadge?: ModalBadge;
    popoverBadges?: ModalBadge[];
    popoverHeaderButton?: ModalButton;
    popoverHeaderButtons?: ModalButton[];
    /** Incluir footer con botones del modelo Modal. */
    popoverShowFooter?: boolean;
    popoverFooterPrimaryButton?: ModalButton;
    popoverFooterSecondaryButton?: ModalButton;
    popoverFooterButtons?: ModalButton[];
    popoverFooterAuxButton?: ModalButton;
    /**
     * Reparto de iconos en los botones del footer del popover estructurado (`popoverFooterPrimaryButton` /
     * `popoverFooterSecondaryButton` / `popoverFooterButtons`). `spread` equivale a `slotLayout={{ var: 'spread', textAlign: 'center' }}` en cada
     * botón y reparto de ancho en la fila del footer (misma idea que `footerSlotLayout` en `Modal` para botones legacy).
     */
    popoverFooterSlotLayout?: 'inline' | 'spread';
    /** Padding del cuerpo (`Modal.Body withPadding`). Por defecto true. */
    popoverBodyWithPadding?: boolean;
}
//# sourceMappingURL=popup.d.ts.map