File Output
Card for a file an assistant produced: generating (spinner or progress), ready (download) or failed.
// Plain markup
import { FileOutput } from "@shavin/ui";Ready
q3-summary.xlsx
1.8 MB
Component Source
<FileOutput name="q3-summary.xlsx" kind="spreadsheet" meta="1.8 MB" onDownload={() => {}} />Generating
q3-summary.xlsx
Generating…
churn-report.pdf
Component Source
<Flex direction="column" gap="3">
<FileOutput name="q3-summary.xlsx" kind="spreadsheet" status="generating" />
<FileOutput name="churn-report.pdf" kind="document" status="generating" progress={60} />
</Flex>Error
export.zip
The export timed out.
Component Source
<FileOutput name="export.zip" kind="archive" status="error" error="The export timed out." />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| name* | string | — | File name with extension. |
| kind | FileOutputKind | file | Icon family. Default "file". |
| status | FileOutputStatus | ready | generating: spinner or progress, ready: download, error. Default "ready". |
| meta | string | — | Size or detail text, e.g. "1.8 MB". |
| progress | number | — | 0-100. Shows a determinate bar while generating. |
| href | string | — | Download URL. Renders the action as a link. |
| onDownload | () => void | — | Download handler when there is no href. |
| error | string | — | Message shown when status="error". |
| actionLabel | string | Download | Label for the action. Default "Download". |
* required