>skeehn

file-attachment

File upload pill with progress and remove for chat input

AIfile-attachment.cssfile-attachment.htmlfile-attachment.js

Installation

$npx skeehn add file-attachment

Preview

report.pdf2.4 MB
data.csv800 KB
image.png1.1 MB

Props

PropTypeDefaultDescription
namestringFile name displayed
sizestringHuman-readable file size
state'uploading' | 'done' | 'error''done'Upload state
progressnumberUpload progress (0-100)
onRemove() => voidRemove callback

Usage

file-attachment.tsx
1import { FileAttachment, FileAttachments } from '@skeehn/react';23export function Attachments() {4  return (5    <FileAttachments>6      <FileAttachment name="report.pdf" size="2.4 MB" state="done" />7      <FileAttachment name="data.csv" size="800 KB" state="uploading" progress={65} />8    </FileAttachments>9  );10}