File Tree
Display a list of files and folders in a hierarchical tree structure.
Default
Code Editor
<Container style={{ marginLeft: 'var(--geist-gap)' }}><Tree><Folder name='components'><Folder name='typography'><File name='paragraph.js'/><File name='code.js'/><File name='heading.js'/></Folder><File name='button.js'/><File name='avatar.js'/></Folder><Folder name='pages'><File name='dashboard.js'/><File name='about.js'/><File name='index.js'/></Folder><File name='README.md'/><File name='.gitignore'/></Tree></Container>
Open
Code Editor
<Container style={{ marginLeft: "var(--geist-gap)" }}><Tree><Folder name="pages" open><File name="dashboard.js" /><File name="about.js" /><File name="index.js" /></Folder><File name="README.md" /><File name=".gitignore" /></Tree></Container>