Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA file explorer beside a details panel that updates with the selected file. Use this when people browse to inspect files and need name, type, size and date without opening them.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it for asset libraries, backups, exports and repositories where people inspect before opening.
Do not use it on narrow screens as is: the panel stacks under the tree, so put the details in a drawer if the tree is long.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
nodes | TreeNode<FileMeta>[] | - | Files with data: { bytes, modified, kind }. |
defaultExpanded | string[] | [] | Folders open at the start. |
defaultSelected | string | - | Row selected at the start. |
aria-label | string | "Files" | Names the tree. |
aria-controls; the panel is a region named by the selected file.The pattern ships with a Testing Library test (file-preview-explorer.test.tsx) that covers the empty state, the details of a file and a folder, and keyboard selection.