Extend UI Svelte

Docs / Files / File Upload

File Upload

Drop zone and file input. Dark mode is controlled by the parent through isDark; the toggle below lives outside the component, which renders no theme control of its own.

Click to upload or drop files
PDF, DOC/DOCX, XLSX, CSV, PNG, or JPG
Browse files

Differences from upstream

  • Exported as FileUpload, like upstream. className and class are both accepted.
  • Also exports helpers and types that upstream keeps private to the file: DEFAULT_ACCEPT, DEFAULT_ACCEPTED_FILE_TYPES, formatBytes, matchesAccept, toUploadItems, FileUploadItem, and AcceptedFileType.
  • The animated border beam is a pure-CSS conic gradient instead of the BorderBeam component; showBorderBeam is kept. borderBeamTheme is replaced by the shared isDark flag.
  • acceptedFileTypes entries take a text glyph instead of an icon component.
  • Accepts isDark and onIsDarkChange; it reflects isDark (passing it to each row's FileThumbnail) and never calls onIsDarkChange.

Back to all components