The document uploader is a UI-only field component for uploading files.
It provides an input group combined with a List Item showing document info and should be used with the modal component for confirming delete DocumentUploader.Modal.
To tie the logic together there is a hook `use-document-upload` designed to provide the custom logic to control these components.
The document uploader is used to upload files from your computer or device by clicking the button to open the system’s file browser.
It should be used to allow users to provide required documentation.
The document uploader is made of:
Please refer to Specs for examples
Please refer to Behaviour for examples
Please refer to the prototype for examples within a form
Use the appropriate ARIA attributes for screen readers where applicable.
import { DocumentUploader } from '@shieldpay/bumblebee/document-uploader'; <DocumentUploader name="someInput1" value={filename} fileId={fileIdFromExternalService} deleteDocumentText="Delete document" helpText="JPGs etc" uploadingText="Uploading" onChange={convertAndUploadFunction} onClear={onClear} validation={externalValidation} validating={false} />; <DocumentUploader.Modal handleClearCancel={handleCloseModalWithoutChanges} handleClearConfirm={handleCloseModalAndDelete} showModal title={<>R U sure you want to delete?</>} cancelText={<>Oh no!</>} closeText={<>Not now!</>} confirmText={<>Damn right!</>} />;