TreeView
A tree sidebar for navigating directory structures. Folders are loaded lazily on expand and the active path is highlighted automatically.
Usage
API
Props
| Prop | Type | Default | Description |
|---|
| listFiles | Function | - | Async function (path) => Promise<Array> that returns directory entries. The component filters for isDirectory items only. |
| activePath | String | "/" | Currently active directory path. The matching node is highlighted and ancestor nodes auto-expand. |
| fallbackIcon | String | "" | Fallback icon URL for folders |
| rootLabel | String | "/" | Label for the root tree node |
| expandRoot | Boolean | true | Automatically expand the root node on mount |
Events
| Event | Payload | Description |
|---|
| navigate | { path: String } | Emitted when a folder node is clicked. Use this to update your main view or router. |
listFiles Entry Properties
| Property | Type | Required | Description |
|---|
| name / fileName | String | Yes | Display name of the entry |
| isDirectory | Boolean | Yes | Whether the entry is a directory (only directories are shown) |
| icon | String | No | Icon URL for the entry |
ankow