Check
The Check element captures a yes/no or true/false input using a standard checkbox UI. It is typically used for user confirmation, acceptance of terms, opt-ins, or boolean selections in forms. The element can appear as required, support validation states, and trigger events on change.
Properties
| Property | Value | Description |
|---|---|---|
| Type | Check | UI component type |
| Group | Field | Belongs to the "Field" group in UI catalog |
| Identifier | 5 | Unique element ID |
| Preview | ✓ | See image preview above |
| Value | Y | Accepts boolean user input |
| Mandatory | Y | Can be configured as a required field |
| Error | Y | Supports validation error states |
| Min | Not applicable | |
| Max | Not applicable | |
| Read-only | Y | Can display as a locked or static state |
| List | Not a list item | |
| Text, Icon | Y | Supports a label and optional icon |
| Children | Y | Can wrap nested logic or visual elements |
| Event | Y | Triggers on check/uncheck state change |
| Shade | Y | Supports shaded styling for layout consistency |
Usage Example
<Checkbox
label="I agree to the terms"
required
onChange={handleCheckChange}
/>
SDK Integration
This element is often used in SDK-controlled forms, where user acknowledgment or consent is required before submitting. It maps to boolean fields in session, appointment, or account-related objects.
Notes
- Commonly used for user agreements, opt-in toggles, and confirmations.
- Can be rendered read-only for display of fixed values.
- Applies consistent UI styling across mobile and desktop contexts.