FileCard

Pass name and byte to show a file with its size, under an icon that follows the extension, like a PDF, a spreadsheet or an archive.

Give an image file a src to show the picture itself, which opens a full-size preview on click.

Set type to file to show an image as a file card with its name and size instead of the picture.

Set loading while an image uploads to show a placeholder with its progress, then the picture once it is ready.

Set size to small for a shorter card that fits beside a chat message.

Pass description text, or a function that receives the formatted size, to replace the line under the name.

Pass icon a preset name like pdf to pick the file glyph yourself, or any node to draw your own.

Pass mask, a node or a function of the file, to cover the card on hover with actions like preview and download.

Use FileCard.List to lay out several files in a row, and set removable with onRemove to let people take one out.

Set overflow to scrollX to keep a long list on one row, with arrows to scroll through it.

File cards whose description function puts the size beside a download button that works without opening the file.

A chat where the user sends two spreadsheets and the assistant answers with a summary and a report to open.

A project card listing the documents and images its members shared, each with its size and who uploaded it.

An image assistant that answers a prompt with four generated pictures, plus buttons to regenerate or download them.