@progress/kendo-vue-dateinputs 3.9.0 → 3.9.1-dev.202303280945

package/dist/es/datepicker/DatePicker.js

@@ -39,7 +39,9 @@ var DatePickerVue2 = {
     'iconclick': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   props: {
     defaultShow: {
@@ -290,6 +292,9 @@ var DatePickerVue2 = {
         return;
       }
       this.$data.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     mergeTime: function mergeTime(value) {
       return this.computedValue && value ? setTime(value, this.computedValue) : value;
@@ -306,7 +311,6 @@ var DatePickerVue2 = {
     },
     handleValueChange: function handleValueChange(value, event) {
       this.$data.currentValue = cloneDate(value || undefined);
-      this.$data.currentShow = false;
       this.$data.valueDuringOnChange = value;
       this.$data.showDuringOnChange = false;
       this.$data.shouldFocusDateInput = true;
@@ -326,6 +330,7 @@ var DatePickerVue2 = {
       });
       this.$data.valueDuringOnChange = undefined;
       this.$data.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleIconClick: function handleIconClick(event) {
       event.stopPropagation();
@@ -334,8 +339,8 @@ var DatePickerVue2 = {
         return;
       }
       this.$data.shouldFocusDateInput = true;
-      this.setShow(!this.computedShow);
       this.$emit('iconclick', event);
+      this.setShow(!this.computedShow);
     },
     handleIconMouseDown: function handleIconMouseDown(event) {
       event.stopPropagation();

package/dist/es/datepicker/interfaces/DatePickerEventArguments.d.ts

@@ -8,3 +8,15 @@ export interface DatePickerChangeEvent {
     target: any;
     component: any;
 }
+/**
+ * The arguments for the `open` event of the DatePicker.
+ */
+export interface DatePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DatePicker.
+ */
+export interface DatePickerCloseEvent {
+    component: any;
+}

package/dist/es/daterangepicker/DateRangePicker.d.ts

@@ -21,6 +21,18 @@ export interface DateRangePickerChangeEvent {
     target: any;
     component?: any;
 }
+/**
+ * The arguments for the `open` event of the DateRangePicker.
+ */
+export interface DateRangePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DateRangePicker.
+ */
+export interface DateRangePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue DateRangePicker component]({% slug overview_daterangepicker %}).
  */

package/dist/es/daterangepicker/DateRangePicker.js

@@ -44,7 +44,9 @@ var DateRangePickerVue2 = {
     'changemodel': null,
     'update:modelValue': null,
     focus: null,
-    keydown: null
+    keydown: null,
+    'open': null,
+    'close': null
   },
   inject: {
     kendoLocalizationService: {
@@ -491,6 +493,9 @@ var DateRangePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     handleReverseClick: function handleReverseClick(event) {
       var value = {

package/dist/es/datetimepicker/DateTimePicker.d.ts

@@ -16,6 +16,18 @@ export interface DateTimePickerChangeEvent {
     show: boolean;
     target: any;
 }
+/**
+ * The arguments for the `open` event of the DateTimePicker.
+ */
+export interface DateTimePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DateTimePicker.
+ */
+export interface DateTimePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue DateTimePicker component]({% slug overview_datetimepicker %}).
  */

package/dist/es/datetimepicker/DateTimePicker.js

@@ -33,7 +33,9 @@ var DateTimePickerVue2 = {
     'change': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   props: {
     modelValue: {
@@ -567,13 +569,15 @@ var DateTimePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     handleReject: function handleReject() {
       this.setShow(false);
     },
     handleValueChange: function handleValueChange(event) {
       this.currentValue = cloneDate(event.value || undefined);
-      this.currentShow = false;
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
@@ -592,6 +596,7 @@ var DateTimePickerVue2 = {
       });
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleFocus: function handleFocus(event) {
       this.isFocused = true;

package/dist/es/main.d.ts

@@ -6,19 +6,19 @@ import { CalendarChangeEvent, CalendarWeekCellClickEvent } from './calendar/comp
 import { DateInputProps } from './dateinput/interfaces/DateInputProps';
 import { DateInputChangeEvent } from './dateinput/interfaces/DateInputEventArguments';
 import { DatePickerProps } from './datepicker/interfaces/DatePickerProps';
-import { DatePickerChangeEvent } from './datepicker/interfaces/DatePickerEventArguments';
-import { TimePicker, TimePickerVue2, TimePickerProps, TimePickerChangeEvent } from './timepicker/TimePicker';
-import { DateRangePicker, DateRangePickerProps, DateRangePickerChangeEvent } from './daterangepicker/DateRangePicker';
+import { DatePickerChangeEvent, DatePickerOpenEvent, DatePickerCloseEvent } from './datepicker/interfaces/DatePickerEventArguments';
+import { TimePicker, TimePickerVue2, TimePickerProps, TimePickerChangeEvent, TimePickerOpenEvent, TimePickerCloseEvent } from './timepicker/TimePicker';
+import { DateRangePicker, DateRangePickerProps, DateRangePickerChangeEvent, DateRangePickerOpenEvent, DateRangePickerCloseEvent } from './daterangepicker/DateRangePicker';
 import { CalendarCell, CalendarCellVue2, CalendarCellProps } from './calendar/components/CalendarCell';
 import { CalendarWeekCell, CalendarWeekCellVue2, CalendarWeekCellProps } from './calendar/components/CalendarWeekCell';
 import { CalendarHeaderTitle, CalendarHeaderTitleVue2, CalendarHeaderTitleProps } from './calendar/components/CalendarHeaderTitle';
 import { ActiveView, SelectionRange, CalendarSettings, CalendarViewEnum } from './calendar/models/main';
 import { DateInputSettings, DateInputIncrementalSteps, DateInputFormatPlaceholder, DateInputCustomFormatPlaceholder } from './dateinput/models/main';
-import { DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerChangeEvent } from './datetimepicker/DateTimePicker';
+import { DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerChangeEvent, DateTimePickerOpenEvent, DateTimePickerCloseEvent } from './datetimepicker/DateTimePicker';
 import { DatePickerSettings } from './datepicker/models/main';
 import { DateTimePickerSettings } from './datetimepicker/models/main';
 import { TimePickerSettings } from './timepicker/models/main';
 import { DateRangePickerSettings, DateRangePickerPopupSettings, DateRangePickerCalendarSettings, DateRangePickerDateInputSettings } from './daterangepicker/models/main';
 import { ToggleButton, ToggleButtonVue2 } from './datepicker/ToggleButton';
 import { PickerWrap, PickerWrapVue2, PickerWrapProps } from './common/PickerWrap';
-export { PickerWrap, PickerWrapVue2, PickerWrapProps, ToggleButton, ToggleButtonVue2, ActiveView, Calendar, CalendarVue2, CalendarProps, CalendarSettings, CalendarViewEnum, CalendarChangeEvent, CalendarWeekCellClickEvent, CalendarCell, CalendarCellVue2, CalendarCellProps, CalendarWeekCell, CalendarWeekCellVue2, CalendarWeekCellProps, CalendarHeaderTitle, CalendarHeaderTitleVue2, CalendarHeaderTitleProps, DateInput, DateInputVue2, DateInputProps, DateInputSettings, DateInputChangeEvent, DateInputIncrementalSteps, DateInputFormatPlaceholder, DateInputCustomFormatPlaceholder, DatePicker, DatePickerVue2, DatePickerProps, DatePickerSettings, DatePickerChangeEvent, TimePicker, TimePickerVue2, TimePickerProps, TimePickerSettings, TimePickerChangeEvent, DateRangePicker, DateRangePickerProps, DateRangePickerSettings, DateRangePickerCalendarSettings, DateRangePickerDateInputSettings, DateRangePickerPopupSettings, DateRangePickerChangeEvent, DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerSettings, DateTimePickerChangeEvent, SelectionRange };
+export { PickerWrap, PickerWrapVue2, PickerWrapProps, ToggleButton, ToggleButtonVue2, ActiveView, Calendar, CalendarVue2, CalendarProps, CalendarSettings, CalendarViewEnum, CalendarChangeEvent, CalendarWeekCellClickEvent, CalendarCell, CalendarCellVue2, CalendarCellProps, CalendarWeekCell, CalendarWeekCellVue2, CalendarWeekCellProps, CalendarHeaderTitle, CalendarHeaderTitleVue2, CalendarHeaderTitleProps, DateInput, DateInputVue2, DateInputProps, DateInputSettings, DateInputChangeEvent, DateInputIncrementalSteps, DateInputFormatPlaceholder, DateInputCustomFormatPlaceholder, DatePicker, DatePickerVue2, DatePickerProps, DatePickerSettings, DatePickerChangeEvent, DatePickerOpenEvent, DatePickerCloseEvent, TimePicker, TimePickerVue2, TimePickerProps, TimePickerSettings, TimePickerChangeEvent, TimePickerOpenEvent, TimePickerCloseEvent, DateRangePicker, DateRangePickerProps, DateRangePickerSettings, DateRangePickerCalendarSettings, DateRangePickerDateInputSettings, DateRangePickerPopupSettings, DateRangePickerChangeEvent, DateRangePickerOpenEvent, DateRangePickerCloseEvent, DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerSettings, DateTimePickerChangeEvent, DateTimePickerOpenEvent, DateTimePickerCloseEvent, SelectionRange };

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: 1678855661,
+    publishDate: 1679996156,
     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/TimePicker.d.ts

@@ -16,6 +16,18 @@ export interface TimePickerChangeEvent {
     show: boolean;
     target: any;
 }
+/**
+ * The arguments for the `open` event of the TimePicker.
+ */
+export interface TimePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the TimePicker.
+ */
+export interface TimePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue TimePicker component]({% slug overview_timepicker %}).
  */

package/dist/es/timepicker/TimePicker.js

@@ -43,7 +43,9 @@ var TimePickerVue2 = {
     'change': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   model: {
     event: 'changemodel'
@@ -568,6 +570,9 @@ var TimePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     mergeTime: function mergeTime(value) {
       return this.computedValue && value ? setTime(this.computedValue, value) : value;
@@ -580,7 +585,6 @@ var TimePickerVue2 = {
     },
     handleValueChange: function handleValueChange(event) {
       this.currentValue = cloneDate(event.value);
-      this.currentShow = false;
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
@@ -599,6 +603,7 @@ var TimePickerVue2 = {
       });
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleFocus: function handleFocus(event) {
       this._oldShow = this.computedShow;

package/dist/esm/datepicker/DatePicker.js

@@ -39,7 +39,9 @@ var DatePickerVue2 = {
     'iconclick': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   props: {
     defaultShow: {
@@ -290,6 +292,9 @@ var DatePickerVue2 = {
         return;
       }
       this.$data.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     mergeTime: function mergeTime(value) {
       return this.computedValue && value ? setTime(value, this.computedValue) : value;
@@ -306,7 +311,6 @@ var DatePickerVue2 = {
     },
     handleValueChange: function handleValueChange(value, event) {
       this.$data.currentValue = cloneDate(value || undefined);
-      this.$data.currentShow = false;
       this.$data.valueDuringOnChange = value;
       this.$data.showDuringOnChange = false;
       this.$data.shouldFocusDateInput = true;
@@ -326,6 +330,7 @@ var DatePickerVue2 = {
       });
       this.$data.valueDuringOnChange = undefined;
       this.$data.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleIconClick: function handleIconClick(event) {
       event.stopPropagation();
@@ -334,8 +339,8 @@ var DatePickerVue2 = {
         return;
       }
       this.$data.shouldFocusDateInput = true;
-      this.setShow(!this.computedShow);
       this.$emit('iconclick', event);
+      this.setShow(!this.computedShow);
     },
     handleIconMouseDown: function handleIconMouseDown(event) {
       event.stopPropagation();

package/dist/esm/datepicker/interfaces/DatePickerEventArguments.d.ts

@@ -8,3 +8,15 @@ export interface DatePickerChangeEvent {
     target: any;
     component: any;
 }
+/**
+ * The arguments for the `open` event of the DatePicker.
+ */
+export interface DatePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DatePicker.
+ */
+export interface DatePickerCloseEvent {
+    component: any;
+}

package/dist/esm/daterangepicker/DateRangePicker.d.ts

@@ -21,6 +21,18 @@ export interface DateRangePickerChangeEvent {
     target: any;
     component?: any;
 }
+/**
+ * The arguments for the `open` event of the DateRangePicker.
+ */
+export interface DateRangePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DateRangePicker.
+ */
+export interface DateRangePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue DateRangePicker component]({% slug overview_daterangepicker %}).
  */

package/dist/esm/daterangepicker/DateRangePicker.js

@@ -44,7 +44,9 @@ var DateRangePickerVue2 = {
     'changemodel': null,
     'update:modelValue': null,
     focus: null,
-    keydown: null
+    keydown: null,
+    'open': null,
+    'close': null
   },
   inject: {
     kendoLocalizationService: {
@@ -491,6 +493,9 @@ var DateRangePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     handleReverseClick: function handleReverseClick(event) {
       var value = {

package/dist/esm/datetimepicker/DateTimePicker.d.ts

@@ -16,6 +16,18 @@ export interface DateTimePickerChangeEvent {
     show: boolean;
     target: any;
 }
+/**
+ * The arguments for the `open` event of the DateTimePicker.
+ */
+export interface DateTimePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DateTimePicker.
+ */
+export interface DateTimePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue DateTimePicker component]({% slug overview_datetimepicker %}).
  */

package/dist/esm/datetimepicker/DateTimePicker.js

@@ -33,7 +33,9 @@ var DateTimePickerVue2 = {
     'change': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   props: {
     modelValue: {
@@ -567,13 +569,15 @@ var DateTimePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     handleReject: function handleReject() {
       this.setShow(false);
     },
     handleValueChange: function handleValueChange(event) {
       this.currentValue = cloneDate(event.value || undefined);
-      this.currentShow = false;
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
@@ -592,6 +596,7 @@ var DateTimePickerVue2 = {
       });
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleFocus: function handleFocus(event) {
       this.isFocused = true;

package/dist/esm/main.d.ts

@@ -6,19 +6,19 @@ import { CalendarChangeEvent, CalendarWeekCellClickEvent } from './calendar/comp
 import { DateInputProps } from './dateinput/interfaces/DateInputProps';
 import { DateInputChangeEvent } from './dateinput/interfaces/DateInputEventArguments';
 import { DatePickerProps } from './datepicker/interfaces/DatePickerProps';
-import { DatePickerChangeEvent } from './datepicker/interfaces/DatePickerEventArguments';
-import { TimePicker, TimePickerVue2, TimePickerProps, TimePickerChangeEvent } from './timepicker/TimePicker';
-import { DateRangePicker, DateRangePickerProps, DateRangePickerChangeEvent } from './daterangepicker/DateRangePicker';
+import { DatePickerChangeEvent, DatePickerOpenEvent, DatePickerCloseEvent } from './datepicker/interfaces/DatePickerEventArguments';
+import { TimePicker, TimePickerVue2, TimePickerProps, TimePickerChangeEvent, TimePickerOpenEvent, TimePickerCloseEvent } from './timepicker/TimePicker';
+import { DateRangePicker, DateRangePickerProps, DateRangePickerChangeEvent, DateRangePickerOpenEvent, DateRangePickerCloseEvent } from './daterangepicker/DateRangePicker';
 import { CalendarCell, CalendarCellVue2, CalendarCellProps } from './calendar/components/CalendarCell';
 import { CalendarWeekCell, CalendarWeekCellVue2, CalendarWeekCellProps } from './calendar/components/CalendarWeekCell';
 import { CalendarHeaderTitle, CalendarHeaderTitleVue2, CalendarHeaderTitleProps } from './calendar/components/CalendarHeaderTitle';
 import { ActiveView, SelectionRange, CalendarSettings, CalendarViewEnum } from './calendar/models/main';
 import { DateInputSettings, DateInputIncrementalSteps, DateInputFormatPlaceholder, DateInputCustomFormatPlaceholder } from './dateinput/models/main';
-import { DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerChangeEvent } from './datetimepicker/DateTimePicker';
+import { DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerChangeEvent, DateTimePickerOpenEvent, DateTimePickerCloseEvent } from './datetimepicker/DateTimePicker';
 import { DatePickerSettings } from './datepicker/models/main';
 import { DateTimePickerSettings } from './datetimepicker/models/main';
 import { TimePickerSettings } from './timepicker/models/main';
 import { DateRangePickerSettings, DateRangePickerPopupSettings, DateRangePickerCalendarSettings, DateRangePickerDateInputSettings } from './daterangepicker/models/main';
 import { ToggleButton, ToggleButtonVue2 } from './datepicker/ToggleButton';
 import { PickerWrap, PickerWrapVue2, PickerWrapProps } from './common/PickerWrap';
-export { PickerWrap, PickerWrapVue2, PickerWrapProps, ToggleButton, ToggleButtonVue2, ActiveView, Calendar, CalendarVue2, CalendarProps, CalendarSettings, CalendarViewEnum, CalendarChangeEvent, CalendarWeekCellClickEvent, CalendarCell, CalendarCellVue2, CalendarCellProps, CalendarWeekCell, CalendarWeekCellVue2, CalendarWeekCellProps, CalendarHeaderTitle, CalendarHeaderTitleVue2, CalendarHeaderTitleProps, DateInput, DateInputVue2, DateInputProps, DateInputSettings, DateInputChangeEvent, DateInputIncrementalSteps, DateInputFormatPlaceholder, DateInputCustomFormatPlaceholder, DatePicker, DatePickerVue2, DatePickerProps, DatePickerSettings, DatePickerChangeEvent, TimePicker, TimePickerVue2, TimePickerProps, TimePickerSettings, TimePickerChangeEvent, DateRangePicker, DateRangePickerProps, DateRangePickerSettings, DateRangePickerCalendarSettings, DateRangePickerDateInputSettings, DateRangePickerPopupSettings, DateRangePickerChangeEvent, DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerSettings, DateTimePickerChangeEvent, SelectionRange };
+export { PickerWrap, PickerWrapVue2, PickerWrapProps, ToggleButton, ToggleButtonVue2, ActiveView, Calendar, CalendarVue2, CalendarProps, CalendarSettings, CalendarViewEnum, CalendarChangeEvent, CalendarWeekCellClickEvent, CalendarCell, CalendarCellVue2, CalendarCellProps, CalendarWeekCell, CalendarWeekCellVue2, CalendarWeekCellProps, CalendarHeaderTitle, CalendarHeaderTitleVue2, CalendarHeaderTitleProps, DateInput, DateInputVue2, DateInputProps, DateInputSettings, DateInputChangeEvent, DateInputIncrementalSteps, DateInputFormatPlaceholder, DateInputCustomFormatPlaceholder, DatePicker, DatePickerVue2, DatePickerProps, DatePickerSettings, DatePickerChangeEvent, DatePickerOpenEvent, DatePickerCloseEvent, TimePicker, TimePickerVue2, TimePickerProps, TimePickerSettings, TimePickerChangeEvent, TimePickerOpenEvent, TimePickerCloseEvent, DateRangePicker, DateRangePickerProps, DateRangePickerSettings, DateRangePickerCalendarSettings, DateRangePickerDateInputSettings, DateRangePickerPopupSettings, DateRangePickerChangeEvent, DateRangePickerOpenEvent, DateRangePickerCloseEvent, DateTimePicker, DateTimePickerVue2, DateTimePickerProps, DateTimePickerSettings, DateTimePickerChangeEvent, DateTimePickerOpenEvent, DateTimePickerCloseEvent, SelectionRange };

package/dist/esm/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dateinputs',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1678855661,
+    publishDate: 1679996156,
     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/esm/timepicker/TimePicker.d.ts

@@ -16,6 +16,18 @@ export interface TimePickerChangeEvent {
     show: boolean;
     target: any;
 }
+/**
+ * The arguments for the `open` event of the TimePicker.
+ */
+export interface TimePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the TimePicker.
+ */
+export interface TimePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue TimePicker component]({% slug overview_timepicker %}).
  */

package/dist/esm/timepicker/TimePicker.js

@@ -43,7 +43,9 @@ var TimePickerVue2 = {
     'change': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   model: {
     event: 'changemodel'
@@ -568,6 +570,9 @@ var TimePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     mergeTime: function mergeTime(value) {
       return this.computedValue && value ? setTime(this.computedValue, value) : value;
@@ -580,7 +585,6 @@ var TimePickerVue2 = {
     },
     handleValueChange: function handleValueChange(event) {
       this.currentValue = cloneDate(event.value);
-      this.currentShow = false;
       this.valueDuringOnChange = event.value;
       this.showDuringOnChange = false;
       this.shouldFocusDateInput = true;
@@ -599,6 +603,7 @@ var TimePickerVue2 = {
       });
       this.valueDuringOnChange = undefined;
       this.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleFocus: function handleFocus(event) {
       this._oldShow = this.computedShow;

package/dist/npm/datepicker/DatePicker.js

@@ -45,7 +45,9 @@ var DatePickerVue2 = {
     'iconclick': null,
     'focus': null,
     'blur': null,
-    'keydown': null
+    'keydown': null,
+    'open': null,
+    'close': null
   },
   props: {
     defaultShow: {
@@ -296,6 +298,9 @@ var DatePickerVue2 = {
         return;
       }
       this.$data.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     mergeTime: function mergeTime(value) {
       return this.computedValue && value ? (0, utils_1.setTime)(value, this.computedValue) : value;
@@ -312,7 +317,6 @@ var DatePickerVue2 = {
     },
     handleValueChange: function handleValueChange(value, event) {
       this.$data.currentValue = (0, kendo_date_math_1.cloneDate)(value || undefined);
-      this.$data.currentShow = false;
       this.$data.valueDuringOnChange = value;
       this.$data.showDuringOnChange = false;
       this.$data.shouldFocusDateInput = true;
@@ -332,6 +336,7 @@ var DatePickerVue2 = {
       });
       this.$data.valueDuringOnChange = undefined;
       this.$data.showDuringOnChange = undefined;
+      this.setShow(false);
     },
     handleIconClick: function handleIconClick(event) {
       event.stopPropagation();
@@ -340,8 +345,8 @@ var DatePickerVue2 = {
         return;
       }
       this.$data.shouldFocusDateInput = true;
-      this.setShow(!this.computedShow);
       this.$emit('iconclick', event);
+      this.setShow(!this.computedShow);
     },
     handleIconMouseDown: function handleIconMouseDown(event) {
       event.stopPropagation();

package/dist/npm/datepicker/interfaces/DatePickerEventArguments.d.ts

@@ -8,3 +8,15 @@ export interface DatePickerChangeEvent {
     target: any;
     component: any;
 }
+/**
+ * The arguments for the `open` event of the DatePicker.
+ */
+export interface DatePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DatePicker.
+ */
+export interface DatePickerCloseEvent {
+    component: any;
+}

package/dist/npm/daterangepicker/DateRangePicker.d.ts

@@ -21,6 +21,18 @@ export interface DateRangePickerChangeEvent {
     target: any;
     component?: any;
 }
+/**
+ * The arguments for the `open` event of the DateRangePicker.
+ */
+export interface DateRangePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DateRangePicker.
+ */
+export interface DateRangePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue DateRangePicker component]({% slug overview_daterangepicker %}).
  */

package/dist/npm/daterangepicker/DateRangePicker.js

@@ -50,7 +50,9 @@ var DateRangePickerVue2 = {
     'changemodel': null,
     'update:modelValue': null,
     focus: null,
-    keydown: null
+    keydown: null,
+    'open': null,
+    'close': null
   },
   inject: {
     kendoLocalizationService: {
@@ -497,6 +499,9 @@ var DateRangePickerVue2 = {
         return;
       }
       this.currentShow = show;
+      this.$emit(show ? 'open' : 'close', {
+        component: this
+      });
     },
     handleReverseClick: function handleReverseClick(event) {
       var value = {

package/dist/npm/datetimepicker/DateTimePicker.d.ts

@@ -16,6 +16,18 @@ export interface DateTimePickerChangeEvent {
     show: boolean;
     target: any;
 }
+/**
+ * The arguments for the `open` event of the DateTimePicker.
+ */
+export interface DateTimePickerOpenEvent {
+    component: any;
+}
+/**
+ * The arguments for the `close` event of the DateTimePicker.
+ */
+export interface DateTimePickerCloseEvent {
+    component: any;
+}
 /**
  * Represents the props of the [Kendo UI for Vue DateTimePicker component]({% slug overview_datetimepicker %}).
  */