Skip to content 
Option 1Option 2Option 3Option 4
SelectableCards 🟠 Not ready
The SelectableCards component can be used imported from:
Playground
Parameters
Events
This component has events. Check the documentation about how to use the events.
| Name | Payload | Description |
|---|---|---|
change | string | |
restarted | void | Fires when the input is reset |
blur | void | Emitted on blur |
Parameters use
Check the documentation about how to use the parameters.
model
The model attribute is used to model the selected card.
options
The options parameter is used to set the options of the radio select. The option object should contain the text and value keys.
We can use <option> tags to define the values of options
We can use slots to define the content of the cards with the option-<value> slot.
Flags
disabled
A flag that disables all the cards.
invalid
A flag that marks the input as invalid.
horizontal
A flag that makes layout horizontal.
compact
A flag that makes the card compact, with less padding.
Browser support
Detected engine:
Chromium
Webkit
Gecko
CodeSandbox example
Sorry, not available yet ☹️