shadow
The FileUpload component provides a universal file upload function for web applications. It supports customizable attributes such as allowed file types, part size or also maximum file size, along with drag-and-drop methods and traditional file selection.
The sample represents the basic flow of uploading files without additional modifications. This is a good start for understanding both the structure and the behavior of the component.
The preview replaces the thumbnail with an icon, which is especially useful for file types that don't have a meaningful preview image.
Use wje-file-upload when the user enters a value, selects options, or performs an action on a form.
Don't just use it as a visual decorative element without interaction. In this case, give priority to the presentation components.
Always link the component to the description (label/aria-label), keep keyboard control, and display a clear message on validation errors.
- Keep validation rules and error states consistent across the entire form.
- For asynchronous operations, display the load status or disabled status.
- For complex forms, prefer smaller sections and immediate feedback.
| Popis | Nastavuje textovú hodnotu uloženú vo voľbe accepted-types. |
| Atribút | accepted-types |
| Typ | string |
| Predvolené | - |
| Popis | Určuje, či je voľba auto-process-files zapnutá a ovplyvňuje správanie komponentu. |
| Atribút | auto-process-files |
| Typ | boolean |
| Predvolené | true |
| Popis | Nastavuje rozmery alebo veľkosť pre voľbu chunk-size. |
| Atribút | chunk-size |
| Typ | number |
| Predvolené | - |
| Popis | Nastavuje zobrazený alebo prístupný textový štítok. |
| Atribút | label |
| Typ | string |
| Predvolené | - |
| Popis | Nastavuje rozmery alebo veľkosť pre voľbu max-file-size. |
| Atribút | max-file-size |
| Typ | number |
| Predvolené | - |
| Popis | Nastavuje číselnú hodnotu používanú vo voľbe max-files. |
| Atribút | max-files |
| Typ | number |
| Predvolené | 10 |
| Popis | Určuje, či je voľba no-upload-button zapnutá a ovplyvňuje správanie komponentu. |
| Atribút | no-upload-button |
| Typ | boolean |
| Predvolené | false |
| Popis | Určuje, či je voľba to-chunk zapnutá a ovplyvňuje správanie komponentu. |
| Atribút | to-chunk |
| Typ | boolean |
| Predvolené | false |
| Popis | Nastavuje odkaz na zdroj pre voľbu upload-url. |
| Atribút | upload-url |
| Typ | string |
| Predvolené | /upload |
| Názov | Popis |
|---|
wje-file-upload:file-removed | Vyvolá sa pri odoslaní udalosti wje-file-upload:file-removed. |
wje-file-upload:files-selected | Vyvolá sa pri zmene výberu. |
wje-file-upload:error | Vyvolá sa pri chybovom stave komponentu. |
wje-file-upload:files-added | Vyvolá sa pri odoslaní udalosti wje-file-upload:files-added. |
wje-file-upload:files-uploaded | Vyvolá sa pri odoslaní udalosti wje-file-upload:files-uploaded. |
wje-file-upload:started | Vyvolá sa pri odoslaní udalosti wje-file-upload:started. |
wje-file-upload:file-uploaded | Vyvolá sa pri odoslaní udalosti wje-file-upload:file-uploaded. |
| Popis | Pridá files to queue do spravovanej kolekcie komponentu. |
| Signatúra | (files: any) => void |
| Popis | Spustí metódu uploadFiles na vykonanie logiky komponentu a aktualizáciu jeho stavu. |
| Signatúra | () => void |
| Popis | Vytvorí preview a pripojí ho do štruktúry komponentu. |
| Signatúra | (file: File, reader: FileReader) => HTMLElement |
| Popis | Vytvorí thumbnail a pripojí ho do štruktúry komponentu. |
| Signatúra | (file: File, reader: FileReader) => HTMLElement |
| Popis | Spustí metódu assertFilesValid na vykonanie logiky komponentu a aktualizáciu jeho stavu. |
| Signatúra | (file: File) => void |
| Popis | Obnoví form state na počiatočné hodnoty. |
| Signatúra | () => void |
| Názov | Popis |
|---|
native | Štýluje koreňovú shadow časť komponentu. |
file-list | Štýluje shadow časť file-list. |
upload-button | Štýluje shadow časť upload-button. |
Pre tento komponent nie sú dostupné žiadne vlastné CSS vlastnosti.
| Názov | Popis |
|---|
default | Predvolený slot pre hlavný obsah komponentu. |