Composite field
Container for grouping related form fields together
Demo
API
Tag
| Name | Description |
<s-composite-field>
|
Custom Element that groups form field elements together visually |
Slots
| Name | Description |
label-input-group |
Slot for form field elements. Each group should contain a label and its associated input component. |
Children
The composite field component accepts form field elements as children via the label-input-group slot, including <s-select>, <s-datepicker>, and <s-input-extended>. The first and last fields will have rounded corners on their outer edges, while adjacent borders are flattened to create a connected appearance.
Demo
Tag
| Name |
<SCompositeField>
|
Slots
| Name | Description |
label-input-group |
Slot for form field elements. Each group should contain a label and its associated input component. |
Children
The composite field component accepts form field elements as children via the label-input-group slot, including <SSelect>, <SDatepicker>, and <SInputExtended>. The first and last fields will have rounded corners on their outer edges, while adjacent borders are flattened to create a connected appearance.
Skylab React links
Design
Design resources can be found on the Skylab design documentation site: skylab.avalara.com