Fragment
Fragments define named content blocks inside a Tabs container. Each Fragment corresponds to one tab pane and renders grouped content like patient details, visit data, or documents. Fragments do not render UI wrappers but enable section scoping and conditional visibility inside multi-tab layouts.
Properties
| Property | Value | Description |
|---|---|---|
| Type | Fragment | UI component type for tab content |
| Group | Tabs | Must be placed inside a Tabs element |
| Identifier | 17 | Unique element ID |
| Preview | ✓ | Logical group without visual border |
| Text, Icon | Y | Supports named tab titles |
| Read-only | Can include editable children | |
| Children | Children elements render inside the panel | |
| Event | No event emission; passive container | |
| Value | Not value-based | |
| Mandatory | Not applicable | |
| Error | Not applicable | |
| Min | Not applicable | |
| Max | Not applicable | |
| List | Not a list-type container | |
| Shade | No background or border applied |
Usage Example
<Tabs>
<Fragment name="Details">
<Section title="Patient Details" />
<Edit label="Reference Number" />
<Edit label="Doctor Name" />
</Fragment>
<Fragment name="Charges">
<Section title="Charges" />
<Edit label="Fee" />
<Edit label="Extra Charges" />
</Fragment>
</Tabs>
SDK Integration
The Appointment Details screen uses Fragments inside tabbed sections. Each Fragment wraps fields for a specific domain such as patient info, visit history, or financial data.
Method: /profile/appointments/{id}/details
Fragments do not define behavior but act as logical containers within Tabs to control content visibility.
Example UI Placement
| Level | Reference | Type | Description |
|---|---|---|---|
3 | — | Tabs | Tab container |
3 | Fragment | Fragment | Content group within a tab |
3 | Section | Section | Visible section inside fragment |
Notes
- Use Fragments only inside Tabs.
- Do not apply layout logic to Fragments; use Group, Section, or Splitter inside.
- Fragments help scope identifiers and content blocks per tab.