import { default as React } from 'react';
import { IconName } from '../../icons/Icon';
import { ButtonSize, ButtonVariant } from '../Button';
import { IconConfig } from '../Button/Button';
type ModalButtonProps = {
    show?: boolean;
    text?: string;
    disabled?: boolean;
    action?: () => Promise<void> | void;
    size?: ButtonSize;
    variant?: ButtonVariant;
    loading?: boolean;
    id?: string;
    className?: string;
    icon?: IconConfig;
};
/**
 * Props del Modal
 */
export interface ModalProps extends React.HTMLAttributes<HTMLSpanElement> {
    isOpen: boolean;
    title?: string;
    children?: React.ReactNode;
    width?: number;
    confirmButton?: ModalButtonProps;
    cancelButton?: ModalButtonProps;
    zIndex?: number;
    className?: string;
    onClickOverlay?: (() => Promise<void> | void) | false;
    onClose?: (() => Promise<void> | void) | false;
    closeModal: () => void;
    withScroll?: boolean;
    fullWidthFooter?: boolean;
    helperElement?: React.ReactNode;
    titleClassName?: string;
    contentClassName?: string;
    footerClassName?: string;
    useBlueTitle?: boolean;
    icon?: IconName;
}
/**
 * Modal con overlay, header, body y footer configurable.
 *
 * Puedes pasar un objeto a `confirmButton` y `cancelButton` para controlar:
 * - `show`: si se renderiza el botón (por defecto true)
 * - `text`: texto del botón
 * - `action`: función a ejecutar al hacer click
 * - `variant`: variante visual del botón ("brand", "outline", etc.)
 * - `size`: tamaño del botón ("small", "medium", "large")
 * - `disabled`: deshabilita el botón
 * - `loading`: muestra estado de carga en el botón
 *
 * @param isOpen - Controla la visibilidad del modal.
 * @param title - Título que se muestra en el header del modal.
 * @param children - Contenido del modal; puede ser cualquier componente React.
 * @param width - Ancho del modal en píxeles. Por defecto 752.
 * @param confirmButton - Configuración del botón de confirmación.
 * @param cancelButton - Configuración del botón de cancelación.
 * @param zIndex - Número para controlar la superposición del modal.
 * @param className - Clases CSS adicionales para el modal.
 * @param style - Estilos inline adicionales para el contenedor del modal.
 * @param onClickOverlay - Callback opcional al hacer click fuera del modal. Si se pasa `false`, el overlay no cierra el modal ni ejecuta acción.
 * @param onClose - Callback opcional al pulsar el icono de cierre. Si se pasa `false`, no se renderiza el icono de cierre.
 * @param closeModal - Función obligatoria que cierra el modal desde el exterior.
 * @param withScroll - Scroll automático en modalBody. Aparece línea de separación en el header y en el footer.
 * @param fullWidthFooter - Footer ocupa el 100% del ancho en lugar de fit-content.
 * @param helperElement - Componente a renderizar como helper a la derecha del modal, dentro del mismo layout de overlay.
 *
 * @example
 * ```tsx
 * import { useState } from "react";
 * import { Modal, Button } from "bmi-next-brokers";
 * import MiComponente from "@componentes";
 *
 * export default function Example() {
 *   const [isOpen, setIsOpen] = useState(false);
 *
 *   const handleConfirm = () => console.log("Confirmado");
 *   const handleCancel = () => console.log("Cancelado");
 *
 *   return (
 *     <>
 *       <Button onClick={() => setIsOpen(true)}>Abrir Modal</Button>
 *
 *       <Modal
 *         isOpen={isOpen}
 *         closeModal={() => setIsOpen(false)}
 *         title="Ejemplo de Modal"
 *         width={500}
 *         fullWidthFooter
 *         withScroll={false}
 *         helperElement={< MiComponente />}
 *         confirmButton={{
 *           text: "Guardar",
 *           action: handleConfirm,
 *           variant: "brand",
 *           size: "small",
 *           loading: false,
 *           id: "form"
 *         }}
 *         cancelButton={{
 *           show: false, // no se renderiza
 *           text: "Cerrar",
 *           action: handleCancel,
 *           variant: "outline",
 *           size: "small",
 *           loading: false
 *         }}
 *         onClose={() => console.log("Click en el botón de cierre")}
 *       >
 *         <div style={{ padding: "16px 0" }}>
 *           <p>Contenido del modal...</p>
 *         </div>
 *       </Modal>
 *     </>
 *   );
 * }
 * ```
 */
export declare const Modal: ({ isOpen, title, children, width, confirmButton, cancelButton, zIndex, className, titleClassName, contentClassName, footerClassName, style, onClickOverlay, onClose, closeModal, withScroll, fullWidthFooter, helperElement, useBlueTitle, icon, ...props }: ModalProps) => React.ReactPortal | null;
export {};