| 1 |
<cx-vui-component-wrapper |
| 2 |
:elementId="currentId" |
| 3 |
:label="label" |
| 4 |
:description="description" |
| 5 |
:wrapper-css="wrapperCss" |
| 6 |
:preventWrap="preventWrap" |
| 7 |
v-if="isVisible()" |
| 8 |
> |
| 9 |
<div |
| 10 |
tabIndex="0" |
| 11 |
:id="currentId" |
| 12 |
:class="{ |
| 13 |
'cx-vui-switcher': true, |
| 14 |
'cx-vui-switcher--disabled': this.disabled, |
| 15 |
'cx-vui-switcher--on': this.isOn, |
| 16 |
'cx-vui-switcher--off': ! this.isOn, |
| 17 |
'cx-vui-switcher--in-focus': this.inFocus |
| 18 |
}" |
| 19 |
@keyup.enter="handleEnter" |
| 20 |
@focus="handleFocus" |
| 21 |
@blur="handleBlur" |
| 22 |
@click="switchState" |
| 23 |
> |
| 24 |
<input |
| 25 |
type="hidden" |
| 26 |
checked="checked" |
| 27 |
class="cx-vui-switcher__input" |
| 28 |
:name="name" |
| 29 |
:value="currentValue" |
| 30 |
> |
| 31 |
<div class="cx-vui-switcher__panel"></div> |
| 32 |
<div class="cx-vui-switcher__trigger"></div> |
| 33 |
</div> |
| 34 |
</cx-vui-component-wrapper> |
