@styleless-ui/react/Dialog/Dialog.d.ts

Completely unstyled, headless and accessible React UI components.

import * as React from "react";
import type { Classes, MergeElementProps } from "../typings";
type DialogClassesMap = Classes<"root" | "backdrop">;
interface OwnProps {
    /**
     * The content of the tab dialog.
     */
    children?: React.ReactNode;
    /**
     * Map of sub-components and their correlated classNames.
     */
    classes?: DialogClassesMap | ((ctx: {
        openState: boolean;
    }) => DialogClassesMap);
    /**
     * If `true`, the dialog will be opened.
     */
    open: boolean;
    /**
     * The DOM node reference or selector to focus when the dialog closes.
     *
     * If not provided, the previously focused element will be focused.
     */
    focusAfterClosed?: React.RefObject<HTMLElement> | string;
    /**
     * `alertdialog`: An alert dialog is a modal dialog that
     * interrupts the user's workflow to communicate an
     * important message and acquire a response.
     *
     * `dialog`: A modal dialog is a window overlaid on
     * either the primary window or another dialog window.
     */
    role: "dialog" | "alertdialog";
    /**
     * Callback fired when the backdrop is clicked.
     */
    onBackdropClick?: React.MouseEventHandler<HTMLDivElement>;
    /**
     * Used to keep mounting when more control is needed.\
     * Useful when controlling animation with React animation libraries.
     * @default false
     */
    keepMounted?: boolean;
}
export type Props = Omit<MergeElementProps<"div", OwnProps>, "className" | "defaultChecked" | "defaultValue">;
declare const Dialog: (props: Props, ref: React.Ref<HTMLDivElement>) => JSX.Element | null;
export default Dialog;