New to KendoReact? Start a free 30-day trial

SortableProps

Interface

Represents the props of the KendoReact Sortable component.

Definition

Package:@progress/kendo-react-sortable

Properties

animation?

boolean

Enables or disables the reorder animation of the Sortable items. defaults to true.

Default:

true

className?

string

Defines the CSS class which is applied to the Sortable element.

data

object[]

(Required) The data items of the Sortable.

disabledField?

string

The field which enables or disables an item.

emptyItemUI?

ComponentType<SortableEmptyItemUIProps>

The component that is rendered when no data is available.

idField

string

(Required) The field which uniquely identifies the Sortable items.

itemUI

ComponentType<SortableItemUIProps>

(Required) The Sortable items UI.

navigatable?

boolean

If set to true, the user can use dedicated shortcuts to interact with the Sortable. By default, navigation is disabled.

boolean

Enables or disables the keyboard navigation. Defaults to true.

Default:

true

onDragEnd?

(event: SortableOnDragEndEvent) => void

Fires when the user stops dragging an item.

Parameters:eventSortableOnDragEndEvent

onDragOver?

(event: SortableOnDragOverEvent) => void

Fires when the user is dragging an item over another Sortable item.

Parameters:eventSortableOnDragOverEvent

onDragStart?

(event: SortableOnDragStartEvent) => void

Fires when the user starts dragging an item. This event is preventable.

Parameters:eventSortableOnDragStartEvent

onNavigate?

(event: SortableOnNavigateEvent) => void

Fires when the user navigates within the Sortable by using the keyboard.

Parameters:eventSortableOnNavigateEvent

style?

CSSProperties

Defines the CSS styles which are applied to the Sortable element.

tabIndex?

number

Specifies the tab index of the Sortable items.

webMcp?

boolean | WebMcpProps

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