Ractive Ez Radio
Radio button component for ractive.js
Install
npm i ractive-ez-radio
import 'ractive-ez-radio';
import 'ractive-ez-radio/themes/blue.less';
Theming requires less-loader. Icons require ractive-ez-icon
Usage
<EzRadioGroup value="{{ value }}" align="horizontal">
<EzRadioIcon value="1" />
<EzRadioIcon value="2" />
<EzRadioIcon value="3" />
</EzRadioGroup>
-
EzRadioGroup
-
align
: horizontal or vertical -
value
: the value to bind to the selected radio button -
button
: Passed to contained radio buttons -
disabled
: Passed to contained radio buttons -
iconChecked
: Passed to contained radio buttons -
iconUnchecked
: Passed to contained radio buttons
-
-
EzRadio
-
value
: The value this radio button assumes -
disabled
: True if the component is disabled -
button
: Render as button -
iconChecked
: When using ractive-ez-icon, can set an icon for the "checked" state -
iconUnchecked
: When using ractive-ez-icon, can set an icon for the "unchecked" state
-
Custom label format
If a text label is not sufficient for your radio button, you can override the label
partial:
<EzRadio value="{{ value }}" label>
<b>Bold label</b>
</EzRadio>
Shorthand subcomponents
-
EzRadio
: The base component -
EzRadioButton
: Implied button -
EzRadioIcon
: Implied radio icons (defaulting to radio-checked and radio-unchecked) -
EzRadioIconButton
: Implied icon button