Sorry, but you either have no stories or none are selected somehow.
If the problem persists, check the browser console, or the terminal you've run Storybook from.
The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:
import "@inera/ids-core/components/form/check-box/register"; // optional import "@inera/ids-core/components/form/check-box-group/register"; import "@inera/ids-core/components/form/error-message/register";
Wrap one <input type="checkbox"> and label inside the ids-wc-checkbox component.
Note that
ids-wc-checkboxonly accepts oneinputandlabeleach.
| Name | Description | Default | Control |
|---|---|---|---|
| Checkbox group | |||
| compact | Will reduce the margins between the checkboxes | false | |
| legend | Sets the legend around the checkbox group | "" | |
| novalidation | Prevents validation on entire group | false | |
| slots | |||
For checkboxes (ids-checkbox) | - | ||
| error-msg | For an IDS error message | - | |
| tooltip | For a tooltip (ids-tooltip) | - | |
| Checkbox | |||
| block | Sets width to 100% | false | |
| indeterminate | Sets the indeterminate state | false | |
| invalid | Reflects the validity of the checkbox | false | |
| light | Light version (white background) | false | |
| novalidation | Prevents validation | false | |
| slots | |||
Default slot for an input of type checkbox and a label | - | ||
| error-msg | For an IDS error message | - | |
| tooltip | For a tooltip (ids-tooltip) | - | |
| events | |||
| onInvalid | Runs when invalid becomes true | - | |
| onValid | Runs when invalid becomes false | - | |
You can omit the label.
A required checkbox is marked as invalid if unchecked.
Validation is performed on checked event and on form submit.
Validation can be turned off by supplying
novalidation.
Screen reader support is handled automatically.