• What is KendoReact
  • Getting Started
  • Server Components
  • Components
    • Animation
    • Barcodes
    • Buttons
    • Chart Wizardnew
    • Chartsupdated
    • Common Utilities
    • Conversational UIupdated
    • Data Gridupdated
    • Data Query
    • Data Toolsupdated
    • Date Inputs
    • Date Math
    • Dialogsupdated
    • Drawing
    • Dropdowns
    • Editor
    • Excel Export
    • File Saver
    • Form
    • Gantt
    • Gauges
    • Indicators
    • Inputsupdated
    • Labels
    • Layoutupdated
    • ListBoxupdated
    • ListView
    • Map
    • Notification
    • OrgChart
    • PDF Processing
    • PDF Viewer
    • PivotGrid
    • Popup
    • Progress Bars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheet
    • TaskBoard
    • Tooltips
    • TreeList
    • TreeViewupdated
    • Upload
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting
Components / Dialogs / API / WindowProps / 

WindowProps

Represents the props of the KendoReact Window component.

NameTypeDefaultDescription

appendTo?

"null" | HTMLElement

Defines the container to which the Window will be appended. Defaults to its parent element.

  • If set to null the Window will be rendered without React Portal.

autoFocus?

boolean

Focus the Window container automatically when mounted. By default the autoFocus is true.

className?

string

Sets a class of the Window DOM element.

closeButton?

React.ComponentType<any>

Specifies if the Window will render the close button.

doubleClickStageChange?

boolean

Specifies if the Window stage will change on title double click. The this is on by default.

draggable?

boolean

Specifies if the Window will be draggable (see example).

height?

number

Specifies the height of the Window (see example).

id?

string

Sets the id attribute value of the wrapper element of the Window.

initialHeight?

number

Specifies the initial height of the Window (see example). The component will be in an uncontrolled mode.

initialLeft?

number

Specifies the initial left value (see example). The Window will be in an uncontrolled mode.

initialTop?

number

Specifies the initial top value (see example). The component will be in an uncontrolled mode.

initialWidth?

number

Specifies the initial width of the Window (see example). The component will be in an uncontrolled mode.

left?

number

Specifies the left coordinates of the Window.

maximizeButton?

React.ComponentType<any>

Specifies if the Window will render the maximize button.

minHeight?

number

Specifies the minimum height of the Window (see example).

minimizeButton?

React.ComponentType<any>

Specifies if the Window will render the minimize button.

minWidth?

number

Specifies the minimum width of the Window (see example).

modal?

boolean

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

onClose?

(event: WindowActionsEvent) => void

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

onMove?

(event: WindowMoveEvent) => void

Fires when the Window is dragged.

onResize?

(event: WindowMoveEvent) => void

Fires when the Window resizes.

onStageChange?

(event: WindowActionsEvent) => void

Fires when the DEFAULT, FULLSCREEN, or MINIMIZED state of the Window is changed.

overlayStyle?

React.CSSProperties

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

resizable?

boolean

Specifies if the Window will be resizable (see example).

restoreButton?

React.ComponentType<any>

Specifies if the Window will render the restore button.

shouldUpdateOnDrag?

boolean

Specifies if the Window content will update during resizing.

stage?

string

Controls the state of the Window (see example).

The supported values are:

  • DEFAULT
  • MINIMIZED
  • FULLSCREEN

style?

React.CSSProperties

Set styles to the Window element.

themeColor?

"primary" | "dark" | "light"

Configures the themeColor of the Window.

The available options are:

  • primary
  • dark
  • light

title?

React.ReactNode

Specifies the title of the Window (see example).

top?

number

Specifies the top coordinates of the Window.

width?

number

Specifies the width of the Window.

In this article

Not finding the help you need?

Contact Support