New to KendoReact? Start a free 30-day trial

DialogProps

Interface

Represents the props of the KendoReact Dialog component.

Definition

Package:@progress/kendo-react-dialogs

Properties

appendTo?

any

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

autoFocus?

boolean

Set the focus the Dialog container automatically when mounted.

Default:

false

autoFocusedElement?

string

Specifies the query selector used to set the initial focus (see examples).

className?

string

Sets a class of the Dialog DOM element.

closeIcon?

boolean

Specifies whether a close button should be rendered at the top corner of the dialog.

Default:

true

contentStyle?

CSSProperties

The styles that are applied to the content of the Dialog.

dir?

string

Represents the dir HTML attribute.

height?

string | number

Specifies the height of the Dialog (see example).

id?

string

Sets the aria-labelledby value.

minWidth?

string | number

Specifies the minimum width of the Dialog.

boolean

Specifies if the Dialog will be modal by rendering an overlay under the component.

Default:

true

onClose?

(event: DialogCloseEvent) => void

Fires when the Close button in the title is clicked or when the Esc button is pressed.

Parameters:eventDialogCloseEvent

overlayStyle?

CSSProperties

Set styles to the Dialog overlay element rendered when the modal prop is enabled.

style?

CSSProperties

The styles that are applied to the Dialog.

title?

string | ReactElement<any, string | JSXElementConstructor<any>>

Sets the title of the Dialog (see example). If you do not specify the title, the Dialog does not render a Close button.

webMcp?

boolean | WebMcpProps

Enables Web MCP tool registration for this component. Requires a parent WebMcpProvider from @progress/kendo-react-webmcp.

width?

string | number

Specifies the width of the Dialog (see example).