File Upload

zyra-file-upload

Click-to-browse and drag-and-drop file picker with type/size/count validation and a removable file list.

Click to upload or drag and drop

API

All inputs and configuration options for zyra-file-upload.

PropTypeDefaultDescription
multiplebooleanfalseAllows selecting/accumulating more than one file
acceptstring''Comma-separated extensions/MIME patterns, e.g. ".pdf,image/*"
maxSizeMbnumber | nullnullRejects files larger than this size
maxFilesnumber | nullnullRejects files beyond this count
filesChange (output)File[]-Emits the current accepted file list whenever it changes
rejected (output){ file: File; reason: 'size' | 'type' | 'count' }[]-Emits files that failed validation, with the reason for each

Accessibility

Built to meet WCAG 2.0 AA. These notes cover the key ARIA, keyboard, and interaction behaviours.

  • Dropzone is a role="button" with tabindex="0" — Enter/Space opens the file picker
  • Each file in the list has a labeled, keyboard-accessible remove button