• What is KendoReact
  • Getting Started
  • Server Components
  • Components
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting

OrgChartProps

Represents the props of the KendoReact OrgChart component.

NameTypeDefaultDescription

ariaLabel?

string

Sets custom aria-label to the OrgChart. The default value is "Org Chart"

avatarField?

string

Specifies the avatar of the field which will provide a avatar representation for the item. Defaults to text.

cardHeight?

number

Specifies the height of the card of the OrgChart.

cardsColors?

string[]

Specifies a string array with the colors applied to the items. By default the colors come from the Kendo Theme that is used.

cardWidth?

number

Specifies the width of the card of the OrgChart.

childrenField?

string

Specifies the name of the field which will provide an array representation of the item children.

className?

string

Sets additional classes to the OrgChart.

data?

any[]

Sets the data of the OrgChart.

expandField?

string

Specifies the name of the field which will provide a Boolean representation for the expanded state of the item. Defaults to expanded.

groupField?

string

Specifies the field by which the OrgChart data is grouped.

groupSubtitleHeight?

number

Specifies the height of the subtitle of the grouped OrgChart.

groupSubtitleRender?

React.ComponentType<OrgChartGroupSubtitleProps>

Defines the component that will be used for rendering each of the grouped OrgChart subtitle.

groupTitleHeight?

number

Specifies the height of the title of the grouped OrgChart.

groupTitleRender?

React.ComponentType<OrgChartGroupTitleProps>

Defines the component that will be used for rendering each of the grouped OrgChart title.

hasChildrenField?

string

Specifies the name of the field which indicates to the OrgChart that an item has children even if the children are not initially passed. Used for implementing the load-on-demand feature. Defaults to undefined.

height?

string | number

Specifies the width the OrgChart.

id?

string

Sets custom id to the OrgChart.

idField?

string

Specifies the name of the field which will provide a id for the item. Defaults to id.

itemRender?

React.ComponentType<OrgChartItemRenderProps>

Defines the component that will be used for rendering each of the OrgChart items.

navigatable?

boolean

Specifies if the OrgChart can be navigatable with keyboard. Defaults to true.

onExpandChange?

(ev: OrgChartExpandChangeEvent) => void

Fires when a node or group is expanded.

onGroupAction?

(ev: OrgChartActionEvent) => void

Triggers the group action event.

onItemAction?

(ev: OrgChartActionEvent) => void

Triggers the item action event.

onItemContextMenu?

(ev: OrgChartActionEvent) => void

Triggers the item contextmenu action event.

onItemDoubleClick?

(ev: OrgChartActionEvent) => void

Triggers the item double click action event.

style?

React.CSSProperties

The styles that are applied to the OrgChart.

subtitleField?

string

Specifies the name of the field which will provide a subtitle representation for the item. Defaults to text.

titleField?

string

Specifies the name of the field which will provide a title representation for the item. Defaults to text.

verticalLine?

number

Specifies the height of the vertical line of the OrgChart.