Core Features | React Kanban Documentation

📄️ Cards

Learn how to define card data, control section visibility, customize card appearance, and manage cards through actions.

📄️ Columns

Learn how to define board columns, control layout and scroll behavior, group cards by different fields, set card limits, and style columns dynamically.

📄️ Filtering

Filter kanban cards with predicates, stack independent filters by tag, and wire up external filter widgets.

📄️ Sorting

Learn how to sort cards on the Kanban board by field, direction, or custom logic

📄️ Editing

Learn how to configure the card editor, customize fields, control save behavior, and integrate comments and checklists into Kanban cards.

Kanban draws its colors, shadows, and typography from CSS custom properties injected by a theme wrapper component. The widget never hardcodes visual values - it reads var(--wx-kanban-) tokens (and a handful of shared --wx- tokens) from the nearest ancestor that sets them. To restyle the board, override those variables on a wrapper element; to restyle individual cards or columns at runtime, use the cardCss and columnCss callback props.

📄️ Localization

The Kanban widget ships with English labels by default - editor field names, priority options, toolbar and context-menu text, and ARIA labels. To display the widget in another language, wrap it in a Locale component and pass a merged dictionary that covers both the kanban-specific keys and the shared core keys (calendar names, button labels, date formats).