DocumentCard
Markdown for agentsDocument row with file metadata, access status and an optional download action.
npx @slipstream-ui/cli@latest add document-cardDeal room documents
PDFAvailable
Q3-financials.pdf
PDF · 2.4 MB · Nov 1, 2026
PDFRestricted
CIM-draft.pdf
PDF · 8.1 MB
XLSXPending
Buyer-list.xlsx
XLSX · 640 KB
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| name | string | required | File name. |
| fileType | string | required | Short file type label, such as PDF or XLSX. |
| size | string | — | Human-readable file size. |
| updatedAt | string | — | Updated date or relative time. |
| status | 'available' | 'restricted' | 'pending' | 'available' | Access state. |
| onDownload | () => void | — | Download handler; omit for a display-only row. |
| downloadLabel | string | 'Download' | Download button label. |
| icon | ReactNode | — | Custom file icon slot. |
Accessibility
- The download button is named Download <file name>.
- Status is a text badge; restricted downloads are disabled.
Browser support
| Browser | Tested versions |
|---|---|
| Chrome | 111+ (Mar 2023) |
| Edge | 111+ (Mar 2023) |
| Firefox | 121+ (Dec 2023) |
| Safari | 17.2+ — macOS & iOS (Dec 2023) |
Slipstream components rely only on CSS custom properties, Flexbox/Grid, and ARIA — the everyday baseline of the last two years of evergreen releases. Anything newer is progressive enhancement: unsupported browsers keep full functionality with static behavior instead of animations.