x
1
2
3
4
5
6
7
8
<div class="flex flex-col gap-2 w-full"> <label for="ui-file-field-29f0e4f0" class="text-sm font-medium">Avatar</label> <label for="ui-file-field-29f0e4f0" class="relative flex cursor-pointer flex-col items-center gap-2 rounded-lg border-2 border-dashed p-6 text-center transition-colors border-input hover:bg-accent/50 data-[drag=true]:border-primary data-[drag=true]:bg-primary/5" data-controller="ui--file-field" data-ui--file-field-target="dropzone" data-action="dragover->ui--file-field#dragOver dragleave->ui--file-field#dragLeave drop->ui--file-field#drop"><i data-lucide="upload" class="inline-block shrink-0 w-6 h-6 text-muted-foreground" aria-hidden="true"></i> <p class="text-sm text-muted-foreground"><span class="font-medium text-primary">Click to upload</span> or drag and drop</p> <p class="text-xs text-muted-foreground empty:hidden" data-ui--file-field-target="filenames"></p> <input id="ui-file-field-29f0e4f0" type="file" class="sr-only" data-ui--file-field-target="input" data-action="change->ui--file-field#updateNames" aria-describedby="ui-file-field-29f0e4f0-hint"></label> <p id="ui-file-field-29f0e4f0-hint" class="text-xs text-muted-foreground">PNG or JPG, up to 5MB</p></div>1
render(UI::FileField.new(label: label, hint: hint, multiple: multiple, disabled: disabled))No notes provided.
| Param | Description | Input |
|---|---|---|
|
— |
|
|
|
— |
|
|
|
— |
|
|
|
— |
|