@wavemaker/app-ng-runtime 11.8.0-rc.5666 → 11.8.0-rc.5668

package/components/input/epoch/bundles/index.umd.js

@@ -1,3138 +0,0 @@
-(function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('ngx-bootstrap/datepicker'), require('ngx-bootstrap/dropdown'), require('ngx-bootstrap/timepicker'), require('@wm/components/base'), require('@wm/core'), require('@wm/components/input'), require('ngx-bootstrap/modal'), require('lodash-es'), require('imask'), require('angular-imask')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@angular/forms', 'ngx-bootstrap/datepicker', 'ngx-bootstrap/dropdown', 'ngx-bootstrap/timepicker', '@wm/components/base', '@wm/core', '@wm/components/input', 'ngx-bootstrap/modal', 'lodash-es', 'imask', 'angular-imask'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wm = global.wm || {}, global.wm.components = global.wm.components || {}, global.wm.components.input = global.wm.components.input || {}, global.wm.components.input.epoch = {}), global.ng.core, global.ng.common, global.ng.forms, global.datepicker, global.dropdown, global.timepicker, global.wm.components.base, global.wm.core, global.wm.components.input, global.modal, global._, global.IMask, global.angularIMask));
-})(this, (function (exports, i0, i2, i5, i3, i4$1, i6, base, i1$1, input, i1, lodashEs, IMask, i4) { 'use strict';
-
-    function _interopNamespaceDefault(e) {
-        var n = Object.create(null);
-        if (e) {
-            Object.keys(e).forEach(function (k) {
-                if (k !== 'default') {
-                    var d = Object.getOwnPropertyDescriptor(e, k);
-                    Object.defineProperty(n, k, d.get ? d : {
-                        enumerable: true,
-                        get: function () { return e[k]; }
-                    });
-                }
-            });
-        }
-        n.default = e;
-        return Object.freeze(n);
-    }
-
-    var i0__namespace = /*#__PURE__*/_interopNamespaceDefault(i0);
-    var i2__namespace = /*#__PURE__*/_interopNamespaceDefault(i2);
-    var i5__namespace = /*#__PURE__*/_interopNamespaceDefault(i5);
-    var i3__namespace = /*#__PURE__*/_interopNamespaceDefault(i3);
-    var i4$1__namespace = /*#__PURE__*/_interopNamespaceDefault(i4$1);
-    var i6__namespace = /*#__PURE__*/_interopNamespaceDefault(i6);
-    var i1$1__namespace = /*#__PURE__*/_interopNamespaceDefault(i1$1);
-    var i1__namespace = /*#__PURE__*/_interopNamespaceDefault(i1);
-    var i4__namespace = /*#__PURE__*/_interopNamespaceDefault(i4);
-
-    const _c0$4 = ["*"];
-    function PickerComponent_div_6_Template(rf, ctx) { if (rf & 1) {
-        i0__namespace.ɵɵelementStart(0, "div", 5);
-        i0__namespace.ɵɵtext(1);
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const option_r1 = ctx.$implicit;
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵtextInterpolate1(" ", option_r1.label, " ");
-    } }
-    class PickerGroupComponent {
-        static { this.ɵfac = function PickerGroupComponent_Factory(t) { return new (t || PickerGroupComponent)(); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: PickerGroupComponent, selectors: [["wm-pickergroup"]], ngContentSelectors: _c0$4, decls: 2, vars: 0, consts: [[1, "app-picker-group"]], template: function PickerGroupComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵprojectionDef();
-                i0__namespace.ɵɵelementStart(0, "div", 0);
-                i0__namespace.ɵɵprojection(1);
-                i0__namespace.ɵɵelementEnd();
-            } }, encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(PickerGroupComponent, [{
-            type: i0.Component,
-            args: [{
-                    selector: 'wm-pickergroup',
-                    template: `
-        <div class="app-picker-group">
-            <ng-content></ng-content>
-        </div>
-    `
-                }]
-        }], null, null); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(PickerGroupComponent, { className: "PickerGroupComponent", filePath: "picker/picker.component.ts", lineNumber: 13 }); })();
-    class PickerComponent {
-        constructor(inj) {
-            this.inj = inj;
-            this.change = new i0.EventEmitter();
-            this._selectedIndex = 0;
-            this._options = [];
-            this.noOfEmptyElements = 2;
-            this.$el = $(inj.get(i0.ElementRef).nativeElement);
-        }
-        set selectedValue(s) {
-            this._selectedValue = s;
-            this.reRender();
-        }
-        get selectedValue() {
-            return this._selectedValue;
-        }
-        set options(opts) {
-            this._options = opts.map(o => ({
-                label: o.label,
-                value: o.value !== undefined ? o.value : o.label
-            }));
-            this.reRender();
-        }
-        get options() {
-            return this._options;
-        }
-        reRender() {
-            this._selectedIndex = this.options.findIndex(o => o.value === this.selectedValue);
-            this.pickerAnimator?.select(this._selectedIndex + this.noOfEmptyElements);
-        }
-        set selectedIndex(i) {
-            this._selectedIndex = i;
-            this._selectedValue = this.options[i].value;
-            this.change.emit(this.options[i]);
-        }
-        get selectedIndex() {
-            return this._selectedIndex;
-        }
-        ngAfterViewInit() {
-            this.pickerAnimator = new PickerAnimator(this);
-        }
-        static { this.ɵfac = function PickerComponent_Factory(t) { return new (t || PickerComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: PickerComponent, selectors: [["wm-picker"]], inputs: { selectedValue: "selectedValue", options: "options" }, outputs: { change: "change" }, decls: 12, vars: 1, consts: [[1, "app-picker"], [1, "app-picker-option-container"], [1, "app-picker-option", "app-picker-empty-option"], ["class", "app-picker-option", 4, "ngFor", "ngForOf"], [1, "app-picker-ruler"], [1, "app-picker-option"]], template: function PickerComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2);
-                i0__namespace.ɵɵtext(3, "E");
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(4, "div", 2);
-                i0__namespace.ɵɵtext(5, "E");
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵtemplate(6, PickerComponent_div_6_Template, 2, 1, "div", 3);
-                i0__namespace.ɵɵelementStart(7, "div", 2);
-                i0__namespace.ɵɵtext(8, "E");
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(9, "div", 2);
-                i0__namespace.ɵɵtext(10, "E");
-                i0__namespace.ɵɵelementEnd()();
-                i0__namespace.ɵɵelement(11, "div", 4);
-                i0__namespace.ɵɵelementEnd();
-            } if (rf & 2) {
-                i0__namespace.ɵɵadvance(6);
-                i0__namespace.ɵɵproperty("ngForOf", ctx.options);
-            } }, dependencies: [i2__namespace.NgForOf], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(PickerComponent, [{
-            type: i0.Component,
-            args: [{
-                    selector: 'wm-picker',
-                    template: `
-        <div class="app-picker">
-            <div class="app-picker-option-container">
-                <div class="app-picker-option app-picker-empty-option">E</div>
-                <div class="app-picker-option app-picker-empty-option">E</div>
-                <div *ngFor="let option of options; index as i;" class="app-picker-option">
-                    {{option.label}}
-                </div>
-                <div class="app-picker-option app-picker-empty-option">E</div>
-                <div class="app-picker-option app-picker-empty-option">E</div>
-            </div>
-            <div class="app-picker-ruler"></div>
-        </div>
-    `
-                }]
-        }], () => [{ type: i0__namespace.Injector }], { change: [{
-                type: i0.Output
-            }], selectedValue: [{
-                type: i0.Input
-            }], options: [{
-                type: i0.Input
-            }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(PickerComponent, { className: "PickerComponent", filePath: "picker/picker.component.ts", lineNumber: 34 }); })();
-    class PickerAnimator {
-        constructor(picker) {
-            this.picker = picker;
-            let lastSelectedIndex = picker.selectedIndex + picker.noOfEmptyElements;
-            const computeIndex = (d) => lastSelectedIndex + Math.floor(d / 16);
-            this.select(lastSelectedIndex);
-            this.getElement().swipey({
-                'direction': $.fn.swipey.DIRECTIONS.VERTICAL,
-                'threshold': 10,
-                'target': picker.$el,
-                'onSwipe': (e, data) => {
-                    this.select(computeIndex(-1 * data.length));
-                },
-                'onSwipeEnd': (e, data) => {
-                    const nextSelectedIndex = computeIndex(-1 * data.length);
-                    this.select(nextSelectedIndex);
-                    lastSelectedIndex = picker.selectedIndex + picker.noOfEmptyElements;
-                }
-            });
-        }
-        getElement() {
-            return this.picker.$el.find('.app-picker-option-container:first');
-        }
-        getOptionElements() {
-            return this.getElement().find('.app-picker-option');
-        }
-        select(selectedIndex) {
-            const options = this.getOptionElements();
-            if (selectedIndex < this.picker.noOfEmptyElements
-                || selectedIndex >= options.length - this.picker.noOfEmptyElements) {
-                return;
-            }
-            this.getElement()
-                .find('.app-picker-option.app-picker-option-selected')
-                .removeClass('app-picker-option-selected');
-            options.eq(selectedIndex).addClass('app-picker-option-selected');
-            this.picker.selectedIndex = selectedIndex - this.picker.noOfEmptyElements;
-            const minIndex = selectedIndex - this.picker.noOfEmptyElements;
-            const maxIndex = selectedIndex + this.picker.noOfEmptyElements;
-            options.each((i, e) => {
-                if (i >= minIndex && i <= maxIndex) {
-                    const rotation = (i - selectedIndex) * 30;
-                    const opacity = 1 - Math.abs(i - selectedIndex) * 0.3;
-                    $(e).css({
-                        transform: 'perspective(500px) rotateX(' + rotation + 'deg)',
-                        opacity: opacity
-                    }).show();
-                }
-                else {
-                    $(e).hide();
-                }
-            });
-        }
-    }
-
-    const _c0$3 = ["datetimepickerTemplate"];
-    function DateTimePickerComponent_ng_template_0_bs_datepicker_inline_3_Template(rf, ctx) { if (rf & 1) {
-        const _r2 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "bs-datepicker-inline", 11);
-        i0__namespace.ɵɵlistener("bsValueChange", function DateTimePickerComponent_ng_template_0_bs_datepicker_inline_3_Template_bs_datepicker_inline_bsValueChange_0_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(2); return i0__namespace.ɵɵresetView(ctx_r2.onDateUpdate($event)); });
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵproperty("bsConfig", ctx_r2.bsDatepickerConfig)("datesDisabled", ctx_r2.excludedDatesToDisable)("bsValue", ctx_r2.changedValue);
-    } }
-    function DateTimePickerComponent_ng_template_0_wm_timepicker_4_Template(rf, ctx) { if (rf & 1) {
-        const _r4 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "wm-timepicker", 12);
-        i0__namespace.ɵɵlistener("change", function DateTimePickerComponent_ng_template_0_wm_timepicker_4_Template_wm_timepicker_change_0_listener($event) { i0__namespace.ɵɵrestoreView(_r4); const ctx_r2 = i0__namespace.ɵɵnextContext(2); return i0__namespace.ɵɵresetView(ctx_r2.onTimeUpdate($event)); });
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵproperty("value", ctx_r2.changedValue)("min", ctx_r2.minTime)("max", ctx_r2.maxTime);
-    } }
-    function DateTimePickerComponent_ng_template_0_button_8_Template(rf, ctx) { if (rf & 1) {
-        const _r5 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "button", 13);
-        i0__namespace.ɵɵlistener("click", function DateTimePickerComponent_ng_template_0_button_8_Template_button_click_0_listener() { i0__namespace.ɵɵrestoreView(_r5); const ctx_r2 = i0__namespace.ɵɵnextContext(2); return i0__namespace.ɵɵresetView(ctx_r2.setToday()); });
-        i0__namespace.ɵɵtext(1);
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵtextInterpolate(ctx_r2.appLocale.LABEL_TODAY_DATE || "Today");
-    } }
-    function DateTimePickerComponent_ng_template_0_button_9_Template(rf, ctx) { if (rf & 1) {
-        const _r6 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "button", 14);
-        i0__namespace.ɵɵlistener("click", function DateTimePickerComponent_ng_template_0_button_9_Template_button_click_0_listener() { i0__namespace.ɵɵrestoreView(_r6); const ctx_r2 = i0__namespace.ɵɵnextContext(2); return i0__namespace.ɵɵresetView(ctx_r2.onOkClick()); });
-        i0__namespace.ɵɵtext(1);
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵtextInterpolate(ctx_r2.appLocale.LABEL_OK || "Ok");
-    } }
-    function DateTimePickerComponent_ng_template_0_Template(rf, ctx) { if (rf & 1) {
-        const _r1 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "div", 1)(1, "div", 2);
-        i0__namespace.ɵɵelement(2, "div", 3);
-        i0__namespace.ɵɵtemplate(3, DateTimePickerComponent_ng_template_0_bs_datepicker_inline_3_Template, 1, 3, "bs-datepicker-inline", 4)(4, DateTimePickerComponent_ng_template_0_wm_timepicker_4_Template, 1, 3, "wm-timepicker", 5);
-        i0__namespace.ɵɵelementStart(5, "span", 6);
-        i0__namespace.ɵɵtext(6);
-        i0__namespace.ɵɵelementEnd()();
-        i0__namespace.ɵɵelementStart(7, "div", 7);
-        i0__namespace.ɵɵtemplate(8, DateTimePickerComponent_ng_template_0_button_8_Template, 2, 1, "button", 8)(9, DateTimePickerComponent_ng_template_0_button_9_Template, 2, 1, "button", 9);
-        i0__namespace.ɵɵelementStart(10, "button", 10);
-        i0__namespace.ɵɵlistener("click", function DateTimePickerComponent_ng_template_0_Template_button_click_10_listener() { i0__namespace.ɵɵrestoreView(_r1); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r2.clear()); });
-        i0__namespace.ɵɵtext(11);
-        i0__namespace.ɵɵelementEnd()()();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵadvance(3);
-        i0__namespace.ɵɵproperty("ngIf", ctx_r2.mode === "DATE_TIME" || ctx_r2.mode === "DATE");
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("ngIf", ctx_r2.mode === "DATE_TIME" || ctx_r2.mode === "TIME");
-        i0__namespace.ɵɵadvance(2);
-        i0__namespace.ɵɵtextInterpolate1(" ", ctx_r2.getDateLabel(), " ");
-        i0__namespace.ɵɵadvance(2);
-        i0__namespace.ɵɵproperty("ngIf", ctx_r2.mode === "DATE_TIME" || ctx_r2.mode === "DATE");
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("ngIf", ctx_r2.mode === "DATE_TIME" || ctx_r2.mode === "TIME");
-        i0__namespace.ɵɵadvance(2);
-        i0__namespace.ɵɵtextInterpolate(ctx_r2.appLocale.LABEL_CLEAR_DATE || "Clear");
-    } }
-    class DateTimePickerComponent {
-        constructor(inj, bsModalService) {
-            this.inj = inj;
-            this.bsModalService = bsModalService;
-            this.isDateOpen = true;
-            this.isTimeOpen = false;
-            this.mode = 'DATE_TIME';
-            this.placement = 'MODAL';
-            this.change = new i0.EventEmitter();
-            this._value = new Date();
-            this.changedValue = null;
-            this.appLocale = inj.get(i1$1.App).appLocale || {};
-        }
-        set value(d) {
-            d = d || new Date();
-            this._value = d;
-            this.changedValue = d;
-        }
-        set bsDatepickerConfig(config) {
-            this._bsDatepickerConfig = config;
-            this._bsDatepickerConfig.showClearButton = false;
-            this._bsDatepickerConfig.showTodayButton = false;
-        }
-        set excludedDaysToDisable(v) {
-            this._bsDatepickerConfig.daysDisabled = v;
-        }
-        get bsDatepickerConfig() {
-            return this._bsDatepickerConfig;
-        }
-        set displayFormat(format) {
-            if (format) {
-                this._displayFormat = format.replace(/y/g, "Y").replace(/d/g, "D").replace("a", "A");
-            }
-        }
-        validateSelectedDate() {
-            if (!this.changedValue) {
-                return true;
-            }
-            const cd = moment(this.changedValue);
-            const minDate = this._bsDatepickerConfig?.minDate;
-            const maxDate = this._bsDatepickerConfig?.maxDate;
-            if (minDate
-                && ((this.mode === 'DATE'
-                    && moment(minDate).startOf('day').toDate() > this.changedValue)
-                    || (this.mode !== 'DATE'
-                        && minDate > this.changedValue))) {
-                return false;
-            }
-            if (maxDate
-                && ((this.mode === 'DATE'
-                    && moment(maxDate).endOf('day').toDate() < this.changedValue)
-                    || (this.mode !== 'DATE'
-                        && maxDate < this.changedValue))) {
-                return false;
-            }
-            if (this._bsDatepickerConfig?.daysDisabled?.indexOf(cd.day()) >= 0) {
-                return false;
-            }
-            const cdSt = cd.startOf('day').toDate().getTime();
-            if (this.excludedDatesToDisable?.find(d => d.getTime() === cdSt)) {
-                return false;
-            }
-            return true;
-        }
-        get displayFormat() {
-            if (this._displayFormat) {
-                return this._displayFormat;
-            }
-        }
-        /**
-         * This method is used to highlight the current date
-         */
-        hightlightToday() {
-            const toDay = new Date().getDate().toString();
-            lodashEs.filter($(`body > modal-container .date-picker-modal span:contains(${toDay})`)
-                .not('.is-other-month,.current-date'), (obj) => {
-                if ($(obj).text() === toDay) {
-                    $(obj).addClass('current-date text-info');
-                }
-            });
-        }
-        hideOnClick() {
-            $('body>modal-container .date-picker-modal .app-datetime-picker')
-                .click(($event) => $event.stopPropagation());
-            $('body>modal-container .date-picker-modal').click(() => this.onCancelClick());
-        }
-        getDateLabel() {
-            return moment(this.changedValue).format(this.displayFormat);
-        }
-        openDatePicker() {
-            this.isTimeOpen = false;
-            this.isDateOpen = true;
-        }
-        openTimePicker() {
-            this.isTimeOpen = true;
-            this.isDateOpen = false;
-        }
-        onDateUpdate(newVal) {
-            const oldVal = this.changedValue;
-            if (this.mode === 'DATE') {
-                newVal.setHours(0);
-                newVal.setMinutes(0);
-                newVal.setSeconds(0);
-                newVal.setMilliseconds(0);
-            }
-            else if (oldVal && newVal) {
-                newVal.setHours(oldVal.getHours());
-                newVal.setMinutes(oldVal.getMinutes());
-                newVal.setSeconds(oldVal.getSeconds());
-                newVal.setMilliseconds(oldVal.getMilliseconds());
-            }
-            this.changedValue = newVal;
-            if (this.mode === 'DATE'
-                && oldVal !== newVal
-                && this.validateSelectedDate()) {
-                this.onOkClick();
-            }
-        }
-        onTimeUpdate(newVal) {
-            this.changedValue = newVal;
-        }
-        show() {
-            this.reset();
-            this.modalRef = this.bsModalService.show(this.datetimepickerTemplate, {
-                animated: true,
-                backdrop: 'static',
-                class: 'date-picker-modal modal-dialog-centered'
-            });
-            setTimeout(() => { this.hideOnClick(); }, 500);
-        }
-        clear() {
-            this.changedValue = null;
-            this.triggerChange();
-            this.hideModal();
-        }
-        setToday() {
-            const today = moment().startOf('day').toDate();
-            this.onDateUpdate(today);
-        }
-        reset() {
-            this.changedValue = this._value;
-        }
-        hideModal() {
-            if (this.modalRef?.id) {
-                this.bsModalService.hide(this.modalRef.id);
-            }
-        }
-        onCancelClick() {
-            this.changedValue = this._value;
-            this.hideModal();
-        }
-        onOkClick() {
-            if (this.validateSelectedDate()) {
-                this.triggerChange();
-            }
-            this.hideModal();
-        }
-        triggerChange() {
-            if (this.value !== this.changedValue) {
-                this.change.emit(this.changedValue);
-            }
-        }
-        ngAfterViewInit() {
-        }
-        ngOnDestroy() {
-            this.hideModal();
-        }
-        static { this.ɵfac = function DateTimePickerComponent_Factory(t) { return new (t || DateTimePickerComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i1__namespace.BsModalService)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: DateTimePickerComponent, selectors: [["wm-datetimepicker"]], viewQuery: function DateTimePickerComponent_Query(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵviewQuery(_c0$3, 7);
-            } if (rf & 2) {
-                let _t;
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.datetimepickerTemplate = _t.first);
-            } }, inputs: { mode: "mode", placement: "placement", _bsDatepickerConfig: [i0__namespace.ɵɵInputFlags.None, "config", "_bsDatepickerConfig"], minTime: "minTime", maxTime: "maxTime", _displayFormat: "_displayFormat", excludedDatesToDisable: "excludedDatesToDisable", value: "value", bsDatepickerConfig: [i0__namespace.ɵɵInputFlags.None, "config", "bsDatepickerConfig"], excludedDaysToDisable: "excludedDaysToDisable", displayFormat: "displayFormat" }, outputs: { change: "change" }, decls: 2, vars: 0, consts: [["datetimepickerTemplate", ""], [1, "app-datetime-picker"], [1, "modal-body"], [1, "mobile-datetime-picker-options"], ["bsDatepicker", "", 3, "bsConfig", "datesDisabled", "bsValue", "bsValueChange", 4, "ngIf"], [3, "value", "min", "max", "change", 4, "ngIf"], [1, "text-primary", "date-picker-value"], [1, "modal-footer"], ["class", "btn btn-secondary today-btn", 3, "click", 4, "ngIf"], ["class", "btn btn-primary pull-right ok-btn", 3, "click", 4, "ngIf"], [1, "btn", "btn-secondary", "pull-right", "clear-btn", 3, "click"], ["bsDatepicker", "", 3, "bsValueChange", "bsConfig", "datesDisabled", "bsValue"], [3, "change", "value", "min", "max"], [1, "btn", "btn-secondary", "today-btn", 3, "click"], [1, "btn", "btn-primary", "pull-right", "ok-btn", 3, "click"]], template: function DateTimePickerComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵtemplate(0, DateTimePickerComponent_ng_template_0_Template, 12, 6, "ng-template", null, 0, i0__namespace.ɵɵtemplateRefExtractor);
-            } }, dependencies: () => [i2__namespace.NgIf, i3__namespace.BsDatepickerDirective, i3__namespace.BsDatepickerInlineDirective, TimePickerComponent], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(DateTimePickerComponent, [{
-            type: i0.Component,
-            args: [{
-                    selector: 'wm-datetimepicker',
-                    template: `
-    <ng-template #datetimepickerTemplate>
-        <div class="app-datetime-picker">
-            <div class="modal-body">
-                <div class="mobile-datetime-picker-options">
-
-                </div>
-                <bs-datepicker-inline
-                    [bsConfig]="bsDatepickerConfig"
-                    [datesDisabled]="excludedDatesToDisable"
-                    bsDatepicker
-                    [bsValue]="changedValue"
-                    (bsValueChange)="onDateUpdate($event)"
-                    *ngIf="mode === 'DATE_TIME' || mode === 'DATE'">
-                </bs-datepicker-inline>
-                <wm-timepicker
-                    [value]="changedValue"
-                    [min]="minTime"
-                    [max]="maxTime"
-                    (change)="onTimeUpdate($event)"
-                    *ngIf="mode === 'DATE_TIME' || mode === 'TIME'"></wm-timepicker>
-                <span class="text-primary date-picker-value">
-                    {{getDateLabel()}}
-                </span>
-            </div>
-            <div class="modal-footer">
-                <button
-                    *ngIf="mode === 'DATE_TIME' || mode === 'DATE'"
-                    class="btn btn-secondary today-btn"
-                    (click)="setToday()">{{appLocale.LABEL_TODAY_DATE || "Today" }}</button>
-                <button
-                    class="btn btn-primary pull-right ok-btn"
-                    *ngIf="mode === 'DATE_TIME' || mode === 'TIME'"
-                    (click)="onOkClick()">{{appLocale.LABEL_OK || "Ok" }}</button>
-                <button
-                    class="btn btn-secondary pull-right clear-btn"
-                    (click)="clear()">{{appLocale.LABEL_CLEAR_DATE || "Clear" }}</button>
-            </div>
-        </div>
-    </ng-template>
-    `
-                }]
-        }], () => [{ type: i0__namespace.Injector }, { type: i1__namespace.BsModalService }], { datetimepickerTemplate: [{
-                type: i0.ViewChild,
-                args: ['datetimepickerTemplate', { static: true }]
-            }], mode: [{
-                type: i0.Input
-            }], placement: [{
-                type: i0.Input
-            }], _bsDatepickerConfig: [{
-                type: i0.Input,
-                args: ["config"]
-            }], minTime: [{
-                type: i0.Input
-            }], maxTime: [{
-                type: i0.Input
-            }], _displayFormat: [{
-                type: i0.Input
-            }], change: [{
-                type: i0.Output
-            }], excludedDatesToDisable: [{
-                type: i0.Input
-            }], value: [{
-                type: i0.Input
-            }], bsDatepickerConfig: [{
-                type: i0.Input,
-                args: ["config"]
-            }], excludedDaysToDisable: [{
-                type: i0.Input
-            }], displayFormat: [{
-                type: i0.Input
-            }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(DateTimePickerComponent, { className: "DateTimePickerComponent", filePath: "date-time/date-time-picker.component.ts", lineNumber: 54 }); })();
-    class TimePickerComponent {
-        constructor(inj) {
-            this.inj = inj;
-            this.options = {
-                hour: [],
-                minute: [],
-                second: [],
-                meridian: ['AM', 'PM']
-            };
-            this.value = new Date();
-            this.min = null;
-            this.max = null;
-            this.change = new i0.EventEmitter();
-            this.options.hour = this.populateNumbers(0, 23);
-            this.options.minute = this.populateNumbers(0, 59);
-            this.options.second = this.populateNumbers(0, 59);
-        }
-        populateNumbers(start, to) {
-            const arr = [];
-            for (let i = start; i <= to; i++) {
-                arr.push({
-                    label: (i < 10 ? '0' : '') + i,
-                    value: i
-                });
-            }
-            return arr;
-        }
-        set({ index, value }, unit) {
-            if (unit === 'HOUR') {
-                this.value = moment(this.value).hour(parseInt(value)).toDate();
-            }
-            else if (unit === 'MINUTE') {
-                this.value = moment(this.value).minute(parseInt(value)).toDate();
-            }
-            else if (unit === 'SECOND') {
-                this.value = moment(this.value).second(parseInt(value)).toDate();
-            }
-            else if (unit === 'MERIDIAN') {
-                this.value = moment(this.value).minute(value).toDate();
-            }
-            if (this.min && this.value < this.min) {
-                this.value = this.min;
-            }
-            if (this.max && this.value > this.max) {
-                this.value = this.max;
-            }
-            this.change.emit(this.value);
-        }
-        get hour() {
-            return moment(this.value).hour();
-        }
-        get minute() {
-            return moment(this.value).minute();
-        }
-        get second() {
-            return moment(this.value).second();
-        }
-        get meridian() {
-            return 'AM';
-        }
-        onDateUpdate(newVal) {
-            debugger;
-        }
-        ngAfterViewInit() {
-        }
-        static { this.ɵfac = function TimePickerComponent_Factory(t) { return new (t || TimePickerComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: TimePickerComponent, selectors: [["wm-timepicker"]], inputs: { value: "value", min: "min", max: "max" }, outputs: { change: "change" }, decls: 8, vars: 6, consts: [[3, "change", "options", "selectedValue"], [1, "app-time-separator"]], template: function TimePickerComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵelementStart(0, "wm-pickergroup")(1, "wm-picker", 0);
-                i0__namespace.ɵɵlistener("change", function TimePickerComponent_Template_wm_picker_change_1_listener($event) { return ctx.set($event, "HOUR"); });
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(2, "span", 1);
-                i0__namespace.ɵɵtext(3, ":");
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(4, "wm-picker", 0);
-                i0__namespace.ɵɵlistener("change", function TimePickerComponent_Template_wm_picker_change_4_listener($event) { return ctx.set($event, "MINUTE"); });
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(5, "span", 1);
-                i0__namespace.ɵɵtext(6, ":");
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(7, "wm-picker", 0);
-                i0__namespace.ɵɵlistener("change", function TimePickerComponent_Template_wm_picker_change_7_listener($event) { return ctx.set($event, "SECOND"); });
-                i0__namespace.ɵɵelementEnd()();
-            } if (rf & 2) {
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("options", ctx.options.hour)("selectedValue", ctx.hour);
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("options", ctx.options.minute)("selectedValue", ctx.minute);
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("options", ctx.options.minute)("selectedValue", ctx.second);
-            } }, dependencies: [PickerComponent, PickerGroupComponent], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TimePickerComponent, [{
-            type: i0.Component,
-            args: [{
-                    selector: 'wm-timepicker',
-                    template: `
-        <wm-pickergroup>
-            <wm-picker
-                [options]="options.hour"
-                [selectedValue]="hour"
-                (change)="set($event, 'HOUR')"></wm-picker>
-            <span class="app-time-separator">:</span>
-            <wm-picker
-                [options]="options.minute"
-                [selectedValue]="minute"
-                (change)="set($event, 'MINUTE')"></wm-picker>
-            <span class="app-time-separator">:</span>
-            <wm-picker
-                [options]="options.minute"
-                [selectedValue]="second"
-                (change)="set($event, 'SECOND')"></wm-picker>
-        </wm-pickergroup>
-    `
-                }]
-        }], () => [{ type: i0__namespace.Injector }], { value: [{
-                type: i0.Input
-            }], min: [{
-                type: i0.Input
-            }], max: [{
-                type: i0.Input
-            }], change: [{
-                type: i0.Output
-            }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(TimePickerComponent, { className: "TimePickerComponent", filePath: "date-time/date-time-picker.component.ts", lineNumber: 305 }); })();
-
-    const CURRENT_DATE$2 = 'CURRENT_DATE';
-    const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
-    const DATEPICKER_DROPDOWN_OPTIONS = {
-        BUTTON: 'button',
-        DEFAULT: 'default'
-    };
-    const DATAENTRYMODE_DROPDOWN_OPTIONS = {
-        PICKER: 'picker',
-        DEFAULT: 'default'
-    };
-    // Providing meridians to the timepicker baesd on selected locale
-    function getTimepickerConfig(i18nService) {
-        return Object.assign(new i6.TimepickerConfig(), {
-            meridians: i2.getLocaleDayPeriods(i18nService.getSelectedLocale(), i2.FormStyle.Format, i2.TranslationWidth.Abbreviated)
-        });
-    }
-    class BaseDateTimeComponent extends input.BaseFormCustomComponent {
-        get timeZone() { return this.inj.get(i1$1.AbstractI18nService).getTimezone(this); }
-        constructor(inj, WIDGET_CONFIG, explicitContext) {
-            super(inj, WIDGET_CONFIG, explicitContext);
-            this.isReadOnly = false;
-            this.clicked = false;
-            this.formatsByLocale = { 'timezone': '' };
-            /**
-             * This is an internal property used to map the containerClass, showWeekNumbers etc., to the bsDatepicker
-             */
-            this._dateOptions = new i3.BsDatepickerConfig();
-            this.i18nService = this.inj.get(i1$1.AbstractI18nService);
-            this.invokeEventCallback('beforeload');
-            this.datePipe = this.inj.get(base.ToDatePipe);
-            this.selectedLocale = this.i18nService.getSelectedLocale();
-            this._dateOptions.todayPosition = 'left';
-            this._dateOptions.clearPosition = 'right';
-            this.meridians = i2.getLocaleDayPeriods(this.selectedLocale, i2.FormStyle.Format, i2.TranslationWidth.Abbreviated);
-            this.loadNativeDateInput = i1$1.isMobile() && !this.showcustompicker;
-            this.cancelLocaleChangeSubscription = this.getAppInstance().subscribe("locale-changed", (locale) => {
-                this.datePipe.datePipe.locale = locale.angular;
-                this._dateOptions.todayButtonLabel = this.i18nService.getLocalizedMessage('LABEL_TODAY_DATE');
-                this._dateOptions.clearButtonLabel = this.i18nService.getLocalizedMessage('LABEL_CLEAR_DATE');
-            });
-        }
-        /**
-         * returns true if the input value is default (i.e open date picker on input click)
-         * @param1 dropdownvalue, user selected value (by default datepicker opens on input click)
-         * **/
-        isDropDownDisplayEnabledOnInput(dropdownvalue) {
-            return dropdownvalue === DATEPICKER_DROPDOWN_OPTIONS.DEFAULT;
-        }
-        /**
-         * returns true if the input value is default (i.e Data entry can be done either by selecting from the Date/DateTime/Time Picker or by entering  manually using the keyboard. )
-         * @param1 dropdownvalue, user selected value
-         * **/
-        isDataEntryModeEnabledOnInput(dropdownvalue) {
-            return dropdownvalue === DATAENTRYMODE_DROPDOWN_OPTIONS.DEFAULT;
-        }
-        /**
-         * This method is used to show validation message depending on the isNativePicker flag.
-         */
-        showValidation($event, displayValue, isNativePicker, msg) {
-            if (isNativePicker) {
-                console.warn('min max date validation failed ', msg);
-                return $($event.target).val(displayValue);
-            }
-        }
-        resetDisplayInput() {
-            $(this.nativeElement).find('.display-input').val('');
-        }
-        validate(c) {
-            if (this.invalidDateTimeFormat) {
-                return {
-                    invalidDateTimeFormat: {
-                        valid: false
-                    }
-                };
-            }
-            if (!lodashEs.isUndefined(this.dateNotInRange) && this.dateNotInRange) {
-                return {
-                    dateNotInRange: {
-                        valid: false
-                    },
-                };
-            }
-            if (!lodashEs.isUndefined(this.timeNotInRange) && this.timeNotInRange) {
-                return {
-                    timeNotInRange: {
-                        valid: false
-                    },
-                };
-            }
-            /* WMS-18269 | Extending the existing validation for 'required' */
-            if (this['show'] && this['required']) {
-                return !!c.value ? null : { required: true };
-            }
-            this.validateType = '';
-            return null;
-        }
-        /**
-         * This method is used to validate date pattern and time pattern
-         * If user selects one pattern in design time and if he tries to enter the date in another pattern then the device is throwing an error
-         */
-        formatValidation(newVal, inputVal, isNativePicker) {
-            const pattern = this.datepattern || this.timepattern;
-            const timeZone = this.timeZone;
-            const formattedDate = i1$1.getFormattedDate(this.datePipe, newVal, pattern, timeZone, null, null, this);
-            inputVal = inputVal.trim();
-            if (inputVal) {
-                if (pattern === 'timestamp') {
-                    if (!lodashEs.isNaN(inputVal) && lodashEs.parseInt(inputVal) !== formattedDate) {
-                        this.invalidDateTimeFormat = true;
-                        this.validateType = 'incorrectformat';
-                        this.invokeOnChange(this.datavalue, undefined, false);
-                        return false;
-                    }
-                }
-                else {
-                    if (isNativePicker) {
-                        // format the date value only when inputVal is obtained from $event.target.value, as the format doesnt match.
-                        inputVal = i1$1.getFormattedDate(this.datePipe, inputVal, pattern, timeZone);
-                    }
-                    if (inputVal !== formattedDate) {
-                        this.invalidDateTimeFormat = true;
-                        this.validateType = 'incorrectformat';
-                        this.invokeOnChange(this.datavalue, undefined, false);
-                        return false;
-                    }
-                }
-            }
-            return true;
-        }
-        /**
-         * This method is used to validate min date, max date, exclude dates and exclude days
-         * In mobile if invalid dates are entered, device is showing an alert.
-         * In web if invalid dates are entered, device is showing validation message.
-         */
-        minDateMaxDateValidationOnInput(newVal, $event, displayValue, isNativePicker) {
-            if (newVal) {
-                const dateTimeVal = newVal;
-                newVal = moment(newVal).startOf('day').toDate();
-                const minDate = moment(i1$1.getDateObj(this.mindate)).startOf('day').toDate();
-                const maxDate = moment(i1$1.getDateObj(this.maxdate)).startOf('day').toDate();
-                if (this.mindate && newVal < minDate) {
-                    const msg = `${this.appLocale.LABEL_MINDATE_VALIDATION_MESSAGE} ${this.mindate}.`;
-                    this.invokeOnChange(this.datavalue, undefined, false);
-                    if (isNativePicker && i1$1.getFormattedDate(this.datePipe, minDate, this.datepattern, this.timeZone, null, null, this) === displayValue) {
-                        return $($event.target).val(displayValue);
-                    }
-                    this.dateNotInRange = true;
-                    this.validateType = 'mindate';
-                    return this.showValidation($event, displayValue, isNativePicker, msg);
-                }
-                if (this.maxdate && newVal > maxDate) {
-                    const msg = `${this.appLocale.LABEL_MAXDATE_VALIDATION_MESSAGE} ${this.maxdate}.`;
-                    this.invokeOnChange(this.datavalue, undefined, false);
-                    if (isNativePicker && i1$1.getFormattedDate(this.datePipe, maxDate, this.datepattern, this.timeZone, null, null, this) === displayValue) {
-                        return $($event.target).val(displayValue);
-                    }
-                    this.dateNotInRange = true;
-                    this.validateType = 'maxdate';
-                    return this.showValidation($event, displayValue, isNativePicker, msg);
-                }
-                if (this.excludedates) {
-                    let excludeDatesArray;
-                    if (lodashEs.isString(this.excludedates)) {
-                        excludeDatesArray = lodashEs.split(this.excludedates, ',');
-                    }
-                    else {
-                        excludeDatesArray = this.excludedates;
-                    }
-                    excludeDatesArray = excludeDatesArray.map(d => i1$1.getFormattedDate(this.datePipe, d, this.datepattern, this.timeZone, null, null, this));
-                    if (excludeDatesArray.indexOf(i1$1.getFormattedDate(this.datePipe, dateTimeVal, this.datepattern, this.timeZone, null, null, this)) > -1) {
-                        this.dateNotInRange = true;
-                        this.validateType = 'excludedates';
-                        this.invokeOnChange(this.datavalue, undefined, false);
-                        return;
-                    }
-                }
-                if (this.excludedays) {
-                    const excludeDaysArray = lodashEs.split(this.excludedays, ',');
-                    const day = lodashEs.get(dateTimeVal, 'getDay') ? dateTimeVal.getDay() : dateTimeVal;
-                    if (excludeDaysArray.indexOf(day.toString()) > -1) {
-                        this.dateNotInRange = true;
-                        this.validateType = 'excludedays';
-                        this.invokeOnChange(this.datavalue, undefined, false);
-                        return;
-                    }
-                }
-            }
-            if (!isNativePicker) {
-                this.dateNotInRange = false;
-                this.invokeOnChange(this.datavalue, undefined, false);
-            }
-        }
-        /**
-         * This method is used to highlight the current date
-         */
-        hightlightToday(newDate) {
-            const activeMonth = $(`.bs-datepicker-head .current`).first().text();
-            const activeYear = $(".bs-datepicker-head .current").eq(1).text();
-            const month = new Date(newDate).toLocaleString('default', { month: 'long' });
-            newDate.getFullYear().toString();
-            if (activeMonth == month && activeYear == new Date().getFullYear() && newDate.getDate() === new Date().getDate() && newDate.getMonth() === new Date().getMonth() && newDate.getFullYear() === new Date().getFullYear()) {
-                const toDay = new Date().getDate().toString();
-                lodashEs.filter($(`span:contains(${toDay})`).not('.is-other-month'), (obj) => {
-                    if ($(obj).text() === toDay) {
-                        $(obj).addClass('current-date text-info');
-                    }
-                });
-            }
-        }
-        /**
-         * This method is used to find the new date is from another year or not
-         * @param newDate - newly selected date value
-         */
-        isOtheryear(newDate) {
-            return (newDate.getMonth() === 0 && this.activeDate.getMonth() === 11) || (newDate.getMonth() === 11 && this.activeDate.getMonth() === 0);
-        }
-        showDatePickerModal(bsDataval) {
-            bsDataval ? this.activeDate = bsDataval : this.activeDate = new Date();
-            this.setNextData(this.activeDate);
-            this.datetimepickerComponent.show();
-            setTimeout(() => {
-                this.addDatepickerMouseEvents();
-                this.setActiveDateFocus(this.activeDate, true);
-            }, 500);
-            return;
-        }
-        /**
-         * This method is used to load other month days or other month or other year
-         * @param btnClass - class(previous/next) of the button which we have to click
-         * @param timePeriod - String value decides to load other month days or other month or other year
-         */
-        goToOtherMonthOryear(btnClass, timePeriod) {
-            const $node = $(`.bs-datepicker-head .${btnClass}`);
-            if ($node.attr('disabled')) {
-                return;
-            }
-            $node.trigger('click');
-            if (timePeriod === 'days') {
-                this.loadDays();
-            }
-            else if (timePeriod === 'month') {
-                this.loadMonths();
-            }
-            else if (timePeriod === 'year') {
-                this.loadYears();
-            }
-        }
-        /**
-         * This method is used to set focus for active day
-         * @param newDate - newly selected date value
-         * @param isMouseEvent - boolean value represents the event is mouse event/ keyboard event
-         */
-        setActiveDateFocus(newDate, isMouseEvent) {
-            this.setNextData(newDate);
-            this.clicked = false;
-            const activeMonth = this.activeDate.getMonth();
-            // check for keyboard event
-            if (!isMouseEvent) {
-                if (newDate.getMonth() < activeMonth) {
-                    this.isOtheryear(newDate) ? this.goToOtherMonthOryear('next', 'days') : this.goToOtherMonthOryear('previous', 'days');
-                }
-                else if (newDate.getMonth() > activeMonth) {
-                    this.isOtheryear(newDate) ? this.goToOtherMonthOryear('previous', 'days') : this.goToOtherMonthOryear('next', 'days');
-                }
-            }
-            setTimeout(() => {
-                const newDay = newDate.getDate().toString();
-                lodashEs.filter($(`span:contains(${newDay})`).not('.is-other-month'), (obj) => {
-                    const activeMonth = $(`.bs-datepicker-head .current`).first().text();
-                    const activeYear = $(".bs-datepicker-head .current").eq(1).text();
-                    const monthName = new Date().toLocaleString('default', { month: 'long' });
-                    if ($(obj).text() === newDay && activeMonth == monthName && activeYear == new Date().getFullYear()) {
-                        if ($(obj).hasClass('selected')) {
-                            $(obj).parent().attr('aria-selected', 'true');
-                        }
-                        $(obj).attr('aria-label', moment(newDate).format('dddd, MMMM Do YYYY'));
-                        $('[bsdatepickerdaydecorator]').not('.is-other-month').attr('tabindex', '-1');
-                        $(obj).attr('tabindex', '0');
-                        $(obj).focus();
-                        this.activeDate = newDate;
-                    }
-                });
-                if (newDate.getDate() === new Date().getDate() && newDate.getMonth() === new Date().getMonth() && newDate.getFullYear() === new Date().getFullYear()) {
-                    this.hightlightToday(newDate);
-                }
-            });
-        }
-        getMonth(date, inc) {
-            const currentMonth = new Date(date);
-            let month = currentMonth.getMonth();
-            const year = currentMonth.getFullYear();
-            month += inc;
-            const newDate = new Date(year, month);
-            const fullMonth = newDate.toLocaleString('en-US', { month: 'long' });
-            return {
-                date: newDate,
-                fullMonth: fullMonth
-            };
-        }
-        /**
-         * This method sets focus for months/days depending on the loaded datepicker table
-         */
-        setFocusForMonthOrDay() {
-            const activeMonthOrYear = $(`.bs-datepicker-head .current`).first().text();
-            const datePickerBody = $('.bs-datepicker-body');
-            if (datePickerBody.find('table.months').length > 0) {
-                if (lodashEs.parseInt(activeMonthOrYear) !== this.activeDate.getFullYear()) {
-                    this.loadMonths();
-                }
-                const newDate = new Date(lodashEs.parseInt(activeMonthOrYear), this.activeDate.getMonth(), this.activeDate.getDate());
-                this.setActiveMonthFocus(newDate, true);
-            }
-            else if (datePickerBody.find('table.days').length > 0) {
-                const newMonth = months.indexOf(activeMonthOrYear);
-                if (newMonth !== this.activeDate.getMonth()) {
-                    this.loadDays();
-                }
-                const newDate = new Date(this.activeDate.getFullYear(), newMonth, 1);
-                this.setActiveDateFocus(newDate, true);
-            }
-        }
-        /**
-         * This method sets focus for months/years depending on the loaded datepicker table
-         */
-        setFocusForCurrentMonthOryear() {
-            const datePickerBody = $('.bs-datepicker-body');
-            if (datePickerBody.find('table.months').length > 0) {
-                this.loadMonths();
-                this.setActiveMonthFocus(this.activeDate, true);
-            }
-            else if (datePickerBody.find('table.years').length > 0) {
-                this.loadYears();
-                this.setActiveYearFocus(this.activeDate, true);
-            }
-        }
-        /**
-         * This method sets focus for months/years/days depending on the loaded datepicker table
-         */
-        setFocusForDate(count) {
-            const datePickerBody = $('.bs-datepicker-body');
-            if (datePickerBody.find('table.months').length > 0) {
-                this.loadMonths();
-                const newDate = new Date(this.activeDate.getFullYear() + count, 0, this.activeDate.getDate());
-                this.setActiveMonthFocus(newDate, true);
-            }
-            else if (datePickerBody.find('table.years').length > 0) {
-                this.loadYears();
-                const startYear = datePickerBody.find('table.years span').first().text();
-                const newDate = new Date(lodashEs.parseInt(startYear), this.activeDate.getMonth(), this.activeDate.getDate());
-                this.setActiveYearFocus(newDate, true);
-            }
-            else if (datePickerBody.find('table.days').length > 0) {
-                this.loadDays();
-                const newDate = new Date(this.activeDate.getFullYear(), this.activeDate.getMonth() + count, 1);
-                this.setActiveDateFocus(newDate, true);
-            }
-        }
-        /**
-         * This method is used to add keyboard events while opening the date picker
-         * @param scope - scope of the date/datetime widget
-         * @param isDateTime - boolean value represents the loaded widget is date or datetime
-         */
-        addDatepickerKeyboardEvents(scope, isDateTime) {
-            this.elementScope = scope;
-            const dateContainer = document.querySelector(`.${scope.dateContainerCls}`);
-            i1$1.setAttr(dateContainer, 'tabindex', '0');
-            dateContainer.onkeydown = (event) => {
-                // Check for Shift+Tab key or Tab key or escape
-                if (event.key === 'Escape') {
-                    this.elementScope.hideDatepickerDropdown();
-                    const displayInputElem = this.elementScope.nativeElement.querySelector('.display-input');
-                    setTimeout(() => displayInputElem.focus());
-                }
-            };
-            this.loadDays();
-            this.setActiveDateFocus(this.activeDate);
-        }
-        setNextData(nextDate) {
-            this.next = this.getMonth(nextDate, 1);
-            this.prev = this.getMonth(nextDate, -1);
-        }
-        /**
-         * This method is used to add tabindex, keybord and mouse events for days
-         */
-        loadDays() {
-            setTimeout(() => {
-                $('[bsdatepickerdaydecorator]').not('.is-other-month').attr('tabindex', '0');
-                // if (this.clicked === false) {
-                //     this.next = this.getMonth(this.activeDate, 1);
-                //     this.prev = this.getMonth(this.activeDate, -1);
-                // }
-                this.addKeyBoardEventsForDays();
-                this.addDatepickerMouseEvents();
-            });
-        }
-        /**
-         * This method sets keyboard events for days
-         */
-        addKeyBoardEventsForDays() {
-            const datePickerBody = $('.bs-datepicker-body');
-            datePickerBody.keydown((event) => {
-                let newdate;
-                if (event.key === 'ArrowDown') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(+7, 'days').toDate();
-                    this.setActiveDateFocus(newdate);
-                }
-                else if (event.ctrlKey && event.key === 'ArrowUp') {
-                    // clicking on table header month name to load list of months
-                    $('.bs-datepicker-head .current').first().click();
-                    this.loadMonths();
-                    this.setActiveMonthFocus(this.activeDate);
-                }
-                else if (event.key === 'ArrowUp') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(-7, 'days').toDate();
-                    this.setActiveDateFocus(newdate);
-                }
-                else if (event.key === 'ArrowLeft') {
-                    newdate = moment(this.activeDate).add(-1, 'days').toDate();
-                    this.setActiveDateFocus(newdate);
-                }
-                else if (event.key === 'ArrowRight') {
-                    newdate = moment(this.activeDate).add(+1, 'days').toDate();
-                    this.setActiveDateFocus(newdate);
-                }
-                else if (event.key === 'PageUp') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(-1, 'month').toDate();
-                    this.setActiveDateFocus(newdate);
-                }
-                else if (event.key === 'PageDown') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(+1, 'month').toDate();
-                    this.setActiveDateFocus(newdate);
-                }
-                else if (event.key === 'Enter') {
-                    if ($(document.activeElement).hasClass('disabled')) {
-                        return;
-                    }
-                    $(document.activeElement).click();
-                    this.elementScope.hideDatepickerDropdown();
-                    const displayInputElem = this.elementScope.nativeElement.querySelector('.display-input');
-                    setTimeout(() => displayInputElem.focus());
-                }
-            });
-            this.focusBlurDatePickerHeadButtons();
-        }
-        focusBlurDatePickerHeadButtons() {
-            const datePickerHeadButton = $('.bs-datepicker-head button');
-            datePickerHeadButton.on('focus', function () { $(this).css('background-color', '#9AA0A3'); });
-            datePickerHeadButton.on('blur', function () { $(this).css('background-color', ''); });
-        }
-        /**
-         * This method is used to add tabindex, keybord and mouse events for months
-         */
-        loadMonths() {
-            setTimeout(() => {
-                this.addKeyBoardEventsForMonths();
-                this.addDatepickerMouseEvents();
-            });
-        }
-        /**
-         * This method sets keyboard events for months
-         */
-        addKeyBoardEventsForMonths() {
-            $('.bs-datepicker-body').keydown((event) => {
-                let newdate;
-                if ((event.ctrlKey && event.key === 'ArrowDown') || event.key === 'Enter') {
-                    if ($(document.activeElement).parent().hasClass('disabled')) {
-                        return;
-                    }
-                    $(document.activeElement).click();
-                    this.loadDays();
-                    const newDate = new Date(this.activeDate.getFullYear(), this.activeDate.getMonth(), 1);
-                    this.setActiveDateFocus(newDate);
-                }
-                else if (event.ctrlKey && event.key === 'ArrowUp') {
-                    // clicking on table header year to load list of years
-                    $('.bs-datepicker-head .current').first().click();
-                    this.loadYears();
-                    this.setActiveYearFocus(this.activeDate);
-                }
-                else if (event.key === 'ArrowDown') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(+3, 'month').toDate();
-                    this.setActiveMonthFocus(newdate);
-                }
-                else if (event.key === 'ArrowUp') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(-3, 'month').toDate();
-                    this.setActiveMonthFocus(newdate);
-                }
-                else if (event.key === 'ArrowLeft') {
-                    newdate = moment(this.activeDate).add(-1, 'month').toDate();
-                    this.setActiveMonthFocus(newdate);
-                }
-                else if (event.key === 'ArrowRight') {
-                    newdate = moment(this.activeDate).add(+1, 'month').toDate();
-                    this.setActiveMonthFocus(newdate);
-                }
-            });
-            this.focusBlurDatePickerHeadButtons();
-        }
-        /**
-         * This method is used to add tabindex, keybord and mouse events for years
-         */
-        loadYears() {
-            setTimeout(() => {
-                this.addKeyBoardEventsForYears();
-                this.addDatepickerMouseEvents();
-            });
-        }
-        /**
-         * This method is used to set focus for active month
-         */
-        setActiveMonthFocus(newDate, isMoouseEvent) {
-            this.setNextData(newDate);
-            const newMonth = months[newDate.getMonth()];
-            // check for keyboard event
-            if (!isMoouseEvent) {
-                if (newDate.getFullYear() < this.activeDate.getFullYear()) {
-                    this.goToOtherMonthOryear('previous', 'month');
-                }
-                else if (newDate.getFullYear() > this.activeDate.getFullYear()) {
-                    this.goToOtherMonthOryear('next', 'month');
-                }
-            }
-            setTimeout(() => {
-                $(`.bs-datepicker-body table.months span`).attr('tabindex', '-1');
-                $(`.bs-datepicker-body table.months span:contains(${newMonth})`).attr('tabindex', '0');
-                $(`.bs-datepicker-body table.months span:contains(${newMonth})`).focus();
-                this.activeDate = newDate;
-            });
-        }
-        /**
-         * This method sets keyboard events for years
-         */
-        addKeyBoardEventsForYears() {
-            $('.bs-datepicker-body').keydown((event) => {
-                let newdate;
-                if ((event.ctrlKey && event.key === 'ArrowDown') || event.key === 'Enter') {
-                    if ($(document.activeElement).parent().hasClass('disabled')) {
-                        return;
-                    }
-                    $(document.activeElement).click();
-                    this.loadMonths();
-                    this.setActiveMonthFocus(this.activeDate);
-                }
-                else if (event.key === 'ArrowDown') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(+4, 'year').toDate();
-                    this.setActiveYearFocus(newdate);
-                }
-                else if (event.key === 'ArrowUp') {
-                    event.preventDefault();
-                    newdate = moment(this.activeDate).add(-4, 'year').toDate();
-                    this.setActiveYearFocus(newdate);
-                }
-                else if (event.key === 'ArrowLeft') {
-                    newdate = moment(this.activeDate).add(-1, 'year').toDate();
-                    this.setActiveYearFocus(newdate);
-                }
-                else if (event.key === 'ArrowRight') {
-                    newdate = moment(this.activeDate).add(+1, 'year').toDate();
-                    this.setActiveYearFocus(newdate);
-                }
-            });
-            this.focusBlurDatePickerHeadButtons();
-        }
-        /**
-         * This method is used to set focus for active year
-         */
-        setActiveYearFocus(newDate, isMouseEvent) {
-            const newYear = newDate.getFullYear();
-            const datePickerYears = $('.bs-datepicker-body table.years span');
-            const startYear = datePickerYears.first().text();
-            const endYear = datePickerYears.last().text();
-            // check for keyboard event
-            if (!isMouseEvent) {
-                if (newDate.getFullYear() < lodashEs.parseInt(startYear)) {
-                    this.goToOtherMonthOryear('previous', 'year');
-                }
-                else if (newDate.getFullYear() > lodashEs.parseInt(endYear)) {
-                    this.goToOtherMonthOryear('next', 'year');
-                }
-            }
-            setTimeout(() => {
-                $(`.bs-datepicker-body table.years span`).attr('tabindex', '-1');
-                $(`.bs-datepicker-body table.years span:contains(${newYear})`).attr('tabindex', '0');
-                $(`.bs-datepicker-body table.years span:contains(${newYear})`).focus();
-                this.activeDate = newDate;
-            });
-        }
-        /**
-         * This method sets focus for timepicker first input field(hours field) while opening time picker
-         * @param scope - scope of the time picker widget
-         */
-        focusTimePickerPopover(scope) {
-            this.elementScope = scope;
-            // setTimeout is used so that by then time input has the updated value. focus is setting back to the input field
-            this.elementScope.ngZone.runOutsideAngular(() => {
-                setTimeout(() => {
-                    $('timepicker .form-group').first().find('> input.form-control').focus();
-                });
-            });
-        }
-        /**
-         * This function sets the keyboard events to Timepicker popup
-         */
-        bindTimePickerKeyboardEvents() {
-            setTimeout(() => {
-                const $timepickerPopup = $('body').find('> bs-dropdown-container timepicker');
-                $timepickerPopup.attr('tabindex', 0);
-                this.addEventsOnTimePicker($timepickerPopup);
-            });
-        }
-        focusOnInputEl() {
-            if ($(this.nativeElement).closest('.caption-floating').length > 0) {
-                setTimeout(() => {
-                    $(this.nativeElement).find('.app-textbox').focus();
-                }, 100);
-            }
-        }
-        /**
-         * This function checks whether the given date is valid or not
-         * @returns boolean value, true if date is valid else returns false
-         */
-        isValidDate(date) {
-            return date && date instanceof Date && !isNaN(date.getTime());
-        }
-        /**
-         * This function checks whether the given time is valid or not
-         */
-        timeFormatValidation() {
-            const enteredDate = $(this.nativeElement).find('input').val();
-            const newVal = i1$1.getNativeDateObject(enteredDate, { meridians: this.meridians, pattern: this.datepattern });
-            if (!this.formatValidation(newVal, enteredDate)) {
-                return;
-            }
-            this.invalidDateTimeFormat = false;
-            this.invokeOnChange(this.datavalue, undefined, false);
-        }
-        updateTimeValue(el, value, fieldName) {
-            let minEl = el.find('input[aria-label="minutes"]');
-            let secEl = el.find('input[aria-label="seconds"]');
-            minEl.value = secEl.value = '00';
-            if (value.length < 2) {
-                setTimeout(() => {
-                    fieldName === 'minutes' ? this.bsTimePicker.updateMinutes(minEl) : this.bsTimePicker.updateSeconds(secEl);
-                }, 500);
-            }
-            else {
-                fieldName === 'minutes' ? this.bsTimePicker.updateMinutes(minEl) : this.bsTimePicker.updateSeconds(secEl);
-            }
-        }
-        /**
-         * This function sets the events to given element
-         * @param $el - element on which the event is added
-         */
-        addEventsOnTimePicker($el) {
-            const inputFields = $el.find('.bs-timepicker-field');
-            // WMS-19382: update minutes and seconds to 0 when we enter hour value
-            inputFields.first().on('keyup', evt => {
-                const hourValue = evt.target.value;
-                lodashEs.forEach(inputFields, (field, index) => {
-                    // @ts-ignore
-                    if (evt.target !== field && field.value === '' && hourValue.length) {
-                        const fieldName = index === 1 ? 'minutes' : 'seconds';
-                        this.updateTimeValue($el, hourValue, fieldName);
-                    }
-                });
-            });
-            this.removeKeyupListener = () => {
-                inputFields.first().off('keyup');
-            };
-            $el.on('keydown', event => {
-                const $target = $(event.target);
-                const $parent = $target.parent();
-                const elementScope = this.elementScope;
-                let stopPropogation, preventDefault;
-                if (event.key === 'Escape') {
-                    elementScope.hideTimepickerDropdown();
-                }
-                if ($target.hasClass('bs-timepicker-field')) {
-                    if ($parent.is(':first-child')) {
-                        if ((event.shiftKey && event.key === 'Tab') || event.key === 'Enter' || event.key === 'Escape') {
-                            elementScope.setIsTimeOpen(false);
-                            this.focus();
-                            stopPropogation = true;
-                            preventDefault = true;
-                        }
-                    }
-                    else if ($parent.is(':last-child') || ($parent.next().next().find('button.disabled').length)) {
-                        if (event.key === 'Tab' || event.key === 'Escape' || event.key === 'Enter') {
-                            elementScope.setIsTimeOpen(false);
-                            this.focus();
-                            stopPropogation = true;
-                            preventDefault = true;
-                        }
-                    }
-                    else {
-                        if (event.key === 'Enter' || event.key === 'Escape') {
-                            elementScope.setIsTimeOpen(false);
-                            this.focus();
-                            stopPropogation = true;
-                            preventDefault = true;
-                        }
-                    }
-                    if (stopPropogation) {
-                        event.stopPropagation();
-                    }
-                    if (preventDefault) {
-                        event.preventDefault();
-                    }
-                    if (elementScope.mintime && elementScope.maxtime && !this.isValidDate(elementScope.bsTimeValue)) {
-                        if (event.key === 'ArrowDown') {
-                            elementScope.bsTimeValue = elementScope.maxTime;
-                        }
-                        else if (event.key === 'ArrowUp') {
-                            elementScope.bsTimeValue = elementScope.minTime;
-                        }
-                    }
-                    if (event.key === 'Tab') {
-                        this.invalidDateTimeFormat = false;
-                        this.invokeOnChange(this.datavalue, undefined, false);
-                        const pattern = this.datepattern || this.timepattern;
-                        if (i1$1.getFormattedDate(elementScope.datePipe, elementScope.bsTimeValue, pattern, this.timeZone, null, null, this) === elementScope.displayValue) {
-                            $(this.nativeElement).find('.display-input').val(elementScope.displayValue);
-                        }
-                    }
-                    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
-                        this.timeFormatValidation();
-                    }
-                }
-                else if ($target.hasClass('btn-default')) {
-                    if (event.key === 'Tab' || event.key === 'Escape') {
-                        elementScope.setIsTimeOpen(false);
-                        this.focus();
-                    }
-                }
-            });
-            $el.find('a').on('click', evt => {
-                const elementScope = this.elementScope;
-                const $target = $(evt.target);
-                if (elementScope.mintime && elementScope.maxtime && !this.isValidDate(elementScope.bsTimeValue)) {
-                    if ($target.find('span').hasClass('bs-chevron-down')) {
-                        elementScope.bsTimeValue = elementScope.maxTime;
-                    }
-                    else if ($target.find('span').hasClass('bs-chevron-up')) {
-                        elementScope.bsTimeValue = elementScope.minTime;
-                    }
-                }
-                this.timeFormatValidation();
-            });
-        }
-        updateFormat(pattern) {
-            if (pattern === 'datepattern') {
-                this._dateOptions.dateInputFormat = this.datepattern;
-                this.showseconds = lodashEs.includes(this.datepattern, 's');
-                this.ismeridian = lodashEs.includes(this.datepattern, 'h');
-            }
-            else if (pattern === 'timepattern') {
-                this.showseconds = lodashEs.includes(this.timepattern, 's');
-                this.ismeridian = lodashEs.includes(this.timepattern, 'h');
-            }
-        }
-        getMobileInput() {
-            return this.nativeElement.querySelector('.mobile-input');
-        }
-        onDateTimeInputBlur() {
-            // removing the opacity on blur of the mobile widget
-            const displayInputElem = this.getMobileInput();
-            if (displayInputElem && !i1$1.hasCordova()) {
-                const children = this.nativeElement.children;
-                for (let i = 0; i < children.length; i++) {
-                    children[i].classList.remove('add-opacity');
-                }
-                displayInputElem.classList.remove('remove-opacity');
-            }
-        }
-        onDateTimeInputFocus(skipFocus = false) {
-            if (!this.loadNativeDateInput) {
-                return;
-            }
-            const displayInputElem = this.getMobileInput();
-            // toggling the classes to show and hide the native widget using opacity
-            if (skipFocus && !i1$1.hasCordova()) {
-                const children = this.nativeElement.children;
-                for (let i = 0; i < children.length; i++) {
-                    children[i].classList.add('add-opacity');
-                }
-                displayInputElem.classList.add('remove-opacity');
-                return;
-            }
-            if (displayInputElem && this._triggeredByUser) {
-                displayInputElem.focus();
-                displayInputElem.click();
-            }
-        }
-        getCordovaPluginDatePickerApi() {
-            if (i1$1.isIos()) {
-                return lodashEs.get(window, 'cordova.wavemaker.datePicker.selectDate');
-            }
-        }
-        /**
-         * This method sets the mouse events to Datepicker popup. These events are required when we navigate date picker through mouse.
-         */
-        addDatepickerMouseEvents() {
-            $(".bs-datepicker-head .previous span").attr("aria-hidden", 'true');
-            $(".bs-datepicker-head .next span").attr("aria-hidden", 'true');
-            $(".bs-datepicker-head").on("click", ".previous", (event) => {
-                this.next = this.getMonth(this.activeDate, 0);
-                this.prev = this.getMonth(this.activeDate, -2);
-                this.clicked = true;
-                // check for original mouse click
-                if (event.originalEvent) {
-                    this.setFocusForDate(-1);
-                }
-                var prevMon = this.getMonth(this.activeDate, -1);
-                setTimeout(() => {
-                    $(".bs-datepicker-head .previous span").attr("aria-hidden", 'true');
-                    $(".bs-datepicker-head .next span").attr("aria-hidden", 'true');
-                    $(".bs-datepicker-head .next").attr('aria-label', `Next Month, ${this.next.fullMonth} ${this.next.date.getFullYear()}`);
-                    $(".bs-datepicker-head .previous").attr('aria-label', `Previous Month, ${this.prev.fullMonth} ${this.prev.date.getFullYear()}`);
-                    $('.bs-datepicker-head .current').first().append(`<h2 aria-hidden="false" aria-atomic="true" aria-live='polite' class="sr-only">Changed to Previous Month, ${prevMon.fullMonth} and year ${prevMon.date.getFullYear()}</h2>`);
-                    $('.bs-datepicker-head').on('focus', '.current', function () {
-                        $('.bs-datepicker-head .current').find('h2').remove();
-                    });
-                    $(`.bs-datepicker-head .previous`).focus();
-                });
-            });
-            $(".bs-datepicker-head").on("click", ".next", (event) => {
-                this.next = this.getMonth(this.activeDate, 2);
-                this.prev = this.getMonth(this.activeDate, 0);
-                this.clicked = true;
-                // check for original mouse click
-                if (event.originalEvent) {
-                    this.setFocusForDate(1);
-                }
-                var nextMon = this.getMonth(this.activeDate, 1);
-                setTimeout(() => {
-                    $(".bs-datepicker-head .previous span").attr("aria-hidden", 'true');
-                    $(".bs-datepicker-head .next span").attr("aria-hidden", 'true');
-                    $(".bs-datepicker-head .next").attr('aria-label', `Next Month, ${this.next.fullMonth} ${this.next.date.getFullYear()}`);
-                    $(".bs-datepicker-head .previous").attr('aria-label', `Previous Month, ${this.prev.fullMonth} ${this.prev.date.getFullYear()}`);
-                    $('.bs-datepicker-head .current').first().append(`<h2 aria-hidden="false" aria-atomic="true" aria-live='polite' class="sr-only">Changed to Next Month, ${nextMon.fullMonth} and year ${nextMon.date.getFullYear()}</h2>`);
-                    $('.bs-datepicker-head').on('focus', '.current', function () {
-                        $('.bs-datepicker-head .current').find('h2').remove();
-                    });
-                    $(`.bs-datepicker-head .next`).focus();
-                });
-            });
-            $(".bs-datepicker-head").on("click", ".current", (event) => {
-                // check for original mouse click
-                if (event.originalEvent) {
-                    this.setFocusForCurrentMonthOryear();
-                }
-            });
-            $('.bs-datepicker-body').on("click", ".bs-datepicker-action-buttons", (event) => {
-                event.stopPropagation();
-                // check for original mouse click
-                if (event.originalEvent) {
-                    this.setFocusForMonthOrDay();
-                }
-            });
-            // if(!this.clicked) {
-            $(".bs-datepicker-head .next").attr('aria-label', `Next Month, ${this.next.fullMonth} ${this.next.date.getFullYear()}`);
-            $(".bs-datepicker-head .previous").attr('aria-label', `Previous Month, ${this.prev.fullMonth} ${this.prev.date.getFullYear()}`);
-            //  }
-        }
-        blurDateInput(isPickerOpen) {
-            const displayInputElem = this.nativeElement.querySelector('.display-input');
-            if (isPickerOpen) {
-                setTimeout(() => displayInputElem.blur());
-            }
-        }
-        onPropertyChange(key, nv, ov) {
-            if (key === 'tabindex') {
-                return;
-            }
-            if (key === 'required') {
-                this._onChange(this.datavalue);
-                return;
-            }
-            if (key === 'datepattern') {
-                this.updateFormat(key);
-            }
-            else if (key === 'showweeks') {
-                this._dateOptions.showWeekNumbers = nv;
-            }
-            else if (key === 'mindate') {
-                this._dateOptions.minDate = (nv === CURRENT_DATE$2) ? this.mindate = new Date() : i1$1.getDateObj(nv);
-                this.minDateMaxDateValidationOnInput(this.datavalue);
-            }
-            else if (key === 'maxdate') {
-                this._dateOptions.maxDate = (nv === CURRENT_DATE$2) ? this.maxdate = new Date() : i1$1.getDateObj(nv);
-                this.minDateMaxDateValidationOnInput(this.datavalue);
-            }
-            else if (key === 'excludedates' || key === 'excludedays') {
-                if (this.excludedays) {
-                    this.excludedDaysToDisable = lodashEs.split(this.excludedays, ',').map((day) => {
-                        return +day;
-                    });
-                }
-                if (this.excludedates) {
-                    this.excludedDatesToDisable = this.excludedates;
-                    if (lodashEs.isString(this.excludedates)) {
-                        // @ts-ignore
-                        this.excludedDatesToDisable = lodashEs.split(this.excludedates, ',');
-                    }
-                    this.excludedDatesToDisable = this.excludedDatesToDisable.map(d => i1$1.getDateObj(d));
-                }
-                this.minDateMaxDateValidationOnInput(this.datavalue);
-            }
-            else if (key === 'selectfromothermonth') {
-                this._dateOptions.selectFromOtherMonth = nv;
-            }
-            else if (key === 'todaybutton') {
-                this._dateOptions.showTodayButton = nv;
-            }
-            else if (key === 'clearbutton') {
-                this._dateOptions.showClearButton = nv;
-            }
-            else if (key === 'todaybuttonlabel') {
-                this._dateOptions.todayButtonLabel = this.i18nService.getLocalizedMessage(nv) || nv;
-            }
-            else if (key === 'clearbuttonlabel') {
-                this._dateOptions.clearButtonLabel = this.i18nService.getLocalizedMessage(nv) || nv;
-            }
-            else if (key === 'showcustompicker') {
-                this.loadNativeDateInput = i1$1.isMobile() && !this.showcustompicker;
-            }
-            else if (key === 'adaptiveposition') {
-                this._dateOptions.adaptivePosition = nv;
-            }
-            else {
-                super.onPropertyChange(key, nv, ov);
-            }
-        }
-        ngAfterViewInit() {
-            super.ngAfterViewInit();
-            this.containerTarget = base.getContainerTargetClass(this.nativeElement);
-            this.isReadOnly = this.dataentrymode != 'undefined' && !this.isDataEntryModeEnabledOnInput(this.dataentrymode);
-            // this mobileinput width varies in ios hence setting width here.
-            const mobileInput = this.getMobileInput();
-            if (mobileInput) {
-                setTimeout(() => {
-                    mobileInput.style.width = '100%';
-                    mobileInput.style.height = '100%';
-                });
-            }
-        }
-        ngOnDestroy() {
-            if (this.dateOnShowSubscription) {
-                this.dateOnShowSubscription.unsubscribe();
-            }
-            if (this.cancelLocaleChangeSubscription) {
-                this.cancelLocaleChangeSubscription();
-            }
-            super.ngOnDestroy();
-        }
-        ngOnDetach() {
-            this.datetimepickerComponent?.hideModal();
-        }
-        setTimezone(locale) {
-            this.i18nService.setTimezone(locale, this);
-        }
-        static { this.ɵfac = function BaseDateTimeComponent_Factory(t) { i0__namespace.ɵɵinvalidFactory(); }; }
-        static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: BaseDateTimeComponent, viewQuery: function BaseDateTimeComponent_Query(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵviewQuery(i4$1.BsDropdownDirective, 5);
-                i0__namespace.ɵɵviewQuery(i6.TimepickerComponent, 5);
-                i0__namespace.ɵɵviewQuery(DateTimePickerComponent, 5);
-            } if (rf & 2) {
-                let _t;
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.bsDropdown = _t.first);
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.bsTimePicker = _t.first);
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.datetimepickerComponent = _t.first);
-            } }, features: [i0__namespace.ɵɵInheritDefinitionFeature] }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(BaseDateTimeComponent, [{
-            type: i0.Directive
-        }], () => [{ type: i0__namespace.Injector }, { type: undefined }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], { bsDropdown: [{
-                type: i0.ViewChild,
-                args: [i4$1.BsDropdownDirective]
-            }], bsTimePicker: [{
-                type: i0.ViewChild,
-                args: [i6.TimepickerComponent]
-            }], datetimepickerComponent: [{
-                type: i0.ViewChild,
-                args: [DateTimePickerComponent]
-            }] }); })();
-
-    const dateProps = new Map([
-        ['autofocus', base.PROP_BOOLEAN],
-        ['class', base.PROP_STRING],
-        ['dataentrymode', { value: 'default', ...base.PROP_STRING }],
-        ['datavaluesource', base.PROP_ANY],
-        ['datavalue', base.PROP_STRING],
-        ['datepattern', base.PROP_STRING],
-        ['disabled', base.PROP_BOOLEAN],
-        ['excludedays', base.PROP_STRING],
-        ['excludedates', base.PROP_STRING],
-        ['hint', base.PROP_STRING],
-        ['maxdate', base.PROP_STRING],
-        ['mindate', base.PROP_STRING],
-        ['name', base.PROP_STRING],
-        ['outputformat', { value: 'yyyy-MM-dd', ...base.PROP_STRING }],
-        ['placeholder', { value: 'Select Date', ...base.PROP_STRING }],
-        ['readonly', base.PROP_BOOLEAN],
-        ['required', base.PROP_BOOLEAN],
-        ['shortcutkey', base.PROP_STRING],
-        ['show', { value: true, ...base.PROP_BOOLEAN }],
-        ['showdropdownon', { value: 'default', ...base.PROP_STRING }],
-        ['showbuttonbar', { value: true, ...base.PROP_BOOLEAN }], // TODO not addressed
-        ['showcustompicker', { value: false, ...base.PROP_BOOLEAN }],
-        ['showindevice', { displayType: 'inline-block', value: 'all', ...base.PROP_STRING }],
-        ['showweeks', { value: false, ...base.PROP_BOOLEAN }],
-        ['tabindex', { value: 0, ...base.PROP_NUMBER }],
-        ['selectfromothermonth', { value: true, ...base.PROP_BOOLEAN }],
-        ['todaybutton', { value: true, ...base.PROP_BOOLEAN }],
-        ['clearbutton', { value: true, ...base.PROP_BOOLEAN }],
-        ['adaptiveposition', { value: true, ...base.PROP_BOOLEAN }],
-        ['todaybuttonlabel', { value: 'LABEL_TODAY_DATE', ...base.PROP_STRING }],
-        ['clearbuttonlabel', { value: 'LABEL_CLEAR_DATE', ...base.PROP_STRING }],
-        ['showdateformatasplaceholder', base.PROP_BOOLEAN],
-    ]);
-    const registerProps$2 = () => {
-        base.register('wm-date', dateProps);
-        base.registerFormWidget(i1$1.FormWidgetType.DATE, new Map(dateProps));
-    };
-
-    function validateTheMaskedDate(format, locale) {
-        if (format == 'timestamp') {
-            return false;
-        }
-        let modifiedFormat = format.toUpperCase().replace(/E/g, 'd');
-        if ((modifiedFormat.split('D').length - 1) === 1) {
-            modifiedFormat = modifiedFormat.replace('D', 'DD');
-        }
-        if ((modifiedFormat.split('M').length - 1) === 1) {
-            modifiedFormat = modifiedFormat.replace('M', 'MM');
-        }
-        const parseFn = str => {
-            return moment(str, modifiedFormat).toDate();
-        };
-        const formatFn = date => {
-            return moment(date, modifiedFormat).format(modifiedFormat);
-        };
-        return {
-            mask: Date,
-            pattern: modifiedFormat,
-            format: formatFn,
-            parse: parseFn,
-            blocks: {
-                YYYY: {
-                    mask: IMask.MaskedRange,
-                    from: 1900,
-                    to: 9999,
-                    placeholderChar: 'Y',
-                    maxLength: 4,
-                },
-                YYY: {
-                    mask: IMask.MaskedRange,
-                    from: 900,
-                    to: 999,
-                    placeholderChar: 'Y',
-                    maxLength: 3,
-                },
-                YY: {
-                    mask: IMask.MaskedRange,
-                    from: 0,
-                    to: 99,
-                    placeholderChar: 'Y',
-                    maxLength: 2,
-                },
-                Y: {
-                    mask: IMask.MaskedRange,
-                    from: 1900,
-                    to: 9999,
-                    placeholderChar: 'Y',
-                    maxLength: 4,
-                },
-                M: {
-                    mask: IMask.MaskedRange,
-                    from: 1,
-                    to: 12,
-                    placeholderChar: 'M',
-                    maxLength: 2,
-                },
-                MM: {
-                    mask: IMask.MaskedRange,
-                    from: 1,
-                    to: 12,
-                    placeholderChar: 'M',
-                    maxLength: 2,
-                },
-                MMM: {
-                    mask: IMask.MaskedEnum,
-                    enum: Array.from({ length: 12 }, (_, i) => new Date(0, i).toLocaleString(locale, { month: 'short' })),
-                    placeholderChar: 'M',
-                    maxLength: 3,
-                },
-                MMMM: {
-                    mask: IMask.MaskedEnum,
-                    enum: Array.from({ length: 12 }, (_, i) => new Date(0, i).toLocaleString(locale, { month: 'long' })),
-                    placeholderChar: "M",
-                    maxLength: 4
-                },
-                DD: {
-                    mask: IMask.MaskedRange,
-                    from: 1,
-                    to: 31,
-                    placeholderChar: 'D',
-                    maxLength: 2,
-                },
-                D: {
-                    mask: IMask.MaskedRange,
-                    from: 1,
-                    to: 31,
-                    placeholderChar: 'D',
-                    maxLength: 2,
-                },
-                ddd: {
-                    mask: IMask.MaskedEnum,
-                    enum: Array.from({ length: 7 }, (_, i) => new Date(0, 0, i + 1).toLocaleString(locale, { weekday: 'short' })),
-                    placeholderChar: 'E',
-                    maxLength: 3,
-                },
-                dddd: {
-                    mask: IMask.MaskedEnum,
-                    enum: Array.from({ length: 7 }, (_, i) => new Date(0, 0, i + 1).toLocaleString(locale, { weekday: 'long' })),
-                    placeholderChar: 'E',
-                    minLength: 6,
-                },
-            },
-            autofix: true,
-            lazy: false,
-            overwrite: true,
-            skipInvalid: true
-        };
-    }
-
-    const _c0$2 = ["dateInput"];
-    const _c1 = ["wmDate", ""];
-    function DateComponent_ng_template_8_Template(rf, ctx) { if (rf & 1) {
-        const _r2 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "wm-datetimepicker", 9);
-        i0__namespace.ɵɵlistener("change", function DateComponent_ng_template_8_Template_wm_datetimepicker_change_0_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r2.onDateChange($event)); });
-        i0__namespace.ɵɵelementEnd();
-        i0__namespace.ɵɵelementStart(1, "div", 10);
-        i0__namespace.ɵɵlistener("click", function DateComponent_ng_template_8_Template_div_click_1_listener() { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(!(ctx_r2.disabled || ctx_r2.readonly) && ctx_r2.showDatePickerModal(ctx_r2.bsDataValue)); })("focus", function DateComponent_ng_template_8_Template_div_focus_1_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); ctx_r2.onDateTimeInputFocus(true); return i0__namespace.ɵɵresetView(ctx_r2.invokeOnFocus($event)); })("blur", function DateComponent_ng_template_8_Template_div_blur_1_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); ctx_r2.onDateTimeInputBlur(); return i0__namespace.ɵɵresetView(ctx_r2.invokeOnTouched($event)); });
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵproperty("config", ctx_r2._dateOptions)("placement", ctx_r2.modal)("excludedDaysToDisable", ctx_r2.excludedDaysToDisable)("excludedDatesToDisable", ctx_r2.excludedDatesToDisable)("displayFormat", ctx_r2.dateInputFormat)("value", ctx_r2.bsDataValue);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("tabindex", ctx_r2.tabindex || 0);
-        i0__namespace.ɵɵattribute("aria-label", ctx_r2.displayValue ? "Change Date " + ctx_r2.displayValue : ctx_r2.hint || "Choose Date");
-    } }
-    const CURRENT_DATE$1 = 'CURRENT_DATE';
-    const DEFAULT_CLS$2 = 'app-date input-group';
-    const WIDGET_CONFIG$2 = {
-        widgetType: 'wm-date',
-        hostClass: DEFAULT_CLS$2
-    };
-    class DateComponent extends BaseDateTimeComponent {
-        static { this.initializeProps = registerProps$2(); }
-        get timestamp() {
-            return this.bsDataValue ? this.bsDataValue.valueOf() : undefined;
-        }
-        get dateInputFormat() {
-            return this._dateOptions.dateInputFormat || 'yyyy-MM-dd';
-        }
-        get displayValue() {
-            if (this.showdateformatasplaceholder && this.imask?.maskRef && this.maskDateInputFormat) {
-                return i1$1.getFormattedDate(this.datePipe, this.bsDataValue, this.maskDateInputFormat, this.timeZone, null, this.isCurrentDate, this) || '';
-            }
-            return i1$1.getFormattedDate(this.datePipe, this.bsDataValue, this.dateInputFormat, this.timeZone, null, this.isCurrentDate, this) || '';
-        }
-        get nativeDisplayValue() {
-            return i1$1.getFormattedDate(this.datePipe, this.bsDataValue, 'yyyy-MM-dd', this.timeZone, null, this.isCurrentDate, this) || '';
-        }
-        // @ts-ignore
-        get datavalue() {
-            return i1$1.getFormattedDate(this.datePipe, this.bsDataValue, this.outputformat, this.timeZone, null, this.isCurrentDate, this) || '';
-        }
-        // Todo[Shubham]: needs to be redefined
-        // sets the dataValue and computes the display model values
-        // @ts-ignore
-        set datavalue(newVal) {
-            if (newVal === CURRENT_DATE$1) {
-                setTimeout(() => {
-                    this.bsDataValue = this.timeZone ? i1$1.getMomentLocaleObject(this.timeZone) : new Date();
-                }, 50);
-                this.isCurrentDate = true;
-            }
-            else {
-                this.bsDataValue = newVal ? i1$1.getDateObj(newVal, { isNativePicker: this.loadNativeDateInput }, this.timeZone) : undefined;
-                this.isCurrentDate = false;
-            }
-            // update the previous datavalue.
-            this.invokeOnChange(this.datavalue, undefined, true);
-            this.cdRef.detectChanges();
-        }
-        // TODO use BsLocaleService to set the current user's locale to see the localized labels
-        constructor(inj, cdRef, appDefaults, explicitContext) {
-            super(inj, WIDGET_CONFIG$2, explicitContext);
-            this.cdRef = cdRef;
-            this.appDefaults = appDefaults;
-            this.isOpen = false;
-            this.isEnterPressedOnDateInput = false;
-            this.showdateformatasplaceholder = false;
-            base.styler(this.nativeElement, this);
-            this.dateContainerCls = `app-date-${this.widgetId}`;
-            this._dateOptions.containerClass = `app-date ${this.dateContainerCls}`;
-            this._dateOptions.showWeekNumbers = false;
-            this._bsDefaultLoadCheck = true;
-            this.datepattern = this.appDefaults.dateFormat || i1$1.getDisplayDateTimeFormat(i1$1.FormWidgetType.DATE);
-            this.updateFormat('datepattern');
-        }
-        /**
-         * This is an internal method triggered when the date input changes
-         */
-        onDisplayDateChange($event, isNativePicker = false) {
-            this.updateIMask();
-            if (this.isEnterPressedOnDateInput) {
-                this.isEnterPressedOnDateInput = false;
-                return;
-            }
-            const newVal = i1$1.getDateObj($event.target.value, { pattern: this.datepattern, isNativePicker: isNativePicker });
-            // date pattern validation
-            // if invalid pattern is entered, device is showing an error.
-            if (!this.formatValidation(newVal, $event.target.value, isNativePicker)) {
-                return;
-            }
-            // min date and max date validation in mobile view.
-            // if invalid dates are entered, device is showing an alert.
-            if (isNativePicker && this.minDateMaxDateValidationOnInput(newVal, $event, this.displayValue, isNativePicker)) {
-                return;
-            }
-            this.setDataValue(newVal);
-        }
-        // sets the dataValue and computes the display model values
-        setDataValue(newVal) {
-            this.invalidDateTimeFormat = false;
-            // min date and max date validation in web.
-            // if invalid dates are entered, device is showing validation message.
-            this.minDateMaxDateValidationOnInput(newVal);
-            if (i1$1.getFormattedDate(this.datePipe, newVal, this.dateInputFormat, this.timeZone, null, this.isCurrentDate, this) === this.displayValue) {
-                $(this.nativeElement).find('.display-input').val(this.displayValue);
-            }
-            if (newVal) {
-                this.bsDataValue = newVal;
-                this.updateIMask();
-            }
-            else {
-                this.bsDataValue = undefined;
-            }
-            this.invokeOnChange(this.datavalue, {}, true);
-        }
-        onDatePickerOpen() {
-            this.isOpen = true;
-            this.activeDate = this.bsDataValue ? this.bsDataValue : (this.timeZone ? i1$1.getMomentLocaleObject(this.timeZone) : new Date());
-            if (!this.bsDataValue) {
-                this.hightlightToday(this.activeDate);
-            }
-            this.updateIMask();
-            // We are using the two input tags(To maintain the modal and proxy modal) for the date control.
-            // So actual bootstrap input target width we made it to 0, so bootstrap calculating the calendar container top position improperly.
-            // To fix the container top position set the width 1px;
-            this.$element.find('.model-holder').width('1px');
-            const dpContainerEl = $('bs-datepicker-container');
-            dpContainerEl.attr('aria-label', 'Use Arrow keys to navigate dates, Choose Date from datepicker');
-            $('.bs-calendar-container').removeAttr('role');
-            const datePickerContainer = $('.bs-datepicker-container')[0];
-            this.focusTrap = base.setFocusTrap(datePickerContainer, true);
-            this.focusTrap.activate();
-            this.addDatepickerKeyboardEvents(this, false);
-            i1$1.adjustContainerPosition($('bs-datepicker-container'), this.nativeElement, this.bsDatePickerDirective._datepicker);
-            i1$1.adjustContainerRightEdges($('bs-datepicker-container'), this.nativeElement, this.bsDatePickerDirective._datepicker);
-            if (this.timeZone) {
-                const todayBtn = document.querySelector(`.${this.dateContainerCls} .bs-datepicker-buttons .btn-today-wrapper button`);
-                const setTodayTZHandler = (event) => {
-                    const todayTZ = i1$1.getMomentLocaleObject(this.timeZone);
-                    if (new Date(this.bsDataValue).toDateString() !== new Date(todayTZ).toDateString()) {
-                        this.bsDataValue = todayTZ;
-                    }
-                    todayBtn.removeEventListener('click', setTodayTZHandler);
-                };
-                todayBtn.addEventListener('click', setTodayTZHandler);
-            }
-        }
-        onInputBlur($event) {
-            this.updateIMask();
-            if (!$($event.relatedTarget).hasClass('current-date')) {
-                this.invokeOnTouched();
-                this.invokeEventCallback('blur', { $event });
-            }
-        }
-        updateIMask() {
-            this.imask?.maskRef?.updateValue();
-        }
-        hideDatepickerDropdown() {
-            this.invokeOnTouched();
-            this.isOpen = false;
-            this.focusTrap?.deactivate();
-            this.isEnterPressedOnDateInput = false;
-            if (this.deregisterEventListener) {
-                this.deregisterEventListener();
-            }
-            this.blurDateInput(this.isOpen);
-        }
-        // change and blur events are added from the template
-        handleEvent(node, eventName, callback, locals) {
-            if (!lodashEs.includes(['blur', 'focus', 'change', 'click'], eventName)) {
-                super.handleEvent(node, eventName, callback, locals);
-            }
-        }
-        /**
-         * This is an internal method used to toggle the dropdown of the date widget
-         */
-        toggleDpDropdown($event, skipFocus = false) {
-            if (this.loadNativeDateInput) {
-                // Fixes click event getting triggred twice in Mobile devices.
-                if (!skipFocus) {
-                    this.onDateTimeInputFocus();
-                }
-            }
-            if ($event.type === 'click') {
-                this.invokeEventCallback('click', { $event: $event });
-                //  this.focusOnInputEl();
-            }
-            if ($event.target && $($event.target).is('input') && !(this.isDropDownDisplayEnabledOnInput(this.showdropdownon))) {
-                $event.stopPropagation();
-                return;
-            }
-            this.bsDatePickerDirective.toggle();
-            this.addBodyClickListener(this.bsDatePickerDirective.isOpen);
-        }
-        addBodyClickListener(skipListener) {
-            if (!skipListener) {
-                return;
-            }
-            const bodyElement = document.querySelector('body');
-            setTimeout(() => {
-                const bsDateContainerElement = bodyElement.querySelector(`.${this.dateContainerCls}`);
-                this.deregisterEventListener = i1$1.addEventListenerOnElement(bodyElement, bsDateContainerElement, this.nativeElement, 'click', this.isDropDownDisplayEnabledOnInput(this.showdropdownon), () => {
-                    this.isOpen = false;
-                }, 0 /* EVENT_LIFE.ONCE */, true);
-            }, 350);
-        }
-        /**
-         * This is an internal method triggered when pressing key on the date input
-         */
-        onDisplayKeydown(event) {
-            if (this.isDropDownDisplayEnabledOnInput(this.showdropdownon)) {
-                event.stopPropagation();
-                if (event.key === 'Enter') {
-                    const newVal = i1$1.getDateObj(event.target.value, { pattern: this.datepattern });
-                    event.preventDefault();
-                    const formattedDate = i1$1.getFormattedDate(this.datePipe, newVal, this.dateInputFormat, this.timeZone, null, this.isCurrentDate, this);
-                    const inputVal = event.target.value.trim();
-                    if (inputVal && this.datepattern === 'timestamp') {
-                        if (!lodashEs.isNaN(inputVal) && lodashEs.parseInt(inputVal) !== formattedDate) {
-                            this.invalidDateTimeFormat = true;
-                            this.invokeOnChange(this.datavalue, event, false);
-                        }
-                    }
-                    else if (inputVal && inputVal !== formattedDate) {
-                        this.invalidDateTimeFormat = true;
-                        this.invokeOnChange(this.datavalue, event, false);
-                    }
-                    else {
-                        this.invalidDateTimeFormat = false;
-                        this.isEnterPressedOnDateInput = true;
-                        this.bsDatePickerDirective.bsValue = event.target.value ? newVal : '';
-                        this.updateIMask();
-                    }
-                    this.toggleDpDropdown(event);
-                }
-                else {
-                    this.hideDatepickerDropdown();
-                }
-            }
-            else {
-                this.hideDatepickerDropdown();
-            }
-        }
-        /**
-         * This is an internal method triggered when the date selection changes
-         */
-        onDateChange(newVal) {
-            /**
-             *  Ngx-bootstrap upgrade : To avoid the page load datechange event;
-             *  TODO:
-             *  https://github.com/valor-software/ngx-bootstrap/issues/6016
-             *  For above issue, once we get the solution from Ngx-Bootstrap team,  remove the _bsDefaultLoadCheck check and update accordingly.
-             * */
-            if (this._bsDefaultLoadCheck) {
-                this._bsDefaultLoadCheck = false;
-                return;
-            }
-            this.setDataValue(newVal);
-        }
-        onPropertyChange(key, nv, ov) {
-            if (key === 'showdateformatasplaceholder') {
-                this.showdateformatasplaceholder = nv;
-                this.imask?.destroyMask();
-                if (this.showdateformatasplaceholder && this.datepattern !== 'timestamp') {
-                    this.mask = validateTheMaskedDate(this.datepattern, this.selectedLocale);
-                    this.maskDateInputFormat = this.dateInputFormat;
-                    this.maskDateInputFormat = (this.dateInputFormat.split('d').length - 1) === 1 ? this.maskDateInputFormat.replace('d', 'dd') : this.maskDateInputFormat;
-                    this.maskDateInputFormat = (this.dateInputFormat.split('M').length - 1) === 1 ? this.maskDateInputFormat.replace('M', 'MM') : this.maskDateInputFormat;
-                    this.updateIMask();
-                }
-            }
-            else {
-                super.onPropertyChange(key, nv, ov);
-            }
-        }
-        static { this.ɵfac = function DateComponent_Factory(t) { return new (t || DateComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i0__namespace.ChangeDetectorRef), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.AppDefaults), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: DateComponent, selectors: [["", "wmDate", ""]], viewQuery: function DateComponent_Query(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵviewQuery(i3.BsDatepickerDirective, 5);
-                i0__namespace.ɵɵviewQuery(_c0$2, 5, i4.IMaskDirective);
-            } if (rf & 2) {
-                let _t;
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.bsDatePickerDirective = _t.first);
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.imask = _t.first);
-            } }, features: [i0__namespace.ɵɵProvidersFeature([
-                    base.provideAs(DateComponent, i5.NG_VALUE_ACCESSOR, true),
-                    base.provideAs(DateComponent, i5.NG_VALIDATORS, true),
-                    base.provideAsWidgetRef(DateComponent)
-                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c1, decls: 9, vars: 27, consts: [["dateInput", ""], ["datepicker", "bsDatepicker"], ["focus-target", "", "type", "text", 1, "form-control", "app-textbox", "app-dateinput", "display-input", 3, "click", "focus", "blur", "change", "keydown", "name", "imask", "unmask", "tabindex", "value", "disabled", "autofocus", "required", "readOnly"], [1, "input-group-btn"], ["type", "button", "aria-haspopup", "true", "aria-expanded", "false", 1, "btn", "btn-default", "btn-time", 3, "click", "tabindex", "disabled"], ["aria-hidden", "true", 1, "app-icon", "wm-sl-l", "sl-calendar"], [2, "width", "0", "display", "inline-block"], ["aria-label", "datepicker dropdownmenu", "aria-controls", "date", "bsDatepicker", "", "placement", "bottom right", 1, "model-holder", 3, "onShown", "onHidden", "bsValueChange", "tabindex", "container", "bsConfig", "isOpen", "daysDisabled", "datesDisabled", "isDisabled", "bsValue"], [3, "ngIf"], ["dateTimePicker", "", "mode", "DATE", 3, "change", "config", "placement", "excludedDaysToDisable", "excludedDatesToDisable", "displayFormat", "value"], ["role", "button", 1, "mobile-input", "mobile-datepicker-container", 3, "click", "focus", "blur", "tabindex"]], template: function DateComponent_Template(rf, ctx) { if (rf & 1) {
-                const _r1 = i0__namespace.ɵɵgetCurrentView();
-                i0__namespace.ɵɵelementStart(0, "input", 2, 0);
-                i0__namespace.ɵɵlistener("click", function DateComponent_Template_input_click_0_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.toggleDpDropdown($event, true)); })("focus", function DateComponent_Template_input_focus_0_listener($event) { i0__namespace.ɵɵrestoreView(_r1); ctx.onDateTimeInputFocus(); ctx.invokeOnFocus($event); return i0__namespace.ɵɵresetView(ctx.updateIMask()); })("blur", function DateComponent_Template_input_blur_0_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onInputBlur($event)); })("change", function DateComponent_Template_input_change_0_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onDisplayDateChange($event)); })("keydown", function DateComponent_Template_input_keydown_0_listener($event) { i0__namespace.ɵɵrestoreView(_r1); ctx._triggeredByUser = true; return i0__namespace.ɵɵresetView(ctx.onDisplayKeydown($event)); });
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(2, "span", 3)(3, "button", 4);
-                i0__namespace.ɵɵlistener("click", function DateComponent_Template_button_click_3_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.toggleDpDropdown($event, false)); });
-                i0__namespace.ɵɵelement(4, "i", 5);
-                i0__namespace.ɵɵelementEnd()();
-                i0__namespace.ɵɵelementStart(5, "div", 6)(6, "input", 7, 1);
-                i0__namespace.ɵɵlistener("onShown", function DateComponent_Template_input_onShown_6_listener() { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onDatePickerOpen()); })("onHidden", function DateComponent_Template_input_onHidden_6_listener() { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.hideDatepickerDropdown()); })("bsValueChange", function DateComponent_Template_input_bsValueChange_6_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onDateChange($event)); });
-                i0__namespace.ɵɵelementEnd()();
-                i0__namespace.ɵɵtemplate(8, DateComponent_ng_template_8_Template, 2, 8, "ng-template", 8);
-            } if (rf & 2) {
-                i0__namespace.ɵɵproperty("name", ctx.name)("imask", ctx.mask)("unmask", true)("tabindex", ctx.loadNativeDateInput ? "-1" : ctx.tabindex)("value", ctx.displayValue)("disabled", ctx.disabled || ctx.readonly)("autofocus", ctx.autofocus)("required", ctx.required)("readOnly", ctx.isReadOnly);
-                i0__namespace.ɵɵattribute("aria-hidden", !!ctx.loadNativeDateInput)("placeholder", ctx.placeholder)("accesskey", ctx.shortcutkey)("aria-label", ctx.hint);
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("tabindex", ctx.loadNativeDateInput ? "-1" : ctx.tabindex)("disabled", ctx.disabled || ctx.readonly);
-                i0__namespace.ɵɵattribute("aria-hidden", !!ctx.loadNativeDateInput)("aria-label", ctx.displayValue ? "Change Date " + ctx.displayValue : "Choose date by pressing enter");
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("tabindex", -1)("container", ctx.containerTarget || ".wm-app")("bsConfig", ctx._dateOptions)("isOpen", ctx.isOpen)("daysDisabled", ctx.excludedDaysToDisable)("datesDisabled", ctx.excludedDatesToDisable)("isDisabled", ctx.disabled || ctx.readonly)("bsValue", ctx.bsDataValue);
-                i0__namespace.ɵɵattribute("aria-hidden", !!ctx.loadNativeDateInput);
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("ngIf", ctx.loadNativeDateInput);
-            } }, dependencies: [i2__namespace.NgIf, i3__namespace.BsDatepickerDirective, i3__namespace.BsDatepickerInputDirective, i4__namespace.IMaskDirective, DateTimePickerComponent], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(DateComponent, [{
-            type: i0.Component,
-            args: [{ selector: '[wmDate]', providers: [
-                        base.provideAs(DateComponent, i5.NG_VALUE_ACCESSOR, true),
-                        base.provideAs(DateComponent, i5.NG_VALIDATORS, true),
-                        base.provideAsWidgetRef(DateComponent)
-                    ], template: "    <input class=\"form-control app-textbox app-dateinput display-input\"\n        focus-target\n        type=\"text\"\n        [name]=\"name\"\n        #dateInput\n        [imask]=\"mask\"\n        [unmask]=\"true\"\n        [tabindex]=\"loadNativeDateInput ? '-1' : tabindex\"\n        [attr.aria-hidden]=\"!!loadNativeDateInput\"\n        [value]=\"displayValue\"\n        (click)=\"toggleDpDropdown($event, true)\"\n        (focus)=\"onDateTimeInputFocus(); invokeOnFocus($event); updateIMask()\"\n        (blur)=\"onInputBlur($event)\"\n        [disabled]=\"disabled || readonly\"\n        [autofocus]=\"autofocus\"\n        [required]=\"required\"\n        [readOnly]=\"isReadOnly\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.accesskey]=\"shortcutkey\"\n        [attr.aria-label]=\"hint\"\n        (change)=\"onDisplayDateChange($event)\"\n        (keydown)=\"this._triggeredByUser = true; onDisplayKeydown($event);\">\n\n    <span class=\"input-group-btn\">\n        <button type=\"button\"\n            class=\"btn btn-default btn-time\"\n            [tabindex]=\"loadNativeDateInput ? '-1' : tabindex\"\n            [attr.aria-hidden]=\"!!loadNativeDateInput\"\n            [disabled]=\"disabled || readonly\"\n            [attr.aria-label]=\"displayValue ? 'Change Date ' + displayValue : 'Choose date by pressing enter'\"\n            aria-haspopup=\"true\"\n            aria-expanded=\"false\"\n            (click)=\"toggleDpDropdown($event, false)\">\n            <i aria-hidden=\"true\"\n                class=\"app-icon wm-sl-l sl-calendar\"></i>\n        </button>\n    </span>\n    <div style=\"width: 0;display: inline-block;\">\n    <input class=\"model-holder\"\n        aria-label=\"datepicker dropdownmenu\"\n        aria-controls=\"date\"\n        [tabindex]=\"-1\"\n        [attr.aria-hidden]=\"!!loadNativeDateInput\"\n        [container]=\"containerTarget || '.wm-app'\"\n        [bsConfig]=\"_dateOptions\"\n        [isOpen]=\"isOpen\"\n        #datepicker=\"bsDatepicker\"\n        bsDatepicker\n        [daysDisabled]=\"excludedDaysToDisable\"\n        [datesDisabled]=\"excludedDatesToDisable\"\n        placement=\"bottom right\"\n        [isDisabled]=\"disabled || readonly\"\n        [bsValue]=\"bsDataValue\"\n        (onShown)=\"onDatePickerOpen()\"\n        (onHidden)=\"hideDatepickerDropdown()\"\n        (bsValueChange)=\"onDateChange($event)\">\n</div>\n\n<ng-template [ngIf]=\"loadNativeDateInput\">\n    <wm-datetimepicker\n        dateTimePicker\n        mode=\"DATE\"\n        [config]=\"_dateOptions\"\n        [placement]=\"modal\"\n        [excludedDaysToDisable]=\"excludedDaysToDisable\"\n        [excludedDatesToDisable]=\"excludedDatesToDisable\"\n        [displayFormat]=\"dateInputFormat\"\n        [value]=\"bsDataValue\"\n        (change)=\"onDateChange($event)\">\n    </wm-datetimepicker>\n    <div class=\"mobile-input mobile-datepicker-container\"\n        [tabindex]=\"tabindex || 0\"\n         (click)=\"!(disabled || readonly) && showDatePickerModal(bsDataValue)\"\n        (focus)=\"onDateTimeInputFocus(true); invokeOnFocus($event);\"\n        (blur)=\"onDateTimeInputBlur(); invokeOnTouched($event)\"\n         [attr.aria-label]=\"displayValue ? 'Change Date ' + displayValue : hint || 'Choose Date'\"\n         role=\"button\">\n    </div>\n</ng-template>\n" }]
-        }], () => [{ type: i0__namespace.Injector }, { type: i0__namespace.ChangeDetectorRef }, { type: i1$1__namespace.AppDefaults }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], { bsDatePickerDirective: [{
-                type: i0.ViewChild,
-                args: [i3.BsDatepickerDirective]
-            }], imask: [{
-                type: i0.ViewChild,
-                args: ['dateInput', { read: i4.IMaskDirective }]
-            }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(DateComponent, { className: "DateComponent", filePath: "date/date.component.ts", lineNumber: 43 }); })();
-
-    const dateTimeProps = new Map([
-        ['autofocus', base.PROP_BOOLEAN],
-        ['class', base.PROP_STRING],
-        ['dataentrymode', { value: 'default', ...base.PROP_STRING }],
-        ['datavaluesource', base.PROP_ANY],
-        ['datavalue', base.PROP_STRING],
-        ['datepattern', base.PROP_STRING],
-        ['disabled', base.PROP_BOOLEAN],
-        ['excludedays', base.PROP_STRING],
-        ['excludedates', base.PROP_STRING],
-        ['hint', base.PROP_STRING],
-        ['hourstep', { value: 1, ...base.PROP_NUMBER }],
-        ['maxdate', base.PROP_STRING],
-        ['mindate', base.PROP_STRING],
-        ['minutestep', { value: 15, ...base.PROP_NUMBER }],
-        ['name', base.PROP_STRING],
-        ['outputformat', { value: 'timestamp', ...base.PROP_STRING }],
-        ['placeholder', { value: 'Select date time', ...base.PROP_STRING }],
-        ['readonly', base.PROP_BOOLEAN],
-        ['required', base.PROP_BOOLEAN],
-        ['secondsstep', { value: 1, ...base.PROP_NUMBER }],
-        ['shortcutkey', base.PROP_STRING],
-        ['show', { value: true, ...base.PROP_BOOLEAN }],
-        ['showdropdownon', { value: 'default', ...base.PROP_STRING }],
-        ['showbuttonbar', base.PROP_BOOLEAN],
-        ['showcustompicker', { value: false, ...base.PROP_BOOLEAN }],
-        ['showindevice', { displayType: 'inline-block', value: 'all', ...base.PROP_STRING }],
-        ['showweeks', base.PROP_BOOLEAN],
-        ['tabindex', { value: 0, ...base.PROP_NUMBER }],
-        ['timestamp', base.PROP_STRING],
-        ['selectfromothermonth', { value: true, ...base.PROP_BOOLEAN }],
-        ['todaybutton', { value: true, ...base.PROP_BOOLEAN }],
-        ['clearbutton', { value: true, ...base.PROP_BOOLEAN }],
-        ['adaptiveposition', { value: true, ...base.PROP_BOOLEAN }],
-        ['todaybuttonlabel', { value: 'LABEL_TODAY_DATE', ...base.PROP_STRING }],
-        ['clearbuttonlabel', { value: 'LABEL_CLEAR_DATE', ...base.PROP_STRING }]
-    ]);
-    const registerProps$1 = () => {
-        base.register('wm-datetime', dateTimeProps);
-        base.registerFormWidget(i1$1.FormWidgetType.DATETIME, new Map(dateTimeProps));
-        base.registerFormWidget(i1$1.FormWidgetType.TIMESTAMP, new Map(dateTimeProps));
-    };
-
-    const _c0$1 = ["wmDateTime", ""];
-    function DatetimeComponent_div_10_Template(rf, ctx) { if (rf & 1) {
-        const _r2 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "div", 12);
-        i0__namespace.ɵɵlistener("click", function DatetimeComponent_div_10_Template_div_click_0_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r2.preventTpClose($event)); });
-        i0__namespace.ɵɵelementStart(1, "timepicker", 13);
-        i0__namespace.ɵɵtwoWayListener("ngModelChange", function DatetimeComponent_div_10_Template_timepicker_ngModelChange_1_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); i0__namespace.ɵɵtwoWayBindingSet(ctx_r2.bsTimeValue, $event) || (ctx_r2.bsTimeValue = $event); return i0__namespace.ɵɵresetView($event); });
-        i0__namespace.ɵɵlistener("isValid", function DatetimeComponent_div_10_Template_timepicker_isValid_1_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r2.isValid($event)); })("ngModelChange", function DatetimeComponent_div_10_Template_timepicker_ngModelChange_1_listener($event) { i0__namespace.ɵɵrestoreView(_r2); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r2.onModelUpdate($event, "time")); });
-        i0__namespace.ɵɵelementEnd()();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("showMeridian", ctx_r2.ismeridian)("readonlyInput", ctx_r2.disabled || ctx_r2.readonly || ctx_r2.isCurrentDate);
-        i0__namespace.ɵɵtwoWayProperty("ngModel", ctx_r2.bsTimeValue);
-        i0__namespace.ɵɵproperty("min", ctx_r2.minTime)("max", ctx_r2.maxTime)("hourStep", ctx_r2.hourstep)("minuteStep", ctx_r2.minutestep)("secondsStep", ctx_r2.secondsstep)("mousewheel", true)("arrowkeys", true)("showSeconds", ctx_r2.showseconds);
-    } }
-    function DatetimeComponent_ng_template_11_Template(rf, ctx) { if (rf & 1) {
-        const _r4 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "wm-datetimepicker", 14);
-        i0__namespace.ɵɵlistener("change", function DatetimeComponent_ng_template_11_Template_wm_datetimepicker_change_0_listener($event) { i0__namespace.ɵɵrestoreView(_r4); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r2.onModelUpdate($event, "date")); });
-        i0__namespace.ɵɵelementEnd();
-        i0__namespace.ɵɵelementStart(1, "div", 15);
-        i0__namespace.ɵɵlistener("click", function DatetimeComponent_ng_template_11_Template_div_click_1_listener() { i0__namespace.ɵɵrestoreView(_r4); const ctx_r2 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(!(ctx_r2.disabled || ctx_r2.readonly) && ctx_r2.showDatePickerModal(ctx_r2.bsDateValue)); })("focus", function DatetimeComponent_ng_template_11_Template_div_focus_1_listener($event) { i0__namespace.ɵɵrestoreView(_r4); const ctx_r2 = i0__namespace.ɵɵnextContext(); ctx_r2.onDateTimeInputFocus(true); return i0__namespace.ɵɵresetView(ctx_r2.invokeOnFocus($event)); })("blur", function DatetimeComponent_ng_template_11_Template_div_blur_1_listener($event) { i0__namespace.ɵɵrestoreView(_r4); const ctx_r2 = i0__namespace.ɵɵnextContext(); ctx_r2.onDateTimeInputBlur(); return i0__namespace.ɵɵresetView(ctx_r2.invokeOnTouched($event)); });
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r2 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵproperty("config", ctx_r2._dateOptions)("placement", ctx_r2.modal)("excludedDaysToDisable", ctx_r2.excludedDaysToDisable)("excludedDatesToDisable", ctx_r2.excludedDatesToDisable)("displayFormat", ctx_r2.dateInputFormat)("value", ctx_r2.bsDateValue);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("tabindex", ctx_r2.tabindex || 0);
-        i0__namespace.ɵɵattribute("aria-label", ctx_r2.displayValue ? "Change Date " + ctx_r2.displayValue : ctx_r2.hint || "Choose Date");
-    } }
-    const DEFAULT_CLS$1 = 'app-datetime input-group';
-    const WIDGET_CONFIG$1 = { widgetType: 'wm-datetime', hostClass: DEFAULT_CLS$1 };
-    const CURRENT_DATE = 'CURRENT_DATE';
-    class DatetimeComponent extends BaseDateTimeComponent {
-        static { this.initializeProps = registerProps$1(); }
-        get timestamp() {
-            return this.proxyModel ? this.proxyModel.valueOf() : undefined;
-        }
-        get dateInputFormat() {
-            return this._dateOptions.dateInputFormat || 'yyyy-MM-ddTHH:mm:ss';
-        }
-        /**
-         * The displayValue is the display value of the bsDateTimeValue after applying the datePattern on it.
-         * @returns {any|string}
-         */
-        get displayValue() {
-            return i1$1.getFormattedDate(this.datePipe, this.proxyModel, this.dateInputFormat, this.timeZone, this.key, this.isCurrentDate, this) || '';
-        }
-        get nativeDisplayValue() {
-            return i1$1.getFormattedDate(this.datePipe, this.proxyModel, 'yyyy-MM-ddTHH:mm:ss', this.timeZone, this.key, this.isCurrentDate, this) || '';
-        }
-        // @ts-ignore
-        get datavalue() {
-            if (this.isCurrentDate && !this.proxyModel) {
-                return CURRENT_DATE;
-            }
-            return i1$1.getFormattedDate(this.datePipe, this.proxyModel, this.outputformat, this.timeZone, null, null, this);
-        }
-        /**Todo[Shubham]: needs to be redefined
-         * This property sets the default value for the date selection
-         */
-        // @ts-ignore
-        set datavalue(newVal) {
-            if (newVal === CURRENT_DATE) {
-                this.isCurrentDate = true;
-                this.setTimeInterval();
-            }
-            else {
-                this.proxyModel = newVal ? i1$1.getDateObj(newVal, { isNativePicker: this.loadNativeDateInput }, this.timeZone) : undefined;
-                this.clearTimeInterval();
-                this.isCurrentDate = false;
-            }
-            this.bsTimeValue = this.bsDateValue = this.proxyModel;
-            this.cdRef.detectChanges();
-        }
-        constructor(inj, ngZone, cdRef, appDefaults, app, explicitContext) {
-            super(inj, WIDGET_CONFIG$1, explicitContext);
-            this.ngZone = ngZone;
-            this.cdRef = cdRef;
-            this.appDefaults = appDefaults;
-            this.isEnterPressedOnDateInput = false;
-            /**
-             * This property checks if the timePicker is Open
-             */
-            this.isTimeOpen = false;
-            /**
-             * This property checks if the datePicker is Open
-             */
-            this.isDateOpen = false;
-            /**
-             * This property is set to TRUE if the time component value is set to CURRENT_TIME; In this case the timer keeps changing the time value until the widget is available.
-             */
-            this.isCurrentDate = false;
-            this._debouncedOnChange = lodashEs.debounce(this.invokeOnChange, 10);
-            this.registerDestroyListener(() => this.clearTimeInterval());
-            base.styler(this.nativeElement, this);
-            this.app = app;
-            this.dateContainerCls = `app-date-${this.widgetId}`;
-            this._dateOptions.containerClass = `app-date ${this.dateContainerCls}`;
-            this._dateOptions.showWeekNumbers = false;
-            this.datepattern = this.appDefaults.dateTimeFormat || i1$1.getDisplayDateTimeFormat(i1$1.FormWidgetType.DATETIME);
-            this.updateFormat('datepattern');
-        }
-        /**
-         * This is an internal method used to maintain a time interval to update the time model when the data value is set to CURRENT_TIME
-         */
-        setTimeInterval() {
-            if (this.timeinterval) {
-                return;
-            }
-            this.timeinterval = setInterval(() => {
-                const currentTime = this.timeZone ? i1$1.getMomentLocaleObject(this.timeZone) : new Date();
-                this.onModelUpdate(currentTime);
-            }, 1000);
-        }
-        /**
-         * This is an internal method used to clear the time interval created
-         */
-        clearTimeInterval() {
-            if (this.timeinterval) {
-                clearInterval(this.timeinterval);
-                this.timeinterval = null;
-            }
-        }
-        /**
-         * This is an internal method to toggle the time picker
-         */
-        toggleTimePicker(newVal, $event) {
-            if (this.loadNativeDateInput) {
-                this.onDateTimeInputFocus();
-                return;
-            }
-            this.isTimeOpen = newVal;
-            if ($event && $event.type === 'click') {
-                this.invokeEventCallback('click', { $event: $event });
-            }
-            this.addTimepickerClickListener(this.isTimeOpen);
-        }
-        addTimepickerClickListener(skipListener) {
-            if (!skipListener) {
-                return;
-            }
-            const bodyElement = document.querySelector('body');
-            setTimeout(() => {
-                const dropdownElement = $(bodyElement).find('>bs-dropdown-container .dropdown-menu').get(0);
-                this.deregisterTimepickeEventListener = i1$1.addEventListenerOnElement(bodyElement, dropdownElement, this.nativeElement, 'click', this.isDropDownDisplayEnabledOnInput(this.showdropdownon), () => {
-                    this.toggleTimePicker(false);
-                }, 0 /* EVENT_LIFE.ONCE */, true);
-            }, 350);
-        }
-        /**
-         * This function sets the value isOpen/isTimeOpen (i.e when datepicker popup is closed) based on widget type(i.e  DateTime, Time)
-         * @param val - isOpen/isTimeOpen is set based on the timepicker popup is open/closed
-         */
-        setIsTimeOpen(val) {
-            this.isTimeOpen = val;
-        }
-        hideTimepickerDropdown() {
-            this.invokeOnTouched();
-            this.toggleTimePicker(false);
-            if (this.deregisterTimepickeEventListener) {
-                this.deregisterTimepickeEventListener();
-            }
-            const parentEl = $(this.nativeElement).closest('.app-composite-widget.caption-floating');
-            if (parentEl.length > 0) {
-                this.app.notify('captionPositionAnimate', { displayVal: this.displayValue, nativeEl: parentEl });
-            }
-        }
-        /**
-         * This is an internal method to add a click listener once the time dropdown is open
-         */
-        onTimepickerOpen() {
-            // adding class for time widget dropdown menu
-            const tpElements = document.querySelectorAll('timepicker');
-            lodashEs.forEach(tpElements, (element) => {
-                i1$1.addClass(element.parentElement, 'app-datetime', true);
-            });
-            this.bsDatePickerDirective.hide();
-            this.focusTimePickerPopover(this);
-            this.bindTimePickerKeyboardEvents();
-            i1$1.adjustContainerPosition($('bs-dropdown-container'), this.nativeElement, this.bsDropdown._dropdown, $('bs-dropdown-container .dropdown-menu'));
-            i1$1.adjustContainerRightEdges($('bs-dropdown-container'), this.nativeElement, this.bsDropdown._dropdown, $('bs-dropdown-container .dropdown-menu'));
-        }
-        onDatePickerOpen() {
-            this.isDateOpen = !this.isDateOpen;
-            this.toggleTimePicker(false);
-            // We are using the two input tags(To maintain the modal and proxy modal) for the date control.
-            // So actual bootstrap input target width we made it to 0 so bootstrap calculating the calendar container top position impropery.
-            // To fix the container top position set the width 1px;
-            this.$element.find('.model-holder').width('1px');
-            const dpContainerEl = $('bs-datepicker-container');
-            dpContainerEl.attr('aria-label', 'Use Arrow keys to navigate dates, Choose Date from datepicker');
-            $('.bs-calendar-container').removeAttr('role');
-            const datePickerContainer = $('.bs-datepicker-container')[0];
-            this.focusTrap = base.setFocusTrap(datePickerContainer, true);
-            this.focusTrap.activate();
-            this.bsDateValue ? this.activeDate = this.bsDateValue : this.activeDate = new Date();
-            if (!this.bsDateValue) {
-                this.hightlightToday(this.activeDate);
-            }
-            this.addDatepickerKeyboardEvents(this, true);
-            i1$1.adjustContainerPosition($('bs-datepicker-container'), this.nativeElement, this.bsDatePickerDirective._datepicker);
-        }
-        /**
-         * This is an internal method to update the model
-         */
-        onModelUpdate(newVal, type) {
-            if (type === 'date') {
-                this.invalidDateTimeFormat = false;
-                if (i1$1.getFormattedDate(this.datePipe, newVal, this.dateInputFormat, this.timeZone, this.key, this.isCurrentDate, this) === this.displayValue) {
-                    $(this.nativeElement).find('.display-input').val(this.displayValue);
-                }
-            }
-            // min date and max date validation in web.
-            // if invalid dates are entered, device is showing validation message.
-            this.minDateMaxDateValidationOnInput(newVal);
-            if (!newVal) {
-                // Set timevalue as 00:00:00 if we remove any one from hours/minutes/seconds field in timepicker after selecting date
-                if (this.bsDateValue && this.bsTimePicker && (this.bsTimePicker.hours === '' || this.bsTimePicker.minutes === '' || this.bsTimePicker.seconds === '')) {
-                    this.bsDateValue = this.bsTimeValue = this.proxyModel = moment(this.bsDateValue).startOf('day').toDate();
-                }
-                else {
-                    this.bsDateValue = this.bsTimeValue = this.proxyModel = undefined;
-                }
-                // When the datavalue is manually cleared, both newval and datavalue are undefined but prevDataValue exists - trigger change cb
-                if (newVal !== this.datavalue || (!this.datavalue && this.prevDatavalue)) {
-                    this._debouncedOnChange(this.datavalue, {}, true);
-                }
-                return;
-            }
-            if (type === 'date') {
-                if (this.isDateOpen) {
-                    this.toggleTimePicker(true);
-                }
-            }
-            this.proxyModel = newVal;
-            if (this.proxyModel) {
-                this.bsDateValue = this.bsTimeValue = newVal;
-            }
-            this._debouncedOnChange(this.datavalue, {}, true);
-            this.cdRef.detectChanges();
-            // Update timepicker with formatted time, when timezone is provided.
-            const timePickerFields = $('.bs-timepicker-field');
-            if (this.timeZone && this.key === 'datetimestamp' && timePickerFields.length) {
-                const formattedDate = i1$1.getFormattedDate(this.datePipe, newVal, this.getTimePattern(), this.timeZone, this.key, null, this);
-                this.updateTimepickerFields(formattedDate, timePickerFields);
-            }
-        }
-        // deduces the timepattern from datepattern set in the studio
-        getTimePattern() {
-            let timepattern;
-            const timePatternStartIndex = this.datepattern.toLowerCase().indexOf('h');
-            let timePatternEndIndex = this.datepattern.toLowerCase().indexOf(':ss');
-            if (timePatternEndIndex > -1) {
-                // adding the index to +3 to incluse :ss
-                timePatternEndIndex += 3;
-            }
-            else {
-                timePatternEndIndex = this.datepattern.toLowerCase().indexOf(':mm');
-                // adding the index to +3 to incluse :mm
-                if (timePatternEndIndex > -1) {
-                    timePatternEndIndex += 3;
-                }
-            }
-            const hasMeridian = this.datepattern.toLowerCase().indexOf('a');
-            timepattern = this.datepattern.substr(timePatternStartIndex, timePatternEndIndex);
-            if (hasMeridian > -1)
-                timepattern += ' a';
-            return timepattern;
-        }
-        updateTimepickerFields(date, timePickerFields) {
-            const meridianField = $('timepicker button.text-center');
-            const formattedArr = date.split(' ');
-            const formattedTime = formattedArr[0].split(':');
-            for (let i = 0; i < timePickerFields.length; i++) {
-                timePickerFields[i].value = formattedTime[i];
-            }
-            if (meridianField?.html()?.trim() !== formattedArr[1]) {
-                meridianField.text(formattedArr[1]);
-            }
-        }
-        /**
-         * This is an internal method used to Prevent time picker close while changing time value
-         */
-        preventTpClose($event) {
-            $event.stopImmediatePropagation();
-        }
-        /**
-         * This is an internal method used to toggle the dropdown of the date widget
-         */
-        toggleDpDropdown($event, skipFocus = false) {
-            if (this.loadNativeDateInput) {
-                //Fixes click event getting triggred twice in Mobile devices.
-                if (!skipFocus) {
-                    this.onDateTimeInputFocus();
-                }
-                return;
-            }
-            if ($event.type === 'click') {
-                this.invokeEventCallback('click', { $event: $event });
-                //this.focusOnInputEl();
-            }
-            if ($event.target && $($event.target).is('input') && !(this.isDropDownDisplayEnabledOnInput(this.showdropdownon))) {
-                $event.stopPropagation();
-                return;
-            }
-            this.bsDatePickerDirective.toggle();
-            this.addBodyClickListener(this.bsDatePickerDirective.isOpen);
-        }
-        addBodyClickListener(skipListener) {
-            if (!skipListener) {
-                return;
-            }
-            const bodyElement = document.querySelector('body');
-            setTimeout(() => {
-                const bsDateContainerElement = bodyElement.querySelector(`.${this.dateContainerCls}`);
-                this.deregisterDatepickerEventListener = i1$1.addEventListenerOnElement(bodyElement, bsDateContainerElement, this.nativeElement, 'click', this.isDropDownDisplayEnabledOnInput(this.showdropdownon), () => {
-                    this.bsDatePickerDirective.hide();
-                }, 0 /* EVENT_LIFE.ONCE */, true);
-            }, 350);
-        }
-        hideDatepickerDropdown() {
-            this.isDateOpen = false;
-            this.focusTrap?.deactivate();
-            this.invokeOnTouched();
-            this.bsDatePickerDirective.hide();
-            // To open the timepicker menu when user wants to update time without changing the date.
-            if (this.bsDateValue) {
-                this.toggleTimePicker(true);
-            }
-            this.isEnterPressedOnDateInput = false;
-            if (this.deregisterDatepickerEventListener) {
-                this.deregisterDatepickerEventListener();
-            }
-            const parentEl = $(this.nativeElement).closest('.app-composite-widget.caption-floating');
-            if (parentEl.length > 0) {
-                this.app.notify('captionPositionAnimate', { displayVal: this.displayValue, nativeEl: parentEl });
-            }
-            this.blurDateInput(this.isDateOpen);
-        }
-        onDateChange($event, isNativePicker) {
-            if (this.isEnterPressedOnDateInput) {
-                this.isEnterPressedOnDateInput = false;
-                return;
-            }
-            let newVal = $event.target.value.trim();
-            newVal = newVal ? i1$1.getNativeDateObject(newVal, { pattern: this.loadNativeDateInput ? this.outputformat : this.datepattern, meridians: this.meridians, isNativePicker: this.loadNativeDateInput }) : undefined;
-            // datetime pattern validation
-            // if invalid pattern is entered, device is showing an error.
-            if (!this.formatValidation(newVal, $event.target.value, isNativePicker)) {
-                return;
-            }
-            // min date and max date validation in mobile view.
-            // if invalid dates are entered, device is showing an alert.
-            if (isNativePicker && this.minDateMaxDateValidationOnInput(newVal, $event, this.displayValue, isNativePicker)) {
-                return;
-            }
-            this.invalidDateTimeFormat = false;
-            this.onModelUpdate(newVal);
-        }
-        /**
-         * This is an internal method triggered when pressing key on the datetime input
-         */
-        onDisplayKeydown(event) {
-            if (this.isDropDownDisplayEnabledOnInput(this.showdropdownon)) {
-                event.stopPropagation();
-                let newVal = event.target.value.trim();
-                if (event.key === 'Enter' || event.key === 'ArrowDown') {
-                    newVal = newVal ? i1$1.getNativeDateObject(newVal, { pattern: this.loadNativeDateInput ? this.outputformat : this.datepattern, meridians: this.meridians }) : undefined;
-                    event.preventDefault();
-                    const formattedDate = i1$1.getFormattedDate(this.datePipe, newVal, this.dateInputFormat, this.timeZone, this.key, this.isCurrentDate, this);
-                    const inputVal = event.target.value.trim();
-                    if (inputVal && this.datepattern === 'timestamp') {
-                        if (!lodashEs.isNaN(inputVal) && lodashEs.parseInt(inputVal) !== formattedDate) {
-                            this.invalidDateTimeFormat = true;
-                            this.invokeOnChange(this.datavalue, event, false);
-                        }
-                    }
-                    else if (inputVal && inputVal !== formattedDate) {
-                        this.invalidDateTimeFormat = true;
-                        this.invokeOnChange(this.datavalue, event, false);
-                    }
-                    else {
-                        this.invalidDateTimeFormat = false;
-                        this.isEnterPressedOnDateInput = true;
-                        this.bsDatePickerDirective.bsValue = newVal;
-                    }
-                    this.toggleDpDropdown(event);
-                }
-                else {
-                    this.hideDatepickerDropdown();
-                    this.hideTimepickerDropdown();
-                }
-            }
-            else {
-                this.hideDatepickerDropdown();
-                this.hideTimepickerDropdown();
-            }
-        }
-        isValid(event) {
-            if (!event) {
-                const enteredDate = $(this.nativeElement).find('input').val();
-                const newVal = i1$1.getNativeDateObject(enteredDate, { pattern: this.loadNativeDateInput ? this.outputformat : this.datepattern, meridians: this.meridians, isNativePicker: this.loadNativeDateInput });
-                if (!this.formatValidation(newVal, enteredDate)) {
-                    return;
-                }
-            }
-        }
-        // change and blur events are added from the template
-        handleEvent(node, eventName, callback, locals) {
-            if (!lodashEs.includes(['blur', 'focus', 'change', 'click'], eventName)) {
-                super.handleEvent(node, eventName, callback, locals);
-            }
-        }
-        onInputBlur($event) {
-            if (!$($event.relatedTarget).hasClass('current-date')) {
-                this.invokeOnTouched();
-                this.invokeEventCallback('blur', { $event });
-            }
-        }
-        static { this.ɵfac = function DatetimeComponent_Factory(t) { return new (t || DatetimeComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i0__namespace.NgZone), i0__namespace.ɵɵdirectiveInject(i0__namespace.ChangeDetectorRef), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.AppDefaults), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: DatetimeComponent, selectors: [["", "wmDateTime", ""]], viewQuery: function DatetimeComponent_Query(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵviewQuery(i3.BsDatepickerDirective, 5);
-            } if (rf & 2) {
-                let _t;
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.bsDatePickerDirective = _t.first);
-            } }, features: [i0__namespace.ɵɵProvidersFeature([
-                    base.provideAs(DatetimeComponent, i5.NG_VALUE_ACCESSOR, true),
-                    base.provideAs(DatetimeComponent, i5.NG_VALIDATORS, true),
-                    base.provideAsWidgetRef(DatetimeComponent),
-                    { provide: i6.TimepickerConfig, deps: [i1$1.AbstractI18nService], useFactory: getTimepickerConfig }
-                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c0$1, decls: 12, vars: 30, consts: [["datepicker", "bsDatepicker"], ["dropdown", "", "autoClose", "false", 2, "display", "inherit", 3, "onShown", "isOpen", "container"], ["focus-target", "", "type", "text", 1, "form-control", "app-textbox", "display-input", 3, "click", "focus", "blur", "change", "keydown", "name", "tabindex", "value", "autofocus", "disabled", "required", "readOnly"], [1, "input-group-btn"], ["type", "button", "aria-haspopup", "true", "aria-expanded", "false", 1, "btn", "btn-default", "btn-date", 3, "click", "tabindex", "disabled"], ["aria-hidden", "true", 1, "app-icon", "wm-sl-l", "sl-calendar"], ["type", "button", "aria-label", "Select time", "aria-haspopup", "true", "aria-expanded", "false", 1, "btn", "btn-default", "btn-time", 3, "click", "tabindex", "disabled"], ["aria-hidden", "true", 1, "app-icon", "wm-sl-l", "sl-time"], [2, "width", "0", "display", "inline-block"], ["aria-label", "datepicker dropdownmenu", "aria-controls", "date", "focus-target", "", "placement", "bottom right", "bsDatepicker", "", 1, "model-holder", 3, "onShown", "onHidden", "bsValueChange", "tabindex", "container", "bsConfig", "isOpen", "daysDisabled", "datesDisabled", "isDisabled", "bsValue"], ["class", "dropdown-menu", "aria-label", "timepicker dropdown", "aria-controls", "time", 3, "click", 4, "dropdownMenu"], [3, "ngIf"], ["aria-label", "timepicker dropdown", "aria-controls", "time", 1, "dropdown-menu", 3, "click"], [1, "model-holder", 3, "ngModelChange", "isValid", "showMeridian", "readonlyInput", "ngModel", "min", "max", "hourStep", "minuteStep", "secondsStep", "mousewheel", "arrowkeys", "showSeconds"], ["dateTimePicker", "", 3, "change", "config", "placement", "excludedDaysToDisable", "excludedDatesToDisable", "displayFormat", "value"], ["role", "button", 1, "mobile-input", "mobile-datepicker-container", 3, "click", "focus", "blur", "tabindex"]], template: function DatetimeComponent_Template(rf, ctx) { if (rf & 1) {
-                const _r1 = i0__namespace.ɵɵgetCurrentView();
-                i0__namespace.ɵɵelementStart(0, "div", 1);
-                i0__namespace.ɵɵlistener("onShown", function DatetimeComponent_Template_div_onShown_0_listener() { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onTimepickerOpen()); });
-                i0__namespace.ɵɵelementStart(1, "input", 2);
-                i0__namespace.ɵɵlistener("click", function DatetimeComponent_Template_input_click_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.toggleDpDropdown($event, true)); })("focus", function DatetimeComponent_Template_input_focus_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); ctx.onDateTimeInputFocus(); return i0__namespace.ɵɵresetView(ctx.invokeOnFocus($event)); })("blur", function DatetimeComponent_Template_input_blur_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onInputBlur($event)); })("change", function DatetimeComponent_Template_input_change_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onDateChange($event)); })("keydown", function DatetimeComponent_Template_input_keydown_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); ctx._triggeredByUser = true; return i0__namespace.ɵɵresetView(ctx.onDisplayKeydown($event)); });
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(2, "span", 3)(3, "button", 4);
-                i0__namespace.ɵɵlistener("click", function DatetimeComponent_Template_button_click_3_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.toggleDpDropdown($event, false)); });
-                i0__namespace.ɵɵelement(4, "i", 5);
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(5, "button", 6);
-                i0__namespace.ɵɵlistener("click", function DatetimeComponent_Template_button_click_5_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.toggleTimePicker(!ctx.isTimeOpen, $event)); });
-                i0__namespace.ɵɵelement(6, "i", 7);
-                i0__namespace.ɵɵelementEnd()();
-                i0__namespace.ɵɵelementStart(7, "div", 8)(8, "input", 9, 0);
-                i0__namespace.ɵɵlistener("onShown", function DatetimeComponent_Template_input_onShown_8_listener() { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onDatePickerOpen()); })("onHidden", function DatetimeComponent_Template_input_onHidden_8_listener() { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.hideDatepickerDropdown()); })("bsValueChange", function DatetimeComponent_Template_input_bsValueChange_8_listener($event) { i0__namespace.ɵɵrestoreView(_r1); return i0__namespace.ɵɵresetView(ctx.onModelUpdate($event, "date")); });
-                i0__namespace.ɵɵelementEnd()();
-                i0__namespace.ɵɵtemplate(10, DatetimeComponent_div_10_Template, 2, 11, "div", 10);
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵtemplate(11, DatetimeComponent_ng_template_11_Template, 2, 8, "ng-template", 11);
-            } if (rf & 2) {
-                i0__namespace.ɵɵproperty("isOpen", ctx.isTimeOpen)("container", "body");
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("name", ctx.name)("tabindex", ctx.loadNativeDateInput ? "-1" : ctx.tabindex)("value", ctx.displayValue)("autofocus", ctx.autofocus)("disabled", ctx.disabled || ctx.readonly || ctx.isCurrentDate)("required", ctx.required)("readOnly", ctx.isReadOnly);
-                i0__namespace.ɵɵattribute("aria-label", ctx.hint)("aria-hidden", !!ctx.loadNativeDateInput)("placeholder", ctx.placeholder)("accesskey", ctx.shortcutkey);
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("tabindex", ctx.loadNativeDateInput ? "-1" : ctx.tabindex)("disabled", ctx.disabled || ctx.readonly || ctx.isCurrentDate);
-                i0__namespace.ɵɵattribute("aria-hidden", !!ctx.loadNativeDateInput)("aria-label", ctx.displayValue ? "Change Date " + ctx.displayValue : "Choose date by pressing enter");
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("tabindex", ctx.loadNativeDateInput ? "-1" : ctx.tabindex)("disabled", ctx.disabled || ctx.readonly || ctx.isCurrentDate);
-                i0__namespace.ɵɵattribute("aria-hidden", !!ctx.loadNativeDateInput);
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("tabindex", -1)("container", ctx.containerTarget || ".wm-app")("bsConfig", ctx._dateOptions)("isOpen", ctx.isDateOpen)("daysDisabled", ctx.excludedDaysToDisable)("datesDisabled", ctx.excludedDatesToDisable)("isDisabled", ctx.disabled || ctx.readonly || ctx.isCurrentDate)("bsValue", ctx.bsDateValue);
-                i0__namespace.ɵɵattribute("aria-hidden", !!ctx.loadNativeDateInput);
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("ngIf", ctx.loadNativeDateInput);
-            } }, dependencies: [i2__namespace.NgIf, i3__namespace.BsDatepickerDirective, i3__namespace.BsDatepickerInputDirective, i4$1__namespace.BsDropdownMenuDirective, i4$1__namespace.BsDropdownDirective, i5__namespace.NgControlStatus, i5__namespace.NgModel, i6__namespace.TimepickerComponent, DateTimePickerComponent], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(DatetimeComponent, [{
-            type: i0.Component,
-            args: [{ selector: '[wmDateTime]', providers: [
-                        base.provideAs(DatetimeComponent, i5.NG_VALUE_ACCESSOR, true),
-                        base.provideAs(DatetimeComponent, i5.NG_VALIDATORS, true),
-                        base.provideAsWidgetRef(DatetimeComponent),
-                        { provide: i6.TimepickerConfig, deps: [i1$1.AbstractI18nService], useFactory: getTimepickerConfig }
-                    ], template: "    <div dropdown\n        [isOpen]=\"isTimeOpen\"\n        autoClose=\"false\"\n        [container]=\"'body'\"\n        (onShown)=\"onTimepickerOpen()\"\n        style=\"display: inherit;\">\n        <input class=\"form-control app-textbox display-input\"\n            [attr.aria-label]=\"hint\"\n            focus-target\n            [name]=\"name\"\n            [tabindex]=\"loadNativeDateInput ? '-1' : tabindex\"\n            [attr.aria-hidden]=\"!!loadNativeDateInput\"\n            type=\"text\"\n            [value]=\"displayValue\"\n            (click)=\"toggleDpDropdown($event, true)\"\n            (focus)=\"onDateTimeInputFocus(); invokeOnFocus($event);\"\n            (blur)=\"onInputBlur($event)\"\n            (change)=\"onDateChange($event)\"\n            [autofocus]=\"autofocus\"\n            [disabled]=\"disabled || readonly || isCurrentDate\"\n            [required]=\"required\"\n            [readOnly]=\"isReadOnly\"\n            [attr.placeholder]=\"placeholder\"\n            [attr.accesskey]=\"shortcutkey\"\n            (keydown)=\"this._triggeredByUser = true; onDisplayKeydown($event)\">\n\n        <span class=\"input-group-btn\">\n            <button type=\"button\"\n                class=\"btn btn-default btn-date\"\n                [tabindex]=\"loadNativeDateInput ? '-1' : tabindex\"\n                [attr.aria-hidden]=\"!!loadNativeDateInput\"\n                [disabled]=\"disabled || readonly || isCurrentDate\"\n                [attr.aria-label]=\"displayValue ? 'Change Date ' + displayValue : 'Choose date by pressing enter'\"\n                aria-haspopup=\"true\"\n                aria-expanded=\"false\"\n                (click)=\"toggleDpDropdown($event, false)\">\n                <i aria-hidden=\"true\"\n                    class=\"app-icon wm-sl-l sl-calendar\"></i>\n            </button>\n            <button type=\"button\"\n                class=\"btn btn-default btn-time\"\n                [tabindex]=\"loadNativeDateInput ? '-1' : tabindex\"\n                [attr.aria-hidden]=\"!!loadNativeDateInput\"\n                [disabled]=\"disabled || readonly || isCurrentDate\"\n                aria-label=\"Select time\"\n                aria-haspopup=\"true\"\n                aria-expanded=\"false\"\n                (click)=\"toggleTimePicker(!isTimeOpen, $event)\">\n                <i aria-hidden=\"true\"\n                    class=\"app-icon wm-sl-l sl-time\"></i>\n            </button>\n        </span>\n        <div style=\"width: 0;display: inline-block;\">\n        <input class=\"model-holder\"\n            aria-label=\"datepicker dropdownmenu\"\n            aria-controls=\"date\"\n            focus-target\n            [tabindex]=\"-1\"\n            [attr.aria-hidden]=\"!!loadNativeDateInput\"\n            [container]=\"containerTarget || '.wm-app'\"\n            [bsConfig]=\"_dateOptions\"\n            [isOpen]=\"isDateOpen\"\n             placement=\"bottom right\"\n            (onShown)=\"onDatePickerOpen()\"\n            (onHidden)=\"hideDatepickerDropdown()\"\n            [daysDisabled]=\"excludedDaysToDisable\"\n            [datesDisabled]=\"excludedDatesToDisable\"\n            #datepicker=bsDatepicker\n            bsDatepicker\n            [isDisabled]=\"disabled || readonly || isCurrentDate\"\n            [bsValue]=\"bsDateValue\"\n            (bsValueChange)=\"onModelUpdate($event, 'date')\">\n    </div>\n        <div *dropdownMenu\n            class=\"dropdown-menu\"\n            aria-label=\"timepicker dropdown\"\n            aria-controls=\"time\"\n            (click)=\"preventTpClose($event)\">\n            <timepicker class=\"model-holder\"\n                [showMeridian]=\"ismeridian\"\n                [readonlyInput]=\"disabled || readonly || isCurrentDate\"\n                [(ngModel)]=\"bsTimeValue\"\n                [min]=\"minTime\"\n                [max]=\"maxTime\"\n                [hourStep]=\"hourstep\"\n                [minuteStep]=\"minutestep\"\n                [secondsStep]=\"secondsstep\"\n                [mousewheel]=\"true\"\n                [arrowkeys]=\"true\"\n                (isValid)=\"isValid($event)\"\n                [showSeconds]=\"showseconds\"\n                (ngModelChange)=\"onModelUpdate($event, 'time')\"></timepicker>\n        </div>\n    </div>\n<ng-template [ngIf]=\"loadNativeDateInput\">\n    <wm-datetimepicker\n        dateTimePicker\n        [config]=\"_dateOptions\"\n        [placement]=\"modal\"\n        [excludedDaysToDisable]=\"excludedDaysToDisable\"\n        [excludedDatesToDisable]=\"excludedDatesToDisable\"\n        [displayFormat]=\"dateInputFormat\"\n        [value]=\"bsDateValue\"\n        (change)=\"onModelUpdate($event, 'date')\">\n    </wm-datetimepicker>\n    <div class=\"mobile-input mobile-datepicker-container\"\n        [tabindex]=\"tabindex || 0\"\n         (click)=\"!(disabled || readonly) && showDatePickerModal(bsDateValue)\"\n         [attr.aria-label]=\"displayValue ? 'Change Date ' + displayValue : hint || 'Choose Date'\"\n        (focus)=\"onDateTimeInputFocus(true); invokeOnFocus($event)\"\n        (blur)=\"onDateTimeInputBlur(); invokeOnTouched($event)\"\n         role=\"button\">\n    </div>\n</ng-template>\n" }]
-        }], () => [{ type: i0__namespace.Injector }, { type: i0__namespace.NgZone }, { type: i0__namespace.ChangeDetectorRef }, { type: i1$1__namespace.AppDefaults }, { type: i1$1__namespace.App }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], { bsDatePickerDirective: [{
-                type: i0.ViewChild,
-                args: [i3.BsDatepickerDirective]
-            }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(DatetimeComponent, { className: "DatetimeComponent", filePath: "date-time/date-time.component.ts", lineNumber: 56 }); })();
-
-    const timeProps = new Map([
-        ['autofocus', base.PROP_BOOLEAN],
-        ['class', base.PROP_STRING],
-        ['dataentrymode', { value: 'default', ...base.PROP_STRING }],
-        ['datavaluesource', base.PROP_ANY],
-        ['datavalue', base.PROP_STRING],
-        ['disabled', base.PROP_BOOLEAN],
-        ['hint', base.PROP_STRING],
-        ['hourstep', { value: 1, ...base.PROP_NUMBER }],
-        ['maxtime', base.PROP_STRING],
-        ['mintime', base.PROP_STRING],
-        ['minutestep', { value: 15, ...base.PROP_NUMBER }],
-        ['name', base.PROP_STRING],
-        ['outputformat', { value: 'HH:mm:ss', ...base.PROP_STRING }],
-        ['placeholder', { value: 'Select time', ...base.PROP_STRING }],
-        ['readonly', base.PROP_BOOLEAN],
-        ['required', base.PROP_BOOLEAN],
-        ['shortcutkey', base.PROP_STRING],
-        ['show', { value: true, ...base.PROP_BOOLEAN }],
-        ['showdropdownon', { value: 'default', ...base.PROP_STRING }],
-        ['showcustompicker', { value: false, ...base.PROP_BOOLEAN }],
-        ['secondsstep', { value: 1, ...base.PROP_NUMBER }],
-        ['tabindex', { value: 0, ...base.PROP_NUMBER }],
-        ['timepattern', base.PROP_STRING],
-        ['timestamp', base.PROP_STRING]
-    ]);
-    const registerProps = () => {
-        base.register('wm-time', timeProps);
-        base.registerFormWidget(i1$1.FormWidgetType.TIME, new Map(timeProps));
-    };
-
-    const _c0 = ["wmTime", ""];
-    function TimeComponent_div_5_Template(rf, ctx) { if (rf & 1) {
-        const _r1 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "div", 7);
-        i0__namespace.ɵɵlistener("click", function TimeComponent_div_5_Template_div_click_0_listener($event) { i0__namespace.ɵɵrestoreView(_r1); const ctx_r1 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r1.preventTpClose($event)); });
-        i0__namespace.ɵɵelementStart(1, "timepicker", 8);
-        i0__namespace.ɵɵtwoWayListener("ngModelChange", function TimeComponent_div_5_Template_timepicker_ngModelChange_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); const ctx_r1 = i0__namespace.ɵɵnextContext(); i0__namespace.ɵɵtwoWayBindingSet(ctx_r1.bsTimeValue, $event) || (ctx_r1.bsTimeValue = $event); return i0__namespace.ɵɵresetView($event); });
-        i0__namespace.ɵɵlistener("isValid", function TimeComponent_div_5_Template_timepicker_isValid_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); const ctx_r1 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r1.isValid($event)); })("ngModelChange", function TimeComponent_div_5_Template_timepicker_ngModelChange_1_listener($event) { i0__namespace.ɵɵrestoreView(_r1); const ctx_r1 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r1.onTimeChange($event)); });
-        i0__namespace.ɵɵelementEnd()();
-    } if (rf & 2) {
-        const ctx_r1 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("showMeridian", ctx_r1.ismeridian)("readonlyInput", ctx_r1.isDisabled);
-        i0__namespace.ɵɵtwoWayProperty("ngModel", ctx_r1.bsTimeValue);
-        i0__namespace.ɵɵproperty("disabled", ctx_r1.disabled || ctx_r1.readonly || ctx_r1.isCurrentTime)("min", ctx_r1.minTime)("max", ctx_r1.maxTime)("hourStep", ctx_r1.hourstep)("minuteStep", ctx_r1.minutestep)("secondsStep", ctx_r1.secondsstep)("mousewheel", true)("arrowkeys", true)("showSeconds", ctx_r1.showseconds);
-    } }
-    function TimeComponent_ng_template_6_Template(rf, ctx) { if (rf & 1) {
-        const _r3 = i0__namespace.ɵɵgetCurrentView();
-        i0__namespace.ɵɵelementStart(0, "wm-datetimepicker", 9);
-        i0__namespace.ɵɵlistener("change", function TimeComponent_ng_template_6_Template_wm_datetimepicker_change_0_listener($event) { i0__namespace.ɵɵrestoreView(_r3); const ctx_r1 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r1.onTimeChange($event)); });
-        i0__namespace.ɵɵelementEnd();
-        i0__namespace.ɵɵelementStart(1, "div", 10);
-        i0__namespace.ɵɵlistener("click", function TimeComponent_ng_template_6_Template_div_click_1_listener() { i0__namespace.ɵɵrestoreView(_r3); const ctx_r1 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(!(ctx_r1.disabled || ctx_r1.readonly) && ctx_r1.showDatePickerModal(ctx_r1.bsTimeValue)); })("focus", function TimeComponent_ng_template_6_Template_div_focus_1_listener($event) { i0__namespace.ɵɵrestoreView(_r3); const ctx_r1 = i0__namespace.ɵɵnextContext(); ctx_r1.onDateTimeInputFocus(true); ctx_r1.invokeOnFocus($event); return i0__namespace.ɵɵresetView(ctx_r1.assignModel()); })("blur", function TimeComponent_ng_template_6_Template_div_blur_1_listener($event) { i0__namespace.ɵɵrestoreView(_r3); const ctx_r1 = i0__namespace.ɵɵnextContext(); ctx_r1.onDateTimeInputBlur(); return i0__namespace.ɵɵresetView(ctx_r1.invokeOnTouched($event)); });
-        i0__namespace.ɵɵelementEnd();
-    } if (rf & 2) {
-        const ctx_r1 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵproperty("minTime", ctx_r1.minTime)("maxTime", ctx_r1.maxTime)("placement", ctx_r1.modal)("displayFormat", ctx_r1.timepattern)("value", ctx_r1.bsTimeValue);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵattribute("aria-label", ctx_r1.displayValue ? "Change time  " + ctx_r1.displayValue : ctx_r1.hint || "Select time");
-    } }
-    const CURRENT_TIME = 'CURRENT_TIME';
-    const DEFAULT_CLS = 'input-group app-timeinput';
-    const WIDGET_CONFIG = { widgetType: 'wm-time', hostClass: DEFAULT_CLS };
-    class TimeComponent extends BaseDateTimeComponent {
-        static { this.initializeProps = registerProps(); }
-        get timestamp() {
-            return this.bsTimeValue ? this.bsTimeValue.valueOf() : undefined;
-        }
-        // @ts-ignore
-        get datavalue() {
-            if (this.isCurrentTime && !this.bsTimeValue) {
-                return CURRENT_TIME;
-            }
-            return i1$1.getFormattedDate(this.datePipe, this.bsTimeValue, this.outputformat, this.timeZone, null, null, this) || '';
-        }
-        /**Todo[Shubham]: needs to be redefined
-         * This property sets the default value for the time selection
-         */
-        // @ts-ignore
-        set datavalue(newVal) {
-            if (newVal) {
-                if (newVal === CURRENT_TIME) {
-                    this.isCurrentTime = true;
-                    this.setTimeInterval();
-                }
-                else {
-                    this.clearTimeInterval();
-                    this.bsTimeValue = i1$1.getNativeDateObject(newVal, { pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput });
-                    this.isCurrentTime = false;
-                    this.mintimeMaxtimeValidation();
-                }
-            }
-            else {
-                this.bsTimeValue = undefined;
-                this.clearTimeInterval();
-                this.isCurrentTime = false;
-            }
-            this.invokeOnChange(this.datavalue);
-            i1$1.$appDigest();
-        }
-        get displayValue() {
-            return i1$1.getFormattedDate(this.datePipe, this.bsTimeValue, this.timepattern, this.timeZone, null, null, this) || '';
-        }
-        get nativeDisplayValue() {
-            return i1$1.getFormattedDate(this.datePipe, this.bsTimeValue, 'HH:mm:ss', this.timeZone, null, null, this) || '';
-        }
-        constructor(inj, ngZone, appDefaults, app, explicitContext) {
-            super(inj, WIDGET_CONFIG, explicitContext);
-            this.ngZone = ngZone;
-            this.appDefaults = appDefaults;
-            /**
-             * This is an internal property used to toggle the timepicker dropdown
-             */
-            this.status = { isopen: false };
-            base.styler(this.nativeElement, this);
-            /**
-             * Destroy the timer once the date widget is gone
-             */
-            this.registerDestroyListener(() => this.clearTimeInterval());
-            this.timepattern = this.appDefaults.timeFormat || i1$1.getDisplayDateTimeFormat(i1$1.FormWidgetType.TIME);
-            this.updateFormat('timepattern');
-            this.app = app;
-        }
-        onPropertyChange(key, nv, ov) {
-            if (key === 'tabindex') {
-                return;
-            }
-            if (key === 'timepattern') {
-                this.updateFormat('timepattern');
-            }
-            if (key === 'mintime') {
-                this.minTime = i1$1.getNativeDateObject(nv, { pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput }); // TODO it is supposed to be time conversion, not to the day
-                this.mintimeMaxtimeValidation();
-            }
-            else if (key === 'maxtime') {
-                this.maxTime = i1$1.getNativeDateObject(nv, { pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput });
-                this.mintimeMaxtimeValidation();
-            }
-            else {
-                super.onPropertyChange(key, nv, ov);
-            }
-        }
-        setValidateType(min, max, val) {
-            if (this.timeNotInRange) {
-                if (val < min) {
-                    this.validateType = 'mintime';
-                }
-                else if (val > max) {
-                    this.validateType = 'maxtime';
-                }
-            }
-        }
-        /**
-         * This is an internal method used to validate mintime and maxtime
-         */
-        mintimeMaxtimeValidation() {
-            this.timeNotInRange = this.minTime && this.maxTime && (this.bsTimeValue < this.minTime || this.bsTimeValue > this.maxTime);
-            this.setValidateType(this.minTime, this.maxTime, this.bsTimeValue);
-            this.invokeOnChange(this.datavalue, undefined, false);
-        }
-        /**
-         * This is an internal method used to toggle the dropdown of the time widget
-         */
-        toggleDropdown($event, skipFocus = false) {
-            if (this.loadNativeDateInput) {
-                //Fixes click event getting triggred twice in Mobile devices.
-                if (!skipFocus) {
-                    this.onDateTimeInputFocus();
-                }
-                return;
-            }
-            if ($event.type === 'click') {
-                this.invokeEventCallback('click', { $event: $event });
-                //this.focusOnInputEl();
-            }
-            if ($event.target && $($event.target).is('input') && !(this.isDropDownDisplayEnabledOnInput(this.showdropdownon))) {
-                return;
-            }
-            this.ngZone.run(() => {
-                this.status.isopen = !this.status.isopen;
-            });
-            this.addBodyClickListener(this.status.isopen);
-        }
-        /**
-         * This is an internal method used to Prevent time picker close while changing time value
-         */
-        preventTpClose($event) {
-            $event.stopImmediatePropagation();
-            const parentEl = $(this.nativeElement).closest('.app-composite-widget.caption-floating');
-            if (parentEl.length > 0) {
-                this.app.notify('captionPositionAnimate', { displayVal: this.displayValue, nativeEl: parentEl });
-            }
-        }
-        addBodyClickListener(skipListener) {
-            if (!skipListener) {
-                return;
-            }
-            const bodyElement = document.querySelector('body');
-            setTimeout(() => {
-                const dropdownElement = $(bodyElement).find('>bs-dropdown-container .dropdown-menu').get(0);
-                this.deregisterEventListener = i1$1.addEventListenerOnElement(bodyElement, dropdownElement, this.nativeElement, 'click', this.isDropDownDisplayEnabledOnInput(this.showdropdownon), () => {
-                    this.status.isopen = false;
-                }, 0 /* EVENT_LIFE.ONCE */, true);
-            }, 350);
-        }
-        /**
-         * This is an internal method triggered when pressing key on the time input
-         */
-        onDisplayKeydown(event) {
-            if (this.isDropDownDisplayEnabledOnInput(this.showdropdownon)) {
-                event.stopPropagation();
-                if (event.key === 'Enter' || event.key === 'ArrowDown') {
-                    event.preventDefault();
-                    this.toggleDropdown(event);
-                }
-                else {
-                    this.hideTimepickerDropdown();
-                }
-            }
-            else {
-                this.hideTimepickerDropdown();
-            }
-        }
-        /**
-         * This is an internal method triggered when the time input changes
-         */
-        onDisplayTimeChange($event) {
-            const newVal = i1$1.getNativeDateObject($event.target.value, { meridians: this.meridians, pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput });
-            // time pattern validation
-            // if invalid pattern is entered, device is showing an error.
-            if (!this.formatValidation(newVal, $event.target.value)) {
-                return;
-            }
-            this.invalidDateTimeFormat = false;
-            this.onTimeChange(newVal);
-        }
-        onInputBlur($event) {
-            if (!$($event.relatedTarget).hasClass('bs-timepicker-field')) {
-                this.invokeOnTouched();
-                this.invokeEventCallback('blur', { $event });
-            }
-        }
-        /**
-         * This is an internal method used to execute the on time change functionality
-         */
-        onTimeChange(newVal, isNativePicker) {
-            let timeValue, timeInputValue, minTimeMeridian;
-            // For nativePicker, newVal is event, get the dateobject from the event.
-            if (isNativePicker) {
-                newVal = i1$1.getNativeDateObject(newVal.target.value, { pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput });
-            }
-            if (newVal) {
-                this.bsTimeValue = newVal;
-                // if the newVal is valid but not in the given range then highlight the input field
-                this.timeNotInRange = this.minTime && this.maxTime && (newVal < this.minTime || newVal > this.maxTime);
-                this.setValidateType(this.minTime, this.maxTime, newVal);
-            }
-            else {
-                // sometimes library is not returning the correct value when the min and max time are given, displaying the datavalue based on the value given by the user
-                if (this.bsTimePicker && this.bsTimePicker.min && this.bsTimePicker.max) {
-                    minTimeMeridian = moment(new Date(this.bsTimePicker.min)).format('A');
-                    moment(new Date(this.bsTimePicker.max)).format('A');
-                    timeValue = this.bsTimePicker.hours + ':' + (this.bsTimePicker.minutes || 0) + ':' + (this.bsTimePicker.seconds || 0) + (this.bsTimePicker.showMeridian ? (' ' + minTimeMeridian) : '');
-                    timeInputValue = i1$1.getNativeDateObject(timeValue, { pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput });
-                    this.bsTimePicker.meridian = minTimeMeridian;
-                    this.timeNotInRange = (this.bsTimePicker.min > timeInputValue || this.bsTimePicker.max < timeInputValue);
-                    this.setValidateType(this.bsTimePicker.min, this.bsTimePicker.max, timeInputValue);
-                }
-                this.bsTimeValue = timeInputValue;
-            }
-            this.invokeOnTouched();
-            this.invokeOnChange(this.datavalue, {}, true);
-        }
-        /**
-         * This is an internal method used to maintain a time interval to update the time model when the data value is set to CURRENT_TIME
-         */
-        setTimeInterval() {
-            if (this.timeinterval) {
-                return;
-            }
-            this.timeinterval = setInterval(() => {
-                const now = this.timeZone ? i1$1.getMomentLocaleObject(this.timeZone) : new Date();
-                now.setSeconds(now.getSeconds() + 1);
-                this.datavalue = CURRENT_TIME;
-                this.onTimeChange(now);
-            }, 1000);
-        }
-        /**
-         * This is an internal method used to clear the time interval created
-         */
-        clearTimeInterval() {
-            if (this.timeinterval) {
-                clearInterval(this.timeinterval);
-                this.timeinterval = null;
-            }
-        }
-        /**
-         * This function sets the value isOpen/isTimeOpen (i.e when datepicker popup is closed) based on widget type(i.e  DateTime, Time)
-         * @param val - isOpen/isTimeOpen is set based on the timepicker popup is open/closed
-         */
-        setIsTimeOpen(val) {
-            this.status.isopen = val;
-        }
-        // Change event is registered from the template, Prevent the framework from registering one more event
-        handleEvent(node, eventName, eventCallback, locals) {
-            if (!lodashEs.includes(['blur', 'focus', 'change', 'click'], eventName)) {
-                super.handleEvent(node, eventName, eventCallback, locals);
-            }
-        }
-        hideTimepickerDropdown() {
-            this.invokeOnTouched();
-            this.status.isopen = false;
-            if (this.deregisterEventListener) {
-                this.deregisterEventListener();
-            }
-            this.removeKeyupListener();
-            const parentEl = $(this.nativeElement).closest('.app-composite-widget.caption-floating');
-            if (parentEl.length > 0) {
-                this.app.notify('captionPositionAnimate', { displayVal: this.displayValue, nativeEl: parentEl });
-            }
-            this.blurDateInput(true);
-        }
-        isValid(event) {
-            if (!event) {
-                const enteredDate = $(this.nativeElement).find('input').val();
-                const newVal = i1$1.getNativeDateObject(enteredDate, { meridians: this.meridians, pattern: this.loadNativeDateInput ? this.outputformat : undefined, isNativePicker: this.loadNativeDateInput });
-                if (!this.formatValidation(newVal, enteredDate)) {
-                    return;
-                }
-            }
-        }
-        /**
-         * This is an internal method to add css class for dropdown while opening the time dropdown
-         */
-        onShown() {
-            const tpElements = document.querySelectorAll('timepicker');
-            lodashEs.forEach(tpElements, element => {
-                i1$1.addClass(element.parentElement, 'app-datetime', true);
-            });
-            this.focusTimePickerPopover(this);
-            this.bindTimePickerKeyboardEvents();
-            i1$1.adjustContainerPosition($('bs-dropdown-container'), this.nativeElement, this.bsDropdown._dropdown, $('bs-dropdown-container .dropdown-menu'));
-        }
-        assignModel() {
-            if (!this.displayInputElem) {
-                this.displayInputElem = this.getMobileInput();
-            }
-            this.displayInputElem.value = lodashEs.get(this, 'nativeDisplayValue');
-        }
-        static { this.ɵfac = function TimeComponent_Factory(t) { return new (t || TimeComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i0__namespace.NgZone), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.AppDefaults), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: TimeComponent, selectors: [["", "wmTime", ""]], features: [i0__namespace.ɵɵProvidersFeature([
-                    base.provideAs(TimeComponent, i5.NG_VALUE_ACCESSOR, true),
-                    base.provideAs(TimeComponent, i5.NG_VALIDATORS, true),
-                    base.provideAsWidgetRef(TimeComponent),
-                    { provide: i6.TimepickerConfig, deps: [i1$1.AbstractI18nService], useFactory: getTimepickerConfig }
-                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c0, decls: 7, vars: 16, consts: [["dropdown", "", 2, "display", "inherit", 3, "onShown", "onHidden", "isOpen", "container"], ["focus-target", "", "type", "text", "role", "timer", 1, "form-control", "app-textbox", "display-input", 3, "click", "focus", "blur", "change", "keydown", "tabindex", "name", "value", "disabled", "autofocus", "required", "readOnly"], [1, "input-group-btn", "dropdown-toggle"], ["type", "button", "aria-label", "Select time", "aria-haspopup", "true", "aria-expanded", "false", 1, "btn", "btn-default", "btn-date", 3, "click", "tabindex", "disabled"], ["aria-hidden", "true", 1, "app-icon", "wm-sl-l", "sl-time"], ["class", "dropdown-menu", 3, "click", 4, "dropdownMenu"], [3, "ngIf"], [1, "dropdown-menu", 3, "click"], [1, "model-holder", 3, "ngModelChange", "isValid", "showMeridian", "readonlyInput", "ngModel", "disabled", "min", "max", "hourStep", "minuteStep", "secondsStep", "mousewheel", "arrowkeys", "showSeconds"], ["dateTimePicker", "", "mode", "TIME", 3, "change", "minTime", "maxTime", "placement", "displayFormat", "value"], ["tabindex", "1000000", "role", "button", 1, "mobile-input", "mobile-datepicker-container", 3, "click", "focus", "blur"]], template: function TimeComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵelementStart(0, "div", 0);
-                i0__namespace.ɵɵlistener("onShown", function TimeComponent_Template_div_onShown_0_listener() { return ctx.onShown(); })("onHidden", function TimeComponent_Template_div_onHidden_0_listener() { return ctx.hideTimepickerDropdown(); });
-                i0__namespace.ɵɵelementStart(1, "input", 1);
-                i0__namespace.ɵɵlistener("click", function TimeComponent_Template_input_click_1_listener($event) { return ctx.toggleDropdown($event, true); })("focus", function TimeComponent_Template_input_focus_1_listener($event) { ctx.onDateTimeInputFocus(); return ctx.invokeOnFocus($event); })("blur", function TimeComponent_Template_input_blur_1_listener($event) { return ctx.onInputBlur($event); })("change", function TimeComponent_Template_input_change_1_listener($event) { return ctx.onDisplayTimeChange($event); })("keydown", function TimeComponent_Template_input_keydown_1_listener($event) { ctx._triggeredByUser = true; return ctx.onDisplayKeydown($event); });
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(2, "span", 2)(3, "button", 3);
-                i0__namespace.ɵɵlistener("click", function TimeComponent_Template_button_click_3_listener($event) { return ctx.toggleDropdown($event, false); });
-                i0__namespace.ɵɵelement(4, "i", 4);
-                i0__namespace.ɵɵelementEnd()();
-                i0__namespace.ɵɵtemplate(5, TimeComponent_div_5_Template, 2, 12, "div", 5);
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵtemplate(6, TimeComponent_ng_template_6_Template, 2, 6, "ng-template", 6);
-            } if (rf & 2) {
-                i0__namespace.ɵɵproperty("isOpen", ctx.status.isopen)("container", "body");
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("tabindex", ctx.tabindex)("name", ctx.name)("value", ctx.displayValue)("disabled", ctx.disabled || ctx.readonly || ctx.isCurrentTime)("autofocus", ctx.autofocus)("required", ctx.required)("readOnly", ctx.isReadOnly);
-                i0__namespace.ɵɵattribute("aria-label", ctx.hint)("placeholder", ctx.placeholder)("accesskey", ctx.shortcutkey)("aria-atomic", ctx.isCurrentTime ? "true" : "false");
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("tabindex", ctx.tabindex)("disabled", ctx.disabled || ctx.readonly || ctx.isCurrentTime);
-                i0__namespace.ɵɵadvance(3);
-                i0__namespace.ɵɵproperty("ngIf", ctx.loadNativeDateInput);
-            } }, dependencies: [i2__namespace.NgIf, i4$1__namespace.BsDropdownMenuDirective, i4$1__namespace.BsDropdownDirective, i5__namespace.NgControlStatus, i5__namespace.NgModel, i6__namespace.TimepickerComponent, DateTimePickerComponent], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TimeComponent, [{
-            type: i0.Component,
-            args: [{ selector: '[wmTime]', providers: [
-                        base.provideAs(TimeComponent, i5.NG_VALUE_ACCESSOR, true),
-                        base.provideAs(TimeComponent, i5.NG_VALIDATORS, true),
-                        base.provideAsWidgetRef(TimeComponent),
-                        { provide: i6.TimepickerConfig, deps: [i1$1.AbstractI18nService], useFactory: getTimepickerConfig }
-                    ], template: "    <div dropdown [isOpen]=\"status.isopen\" (onShown)=\"onShown()\" (onHidden)=\"hideTimepickerDropdown()\" [container]=\"'body'\" style=\"display: inherit\">\n        <input class=\"form-control app-textbox display-input\" [attr.aria-label]=\"hint\"\n               focus-target\n               [tabindex]=\"tabindex\"\n               [name]=\"name\"\n               type=\"text\"\n               role=\"timer\"\n               [value]=\"displayValue\"\n               [disabled]=\"disabled || readonly || isCurrentTime\"\n               [autofocus]=\"autofocus\"\n               [attr.placeholder]=\"placeholder\"\n               [attr.accesskey]=\"shortcutkey\"\n               [attr.aria-atomic]=\"isCurrentTime ? 'true' : 'false'\"\n               [required]=\"required\"\n               [readOnly]=\"isReadOnly\"\n               (click)=\"toggleDropdown($event, true)\"\n               (focus)=\"onDateTimeInputFocus(); invokeOnFocus($event);\"\n               (blur)=\"onInputBlur($event)\"\n               (change)=\"onDisplayTimeChange($event)\"\n               (keydown)=\"this._triggeredByUser = true; onDisplayKeydown($event)\">\n        <span class=\"input-group-btn dropdown-toggle\">\n            <button type=\"button\" class=\"btn btn-default btn-date\" [tabindex]=\"tabindex\" [disabled]=\"disabled || readonly || isCurrentTime\" aria-label=\"Select time\" aria-haspopup=\"true\" aria-expanded=\"false\" (click)=\"toggleDropdown($event, false)\"><i aria-hidden=\"true\" class=\"app-icon wm-sl-l sl-time\"></i></button>\n        </span>\n        <div *dropdownMenu class=\"dropdown-menu\" (click)=\"preventTpClose($event)\">\n            <timepicker class=\"model-holder\"\n                        [showMeridian]=\"ismeridian\"\n                        [readonlyInput]=\"isDisabled\"\n                        [(ngModel)]=\"bsTimeValue\"\n                        [disabled]=\"disabled || readonly || isCurrentTime\"\n                        [min]=\"minTime\"\n                        [max]=\"maxTime\"\n                        [hourStep]=\"hourstep\"\n                        [minuteStep]=\"minutestep\"\n                        [secondsStep]=\"secondsstep\"\n                        [mousewheel]=\"true\"\n                        [arrowkeys]=\"true\"\n                        (isValid)=\"isValid($event)\"\n                        [showSeconds]=\"showseconds\" (ngModelChange)=\"onTimeChange($event)\"></timepicker>\n        </div>\n    </div>\n<ng-template [ngIf]=\"loadNativeDateInput\">\n    <wm-datetimepicker\n        dateTimePicker\n        mode=\"TIME\"\n        [minTime]=\"minTime\"\n        [maxTime]=\"maxTime\"\n        [placement]=\"modal\"\n        [displayFormat]=\"timepattern\"\n        [value]=\"bsTimeValue\"\n        (change)=\"onTimeChange($event)\">\n    </wm-datetimepicker>\n    <div class=\"mobile-input mobile-datepicker-container\"\n        tabindex=\"1000000\"\n         (click)=\"!(disabled || readonly) && showDatePickerModal(bsTimeValue)\"\n         [attr.aria-label]=\"displayValue ? 'Change time  ' + displayValue : hint || 'Select time'\"\n        (focus)=\"onDateTimeInputFocus(true); invokeOnFocus($event); assignModel()\"\n        (blur)=\"onDateTimeInputBlur(); invokeOnTouched($event)\"\n         role=\"button\">\n    </div>\n</ng-template>\n" }]
-        }], () => [{ type: i0__namespace.Injector }, { type: i0__namespace.NgZone }, { type: i1$1__namespace.AppDefaults }, { type: i1$1__namespace.App }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], null); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(TimeComponent, { className: "TimeComponent", filePath: "time/time.component.ts", lineNumber: 42 }); })();
-
-    const components = [
-        DateComponent,
-        DatetimeComponent,
-        TimeComponent,
-        DateTimePickerComponent,
-        TimePickerComponent,
-        PickerComponent,
-        PickerGroupComponent
-    ];
-    class EpochModule {
-        static { this.ɵfac = function EpochModule_Factory(t) { return new (t || EpochModule)(); }; }
-        static { this.ɵmod = /*@__PURE__*/ i0__namespace.ɵɵdefineNgModule({ type: EpochModule }); }
-        static { this.ɵinj = /*@__PURE__*/ i0__namespace.ɵɵdefineInjector({ imports: [i2.CommonModule,
-                i3.BsDatepickerModule,
-                i4$1.BsDropdownModule,
-                i5.FormsModule,
-                i6.TimepickerModule,
-                base.WmComponentsModule,
-                i4.IMaskModule] }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(EpochModule, [{
-            type: i0.NgModule,
-            args: [{
-                    imports: [
-                        i2.CommonModule,
-                        i3.BsDatepickerModule,
-                        i4$1.BsDropdownModule,
-                        i5.FormsModule,
-                        i6.TimepickerModule,
-                        base.WmComponentsModule,
-                        i4.IMaskModule
-                    ],
-                    declarations: [...components],
-                    exports: [...components]
-                }]
-        }], null, null); })();
-    (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0__namespace.ɵɵsetNgModuleScope(EpochModule, { declarations: [DateComponent,
-            DatetimeComponent,
-            TimeComponent,
-            DateTimePickerComponent,
-            TimePickerComponent,
-            PickerComponent,
-            PickerGroupComponent], imports: [i2.CommonModule,
-            i3.BsDatepickerModule,
-            i4$1.BsDropdownModule,
-            i5.FormsModule,
-            i6.TimepickerModule,
-            base.WmComponentsModule,
-            i4.IMaskModule], exports: [DateComponent,
-            DatetimeComponent,
-            TimeComponent,
-            DateTimePickerComponent,
-            TimePickerComponent,
-            PickerComponent,
-            PickerGroupComponent] }); })();
-
-    exports.DateComponent = DateComponent;
-    exports.DateTimePickerComponent = DateTimePickerComponent;
-    exports.DatetimeComponent = DatetimeComponent;
-    exports.EpochModule = EpochModule;
-    exports.PickerComponent = PickerComponent;
-    exports.PickerGroupComponent = PickerGroupComponent;
-    exports.TimeComponent = TimeComponent;
-    exports.TimePickerComponent = TimePickerComponent;
-
-}));