File Detail Panel
File inspector with a preview, ruled metadata rows, a shareable link chip, version count, and action buttons.
File inspector with a preview, ruled metadata rows, a shareable link chip, version count, and action buttons.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
File Detail Panel is the inspector sidebar for a single file, Hero-Banner-Final.png, shown as a Placeholder aspect-video preview with a ruled metadata section below it. Five label-value rows cover type (PNG image), size (4.6 MB), dimensions (2400 x 900 px), modified date (Jun 9, 2026, 16:22), and version count (7). An owner row pairs the Jordan Lee avatar with their name, and a Shareable link row shows the short link acme.files/s/8h2k-x9p1 in a monospace outline badge. A footer strip holds Download, Share, and a delete icon button.
Metadata is one flat array of label-value pairs with an optional mono flag for numbers; numeric strings get tabular-nums automatically. Putting the shareable link in a badge makes it scannable without breaking the metadata rhythm.
Reach for this block as the slide-over or right panel that opens when a user selects a file, wired to your file metadata endpoint and your share-link generator. Gate the delete button on the caller's write permission.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the file inspector panel. Other inspector shapes:
Tip: 7 versions is a signal worth surfacing, users who want to revert need to know history exists before they ask support.