Installation
npx magicui-cli add file-tree
Props
Tree
Prop | Type | Default | Description |
---|---|---|---|
initialSelectedId | string | - | The ID of the initially selected item. |
indicator | boolean | true | Whether to show the tree indicator line. |
elements | TreeViewElement[] | - | An array of tree view elements to render. |
initialExpandedItems | string[] | - | An array of IDs for items that should be initially expanded. |
openIcon | React.ReactNode | - | Custom icon for open folders. |
closeIcon | React.ReactNode | - | Custom icon for closed folders. |
dir | "rtl" | "ltr" | "ltr" | The text direction of the tree. |
Folder
Prop | Type | Default | Description |
---|---|---|---|
element | string | - | The name of the folder. |
value | string | - | The unique identifier for the folder. |
isSelectable | boolean | true | Whether the folder can be selected. |
isSelect | boolean | - | Whether the folder is currently selected. |
File
Prop | Type | Default | Description |
---|---|---|---|
value | string | - | The unique identifier for the file. |
isSelectable | boolean | true | Whether the file can be selected. |
isSelect | boolean | - | Whether the file is currently selected. |
fileIcon | React.ReactNode | - | Custom icon for the file. |
CollapseButton
Prop | Type | Default | Description |
---|---|---|---|
elements | TreeViewElement[] | - | An array of tree view elements to control. |
expandAll | boolean | false | Whether to expand all elements initially. |