Permalink
Browse files

fix(form-checkbox): Better focus handling in button mode

  • Loading branch information...
tmorehouse committed Aug 11, 2017
1 parent 0842043 commit 06e1c7bb895983a30288e24441da4f7ab654bc39
Showing with 8 additions and 7 deletions.
  1. +8 −7 lib/components/form-checkbox.vue
@@ -13,8 +13,8 @@
:aria-required="required ? 'true' : null"
:class="(custom && !button ) ? 'custom-control-input' : null"
:checked="isChecked"
@focusin.native="handleFocus"
@focusout.native="handleFocus"
@focus="handleFocus"
@blur="handleFocus"
@change="handleChange">
<span v-if="custom && !button"
class="custom-control-indicator"
@@ -113,11 +113,12 @@ export default {
},
handleFocus(evt) {
// Add or remove 'focus' class on label in button mode
if (this.button && evt.target === this.$refs.check) {
if (evt.type === 'focusin') {
this.$el.classList.add('focus');
} else if (evt.type === 'focusout') {
this.$el.classList.remove('focus');
if (this.button && evt.target && evt.target.parentElement) {
const label = evt.target.parentElement;
if (evt.type === 'focus') {
label.classList.add('focus');
} else if (evt.type === 'blur') {
label.classList.remove('focus');
}
}
}

0 comments on commit 06e1c7b

Please sign in to comment.