yarcl
    Preparing search index...

    Interface DialogProps

    Props for Dialog.

    interface DialogProps {
        children?: ReactNode;
        closeOnBackdrop?: boolean;
        defaultOpen?: boolean;
        description?: ReactNode;
        footer?: ReactNode;
        onOpenChange?: (open: boolean) => void;
        open?: boolean;
        radius?: Radius;
        size?: ModalSize;
        title: ReactNode;
        trigger?: ReactElement<
            { onClick?: (event: MouseEvent) => void },
            string | JSXElementConstructor<any>,
        >;
    }

    Hierarchy (View Summary)

    Index
    children? closeOnBackdrop? defaultOpen? description? footer? onOpenChange? open? radius? size? title trigger?
    children?: ReactNode

    Body content. Scrolls when it doesn't fit.

    closeOnBackdrop?: boolean

    Closes when the backdrop is clicked.

    true
    defaultOpen?: boolean

    Initial open state when uncontrolled.

    false
    description?: ReactNode

    Supporting text below the title. Also its accessible description.

    footer?: ReactNode

    Actions shown at the bottom, e.g. Cancel and Confirm buttons.

    onOpenChange?: (open: boolean) => void

    Called when the dialog opens or closes, including by Esc, the close button or a backdrop click.

    open?: boolean

    Controlled open state.

    radius?: Radius

    Corner radius, from the radii config.

    config.defaults.radius
    size?: ModalSize

    Width, from the modalSizes config. Height follows the content, up to the viewport.

    config.defaults.modalSize (Drawer: its component default, sm in the library defaults)

    title: ReactNode

    Heading of the dialog. Also its accessible name.

    trigger?: ReactElement<
        { onClick?: (event: MouseEvent) => void },
        string | JSXElementConstructor<any>,
    >

    An element that opens the dialog when clicked, e.g. a Button. Optional when controlled.

    Settings
    Member Visibility

    On This Page
    Properties