File upload dropzone and entry list for LiveView uploads.
Summary
Functions
Renders a dropzone and the list of upload entries for a LiveView upload.
Functions
Renders a dropzone and the list of upload entries for a LiveView upload.
# in mount/3
allow_upload(socket, :attachments, accept: ~w(.png .jpg .pdf), max_entries: 5, auto_upload: true)
# in the template, inside a form with phx-change and phx-submit
<.upload upload={@uploads.attachments} label="Attachments" hint="PNG, JPG or PDF up to 8 MB" on_cancel="cancel-upload" />
# in the LiveView
def handle_event("cancel-upload", %{"ref" => ref}, socket), do: {:noreply, cancel_upload(socket, :attachments, ref)}Drag and drop, click-to-browse, keyboard access (the file input is focusable
and labelled), progress, image previews, per-entry and upload-level errors
are all handled. Errors are translated with SlopUI.translate_upload_error/1.
Attributes
upload(Phoenix.LiveView.UploadConfig) (required)label(:string) - Defaults tonil.description(:string) - Defaults tonil.hint(:string) - shown inside the dropzone, e.g. accepted types and size. Defaults tonil.on_cancel(:string) - event name pushed with phx-value-ref to cancel an entry. Defaults tonil.compact(:boolean) - single-row dropzone. Defaults tofalse.class(:any) - Defaults tonil.- Global attributes are accepted.