A Kanban board component that allows for drag-and-drop reordering of columns and cards.

Parameters:
NameTypeDescription
propsobject

The properties for the Kanban component.

Properties
NameTypeDescription
addColumnButtonAttributesobject

Attributes for the Add Column button.

addColumnButtonClassesstring | Array | object

Classes for the Add Column button.

afterHeadingJSX.Element | null

Content to display after the heading.

controlsLeftJSX.Element | null

Content to display on the left side of the controls.

customAttributesobject

Custom attributes for the Kanban component.

customClassesstring | Array | object

Custom classes for the Kanban component.

dataArray

The data for the Kanban columns and cards.

EmptyImageJSX.Element | null

The image to display when there are no cards.

heightnumber

The height of the Kanban component.

idstring

The ID of the Kanban component.

i18nobject

I18n strings for the Kanban component.

isLoadingboolean

Whether the Kanban is in a loading state.

onCardMovefunction

Callback function to handle card movement.

onChangefunction

Callback function to handle changes to the Kanban data.

onColumnEditfunction

Callback function to handle column edits.

onColumnMovefunction

Callback function to handle column movement.

modulesArray

The modules to include in the Kanban component.

moduleAttributesobject

Attributes for the modules.

moduleStateobject

The state of the modules.

screenReaderAttributesobject

Attributes for the screen reader text.

screenReaderClassesstring | Array | object

Classes for the screen reader text.

setIsLoadingfunction

Function to set the loading state of the Kanban.

spacingstring | number | Array | object

Spacing for the Kanban component.

titleAttributesobject

Attributes for the title.

titleClassesstring | Array | object

Classes for the title.

updateModuleStatefunction

Function to update the module state.

useAjaxboolean

Whether to use AJAX for data fetching.

refobject

The ref to the Kanban component.

Since
  • 5.8.4
Returns:

The Kanban component.

Type: 
JSX.Element