import React from "react";
import type { WarpModal } from "./modal.js";
export { ModalFooter } from "../modal-footer/react.js";
export { ModalHeader } from "../modal-header/react.js";
/**
 * Modals (or dialogs) display important information that users need to acknowledge.
 *
 * If you keep the <code>open</code> state, listen to <code>onHidden</code> so you can update the state when the user clicks the backdrop, close button, or presses <kbd>Escape</kbd>.
 *
 * [Warp component reference](https://warp-ds.github.io/docs/components/modal/frameworks/elements)
 *
 * @example
 * ```jsx
 * const [open, setOpen] = useState(false);
 * return (
 *   <>
 *     <Button variant="primary" onClick={() => setOpen(true)}>
 *       Open modal
 *     </Button>
 *     <Modal show={open} id="example-modal-one" onHidden={() => setOpen(false)} onShown={() => setOpen(true)}>
 *       <ModalHeader title="An example modal" />
 *       <ModalContent>
 *         <p>
 *           <!-- modal content -->
 *         </p>
 *       </ModalContent>
 *       <ModalFooter>
 *         <Button variant="primary" id="modal-close-button-one" onClick={() => setOpen(false)}>
 *           OK
 *         </Button>
 *       </ModalFooter>
 *     </Modal>
 *   </>
 * );
 * ```
 */
export declare const Modal: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpModal>, "open" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "close" | "updated" | "render" | "renderOptions" | "show" | "contentId" | "ignoreBackdropClicks" | "handleSlotChange" | "onShown" | "onshown" | "onHidden" | "onhidden"> & {
    onShown?: ((e: CustomEvent<any>) => void) | undefined;
    onshown?: ((e: CustomEvent<any>) => void) | undefined;
    onHidden?: ((e: CustomEvent<any>) => void) | undefined;
    onhidden?: ((e: CustomEvent<any>) => void) | undefined;
} & Partial<Omit<WarpModal, keyof HTMLElement>> & React.RefAttributes<WarpModal>, "ref">, "content-id" | "ignore-backdrop-clicks"> & {
    contentId?: string;
    ignoreBackdropClicks?: boolean;
} & React.RefAttributes<WarpModal>>;
/**
 * Convenience component to get a root element in the content slot of the modal.
 */
export declare const ModalContent: ({ ...props }: {
    [x: string]: any;
}) => React.DetailedReactHTMLElement<{
    slot: string;
}, HTMLElement>;