With Files and Folders

File manager populated with a mix of folders and file types.

HomeDocuments
Projects
Documents
notes.txt
photo.png
app.flin
readme.md

Project Files

File manager showing a typical project directory structure.

HomeDocuments
app
components
entities
layouts
index.flin
config.toml

Empty State

File manager showing an empty folder with a helpful message.

HomeDocuments

This folder is empty

Usage

<FileManager> <div><Icon name="folder" size="28" color="#c9952c" /><span>Projects</span></div> <div><Icon name="file-text" size="28" color="#17a2b8" /><span>notes.txt</span></div> <div><Icon name="file-code" size="28" color="#6f42c1" /><span>app.flin</span></div></FileManager>

Props

PropTypeDefaultDescription
childrencontent-File and folder items displayed in the grid