Try it
Check, uncheck and expand nodes, or focus the tree and use the arrow keys.
[]Features
Tri-state selection
Checking a parent checks its children, and parents show checked, unchecked or indeterminate based on what is selected beneath them. Turn it off for independent selection.
Accessible by default
Follows the WAI-ARIA tree view pattern: a single tab stop, arrow key navigation, Space to select, and screen reader support for expanded and mixed states.
Works with your data
Pass your own tree-shaped objects and tell TreeSelect which properties hold the ID, label, children and checked state. Fully typed with TypeScript generics.
Customize every part
Style it with class names, which always override the defaults, or replace the node, label, checkbox or expand icon with your own React components.
Fast with large trees
Selection updates only copy the changed branch, and unchanged nodes skip re-rendering, so trees with tens of thousands of nodes stay responsive.
Small footprint
About 17 KB of JavaScript and 3 KB of CSS, with no global style resets. Supports React 18 and 19, and server-side rendering.