File Tree
A composable file tree with search, nested folders, and keyboard focus styles built on top of Radix Accordion.
Use it to render project structures, navigation sidebars, or any hierarchical data where folders and files need to be browsed and filtered.
Install using the shadcn CLI to add the file tree component to your application.
Preview
Search for a file or folder to auto-expand matching branches. Click folders to toggle them and select a file to highlight it.
Props
file-treeProps
- defaultExpanded
- Optional array of folder ids that should start expanded.
- defaultSelected
- Optional id or label of the file that should start selected.
- className
- Optional class name applied to the outer tree container.