Upload
The Upload element allows users to add one or more files. This component includes file validation, icon labels, and a document list preview. Use this element to collect medical summaries, reports, or attachments.
Properties
| Property | Value | Description |
|---|---|---|
| Type | Upload | UI component type |
| Group | Field | Belongs to the "Field" group in UI catalog |
| Identifier | 53 | Unique element ID |
| Preview | ✓ | See image preview above |
| Value | Y | Accepts one or more uploaded files |
| Mandatory | Y | Required to proceed in specific workflows |
| Error | Y | Displays validation error for unsupported files |
| Min | No minimum file constraint | |
| Max | Files | Accepts multiple files; capped by internal limits |
| Read-only | Y | Can display uploaded files in read-only state |
| Text, Icon | Y | Displays file icon and optional label |
| Children | No nested children | |
| List | Not a container for repeatable entries | |
| Event | Y | Triggers on file select, delete, or update |
| Shade | Y | Uses shaded background to separate upload area |
Usage Example
<UploadField
label="Upload summary document"
acceptedFileTypes={[".pdf", ".docx"]}
required
onChange={handleFileUpload}
/>
SDK Integration
The Visit Took Place (VTP) summary popup uses this element. It connects to the SDK method:
Method: /profile/appointments/{id}/summary/summaries
Use this method to upload, update, or remove post-visit medical documents.
Example UI Placement
| Level | ID | Type | Value | Description |
|---|---|---|---|---|
1 | discount-upload | Upload | Document upload | Uploads medical documents |
Notes
- Displays all uploaded files in a vertical list with name and timestamp.
- Accepts multiple formats: PDF, DOCX, JPG, PNG.
- Triggers file select dialog and handles upload events.
- Commonly used in visit documentation flows.