/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { DialogCloseEvent } from './events';
import { WebMcpProps } from '@progress/kendo-react-common';
/**
 * Represents the props of the [KendoReact Dialog component](https://www.telerik.com/kendo-react-ui/components/dialogs/dialog).
 */
export interface DialogProps {
    /**
     * Set the focus the Dialog container automatically when mounted.
     *
     * @default false
     *
     * @example
     * ```jsx
     * <Dialog autoFocus={true} />
     * ```
     *
     * @remarks
     * This property is related to accessibility.
     */
    autoFocus?: boolean;
    /**
     * Specifies the query selector used to set the initial focus ([see examples](https://www.telerik.com/kendo-react-ui/components/dialogs/dialog/initial-focus)).
     *
     * @example
     * ```jsx
     * <Dialog autoFocusedElement="#input-id" />
     * ```
     *
     * @remarks
     * This property is related to accessibility.
     */
    autoFocusedElement?: string;
    /**
     * Sets the title of the Dialog ([see example](https://www.telerik.com/kendo-react-ui/components/dialogs/dialog/title)). If you do not specify the `title`, the Dialog does not render a **Close** button.
     *
     * @example
     * ```jsx
     * <Dialog title="Dialog Title" />
     * ```
     */
    title?: string | React.ReactElement<any>;
    /**
     * Sets a class of the Dialog DOM element.
     *
     * @example
     * ```jsx
     * <Dialog className="custom-class" />
     * ```
     */
    className?: string;
    /**
     * Specifies whether a close button should be rendered at the top corner of the dialog.
     *
     * @default true
     *
     * @example
     * ```jsx
     * <Dialog closeIcon={true} />
     * ```
     */
    closeIcon?: boolean;
    /**
     * Specifies if the Dialog will be modal by rendering an overlay under the component.
     *
     * @default true
     *
     * @example
     * ```jsx
     * <Dialog modal={false} />
     * ```
     */
    modal?: boolean;
    /**
     * Set styles to the Dialog overlay element rendered when the `modal` prop is enabled.
     *
     * @example
     * ```jsx
     * <Dialog overlayStyle={{ backgroundColor: 'rgba(0, 0, 0, 0.5)' }} />
     * ```
     */
    overlayStyle?: React.CSSProperties;
    /**
     * Specifies the width of the Dialog ([see example](https://www.telerik.com/kendo-react-ui/components/dialogs/dialog/dimensions)).
     *
     * @example
     * ```jsx
     * <Dialog width="400px" />
     * ```
     */
    width?: number | string;
    /**
     * Specifies the height of the Dialog ([see example](https://www.telerik.com/kendo-react-ui/components/dialogs/dialog/dimensions)).
     *
     * @example
     * ```jsx
     * <Dialog height="300px" />
     * ```
     */
    height?: number | string;
    /**
     * Specifies the minimum width of the Dialog.
     *
     * @example
     * ```jsx
     * <Dialog minWidth="200px" />
     * ```
     */
    minWidth?: number | string;
    /**
     * Fires when the **Close** button in the title is clicked or when the `Esc` button is pressed.
     *
     * @example
     * ```jsx
     * <Dialog onClose={(event) => console.log(event)} />
     * ```
     */
    onClose?: (event: DialogCloseEvent) => void;
    /**
     * @hidden
     */
    children?: React.ReactNode;
    /**
     * Sets the `aria-labelledby` value.
     *
     * @example
     * ```jsx
     * <Dialog id="dialog-id" />
     * ```
     */
    id?: string;
    /**
     * Represents the `dir` HTML attribute.
     *
     * @example
     * ```jsx
     * <Dialog dir="rtl" />
     * ```
     */
    dir?: string;
    /**
     * The styles that are applied to the Dialog.
     *
     * @example
     * ```jsx
     * <Dialog style={{ border: '1px solid black' }} />
     * ```
     */
    style?: React.CSSProperties;
    /**
     * The styles that are applied to the content of the Dialog.
     *
     * @example
     * ```jsx
     * <Dialog contentStyle={{ padding: '20px' }} />
     * ```
     */
    contentStyle?: React.CSSProperties;
    /**
     * Defines the container to which the Dialog will be appended.
     * * If set to `null` the Dialog will be rendered without React Portal.
     *
     * @default document.body
     *
     * @example
     * ```jsx
     * <Dialog appendTo={document.getElementById('container')} />
     * ```
     */
    appendTo?: any;
    /**
     * Enables Web MCP tool registration for this component.
     * Requires a parent `WebMcpProvider` from `@progress/kendo-react-webmcp`.
     */
    webMcp?: boolean | WebMcpProps;
}