@progress/kendo-vue-dateinputs 3.0.1-dev.202201201352 → 3.0.3-dev.202201280639

package/dist/es/calendar/components/Calendar.js

@@ -350,9 +350,9 @@ var Calendar = {
           valueAsDate: value
         }
       };
-      this.$emit('change', args);
       this.$emit('changemodel', value);
       this.$emit('update:modelValue', value);
+      this.$emit('change', args);
       this.$data.valueDuringOnChange = undefined;
     },
     handleMouseDown: function handleMouseDown(event) {

package/dist/es/calendar/components/CalendarHeaderTitle.js

@@ -44,13 +44,15 @@ var CalendarHeaderTitle = {
     var defaultSlot = getDefaultSlots(this);
     return (// @ts-ignore  function children
       h(KButton, {
-        value: this.$props.value,
+        type: "button",
         attrs: this.v3 ? undefined : {
+          type: "button",
           value: this.$props.value,
           id: this.$props.id,
           fillMode: 'flat',
           tabIndex: 0
         },
+        value: this.$props.value,
         id: this.$props.id,
         fillMode: 'flat',
         onClick: this.handleClick,

package/dist/es/calendar/components/Header.js

@@ -213,8 +213,9 @@ var Header = {
       "class": 'k-calendar-nav k-hstack'
     }, [// @ts-ignore
     h(KButton, {
-      icon: 'arrow-60-left',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         icon: 'arrow-60-left',
         size: this.$props.size,
         fillMode: 'flat',
@@ -222,6 +223,7 @@ var Header = {
         "aria-label": prevViewTitle,
         title: prevViewTitle
       },
+      icon: 'arrow-60-left',
       size: this.$props.size,
       fillMode: 'flat',
       "class": "k-prev-view",
@@ -246,8 +248,9 @@ var Header = {
       onClick: this.handleTodayClick
     }, [todayMessage]), // @ts-ignore
     h(KButton, {
-      icon: 'arrow-60-right',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         icon: 'arrow-60-right',
         size: this.$props.size,
         fillMode: 'flat',
@@ -255,6 +258,7 @@ var Header = {
         "aria-label": nextViewTittle,
         title: nextViewTittle
       },
+      icon: 'arrow-60-right',
       size: this.$props.size,
       fillMode: 'flat',
       "class": "k-next-view",

package/dist/es/dateinput/DateInput.js

@@ -363,7 +363,9 @@ var DateInput = {
       this.$data.valueDuringOnChange = this.computedValue;
 
       if (!isEqual(oldValue, this.computedValue)) {
-        // isEqual works with null
+        this.$emit('changemodel', this.computedValue);
+        this.$emit('update:modelValue', this.computedValue); // isEqual works with null
+
         this.$emit('change', {
           event: event,
           value: this.computedValue,
@@ -375,8 +377,6 @@ var DateInput = {
           },
           validity: this.validity()
         });
-        this.$emit('changemodel', this.computedValue);
-        this.$emit('update:modelValue', this.computedValue);
       }
 
       this.$data.valueDuringOnChange = undefined;
@@ -631,8 +631,9 @@ var DateInput = {
       }
     }, [// @ts-ignore
     h(KButton, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'arrow-n',
         size: this.$props.size,
@@ -640,6 +641,7 @@ var DateInput = {
         "aria-label": localizationService.toLanguageString(increaseValue, messages[increaseValue]),
         title: localizationService.toLanguageString(increaseValue, messages[increaseValue])
       },
+      tabIndex: -1,
       icon: 'arrow-n',
       size: this.$props.size,
       fillMode: this.$props.fillMode,
@@ -652,8 +654,9 @@ var DateInput = {
       }
     }), // @ts-ignore
     h(KButton, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'arrow-s',
         size: this.$props.size,
@@ -661,6 +664,7 @@ var DateInput = {
         "aria-label": localizationService.toLanguageString(decreaseValue, messages[decreaseValue]),
         title: localizationService.toLanguageString(decreaseValue, messages[decreaseValue])
       },
+      tabIndex: -1,
       "class": "k-spinner-decrease",
       icon: 'arrow-s',
       size: this.$props.size,

package/dist/es/datepicker/DatePicker.js

@@ -323,6 +323,8 @@ var DatePicker = {
       this.$data.valueDuringOnChange = value;
       this.$data.showDuringOnChange = false;
       this.$data.shouldFocusDateInput = true;
+      this.$emit('changemodel', this.computedValue);
+      this.$emit('update:modelValue', this.computedValue);
       this.$emit('change', {
         event: event.event,
         value: this.computedValue,
@@ -335,8 +337,6 @@ var DatePicker = {
         },
         validity: this.validity()
       });
-      this.$emit('changemodel', this.computedValue);
-      this.$emit('update:modelValue', this.computedValue);
       this.$data.valueDuringOnChange = undefined;
       this.$data.showDuringOnChange = undefined;
     },

package/dist/es/daterangepicker/DateRangePicker.js

@@ -625,9 +625,9 @@ var DateRangePicker = {
           show: this.computedShow
         }
       };
-      this.$emit('change', args);
       this.$emit('changemodel', this.computedValue);
       this.$emit('update:modelValue', this.computedValue);
+      this.$emit('change', args);
       this.valueDuringOnChange = undefined;
     }
   }

package/dist/es/datetimepicker/DateTimePicker.js

@@ -483,14 +483,16 @@ var DateTimePicker = {
       onFocusout: this.handleBlur
     }, [dateInputRendering, // @ts-ignore
     h(Button, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'calendar',
         title: provideLocalizationService(this).toLanguageString(toggleDateTimeSelector, messages[toggleDateTimeSelector]),
         "aria-controls": this._popupId,
         "aria-label": provideLocalizationService(this).toLanguageString(toggleDateTimeSelector, messages[toggleDateTimeSelector])
       },
+      tabIndex: -1,
       icon: 'calendar',
       onMousedown: this.handleIconMouseDown,
       on: this.v3 ? undefined : {
@@ -566,6 +568,8 @@ var DateTimePicker = {
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
+      this.$emit('changemodel', this.computedValue);
+      this.$emit('update:modelValue', this.computedValue);
       this.$emit('change', {
         event: event.event,
         value: this.computedValue,
@@ -577,8 +581,6 @@ var DateTimePicker = {
           valueAsDate: this.computedValue
         }
       });
-      this.$emit('changemodel', this.computedValue);
-      this.$emit('update:modelValue', this.computedValue);
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
     },

package/dist/es/datetimepicker/DateTimeSelector.js

@@ -196,11 +196,13 @@ var DateTimeSelector = {
     }, this.v3 ? function () {
       return [// @ts-ignore  function children
       h(Button, {
-        selected: _this2.currentTab === 'date',
+        type: "button",
         attrs: _this2.v3 ? undefined : {
+          type: "button",
           selected: _this2.currentTab === 'date',
           togglable: true
         },
+        selected: _this2.currentTab === 'date',
         togglable: true,
         onClick: _this2.handleDateClick,
         on: _this2.v3 ? undefined : {
@@ -210,11 +212,13 @@ var DateTimeSelector = {
         return [dateMessage];
       } : [dateMessage]), // @ts-ignore  function children
       h(Button, {
-        selected: _this2.currentTab === 'time',
+        type: "button",
         attrs: _this2.v3 ? undefined : {
+          type: "button",
           selected: _this2.currentTab === 'time',
           togglable: true
         },
+        selected: _this2.currentTab === 'time',
         togglable: true,
         onClick: _this2.handleTimeClick,
         on: _this2.v3 ? undefined : {
@@ -224,11 +228,13 @@ var DateTimeSelector = {
         return [timeMessage];
       } : [timeMessage])];
     } : [h(Button, {
-      selected: _this2.currentTab === 'date',
+      type: "button",
       attrs: _this2.v3 ? undefined : {
+        type: "button",
         selected: _this2.currentTab === 'date',
         togglable: true
       },
+      selected: _this2.currentTab === 'date',
       togglable: true,
       onClick: _this2.handleDateClick,
       on: _this2.v3 ? undefined : {
@@ -237,11 +243,13 @@ var DateTimeSelector = {
     }, _this2.v3 ? function () {
       return [dateMessage];
     } : [dateMessage]), h(Button, {
-      selected: _this2.currentTab === 'time',
+      type: "button",
       attrs: _this2.v3 ? undefined : {
+        type: "button",
         selected: _this2.currentTab === 'time',
         togglable: true
       },
+      selected: _this2.currentTab === 'time',
       togglable: true,
       onClick: _this2.handleTimeClick,
       on: _this2.v3 ? undefined : {
@@ -290,6 +298,12 @@ var DateTimeSelector = {
       "class": "k-datetime-footer k-actions k-actions-stretched"
     }, [cancelButton && // @ts-ignore  function children
     h(Button, {
+      type: "button",
+      attrs: this.v3 ? undefined : {
+        type: "button",
+        title: cancelMessage,
+        "aria-label": cancelMessage
+      },
       ref: 'cancelButton',
       "class": "k-time-cancel",
       onClick: this.handleReject,
@@ -297,23 +311,21 @@ var DateTimeSelector = {
         "click": this.handleReject
       },
       title: cancelMessage,
-      attrs: this.v3 ? undefined : {
-        title: cancelMessage,
-        "aria-label": cancelMessage
-      },
       "aria-label": cancelMessage
     }, this.v3 ? function () {
       return [cancelMessage];
     } : [cancelMessage]), // @ts-ignore  function children
     h(Button, {
-      ref: 'acceptButton',
-      disabled: !this.hasDateValue,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         disabled: !this.hasDateValue,
         themeColor: 'primary',
         title: setMessage,
         "aria-label": setMessage
       },
+      ref: 'acceptButton',
+      disabled: !this.hasDateValue,
       themeColor: 'primary',
       "class": 'k-time-accept',
       onClick: this.handleAccept,

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dateinputs',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1642686332,
+    publishDate: 1643351577,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/es/timepicker/TimePart.js

@@ -161,14 +161,16 @@ var TimePart = {
       "class": "k-title"
     }, [this.intl.formatDate(this.computedValue, this.dateFormatParts.reduce(this.timeFormatReducer, ''))]), this.showNowButton() && // @ts-ignore  function children
     h(Button, {
-      ref: 'nowButton',
-      fillMode: 'flat',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         fillMode: 'flat',
         title: selectNowMessage,
         "aria-label": selectNowMessage,
         tabIndex: disabled ? -1 : 0
       },
+      ref: 'nowButton',
+      fillMode: 'flat',
       "class": "k-time-now",
       title: selectNowMessage,
       "aria-label": selectNowMessage,

package/dist/es/timepicker/TimePicker.js

@@ -480,14 +480,16 @@ var TimePicker = {
       } : this._anchor
     }, [dateInputRendering, // @ts-ignore
     h(KButton, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'clock',
         title: toggleTimeMessage,
         "aria-controls": this._popupId,
         "aria-label": toggleClockMessage
       },
+      tabIndex: -1,
       icon: 'clock',
       onMousedown: this.handleIconMouseDown,
       on: this.v3 ? undefined : {
@@ -573,6 +575,8 @@ var TimePicker = {
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
+      this.$emit('changemodel', this.computedValue);
+      this.$emit('update:modelValue', this.computedValue);
       this.$emit('change', {
         event: event.event,
         value: this.computedValue,
@@ -584,8 +588,6 @@ var TimePicker = {
           valueAsDate: this.computedValue
         }
       });
-      this.$emit('changemodel', this.computedValue);
-      this.$emit('update:modelValue', this.computedValue);
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
     },

package/dist/es/timepicker/TimeSelector.js

@@ -196,6 +196,12 @@ var TimeSelector = {
       "class": "k-time-footer k-actions k-actions-stretched"
     }, [cancelButton && // @ts-ignore  function children
     h(Button, {
+      type: "button",
+      attrs: this.v3 ? undefined : {
+        type: "button",
+        title: cancelMessage,
+        "aria-label": cancelMessage
+      },
       ref: 'cancelButton',
       "class": "k-time-cancel",
       onClick: this.handleReject,
@@ -203,22 +209,20 @@ var TimeSelector = {
         "click": this.handleReject
       },
       title: cancelMessage,
-      attrs: this.v3 ? undefined : {
-        title: cancelMessage,
-        "aria-label": cancelMessage
-      },
       "aria-label": cancelMessage
     }, this.v3 ? function () {
       return [cancelMessage];
     } : [cancelMessage]), // @ts-ignore  function children
     h(Button, {
-      ref: 'acceptButton',
-      themeColor: 'primary',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         themeColor: 'primary',
         title: setMessage,
         "aria-label": setMessage
       },
+      ref: 'acceptButton',
+      themeColor: 'primary',
       "class": "k-time-accept",
       onClick: this.handleAccept,
       on: this.v3 ? undefined : {

package/dist/npm/calendar/components/Calendar.js

@@ -369,9 +369,9 @@ var Calendar = {
           valueAsDate: value
         }
       };
-      this.$emit('change', args);
       this.$emit('changemodel', value);
       this.$emit('update:modelValue', value);
+      this.$emit('change', args);
       this.$data.valueDuringOnChange = undefined;
     },
     handleMouseDown: function handleMouseDown(event) {

package/dist/npm/calendar/components/CalendarHeaderTitle.js

@@ -54,13 +54,15 @@ var CalendarHeaderTitle = {
     var defaultSlot = kendo_vue_common_1.getDefaultSlots(this);
     return (// @ts-ignore  function children
       h(kendo_vue_buttons_1.Button, {
-        value: this.$props.value,
+        type: "button",
         attrs: this.v3 ? undefined : {
+          type: "button",
           value: this.$props.value,
           id: this.$props.id,
           fillMode: 'flat',
           tabIndex: 0
         },
+        value: this.$props.value,
         id: this.$props.id,
         fillMode: 'flat',
         onClick: this.handleClick,

package/dist/npm/calendar/components/Header.js

@@ -230,8 +230,9 @@ var Header = {
       "class": 'k-calendar-nav k-hstack'
     }, [// @ts-ignore
     h(kendo_vue_buttons_1.Button, {
-      icon: 'arrow-60-left',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         icon: 'arrow-60-left',
         size: this.$props.size,
         fillMode: 'flat',
@@ -239,6 +240,7 @@ var Header = {
         "aria-label": prevViewTitle,
         title: prevViewTitle
       },
+      icon: 'arrow-60-left',
       size: this.$props.size,
       fillMode: 'flat',
       "class": "k-prev-view",
@@ -263,8 +265,9 @@ var Header = {
       onClick: this.handleTodayClick
     }, [todayMessage]), // @ts-ignore
     h(kendo_vue_buttons_1.Button, {
-      icon: 'arrow-60-right',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         icon: 'arrow-60-right',
         size: this.$props.size,
         fillMode: 'flat',
@@ -272,6 +275,7 @@ var Header = {
         "aria-label": nextViewTittle,
         title: nextViewTittle
       },
+      icon: 'arrow-60-right',
       size: this.$props.size,
       fillMode: 'flat',
       "class": "k-next-view",

package/dist/npm/dateinput/DateInput.js

@@ -383,7 +383,9 @@ var DateInput = {
       this.$data.valueDuringOnChange = this.computedValue;
 
       if (!kendo_date_math_1.isEqual(oldValue, this.computedValue)) {
-        // isEqual works with null
+        this.$emit('changemodel', this.computedValue);
+        this.$emit('update:modelValue', this.computedValue); // isEqual works with null
+
         this.$emit('change', {
           event: event,
           value: this.computedValue,
@@ -395,8 +397,6 @@ var DateInput = {
           },
           validity: this.validity()
         });
-        this.$emit('changemodel', this.computedValue);
-        this.$emit('update:modelValue', this.computedValue);
       }
 
       this.$data.valueDuringOnChange = undefined;
@@ -651,8 +651,9 @@ var DateInput = {
       }
     }, [// @ts-ignore
     h(kendo_vue_buttons_1.Button, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'arrow-n',
         size: this.$props.size,
@@ -660,6 +661,7 @@ var DateInput = {
         "aria-label": localizationService.toLanguageString(messages_1.increaseValue, messages_1.messages[messages_1.increaseValue]),
         title: localizationService.toLanguageString(messages_1.increaseValue, messages_1.messages[messages_1.increaseValue])
       },
+      tabIndex: -1,
       icon: 'arrow-n',
       size: this.$props.size,
       fillMode: this.$props.fillMode,
@@ -672,8 +674,9 @@ var DateInput = {
       }
     }), // @ts-ignore
     h(kendo_vue_buttons_1.Button, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'arrow-s',
         size: this.$props.size,
@@ -681,6 +684,7 @@ var DateInput = {
         "aria-label": localizationService.toLanguageString(messages_1.decreaseValue, messages_1.messages[messages_1.decreaseValue]),
         title: localizationService.toLanguageString(messages_1.decreaseValue, messages_1.messages[messages_1.decreaseValue])
       },
+      tabIndex: -1,
       "class": "k-spinner-decrease",
       icon: 'arrow-s',
       size: this.$props.size,

package/dist/npm/datepicker/DatePicker.js

@@ -343,6 +343,8 @@ var DatePicker = {
       this.$data.valueDuringOnChange = value;
       this.$data.showDuringOnChange = false;
       this.$data.shouldFocusDateInput = true;
+      this.$emit('changemodel', this.computedValue);
+      this.$emit('update:modelValue', this.computedValue);
       this.$emit('change', {
         event: event.event,
         value: this.computedValue,
@@ -355,8 +357,6 @@ var DatePicker = {
         },
         validity: this.validity()
       });
-      this.$emit('changemodel', this.computedValue);
-      this.$emit('update:modelValue', this.computedValue);
       this.$data.valueDuringOnChange = undefined;
       this.$data.showDuringOnChange = undefined;
     },

package/dist/npm/daterangepicker/DateRangePicker.js

@@ -644,9 +644,9 @@ var DateRangePicker = {
           show: this.computedShow
         }
       };
-      this.$emit('change', args);
       this.$emit('changemodel', this.computedValue);
       this.$emit('update:modelValue', this.computedValue);
+      this.$emit('change', args);
       this.valueDuringOnChange = undefined;
     }
   }

package/dist/npm/datetimepicker/DateTimePicker.js

@@ -505,14 +505,16 @@ var DateTimePicker = {
       onFocusout: this.handleBlur
     }, [dateInputRendering, // @ts-ignore
     h(kendo_vue_buttons_1.Button, {
-      tabIndex: -1,
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         tabIndex: -1,
         icon: 'calendar',
         title: kendo_vue_intl_1.provideLocalizationService(this).toLanguageString(messages_1.toggleDateTimeSelector, messages_1.messages[messages_1.toggleDateTimeSelector]),
         "aria-controls": this._popupId,
         "aria-label": kendo_vue_intl_1.provideLocalizationService(this).toLanguageString(messages_1.toggleDateTimeSelector, messages_1.messages[messages_1.toggleDateTimeSelector])
       },
+      tabIndex: -1,
       icon: 'calendar',
       onMousedown: this.handleIconMouseDown,
       on: this.v3 ? undefined : {
@@ -588,6 +590,8 @@ var DateTimePicker = {
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
+      this.$emit('changemodel', this.computedValue);
+      this.$emit('update:modelValue', this.computedValue);
       this.$emit('change', {
         event: event.event,
         value: this.computedValue,
@@ -599,8 +603,6 @@ var DateTimePicker = {
           valueAsDate: this.computedValue
         }
       });
-      this.$emit('changemodel', this.computedValue);
-      this.$emit('update:modelValue', this.computedValue);
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
     },