Claude MarketplacesSubmit
syncfusion avatar

Syncfusion React Kanban

syncfusion/react-ui-components-skills

If you're building project boards or workflow visualizers in React, this gives you Syncfusion's full-featured Kanban component. You get drag and drop between columns, swimlane grouping, WIP limits, and flexible data binding to REST APIs or static arrays. The documentation splits things sensibly: core structure, swimlanes, drag behavior, templates for custom card layouts, and programmatic methods for adding or moving cards from code. It's a commercial component (requires a Syncfusion license), but the skill covers the entire API surface including dialog editing, event handling, and theme customization. Useful if you need more than a basic board and don't want to build all the interaction logic yourself.

skills.sh installs
741
GitHub stars
3
last updated
Aug 21, 2026
View on GitHub

Install

$ npx -y skills add syncfusion/react-ui-components-skills --skill syncfusion-react-kanban --agent claude-code

Installs into .claude/skills of the current project.

Files

Implementing Syncfusion React Kanban

A comprehensive skill for working with Syncfusion's React Kanban component to build flexible task management boards with cards, columns, swimlanes, and drag-and-drop interactions.

When to Use This Skill

Use this skill when you need to:

  • Install and set up the Kanban component with Syncfusion
  • Create a basic Kanban board with columns and cards
  • Organize cards in swimlanes (group by category/assignee)
  • Implement drag-and-drop functionality between columns and swimlanes
  • Configure card displays with headers, content, templates, and tags
  • Bind data from arrays or APIs (DataManager, OData, REST)
  • Handle user interactions (card selection, drag events, double-click to edit)
  • Add dialogs for card creation and editing
  • Customize appearance with themes, CSS, and responsive design
  • Validate card counts with WIP (work-in-progress) min/max limits
  • Configure sorting, filtering, and search functionality
  • Apply custom tooltips, templates, and styling
  • Implement virtual scrolling for large datasets
  • Save board state and configuration

Component Overview

SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Details

Repository
github.com/syncfusion/react-ui-components-skills
Categories
Frontend Development, Backend & APIs, Data Science & ML, Productivity & Planning, Automation & Workflows
First seen
Jun 3, 2026

More from syncfusion/react-ui-components-skills

All 59

Recommended

More Frontend Development
1syncfusion avatarsyncfusion-react-ai-assistviewsyncfusion/react-ui-components-skillsImplement the Syncfusion React AI AssistView component. Use this skill to handle AI-powered conversational interfaces, AssistView setup, conversation flow, spee737skills.sh installs
2syncfusion avatarsyncfusion-react-barcodesyncfusion/react-ui-components-skillsGenerate, customize, and export barcodes in React using Syncfusion BarcodeGenerator. Trigger for requests involving Code39 or Code128 barcodes, QR codes, Data M736skills.sh installs
3syncfusion avatarsyncfusion-react-mapssyncfusion/react-ui-components-skillsImplement Syncfusion React Maps component for geographical data visualization. Use this when displaying interactive maps, location-based information, or regiona733skills.sh installs
4syncfusion avatarsyncfusion-react-speech-to-textsyncfusion/react-ui-components-skillsImplement the Syncfusion React SpeechToText component. Use this skill to convert speech to text, manage microphone input, control listening states, process spee730skills.sh installs
5syncfusion avatarsyncfusion-react-treeviewsyncfusion/react-ui-components-skillsImplement Syncfusion React TreeView component for hierarchical data display with node selection, drag-drop reordering, inline editing, and custom templating. Us730skills.sh installs
6syncfusion avatarsyncfusion-react-dropdown-treesyncfusion/react-ui-components-skillsImplement Syncfusion React Dropdown Tree component for hierarchical data selection with dropdown interaction. Use this when working with multi-select checkboxes728skills.sh installs