HyFileUpload

A file upload component with drag-and-drop support, client-side validation, image previews, and full keyboard + screen reader accessibility.

The component does NOT ship a network layer. Consumers wire their own upload transport via the add / change / remove events and the setProgress() / setError() public methods.

Examples

Basic

<hy-file-upload label="Upload" accept="image/*" multiple></hy-file-upload>

With validation

<hy-file-upload
  label="Documents"
  accept=".pdf,.doc,.docx"
  max-size="5242880"
  max-files="5"
  multiple
></hy-file-upload>

Events

• change - Accepted files changed. Detail:
• input - Files were picked/dropped, before validation. Detail:
• add - A file passed validation. Detail:
• remove - A file was removed from the list. Detail:
• reject - A file was rejected by validation. Detail:

Slots

• default - Default slot (bare mode only): content wrapped as the drag-drop target.
• placeholder - Replaces the default drop-zone empty state.
• helper-text - Helper text rendered below the drop zone.
• error-text - Error text (overrides helperText when present).

Methods

open()

Programmatically opens the native file picker.

clear()

Removes all files.

removeFile()

Removes a specific file from the list.

setProgress()

Updates per-file progress (0–100). Consumers call this from their upload transport.

setError()

Marks a file row with an error message.

clearError()

Clears a previously-set error on a specific file.