Skip to content

Uploader

Source page in Figma: Uploader · 40 component sets · 2 standalone components

Index: ../component-registry.md · Workflows: ../workflows.md

NameKeyVariantsProperties
.Layout/UploadFileComponenta79910a059bf0496549a5940e771bb84bf57499d3🔄 Swap upload#25885:0=instance-swap
Size=Medium | Small | Xsmall (default Medium)
.Upload/content/general file upload89c53a13ff54cce5e2db2029707cf8b09ecf655b3Suggestion#12751:0=bool (default True)
🔄 Filled content #12801:1=instance-swap
State=Default | Uploading | Filled (default Default)
Filled=False | True (default False)
Element/Select/Audio12644df35d5d3a67b07d0d4f251698d8988211ef3State=Default | Hover | Focus (default Default)
File Type/Audio4b95a221c944e9d88a580d56608c8cc288ca637e3Size=large | medium | small (default large)
File Type/CSVf4f6ef560a197978cf15563f41af84336a2ddd982Size=medium | small (default medium)
File Type/Document556cc39e5b581ddbb694eb3e35af4830fa29fd263Size=large | medium | small (default large)
File Type/Folder6fc727b5e81fc1beca7885259d5f8a12d4553c1a3Size=large | medium | small (default large)
File Type/Gif8180b47a66e5b8b152d15ce659ba8b887b384e293Size=large | medium | small (default large)
File Type/Image82b02638943b667d61100b1e370fc9082fa5bf8f3Size=large | medium | small (default large)
File Type/PDFa6fdeda4367540ae7ad2f75280e06ebd3827b3e13Size=large | medium | small (default large)
File Type/Presentationb10f38998fba7e56e68d9e5fc14203a7542229c93Size=large | medium | small (default large)
File Type/SRT34b3abfbb42b5aac9f090bea048d225e0896b2692Size=medium | small (default medium)
File Type/SVGc1a1fe47bd15298d039f1dcdd288687f732c8bf12Size=medium | small (default medium)
File Type/Source codebfe7e350643bb06293e15ad4ab729b6af8d870b03Size=large | medium | small (default large)
File Type/Spreadsheet24e60fd1693feb4ab991fdec5d90f7c8d93421123Size=large | medium | small (default large)
File Type/VTT8056aefec3e8bcd378ac8219b41e03ef3fb2ffa12Size=medium | small (default medium)
File Type/Video8037e86383bc19e7fdc38a0874c78fda36ebc7093Size=large | medium | small (default large)
File Type/XLSXf9471dc8091faf77e6c1eec1a919a4bf92161b9d2Size=medium | small (default medium)
File Type/genericf8b7e690a80c9ccab3b2c50a64f6cb41868cbd293Size=large | medium | small (default large)
Preview icon/Audio preview thumbnail3c6143415162d4c9cd54132a39e180d856b2637c8Type button#18181:11=bool (default True)
State=Default | Hover (default Default)
Playing=False | True (default False)
Size=Large | Small (default Large)
Preview icon/Video preview thumbnailfea6524e33f349de404ed2d2843a2989fdfda1c18Type button#18181:11=bool (default True)
State=Default | Hover (default Default)
Playing=False | True (default False)
Size=Large | Small (default Large)
Update/Preview file/Audio file/Large14d90b20e4c85868f9f7f2a287fbcf7c8a38ea403Property 1=Fail to upload | File preview | Uploading (default Uploading)
Upload / Avatar94942b24c4a224360b94e53d07c52a1f38d9f5be4Uploaded=False | True (default False)
State=Default | Hover (default Default)
Upload File Componentac1c978cfbdbe416cbf9f8f966fd588788688a2812State=12 opts (default Default)
Filled=False | True (default False)
Error=False | True (default False)
Upload content/Preview File4b8a5fd8e2333de528ad89c1c103f4908298bae48Date#8171:3=bool (default True)
Action#8171:4=instance-swap
FIle type=7 opts (default .doc)
Error=False | True (default False)
Upload content/Preview File + action718010ad9dc79a2ff163b20831cfbb97994ef3367Date#8171:3=bool (default True)
Action#8171:4=instance-swap
FIle type=.doc | .PDF | .srt | video | .vtt | Audio (default .doc)
Error=False | True (default False)
Upload content/Preview audiofa2bd972a507e9d11ef8c04de050052c9b1bbd844Action#18179:7=instance-swap
Duration#18179:8=bool (default True)
Date#18179:9=bool (default True)
Layout=Simple 2 row | Full + type | Full | Simple 3 row (default Full)
Upload content/Preview video19a5fa7ca11ec11b19c15d6bb187278c7961cf313Action#18179:7=instance-swap
Duration#18179:8=bool (default True)
Date#18179:9=bool (default True)
Layout=Simple 2 row | Full | Simple 3 row (default Full)
Upload content/Upload + Preview image with infof52a556ab967d64c5fd1229ea0a718a2a71f9d8428Date#12405:14=bool (default True)
Actions#21046:0=bool (default True)
Layout=7 opts (default Info input)
State=Disable | Loading | Preview | Error (default Loading)
Upload multiple filesf41f1c857ad30742db92ccc9e00f32ddd54fd41e3State=Default | Uploading | Uploaded (default Default)
Upload multiple files - small1bf99c017c2c5d6556d5b9bbe06bb765793f23823State=Default | Uploading | Uploaded (default Default)
Upload/Item/Action button (Icon)b0f966a685aaf061a7d30daabb93d2282c5b57f24Preview#24227:0=bool (default True)
Replace#24227:11=bool (default True)
Delete#24227:22=bool (default True)
Style=Clean | Secondary (default Clean)
Size=Medium | Small (default Medium)
Upload/Item/Action button (Text)ea81fd2d2a7394e45f22f3820bce712d4dccf78c12Btn number=2 | 1 | 3 (default 3)
Style=White | Secondary (default Secondary)
Size=Medium | Small (default Medium)
Upload/Item/Image preview thumbnail9de9792e08de9af17c1c86e97d306bd691e2a1bf5Image#8935:0=instance-swap
Rato=4:3 - Landscape | 3:4 - Portrait | 16:9 - Landscape | 9:16 - Landscape | 1:1 - Square (default 4:3 - Landscape)
Upload/Item/Image preview thumbnailca479e054d8b2e758df4bfbb6f2532da84a7bcdd27✏️ File name#21630:0=text
Status=Add new | Loading | Success | Error (default Success)
State=Default | Hover | Active (default Default)
File type=Video | Audio | Image (default Image)
Upload/Preview file/Audio file/Small6b05b0f49f743513bc27392e960654ffd653e9ca2Delete button#467:2=bool (default True)
Play=True | False (default False)
UploadFileComponent (old)2d3206d585aab185c6333580c3621e0c964342615State=Normal | Hover | Drag in | Uploading | Uploaded (default Normal)
Size=Default (default Default)
UploadMultipleFile/File type itemfe6f6d53b66fe76c4bb0c813f55c6ac9462ced7924FIle type=.doc | .jpg .png... | .pdf | .mp3 (default .doc)
State=Error | Uploading | Uploaded (default Uploaded)
Editable=Yes | No (default Yes)
UploadMultipleFile/Itemda7fee9b5015970605dd8a3419aab51f752c480e2Instance#12405:15=instance-swap
Type=Editable | Default (default Editable)
UploadMultipleFile/List item editablea00178cb053214b6f438125fe487f39911fe1e795Type=Image editable name | Image | Audio | Doc | PDF (default Image)
NameKey
UploadMultipleFile/List item editable - Inlineb1069b342ecf4ccab4a699deeaaed138122be634
UploadMultipleFile/List item editable - Small item52b232ecca9e6e3cf8bfeb03eb5e5bc6b9b38af0