jc-checkbox
The schema defines the following properties:
Property | Type | Required | Description |
type | component.checkbox | true | |
instanceId | string | true | |
when | Expression | boolean | false | |
options | Checkbox Options | true | |
Properties of the options object:
Property | Type | Required | Description |
label | string | Expression | TextWithFormat | TextLocale | true | Label is displayed as placeholder when no value. |
icon | icon-name | string | false | Trailing icon. |
helperText | string | Expression | TextWithFormat | TextLocale | false | Helper text is displayed only when there is no errorText. |
errorText | string | Expression | TextWithFormat | TextLocale | false | Text displayed when field's value is not valid. When not empty it displays isNegative style as well. |
style | object | false | Define style which checkbox can have. |
isAutoFocused | boolean | false | If true it will get focus immediately after it is displayed to user. |
isRequired | boolean | string | false | True when the field is required. Useful when you use it in form submission. |
isOptionalLabelHidden | boolean | string | false | If the field is optional you can turn off the "(optional)" label if you want. |
isIgnored | boolean | string | false | When true, the field will be ignored when submitting the form. |
isHidden | boolean | string | false | If true it will be hidden to user. |
initialValue | boolean | string | false | Initial value of the relevant field. You can use this to preset value, so user doesn't need to add anything and use this "default". |
value | boolean | string | false | The value to show for the field. Text field is a controlled component, which means the internal value will be forced to match this value prop if provided. In most cases, you don't need to use this. |
onChange | false | Action Keg component that will be triggered when value is changed | |
nextProperty | string | false | Name of the property you want to focus next in form when you use "submit" on virtual keyboard. |
color | object[] | false | Changing color of field based on conditions. First evaluated to true will be used. |
onPress | false | OnPress actionOverwrites main check / uncheck functionality. |
Label is displayed as placeholder when no value.
icon (icon-name | string)
Trailing icon.
The object must be any of the following types:
Helper text is displayed only when there is no errorText.
Text displayed when field's value is not valid. When not empty it displays isNegative style as well.
Define style which checkbox can have.
Properties of the style object:
Property | Type | Required | Description |
isDisabled | boolean | string | false | Whether or not action are disabled |
isDanger | boolean | string | false | Follow danger color |
isWarning | boolean | string | false | Follow warning color |
isPositive | boolean | string | false | Follow positive color |
flex | number | false | Flex property if rendered inside row |
Whether or not action are disabled
The object must be any of the following types:
Follow danger color
The object must be any of the following types:
Follow warning color
The object must be any of the following types:
Follow positive color
The object must be any of the following types:
True when the field is required. Useful when you use it in form submission.
The object must be any of the following types:
If the field is optional you can turn off the "(optional)" label if you want.
The object must be any of the following types:
When true, the field will be ignored when submitting the form.
The object must be any of the following types:
If true it will be hidden to user.
The object must be any of the following types:
Initial value of the relevant field. You can use this to preset value, so user doesn't need to add anything and use this "default".
The object must be any of the following types:
The value to show for the field. Text field is a controlled component, which means the internal value will be forced to match this value prop if provided. In most cases, you don't need to use this.
The object must be any of the following types:
Action Keg component that will be triggered when value is changed
Changing color of field based on conditions. First evaluated to true will be used.
The object is an array with all elements of the type object.
The array object has the following properties:
OnPress action
Overwrites main check / uncheck functionality.
