Fields for selecting one or multiple values from a set of options.
select
Single or multi-select dropdown.
{
key: 'country',
type: 'select',
value: '',
label: 'Country',
required: true,
options: [
{ value: 'us', label: 'United States' },
{ value: 'uk', label: 'United Kingdom' },
],
placeholder: 'Select country',
}Core Properties:
options: Array of{ label: DynamicText, value: T, disabled?: boolean }objects (at field level, not in props).labelaccepts static strings, signals, or observables;disabledmakes the option non-selectableplaceholder: Placeholder text when no value selected (at field level, not in props)
Adapter Props
| Prop | Type | Description |
|---|---|---|
multiple | boolean | Allow multiple selections |
filter | boolean | Show search filter in dropdown |
showClear | boolean | Show clear button |
hint | string | Helper text below the field |
radio
Single selection from multiple options.
{
key: 'plan',
type: 'radio',
value: '',
label: 'Subscription Plan',
required: true,
options: [
{ value: 'free', label: 'Free' },
{ value: 'pro', label: 'Pro - $10/month' },
{ value: 'enterprise', label: 'Enterprise - $50/month' },
],
}Core Properties:
options: Array of{ label: DynamicText, value: string, disabled?: boolean }objects (at field level, not in props).labelaccepts static strings, signals, or observables;disabledmakes the option non-selectable
Adapter Props
| Prop | Type | Description |
|---|---|---|
hint | string | Helper text below the field |
checkbox
Boolean toggle control.
{
key: 'newsletter',
type: 'checkbox',
value: false,
label: 'Subscribe to newsletter',
}Adapter Props
| Prop | Type | Description |
|---|---|---|
binary | boolean | Use binary true/false value mode |
trueValue | unknown | Value when checked |
falseValue | unknown | Value when unchecked |
hint | string | Helper text below the field |
toggle
Boolean switch control. Similar to checkbox but with a switch UI.
{
key: 'darkMode',
type: 'toggle',
label: 'Enable Dark Mode',
value: false,
}Adapter Props
| Prop | Type | Description |
|---|---|---|
styleClass | string | Additional CSS class for the toggle |
hint | string | Helper text below the field |
multi-checkbox
Multiple selection from a list of checkboxes. Value is an array of selected values.
{
key: 'interests',
type: 'multi-checkbox',
label: 'Interests',
value: [],
options: [
{ value: 'tech', label: 'Technology' },
{ value: 'sports', label: 'Sports' },
{ value: 'music', label: 'Music' },
],
}Core Properties:
options: Array of{ label: DynamicText, value: T, disabled?: boolean }objects (at field level, not in props).labelaccepts static strings, signals, or observables;disabledmakes the option non-selectable
Adapter Props
| Prop | Type | Description |
|---|---|---|
styleClass | string | Additional CSS class |
hint | string | Helper text below the field |