@nextcloud/vueNcCheckboxRadioSwitch
Props
| Prop name | Description | Type | Values | Default |
|---|---|---|---|---|
| id | Unique id attribute of the input | string | - | () => 'checkbox-radio-switch-' + GenRandomId() |
| name | Input name. Required for radio, optional for checkbox | string | - | null |
| type | Type of the input. checkbox, radio or switch | string | - | 'checkbox' |
| buttonVariant | Toggle the alternative button style | boolean | - | false |
| buttonVariantGrouped | Are the elements are all direct siblings? If so they will be grouped horizontally or vertically Possible values are no, horizontal, vertical. | string | no, vertical, horizontal | 'no' |
| checked | Checked state. To be used with v-model:value | boolean|array|string | - | false |
| value | Value to be synced on check | string | - | null |
| disabled | Disabled state | boolean | - | false |
| indeterminate | Indeterminate state | boolean | - | false |
| loading | Loading state | boolean | - | false |
| wrapperElement | Wrapping element tag | string | - | 'span' |
Events
| Event name | Properties | Description |
|---|---|---|
| update:checked |
Slots
| Name | Description | Bindings |
|---|---|---|
| default | The checkbox/radio label |
General description
This is a simple input checkbox, radio and switch design. Please have a look at proper usage and recommendations: https://material.io/components/checkboxes
Standard checkbox
loading...
Standard radio set
loading...
Standard radio set with alternative button style
loading...
Standard checkbox set
loading...
Standard switch
loading...