@progress/kendo-react-dateinputs 5.18.0-dev.202309081432 → 5.18.0-dev.202309111325

package/dist/npm/timepicker/TimePicker.d.ts

@@ -15,6 +15,18 @@ export interface TimePickerChangeEvent {
     show: boolean;
     target: TimePicker;
 }
+/**
+ * The arguments for the `onOpen` event of the TimePicker.
+ */
+export interface TimePickerOpenEvent {
+    target: TimePicker;
+}
+/**
+ * The arguments for the `onClose` event of the TimePicker.
+ */
+export interface TimePickerCloseEvent {
+    target: TimePicker;
+}
 /**
  * Represents the props of the [KendoReact TimePicker component]({% slug overview_timepicker %}).
  */
@@ -27,6 +39,14 @@ export interface TimePickerProps extends TimePickerSettings, FormComponentProps
      * Fires each time the user selects a new value ([see example]({% slug controlled_timepicker %}#toc-controlling-the-date-value)).
      */
     onChange?: (event: TimePickerChangeEvent) => void;
+    /**
+     * Fires each time the popup is opened.
+     */
+    onOpen?: (event: TimePickerOpenEvent) => void;
+    /**
+     * Fires each time the popup is closed.
+     */
+    onClose?: (event: TimePickerCloseEvent) => void;
     /**
      * Specifies the value of the TimePicker ([see example]({% slug controlled_timepicker %}#toc-controlling-the-date-value)).
      *

package/dist/npm/timepicker/TimePicker.js

@@ -133,8 +133,7 @@ var TimePickerWithoutContext = /** @class */ (function (_super) {
         };
         _this.handleValueChange = function (event) {
             _this.setState({
-                value: (0, kendo_date_math_1.cloneDate)(event.value || _this.state.candidate),
-                show: false
+                value: (0, kendo_date_math_1.cloneDate)(event.value || _this.state.candidate)
             });
             _this.valueDuringOnChange = event.value;
             _this.showDuringOnChange = false;
@@ -152,6 +151,7 @@ var TimePickerWithoutContext = /** @class */ (function (_super) {
             }
             _this.valueDuringOnChange = undefined;
             _this.showDuringOnChange = undefined;
+            _this.setShow(false);
         };
         _this.handleFocus = function () {
             _this.setState({ focused: true });
@@ -463,7 +463,7 @@ var TimePickerWithoutContext = /** @class */ (function (_super) {
                         _b['k-disabled'] = _this.props.disabled,
                         _b), className), onKeyDown: _this.handleKeyDown, style: { width: width }, onFocus: onFocus, onBlur: onBlur, onClick: _this.mobileMode ? _this.handleIconClick : undefined },
                     React.createElement(_this.dateInputComp, __assign({ _ref: _this._dateInput, ariaRole: "combobox", ariaControls: _this._popupId }, dateInputProps)),
-                    React.createElement(kendo_react_buttons_1.Button, __assign({ tabIndex: -1, type: "button", icon: 'clock', svgIcon: kendo_svg_icons_1.clockIcon, onMouseDown: _this.handleIconMouseDown, onClick: _this.handleIconClick, title: toggleTimeMessage, className: "k-input-button", rounded: null }, {
+                    React.createElement(kendo_react_buttons_1.Button, __assign({ tabIndex: -1, type: "button", icon: 'clock', svgIcon: kendo_svg_icons_1.clockIcon, onMouseDown: _this.handleIconMouseDown, onClick: _this.mobileMode ? undefined : _this.handleIconClick, title: toggleTimeMessage, className: "k-input-button", rounded: null }, {
                         'aria-label': toggleClockMessage
                     })),
                     !_this.mobileMode && _this.renderPopup()),
@@ -477,10 +477,21 @@ var TimePickerWithoutContext = /** @class */ (function (_super) {
         return (0, utils_1.setTime)(utils_1.MIDNIGHT_DATE, date);
     };
     TimePickerWithoutContext.prototype.setShow = function (show) {
+        var _a = this.props, onOpen = _a.onOpen, onClose = _a.onClose;
         if (this.show === show) {
             return;
         }
         this.setState({ show: show });
+        if (show && onOpen) {
+            onOpen.call(undefined, {
+                target: this
+            });
+        }
+        if (!show && onClose) {
+            onClose.call(undefined, {
+                target: this
+            });
+        }
     };
     TimePickerWithoutContext.prototype.mergeTime = function (value) {
         return this.value && value ? (0, utils_1.setTime)(this.value, value) : value;