Lewati ke konten

File Upload - React

File Upload

banner-background

Impor

Section titled “Impor”
import { FileUpload } from '@idds/react';

Contoh Penggunaan

Section titled “Contoh Penggunaan”

Contoh 1 - Multiple Files

Section titled “Contoh 1 - Multiple Files”
Upload Multiple Files
Unggah File
Unggah atau seret dan lepas ke dalam kotak ini.

Contoh 2 - Max Size

Section titled “Contoh 2 - Max Size”
Upload File (Max 5MB)
Unggah File
Unggah atau seret dan lepas ke dalam kotak ini.

Contoh 3 - PDF Only

Section titled “Contoh 3 - PDF Only”
Upload PDF
Unggah File
Unggah atau seret dan lepas ke dalam kotak ini.

Contoh 4 - Single File Upload Basic

Section titled “Contoh 4 - Single File Upload Basic”
Unggah File
Unggah atau seret dan lepas ke sini

Contoh 5 - Single File Upload Disabled

Section titled “Contoh 5 - Single File Upload Disabled”
Unggah File
Unggah atau seret dan lepas ke sini

Props

Section titled “Props”
NameTypeDefaultRequiredDescription
label?ReactNode—NoLabel untuk file upload.
allowedExtensions?string[]—NoEkstensi file yang diizinkan (e.g., ['png', 'jpg', 'pdf']).
maxFiles?number—NoMaksimal jumlah file yang bisa diupload (hanya untuk multiple=true).
maxTotalSizeMB?number—NoMaksimal ukuran total semua file dalam MB (hanya untuk multiple=true).
validateMagicNumber?booleantrueNoValidasi magic number (file signature) untuk keamanan.
title?string'Unggah File'NoTitle di dalam dropzone.
description?string'Unggah atau seret dan lepas ke dalam kotak ini.'NoDescription di dalam dropzone.
type?string''NoTipe file yang diizinkan (MIME types, e.g., "image/*,application/pdf").
multiple?booleanfalseNoApakah bisa upload multiple files.
maxSize?number0NoUkuran maksimum file dalam bytes (0 = unlimited).
disabled?booleanfalseNoApakah disabled.
className?string''NoClassName tambahan.
onChange?(files: File[], errors: FileValidationResult[]) => void—NoCallback ketika file berubah.
onRemove?(file: File, index: number) => void—NoCallback ketika file dihapus.