Founding price: $35, then $79.99 after 23:59 UTC on 4 November, then $79.99
Get ProFile chips and image tiles for chat inputs and messages, with file type detection, sizes, upload progress, retry, remove and open actions.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
| Prop | Type | Default | Description |
|---|---|---|---|
name | string | - | File name, including its extension. |
size | number | - | Size in bytes. |
type | string | - | MIME type, such as image/png. Improves the icon and image detection. |
previewUrl | string | - | Image URL shown as the thumbnail for images. |
status | "ready" | "uploading" | "error" | "ready" | Upload state. |
progress | number | - | Upload progress from 0 to 100. Leave out for an indeterminate bar. |
error | string | "Upload failed" | Message shown in the error state. |
variant | "chip" | "tile" | "chip" | chip is a compact row, tile is a square preview. |
onRemove | () => void | - | Adds a remove button labelled Remove <name>. |
onRetry | () => void | - | Adds a retry button in the error state. |
onOpen | () => void | - | Makes the attachment a button, for example to open a viewer. |
Also accepts <div> props except onClick and children.
| Prop | Type | Default | Description |
|---|---|---|---|
label | string | "Attachments" | Accessible name of the list. |
Also accepts all <div> props.
ChatAttachment must be a direct child of ChatAttachmentList with a stable key so removal animates.formatFileSize(bytes) and attachmentKind(name, type?).