@progress/kendo-react-dateinputs 6.1.1 → 7.0.0-develop.1

package/dist/es/timepicker/TimePicker.js

@@ -1,618 +0,0 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { Popup } from '@progress/kendo-react-popup';
-import { cloneDate } from '@progress/kendo-date-math';
-import { classNames, guid, Keys, AsyncFocusBlur, createPropsContext, withPropsContext, kendoThemeMaps, canUseDOM } from '@progress/kendo-react-common';
-import { clockIcon } from '@progress/kendo-svg-icons';
-import { registerForLocalization, provideLocalizationService } from '@progress/kendo-react-intl';
-import { validatePackage } from '@progress/kendo-react-common';
-import { packageMetadata } from '../package-metadata';
-import { messages, toggleTimeSelector, toggleClock, timePickerSet, timePickerCancel } from '../messages';
-import { DateInput } from '../dateinput/DateInput';
-import { TimeSelector } from './TimeSelector';
-import { MIDNIGHT_DATE, MIN_TIME, MAX_TIME, setTime } from '../utils';
-import { isInRange, isSmallerThanMin, isBiggerThanMax } from './utils';
-import { PickerFloatingLabel } from '../hooks/usePickerFloatingLabel';
-import { Button } from '@progress/kendo-react-buttons';
-import { MOBILE_MEDIUM_DEVISE } from '../common/constants';
-import { AdaptiveMode } from '../common/AdaptiveMode';
-import { ActionSheetContent } from '@progress/kendo-react-layout';
-/** @hidden */
-var TimePickerWithoutContext = /** @class */ (function (_super) {
-    __extends(TimePickerWithoutContext, _super);
-    function TimePickerWithoutContext(props) {
-        var _this = _super.call(this, props) || this;
-        _this._popupId = guid();
-        _this._element = null;
-        _this._dateInput = React.createRef();
-        _this._timeSelector = null;
-        _this.shouldFocusDateInput = false;
-        _this.prevShow = false;
-        /**
-         * @hidden
-         */
-        _this.focus = function () {
-            if (_this.dateInput) {
-                _this.dateInput.focus();
-            }
-        };
-        _this.renderTimeSelector = function () {
-            var _a = _this.props, smoothScroll = _a.smoothScroll, cancelButton = _a.cancelButton, nowButton = _a.nowButton, disabled = _a.disabled, format = _a.format, steps = _a.steps;
-            return (React.createElement(TimeSelector, { ref: _this.setTimeSelectorRef, className: _this.mobileMode ? 'k-reset k-timeselector-lg' : '', mobileMode: _this.mobileMode, show: _this.show, cancelButton: cancelButton, disabled: disabled, nowButton: nowButton, format: format, min: _this.min, max: _this.max, steps: steps, smoothScroll: smoothScroll, value: _this.value, footer: _this.mobileMode ? false : true, handleTimeChange: _this.mobileMode && _this.handleTimeChange, onChange: _this.handleValueChange, onReject: _this.handleValueReject }));
-        };
-        _this.renderPopup = function () {
-            var _a = _this.popupSettings, popupClass = _a.popupClass, otherPopupSettings = __rest(_a, ["popupClass"]);
-            var popupClassNames = classNames('k-group k-reset', popupClass);
-            var popupProps = __assign({ popupClass: 'k-timepicker-popup', show: _this.show, animate: _this.element !== null, anchor: _this.element, className: popupClassNames, id: _this._popupId, anchorAlign: {
-                    horizontal: 'left',
-                    vertical: 'bottom'
-                }, popupAlign: {
-                    horizontal: 'left',
-                    vertical: 'top'
-                } }, otherPopupSettings);
-            return (_this.props.popup
-                ? React.createElement(_this.props.popup, __assign({}, popupProps), _this.renderTimeSelector())
-                : React.createElement(Popup, __assign({}, popupProps), _this.renderTimeSelector()));
-        };
-        _this.renderAdaptivePopup = function () {
-            var _a = _this.state.windowWidth, windowWidth = _a === void 0 ? 0 : _a;
-            var actionSheetProps = {
-                expand: _this.show,
-                onClose: _this.handleBlur,
-                adaptiveTitle: _this.props.adaptiveTitle,
-                windowWidth: windowWidth,
-                footer: {
-                    cancelText: _this.localizationService.toLanguageString(toggleClock, messages[timePickerCancel]),
-                    onCancel: _this.handleValueReject,
-                    applyText: _this.localizationService.toLanguageString(timePickerSet, messages[timePickerSet]),
-                    onApply: function (event) { return _this.handleValueChange(event); }
-                }
-            };
-            return (React.createElement(AdaptiveMode, __assign({}, actionSheetProps),
-                React.createElement(ActionSheetContent, { className: '!k-overflow-hidden' }, _this.renderTimeSelector())));
-        };
-        _this.setTimeSelectorRef = function (timeSelector) {
-            _this._timeSelector = timeSelector;
-        };
-        _this.nextValue = function (nextProps, nextState) {
-            return nextProps.value !== undefined
-                ? nextProps.value
-                : nextState.value;
-        };
-        _this.nextShow = function (nextProps, nextState) {
-            return nextProps.show !== undefined
-                ? nextProps.show
-                : nextState.show;
-        };
-        _this.handleInputValueChange = function (event) {
-            var value = _this.mergeTime(event.value);
-            _this.handleValueChange(__assign(__assign({}, event), { value: value }));
-        };
-        _this.handleTimeChange = function (date) {
-            _this.setState({ candidate: date.time });
-        };
-        _this.handleValueChange = function (event) {
-            _this.setState({
-                value: cloneDate(event.value || _this.state.candidate)
-            });
-            _this.valueDuringOnChange = event.value;
-            _this.showDuringOnChange = false;
-            _this.shouldFocusDateInput = true;
-            var onChange = _this.props.onChange;
-            var value = _this.value || _this.state.candidate;
-            if (onChange) {
-                onChange.call(undefined, {
-                    syntheticEvent: event.syntheticEvent,
-                    nativeEvent: event.nativeEvent,
-                    value: value,
-                    show: _this.show,
-                    target: _this
-                });
-            }
-            _this.valueDuringOnChange = undefined;
-            _this.showDuringOnChange = undefined;
-            _this.setShow(false);
-        };
-        _this.handleFocus = function () {
-            _this.setState({ focused: true });
-        };
-        _this.handleBlur = function () {
-            _this.setState({ focused: false });
-            _this.setShow(false);
-        };
-        _this.handleValueReject = function (_) {
-            _this.setShow(false);
-        };
-        _this.handleIconClick = function (_) {
-            if (_this.props.disabled) {
-                return;
-            }
-            _this.shouldFocusDateInput = true;
-            _this.setShow(!_this.show);
-        };
-        _this.handleIconMouseDown = function (event) {
-            event.preventDefault();
-        };
-        _this.handleKeyDown = function (event) {
-            var altKey = event.altKey, keyCode = event.keyCode;
-            if (keyCode === Keys.esc) {
-                _this.shouldFocusDateInput = true;
-                _this.setShow(false);
-                return;
-            }
-            if (altKey && (keyCode === Keys.up || keyCode === Keys.down)) {
-                event.preventDefault();
-                event.stopPropagation();
-                _this.shouldFocusDateInput = keyCode === Keys.up;
-                _this.setShow(keyCode === Keys.down);
-            }
-        };
-        validatePackage(packageMetadata);
-        _this.state = {
-            value: _this.props.defaultValue || TimePickerWithoutContext.defaultProps.defaultValue,
-            show: _this.props.defaultShow || TimePickerWithoutContext.defaultProps.defaultShow,
-            focused: false,
-            candidate: null
-        };
-        _this.normalizeTime = _this.normalizeTime.bind(_this);
-        _this.setShow = _this.setShow.bind(_this);
-        _this.mergeTime = _this.mergeTime.bind(_this);
-        return _this;
-    }
-    Object.defineProperty(TimePickerWithoutContext.prototype, "document", {
-        get: function () {
-            if (!canUseDOM) {
-                return;
-            }
-            // useful only for user actions
-            return (this.element && this.element.ownerDocument) || document;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "element", {
-        /**
-         * Gets the wrapping element of the TimePicker.
-         */
-        get: function () {
-            return this._element;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "dateInput", {
-        /**
-         * Gets the DateInput component inside the TimePicker component.
-         */
-        get: function () {
-            return this._dateInput.current;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "timeSelector", {
-        /**
-         * Gets the TimeSelector component inside the TimePicker component.
-         */
-        get: function () {
-            return this._timeSelector;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "value", {
-        /**
-         * Gets the value of the TimePicker.
-         */
-        get: function () {
-            var value = this.valueDuringOnChange !== undefined
-                ? this.valueDuringOnChange
-                : this.props.value !== undefined
-                    ? this.props.value
-                    : this.state.value;
-            return (value !== null) ? cloneDate(value) : null;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "show", {
-        /**
-         * Gets the popup state of the TimeSelector.
-         */
-        get: function () {
-            return this.showDuringOnChange !== undefined
-                ? this.showDuringOnChange
-                : this.props.show !== undefined
-                    ? this.props.show
-                    : this.state.show;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "name", {
-        /**
-         * Gets the `name` property of the TimePicker.
-         */
-        get: function () {
-            return this.props.name;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "validity", {
-        /**
-         * Represents the validity state into which the TimePicker is set.
-         */
-        get: function () {
-            var value = this.value && this.normalizeTime(this.value);
-            var min = this.normalizeTime(this.min);
-            var max = this.normalizeTime(this.max);
-            var inRange = isInRange(value, min, max);
-            var customError = this.props.validationMessage !== undefined;
-            var isValid = (!this.required || this.value !== null) && inRange;
-            var valid = this.props.valid !== undefined ? this.props.valid : isValid;
-            return {
-                customError: customError,
-                rangeOverflow: isBiggerThanMax(value, max),
-                rangeUnderflow: isSmallerThanMin(value, min),
-                valid: valid,
-                valueMissing: this.value === null
-            };
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "mobileMode", {
-        /**
-         * The mobile mode of the ComboBox.
-         */
-        get: function () {
-            var isAdaptive = this.state.windowWidth && this.state.windowWidth <= MOBILE_MEDIUM_DEVISE && this.props.adaptive;
-            return !!isAdaptive;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "validityStyles", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.props.validityStyles !== undefined
-                ? this.props.validityStyles
-                : TimePickerWithoutContext.defaultProps.validityStyles;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "required", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.props.required !== undefined
-                ? this.props.required
-                : TimePickerWithoutContext.defaultProps.required;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "popupSettings", {
-        get: function () {
-            return this.props.popupSettings || TimePickerWithoutContext.defaultProps.popupSettings;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "min", {
-        get: function () {
-            return this.props.min !== undefined ? this.props.min : TimePickerWithoutContext.defaultProps.min;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "max", {
-        get: function () {
-            return this.props.max !== undefined ? this.props.max : TimePickerWithoutContext.defaultProps.max;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "dateInputComp", {
-        get: function () {
-            return this.props.dateInput || TimePickerWithoutContext.defaultProps.dateInput;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(TimePickerWithoutContext.prototype, "localizationService", {
-        get: function () {
-            return provideLocalizationService(this);
-        },
-        enumerable: false,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.prototype.componentDidMount = function () {
-        var _a;
-        this.observerResize = canUseDOM && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this));
-        if (this.show) {
-            // If defaultShow is true during the initial render, the popup is not aligned.
-            this.forceUpdate();
-        }
-        if (((_a = this.document) === null || _a === void 0 ? void 0 : _a.body) && this.observerResize) {
-            this.observerResize.observe(this.document.body);
-        }
-    };
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.prototype.componentDidUpdate = function () {
-        if (this._timeSelector && this.show && !this.prevShow) {
-            this._timeSelector.focusActiveList();
-        }
-        else if (this.dateInput
-            && this.dateInput.element
-            && !this.show
-            && this.shouldFocusDateInput) {
-            this.dateInput.element.focus({ preventScroll: true });
-        }
-        this.prevShow = this.show;
-        this.shouldFocusDateInput = false;
-    };
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.prototype.componentWillUnmount = function () {
-        var _a;
-        if (((_a = this.document) === null || _a === void 0 ? void 0 : _a.body) && this.observerResize) {
-            this.observerResize.disconnect();
-        }
-    };
-    ;
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.prototype.render = function () {
-        var _this = this;
-        var _a = this.props, _b = _a.size, size = _b === void 0 ? TimePickerWithoutContext.defaultProps.size : _b, _c = _a.rounded, rounded = _c === void 0 ? TimePickerWithoutContext.defaultProps.rounded : _c, _d = _a.fillMode, fillMode = _d === void 0 ? TimePickerWithoutContext.defaultProps.fillMode : _d, disabled = _a.disabled, tabIndex = _a.tabIndex, title = _a.title, id = _a.id, className = _a.className, format = _a.format, formatPlaceholder = _a.formatPlaceholder, width = _a.width, name = _a.name, steps = _a.steps, validationMessage = _a.validationMessage, required = _a.required, validityStyles = _a.validityStyles, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy;
-        var isValid = !this.validityStyles || this.validity.valid;
-        var dateInputProps = {
-            disabled: disabled,
-            format: format,
-            formatPlaceholder: formatPlaceholder,
-            id: id,
-            ariaLabelledBy: ariaLabelledBy,
-            ariaDescribedBy: ariaDescribedBy,
-            max: this.normalizeTime(this.max),
-            min: this.normalizeTime(this.min),
-            name: name,
-            onChange: this.handleInputValueChange,
-            required: required,
-            steps: steps,
-            tabIndex: !this.show ? tabIndex : -1,
-            title: title,
-            valid: this.validity.valid,
-            validationMessage: validationMessage,
-            validityStyles: validityStyles,
-            value: this.value && this.normalizeTime(this.value),
-            label: undefined,
-            placeholder: !this.state.focused ? this.props.placeholder : null,
-            ariaHasPopup: 'dialog',
-            ariaExpanded: this.show,
-            size: null,
-            fillMode: null,
-            rounded: null,
-            readonly: this.mobileMode
-        };
-        var toggleClockMessage = this.localizationService.toLanguageString(toggleClock, messages[toggleClock]);
-        var toggleTimeMessage = this.localizationService
-            .toLanguageString(toggleTimeSelector, messages[toggleTimeSelector]);
-        var timepicker = (React.createElement(AsyncFocusBlur, { onFocus: this.handleFocus, onBlur: !this.mobileMode ? this.handleBlur : undefined, onSyncBlur: this.props.onBlur, onSyncFocus: this.props.onFocus }, function (_a) {
-            var _b;
-            var onFocus = _a.onFocus, onBlur = _a.onBlur;
-            return (React.createElement(React.Fragment, null,
-                React.createElement("div", { ref: function (span) { _this._element = span; }, className: classNames('k-input', 'k-timepicker', (_b = {},
-                        _b["k-input-".concat(kendoThemeMaps.sizeMap[size] || size)] = size,
-                        _b["k-rounded-".concat(kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded,
-                        _b["k-input-".concat(fillMode)] = fillMode,
-                        _b['k-invalid'] = !isValid,
-                        _b['k-required'] = _this.required,
-                        _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(Button, __assign({ tabIndex: -1, type: "button", icon: 'clock', svgIcon: 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()),
-                _this.mobileMode && _this.renderAdaptivePopup()));
-        }));
-        return this.props.label
-            ? (React.createElement(PickerFloatingLabel, { dateInput: this._dateInput, label: this.props.label, editorId: id, editorValid: isValid, editorDisabled: this.props.disabled, children: timepicker, style: { width: this.props.width } }))
-            : timepicker;
-    };
-    TimePickerWithoutContext.prototype.normalizeTime = function (date) {
-        return setTime(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 ? setTime(this.value, value) : value;
-    };
-    TimePickerWithoutContext.prototype.calculateMedia = function (entries) {
-        for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) {
-            var entry = entries_1[_i];
-            this.setState({ windowWidth: entry.target.clientWidth });
-        }
-        ;
-    };
-    ;
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.displayName = 'TimePicker';
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.propTypes = {
-        className: PropTypes.string,
-        cancelButton: PropTypes.bool,
-        nowButton: PropTypes.bool,
-        defaultShow: PropTypes.bool,
-        defaultValue: PropTypes.instanceOf(Date),
-        disabled: PropTypes.bool,
-        format: PropTypes.oneOfType([
-            PropTypes.string,
-            PropTypes.shape({
-                skeleton: PropTypes.string,
-                pattern: PropTypes.string,
-                date: PropTypes.oneOf(['short', 'medium', 'long', 'full']),
-                time: PropTypes.oneOf(['short', 'medium', 'long', 'full']),
-                datetime: PropTypes.oneOf(['short', 'medium', 'long', 'full']),
-                era: PropTypes.oneOf(['narrow', 'short', 'long']),
-                year: PropTypes.oneOf(['numeric', '2-digit']),
-                month: PropTypes.oneOf(['numeric', '2-digit', 'narrow', 'short', 'long']),
-                day: PropTypes.oneOf(['numeric', '2-digit']),
-                weekday: PropTypes.oneOf(['narrow', 'short', 'long']),
-                hour: PropTypes.oneOf(['numeric', '2-digit']),
-                hour12: PropTypes.bool,
-                minute: PropTypes.oneOf(['numeric', '2-digit']),
-                second: PropTypes.oneOf(['numeric', '2-digit']),
-                timeZoneName: PropTypes.oneOf(['short', 'long'])
-            })
-        ]),
-        formatPlaceholder: PropTypes.oneOfType([
-            PropTypes.oneOf(['wide', 'narrow', 'short', 'formatPattern']),
-            PropTypes.shape({
-                year: PropTypes.string,
-                month: PropTypes.string,
-                day: PropTypes.string,
-                hour: PropTypes.string,
-                minute: PropTypes.string,
-                second: PropTypes.string
-            })
-        ]),
-        id: PropTypes.string,
-        ariaLabelledBy: PropTypes.string,
-        ariaDescribedBy: PropTypes.string,
-        min: PropTypes.instanceOf(Date),
-        max: PropTypes.instanceOf(Date),
-        name: PropTypes.string,
-        popupSettings: PropTypes.shape({
-            animate: PropTypes.bool,
-            appendTo: PropTypes.any,
-            popupClass: PropTypes.string
-        }),
-        show: PropTypes.bool,
-        steps: PropTypes.shape({
-            hour: PropTypes.number,
-            minute: PropTypes.number,
-            second: PropTypes.number
-        }),
-        smoothScroll: PropTypes.bool,
-        tabIndex: PropTypes.number,
-        title: PropTypes.string,
-        value: PropTypes.instanceOf(Date),
-        width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-        validationMessage: PropTypes.string,
-        required: PropTypes.bool,
-        validate: PropTypes.bool,
-        valid: PropTypes.bool,
-        size: PropTypes.oneOf([null, 'small', 'medium', 'large']),
-        rounded: PropTypes.oneOf([null, 'small', 'medium', 'large', 'full']),
-        fillMode: PropTypes.oneOf([null, 'solid', 'flat', 'outline'])
-    };
-    /**
-     * @hidden
-     */
-    TimePickerWithoutContext.defaultProps = {
-        defaultShow: false,
-        defaultValue: null,
-        disabled: false,
-        format: 't',
-        max: MAX_TIME,
-        min: MIN_TIME,
-        popupSettings: {},
-        tabIndex: 0,
-        steps: {},
-        required: false,
-        validityStyles: true,
-        dateInput: DateInput,
-        size: 'medium',
-        rounded: 'medium',
-        fillMode: 'solid'
-    };
-    return TimePickerWithoutContext;
-}(React.Component));
-export { TimePickerWithoutContext };
-/**
- * Represents the PropsContext of the `TimePicker` component.
- * Used for global configuration of all `TimePicker` instances.
- *
- * For more information, refer to the [DateInputs Props Context]({% slug props-context_dateinputs %}) article.
- */
-export var TimePickerPropsContext = createPropsContext();
-/* eslint-disable @typescript-eslint/no-redeclare */
-/**
- * Represents the KendoReact TimePicker Component.
- *
- * Accepts properties of type [TimePicker]({% slug api_dateinputs_timepickerprops %}).
- * Obtaining the `ref` returns an object of type [TimePickerHandle]({% slug api_dateinputs_timepickerhandle %}).
- */
-export var TimePicker = withPropsContext(TimePickerPropsContext, TimePickerWithoutContext);
-TimePicker.displayName = 'KendoReactTimePicker';
-registerForLocalization(TimePickerWithoutContext);