Vuance UI Kit

Form input

File upload

Picker and dropzone parity, concurrency, progress, cancel, and retry without backend assumptions.
Drop files here or choose files

No files selected

Playground

Configure the component and copy synchronized Vue code.

Interactive preview

Changes are reflected in the example and source.

Drop files here or choose files

No files selected

Properties

Multiple

Max files

Empty slot

Vue

<m-file-upload v-model="files" accept="image/*" :max-files="3" multiple>
</m-file-upload>

Token map

The manual manifest combines inherited token owners with local deltas.

MFileUpload · All5 tokens
md-file-upload

MFileUpload API

Props, slots, and events are generated from the current public kit contract.

MFileUpload

Workflow family
src/runtime/components/ui/file-upload

Props

NameTypeDefault
disabledPrevents interaction and applies the disabled visual state.
booleanfalse
loadingReplaces content with progress feedback and prevents interaction.
booleanfalse
readonly
booleanfalse
accept
stringundefined
multiple
booleantrue
maxFiles
numberundefined
maxSize
numberundefined
upload
(file: File, context: FileUploadTaskContext) => Promise<unknown>undefined
autoStart
booleanfalse
concurrency
number3

Slots

Events

@addFile[]
@rejectFileRejection
@startFileUploadEntry<TResult>
@progressFileUploadEntry<TResult>
@successFileUploadEntry<TResult>
@errorFileUploadEntry<TResult>
@cancelFileUploadEntry<TResult>
@removeFile
@completevoid