Edit
Edit fields allow users to enter or modify text-based input. These fields support validation, character limits, and event tracking. Use Edit elements for notes, labels, or free-text fields where precise content entry is required.
Properties
| Property | Value | Description |
|---|---|---|
| Type | Edit | UI component type |
| Group | Field | Belongs to the "Field" group in UI catalog |
| Identifier | 12 | Unique element ID |
| Preview | ✓ | See image preview above |
| Value | Y | Accepts typed input |
| Mandatory | Y | Required in relevant contexts |
| Error | Y | Supports inline validation and error messages |
| Min | No minimum constraint defined | |
| Max | Chars | Supports maximum character length |
| Read-only | Y | Can appear in non-editable mode |
| Text, Icon | Y | Supports label text or icon prefix |
| Event | Y | Triggers on change or blur |
| Shade | Y | Includes visual background styling |
| Children | No nested fields | |
| List | Not a list container |
Usage Example
<Input type="text" label="Charge for" placeholder="Enter service name" maxLength={100} required />
SDK Integration
The Charge Summary screen uses this element. It connects to the SDK method:
Method: /profile/appointments/{id}/summary/charge
Enables entry and update of financial charges for a completed appointment. Fields include editable notes and metadata.
Example UI Placement
| Level | ID | Type | Value | Description |
|---|---|---|---|---|
1 | charge-info | Edit | Charge for | Describes purpose of the charge |
1 | charge-notes | Edit | Notes | Custom explanation or instructions |
Notes
- Use for typed input such as labels, messages, or descriptions.
- Apply validation and max length to avoid overflow or truncation.
- When used with financial or sensitive data, trigger validation events early.