diff --git a/api-generator/components/inputswitch.js b/api-generator/components/inputswitch.js index fc5bbed8b..3ec4eb3d0 100644 --- a/api-generator/components/inputswitch.js +++ b/api-generator/components/inputswitch.js @@ -27,6 +27,18 @@ const InputSwitchEvents = [ { name: "change", description: "Callback to invoke on value change." + }, + { + name: "input", + description: "Callback to invoke on value change." + }, + { + name: "focus", + description: "Callback to invoke when element receives focus." + }, + { + name: "blur", + description: "Callback to invoke when element loses focus." } ]; diff --git a/src/components/inputswitch/InputSwitch.d.ts b/src/components/inputswitch/InputSwitch.d.ts index 63ee84fbf..35a5c7a9b 100755 --- a/src/components/inputswitch/InputSwitch.d.ts +++ b/src/components/inputswitch/InputSwitch.d.ts @@ -9,6 +9,9 @@ declare class InputSwitch { $emit(eventName: 'update:modelValue', value: boolean): this; $emit(eventName: 'click', event: Event): this; $emit(eventName: 'change', event: Event): this; + $emit(eventName: 'input', value: boolean): this; + $emit(eventName: 'focus', event: Event): this; + $emit(eventName: 'blur', event: Event): this; } export default InputSwitch; diff --git a/src/components/inputswitch/InputSwitch.vue b/src/components/inputswitch/InputSwitch.vue index d34cf311a..fc61eca96 100755 --- a/src/components/inputswitch/InputSwitch.vue +++ b/src/components/inputswitch/InputSwitch.vue @@ -29,15 +29,18 @@ export default { this.$emit('click', event); this.$emit('update:modelValue', !this.modelValue); this.$emit('change', event); + this.$emit('input', !this.modelValue); this.$refs.input.focus(); } event.preventDefault(); }, - onFocus() { + onFocus(event) { this.focused = true; + this.$emit('focus', event); }, - onBlur() { + onBlur(event) { this.focused = false; + this.$emit('blur', event); } }, computed: { diff --git a/src/views/inputswitch/InputSwitchDoc.vue b/src/views/inputswitch/InputSwitchDoc.vue index 95ca38ba9..6da88832c 100755 --- a/src/views/inputswitch/InputSwitchDoc.vue +++ b/src/views/inputswitch/InputSwitchDoc.vue @@ -73,7 +73,6 @@ export default {
Events
-

Any valid event such as focus, blur and input are passed to the underlying input element. Following are the additional events to configure the component.

@@ -86,12 +85,27 @@ export default { - + - + + + + + + + + + + + + + + + +
click-event: Browser event Callback to invoke on click.
change-event: Browser eventCallback to invoke on value change.
focusevent: Browser eventCallback to invoke when element receives focus.
blurevent: Browser eventCallback to invoke when element loses focus.
inputvalue: New value Callback to invoke on value change.