File Tree

Show a file tree with expandable folders

On This Page

API
name
defaultOpen (optional)
name


<FileTree>
    <FileTree.Folder name="pages" defaultOpen>
        <FileTree.Folder name="fruits" defaultOpen>
            <FileTree.File name="_meta.json" />
            <FileTree.File name="apple.mdx" />
            <FileTree.File name="banana.mdx" />
        </FileTree.Folder>
        <FileTree.File name="_meta.json" />
        <FileTree.File name="about.mdx" />
        <FileTree.File name="contact.mdx" />
        <FileTree.File name="index.mdx" />
    </FileTree.Folder>
</FileTree>

API
Permalink for this section

The FileTree component takes the following props:

none

The FileTree.Folder component takes the following props:

`name`
Permalink for this section

The name of the folder

Type: string
Required: true

`defaultOpen` (optional)
Permalink for this section

Whether the folder should be open by default

Type: boolean
Default: false

The FileTree.File component takes the following props:

`name`
Permalink for this section

The name of the file

Type: string
Required: true

Question? Give us feedback →Edit this page on GitHub →