nxt-pick-datetime 14.0.0 → 15.0.0

package/fesm2020/nxt-pick-datetime.mjs

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, LOCALE_ID, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostBinding, Optional, Inject, ViewChild, Injectable, Directive, Pipe, HostListener, forwardRef, TemplateRef, Injector, SkipSelf, NgModule } from '@angular/core';
-import { Subject, Subscription, of, merge, defer } from 'rxjs';
+import { InjectionToken, inject, LOCALE_ID, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostBinding, Inject, ViewChild, Injectable, Directive, Pipe, HostListener, forwardRef, Optional, TemplateRef, Injector, SkipSelf, NgModule } from '@angular/core';
+import { Subject, of, merge, defer } from 'rxjs';
 import { coerceNumberProperty, coerceBooleanProperty, coerceArray } from '@angular/cdk/coercion';
 import { ENTER, PAGE_DOWN, PAGE_UP, END, HOME, DOWN_ARROW, UP_ARROW, RIGHT_ARROW, LEFT_ARROW, SPACE, ESCAPE } from '@angular/cdk/keycodes';
 import { take, debounceTime, distinctUntilChanged, filter, concatAll } from 'rxjs/operators';
 import * as i3 from '@angular/common';
-import { DOCUMENT, CommonModule } from '@angular/common';
+import { DOCUMENT, Location, CommonModule } from '@angular/common';
 import * as i4 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS, Validators } from '@angular/forms';
@@ -16,17 +16,17 @@ import * as i2 from '@angular/cdk/portal';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, PortalModule } from '@angular/cdk/portal';
 
 /** InjectionToken for date time picker that can be used to override default locale code. */
-const OWL_DATE_TIME_LOCALE = new InjectionToken('OWL_DATE_TIME_LOCALE', {
+const NXT_DATE_TIME_LOCALE = new InjectionToken('NXT_DATE_TIME_LOCALE', {
     providedIn: 'root',
-    factory: OWL_DATE_TIME_LOCALE_FACTORY
+    factory: NXT_DATE_TIME_LOCALE_FACTORY
 });
 /** @docs-private */
-function OWL_DATE_TIME_LOCALE_FACTORY() {
+function NXT_DATE_TIME_LOCALE_FACTORY() {
     return inject(LOCALE_ID);
 }
-/** Provider for OWL_DATE_TIME_LOCALE injection token. */
-const OWL_DATE_TIME_LOCALE_PROVIDER = {
-    provide: OWL_DATE_TIME_LOCALE,
+/** Provider for NXT_DATE_TIME_LOCALE injection token. */
+const NXT_DATE_TIME_LOCALE_PROVIDER = {
+    provide: NXT_DATE_TIME_LOCALE,
     useExisting: LOCALE_ID
 };
 class DateTimeAdapter {
@@ -98,7 +98,7 @@ class DateTimeAdapter {
      * to also deserialize the format used by your backend.
      */
     deserialize(value) {
-        if (value == null ||
+        if (value == null || value == undefined ||
             (this.isDateInstance(value) && this.isValid(value))) {
             return value;
         }
@@ -126,7 +126,7 @@ class DateTimeAdapter {
 }
 
 /** InjectionToken for date time picker that can be used to override default format. */
-const OWL_DATE_TIME_FORMATS = new InjectionToken('OWL_DATE_TIME_FORMATS');
+const NXT_DATE_TIME_FORMATS = new InjectionToken('NXT_DATE_TIME_FORMATS');
 
 class CalendarCell {
     constructor(value, displayValue, ariaLabel, enabled, out = false, cellClass = '') {
@@ -138,7 +138,18 @@ class CalendarCell {
         this.cellClass = cellClass;
     }
 }
-class OwlCalendarBodyComponent {
+class CalendarBodyComponent {
+    get calendarBodyClass() {
+        return true;
+    }
+    get isInSingleMode() {
+        return this.selectMode === 'single';
+    }
+    get isInRangeMode() {
+        return (this.selectMode === 'range' ||
+            this.selectMode === 'rangeFrom' ||
+            this.selectMode === 'rangeTo');
+    }
     constructor(elmRef, ngZone) {
         this.elmRef = elmRef;
         this.ngZone = ngZone;
@@ -159,17 +170,6 @@ class OwlCalendarBodyComponent {
          * */
         this.select = new EventEmitter();
     }
-    get owlDTCalendarBodyClass() {
-        return true;
-    }
-    get isInSingleMode() {
-        return this.selectMode === 'single';
-    }
-    get isInRangeMode() {
-        return (this.selectMode === 'range' ||
-            this.selectMode === 'rangeFrom' ||
-            this.selectMode === 'rangeTo');
-    }
     ngOnInit() { }
     selectCell(cell) {
         this.select.emit(cell);
@@ -193,39 +193,43 @@ class OwlCalendarBodyComponent {
             const toValue = this.selectedValues[1];
             return value === fromValue || value === toValue;
         }
+        return false;
     }
     /**
      * Check if the cell in the range
      * */
     isInRange(value) {
         if (this.isInRangeMode) {
-            const fromValue = this.selectedValues[0];
-            const toValue = this.selectedValues[1];
-            if (fromValue !== null && toValue !== null) {
+            const fromValue = this.selectedValues?.[0];
+            const toValue = this.selectedValues?.[1];
+            if (fromValue !== undefined && toValue !== undefined) {
                 return value >= fromValue && value <= toValue;
             }
             else {
                 return value === fromValue || value === toValue;
             }
         }
+        return false;
     }
     /**
      * Check if the cell is the range from
      * */
     isRangeFrom(value) {
         if (this.isInRangeMode) {
-            const fromValue = this.selectedValues[0];
-            return fromValue !== null && value === fromValue;
+            const fromValue = this.selectedValues?.[0];
+            return fromValue !== undefined && value === fromValue;
         }
+        return false;
     }
     /**
      * Check if the cell is the range to
      * */
     isRangeTo(value) {
         if (this.isInRangeMode) {
-            const toValue = this.selectedValues[1];
-            return toValue !== null && value === toValue;
+            const toValue = this.selectedValues?.[1];
+            return toValue !== undefined && value === toValue;
         }
+        return false;
     }
     /**
      * Focus to a active cell
@@ -237,17 +241,17 @@ class OwlCalendarBodyComponent {
                 .pipe(take(1))
                 .subscribe(() => {
                 this.elmRef.nativeElement
-                    .querySelector('.owl-dt-calendar-cell-active')
-                    .focus();
+                    ?.querySelector('.nxt-dt-calendar-cell-active')
+                    ?.focus();
             });
         });
     }
 }
-OwlCalendarBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlCalendarBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-OwlCalendarBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlCalendarBodyComponent, selector: "[owl-date-time-calendar-body]", inputs: { activeCell: "activeCell", rows: "rows", numCols: "numCols", cellRatio: "cellRatio", todayValue: "todayValue", selectedValues: "selectedValues", selectMode: "selectMode" }, outputs: { select: "select" }, host: { properties: { "class.owl-dt-calendar-body": "this.owlDTCalendarBodyClass" } }, exportAs: ["owlDateTimeCalendarBody"], ngImport: i0, template: "<tr *ngFor=\"let row of rows; let rowIndex = index\"\n    role=\"row\">\n    <td *ngFor=\"let item of row; let colIndex = index\"\n        class=\"owl-dt-calendar-cell {{item.cellClass}}\"\n        [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n        [class.owl-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n        [class.owl-dt-calendar-cell-disabled]=\"!item.enabled\"\n        [class.owl-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n        [class.owl-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n        [class.owl-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-disabled]=\"!item.enabled || null\"\n        [style.width.%]=\"100 / numCols\"\n        [style.paddingTop.%]=\"50 * cellRatio / numCols\"\n        [style.paddingBottom.%]=\"50 * cellRatio / numCols\"\n        (click)=\"selectCell(item)\">\n        <span class=\"owl-dt-calendar-cell-content\"\n            [ngClass]=\"{\n                'owl-dt-calendar-cell-out': item.out,\n                'owl-dt-calendar-cell-today': item.value === todayValue,\n                'owl-dt-calendar-cell-selected': isSelected(item.value)\n              }\">\n            {{item.displayValue}}\n        </span>\n    </td>\n</tr>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlCalendarBodyComponent, decorators: [{
+CalendarBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: CalendarBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+CalendarBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: CalendarBodyComponent, selector: "[nxtDateTimeCalendarBody]", inputs: { activeCell: "activeCell", rows: "rows", numCols: "numCols", cellRatio: "cellRatio", todayValue: "todayValue", selectedValues: "selectedValues", selectMode: "selectMode" }, outputs: { select: "select" }, host: { properties: { "class.nxt-dt-calendar-body": "this.calendarBodyClass" } }, exportAs: ["nxtDateTimeCalendarBody"], ngImport: i0, template: "<tr *ngFor=\"let row of rows; let rowIndex = index\"\n    role=\"row\">\n    <td *ngFor=\"let item of row; let colIndex = index\"\n        class=\"nxt-dt-calendar-cell {{item.cellClass}}\"\n        [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n        [class.nxt-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n        [class.nxt-dt-calendar-cell-disabled]=\"!item.enabled\"\n        [class.nxt-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n        [class.nxt-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n        [class.nxt-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-disabled]=\"!item.enabled || null\"\n        [style.width.%]=\"100 / numCols\"\n        [style.paddingTop.%]=\"50 * cellRatio / numCols\"\n        [style.paddingBottom.%]=\"50 * cellRatio / numCols\"\n        (click)=\"selectCell(item)\">\n        <span class=\"nxt-dt-calendar-cell-content\"\n            [ngClass]=\"{\n                'nxt-dt-calendar-cell-out': item.out,\n                'nxt-dt-calendar-cell-today': item.value === todayValue,\n                'nxt-dt-calendar-cell-selected': isSelected(item.value)\n              }\">\n            {{item.displayValue}}\n        </span>\n    </td>\n</tr>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: CalendarBodyComponent, decorators: [{
             type: Component,
-            args: [{ selector: '[owl-date-time-calendar-body]', exportAs: 'owlDateTimeCalendarBody', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<tr *ngFor=\"let row of rows; let rowIndex = index\"\n    role=\"row\">\n    <td *ngFor=\"let item of row; let colIndex = index\"\n        class=\"owl-dt-calendar-cell {{item.cellClass}}\"\n        [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n        [class.owl-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n        [class.owl-dt-calendar-cell-disabled]=\"!item.enabled\"\n        [class.owl-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n        [class.owl-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n        [class.owl-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-disabled]=\"!item.enabled || null\"\n        [style.width.%]=\"100 / numCols\"\n        [style.paddingTop.%]=\"50 * cellRatio / numCols\"\n        [style.paddingBottom.%]=\"50 * cellRatio / numCols\"\n        (click)=\"selectCell(item)\">\n        <span class=\"owl-dt-calendar-cell-content\"\n            [ngClass]=\"{\n                'owl-dt-calendar-cell-out': item.out,\n                'owl-dt-calendar-cell-today': item.value === todayValue,\n                'owl-dt-calendar-cell-selected': isSelected(item.value)\n              }\">\n            {{item.displayValue}}\n        </span>\n    </td>\n</tr>\n" }]
+            args: [{ selector: '[nxtDateTimeCalendarBody]', exportAs: 'nxtDateTimeCalendarBody', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<tr *ngFor=\"let row of rows; let rowIndex = index\"\n    role=\"row\">\n    <td *ngFor=\"let item of row; let colIndex = index\"\n        class=\"nxt-dt-calendar-cell {{item.cellClass}}\"\n        [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n        [class.nxt-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n        [class.nxt-dt-calendar-cell-disabled]=\"!item.enabled\"\n        [class.nxt-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n        [class.nxt-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n        [class.nxt-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n        [attr.aria-label]=\"item.ariaLabel\"\n        [attr.aria-disabled]=\"!item.enabled || null\"\n        [style.width.%]=\"100 / numCols\"\n        [style.paddingTop.%]=\"50 * cellRatio / numCols\"\n        [style.paddingBottom.%]=\"50 * cellRatio / numCols\"\n        (click)=\"selectCell(item)\">\n        <span class=\"nxt-dt-calendar-cell-content\"\n            [ngClass]=\"{\n                'nxt-dt-calendar-cell-out': item.out,\n                'nxt-dt-calendar-cell-today': item.value === todayValue,\n                'nxt-dt-calendar-cell-selected': isSelected(item.value)\n              }\">\n            {{item.displayValue}}\n        </span>\n    </td>\n</tr>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { activeCell: [{
                 type: Input
             }], rows: [{
@@ -264,50 +268,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }], select: [{
                 type: Output
-            }], owlDTCalendarBodyClass: [{
+            }], calendarBodyClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-calendar-body']
+                args: ['class.nxt-dt-calendar-body']
             }] } });
 
 const DAYS_PER_WEEK = 7;
 const WEEKS_PER_VIEW = 6;
-class OwlMonthViewComponent {
-    constructor(cdRef, dateTimeAdapter, dateTimeFormats) {
-        this.cdRef = cdRef;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        /**
-         * Whether to hide dates in other months at the start or end of the current month.
-         * */
-        this.hideOtherMonths = false;
-        /**
-         * Define the first day of a week
-         * Sunday: 0 ~ Saturday: 6
-         * */
-        this._firstDayOfWeek = 0;
-        /**
-         * The select mode of the picker;
-         * */
-        this._selectMode = 'single';
-        this._selecteds = [];
-        this.localeSub = Subscription.EMPTY;
-        this.initiated = false;
-        /**
-         * An array to hold all selectedDates' value
-         * the value is the day number in current month
-         * */
-        this.selectedDates = [];
-        /**
-         * Callback to invoke when a new date is selected
-         * */
-        this.selectedChange = new EventEmitter();
-        /**
-         * Callback to invoke when any date is selected.
-         * */
-        this.userSelection = new EventEmitter();
-        /** Emits when any date is activated. */
-        this.pickerMomentChange = new EventEmitter();
-    }
+class MonthViewComponent {
     get firstDayOfWeek() {
         return this._firstDayOfWeek;
     }
@@ -344,7 +312,7 @@ class OwlMonthViewComponent {
         }
     }
     get selecteds() {
-        return this._selecteds;
+        return this._selecteds || [];
     }
     set selecteds(values) {
         this._selecteds = values.map(v => {
@@ -377,10 +345,10 @@ class OwlMonthViewComponent {
             this.cdRef.markForCheck();
         }
     }
-    get minDate() {
+    get min() {
         return this._minDate;
     }
-    set minDate(value) {
+    set min(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._minDate = this.getValidDate(value);
         if (this.initiated) {
@@ -388,10 +356,10 @@ class OwlMonthViewComponent {
             this.cdRef.markForCheck();
         }
     }
-    get maxDate() {
+    get max() {
         return this._maxDate;
     }
-    set maxDate(value) {
+    set max(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._maxDate = this.getValidDate(value);
         if (this.initiated) {
@@ -411,6 +379,7 @@ class OwlMonthViewComponent {
                 this.firstRowOffset -
                 1);
         }
+        return;
     }
     get isInSingleMode() {
         return this.selectMode === 'single';
@@ -420,9 +389,41 @@ class OwlMonthViewComponent {
             this.selectMode === 'rangeFrom' ||
             this.selectMode === 'rangeTo');
     }
-    get owlDTCalendarView() {
+    get calendarView() {
         return true;
     }
+    constructor(cdRef, dateTimeAdapter, dateTimeFormats) {
+        this.cdRef = cdRef;
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.dateTimeFormats = dateTimeFormats;
+        /**
+         * Whether to hide dates in other months at the start or end of the current month.
+         * */
+        this.hideOtherMonths = false;
+        /**
+         * Define the first day of a week
+         * Sunday: 0 ~ Saturday: 6
+         * */
+        this._firstDayOfWeek = 0;
+        /**
+         * The select mode of the picker;
+         * */
+        this._selectMode = 'single';
+        this._selecteds = new Array();
+        this.initiated = false;
+        // the index of cell that contains the first date of the month
+        this.firstRowOffset = 0;
+        /**
+         * Callback to invoke when a new date is selected
+         * */
+        this.selectedChange = new EventEmitter();
+        /**
+         * Callback to invoke when any date is selected.
+         * */
+        this.userSelection = new EventEmitter();
+        /** Emits when any date is activated. */
+        this.pickerMomentChange = new EventEmitter();
+    }
     ngOnInit() {
         this.generateWeekDays();
         this.localeSub = this.dateTimeAdapter.localeChanges.subscribe(() => {
@@ -436,7 +437,8 @@ class OwlMonthViewComponent {
         this.initiated = true;
     }
     ngOnDestroy() {
-        this.localeSub.unsubscribe();
+        this.localeSub?.unsubscribe();
+        this.localeSub = undefined;
     }
     /**
      * Handle a calendarCell selected
@@ -543,7 +545,7 @@ class OwlMonthViewComponent {
         if (!this.pickerMoment) {
             return;
         }
-        this.todayDate = null;
+        this.todayDate = undefined;
         // the first weekday of the month
         const startWeekdayOfMonth = this.dateTimeAdapter.getDay(this.firstDateOfMonth);
         const firstDayOfWeek = this.firstDayOfWeek;
@@ -586,7 +588,7 @@ class OwlMonthViewComponent {
         // check if date is not in current month
         const dayValue = daysDiff + 1;
         const out = dayValue < 1 || dayValue > daysInMonth;
-        const cellClass = 'owl-dt-day-' + this.dateTimeAdapter.getDay(date);
+        const cellClass = 'nxt-dt-day-' + this.dateTimeAdapter.getDay(date);
         return new CalendarCell(dayValue, dateName, ariaLabel, enabled, out, cellClass);
     }
     /**
@@ -595,10 +597,10 @@ class OwlMonthViewComponent {
     isDateEnabled(date) {
         return (!!date &&
             (!this.dateFilter || this.dateFilter(date, 'date')) &&
-            (!this.minDate ||
-                this.dateTimeAdapter.compare(date, this.minDate) >= 0) &&
-            (!this.maxDate ||
-                this.dateTimeAdapter.compare(date, this.maxDate) <= 0));
+            (!this.min ||
+                this.dateTimeAdapter.compare(date, this.min) >= 0) &&
+            (!this.max ||
+                this.dateTimeAdapter.compare(date, this.max) <= 0));
     }
     /**
      * Get a valid date object
@@ -607,10 +609,10 @@ class OwlMonthViewComponent {
         return this.dateTimeAdapter.isDateInstance(obj) &&
             this.dateTimeAdapter.isValid(obj)
             ? obj
-            : null;
+            : undefined;
     }
     /**
-     * Check if the give dates are none-null and in the same month
+     * Check if the give dates are defined and in the same month
      */
     isSameMonth(dateLeft, dateRight) {
         return !!(dateLeft &&
@@ -633,38 +635,32 @@ class OwlMonthViewComponent {
             return;
         }
         if (this.isInSingleMode && this.selected) {
-            const dayDiff = this.dateTimeAdapter.differenceInCalendarDays(this.selected, this.firstDateOfMonth);
+            const dayDiff = this.dateTimeAdapter.differenceInCalendarDays(this.selected, this.firstDateOfMonth) ?? 0;
             this.selectedDates[0] = dayDiff + 1;
             return;
         }
         if (this.isInRangeMode && this.selecteds) {
             this.selectedDates = this.selecteds.map(selected => {
                 if (this.dateTimeAdapter.isValid(selected)) {
-                    const dayDiff = this.dateTimeAdapter.differenceInCalendarDays(selected, this.firstDateOfMonth);
+                    const dayDiff = this.dateTimeAdapter.differenceInCalendarDays(selected, this.firstDateOfMonth) ?? 0;
                     return dayDiff + 1;
                 }
-                else {
-                    return null;
-                }
+                return;
             });
         }
     }
     focusActiveCell() {
-        this.calendarBodyElm.focusActiveCell();
+        this.calendarBodyElm?.focusActiveCell();
     }
 }
-OwlMonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlMonthViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlMonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlMonthViewComponent, selector: "owl-date-time-month-view", inputs: { hideOtherMonths: "hideOtherMonths", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", userSelection: "userSelection", pickerMomentChange: "pickerMomentChange" }, host: { properties: { "class.owl-dt-calendar-view": "this.owlDTCalendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: OwlCalendarBodyComponent, descendants: true, static: true }], exportAs: ["owlYearView"], ngImport: i0, template: "<table class=\"owl-dt-calendar-table owl-dt-calendar-month-table\"\n    [class.owl-dt-calendar-only-current-month]=\"hideOtherMonths\">\n    <thead class=\"owl-dt-calendar-header\">\n        <tr class=\"owl-dt-weekdays\">\n            <th *ngFor=\"let weekday of weekdays\"\n                [attr.aria-label]=\"weekday.long\"\n                class=\"owl-dt-weekday\"\n                scope=\"col\">\n                <span>{{weekday.short}}</span>\n            </th>\n        </tr>\n        <tr>\n            <th class=\"owl-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"7\"></th>\n        </tr>\n    </thead>\n    <tbody owl-date-time-calendar-body\n        role=\"grid\"\n        [rows]=\"days\"\n        [todayValue]=\"todayDate\"\n        [selectedValues]=\"selectedDates\"\n        [selectMode]=\"selectMode\"\n        [activeCell]=\"activeCell\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: OwlCalendarBodyComponent, selector: "[owl-date-time-calendar-body]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["owlDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlMonthViewComponent, decorators: [{
+MonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MonthViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter }, { token: NXT_DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
+MonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: MonthViewComponent, selector: "nxt-date-time-month-view", inputs: { hideOtherMonths: "hideOtherMonths", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", min: "min", max: "max" }, outputs: { selectedChange: "selectedChange", userSelection: "userSelection", pickerMomentChange: "pickerMomentChange" }, host: { properties: { "class.nxt-dt-calendar-view": "this.calendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: CalendarBodyComponent, descendants: true, static: true }], ngImport: i0, template: "<table class=\"nxt-dt-calendar-table nxt-dt-calendar-month-table\"\n    [class.nxt-dt-calendar-only-current-month]=\"hideOtherMonths\">\n    <thead class=\"nxt-dt-calendar-header\">\n        <tr class=\"nxt-dt-weekdays\">\n            <th *ngFor=\"let weekday of weekdays\"\n                [attr.aria-label]=\"weekday.long\"\n                class=\"nxt-dt-weekday\"\n                scope=\"col\">\n                <span>{{weekday.short}}</span>\n            </th>\n        </tr>\n        <tr>\n            <th class=\"nxt-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"7\"></th>\n        </tr>\n    </thead>\n    <tbody nxtDateTimeCalendarBody\n        role=\"grid\"\n        [rows]=\"days\"\n        [todayValue]=\"todayDate ?? undefined\"\n        [selectedValues]=\"selectedDates\"\n        [selectMode]=\"selectMode\"\n        [activeCell]=\"activeCell ?? 0\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: CalendarBodyComponent, selector: "[nxtDateTimeCalendarBody]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["nxtDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MonthViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-date-time-month-view', exportAs: 'owlYearView', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"owl-dt-calendar-table owl-dt-calendar-month-table\"\n    [class.owl-dt-calendar-only-current-month]=\"hideOtherMonths\">\n    <thead class=\"owl-dt-calendar-header\">\n        <tr class=\"owl-dt-weekdays\">\n            <th *ngFor=\"let weekday of weekdays\"\n                [attr.aria-label]=\"weekday.long\"\n                class=\"owl-dt-weekday\"\n                scope=\"col\">\n                <span>{{weekday.short}}</span>\n            </th>\n        </tr>\n        <tr>\n            <th class=\"owl-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"7\"></th>\n        </tr>\n    </thead>\n    <tbody owl-date-time-calendar-body\n        role=\"grid\"\n        [rows]=\"days\"\n        [todayValue]=\"todayDate\"\n        [selectedValues]=\"selectedDates\"\n        [selectMode]=\"selectMode\"\n        [activeCell]=\"activeCell\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
+            args: [{ selector: 'nxt-date-time-month-view', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"nxt-dt-calendar-table nxt-dt-calendar-month-table\"\n    [class.nxt-dt-calendar-only-current-month]=\"hideOtherMonths\">\n    <thead class=\"nxt-dt-calendar-header\">\n        <tr class=\"nxt-dt-weekdays\">\n            <th *ngFor=\"let weekday of weekdays\"\n                [attr.aria-label]=\"weekday.long\"\n                class=\"nxt-dt-weekday\"\n                scope=\"col\">\n                <span>{{weekday.short}}</span>\n            </th>\n        </tr>\n        <tr>\n            <th class=\"nxt-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"7\"></th>\n        </tr>\n    </thead>\n    <tbody nxtDateTimeCalendarBody\n        role=\"grid\"\n        [rows]=\"days\"\n        [todayValue]=\"todayDate ?? undefined\"\n        [selectedValues]=\"selectedDates\"\n        [selectMode]=\"selectMode\"\n        [activeCell]=\"activeCell ?? 0\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
+                    args: [NXT_DATE_TIME_FORMATS]
                 }] }]; }, propDecorators: { hideOtherMonths: [{
                 type: Input
             }], firstDayOfWeek: [{
@@ -679,9 +675,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }], dateFilter: [{
                 type: Input
-            }], minDate: [{
+            }], min: [{
                 type: Input
-            }], maxDate: [{
+            }], max: [{
                 type: Input
             }], selectedChange: [{
                 type: Output
@@ -691,13 +687,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], calendarBodyElm: [{
                 type: ViewChild,
-                args: [OwlCalendarBodyComponent, { static: true }]
-            }], owlDTCalendarView: [{
+                args: [CalendarBodyComponent, { static: true }]
+            }], calendarView: [{
                 type: HostBinding,
-                args: ['class.owl-dt-calendar-view']
+                args: ['class.nxt-dt-calendar-view']
             }] } });
 
-class OwlDateTimeIntl {
+class DateTimeIntl {
     constructor() {
         /**
          * Stream that emits whenever the labels here are changed. Use this to notify
@@ -746,9 +742,9 @@ class OwlDateTimeIntl {
         this.hour12PMLabel = $localize `:@@nxt-pick-datetime.time-pm:PM`;
     }
 }
-OwlDateTimeIntl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-OwlDateTimeIntl.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeIntl, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeIntl, decorators: [{
+DateTimeIntl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DateTimeIntl.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeIntl, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeIntl, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -757,31 +753,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
 
 const YEARS_PER_ROW = 3;
 const YEAR_ROWS = 7;
-class OwlMultiYearViewComponent {
-    constructor(cdRef, pickerIntl, dateTimeAdapter) {
-        this.cdRef = cdRef;
-        this.pickerIntl = pickerIntl;
-        this.dateTimeAdapter = dateTimeAdapter;
-        /**
-         * The select mode of the picker;
-         * */
-        this._selectMode = 'single';
-        this._selecteds = [];
-        this.initiated = false;
-        /**
-         * Callback to invoke when a new month is selected
-         * */
-        // eslint-disable-next-line @angular-eslint/no-output-native
-        this.change = new EventEmitter();
-        /**
-         * Emits the selected year. This doesn't imply a change on the selected date
-         * */
-        this.yearSelected = new EventEmitter();
-        /** Emits when any date is activated. */
-        this.pickerMomentChange = new EventEmitter();
-        /** Emits when use keyboard enter to select a calendar cell */
-        this.keyboardEnter = new EventEmitter();
-    }
+class MultiYearViewComponent {
     get selectMode() {
         return this._selectMode;
     }
@@ -834,20 +806,20 @@ class OwlMultiYearViewComponent {
             this.generateYearList();
         }
     }
-    get minDate() {
+    get min() {
         return this._minDate;
     }
-    set minDate(value) {
+    set min(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._minDate = this.getValidDate(value);
         if (this.initiated) {
             this.generateYearList();
         }
     }
-    get maxDate() {
+    get max() {
         return this._maxDate;
     }
-    set maxDate(value) {
+    set max(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._maxDate = this.getValidDate(value);
         if (this.initiated) {
@@ -874,11 +846,13 @@ class OwlMultiYearViewComponent {
         if (this._pickerMoment) {
             return this.dateTimeAdapter.getYear(this._pickerMoment) % (YEARS_PER_ROW * YEAR_ROWS);
         }
+        return;
     }
     get tableHeader() {
         if (this._years && this._years.length > 0) {
             return `${this._years[0][0].displayValue} ~ ${this._years[YEAR_ROWS - 1][YEARS_PER_ROW - 1].displayValue}`;
         }
+        return;
     }
     get prevButtonLabel() {
         return this.pickerIntl.prevMultiYearLabel;
@@ -886,12 +860,36 @@ class OwlMultiYearViewComponent {
     get nextButtonLabel() {
         return this.pickerIntl.nextMultiYearLabel;
     }
-    get owlDTCalendarView() {
+    get calendarView() {
         return true;
     }
-    get owlDTCalendarMultiYearView() {
+    get calendarMultiYearView() {
         return true;
     }
+    constructor(cdRef, pickerIntl, dateTimeAdapter) {
+        this.cdRef = cdRef;
+        this.pickerIntl = pickerIntl;
+        this.dateTimeAdapter = dateTimeAdapter;
+        /**
+         * The select mode of the picker;
+         * */
+        this._selectMode = 'single';
+        this._selecteds = new Array();
+        this.initiated = false;
+        /**
+         * Callback to invoke when a new month is selected
+         * */
+        // eslint-disable-next-line @angular-eslint/no-output-native
+        this.change = new EventEmitter();
+        /**
+         * Emits the selected year. This doesn't imply a change on the selected date
+         * */
+        this.yearSelected = new EventEmitter();
+        /** Emits when any date is activated. */
+        this.pickerMomentChange = new EventEmitter();
+        /** Emits when use keyboard enter to select a calendar cell */
+        this.keyboardEnter = new EventEmitter();
+    }
     ngOnInit() {
     }
     ngAfterContentInit() {
@@ -945,14 +943,14 @@ class OwlMultiYearViewComponent {
     }
     /** Whether the previous period button is enabled. */
     previousEnabled() {
-        if (!this.minDate) {
+        if (!this.min) {
             return true;
         }
-        return !this.minDate || !this.isSameYearList(this._pickerMoment, this.minDate);
+        return !this.min || !this.isSameYearList(this._pickerMoment, this.min);
     }
     /** Whether the next period button is enabled. */
     nextEnabled() {
-        return !this.maxDate || !this.isSameYearList(this._pickerMoment, this.maxDate);
+        return !this.max || !this.isSameYearList(this._pickerMoment, this.max);
     }
     handleCalendarKeydown(event) {
         let moment;
@@ -1013,7 +1011,7 @@ class OwlMultiYearViewComponent {
     createYearCell(year) {
         const startDateOfYear = this.dateTimeAdapter.createDate(year, 0, 1);
         const ariaLabel = this.dateTimeAdapter.getYearName(startDateOfYear);
-        const cellClass = 'owl-dt-year-' + year;
+        const cellClass = 'nxt-dt-year-' + year;
         return new CalendarCell(year, year.toString(), ariaLabel, this.isYearEnabled(year), false, cellClass);
     }
     setSelectedYears() {
@@ -1026,20 +1024,12 @@ class OwlMultiYearViewComponent {
                 if (this.dateTimeAdapter.isValid(selected)) {
                     return this.dateTimeAdapter.getYear(selected);
                 }
-                else {
-                    return null;
-                }
+                return;
             });
         }
     }
     /** Whether the given year is enabled. */
     isYearEnabled(year) {
-        // disable if the year is greater than maxDate lower than minDate
-        if (year === undefined || year === null ||
-            (this.maxDate && year > this.dateTimeAdapter.getYear(this.maxDate)) ||
-            (this.minDate && year < this.dateTimeAdapter.getYear(this.minDate))) {
-            return false;
-        }
         // enable if it reaches here and there's no filter defined
         if (!this.dateFilter) {
             return true;
@@ -1061,20 +1051,20 @@ class OwlMultiYearViewComponent {
      * Get a valid date object
      */
     getValidDate(obj) {
-        return (this.dateTimeAdapter.isDateInstance(obj) && this.dateTimeAdapter.isValid(obj)) ? obj : null;
+        return (this.dateTimeAdapter.isDateInstance(obj) && this.dateTimeAdapter.isValid(obj))
+            ? obj
+            : undefined;
     }
     focusActiveCell() {
-        this.calendarBodyElm.focusActiveCell();
+        this.calendarBodyElm?.focusActiveCell();
     }
 }
-OwlMultiYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlMultiYearViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: OwlDateTimeIntl }, { token: DateTimeAdapter, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlMultiYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlMultiYearViewComponent, selector: "owl-date-time-multi-year-view", inputs: { selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", minDate: "minDate", maxDate: "maxDate" }, outputs: { change: "change", yearSelected: "yearSelected", pickerMomentChange: "pickerMomentChange", keyboardEnter: "keyboardEnter" }, host: { properties: { "class.owl-dt-calendar-view": "this.owlDTCalendarView", "class.owl-dt-calendar-multi-year-view": "this.owlDTCalendarMultiYearView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: OwlCalendarBodyComponent, descendants: true, static: true }], ngImport: i0, template: "<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    [disabled]=\"!previousEnabled()\"\n    [attr.aria-label]=\"prevButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"prevYearList($event)\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<table class=\"owl-dt-calendar-table owl-dt-calendar-multi-year-table\">\n    <thead class=\"owl-dt-calendar-header\">\n        <tr>\n            <th colspan=\"3\">{{tableHeader}}</th>\n        </tr>\n    </thead>\n    <tbody owl-date-time-calendar-body\n        role=\"grid\"\n        [rows]=\"years\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell\"\n        [todayValue]=\"todayYear\"\n        [selectedValues]=\"selectedYears\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\"></tbody>\n</table>\n<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    [disabled]=\"!nextEnabled()\"\n    [attr.aria-label]=\"nextButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"nextYearList($event)\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n        <svg version=\"1.1\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\">\n            <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: OwlCalendarBodyComponent, selector: "[owl-date-time-calendar-body]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["owlDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlMultiYearViewComponent, decorators: [{
+MultiYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MultiYearViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeIntl }, { token: DateTimeAdapter }], target: i0.ɵɵFactoryTarget.Component });
+MultiYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: MultiYearViewComponent, selector: "nxt-date-time-multi-year-view", inputs: { selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", min: "min", max: "max" }, outputs: { change: "change", yearSelected: "yearSelected", pickerMomentChange: "pickerMomentChange", keyboardEnter: "keyboardEnter" }, host: { properties: { "class.nxt-dt-calendar-view": "this.calendarView", "class.nxt-dt-calendar-multi-year-view": "this.calendarMultiYearView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: CalendarBodyComponent, descendants: true, static: true }], ngImport: i0, template: "<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    [disabled]=\"!previousEnabled()\"\n    [attr.aria-label]=\"prevButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"prevYearList($event)\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<table class=\"nxt-dt-calendar-table nxt-dt-calendar-multi-year-table\">\n    <thead class=\"nxt-dt-calendar-header\">\n        <tr>\n            <th colspan=\"3\">{{tableHeader}}</th>\n        </tr>\n    </thead>\n    <tbody nxtDateTimeCalendarBody\n        role=\"grid\"\n        [rows]=\"years\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell ?? 0\"\n        [todayValue]=\"todayYear\"\n        [selectedValues]=\"selectedYears\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\"></tbody>\n</table>\n<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    [disabled]=\"!nextEnabled()\"\n    [attr.aria-label]=\"nextButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"nextYearList($event)\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n        <svg version=\"1.1\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\">\n            <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: CalendarBodyComponent, selector: "[nxtDateTimeCalendarBody]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["nxtDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MultiYearViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-date-time-multi-year-view', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    [disabled]=\"!previousEnabled()\"\n    [attr.aria-label]=\"prevButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"prevYearList($event)\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<table class=\"owl-dt-calendar-table owl-dt-calendar-multi-year-table\">\n    <thead class=\"owl-dt-calendar-header\">\n        <tr>\n            <th colspan=\"3\">{{tableHeader}}</th>\n        </tr>\n    </thead>\n    <tbody owl-date-time-calendar-body\n        role=\"grid\"\n        [rows]=\"years\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell\"\n        [todayValue]=\"todayYear\"\n        [selectedValues]=\"selectedYears\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\"></tbody>\n</table>\n<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    [disabled]=\"!nextEnabled()\"\n    [attr.aria-label]=\"nextButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"nextYearList($event)\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n        <svg version=\"1.1\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\">\n            <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: OwlDateTimeIntl }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { selectMode: [{
+            args: [{ selector: 'nxt-date-time-multi-year-view', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    [disabled]=\"!previousEnabled()\"\n    [attr.aria-label]=\"prevButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"prevYearList($event)\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<table class=\"nxt-dt-calendar-table nxt-dt-calendar-multi-year-table\">\n    <thead class=\"nxt-dt-calendar-header\">\n        <tr>\n            <th colspan=\"3\">{{tableHeader}}</th>\n        </tr>\n    </thead>\n    <tbody nxtDateTimeCalendarBody\n        role=\"grid\"\n        [rows]=\"years\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell ?? 0\"\n        [todayValue]=\"todayYear\"\n        [selectedValues]=\"selectedYears\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\"></tbody>\n</table>\n<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    [disabled]=\"!nextEnabled()\"\n    [attr.aria-label]=\"nextButtonLabel\"\n    type=\"button\"\n    tabindex=\"0\"\n    (click)=\"nextYearList($event)\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n        <svg version=\"1.1\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 250.738 250.738\"\n            style=\"enable-background:new 0 0 250.738 250.738;\"\n            xml:space=\"preserve\">\n            <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeIntl }, { type: DateTimeAdapter }]; }, propDecorators: { selectMode: [{
                 type: Input
             }], selected: [{
                 type: Input
@@ -1084,9 +1074,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }], dateFilter: [{
                 type: Input
-            }], minDate: [{
+            }], min: [{
                 type: Input
-            }], maxDate: [{
+            }], max: [{
                 type: Input
             }], change: [{
                 type: Output
@@ -1098,48 +1088,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], calendarBodyElm: [{
                 type: ViewChild,
-                args: [OwlCalendarBodyComponent, { static: true }]
-            }], owlDTCalendarView: [{
+                args: [CalendarBodyComponent, { static: true }]
+            }], calendarView: [{
                 type: HostBinding,
-                args: ['class.owl-dt-calendar-view']
-            }], owlDTCalendarMultiYearView: [{
+                args: ['class.nxt-dt-calendar-view']
+            }], calendarMultiYearView: [{
                 type: HostBinding,
-                args: ['class.owl-dt-calendar-multi-year-view']
+                args: ['class.nxt-dt-calendar-multi-year-view']
             }] } });
 
 const MONTHS_PER_YEAR = 12;
 const MONTHS_PER_ROW = 3;
-class OwlYearViewComponent {
-    constructor(cdRef, dateTimeAdapter, dateTimeFormats) {
-        this.cdRef = cdRef;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        /**
-         * The select mode of the picker;
-         * */
-        this._selectMode = 'single';
-        this._selecteds = [];
-        this.localeSub = Subscription.EMPTY;
-        this.initiated = false;
-        /**
-         * An array to hold all selectedDates' month value
-         * the value is the month number in current year
-         * */
-        this.selectedMonths = [];
-        /**
-         * Callback to invoke when a new month is selected
-         * */
-        this.change = new EventEmitter();
-        /**
-         * Emits the selected year. This doesn't imply a change on the selected date
-         * */
-        this.monthSelected = new EventEmitter();
-        /** Emits when any date is activated. */
-        this.pickerMomentChange = new EventEmitter();
-        /** Emits when use keyboard enter to select a calendar cell */
-        this.keyboardEnter = new EventEmitter();
-        this.monthNames = this.dateTimeAdapter.getMonthNames('short');
-    }
+class YearViewComponent {
     get selectMode() {
         return this._selectMode;
     }
@@ -1191,20 +1151,20 @@ class OwlYearViewComponent {
             this.generateMonthList();
         }
     }
-    get minDate() {
+    get min() {
         return this._minDate;
     }
-    set minDate(value) {
+    set min(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._minDate = this.getValidDate(value);
         if (this.initiated) {
             this.generateMonthList();
         }
     }
-    get maxDate() {
+    get max() {
         return this._maxDate;
     }
-    set maxDate(value) {
+    set max(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._maxDate = this.getValidDate(value);
         if (this.initiated) {
@@ -1218,6 +1178,7 @@ class OwlYearViewComponent {
         if (this._pickerMoment) {
             return this.dateTimeAdapter.getMonth(this._pickerMoment);
         }
+        return;
     }
     get isInSingleMode() {
         return this.selectMode === 'single';
@@ -1227,9 +1188,33 @@ class OwlYearViewComponent {
             this.selectMode === 'rangeFrom' ||
             this.selectMode === 'rangeTo');
     }
-    get owlDTCalendarView() {
+    get calendarView() {
         return true;
     }
+    constructor(cdRef, dateTimeAdapter, dateTimeFormats) {
+        this.cdRef = cdRef;
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.dateTimeFormats = dateTimeFormats;
+        /**
+         * The select mode of the picker;
+         * */
+        this._selectMode = 'single';
+        this._selecteds = new Array();
+        this.initiated = false;
+        /**
+         * Callback to invoke when a new month is selected
+         * */
+        this.change = new EventEmitter();
+        /**
+         * Emits the selected year. This doesn't imply a change on the selected date
+         * */
+        this.monthSelected = new EventEmitter();
+        /** Emits when any date is activated. */
+        this.pickerMomentChange = new EventEmitter();
+        /** Emits when use keyboard enter to select a calendar cell */
+        this.keyboardEnter = new EventEmitter();
+        this.monthNames = this.dateTimeAdapter.getMonthNames('short');
+    }
     ngOnInit() {
         this.localeSub = this.dateTimeAdapter.localeChanges.subscribe(() => {
             this.generateMonthList();
@@ -1241,7 +1226,8 @@ class OwlYearViewComponent {
         this.initiated = true;
     }
     ngOnDestroy() {
-        this.localeSub.unsubscribe();
+        this.localeSub?.unsubscribe();
+        this.localeSub = undefined;
     }
     /**
      * Handle a calendarCell selected
@@ -1343,7 +1329,7 @@ class OwlYearViewComponent {
     createMonthCell(month) {
         const startDateOfMonth = this.dateTimeAdapter.createDate(this.dateTimeAdapter.getYear(this.pickerMoment), month, 1);
         const ariaLabel = this.dateTimeAdapter.format(startDateOfMonth, this.dateTimeFormats.monthYearA11yLabel);
-        const cellClass = 'owl-dt-month-' + month;
+        const cellClass = 'nxt-dt-month-' + month;
         return new CalendarCell(month, this.monthNames[month], ariaLabel, this.isMonthEnabled(month), false, cellClass);
     }
     /**
@@ -1356,10 +1342,10 @@ class OwlYearViewComponent {
         for (let date = firstDateOfMonth; this.dateTimeAdapter.getMonth(date) === month; date = this.dateTimeAdapter.addCalendarDays(date, 1)) {
             if (!!date &&
                 (!this.dateFilter || this.dateFilter(date, 'month')) &&
-                (!this.minDate ||
-                    this.dateTimeAdapter.compare(date, this.minDate) >= 0) &&
-                (!this.maxDate ||
-                    this.dateTimeAdapter.compare(date, this.maxDate) <= 0)) {
+                (!this.min ||
+                    this.dateTimeAdapter.compare(date, this.min) >= 0) &&
+                (!this.max ||
+                    this.dateTimeAdapter.compare(date, this.max) <= 0)) {
                 return true;
             }
         }
@@ -1367,7 +1353,7 @@ class OwlYearViewComponent {
     }
     /**
      * Gets the month in this year that the given Date falls on.
-     * Returns null if the given Date is in another year.
+     * Returns undefined if the given Date is in another year.
      */
     getMonthInCurrentYear(date) {
         if (this.getValidDate(date) && this.getValidDate(this._pickerMoment)) {
@@ -1385,9 +1371,7 @@ class OwlYearViewComponent {
                 return this.dateTimeAdapter.getMonth(date);
             }
         }
-        else {
-            return null;
-        }
+        return;
     }
     /**
      * Set the selectedMonths value
@@ -1420,24 +1404,20 @@ class OwlYearViewComponent {
         return this.dateTimeAdapter.isDateInstance(obj) &&
             this.dateTimeAdapter.isValid(obj)
             ? obj
-            : null;
+            : undefined;
     }
     focusActiveCell() {
-        this.calendarBodyElm.focusActiveCell();
+        this.calendarBodyElm?.focusActiveCell();
     }
 }
-OwlYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlYearViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlYearViewComponent, selector: "owl-date-time-year-view", inputs: { selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", minDate: "minDate", maxDate: "maxDate" }, outputs: { change: "change", monthSelected: "monthSelected", pickerMomentChange: "pickerMomentChange", keyboardEnter: "keyboardEnter" }, host: { properties: { "class.owl-dt-calendar-view": "this.owlDTCalendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: OwlCalendarBodyComponent, descendants: true, static: true }], exportAs: ["owlMonthView"], ngImport: i0, template: "<table class=\"owl-dt-calendar-table owl-dt-calendar-year-table\">\n    <thead class=\"owl-dt-calendar-header\">\n        <tr>\n            <th class=\"owl-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"3\"></th>\n        </tr>\n    </thead>\n    <tbody owl-date-time-calendar-body\n        role=\"grid\"\n        [rows]=\"months\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell\"\n        [todayValue]=\"todayMonth\"\n        [selectedValues]=\"selectedMonths\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "component", type: OwlCalendarBodyComponent, selector: "[owl-date-time-calendar-body]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["owlDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlYearViewComponent, decorators: [{
+YearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: YearViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter }, { token: NXT_DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
+YearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: YearViewComponent, selector: "nxt-date-time-year-view", inputs: { selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", min: "min", max: "max" }, outputs: { change: "change", monthSelected: "monthSelected", pickerMomentChange: "pickerMomentChange", keyboardEnter: "keyboardEnter" }, host: { properties: { "class.nxt-dt-calendar-view": "this.calendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: CalendarBodyComponent, descendants: true, static: true }], ngImport: i0, template: "<table class=\"nxt-dt-calendar-table nxt-dt-calendar-year-table\">\n    <thead class=\"nxt-dt-calendar-header\">\n        <tr>\n            <th class=\"nxt-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"3\"></th>\n        </tr>\n    </thead>\n    <tbody nxtDateTimeCalendarBody\n        role=\"grid\"\n        [rows]=\"months\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell ?? 0\"\n        [todayValue]=\"todayMonth??undefined\"\n        [selectedValues]=\"selectedMonths\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "component", type: CalendarBodyComponent, selector: "[nxtDateTimeCalendarBody]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["select"], exportAs: ["nxtDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: YearViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-date-time-year-view', exportAs: 'owlMonthView', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"owl-dt-calendar-table owl-dt-calendar-year-table\">\n    <thead class=\"owl-dt-calendar-header\">\n        <tr>\n            <th class=\"owl-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"3\"></th>\n        </tr>\n    </thead>\n    <tbody owl-date-time-calendar-body\n        role=\"grid\"\n        [rows]=\"months\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell\"\n        [todayValue]=\"todayMonth\"\n        [selectedValues]=\"selectedMonths\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
+            args: [{ selector: 'nxt-date-time-year-view', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"nxt-dt-calendar-table nxt-dt-calendar-year-table\">\n    <thead class=\"nxt-dt-calendar-header\">\n        <tr>\n            <th class=\"nxt-dt-calendar-table-divider\"\n                aria-hidden=\"true\"\n                colspan=\"3\"></th>\n        </tr>\n    </thead>\n    <tbody nxtDateTimeCalendarBody\n        role=\"grid\"\n        [rows]=\"months\"\n        [numCols]=\"3\"\n        [cellRatio]=\"3 / 7\"\n        [activeCell]=\"activeCell ?? 0\"\n        [todayValue]=\"todayMonth??undefined\"\n        [selectedValues]=\"selectedMonths\"\n        [selectMode]=\"selectMode\"\n        (keydown)=\"handleCalendarKeydown($event)\"\n        (select)=\"selectCalendarCell($event)\">\n    </tbody>\n</table>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
+                    args: [NXT_DATE_TIME_FORMATS]
                 }] }]; }, propDecorators: { selectMode: [{
                 type: Input
             }], selected: [{
@@ -1448,9 +1428,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }], dateFilter: [{
                 type: Input
-            }], minDate: [{
+            }], min: [{
                 type: Input
-            }], maxDate: [{
+            }], max: [{
                 type: Input
             }], change: [{
                 type: Output
@@ -1462,82 +1442,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], calendarBodyElm: [{
                 type: ViewChild,
-                args: [OwlCalendarBodyComponent, { static: true }]
-            }], owlDTCalendarView: [{
+                args: [CalendarBodyComponent, { static: true }]
+            }], calendarView: [{
                 type: HostBinding,
-                args: ['class.owl-dt-calendar-view']
+                args: ['class.nxt-dt-calendar-view']
             }] } });
 
-class OwlCalendarComponent {
-    constructor(elmRef, pickerIntl, ngZone, cdRef, dateTimeAdapter, dateTimeFormats) {
-        this.elmRef = elmRef;
-        this.pickerIntl = pickerIntl;
-        this.ngZone = ngZone;
-        this.cdRef = cdRef;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        /**
-         * Set the first day of week
-         */
-        this.firstDayOfWeek = 0;
-        this._selecteds = [];
-        /**
-         * The view that the calendar should start in.
-         */
-        this.startView = 'month';
-        /** Emits when the currently picker moment changes. */
-        this.pickerMomentChange = new EventEmitter();
-        /** Emits when the currently selected date changes. */
-        this.selectedChange = new EventEmitter();
-        /** Emits when any date is selected. */
-        this.userSelection = new EventEmitter();
-        /**
-         * Emits the selected year. This doesn't imply a change on the selected date
-         * */
-        this.yearSelected = new EventEmitter();
-        /**
-         * Emits the selected month. This doesn't imply a change on the selected date
-         * */
-        this.monthSelected = new EventEmitter();
-        /**
-         * Date filter for the month and year view
-         */
-        this.dateFilterForViews = (date) => (!!date &&
-            (!this.dateFilter || this.dateFilter(date, 'date')) &&
-            (!this.minDate ||
-                this.dateTimeAdapter.compare(date, this.minDate) >= 0) &&
-            (!this.maxDate ||
-                this.dateTimeAdapter.compare(date, this.maxDate) <= 0));
-        this.intlChangesSub = Subscription.EMPTY;
-        /**
-         * Used for scheduling that focus should be moved to the active cell on the next tick.
-         * We need to schedule it, rather than do it immediately, because we have to wait
-         * for Angular to re-evaluate the view children.
-         */
-        this.moveFocusOnNextTick = false;
-        this.intlChangesSub = this.pickerIntl.changes.subscribe(() => {
-            this.cdRef.markForCheck();
-        });
-    }
-    get minDate() {
+class CalendarComponent {
+    get min() {
         return this._minDate;
     }
-    set minDate(value) {
+    set min(value) {
         value = this.dateTimeAdapter.deserialize(value);
         value = this.getValidDate(value);
         this._minDate = value
             ? this.dateTimeAdapter.createDate(this.dateTimeAdapter.getYear(value), this.dateTimeAdapter.getMonth(value), this.dateTimeAdapter.getDate(value))
-            : null;
+            : undefined;
     }
-    get maxDate() {
+    get max() {
         return this._maxDate;
     }
-    set maxDate(value) {
+    set max(value) {
         value = this.dateTimeAdapter.deserialize(value);
         value = this.getValidDate(value);
         this._maxDate = value
             ? this.dateTimeAdapter.createDate(this.dateTimeAdapter.getYear(value), this.dateTimeAdapter.getMonth(value), this.dateTimeAdapter.getDate(value))
-            : null;
+            : undefined;
     }
     get pickerMoment() {
         return this._pickerMoment;
@@ -1580,9 +1510,7 @@ class OwlCalendarComponent {
         else if (this._currentView === 'year') {
             return this.pickerIntl.prevYearLabel;
         }
-        else {
-            return null;
-        }
+        return;
     }
     get nextButtonLabel() {
         if (this._currentView === 'month') {
@@ -1591,9 +1519,7 @@ class OwlCalendarComponent {
         else if (this._currentView === 'year') {
             return this.pickerIntl.nextYearLabel;
         }
-        else {
-            return null;
-        }
+        return;
     }
     get currentView() {
         return this._currentView;
@@ -1617,11 +1543,64 @@ class OwlCalendarComponent {
         return this._currentView === 'month';
     }
     /**
-     * Bind class 'owl-dt-calendar' to host
+     * Bind class 'nxt-dt-calendar' to host
      * */
-    get owlDTCalendarClass() {
+    get calendarClass() {
         return true;
     }
+    constructor(elmRef, pickerIntl, ngZone, cdRef, dateTimeAdapter, dateTimeFormats) {
+        this.elmRef = elmRef;
+        this.pickerIntl = pickerIntl;
+        this.ngZone = ngZone;
+        this.cdRef = cdRef;
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.dateTimeFormats = dateTimeFormats;
+        /**
+         * Set the first day of week
+         */
+        this.firstDayOfWeek = 0;
+        this._selecteds = new Array();
+        /**
+         * The view that the calendar should start in.
+         */
+        this.startView = 'month';
+        /**
+         * Whether to hide dates in other months at the start or end of the current month.
+         * */
+        this.hideOtherMonths = false;
+        /** Emits when the currently picker moment changes. */
+        this.pickerMomentChange = new EventEmitter();
+        /** Emits when the currently selected date changes. */
+        this.selectedChange = new EventEmitter();
+        /** Emits when any date is selected. */
+        this.userSelection = new EventEmitter();
+        /**
+         * Emits the selected year. This doesn't imply a change on the selected date
+         * */
+        this.yearSelected = new EventEmitter();
+        /**
+         * Emits the selected month. This doesn't imply a change on the selected date
+         * */
+        this.monthSelected = new EventEmitter();
+        /**
+         * Date filter for the month and year view
+         */
+        this.dateFilterForViews = (date) => (!!date &&
+            (!this.dateFilter || this.dateFilter(date, 'date')) &&
+            (!this.min ||
+                this.dateTimeAdapter.compare(date, this.min) >= 0) &&
+            (!this.max ||
+                this.dateTimeAdapter.compare(date, this.max) <= 0));
+        /**
+         * Used for scheduling that focus should be moved to the active cell on the next tick.
+         * We need to schedule it, rather than do it immediately, because we have to wait
+         * for Angular to re-evaluate the view children.
+         */
+        this.moveFocusOnNextTick = false;
+        this.intlChangesSub = this.pickerIntl.changes.subscribe(() => {
+            this.cdRef.markForCheck();
+        });
+    }
     ngOnInit() { }
     ngAfterContentInit() {
         this._currentView = this.startView;
@@ -1633,7 +1612,8 @@ class OwlCalendarComponent {
         }
     }
     ngOnDestroy() {
-        this.intlChangesSub.unsubscribe();
+        this.intlChangesSub?.unsubscribe();
+        this.intlChangesSub = undefined;
     }
     /**
      * Toggle between month view and year view
@@ -1682,7 +1662,7 @@ class OwlCalendarComponent {
      * Change the pickerMoment value
      */
     handlePickerMomentChange(date) {
-        this.pickerMoment = this.dateTimeAdapter.clampDate(date, this.minDate, this.maxDate);
+        this.pickerMoment = this.dateTimeAdapter.clampDate(date, this.min, this.max);
         this.pickerMomentChange.emit(this.pickerMoment);
         return;
     }
@@ -1693,13 +1673,13 @@ class OwlCalendarComponent {
      * Whether the previous period button is enabled.
      */
     prevButtonEnabled() {
-        return (!this.minDate || !this.isSameView(this.pickerMoment, this.minDate));
+        return (!this.min || !this.isSameView(this.pickerMoment, this.min));
     }
     /**
      * Whether the next period button is enabled.
      */
     nextButtonEnabled() {
-        return (!this.maxDate || !this.isSameView(this.pickerMoment, this.maxDate));
+        return (!this.max || !this.isSameView(this.pickerMoment, this.max));
     }
     /**
      * Focus to the host element
@@ -1711,8 +1691,8 @@ class OwlCalendarComponent {
                 .pipe(take(1))
                 .subscribe(() => {
                 this.elmRef.nativeElement
-                    .querySelector('.owl-dt-calendar-cell-active')
-                    .focus();
+                    ?.querySelector('.nxt-dt-calendar-cell-active')
+                    ?.focus();
             });
         });
     }
@@ -1751,28 +1731,24 @@ class OwlCalendarComponent {
         return this.dateTimeAdapter.isDateInstance(obj) &&
             this.dateTimeAdapter.isValid(obj)
             ? obj
-            : null;
+            : undefined;
     }
 }
-OwlCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlCalendarComponent, deps: [{ token: i0.ElementRef }, { token: OwlDateTimeIntl }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlCalendarComponent, selector: "owl-date-time-calendar", inputs: { dateFilter: "dateFilter", firstDayOfWeek: "firstDayOfWeek", minDate: "minDate", maxDate: "maxDate", pickerMoment: "pickerMoment", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", startView: "startView", hideOtherMonths: "hideOtherMonths" }, outputs: { pickerMomentChange: "pickerMomentChange", selectedChange: "selectedChange", userSelection: "userSelection", yearSelected: "yearSelected", monthSelected: "monthSelected" }, host: { properties: { "class.owl-dt-calendar": "this.owlDTCalendarClass" } }, exportAs: ["owlDateTimeCalendar"], ngImport: i0, template: "<div class=\"owl-dt-calendar-control\">\n    <!-- focus when keyboard tab (http://kizu.ru/en/blog/keyboard-only-focus/#x) -->\n    <button class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!prevButtonEnabled()\"\n        [attr.aria-label]=\"prevButtonLabel\"\n        (click)=\"previousClicked()\">\n        <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n            <svg xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                version=\"1.1\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\"\n                width=\"100%\"\n                height=\"100%\">\n                <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                    d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n    <div class=\"owl-dt-calendar-control-content\">\n        <button class=\"owl-dt-control owl-dt-control-button owl-dt-control-period-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"periodButtonLabel\"\n            (click)=\"toggleViews()\">\n            <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{periodButtonText}}\n\n                <span class=\"owl-dt-control-button-arrow\"\n                    [style.transform]=\"'rotate(' + (isMonthView? 0 : 180) +'deg)'\">\n                    <!-- <editor-fold desc=\"SVG Arrow\"> -->\n                    <svg version=\"1.1\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                        x=\"0px\"\n                        y=\"0px\"\n                        width=\"50%\"\n                        height=\"50%\"\n                        viewBox=\"0 0 292.362 292.362\"\n                        style=\"enable-background:new 0 0 292.362 292.362;\"\n                        xml:space=\"preserve\">\n                        <g>\n                            <path\n                                d=\"M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424\n                                C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428\n                                s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z\" />\n                        </g>\n                    </svg>\n                    <!-- </editor-fold> -->\n                </span>\n            </span>\n        </button>\n    </div>\n    <button class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!nextButtonEnabled()\"\n        [attr.aria-label]=\"nextButtonLabel\"\n        (click)=\"nextClicked()\">\n        <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n            <svg version=\"1.1\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\">\n                <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                    d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                    c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                    c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                    C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n</div>\n<div class=\"owl-dt-calendar-main\"\n    cdkMonitorSubtreeFocus\n    [ngSwitch]=\"currentView\"\n    tabindex=\"-1\">\n    <owl-date-time-month-view *ngSwitchCase=\"'month'\"\n        [pickerMoment]=\"pickerMoment\"\n        [firstDayOfWeek]=\"firstDayOfWeek\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode\"\n        [minDate]=\"minDate\"\n        [maxDate]=\"maxDate\"\n        [dateFilter]=\"dateFilter\"\n        [hideOtherMonths]=\"hideOtherMonths\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (selectedChange)=\"dateSelected($event)\"\n        (userSelection)=\"userSelected()\"></owl-date-time-month-view>\n\n    <owl-date-time-year-view *ngSwitchCase=\"'year'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode\"\n        [minDate]=\"minDate\"\n        [maxDate]=\"maxDate\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (monthSelected)=\"selectMonthInYearView($event)\"\n        (change)=\"goToDateInView($event, 'month')\"></owl-date-time-year-view>\n\n    <owl-date-time-multi-year-view *ngSwitchCase=\"'multi-years'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode\"\n        [minDate]=\"minDate\"\n        [maxDate]=\"maxDate\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (yearSelected)=\"selectYearInMultiYearView($event)\"\n        (change)=\"goToDateInView($event, 'year')\"></owl-date-time-multi-year-view>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: OwlMultiYearViewComponent, selector: "owl-date-time-multi-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["change", "yearSelected", "pickerMomentChange", "keyboardEnter"] }, { kind: "component", type: OwlYearViewComponent, selector: "owl-date-time-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["change", "monthSelected", "pickerMomentChange", "keyboardEnter"], exportAs: ["owlMonthView"] }, { kind: "component", type: OwlMonthViewComponent, selector: "owl-date-time-month-view", inputs: ["hideOtherMonths", "firstDayOfWeek", "selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["selectedChange", "userSelection", "pickerMomentChange"], exportAs: ["owlYearView"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlCalendarComponent, decorators: [{
+CalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: CalendarComponent, deps: [{ token: i0.ElementRef }, { token: DateTimeIntl }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter }, { token: NXT_DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
+CalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: CalendarComponent, selector: "nxt-date-time-calendar", inputs: { dateFilter: "dateFilter", firstDayOfWeek: "firstDayOfWeek", min: "min", max: "max", pickerMoment: "pickerMoment", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", startView: "startView", hideOtherMonths: "hideOtherMonths" }, outputs: { pickerMomentChange: "pickerMomentChange", selectedChange: "selectedChange", userSelection: "userSelection", yearSelected: "yearSelected", monthSelected: "monthSelected" }, host: { properties: { "class.nxt-dt-calendar": "this.calendarClass" } }, ngImport: i0, template: "<div class=\"nxt-dt-calendar-control\">\n    <!-- focus when keyboard tab (http://kizu.ru/en/blog/keyboard-only-focus/#x) -->\n    <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!prevButtonEnabled()\"\n        [attr.aria-label]=\"prevButtonLabel\"\n        (click)=\"previousClicked()\">\n        <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n            <svg xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                version=\"1.1\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\"\n                width=\"100%\"\n                height=\"100%\">\n                <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                    d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n    <div class=\"nxt-dt-calendar-control-content\">\n        <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-control-period-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"periodButtonLabel\"\n            (click)=\"toggleViews()\">\n            <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{periodButtonText}}\n\n                <span class=\"nxt-dt-control-button-arrow\"\n                    [style.transform]=\"'rotate(' + (isMonthView? 0 : 180) +'deg)'\">\n                    <!-- <editor-fold desc=\"SVG Arrow\"> -->\n                    <svg version=\"1.1\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                        x=\"0px\"\n                        y=\"0px\"\n                        width=\"50%\"\n                        height=\"50%\"\n                        viewBox=\"0 0 292.362 292.362\"\n                        style=\"enable-background:new 0 0 292.362 292.362;\"\n                        xml:space=\"preserve\">\n                        <g>\n                            <path d=\"M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424\n                                C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428\n                                s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z\" />\n                        </g>\n                    </svg>\n                    <!-- </editor-fold> -->\n                </span>\n            </span>\n        </button>\n    </div>\n    <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!nextButtonEnabled()\"\n        [attr.aria-label]=\"nextButtonLabel\"\n        (click)=\"nextClicked()\">\n        <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n            <svg version=\"1.1\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\">\n                <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                    d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                    c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                    c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                    C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n</div>\n<div class=\"nxt-dt-calendar-main\"\n    cdkMonitorSubtreeFocus\n    [ngSwitch]=\"currentView\"\n    tabindex=\"-1\">\n    <nxt-date-time-month-view *ngSwitchCase=\"'month'\"\n        [pickerMoment]=\"pickerMoment\"\n        [firstDayOfWeek]=\"firstDayOfWeek\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode ?? 'single'\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [dateFilter]=\"dateFilter\"\n        [hideOtherMonths]=\"hideOtherMonths\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (selectedChange)=\"dateSelected($event)\"\n        (userSelection)=\"userSelected()\"></nxt-date-time-month-view>\n\n    <nxt-date-time-year-view *ngSwitchCase=\"'year'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode ?? 'single'\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (monthSelected)=\"selectMonthInYearView($event)\"\n        (change)=\"goToDateInView($event, 'month')\"></nxt-date-time-year-view>\n\n    <nxt-date-time-multi-year-view *ngSwitchCase=\"'multi-years'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode ?? 'single'\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (yearSelected)=\"selectYearInMultiYearView($event)\"\n        (change)=\"goToDateInView($event, 'year')\"></nxt-date-time-multi-year-view>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: MultiYearViewComponent, selector: "nxt-date-time-multi-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "min", "max"], outputs: ["change", "yearSelected", "pickerMomentChange", "keyboardEnter"] }, { kind: "component", type: YearViewComponent, selector: "nxt-date-time-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "min", "max"], outputs: ["change", "monthSelected", "pickerMomentChange", "keyboardEnter"] }, { kind: "component", type: MonthViewComponent, selector: "nxt-date-time-month-view", inputs: ["hideOtherMonths", "firstDayOfWeek", "selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "min", "max"], outputs: ["selectedChange", "userSelection", "pickerMomentChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: CalendarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-date-time-calendar', exportAs: 'owlDateTimeCalendar', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"owl-dt-calendar-control\">\n    <!-- focus when keyboard tab (http://kizu.ru/en/blog/keyboard-only-focus/#x) -->\n    <button class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!prevButtonEnabled()\"\n        [attr.aria-label]=\"prevButtonLabel\"\n        (click)=\"previousClicked()\">\n        <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n            <svg xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                version=\"1.1\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\"\n                width=\"100%\"\n                height=\"100%\">\n                <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                    d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n    <div class=\"owl-dt-calendar-control-content\">\n        <button class=\"owl-dt-control owl-dt-control-button owl-dt-control-period-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"periodButtonLabel\"\n            (click)=\"toggleViews()\">\n            <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{periodButtonText}}\n\n                <span class=\"owl-dt-control-button-arrow\"\n                    [style.transform]=\"'rotate(' + (isMonthView? 0 : 180) +'deg)'\">\n                    <!-- <editor-fold desc=\"SVG Arrow\"> -->\n                    <svg version=\"1.1\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                        x=\"0px\"\n                        y=\"0px\"\n                        width=\"50%\"\n                        height=\"50%\"\n                        viewBox=\"0 0 292.362 292.362\"\n                        style=\"enable-background:new 0 0 292.362 292.362;\"\n                        xml:space=\"preserve\">\n                        <g>\n                            <path\n                                d=\"M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424\n                                C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428\n                                s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z\" />\n                        </g>\n                    </svg>\n                    <!-- </editor-fold> -->\n                </span>\n            </span>\n        </button>\n    </div>\n    <button class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!nextButtonEnabled()\"\n        [attr.aria-label]=\"nextButtonLabel\"\n        (click)=\"nextClicked()\">\n        <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n            <svg version=\"1.1\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\">\n                <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                    d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                    c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                    c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                    C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n</div>\n<div class=\"owl-dt-calendar-main\"\n    cdkMonitorSubtreeFocus\n    [ngSwitch]=\"currentView\"\n    tabindex=\"-1\">\n    <owl-date-time-month-view *ngSwitchCase=\"'month'\"\n        [pickerMoment]=\"pickerMoment\"\n        [firstDayOfWeek]=\"firstDayOfWeek\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode\"\n        [minDate]=\"minDate\"\n        [maxDate]=\"maxDate\"\n        [dateFilter]=\"dateFilter\"\n        [hideOtherMonths]=\"hideOtherMonths\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (selectedChange)=\"dateSelected($event)\"\n        (userSelection)=\"userSelected()\"></owl-date-time-month-view>\n\n    <owl-date-time-year-view *ngSwitchCase=\"'year'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode\"\n        [minDate]=\"minDate\"\n        [maxDate]=\"maxDate\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (monthSelected)=\"selectMonthInYearView($event)\"\n        (change)=\"goToDateInView($event, 'month')\"></owl-date-time-year-view>\n\n    <owl-date-time-multi-year-view *ngSwitchCase=\"'multi-years'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode\"\n        [minDate]=\"minDate\"\n        [maxDate]=\"maxDate\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (yearSelected)=\"selectYearInMultiYearView($event)\"\n        (change)=\"goToDateInView($event, 'year')\"></owl-date-time-multi-year-view>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: OwlDateTimeIntl }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
+            args: [{ selector: 'nxt-date-time-calendar', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"nxt-dt-calendar-control\">\n    <!-- focus when keyboard tab (http://kizu.ru/en/blog/keyboard-only-focus/#x) -->\n    <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!prevButtonEnabled()\"\n        [attr.aria-label]=\"prevButtonLabel\"\n        (click)=\"previousClicked()\">\n        <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n            <svg xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                version=\"1.1\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\"\n                width=\"100%\"\n                height=\"100%\">\n                <path style=\"fill-rule: evenodd; clip-rule: evenodd;\"\n                    d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546   c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681   l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n    <div class=\"nxt-dt-calendar-control-content\">\n        <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-control-period-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"periodButtonLabel\"\n            (click)=\"toggleViews()\">\n            <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{periodButtonText}}\n\n                <span class=\"nxt-dt-control-button-arrow\"\n                    [style.transform]=\"'rotate(' + (isMonthView? 0 : 180) +'deg)'\">\n                    <!-- <editor-fold desc=\"SVG Arrow\"> -->\n                    <svg version=\"1.1\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                        x=\"0px\"\n                        y=\"0px\"\n                        width=\"50%\"\n                        height=\"50%\"\n                        viewBox=\"0 0 292.362 292.362\"\n                        style=\"enable-background:new 0 0 292.362 292.362;\"\n                        xml:space=\"preserve\">\n                        <g>\n                            <path d=\"M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424\n                                C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428\n                                s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z\" />\n                        </g>\n                    </svg>\n                    <!-- </editor-fold> -->\n                </span>\n            </span>\n        </button>\n    </div>\n    <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-control-arrow-button\"\n        type=\"button\"\n        tabindex=\"0\"\n        [style.visibility]=\"showControlArrows? 'visible': 'hidden'\"\n        [disabled]=\"!nextButtonEnabled()\"\n        [attr.aria-label]=\"nextButtonLabel\"\n        (click)=\"nextClicked()\">\n        <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n            tabindex=\"-1\">\n            <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n            <svg version=\"1.1\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                x=\"0px\"\n                y=\"0px\"\n                viewBox=\"0 0 250.738 250.738\"\n                style=\"enable-background:new 0 0 250.738 250.738;\"\n                xml:space=\"preserve\">\n                <path style=\"fill-rule:evenodd;clip-rule:evenodd;\"\n                    d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n                    c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n                    c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n                    C197.237,120.447,195.534,115.448,191.75,111.689z\" />\n            </svg>\n            <!-- </editor-fold> -->\n        </span>\n    </button>\n</div>\n<div class=\"nxt-dt-calendar-main\"\n    cdkMonitorSubtreeFocus\n    [ngSwitch]=\"currentView\"\n    tabindex=\"-1\">\n    <nxt-date-time-month-view *ngSwitchCase=\"'month'\"\n        [pickerMoment]=\"pickerMoment\"\n        [firstDayOfWeek]=\"firstDayOfWeek\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode ?? 'single'\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [dateFilter]=\"dateFilter\"\n        [hideOtherMonths]=\"hideOtherMonths\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (selectedChange)=\"dateSelected($event)\"\n        (userSelection)=\"userSelected()\"></nxt-date-time-month-view>\n\n    <nxt-date-time-year-view *ngSwitchCase=\"'year'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode ?? 'single'\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (monthSelected)=\"selectMonthInYearView($event)\"\n        (change)=\"goToDateInView($event, 'month')\"></nxt-date-time-year-view>\n\n    <nxt-date-time-multi-year-view *ngSwitchCase=\"'multi-years'\"\n        [pickerMoment]=\"pickerMoment\"\n        [selected]=\"selected\"\n        [selecteds]=\"selecteds\"\n        [selectMode]=\"selectMode ?? 'single'\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [dateFilter]=\"dateFilter\"\n        (keyboardEnter)=\"focusActiveCell()\"\n        (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n        (yearSelected)=\"selectYearInMultiYearView($event)\"\n        (change)=\"goToDateInView($event, 'year')\"></nxt-date-time-multi-year-view>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DateTimeIntl }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
+                    args: [NXT_DATE_TIME_FORMATS]
                 }] }]; }, propDecorators: { dateFilter: [{
                 type: Input
             }], firstDayOfWeek: [{
                 type: Input
-            }], minDate: [{
+            }], min: [{
                 type: Input
-            }], maxDate: [{
+            }], max: [{
                 type: Input
             }], pickerMoment: [{
                 type: Input
@@ -1796,70 +1772,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], monthSelected: [{
                 type: Output
-            }], owlDTCalendarClass: [{
+            }], calendarClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-calendar']
+                args: ['class.nxt-dt-calendar']
             }] } });
 
 let nextUniqueId = 0;
-class OwlDateTimeDirective {
-    constructor(dateTimeAdapter, dateTimeFormats) {
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        /**
-         * Whether to show the second's timer
-         */
-        this._showSecondsTimer = false;
-        /**
-         * Whether the timer is in hour12 format
-         */
-        this._hour12Timer = false;
-        /**
-         * The view that the calendar should start in.
-         */
-        this.startView = 'month';
-        /**
-         * Hours to change per step
-         */
-        this._stepHour = 1;
-        /**
-         * Minutes to change per step
-         */
-        this._stepMinute = 1;
-        /**
-         * Seconds to change per step
-         */
-        this._stepSecond = 1;
-        /**
-         * Set the first day of week
-         */
-        this._firstDayOfWeek = 0;
-        /**
-         * Whether to hide dates in other months at the start or end of the current month.
-         */
-        this._hideOtherMonths = false;
-        /**
-         * Date Time Checker to check if the give dateTime is selectable
-         */
-        this.dateTimeChecker = (dateTime) => (!!dateTime &&
-            (!this.dateTimeFilter || this.dateTimeFilter(dateTime)) &&
-            (!this.minDateTime ||
-                this.dateTimeAdapter.compare(dateTime, this.minDateTime) >=
-                    0) &&
-            (!this.maxDateTime ||
-                this.dateTimeAdapter.compare(dateTime, this.maxDateTime) <= 0));
-        if (!this.dateTimeAdapter) {
-            throw Error('OwlDateTimePicker: No provider found for DateTimeAdapter. You must import one of the following ' +
-                'modules at your application root: OwlNativeDateTimeModule, OwlMomentDateTimeModule, or provide a ' +
-                'custom implementation.');
-        }
-        if (!this.dateTimeFormats) {
-            throw Error('OwlDateTimePicker: No provider found for OWL_DATE_TIME_FORMATS. You must import one of the following ' +
-                'modules at your application root: OwlNativeDateTimeModule, OwlMomentDateTimeModule, or provide a ' +
-                'custom implementation.');
-        }
-        this._id = `owl-dt-picker-${nextUniqueId++}`;
-    }
+class DateTimeDirective {
     get showSecondsTimer() {
         return this._showSecondsTimer;
     }
@@ -1921,24 +1840,64 @@ class OwlDateTimeDirective {
     get disabled() {
         return false;
     }
+    constructor(dateTimeAdapter, dateTimeFormats) {
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.dateTimeFormats = dateTimeFormats;
+        /**
+         * Whether to show the second's timer
+         */
+        this._showSecondsTimer = false;
+        /**
+         * Whether the timer is in hour12 format
+         */
+        this._hour12Timer = false;
+        /**
+         * The view that the calendar should start in.
+         */
+        this.startView = 'month';
+        /**
+         * Hours to change per step
+         */
+        this._stepHour = 1;
+        /**
+         * Minutes to change per step
+         */
+        this._stepMinute = 1;
+        /**
+         * Seconds to change per step
+         */
+        this._stepSecond = 1;
+        /**
+         * Set the first day of week
+         */
+        this._firstDayOfWeek = 0;
+        /**
+         * Whether to hide dates in other months at the start or end of the current month.
+         */
+        this._hideOtherMonths = false;
+        /**
+         * Date Time Checker to check if the give dateTime is selectable
+         */
+        this.dateTimeChecker = (dateTime) => (!!dateTime &&
+            (!this.dateTimeFilter || this.dateTimeFilter(dateTime)) &&
+            (!this.min || this.dateTimeAdapter.compare(dateTime, this.min) >= 0) &&
+            (!this.max || this.dateTimeAdapter.compare(dateTime, this.max) <= 0));
+        this._id = `nxt-dt-picker-${nextUniqueId++}`;
+    }
     getValidDate(obj) {
         return this.dateTimeAdapter.isDateInstance(obj) &&
             this.dateTimeAdapter.isValid(obj)
             ? obj
-            : null;
+            : undefined;
     }
 }
-OwlDateTimeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeDirective, deps: [{ token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-OwlDateTimeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: OwlDateTimeDirective, inputs: { showSecondsTimer: "showSecondsTimer", hour12Timer: "hour12Timer", startView: "startView", stepHour: "stepHour", stepMinute: "stepMinute", stepSecond: "stepSecond", firstDayOfWeek: "firstDayOfWeek", hideOtherMonths: "hideOtherMonths" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeDirective, decorators: [{
+DateTimeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeDirective, deps: [{ token: DateTimeAdapter }, { token: NXT_DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Directive });
+DateTimeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: DateTimeDirective, inputs: { showSecondsTimer: "showSecondsTimer", hour12Timer: "hour12Timer", startView: "startView", stepHour: "stepHour", stepMinute: "stepMinute", stepSecond: "stepSecond", firstDayOfWeek: "firstDayOfWeek", hideOtherMonths: "hideOtherMonths" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeDirective, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
+        }], ctorParameters: function () { return [{ type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
+                    args: [NXT_DATE_TIME_FORMATS]
                 }] }]; }, propDecorators: { showSecondsTimer: [{
                 type: Input
             }], hour12Timer: [{
@@ -1959,41 +1918,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
 
 class NumberFixedLenPipe {
     transform(num, len) {
+        if (num == undefined || !Number.isFinite(num))
+            return undefined;
         const number = Math.floor(num);
-        const length = Math.floor(len);
-        if (num === null || isNaN(number) || isNaN(length)) {
-            return num;
-        }
-        let numString = number.toString();
-        while (numString.length < length) {
-            numString = '0' + numString;
-        }
-        return numString;
+        if (len == undefined || !Number.isFinite(len))
+            return number;
+        return number.toFixed(0).padStart(Math.floor(len), '0');
     }
 }
-NumberFixedLenPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: NumberFixedLenPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-NumberFixedLenPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: NumberFixedLenPipe, name: "numberFixedLen" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: NumberFixedLenPipe, decorators: [{
+NumberFixedLenPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: NumberFixedLenPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+NumberFixedLenPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: NumberFixedLenPipe, name: "numberFixedLen" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: NumberFixedLenPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'numberFixedLen'
                 }]
         }] });
 
-class OwlTimerBoxComponent {
+class TimerBoxComponent {
+    get displayValue() {
+        return this.boxValue || this.value;
+    }
+    get timerBoxClass() {
+        return true;
+    }
     constructor() {
         this.showDivider = false;
+        this.upBtnDisabled = false;
+        this.downBtnDisabled = false;
+        this.value = 0;
+        this.min = 0;
+        this.max = 0;
         this.step = 1;
         this.valueChange = new EventEmitter();
         this.inputChange = new EventEmitter();
         this.inputStream = new Subject();
-        this.inputStreamSub = Subscription.EMPTY;
-    }
-    get displayValue() {
-        return this.boxValue || this.value;
-    }
-    get owlDTTimerBoxClass() {
-        return true;
     }
     ngOnInit() {
         this.inputStreamSub = this.inputStream.pipe(debounceTime(500), distinctUntilChanged()).subscribe((val) => {
@@ -2004,7 +1963,8 @@ class OwlTimerBoxComponent {
         });
     }
     ngOnDestroy() {
-        this.inputStreamSub.unsubscribe();
+        this.inputStreamSub?.unsubscribe();
+        this.inputStreamSub = undefined;
     }
     upBtnClicked() {
         this.updateValue(this.value + this.step);
@@ -2025,11 +1985,11 @@ class OwlTimerBoxComponent {
         this.inputChange.emit(value);
     }
 }
-OwlTimerBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlTimerBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-OwlTimerBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlTimerBoxComponent, selector: "owl-date-time-timer-box", inputs: { showDivider: "showDivider", upBtnAriaLabel: "upBtnAriaLabel", upBtnDisabled: "upBtnDisabled", downBtnAriaLabel: "downBtnAriaLabel", downBtnDisabled: "downBtnDisabled", boxValue: "boxValue", value: "value", min: "min", max: "max", step: "step", inputLabel: "inputLabel" }, outputs: { valueChange: "valueChange", inputChange: "inputChange" }, host: { properties: { "class.owl-dt-timer-box": "this.owlDTTimerBoxClass" } }, exportAs: ["owlDateTimeTimerBox"], ngImport: i0, template: "<div *ngIf=\"showDivider\"\n    class=\"owl-dt-timer-divider\"\n    aria-hidden=\"true\"></div>\n<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"upBtnDisabled\"\n    [attr.aria-label]=\"upBtnAriaLabel\"\n    (click)=\"upBtnClicked()\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Up\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path d=\"M248.292,106.406l194.281,194.29c12.365,12.359,12.365,32.391,0,44.744c-12.354,12.354-32.391,12.354-44.744,0\n                        L225.923,173.529L54.018,345.44c-12.36,12.354-32.395,12.354-44.748,0c-12.359-12.354-12.359-32.391,0-44.75L203.554,106.4\n                        c6.18-6.174,14.271-9.259,22.369-9.259C234.018,97.141,242.115,100.232,248.292,106.406z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<label class=\"owl-dt-timer-content\">\n    <input class=\"owl-dt-timer-input\"\n        maxlength=\"2\"\n        [value]=\"displayValue | numberFixedLen : 2\"\n        (input)=\"handleInputChange(valueInput.value)\"\n        #valueInput>\n    <span class=\"owl-hidden-accessible\">{{inputLabel}}</span>\n</label>\n<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"downBtnDisabled\"\n    [attr.aria-label]=\"downBtnAriaLabel\"\n    (click)=\"downBtnClicked()\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Down\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path\n                d=\"M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751\n                        c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0\n                        c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NumberFixedLenPipe, name: "numberFixedLen" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlTimerBoxComponent, decorators: [{
+TimerBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: TimerBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TimerBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: TimerBoxComponent, selector: "nxt-date-time-timer-box", inputs: { showDivider: "showDivider", upBtnAriaLabel: "upBtnAriaLabel", upBtnDisabled: "upBtnDisabled", downBtnAriaLabel: "downBtnAriaLabel", downBtnDisabled: "downBtnDisabled", boxValue: "boxValue", value: "value", min: "min", max: "max", step: "step", inputLabel: "inputLabel" }, outputs: { valueChange: "valueChange", inputChange: "inputChange" }, host: { properties: { "class.nxt-dt-timer-box": "this.timerBoxClass" } }, ngImport: i0, template: "<div *ngIf=\"showDivider\"\n    class=\"nxt-dt-timer-divider\"\n    aria-hidden=\"true\"></div>\n<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"upBtnDisabled\"\n    [attr.aria-label]=\"upBtnAriaLabel\"\n    (click)=\"upBtnClicked()\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Up\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path d=\"M248.292,106.406l194.281,194.29c12.365,12.359,12.365,32.391,0,44.744c-12.354,12.354-32.391,12.354-44.744,0\n                        L225.923,173.529L54.018,345.44c-12.36,12.354-32.395,12.354-44.748,0c-12.359-12.354-12.359-32.391,0-44.75L203.554,106.4\n                        c6.18-6.174,14.271-9.259,22.369-9.259C234.018,97.141,242.115,100.232,248.292,106.406z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<label class=\"nxt-dt-timer-content\">\n    <input class=\"nxt-dt-timer-input\"\n        maxlength=\"2\"\n        [value]=\"displayValue | numberFixedLen : 2\"\n        (input)=\"handleInputChange(valueInput.value)\"\n        #valueInput>\n    <span class=\"nxt-hidden-accessible\">{{inputLabel}}</span>\n</label>\n<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"downBtnDisabled\"\n    [attr.aria-label]=\"downBtnAriaLabel\"\n    (click)=\"downBtnClicked()\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Down\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path d=\"M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751\n                        c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0\n                        c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NumberFixedLenPipe, name: "numberFixedLen" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: TimerBoxComponent, decorators: [{
             type: Component,
-            args: [{ exportAs: 'owlDateTimeTimerBox', selector: 'owl-date-time-timer-box', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"showDivider\"\n    class=\"owl-dt-timer-divider\"\n    aria-hidden=\"true\"></div>\n<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"upBtnDisabled\"\n    [attr.aria-label]=\"upBtnAriaLabel\"\n    (click)=\"upBtnClicked()\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Up\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path d=\"M248.292,106.406l194.281,194.29c12.365,12.359,12.365,32.391,0,44.744c-12.354,12.354-32.391,12.354-44.744,0\n                        L225.923,173.529L54.018,345.44c-12.36,12.354-32.395,12.354-44.748,0c-12.359-12.354-12.359-32.391,0-44.75L203.554,106.4\n                        c6.18-6.174,14.271-9.259,22.369-9.259C234.018,97.141,242.115,100.232,248.292,106.406z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<label class=\"owl-dt-timer-content\">\n    <input class=\"owl-dt-timer-input\"\n        maxlength=\"2\"\n        [value]=\"displayValue | numberFixedLen : 2\"\n        (input)=\"handleInputChange(valueInput.value)\"\n        #valueInput>\n    <span class=\"owl-hidden-accessible\">{{inputLabel}}</span>\n</label>\n<button class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"downBtnDisabled\"\n    [attr.aria-label]=\"downBtnAriaLabel\"\n    (click)=\"downBtnClicked()\">\n    <span class=\"owl-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Down\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path\n                d=\"M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751\n                        c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0\n                        c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n" }]
+            args: [{ selector: 'nxt-date-time-timer-box', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"showDivider\"\n    class=\"nxt-dt-timer-divider\"\n    aria-hidden=\"true\"></div>\n<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"upBtnDisabled\"\n    [attr.aria-label]=\"upBtnAriaLabel\"\n    (click)=\"upBtnClicked()\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Up\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path d=\"M248.292,106.406l194.281,194.29c12.365,12.359,12.365,32.391,0,44.744c-12.354,12.354-32.391,12.354-44.744,0\n                        L225.923,173.529L54.018,345.44c-12.36,12.354-32.395,12.354-44.748,0c-12.359-12.354-12.359-32.391,0-44.75L203.554,106.4\n                        c6.18-6.174,14.271-9.259,22.369-9.259C234.018,97.141,242.115,100.232,248.292,106.406z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n<label class=\"nxt-dt-timer-content\">\n    <input class=\"nxt-dt-timer-input\"\n        maxlength=\"2\"\n        [value]=\"displayValue | numberFixedLen : 2\"\n        (input)=\"handleInputChange(valueInput.value)\"\n        #valueInput>\n    <span class=\"nxt-hidden-accessible\">{{inputLabel}}</span>\n</label>\n<button class=\"nxt-dt-control-button nxt-dt-control-arrow-button\"\n    type=\"button\"\n    tabindex=\"-1\"\n    [disabled]=\"downBtnDisabled\"\n    [attr.aria-label]=\"downBtnAriaLabel\"\n    (click)=\"downBtnClicked()\">\n    <span class=\"nxt-dt-control-button-content\"\n        tabindex=\"-1\">\n        <!-- <editor-fold desc=\"SVG Arrow Down\"> -->\n        <svg xmlns=\"http://www.w3.org/2000/svg\"\n            xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            version=\"1.1\"\n            x=\"0px\"\n            y=\"0px\"\n            viewBox=\"0 0 451.847 451.846\"\n            style=\"enable-background:new 0 0 451.847 451.846;\"\n            xml:space=\"preserve\"\n            width=\"100%\"\n            height=\"100%\">\n            <path d=\"M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751\n                        c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0\n                        c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z\" />\n        </svg>\n        <!-- </editor-fold> -->\n    </span>\n</button>\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { showDivider: [{
                 type: Input
             }], upBtnAriaLabel: [{
@@ -2056,52 +2016,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], inputChange: [{
                 type: Output
-            }], owlDTTimerBoxClass: [{
+            }], timerBoxClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-timer-box']
+                args: ['class.nxt-dt-timer-box']
             }] } });
 
-class OwlTimerComponent {
-    constructor(ngZone, elmRef, pickerIntl, cdRef, dateTimeAdapter) {
-        this.ngZone = ngZone;
-        this.elmRef = elmRef;
-        this.pickerIntl = pickerIntl;
-        this.cdRef = cdRef;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.isPM = false; // a flag indicates the current timer moment is in PM or AM
-        /**
-         * Hours to change per step
-         */
-        this.stepHour = 1;
-        /**
-         * Minutes to change per step
-         */
-        this.stepMinute = 1;
-        /**
-         * Seconds to change per step
-         */
-        this.stepSecond = 1;
-        this.selectedChange = new EventEmitter();
-    }
+class TimerComponent {
     get pickerMoment() {
         return this._pickerMoment;
     }
     set pickerMoment(value) {
         value = this.dateTimeAdapter.deserialize(value);
-        this._pickerMoment =
-            this.getValidDate(value) || this.dateTimeAdapter.now();
+        this._pickerMoment = this.getValidDate(value) || this.dateTimeAdapter.now();
     }
-    get minDateTime() {
+    get min() {
         return this._minDateTime;
     }
-    set minDateTime(value) {
+    set min(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._minDateTime = this.getValidDate(value);
     }
-    get maxDateTime() {
+    get max() {
         return this._maxDateTime;
     }
-    set maxDateTime(value) {
+    set max(value) {
         value = this.dateTimeAdapter.deserialize(value);
         this._maxDateTime = this.getValidDate(value);
     }
@@ -2165,12 +2103,41 @@ class OwlTimerComponent {
             ? this.pickerIntl.hour12PMLabel
             : this.pickerIntl.hour12AMLabel;
     }
-    get owlDTTimerClass() {
+    get timerClass() {
         return true;
     }
-    get owlDTTimeTabIndex() {
+    get timeTabIndex() {
         return -1;
     }
+    constructor(ngZone, elmRef, pickerIntl, cdRef, dateTimeAdapter) {
+        this.ngZone = ngZone;
+        this.elmRef = elmRef;
+        this.pickerIntl = pickerIntl;
+        this.cdRef = cdRef;
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.isPM = false; // a flag indicates the current timer moment is in PM or AM
+        /**
+         * Whether to show the second's timer
+         */
+        this.showSecondsTimer = false;
+        /**
+         * Whether the timer is in hour12 format
+         */
+        this.hour12Timer = false;
+        /**
+         * Hours to change per step
+         */
+        this.stepHour = 1;
+        /**
+         * Minutes to change per step
+         */
+        this.stepMinute = 1;
+        /**
+         * Seconds to change per step
+         */
+        this.stepSecond = 1;
+        this.selectedChange = new EventEmitter();
+    }
     ngOnInit() { }
     /**
      * Focus to the host element
@@ -2232,43 +2199,43 @@ class OwlTimerComponent {
      * Check if the up hour button is enabled
      */
     upHourEnabled() {
-        return (!this.maxDateTime ||
-            this.compareHours(this.stepHour, this.maxDateTime) < 1);
+        return (!this.max ||
+            this.compareHours(this.stepHour, this.max) < 1);
     }
     /**
      * Check if the down hour button is enabled
      */
     downHourEnabled() {
-        return (!this.minDateTime ||
-            this.compareHours(-this.stepHour, this.minDateTime) > -1);
+        return (!this.min ||
+            this.compareHours(-this.stepHour, this.min) > -1);
     }
     /**
      * Check if the up minute button is enabled
      */
     upMinuteEnabled() {
-        return (!this.maxDateTime ||
-            this.compareMinutes(this.stepMinute, this.maxDateTime) < 1);
+        return (!this.max ||
+            this.compareMinutes(this.stepMinute, this.max) < 1);
     }
     /**
      * Check if the down minute button is enabled
      */
     downMinuteEnabled() {
-        return (!this.minDateTime ||
-            this.compareMinutes(-this.stepMinute, this.minDateTime) > -1);
+        return (!this.min ||
+            this.compareMinutes(-this.stepMinute, this.min) > -1);
     }
     /**
      * Check if the up second button is enabled
      */
     upSecondEnabled() {
-        return (!this.maxDateTime ||
-            this.compareSeconds(this.stepSecond, this.maxDateTime) < 1);
+        return (!this.max ||
+            this.compareSeconds(this.stepSecond, this.max) < 1);
     }
     /**
      * Check if the down second button is enabled
      */
     downSecondEnabled() {
-        return (!this.minDateTime ||
-            this.compareSeconds(-this.stepSecond, this.minDateTime) > -1);
+        return (!this.min ||
+            this.compareSeconds(-this.stepSecond, this.min) > -1);
     }
     /**
      * PickerMoment's hour value +/- certain amount and compare it to the give date
@@ -2310,21 +2277,19 @@ class OwlTimerComponent {
         return this.dateTimeAdapter.isDateInstance(obj) &&
             this.dateTimeAdapter.isValid(obj)
             ? obj
-            : null;
+            : undefined;
     }
 }
-OwlTimerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlTimerComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: OwlDateTimeIntl }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlTimerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlTimerComponent, selector: "owl-date-time-timer", inputs: { pickerMoment: "pickerMoment", minDateTime: "minDateTime", maxDateTime: "maxDateTime", showSecondsTimer: "showSecondsTimer", hour12Timer: "hour12Timer", stepHour: "stepHour", stepMinute: "stepMinute", stepSecond: "stepSecond" }, outputs: { selectedChange: "selectedChange" }, host: { properties: { "class.owl-dt-timer": "this.owlDTTimerClass", "attr.tabindex": "this.owlDTTimeTabIndex" } }, exportAs: ["owlDateTimeTimer"], ngImport: i0, template: "<owl-date-time-timer-box [upBtnAriaLabel]=\"upHourButtonLabel\"\n    [downBtnAriaLabel]=\"downHourButtonLabel\"\n    [upBtnDisabled]=\"!upHourEnabled()\"\n    [downBtnDisabled]=\"!downHourEnabled()\"\n    [boxValue]=\"hourBoxValue\"\n    [value]=\"hourValue\"\n    [min]=\"0\"\n    [max]=\"23\"\n    [step]=\"stepHour\"\n    [inputLabel]=\"'Hour'\"\n    (inputChange)=\"setHourValueViaInput($event)\"\n    (valueChange)=\"setHourValue($event)\"></owl-date-time-timer-box>\n<owl-date-time-timer-box [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upMinuteButtonLabel\"\n    [downBtnAriaLabel]=\"downMinuteButtonLabel\"\n    [upBtnDisabled]=\"!upMinuteEnabled()\"\n    [downBtnDisabled]=\"!downMinuteEnabled()\"\n    [value]=\"minuteValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepMinute\"\n    [inputLabel]=\"'Minute'\"\n    (inputChange)=\"setMinuteValue($event)\"\n    (valueChange)=\"setMinuteValue($event)\"></owl-date-time-timer-box>\n<owl-date-time-timer-box *ngIf=\"showSecondsTimer\"\n    [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upSecondButtonLabel\"\n    [downBtnAriaLabel]=\"downSecondButtonLabel\"\n    [upBtnDisabled]=\"!upSecondEnabled()\"\n    [downBtnDisabled]=\"!downSecondEnabled()\"\n    [value]=\"secondValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepSecond\"\n    [inputLabel]=\"'Second'\"\n    (inputChange)=\"setSecondValue($event)\"\n    (valueChange)=\"setSecondValue($event)\"></owl-date-time-timer-box>\n\n<div *ngIf=\"hour12Timer\"\n    class=\"owl-dt-timer-hour12\">\n    <button class=\"owl-dt-control-button owl-dt-timer-hour12-box\"\n        type=\"button\"\n        tabindex=\"0\"\n        (click)=\"setMeridiem($event)\">\n        <span class=\"owl-dt-control-button-content\"\n            tabindex=\"-1\">\n            {{hour12ButtonLabel}}\n        </span>\n    </button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OwlTimerBoxComponent, selector: "owl-date-time-timer-box", inputs: ["showDivider", "upBtnAriaLabel", "upBtnDisabled", "downBtnAriaLabel", "downBtnDisabled", "boxValue", "value", "min", "max", "step", "inputLabel"], outputs: ["valueChange", "inputChange"], exportAs: ["owlDateTimeTimerBox"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlTimerComponent, decorators: [{
+TimerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: TimerComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: DateTimeIntl }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter }], target: i0.ɵɵFactoryTarget.Component });
+TimerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: TimerComponent, selector: "nxt-date-time-timer", inputs: { pickerMoment: "pickerMoment", min: "min", max: "max", showSecondsTimer: "showSecondsTimer", hour12Timer: "hour12Timer", stepHour: "stepHour", stepMinute: "stepMinute", stepSecond: "stepSecond" }, outputs: { selectedChange: "selectedChange" }, host: { properties: { "class.nxt-dt-timer": "this.timerClass", "attr.tabindex": "this.timeTabIndex" } }, ngImport: i0, template: "<nxt-date-time-timer-box [upBtnAriaLabel]=\"upHourButtonLabel\"\n    [downBtnAriaLabel]=\"downHourButtonLabel\"\n    [upBtnDisabled]=\"!upHourEnabled()\"\n    [downBtnDisabled]=\"!downHourEnabled()\"\n    [boxValue]=\"hourBoxValue\"\n    [value]=\"hourValue\"\n    [min]=\"0\"\n    [max]=\"23\"\n    [step]=\"stepHour\"\n    inputLabel=\"Hour\"\n    (inputChange)=\"setHourValueViaInput($event)\"\n    (valueChange)=\"setHourValue($event)\"></nxt-date-time-timer-box>\n<nxt-date-time-timer-box [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upMinuteButtonLabel\"\n    [downBtnAriaLabel]=\"downMinuteButtonLabel\"\n    [upBtnDisabled]=\"!upMinuteEnabled()\"\n    [downBtnDisabled]=\"!downMinuteEnabled()\"\n    [value]=\"minuteValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepMinute\"\n    inputLabel=\"Minute\"\n    (inputChange)=\"setMinuteValue($event)\"\n    (valueChange)=\"setMinuteValue($event)\"></nxt-date-time-timer-box>\n<nxt-date-time-timer-box *ngIf=\"showSecondsTimer\"\n    [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upSecondButtonLabel\"\n    [downBtnAriaLabel]=\"downSecondButtonLabel\"\n    [upBtnDisabled]=\"!upSecondEnabled()\"\n    [downBtnDisabled]=\"!downSecondEnabled()\"\n    [value]=\"secondValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepSecond\"\n    inputLabel=\"Second\"\n    (inputChange)=\"setSecondValue($event)\"\n    (valueChange)=\"setSecondValue($event)\"></nxt-date-time-timer-box>\n\n<div *ngIf=\"hour12Timer\"\n    class=\"nxt-dt-timer-hour12\">\n    <button class=\"nxt-dt-control-button nxt-dt-timer-hour12-box\"\n        type=\"button\"\n        tabindex=\"0\"\n        (click)=\"setMeridiem($event)\">\n        <span class=\"nxt-dt-control-button-content\"\n            tabindex=\"-1\">\n            {{hour12ButtonLabel}}\n        </span>\n    </button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TimerBoxComponent, selector: "nxt-date-time-timer-box", inputs: ["showDivider", "upBtnAriaLabel", "upBtnDisabled", "downBtnAriaLabel", "downBtnDisabled", "boxValue", "value", "min", "max", "step", "inputLabel"], outputs: ["valueChange", "inputChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: TimerComponent, decorators: [{
             type: Component,
-            args: [{ exportAs: 'owlDateTimeTimer', selector: 'owl-date-time-timer', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<owl-date-time-timer-box [upBtnAriaLabel]=\"upHourButtonLabel\"\n    [downBtnAriaLabel]=\"downHourButtonLabel\"\n    [upBtnDisabled]=\"!upHourEnabled()\"\n    [downBtnDisabled]=\"!downHourEnabled()\"\n    [boxValue]=\"hourBoxValue\"\n    [value]=\"hourValue\"\n    [min]=\"0\"\n    [max]=\"23\"\n    [step]=\"stepHour\"\n    [inputLabel]=\"'Hour'\"\n    (inputChange)=\"setHourValueViaInput($event)\"\n    (valueChange)=\"setHourValue($event)\"></owl-date-time-timer-box>\n<owl-date-time-timer-box [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upMinuteButtonLabel\"\n    [downBtnAriaLabel]=\"downMinuteButtonLabel\"\n    [upBtnDisabled]=\"!upMinuteEnabled()\"\n    [downBtnDisabled]=\"!downMinuteEnabled()\"\n    [value]=\"minuteValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepMinute\"\n    [inputLabel]=\"'Minute'\"\n    (inputChange)=\"setMinuteValue($event)\"\n    (valueChange)=\"setMinuteValue($event)\"></owl-date-time-timer-box>\n<owl-date-time-timer-box *ngIf=\"showSecondsTimer\"\n    [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upSecondButtonLabel\"\n    [downBtnAriaLabel]=\"downSecondButtonLabel\"\n    [upBtnDisabled]=\"!upSecondEnabled()\"\n    [downBtnDisabled]=\"!downSecondEnabled()\"\n    [value]=\"secondValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepSecond\"\n    [inputLabel]=\"'Second'\"\n    (inputChange)=\"setSecondValue($event)\"\n    (valueChange)=\"setSecondValue($event)\"></owl-date-time-timer-box>\n\n<div *ngIf=\"hour12Timer\"\n    class=\"owl-dt-timer-hour12\">\n    <button class=\"owl-dt-control-button owl-dt-timer-hour12-box\"\n        type=\"button\"\n        tabindex=\"0\"\n        (click)=\"setMeridiem($event)\">\n        <span class=\"owl-dt-control-button-content\"\n            tabindex=\"-1\">\n            {{hour12ButtonLabel}}\n        </span>\n    </button>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: OwlDateTimeIntl }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { pickerMoment: [{
+            args: [{ selector: 'nxt-date-time-timer', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<nxt-date-time-timer-box [upBtnAriaLabel]=\"upHourButtonLabel\"\n    [downBtnAriaLabel]=\"downHourButtonLabel\"\n    [upBtnDisabled]=\"!upHourEnabled()\"\n    [downBtnDisabled]=\"!downHourEnabled()\"\n    [boxValue]=\"hourBoxValue\"\n    [value]=\"hourValue\"\n    [min]=\"0\"\n    [max]=\"23\"\n    [step]=\"stepHour\"\n    inputLabel=\"Hour\"\n    (inputChange)=\"setHourValueViaInput($event)\"\n    (valueChange)=\"setHourValue($event)\"></nxt-date-time-timer-box>\n<nxt-date-time-timer-box [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upMinuteButtonLabel\"\n    [downBtnAriaLabel]=\"downMinuteButtonLabel\"\n    [upBtnDisabled]=\"!upMinuteEnabled()\"\n    [downBtnDisabled]=\"!downMinuteEnabled()\"\n    [value]=\"minuteValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepMinute\"\n    inputLabel=\"Minute\"\n    (inputChange)=\"setMinuteValue($event)\"\n    (valueChange)=\"setMinuteValue($event)\"></nxt-date-time-timer-box>\n<nxt-date-time-timer-box *ngIf=\"showSecondsTimer\"\n    [showDivider]=\"true\"\n    [upBtnAriaLabel]=\"upSecondButtonLabel\"\n    [downBtnAriaLabel]=\"downSecondButtonLabel\"\n    [upBtnDisabled]=\"!upSecondEnabled()\"\n    [downBtnDisabled]=\"!downSecondEnabled()\"\n    [value]=\"secondValue\"\n    [min]=\"0\"\n    [max]=\"59\"\n    [step]=\"stepSecond\"\n    inputLabel=\"Second\"\n    (inputChange)=\"setSecondValue($event)\"\n    (valueChange)=\"setSecondValue($event)\"></nxt-date-time-timer-box>\n\n<div *ngIf=\"hour12Timer\"\n    class=\"nxt-dt-timer-hour12\">\n    <button class=\"nxt-dt-control-button nxt-dt-timer-hour12-box\"\n        type=\"button\"\n        tabindex=\"0\"\n        (click)=\"setMeridiem($event)\">\n        <span class=\"nxt-dt-control-button-content\"\n            tabindex=\"-1\">\n            {{hour12ButtonLabel}}\n        </span>\n    </button>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: DateTimeIntl }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter }]; }, propDecorators: { pickerMoment: [{
                 type: Input
-            }], minDateTime: [{
+            }], min: [{
                 type: Input
-            }], maxDateTime: [{
+            }], max: [{
                 type: Input
             }], showSecondsTimer: [{
                 type: Input
@@ -2338,15 +2303,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }], selectedChange: [{
                 type: Output
-            }], owlDTTimerClass: [{
+            }], timerClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-timer']
-            }], owlDTTimeTabIndex: [{
+                args: ['class.nxt-dt-timer']
+            }], timeTabIndex: [{
                 type: HostBinding,
                 args: ['attr.tabindex']
             }] } });
 
-const owlDateTimePickerAnimations = {
+const dateTimePickerAnimations = {
     transformPicker: trigger('transformPicker', [
         state('void', style({ opacity: 0, transform: 'scale(1, 0)' })),
         state('enter', style({ opacity: 1, transform: 'scale(1, 1)' })),
@@ -2363,43 +2328,18 @@ const owlDateTimePickerAnimations = {
     ])
 };
 
-class OwlDateTimeContainerComponent {
-    constructor(cdRef, elmRef, pickerIntl, dateTimeAdapter) {
-        this.cdRef = cdRef;
-        this.elmRef = elmRef;
-        this.pickerIntl = pickerIntl;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.activeSelectedIndex = 0; // The current active SelectedIndex in range select mode (0: 'from', 1: 'to')
-        /**
-         * Stream emits when try to hide picker
-         * */
-        this.hidePicker$ = new Subject();
-        /**
-         * Stream emits when try to confirm the selected value
-         * */
-        this.confirmSelected$ = new Subject();
-        this.pickerOpened$ = new Subject();
-    }
-    get hidePickerStream() {
-        return this.hidePicker$.asObservable();
-    }
-    get confirmSelectedStream() {
-        return this.confirmSelected$.asObservable();
-    }
-    get pickerOpenedStream() {
-        return this.pickerOpened$.asObservable();
-    }
+class DateTimeContainerComponent {
     get pickerMoment() {
         return this._clamPickerMoment;
     }
     set pickerMoment(value) {
         if (value) {
-            this._clamPickerMoment = this.dateTimeAdapter.clampDate(value, this.picker.minDateTime, this.picker.maxDateTime);
+            this._clamPickerMoment = this.dateTimeAdapter.clampDate(value, this.picker?.min, this.picker?.max);
         }
         this.cdRef.markForCheck();
     }
     get pickerType() {
-        return this.picker.pickerType;
+        return this.picker?.pickerType;
     }
     get cancelLabel() {
         return this.pickerIntl.cancelBtnLabel;
@@ -2423,18 +2363,18 @@ class OwlDateTimeContainerComponent {
      * The range 'from' formatted value
      * */
     get fromFormattedValue() {
-        const value = this.picker.selecteds[0];
+        const value = this.picker?.selecteds[0];
         return value
-            ? this.dateTimeAdapter.format(value, this.picker.formatString)
+            ? this.dateTimeAdapter.format(value, this.picker?.formatString)
             : '';
     }
     /**
      * The range 'to' formatted value
      * */
     get toFormattedValue() {
-        const value = this.picker.selecteds[1];
+        const value = this.picker?.selecteds[1];
         return value
-            ? this.dateTimeAdapter.format(value, this.picker.formatString)
+            ? this.dateTimeAdapter.format(value, this.picker?.formatString)
             : '';
     }
     /**
@@ -2443,33 +2383,52 @@ class OwlDateTimeContainerComponent {
      * 2) picker type is NOT 'calendar' and the picker mode is NOT 'inline'
      * */
     get showControlButtons() {
-        return (this.picker.pickerMode === 'dialog' ||
-            (this.picker.pickerType !== 'calendar' &&
-                this.picker.pickerMode !== 'inline'));
+        return (this.picker?.pickerMode === 'dialog' ||
+            (this.picker?.pickerType !== 'calendar' &&
+                this.picker?.pickerMode !== 'inline'));
     }
     get containerElm() {
         return this.elmRef.nativeElement;
     }
-    get owlDTContainerClass() {
+    get containerClass() {
         return true;
     }
-    get owlDTPopupContainerClass() {
-        return this.picker.pickerMode === 'popup';
+    get popupContainerClass() {
+        return this.picker?.pickerMode === 'popup';
     }
-    get owlDTDialogContainerClass() {
-        return this.picker.pickerMode === 'dialog';
+    get dialogContainerClass() {
+        return this.picker?.pickerMode === 'dialog';
     }
-    get owlDTInlineContainerClass() {
-        return this.picker.pickerMode === 'inline';
+    get inlineContainerClass() {
+        return this.picker?.pickerMode === 'inline';
     }
-    get owlDTContainerDisabledClass() {
-        return this.picker.disabled;
+    get containerDisabledClass() {
+        return !!this.picker?.disabled;
     }
-    get owlDTContainerId() {
-        return this.picker.id;
+    get containerId() {
+        return this.picker?.id;
     }
-    get owlDTContainerAnimation() {
-        return this.picker.pickerMode === 'inline' ? '' : 'enter';
+    get containerAnimation() {
+        return this.picker?.pickerMode === 'inline' ? '' : 'enter';
+    }
+    constructor(cdRef, elmRef, pickerIntl, dateTimeAdapter) {
+        this.cdRef = cdRef;
+        this.elmRef = elmRef;
+        this.pickerIntl = pickerIntl;
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.activeSelectedIndex = 0; // The current active SelectedIndex in range select mode (0: 'from', 1: 'to')
+        /**
+         * Stream emits when try to hide picker
+         * */
+        this.hidePicker$ = new Subject();
+        this.hidePickerStream = this.hidePicker$.asObservable();
+        /**
+         * Stream emits when try to confirm the selected value
+         * */
+        this.confirmSelected$ = new Subject();
+        this.confirmSelectedStream = this.confirmSelected$.asObservable();
+        this.pickerOpened$ = new Subject();
+        this.pickerOpenedStream = this.pickerOpened$.asObservable();
     }
     ngOnInit() { }
     ngAfterContentInit() {
@@ -2481,26 +2440,26 @@ class OwlDateTimeContainerComponent {
     handleContainerAnimationDone(event) {
         const toState = event.toState;
         if (toState === 'enter') {
-            this.pickerOpened$.next(undefined);
+            this.pickerOpened$.next();
         }
     }
     dateSelected(date) {
         let result;
-        if (this.picker.isInSingleMode) {
+        if (this.picker?.isInSingleMode) {
             result = this.dateSelectedInSingleMode(date);
             if (result) {
                 this.pickerMoment = result;
                 this.picker.select(result);
             }
             else {
-                // we close the picker when result is null and pickerType is calendar.
+                // we close the picker when result is undefined and pickerType is calendar.
                 if (this.pickerType === 'calendar') {
-                    this.hidePicker$.next(null);
+                    this.hidePicker$.next();
                 }
             }
             return;
         }
-        if (this.picker.isInRangeMode) {
+        if (this.picker?.isInRangeMode) {
             result = this.dateSelectedInRangeMode(date);
             if (result) {
                 this.pickerMoment = result[this.activeSelectedIndex];
@@ -2510,7 +2469,7 @@ class OwlDateTimeContainerComponent {
     }
     timeSelected(time) {
         this.pickerMoment = this.dateTimeAdapter.clone(time);
-        if (!this.picker.dateTimeChecker(this.pickerMoment)) {
+        if (!this.picker?.dateTimeChecker(this.pickerMoment)) {
             return;
         }
         if (this.picker.isInSingleMode) {
@@ -2518,7 +2477,7 @@ class OwlDateTimeContainerComponent {
             return;
         }
         if (this.picker.isInRangeMode) {
-            const selecteds = [...this.picker.selecteds];
+            const selecteds = [...this.picker?.selecteds || []];
             // check if the 'from' is after 'to' or 'to'is before 'from'
             // In this case, we set both the 'from' and 'to' the same value
             if ((this.activeSelectedIndex === 0 &&
@@ -2540,7 +2499,7 @@ class OwlDateTimeContainerComponent {
      * Handle click on cancel button
      */
     onCancelClicked(event) {
-        this.hidePicker$.next(null);
+        this.hidePicker$.next();
         event.preventDefault();
         return;
     }
@@ -2548,8 +2507,8 @@ class OwlDateTimeContainerComponent {
      * Handle click on set button
      */
     onSetClicked(event) {
-        if (!this.picker.dateTimeChecker(this.pickerMoment)) {
-            this.hidePicker$.next(null);
+        if (!this.picker?.dateTimeChecker?.(this.pickerMoment)) {
+            this.hidePicker$.next();
             event.preventDefault();
             return;
         }
@@ -2592,10 +2551,10 @@ class OwlDateTimeContainerComponent {
      * Set the value of activeSelectedIndex
      */
     setActiveSelectedIndex(index) {
-        if (this.picker.selectMode === 'range' &&
+        if (this.picker?.selectMode === 'range' &&
             this.activeSelectedIndex !== index) {
             this.activeSelectedIndex = index;
-            const selected = this.picker.selecteds[this.activeSelectedIndex];
+            const selected = this.picker?.selecteds[this.activeSelectedIndex];
             if (this.picker.selecteds && selected) {
                 this.pickerMoment = this.dateTimeAdapter.clone(selected);
             }
@@ -2603,16 +2562,16 @@ class OwlDateTimeContainerComponent {
         return;
     }
     initPicker() {
-        this.pickerMoment = this.picker.startAt || this.dateTimeAdapter.now();
-        this.activeSelectedIndex = this.picker.selectMode === 'rangeTo' ? 1 : 0;
+        this.pickerMoment = this.picker?.startAt || this.dateTimeAdapter.now();
+        this.activeSelectedIndex = this.picker?.selectMode === 'rangeTo' ? 1 : 0;
     }
     /**
      * Select calendar date in single mode,
-     * it returns null when date is not selected.
+     * it returns undefined when date is not selected.
      */
     dateSelectedInSingleMode(date) {
-        if (this.dateTimeAdapter.isSameDay(date, this.picker.selected)) {
-            return null;
+        if (this.dateTimeAdapter.isSameDay(date, this.picker?.selected)) {
+            return undefined;
         }
         return this.updateAndCheckCalendarDate(date);
     }
@@ -2620,42 +2579,42 @@ class OwlDateTimeContainerComponent {
      * Select dates in range Mode
      */
     dateSelectedInRangeMode(date) {
-        let from = this.picker.selecteds[0];
-        let to = this.picker.selecteds[1];
+        let from = this.picker?.selecteds[0];
+        let to = this.picker?.selecteds[1];
         const result = this.updateAndCheckCalendarDate(date);
         if (!result) {
-            return null;
+            return;
         }
         // if the given calendar day is after or equal to 'from',
         // set ths given date as 'to'
-        // otherwise, set it as 'from' and set 'to' to null
-        if (this.picker.selectMode === 'range') {
+        // otherwise, set it as 'from' and set 'to' to undefined
+        if (this.picker?.selectMode === 'range') {
             if (this.picker.selecteds &&
                 this.picker.selecteds.length &&
                 !to &&
                 from &&
-                this.dateTimeAdapter.differenceInCalendarDays(result, from) >= 0) {
+                (this.dateTimeAdapter.differenceInCalendarDays(result, from) ?? 0) >= 0) {
                 to = result;
                 this.activeSelectedIndex = 1;
             }
             else {
                 from = result;
-                to = null;
+                to = undefined;
                 this.activeSelectedIndex = 0;
             }
         }
-        else if (this.picker.selectMode === 'rangeFrom') {
+        else if (this.picker?.selectMode === 'rangeFrom') {
             from = result;
-            // if the from value is after the to value, set the to value as null
+            // if the from value is after the to value, set the to value as undefined
             if (to && this.dateTimeAdapter.compare(from, to) > 0) {
-                to = null;
+                to = undefined;
             }
         }
-        else if (this.picker.selectMode === 'rangeTo') {
+        else if (this.picker?.selectMode === 'rangeTo') {
             to = result;
-            // if the from value is after the to value, set the from value as null
+            // if the from value is after the to value, set the from value as undefined
             if (from && this.dateTimeAdapter.compare(from, to) > 0) {
-                from = null;
+                from = undefined;
             }
         }
         return [from, to];
@@ -2665,26 +2624,26 @@ class OwlDateTimeContainerComponent {
      * Because the calendar date has 00:00:00 as default time, if the picker type is 'both',
      * we need to update the given calendar date's time before selecting it.
      * if it is valid, return the updated dateTime
-     * if it is not valid, return null
+     * if it is not valid, return undefined
      */
     updateAndCheckCalendarDate(date) {
         let result;
         // if the picker is 'both', update the calendar date's time value
-        if (this.picker.pickerType === 'both') {
+        if (this.picker?.pickerType === 'both') {
             result = this.dateTimeAdapter.createDate(this.dateTimeAdapter.getYear(date), this.dateTimeAdapter.getMonth(date), this.dateTimeAdapter.getDate(date), this.dateTimeAdapter.getHours(this.pickerMoment), this.dateTimeAdapter.getMinutes(this.pickerMoment), this.dateTimeAdapter.getSeconds(this.pickerMoment));
-            result = this.dateTimeAdapter.clampDate(result, this.picker.minDateTime, this.picker.maxDateTime);
+            result = this.dateTimeAdapter.clampDate(result, this.picker.min, this.picker.max);
         }
         else {
             result = this.dateTimeAdapter.clone(date);
         }
         // check the updated dateTime
-        return this.picker.dateTimeChecker(result) ? result : null;
+        return this.picker?.dateTimeChecker(result) ? result : undefined;
     }
     /**
      * Focus to the picker
      * */
     focusPicker() {
-        if (this.picker.pickerMode === 'inline') {
+        if (this.picker?.pickerMode === 'inline') {
             return;
         }
         if (this.calendar) {
@@ -2695,44 +2654,42 @@ class OwlDateTimeContainerComponent {
         }
     }
 }
-OwlDateTimeContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: OwlDateTimeIntl }, { token: DateTimeAdapter, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlDateTimeContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlDateTimeContainerComponent, selector: "owl-date-time-container", host: { listeners: { "@transformPicker.done": "handleContainerAnimationDone($event)" }, properties: { "class.owl-dt-container": "this.owlDTContainerClass", "class.owl-dt-popup-container": "this.owlDTPopupContainerClass", "class.owl-dt-dialog-container": "this.owlDTDialogContainerClass", "class.owl-dt-inline-container": "this.owlDTInlineContainerClass", "class.owl-dt-container-disabled": "this.owlDTContainerDisabledClass", "attr.id": "this.owlDTContainerId", "@transformPicker": "this.owlDTContainerAnimation" } }, viewQueries: [{ propertyName: "calendar", first: true, predicate: OwlCalendarComponent, descendants: true }, { propertyName: "timer", first: true, predicate: OwlTimerComponent, descendants: true }], exportAs: ["owlDateTimeContainer"], ngImport: i0, template: "<div [cdkTrapFocus]=\"picker?.pickerMode !== 'inline'\"\n    [@fadeInPicker]=\"picker?.pickerMode === 'inline'? '' : 'enter'\"\n    class=\"owl-dt-container-inner\">\n\n    <owl-date-time-calendar *ngIf=\"pickerType === 'both' || pickerType === 'calendar'\"\n        class=\"owl-dt-container-row\"\n        [firstDayOfWeek]=\"picker?.firstDayOfWeek\"\n        [(pickerMoment)]=\"pickerMoment\"\n        [selected]=\"picker?.selected\"\n        [selecteds]=\"picker?.selecteds\"\n        [selectMode]=\"picker?.selectMode\"\n        [minDate]=\"picker?.minDateTime\"\n        [maxDate]=\"picker?.maxDateTime\"\n        [dateFilter]=\"picker?.dateTimeFilter\"\n        [startView]=\"picker?.startView\"\n        [hideOtherMonths]=\"picker?.hideOtherMonths\"\n        (yearSelected)=\"picker?.selectYear($event)\"\n        (monthSelected)=\"picker?.selectMonth($event)\"\n        (selectedChange)=\"dateSelected($event)\"></owl-date-time-calendar>\n\n    <owl-date-time-timer *ngIf=\"pickerType === 'both' || pickerType === 'timer'\"\n        class=\"owl-dt-container-row\"\n        [pickerMoment]=\"pickerMoment\"\n        [minDateTime]=\"picker?.minDateTime\"\n        [maxDateTime]=\"picker?.maxDateTime\"\n        [showSecondsTimer]=\"picker?.showSecondsTimer\"\n        [hour12Timer]=\"picker?.hour12Timer\"\n        [stepHour]=\"picker?.stepHour\"\n        [stepMinute]=\"picker?.stepMinute\"\n        [stepSecond]=\"picker?.stepSecond\"\n        (selectedChange)=\"timeSelected($event)\"></owl-date-time-timer>\n\n    <div *ngIf=\"picker?.isInRangeMode\"\n        role=\"radiogroup\"\n        class=\"owl-dt-container-info owl-dt-container-row\">\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 0 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 0\"\n            class=\"owl-dt-control owl-dt-container-range owl-dt-container-from\"\n            [ngClass]=\"{'owl-dt-container-info-active': activeSelectedIndex === 0}\"\n            (click)=\"handleClickOnInfoGroup($event, 0)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, to, 0)\"\n            #from>\n            <span class=\"owl-dt-control-content owl-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"owl-dt-container-info-label\">{{fromLabel}}:</span>\n                <span class=\"owl-dt-container-info-value\">{{fromFormattedValue}}</span>\n            </span>\n        </div>\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 1 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 1\"\n            class=\"owl-dt-control owl-dt-container-range owl-dt-container-to\"\n            [ngClass]=\"{'owl-dt-container-info-active': activeSelectedIndex === 1}\"\n            (click)=\"handleClickOnInfoGroup($event, 1)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, from, 1)\"\n            #to>\n            <span class=\"owl-dt-control-content owl-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"owl-dt-container-info-label\">{{toLabel}}:</span>\n                <span class=\"owl-dt-container-info-value\">{{toFormattedValue}}</span>\n            </span>\n        </div>\n    </div>\n\n    <div *ngIf=\"showControlButtons\"\n        class=\"owl-dt-container-buttons owl-dt-container-row\">\n        <button class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onCancelClicked($event)\">\n            <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{cancelLabel}}\n            </span>\n        </button>\n        <button class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onSetClicked($event)\">\n            <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{setLabel}}\n            </span>\n        </button>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: OwlTimerComponent, selector: "owl-date-time-timer", inputs: ["pickerMoment", "minDateTime", "maxDateTime", "showSecondsTimer", "hour12Timer", "stepHour", "stepMinute", "stepSecond"], outputs: ["selectedChange"], exportAs: ["owlDateTimeTimer"] }, { kind: "component", type: OwlCalendarComponent, selector: "owl-date-time-calendar", inputs: ["dateFilter", "firstDayOfWeek", "minDate", "maxDate", "pickerMoment", "selectMode", "selected", "selecteds", "startView", "hideOtherMonths"], outputs: ["pickerMomentChange", "selectedChange", "userSelection", "yearSelected", "monthSelected"], exportAs: ["owlDateTimeCalendar"] }], animations: [
-        owlDateTimePickerAnimations.transformPicker,
-        owlDateTimePickerAnimations.fadeInPicker
+DateTimeContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: DateTimeIntl }, { token: DateTimeAdapter }], target: i0.ɵɵFactoryTarget.Component });
+DateTimeContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: DateTimeContainerComponent, selector: "nxt-date-time-container", host: { listeners: { "@transformPicker.done": "handleContainerAnimationDone($event)" }, properties: { "class.nxt-dt-container": "this.containerClass", "class.nxt-dt-popup-container": "this.popupContainerClass", "class.nxt-dt-dialog-container": "this.dialogContainerClass", "class.nxt-dt-inline-container": "this.inlineContainerClass", "class.nxt-dt-container-disabled": "this.containerDisabledClass", "attr.id": "this.containerId", "@transformPicker": "this.containerAnimation" } }, viewQueries: [{ propertyName: "calendar", first: true, predicate: CalendarComponent, descendants: true }, { propertyName: "timer", first: true, predicate: TimerComponent, descendants: true }], ngImport: i0, template: "<div [cdkTrapFocus]=\"picker?.pickerMode !== 'inline'\"\n    [@fadeInPicker]=\"picker?.pickerMode === 'inline'? '' : 'enter'\"\n    class=\"nxt-dt-container-inner\">\n\n    <nxt-date-time-calendar *ngIf=\"pickerType === 'both' || pickerType === 'calendar'\"\n        class=\"nxt-dt-container-row\"\n        [firstDayOfWeek]=\"picker?.firstDayOfWeek ?? 0\"\n        [(pickerMoment)]=\"pickerMoment\"\n        [selected]=\"picker?.selected\"\n        [selecteds]=\"picker?.selecteds ?? []\"\n        [selectMode]=\"picker?.selectMode\"\n        [min]=\"picker?.min\"\n        [max]=\"picker?.max\"\n        [dateFilter]=\"picker?.dateTimeFilter\"\n        [startView]=\"picker?.startView ?? 'month'\"\n        [hideOtherMonths]=\"!!picker?.hideOtherMonths\"\n        (yearSelected)=\"picker?.selectYear($event)\"\n        (monthSelected)=\"picker?.selectMonth($event)\"\n        (selectedChange)=\"dateSelected($event)\"></nxt-date-time-calendar>\n\n    <nxt-date-time-timer *ngIf=\"pickerType === 'both' || pickerType === 'timer'\"\n        class=\"nxt-dt-container-row\"\n        [pickerMoment]=\"pickerMoment\"\n        [min]=\"picker?.min\"\n        [max]=\"picker?.max\"\n        [showSecondsTimer]=\"!!picker?.showSecondsTimer\"\n        [hour12Timer]=\"!!picker?.hour12Timer\"\n        [stepHour]=\"picker?.stepHour ?? 1\"\n        [stepMinute]=\"picker?.stepMinute ?? 1\"\n        [stepSecond]=\"picker?.stepSecond ?? 1\"\n        (selectedChange)=\"timeSelected($event)\"></nxt-date-time-timer>\n\n    <div *ngIf=\"picker?.isInRangeMode\"\n        role=\"radiogroup\"\n        class=\"nxt-dt-container-info nxt-dt-container-row\">\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 0 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 0\"\n            class=\"nxt-dt-control nxt-dt-container-range nxt-dt-container-from\"\n            [ngClass]=\"{'nxt-dt-container-info-active': activeSelectedIndex === 0}\"\n            (click)=\"handleClickOnInfoGroup($event, 0)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, to, 0)\"\n            #from>\n            <span class=\"nxt-dt-control-content nxt-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"nxt-dt-container-info-label\">{{fromLabel}}:</span>\n                <span class=\"nxt-dt-container-info-value\">{{fromFormattedValue}}</span>\n            </span>\n        </div>\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 1 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 1\"\n            class=\"nxt-dt-control nxt-dt-container-range nxt-dt-container-to\"\n            [ngClass]=\"{'nxt-dt-container-info-active': activeSelectedIndex === 1}\"\n            (click)=\"handleClickOnInfoGroup($event, 1)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, from, 1)\"\n            #to>\n            <span class=\"nxt-dt-control-content nxt-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"nxt-dt-container-info-label\">{{toLabel}}:</span>\n                <span class=\"nxt-dt-container-info-value\">{{toFormattedValue}}</span>\n            </span>\n        </div>\n    </div>\n\n    <div *ngIf=\"showControlButtons\"\n        class=\"nxt-dt-container-buttons nxt-dt-container-row\">\n        <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onCancelClicked($event)\">\n            <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{cancelLabel}}\n            </span>\n        </button>\n        <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onSetClicked($event)\">\n            <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{setLabel}}\n            </span>\n        </button>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: TimerComponent, selector: "nxt-date-time-timer", inputs: ["pickerMoment", "min", "max", "showSecondsTimer", "hour12Timer", "stepHour", "stepMinute", "stepSecond"], outputs: ["selectedChange"] }, { kind: "component", type: CalendarComponent, selector: "nxt-date-time-calendar", inputs: ["dateFilter", "firstDayOfWeek", "min", "max", "pickerMoment", "selectMode", "selected", "selecteds", "startView", "hideOtherMonths"], outputs: ["pickerMomentChange", "selectedChange", "userSelection", "yearSelected", "monthSelected"] }], animations: [
+        dateTimePickerAnimations.transformPicker,
+        dateTimePickerAnimations.fadeInPicker
     ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeContainerComponent, decorators: [{
             type: Component,
-            args: [{ exportAs: 'owlDateTimeContainer', selector: 'owl-date-time-container', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, animations: [
-                        owlDateTimePickerAnimations.transformPicker,
-                        owlDateTimePickerAnimations.fadeInPicker
-                    ], template: "<div [cdkTrapFocus]=\"picker?.pickerMode !== 'inline'\"\n    [@fadeInPicker]=\"picker?.pickerMode === 'inline'? '' : 'enter'\"\n    class=\"owl-dt-container-inner\">\n\n    <owl-date-time-calendar *ngIf=\"pickerType === 'both' || pickerType === 'calendar'\"\n        class=\"owl-dt-container-row\"\n        [firstDayOfWeek]=\"picker?.firstDayOfWeek\"\n        [(pickerMoment)]=\"pickerMoment\"\n        [selected]=\"picker?.selected\"\n        [selecteds]=\"picker?.selecteds\"\n        [selectMode]=\"picker?.selectMode\"\n        [minDate]=\"picker?.minDateTime\"\n        [maxDate]=\"picker?.maxDateTime\"\n        [dateFilter]=\"picker?.dateTimeFilter\"\n        [startView]=\"picker?.startView\"\n        [hideOtherMonths]=\"picker?.hideOtherMonths\"\n        (yearSelected)=\"picker?.selectYear($event)\"\n        (monthSelected)=\"picker?.selectMonth($event)\"\n        (selectedChange)=\"dateSelected($event)\"></owl-date-time-calendar>\n\n    <owl-date-time-timer *ngIf=\"pickerType === 'both' || pickerType === 'timer'\"\n        class=\"owl-dt-container-row\"\n        [pickerMoment]=\"pickerMoment\"\n        [minDateTime]=\"picker?.minDateTime\"\n        [maxDateTime]=\"picker?.maxDateTime\"\n        [showSecondsTimer]=\"picker?.showSecondsTimer\"\n        [hour12Timer]=\"picker?.hour12Timer\"\n        [stepHour]=\"picker?.stepHour\"\n        [stepMinute]=\"picker?.stepMinute\"\n        [stepSecond]=\"picker?.stepSecond\"\n        (selectedChange)=\"timeSelected($event)\"></owl-date-time-timer>\n\n    <div *ngIf=\"picker?.isInRangeMode\"\n        role=\"radiogroup\"\n        class=\"owl-dt-container-info owl-dt-container-row\">\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 0 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 0\"\n            class=\"owl-dt-control owl-dt-container-range owl-dt-container-from\"\n            [ngClass]=\"{'owl-dt-container-info-active': activeSelectedIndex === 0}\"\n            (click)=\"handleClickOnInfoGroup($event, 0)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, to, 0)\"\n            #from>\n            <span class=\"owl-dt-control-content owl-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"owl-dt-container-info-label\">{{fromLabel}}:</span>\n                <span class=\"owl-dt-container-info-value\">{{fromFormattedValue}}</span>\n            </span>\n        </div>\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 1 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 1\"\n            class=\"owl-dt-control owl-dt-container-range owl-dt-container-to\"\n            [ngClass]=\"{'owl-dt-container-info-active': activeSelectedIndex === 1}\"\n            (click)=\"handleClickOnInfoGroup($event, 1)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, from, 1)\"\n            #to>\n            <span class=\"owl-dt-control-content owl-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"owl-dt-container-info-label\">{{toLabel}}:</span>\n                <span class=\"owl-dt-container-info-value\">{{toFormattedValue}}</span>\n            </span>\n        </div>\n    </div>\n\n    <div *ngIf=\"showControlButtons\"\n        class=\"owl-dt-container-buttons owl-dt-container-row\">\n        <button class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onCancelClicked($event)\">\n            <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{cancelLabel}}\n            </span>\n        </button>\n        <button class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onSetClicked($event)\">\n            <span class=\"owl-dt-control-content owl-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{setLabel}}\n            </span>\n        </button>\n    </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: OwlDateTimeIntl }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { calendar: [{
+            args: [{ selector: 'nxt-date-time-container', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, animations: [
+                        dateTimePickerAnimations.transformPicker,
+                        dateTimePickerAnimations.fadeInPicker
+                    ], template: "<div [cdkTrapFocus]=\"picker?.pickerMode !== 'inline'\"\n    [@fadeInPicker]=\"picker?.pickerMode === 'inline'? '' : 'enter'\"\n    class=\"nxt-dt-container-inner\">\n\n    <nxt-date-time-calendar *ngIf=\"pickerType === 'both' || pickerType === 'calendar'\"\n        class=\"nxt-dt-container-row\"\n        [firstDayOfWeek]=\"picker?.firstDayOfWeek ?? 0\"\n        [(pickerMoment)]=\"pickerMoment\"\n        [selected]=\"picker?.selected\"\n        [selecteds]=\"picker?.selecteds ?? []\"\n        [selectMode]=\"picker?.selectMode\"\n        [min]=\"picker?.min\"\n        [max]=\"picker?.max\"\n        [dateFilter]=\"picker?.dateTimeFilter\"\n        [startView]=\"picker?.startView ?? 'month'\"\n        [hideOtherMonths]=\"!!picker?.hideOtherMonths\"\n        (yearSelected)=\"picker?.selectYear($event)\"\n        (monthSelected)=\"picker?.selectMonth($event)\"\n        (selectedChange)=\"dateSelected($event)\"></nxt-date-time-calendar>\n\n    <nxt-date-time-timer *ngIf=\"pickerType === 'both' || pickerType === 'timer'\"\n        class=\"nxt-dt-container-row\"\n        [pickerMoment]=\"pickerMoment\"\n        [min]=\"picker?.min\"\n        [max]=\"picker?.max\"\n        [showSecondsTimer]=\"!!picker?.showSecondsTimer\"\n        [hour12Timer]=\"!!picker?.hour12Timer\"\n        [stepHour]=\"picker?.stepHour ?? 1\"\n        [stepMinute]=\"picker?.stepMinute ?? 1\"\n        [stepSecond]=\"picker?.stepSecond ?? 1\"\n        (selectedChange)=\"timeSelected($event)\"></nxt-date-time-timer>\n\n    <div *ngIf=\"picker?.isInRangeMode\"\n        role=\"radiogroup\"\n        class=\"nxt-dt-container-info nxt-dt-container-row\">\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 0 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 0\"\n            class=\"nxt-dt-control nxt-dt-container-range nxt-dt-container-from\"\n            [ngClass]=\"{'nxt-dt-container-info-active': activeSelectedIndex === 0}\"\n            (click)=\"handleClickOnInfoGroup($event, 0)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, to, 0)\"\n            #from>\n            <span class=\"nxt-dt-control-content nxt-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"nxt-dt-container-info-label\">{{fromLabel}}:</span>\n                <span class=\"nxt-dt-container-info-value\">{{fromFormattedValue}}</span>\n            </span>\n        </div>\n        <div role=\"radio\"\n            [tabindex]=\"activeSelectedIndex === 1 ? 0 : -1\"\n            [attr.aria-checked]=\"activeSelectedIndex === 1\"\n            class=\"nxt-dt-control nxt-dt-container-range nxt-dt-container-to\"\n            [ngClass]=\"{'nxt-dt-container-info-active': activeSelectedIndex === 1}\"\n            (click)=\"handleClickOnInfoGroup($event, 1)\"\n            (keydown)=\"handleKeydownOnInfoGroup($event, from, 1)\"\n            #to>\n            <span class=\"nxt-dt-control-content nxt-dt-container-range-content\"\n                tabindex=\"-1\">\n                <span class=\"nxt-dt-container-info-label\">{{toLabel}}:</span>\n                <span class=\"nxt-dt-container-info-value\">{{toFormattedValue}}</span>\n            </span>\n        </div>\n    </div>\n\n    <div *ngIf=\"showControlButtons\"\n        class=\"nxt-dt-container-buttons nxt-dt-container-row\">\n        <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onCancelClicked($event)\">\n            <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{cancelLabel}}\n            </span>\n        </button>\n        <button class=\"nxt-dt-control nxt-dt-control-button nxt-dt-container-control-button\"\n            type=\"button\"\n            tabindex=\"0\"\n            (click)=\"onSetClicked($event)\">\n            <span class=\"nxt-dt-control-content nxt-dt-control-button-content\"\n                tabindex=\"-1\">\n                {{setLabel}}\n            </span>\n        </button>\n    </div>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: DateTimeIntl }, { type: DateTimeAdapter }]; }, propDecorators: { calendar: [{
                 type: ViewChild,
-                args: [OwlCalendarComponent]
+                args: [CalendarComponent]
             }], timer: [{
                 type: ViewChild,
-                args: [OwlTimerComponent]
-            }], owlDTContainerClass: [{
+                args: [TimerComponent]
+            }], containerClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-container']
-            }], owlDTPopupContainerClass: [{
+                args: ['class.nxt-dt-container']
+            }], popupContainerClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-popup-container']
-            }], owlDTDialogContainerClass: [{
+                args: ['class.nxt-dt-popup-container']
+            }], dialogContainerClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-dialog-container']
-            }], owlDTInlineContainerClass: [{
+                args: ['class.nxt-dt-dialog-container']
+            }], inlineContainerClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-inline-container']
-            }], owlDTContainerDisabledClass: [{
+                args: ['class.nxt-dt-inline-container']
+            }], containerDisabledClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-container-disabled']
-            }], owlDTContainerId: [{
+                args: ['class.nxt-dt-container-disabled']
+            }], containerId: [{
                 type: HostBinding,
                 args: ['attr.id']
-            }], owlDTContainerAnimation: [{
+            }], containerAnimation: [{
                 type: HostBinding,
                 args: ['@transformPicker']
             }], handleContainerAnimationDone: [{
@@ -2740,41 +2697,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 args: ['@transformPicker.done', ['$event']]
             }] } });
 
-const OWL_DATETIME_VALUE_ACCESSOR$1 = {
+const NXT_DATETIME_VALUE_ACCESSOR$1 = {
     provide: NG_VALUE_ACCESSOR,
-    useExisting: forwardRef(() => OwlDateTimeInlineComponent),
+    useExisting: forwardRef(() => DateTimeInlineComponent),
     multi: true
 };
-class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
-    constructor(changeDetector, dateTimeAdapter, dateTimeFormats) {
-        super(dateTimeAdapter, dateTimeFormats);
-        this.changeDetector = changeDetector;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        /**
-         * Set the type of the dateTime picker
-         *      'both' -- show both calendar and timer
-         *      'calendar' -- show only calendar
-         *      'timer' -- show only timer
-         */
-        this._pickerType = 'both';
-        this._disabled = false;
-        this._selectMode = 'single';
-        this._values = [];
-        /**
-         * Emits selected year in multi-year view
-         * This doesn't imply a change on the selected date.
-         * */
-        this.yearSelected = new EventEmitter();
-        /**
-         * Emits selected month in year view
-         * This doesn't imply a change on the selected date.
-         * */
-        this.monthSelected = new EventEmitter();
-        this._selecteds = [];
-        this.onModelChange = () => { };
-        this.onModelTouched = () => { };
-    }
+class DateTimeInlineComponent extends DateTimeDirective {
     get pickerType() {
         return this._pickerType;
     }
@@ -2797,7 +2725,7 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
             mode !== 'range' &&
             mode !== 'rangeFrom' &&
             mode !== 'rangeTo') {
-            throw Error('OwlDateTime Error: invalid selectMode value!');
+            throw Error('DateTime Error: invalid selectMode value!');
         }
         this._selectMode = mode;
     }
@@ -2806,17 +2734,17 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
             return this._startAt;
         }
         if (this.selectMode === 'single') {
-            return this.value || null;
+            return this.value;
         }
         else if (this.selectMode === 'range' ||
             this.selectMode === 'rangeFrom') {
-            return this.values[0] || null;
+            return this.values?.[0];
         }
         else if (this.selectMode === 'rangeTo') {
-            return this.values[1] || null;
+            return this.values?.[1];
         }
         else {
-            return null;
+            return;
         }
     }
     set startAt(date) {
@@ -2828,19 +2756,17 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
     set dateTimeFilter(filter) {
         this._dateTimeFilter = filter;
     }
-    get minDateTime() {
-        return this._min || null;
+    get min() {
+        return this._min;
     }
-    // eslint-disable-next-line @angular-eslint/no-input-rename
-    set minDateTime(value) {
+    set min(value) {
         this._min = this.getValidDate(this.dateTimeAdapter.deserialize(value));
         this.changeDetector.markForCheck();
     }
-    get maxDateTime() {
-        return this._max || null;
+    get max() {
+        return this._max;
     }
-    // eslint-disable-next-line @angular-eslint/no-input-rename
-    set maxDateTime(value) {
+    set max(value) {
         this._max = this.getValidDate(this.dateTimeAdapter.deserialize(value));
         this.changeDetector.markForCheck();
     }
@@ -2861,7 +2787,7 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
             values = values.map(v => {
                 v = this.dateTimeAdapter.deserialize(v);
                 v = this.getValidDate(v);
-                return v ? this.dateTimeAdapter.clone(v) : null;
+                return (v && this.dateTimeAdapter.clone(v));
             });
             this._values = [...values];
             this.selecteds = [...values];
@@ -2899,20 +2825,48 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
             this._selectMode === 'rangeFrom' ||
             this._selectMode === 'rangeTo');
     }
-    get owlDTInlineClass() {
+    get inlineClass() {
         return true;
     }
+    constructor(changeDetector, dateTimeAdapter, dateTimeFormats) {
+        super(dateTimeAdapter, dateTimeFormats);
+        this.changeDetector = changeDetector;
+        /**
+         * Set the type of the dateTime picker
+         *      'both' -- show both calendar and timer
+         *      'calendar' -- show only calendar
+         *      'timer' -- show only timer
+         */
+        this._pickerType = 'both';
+        this._disabled = false;
+        this._selectMode = 'single';
+        /**
+         * Emits selected year in multi-year view
+         * This doesn't imply a change on the selected date.
+         * */
+        this.yearSelected = new EventEmitter();
+        /**
+         * Emits selected month in year view
+         * This doesn't imply a change on the selected date.
+         * */
+        this.monthSelected = new EventEmitter();
+        this._selecteds = new Array();
+    }
     ngOnInit() {
-        this.container.picker = this;
+        if (this.container)
+            this.container.picker = this;
     }
     writeValue(value) {
+        value = value ?? undefined;
         if (this.isInSingleMode) {
             this.value = value;
-            this.container.pickerMoment = value;
+            if (this.container)
+                this.container.pickerMoment = value;
         }
         else {
             this.values = value;
-            this.container.pickerMoment = this._values[this.container.activeSelectedIndex];
+            if (this.container)
+                this.container.pickerMoment = this._values?.[this.container.activeSelectedIndex];
         }
     }
     registerOnChange(fn) {
@@ -2934,8 +2888,8 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
         else {
             this.value = date;
         }
-        this.onModelChange(date);
-        this.onModelTouched();
+        this.onModelChange?.(date);
+        this.onModelTouched?.();
     }
     /**
      * Emits the selected year in multi-year view
@@ -2950,21 +2904,17 @@ class OwlDateTimeInlineComponent extends OwlDateTimeDirective {
         this.monthSelected.emit(normalizedMonth);
     }
 }
-OwlDateTimeInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeInlineComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlDateTimeInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlDateTimeInlineComponent, selector: "owl-date-time-inline", inputs: { pickerType: "pickerType", disabled: "disabled", selectMode: "selectMode", startAt: "startAt", dateTimeFilter: ["owlDateTimeFilter", "dateTimeFilter"], minDateTime: ["min", "minDateTime"], maxDateTime: ["max", "maxDateTime"], value: "value", values: "values" }, outputs: { yearSelected: "yearSelected", monthSelected: "monthSelected" }, host: { properties: { "class.owl-dt-inline": "this.owlDTInlineClass" } }, providers: [OWL_DATETIME_VALUE_ACCESSOR$1], viewQueries: [{ propertyName: "container", first: true, predicate: OwlDateTimeContainerComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<owl-date-time-container></owl-date-time-container>\n", styles: [""], dependencies: [{ kind: "component", type: OwlDateTimeContainerComponent, selector: "owl-date-time-container", exportAs: ["owlDateTimeContainer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeInlineComponent, decorators: [{
+DateTimeInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeInlineComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter }, { token: NXT_DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
+DateTimeInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: DateTimeInlineComponent, selector: "nxt-date-time-inline", inputs: { pickerType: "pickerType", disabled: "disabled", selectMode: "selectMode", startAt: "startAt", dateTimeFilter: "dateTimeFilter", min: "min", max: "max", value: "value", values: "values" }, outputs: { yearSelected: "yearSelected", monthSelected: "monthSelected" }, host: { properties: { "class.nxt-dt-inline": "this.inlineClass" } }, providers: [NXT_DATETIME_VALUE_ACCESSOR$1], viewQueries: [{ propertyName: "container", first: true, predicate: DateTimeContainerComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<nxt-date-time-container></nxt-date-time-container>\n", styles: [""], dependencies: [{ kind: "component", type: DateTimeContainerComponent, selector: "nxt-date-time-container" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeInlineComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-date-time-inline', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, providers: [OWL_DATETIME_VALUE_ACCESSOR$1], template: "<owl-date-time-container></owl-date-time-container>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
+            args: [{ selector: 'nxt-date-time-inline', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, providers: [NXT_DATETIME_VALUE_ACCESSOR$1], template: "<nxt-date-time-container></nxt-date-time-container>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
+                    args: [NXT_DATE_TIME_FORMATS]
                 }] }]; }, propDecorators: { container: [{
                 type: ViewChild,
-                args: [OwlDateTimeContainerComponent, { static: true }]
+                args: [DateTimeContainerComponent, { static: true }]
             }], pickerType: [{
                 type: Input
             }], disabled: [{
@@ -2974,14 +2924,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
             }], startAt: [{
                 type: Input
             }], dateTimeFilter: [{
-                type: Input,
-                args: ['owlDateTimeFilter']
-            }], minDateTime: [{
-                type: Input,
-                args: ['min']
-            }], maxDateTime: [{
-                type: Input,
-                args: ['max']
+                type: Input
+            }], min: [{
+                type: Input
+            }], max: [{
+                type: Input
             }], value: [{
                 type: Input
             }], values: [{
@@ -2990,175 +2937,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], monthSelected: [{
                 type: Output
-            }], owlDTInlineClass: [{
+            }], inlineClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-inline']
+                args: ['class.nxt-dt-inline']
             }] } });
 
-const OWL_DATETIME_VALUE_ACCESSOR = {
+const NXT_DATETIME_VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
-    useExisting: forwardRef(() => OwlDateTimeInputDirective),
+    useExisting: forwardRef(() => DateTimeInputDirective),
     multi: true
 };
-const OWL_DATETIME_VALIDATORS = {
+const NXT_DATETIME_VALIDATORS = {
     provide: NG_VALIDATORS,
-    useExisting: forwardRef(() => OwlDateTimeInputDirective),
+    useExisting: forwardRef(() => DateTimeInputDirective),
     multi: true
 };
-class OwlDateTimeInputDirective {
-    constructor(elmRef, renderer, dateTimeAdapter, dateTimeFormats) {
-        this.elmRef = elmRef;
-        this.renderer = renderer;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        /**
-         * The picker's select mode
-         */
-        this._selectMode = 'single';
-        /**
-         * The character to separate the 'from' and 'to' in input value
-         */
-        this.rangeSeparator = '~';
-        this._values = [];
-        /**
-         * Callback to invoke when `change` event is fired on this `<input>`
-         * */
-        this.dateTimeChange = new EventEmitter();
-        /**
-         * Callback to invoke when an `input` event is fired on this `<input>`.
-         * */
-        this.dateTimeInput = new EventEmitter();
-        this.dtPickerSub = Subscription.EMPTY;
-        this.localeSub = Subscription.EMPTY;
-        this.lastValueValid = true;
-        this.onModelChange = () => { };
-        this.onModelTouched = () => { };
-        this.validatorOnChange = () => { };
-        /** The form control validator for whether the input parses. */
-        this.parseValidator = () => this.lastValueValid
-            ? null
-            : { owlDateTimeParse: { text: this.elmRef.nativeElement.value } };
-        /** The form control validator for the min date. */
-        this.minValidator = (control) => {
-            if (this.isInSingleMode) {
-                const controlValue = this.getValidDate(this.dateTimeAdapter.deserialize(control.value));
-                return !this.min ||
-                    !controlValue ||
-                    this.dateTimeAdapter.compare(this.min, controlValue) <= 0
-                    ? null
-                    : { owlDateTimeMin: { min: this.min, actual: controlValue } };
-            }
-            else if (this.isInRangeMode && control.value) {
-                const controlValueFrom = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[0]));
-                const controlValueTo = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[1]));
-                return !this.min ||
-                    !controlValueFrom ||
-                    !controlValueTo ||
-                    this.dateTimeAdapter.compare(this.min, controlValueFrom) <= 0
-                    ? null
-                    : {
-                        owlDateTimeMin: {
-                            min: this.min,
-                            actual: [controlValueFrom, controlValueTo]
-                        }
-                    };
-            }
-        };
-        /** The form control validator for the max date. */
-        this.maxValidator = (control) => {
-            if (this.isInSingleMode) {
-                const controlValue = this.getValidDate(this.dateTimeAdapter.deserialize(control.value));
-                return !this.max ||
-                    !controlValue ||
-                    this.dateTimeAdapter.compare(this.max, controlValue) >= 0
-                    ? null
-                    : { owlDateTimeMax: { max: this.max, actual: controlValue } };
-            }
-            else if (this.isInRangeMode && control.value) {
-                const controlValueFrom = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[0]));
-                const controlValueTo = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[1]));
-                return !this.max ||
-                    !controlValueFrom ||
-                    !controlValueTo ||
-                    this.dateTimeAdapter.compare(this.max, controlValueTo) >= 0
-                    ? null
-                    : {
-                        owlDateTimeMax: {
-                            max: this.max,
-                            actual: [controlValueFrom, controlValueTo]
-                        }
-                    };
-            }
-        };
-        /** The form control validator for the date filter. */
-        this.filterValidator = (control) => {
-            const controlValue = this.getValidDate(this.dateTimeAdapter.deserialize(control.value));
-            return !this._dateTimeFilter ||
-                !controlValue ||
-                this._dateTimeFilter(controlValue)
-                ? null
-                : { owlDateTimeFilter: true };
-        };
-        /**
-         * The form control validator for the range.
-         * Check whether the 'before' value is before the 'to' value
-         * */
-        this.rangeValidator = (control) => {
-            if (this.isInSingleMode || !control.value) {
-                return null;
-            }
-            const controlValueFrom = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[0]));
-            const controlValueTo = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[1]));
-            return !controlValueFrom ||
-                !controlValueTo ||
-                this.dateTimeAdapter.compare(controlValueFrom, controlValueTo) <= 0
-                ? null
-                : { owlDateTimeRange: true };
-        };
-        /** The combined form control validator for this input. */
-        this.validator = Validators.compose([
-            this.parseValidator,
-            this.minValidator,
-            this.maxValidator,
-            this.filterValidator,
-            this.rangeValidator
-        ]);
-        /** Emits when the value changes (either due to user input or programmatic change). */
-        this.valueChange = new EventEmitter();
-        /** Emits when the disabled state has changed */
-        this.disabledChange = new EventEmitter();
-        if (!this.dateTimeAdapter) {
-            throw Error('OwlDateTimePicker: No provider found for DateTimePicker. You must import one of the following ' +
-                'modules at your application root: OwlNativeDateTimeModule, OwlMomentDateTimeModule, or provide a ' +
-                'custom implementation.');
-        }
-        if (!this.dateTimeFormats) {
-            throw Error('OwlDateTimePicker: No provider found for OWL_DATE_TIME_FORMATS. You must import one of the following ' +
-                'modules at your application root: OwlNativeDateTimeModule, OwlMomentDateTimeModule, or provide a ' +
-                'custom implementation.');
-        }
-        this.localeSub = this.dateTimeAdapter.localeChanges.subscribe(() => {
-            this.value = this.value;
-        });
-    }
+class DateTimeInputDirective {
     /**
      * The date time picker that this input is associated with.
      * */
-    set owlDateTime(value) {
+    set dateTime(value) {
         this.registerDateTimePicker(value);
     }
     /**
      * A function to filter date time
      */
-    set owlDateTimeFilter(filter) {
+    set dateTimeFilter(filter) {
         this._dateTimeFilter = filter;
-        this.validatorOnChange();
+        this.validatorOnChange?.();
     }
     get dateTimeFilter() {
         return this._dateTimeFilter;
     }
     get disabled() {
-        return !!this._disabled;
+        return this._disabled;
     }
     set disabled(value) {
         const newValue = coerceBooleanProperty(value);
@@ -3167,12 +2979,8 @@ class OwlDateTimeInputDirective {
             this._disabled = newValue;
             this.disabledChange.emit(newValue);
         }
-        // We need to null check the `blur` method, because it's undefined during SSR.
-        if (newValue && element.blur) {
-            // Normally, native input elements automatically blur if they turn disabled. This behavior
-            // is problematic, because it would mean that it triggers another change detection cycle,
-            // which then causes a changed after checked error if the input element was focused before.
-            element.blur();
+        if (newValue) {
+            element.blur?.();
         }
     }
     get min() {
@@ -3180,14 +2988,14 @@ class OwlDateTimeInputDirective {
     }
     set min(value) {
         this._min = this.getValidDate(this.dateTimeAdapter.deserialize(value));
-        this.validatorOnChange();
+        this.validatorOnChange?.();
     }
     get max() {
         return this._max;
     }
     set max(value) {
         this._max = this.getValidDate(this.dateTimeAdapter.deserialize(value));
-        this.validatorOnChange();
+        this.validatorOnChange?.();
     }
     get selectMode() {
         return this._selectMode;
@@ -3197,7 +3005,7 @@ class OwlDateTimeInputDirective {
             mode !== 'range' &&
             mode !== 'rangeFrom' &&
             mode !== 'rangeTo') {
-            throw Error('OwlDateTime Error: invalid selectMode value!');
+            throw Error('DateTime Error: invalid selectMode value!');
         }
         this._selectMode = mode;
     }
@@ -3206,7 +3014,7 @@ class OwlDateTimeInputDirective {
     }
     set value(value) {
         value = this.dateTimeAdapter.deserialize(value);
-        this.lastValueValid = !value || this.dateTimeAdapter.isValid(value);
+        this.lastValueValid = !value || !!this.dateTimeAdapter.isValid(value);
         value = this.getValidDate(value);
         const oldDate = this._value;
         this._value = value;
@@ -3251,36 +3059,160 @@ class OwlDateTimeInputDirective {
             this._selectMode === 'rangeFrom' ||
             this._selectMode === 'rangeTo');
     }
-    get owlDateTimeInputAriaHaspopup() {
+    get inputAriaHaspopup() {
         return true;
     }
-    get owlDateTimeInputAriaOwns() {
-        return (this.dtPicker.opened && this.dtPicker.id) || null;
+    get inputAriaOwns() {
+        return (this.dtPicker?.opened && this.dtPicker.id) || undefined;
     }
     get minIso8601() {
-        return this.min ? this.dateTimeAdapter.toIso8601(this.min) : null;
+        return this.min ? this.dateTimeAdapter.toIso8601(this.min) : undefined;
     }
     get maxIso8601() {
-        return this.max ? this.dateTimeAdapter.toIso8601(this.max) : null;
+        return this.max ? this.dateTimeAdapter.toIso8601(this.max) : undefined;
     }
-    get owlDateTimeInputDisabled() {
+    get inputDisabled() {
         return this.disabled;
     }
+    constructor(elmRef, renderer, dateTimeAdapter, dateTimeFormats) {
+        this.elmRef = elmRef;
+        this.renderer = renderer;
+        this.dateTimeAdapter = dateTimeAdapter;
+        this.dateTimeFormats = dateTimeFormats;
+        /** Whether the date time picker's input is disabled. */
+        this._disabled = false;
+        /**
+         * The picker's select mode
+         */
+        this._selectMode = 'single';
+        /**
+         * The character to separate the 'from' and 'to' in input value
+         */
+        this.rangeSeparator = '~';
+        this._values = [];
+        /**
+         * Callback to invoke when `change` event is fired on this `<input>`
+         * */
+        this.dateTimeChange = new EventEmitter();
+        /**
+         * Callback to invoke when an `input` event is fired on this `<input>`.
+         * */
+        this.dateTimeInput = new EventEmitter();
+        this.lastValueValid = true;
+        /** The form control validator for whether the input parses. */
+        this.parseValidator = () => this.lastValueValid
+            ? null
+            : { dateTimeParse: { text: this.elmRef.nativeElement.value } };
+        /** The form control validator for the min date. */
+        this.minValidator = (control) => {
+            if (this.isInSingleMode) {
+                const controlValue = this.getValidDate(this.dateTimeAdapter.deserialize(control.value));
+                return !this.min ||
+                    !controlValue ||
+                    this.dateTimeAdapter.compare(this.min, controlValue) <= 0
+                    ? null
+                    : { dateTimeMin: { min: this.min, actual: controlValue } };
+            }
+            else if (this.isInRangeMode && control.value) {
+                const controlValueFrom = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[0]));
+                const controlValueTo = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[1]));
+                return !this.min ||
+                    !controlValueFrom ||
+                    !controlValueTo ||
+                    this.dateTimeAdapter.compare(this.min, controlValueFrom) <= 0
+                    ? null
+                    : {
+                        dateTimeMin: {
+                            min: this.min,
+                            actual: [controlValueFrom, controlValueTo]
+                        }
+                    };
+            }
+            return null;
+        };
+        /** The form control validator for the max date. */
+        this.maxValidator = (control) => {
+            if (this.isInSingleMode) {
+                const controlValue = this.getValidDate(this.dateTimeAdapter.deserialize(control.value));
+                return !this.max ||
+                    !controlValue ||
+                    this.dateTimeAdapter.compare(this.max, controlValue) >= 0
+                    ? null
+                    : { dateTimeMax: { max: this.max, actual: controlValue } };
+            }
+            else if (this.isInRangeMode && control.value) {
+                const controlValueFrom = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[0]));
+                const controlValueTo = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[1]));
+                return !this.max ||
+                    !controlValueFrom ||
+                    !controlValueTo ||
+                    this.dateTimeAdapter.compare(this.max, controlValueTo) >= 0
+                    ? null
+                    : {
+                        dateTimeMax: {
+                            max: this.max,
+                            actual: [controlValueFrom, controlValueTo]
+                        }
+                    };
+            }
+            return null;
+        };
+        /** The form control validator for the date filter. */
+        this.filterValidator = (control) => {
+            const controlValue = this.getValidDate(this.dateTimeAdapter.deserialize(control.value));
+            return !this._dateTimeFilter ||
+                !controlValue ||
+                this._dateTimeFilter(controlValue)
+                ? null
+                : { dateTimeFilter: true };
+        };
+        /**
+         * The form control validator for the range.
+         * Check whether the 'before' value is before the 'to' value
+         * */
+        this.rangeValidator = (control) => {
+            if (this.isInSingleMode || !control.value) {
+                return null;
+            }
+            const controlValueFrom = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[0]));
+            const controlValueTo = this.getValidDate(this.dateTimeAdapter.deserialize(control.value[1]));
+            return !controlValueFrom ||
+                !controlValueTo ||
+                this.dateTimeAdapter.compare(controlValueFrom, controlValueTo) <= 0
+                ? null
+                : { dateTimeRange: true };
+        };
+        /** The combined form control validator for this input. */
+        this.validator = Validators.compose([
+            this.parseValidator,
+            this.minValidator,
+            this.maxValidator,
+            this.filterValidator,
+            this.rangeValidator
+        ]);
+        /** Emits when the value changes (either due to user input or programmatic change). */
+        this.valueChange = new EventEmitter();
+        /** Emits when the disabled state has changed */
+        this.disabledChange = new EventEmitter();
+        this.localeSub = this.dateTimeAdapter.localeChanges.subscribe(() => {
+            this.value = this.value;
+        });
+    }
     ngOnInit() {
         if (!this.dtPicker) {
-            throw Error('OwlDateTimePicker: the picker input doesn\'t have any associated owl-date-time component');
+            throw Error('DateTimePicker: the picker input doesn\'t have any associated nxt-date-time component');
         }
     }
     ngAfterContentInit() {
-        this.dtPickerSub = this.dtPicker.confirmSelectedChange.subscribe((selecteds) => {
+        this.dtPickerSub = this.dtPicker?.confirmSelectedChange.subscribe((selecteds) => {
             if (Array.isArray(selecteds)) {
                 this.values = selecteds;
             }
             else {
                 this.value = selecteds;
             }
-            this.onModelChange(selecteds);
-            this.onModelTouched();
+            this.onModelChange?.(selecteds);
+            this.onModelTouched?.();
             this.dateTimeChange.emit({
                 source: this,
                 value: selecteds,
@@ -3294,12 +3226,15 @@ class OwlDateTimeInputDirective {
         });
     }
     ngOnDestroy() {
-        this.dtPickerSub.unsubscribe();
-        this.localeSub.unsubscribe();
+        this.dtPickerSub?.unsubscribe();
+        this.dtPickerSub = undefined;
+        this.localeSub?.unsubscribe();
+        this.localeSub = undefined;
         this.valueChange.complete();
         this.disabledChange.complete();
     }
     writeValue(value) {
+        value = value ?? undefined;
         if (this.isInSingleMode) {
             this.value = value;
         }
@@ -3327,12 +3262,12 @@ class OwlDateTimeInputDirective {
      * */
     handleKeydownOnHost(event) {
         if (event.altKey && event.keyCode === DOWN_ARROW) {
-            this.dtPicker.open();
+            this.dtPicker?.open();
             event.preventDefault();
         }
     }
     handleBlurOnHost(_event) {
-        this.onModelTouched();
+        this.onModelTouched?.();
     }
     handleInputOnHost(event) {
         const value = event.target.value;
@@ -3366,7 +3301,7 @@ class OwlDateTimeInputDirective {
     formatNativeInputValue() {
         if (this.isInSingleMode) {
             this.renderer.setProperty(this.elmRef.nativeElement, 'value', this._value
-                ? this.dateTimeAdapter.format(this._value, this.dtPicker.formatString)
+                ? this.dateTimeAdapter.format(this._value, this.dtPicker?.formatString)
                 : '');
         }
         else if (this.isInRangeMode) {
@@ -3374,13 +3309,13 @@ class OwlDateTimeInputDirective {
                 const from = this._values[0];
                 const to = this._values[1];
                 const fromFormatted = from
-                    ? this.dateTimeAdapter.format(from, this.dtPicker.formatString)
+                    ? this.dateTimeAdapter.format(from, this.dtPicker?.formatString)
                     : '';
                 const toFormatted = to
-                    ? this.dateTimeAdapter.format(to, this.dtPicker.formatString)
+                    ? this.dateTimeAdapter.format(to, this.dtPicker?.formatString)
                     : '';
                 if (!fromFormatted && !toFormatted) {
-                    this.renderer.setProperty(this.elmRef.nativeElement, 'value', null);
+                    this.renderer.setProperty(this.elmRef.nativeElement, 'value', undefined);
                 }
                 else {
                     if (this._selectMode === 'range') {
@@ -3420,7 +3355,7 @@ class OwlDateTimeInputDirective {
         return this.dateTimeAdapter.isDateInstance(obj) &&
             this.dateTimeAdapter.isValid(obj)
             ? obj
-            : null;
+            : undefined;
     }
     /**
      * Convert a time string to a date-time string
@@ -3434,27 +3369,25 @@ class OwlDateTimeInputDirective {
             const dateString = this.dateTimeAdapter.format(v, this.dateTimeFormats.datePickerInput);
             return dateString + ' ' + timeString;
         }
-        else {
-            return null;
-        }
+        return undefined;
     }
     /**
      * Handle input change in single mode
      */
     changeInputInSingleMode(inputValue) {
         let value = inputValue;
-        if (this.dtPicker.pickerType === 'timer') {
+        if (this.dtPicker?.pickerType === 'timer') {
             value = this.convertTimeStringToDateTimeString(value, this.value);
         }
         let result = this.dateTimeAdapter.parse(value, this.dateTimeFormats.parseInput);
         this.lastValueValid = !result || this.dateTimeAdapter.isValid(result);
         result = this.getValidDate(result);
         // if the newValue is the same as the oldValue, we intend to not fire the valueChange event
-        // result equals to null means there is input event, but the input value is invalid
-        if (!this.isSameValue(result, this._value) || result === null) {
+        // result equals to undefined means there is input event, but the input value is invalid
+        if (!this.isSameValue(result, this._value) || result === undefined) {
             this._value = result;
             this.valueChange.emit(result);
-            this.onModelChange(result);
+            this.onModelChange?.(result);
             this.dateTimeInput.emit({
                 source: this,
                 value: result,
@@ -3469,7 +3402,7 @@ class OwlDateTimeInputDirective {
         const originalValue = this._selectMode === 'rangeFrom'
             ? this._values[0]
             : this._values[1];
-        if (this.dtPicker.pickerType === 'timer') {
+        if (this.dtPicker?.pickerType === 'timer') {
             inputValue = this.convertTimeStringToDateTimeString(inputValue, originalValue);
         }
         let result = this.dateTimeAdapter.parse(inputValue, this.dateTimeFormats.parseInput);
@@ -3489,7 +3422,7 @@ class OwlDateTimeInputDirective {
                 ? [result, this._values[1]]
                 : [this._values[0], result];
         this.valueChange.emit(this._values);
-        this.onModelChange(this._values);
+        this.onModelChange?.(this._values);
         this.dateTimeInput.emit({
             source: this,
             value: this._values,
@@ -3503,7 +3436,7 @@ class OwlDateTimeInputDirective {
         const selecteds = inputValue.split(this.rangeSeparator);
         let fromString = selecteds[0];
         let toString = selecteds[1];
-        if (this.dtPicker.pickerType === 'timer') {
+        if (this.dtPicker?.pickerType === 'timer') {
             fromString = this.convertTimeStringToDateTimeString(fromString, this.values[0]);
             toString = this.convertTimeStringToDateTimeString(toString, this.values[1]);
         }
@@ -3517,10 +3450,10 @@ class OwlDateTimeInputDirective {
         // if the newValue is the same as the oldValue, we intend to not fire the valueChange event
         if (!this.isSameValue(from, this._values[0]) ||
             !this.isSameValue(to, this._values[1]) ||
-            (from === null && to === null)) {
+            (!from && !to)) {
             this._values = [from, to];
             this.valueChange.emit(this._values);
-            this.onModelChange(this._values);
+            this.onModelChange?.(this._values);
             this.dateTimeInput.emit({
                 source: this,
                 value: this._values,
@@ -3538,31 +3471,28 @@ class OwlDateTimeInputDirective {
         return first == second;
     }
 }
-OwlDateTimeInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeInputDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-OwlDateTimeInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: { owlDateTime: "owlDateTime", owlDateTimeFilter: "owlDateTimeFilter", _disabled: "_disabled", min: "min", max: "max", selectMode: "selectMode", rangeSeparator: "rangeSeparator", value: "value", values: "values" }, outputs: { dateTimeChange: "dateTimeChange", dateTimeInput: "dateTimeInput" }, host: { listeners: { "keydown": "handleKeydownOnHost($event)", "blur": "handleBlurOnHost($event)", "input": "handleInputOnHost($event)", "change": "handleChangeOnHost($event)" }, properties: { "attr.aria-haspopup": "this.owlDateTimeInputAriaHaspopup", "attr.aria-owns": "this.owlDateTimeInputAriaOwns", "attr.min": "this.minIso8601", "attr.max": "this.maxIso8601", "disabled": "this.owlDateTimeInputDisabled" } }, providers: [
-        OWL_DATETIME_VALUE_ACCESSOR,
-        OWL_DATETIME_VALIDATORS
-    ], exportAs: ["owlDateTimeInput"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeInputDirective, decorators: [{
+DateTimeInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeInputDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DateTimeAdapter }, { token: NXT_DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Directive });
+DateTimeInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: DateTimeInputDirective, selector: "input[nxtDateTime]", inputs: { dateTime: ["nxtDateTime", "dateTime"], dateTimeFilter: "dateTimeFilter", _disabled: "_disabled", min: "min", max: "max", selectMode: "selectMode", rangeSeparator: "rangeSeparator", value: "value", values: "values" }, outputs: { dateTimeChange: "dateTimeChange", dateTimeInput: "dateTimeInput" }, host: { listeners: { "keydown": "handleKeydownOnHost($event)", "blur": "handleBlurOnHost($event)", "input": "handleInputOnHost($event)", "change": "handleChangeOnHost($event)" }, properties: { "attr.aria-haspopup": "this.inputAriaHaspopup", "attr.aria-owns": "this.inputAriaOwns", "attr.min": "this.minIso8601", "attr.max": "this.maxIso8601", "disabled": "this.inputDisabled" } }, providers: [
+        NXT_DATETIME_VALUE_ACCESSOR,
+        NXT_DATETIME_VALIDATORS
+    ], exportAs: ["nxtDateTimeInput"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeInputDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: 'input[owlDateTime]',
-                    exportAs: 'owlDateTimeInput',
+                    selector: 'input[nxtDateTime]',
+                    exportAs: 'nxtDateTimeInput',
                     providers: [
-                        OWL_DATETIME_VALUE_ACCESSOR,
-                        OWL_DATETIME_VALIDATORS
+                        NXT_DATETIME_VALUE_ACCESSOR,
+                        NXT_DATETIME_VALIDATORS
                     ]
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
-                }] }]; }, propDecorators: { owlDateTime: [{
-                type: Input
-            }], owlDateTimeFilter: [{
+                    args: [NXT_DATE_TIME_FORMATS]
+                }] }]; }, propDecorators: { dateTime: [{
+                type: Input,
+                args: ['nxtDateTime']
+            }], dateTimeFilter: [{
                 type: Input
             }], _disabled: [{
                 type: Input
@@ -3582,10 +3512,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }], dateTimeInput: [{
                 type: Output
-            }], owlDateTimeInputAriaHaspopup: [{
+            }], inputAriaHaspopup: [{
                 type: HostBinding,
                 args: ['attr.aria-haspopup']
-            }], owlDateTimeInputAriaOwns: [{
+            }], inputAriaOwns: [{
                 type: HostBinding,
                 args: ['attr.aria-owns']
             }], minIso8601: [{
@@ -3594,7 +3524,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
             }], maxIso8601: [{
                 type: HostBinding,
                 args: ['attr.max']
-            }], owlDateTimeInputDisabled: [{
+            }], inputDisabled: [{
                 type: HostBinding,
                 args: ['disabled']
             }], handleKeydownOnHost: [{
@@ -3611,24 +3541,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 args: ['change', ['$event']]
             }] } });
 
-class OwlDateTimeTriggerDirective {
-    constructor(changeDetector) {
-        this.changeDetector = changeDetector;
-        this.stateChanges = Subscription.EMPTY;
-    }
+class DateTimeTriggerDirective {
     get disabled() {
-        return this._disabled === undefined ? this.dtPicker.disabled : !!this._disabled;
+        return this._disabled ?? !!this.dtPicker?.disabled;
     }
     set disabled(value) {
         this._disabled = value;
     }
-    get owlDTTriggerDisabledClass() {
+    get triggerDisabledClass() {
         return this.disabled;
     }
+    constructor(changeDetector) {
+        this.changeDetector = changeDetector;
+    }
     ngOnInit() {
     }
     ngOnChanges(changes) {
-        if (changes.datepicker) {
+        if ('datepicker' in changes) {
             this.watchStateChanges();
         }
     }
@@ -3636,7 +3565,8 @@ class OwlDateTimeTriggerDirective {
         this.watchStateChanges();
     }
     ngOnDestroy() {
-        this.stateChanges.unsubscribe();
+        this.stateChanges?.unsubscribe();
+        this.stateChanges = undefined;
     }
     handleClickOnHost(event) {
         if (this.dtPicker) {
@@ -3645,7 +3575,8 @@ class OwlDateTimeTriggerDirective {
         }
     }
     watchStateChanges() {
-        this.stateChanges.unsubscribe();
+        this.stateChanges?.unsubscribe();
+        this.stateChanges = undefined;
         const inputDisabled = this.dtPicker && this.dtPicker.dtInput ?
             this.dtPicker.dtInput.disabledChange : of();
         const pickerDisabled = this.dtPicker ?
@@ -3656,41 +3587,35 @@ class OwlDateTimeTriggerDirective {
         });
     }
 }
-OwlDateTimeTriggerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeTriggerDirective, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
-OwlDateTimeTriggerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: OwlDateTimeTriggerDirective, selector: "[owlDateTimeTrigger]", inputs: { dtPicker: ["owlDateTimeTrigger", "dtPicker"], disabled: "disabled" }, host: { listeners: { "click": "handleClickOnHost($event)" }, properties: { "class.owl-dt-trigger-disabled": "this.owlDTTriggerDisabledClass" } }, usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeTriggerDirective, decorators: [{
+DateTimeTriggerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeTriggerDirective, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+DateTimeTriggerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: DateTimeTriggerDirective, selector: "[nxtDateTimeTrigger]", inputs: { dtPicker: ["nxtDateTimeTrigger", "dtPicker"], disabled: "disabled" }, host: { listeners: { "click": "handleClickOnHost($event)" }, properties: { "class.nxt-dt-trigger-disabled": "this.triggerDisabledClass" } }, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeTriggerDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[owlDateTimeTrigger]'
+                    selector: '[nxtDateTimeTrigger]'
                 }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { dtPicker: [{
                 type: Input,
-                args: ['owlDateTimeTrigger']
+                args: ['nxtDateTimeTrigger']
             }], disabled: [{
                 type: Input
-            }], owlDTTriggerDisabledClass: [{
+            }], triggerDisabledClass: [{
                 type: HostBinding,
-                args: ['class.owl-dt-trigger-disabled']
+                args: ['class.nxt-dt-trigger-disabled']
             }], handleClickOnHost: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });
 
 let uniqueId = 0;
-class OwlDialogConfig {
+class DialogConfig {
     constructor() {
-        /**
-         * ID of the element that describes the dialog.
-         */
-        this.ariaDescribedBy = null;
         /**
          * Whether to focus the dialog when the dialog is opened
          */
         this.autoFocus = true;
         /** Whether the dialog has a backdrop. */
         this.hasBackdrop = true;
-        /** Data being injected into the child component. */
-        this.data = null;
         /** Whether the user can use escape or clicking outside to close a modal. */
         this.disableClose = false;
         /**
@@ -3701,10 +3626,6 @@ class OwlDialogConfig {
          * Custom class for the pane
          * */
         this.paneClass = '';
-        /**
-         * Mouse Event
-         * */
-        this.event = null;
         /**
          * Custom class for the backdrop
          * */
@@ -3727,11 +3648,11 @@ class OwlDialogConfig {
          * Learn more this from https://material.angular.io/cdk/overlay/overview#scroll-strategies
          * */
         this.scrollStrategy = new NoopScrollStrategy();
-        this.id = `owl-dialog-${uniqueId++}`;
+        this.id = `nxt-dialog-${uniqueId++}`;
     }
 }
 
-class OwlDialogRef {
+class DialogRef {
     constructor(overlayRef, container, id, location) {
         this.overlayRef = overlayRef;
         this.container = container;
@@ -3739,10 +3660,8 @@ class OwlDialogRef {
         this._beforeClose$ = new Subject();
         this._afterOpen$ = new Subject();
         this._afterClosed$ = new Subject();
-        /** Subscription to changes in the user's location. */
-        this.locationChanged = Subscription.EMPTY;
         /** Whether the user is allowed to close the dialog. */
-        this.disableClose = this.container.config.disableClose;
+        this.disableClose = !!this.container.config?.disableClose;
         this.container.animationStateChanged
             .pipe(filter((event) => event.phaseName === 'done' && event.toState === 'enter'), take(1))
             .subscribe(() => {
@@ -3753,17 +3672,18 @@ class OwlDialogRef {
             .pipe(filter((event) => event.phaseName === 'done' && event.toState === 'exit'), take(1))
             .subscribe(() => {
             this.overlayRef.dispose();
-            this.locationChanged.unsubscribe();
+            this.locationChanged?.unsubscribe();
+            this.locationChanged = undefined;
             this._afterClosed$.next(this.result);
             this._afterClosed$.complete();
-            this.componentInstance = null;
+            this.componentInstance = undefined;
         });
         this.overlayRef.keydownEvents()
             .pipe(filter(event => event.keyCode === ESCAPE && !this.disableClose))
             .subscribe(() => this.close());
         if (location) {
             this.locationChanged = location.subscribe(() => {
-                if (this.container.config.closeOnNavigation) {
+                if (this.container.config?.closeOnNavigation) {
                     this.close();
                 }
             });
@@ -3857,11 +3777,11 @@ class OwlDialogRef {
  * @param sources The source objects from which properties will be copied.
  */
 function extendObject(dest, ...sources) {
-    if (dest == null) {
+    if (dest == null || dest == undefined) {
         throw TypeError('Cannot convert undefined or null to object');
     }
     for (const source of sources) {
-        if (source != null) {
+        if (source != null && source != undefined) {
             for (const key in source) {
                 if (source.hasOwnProperty(key)) {
                     dest[key] = source[key];
@@ -3881,15 +3801,37 @@ const zoomFadeInFrom = {
     transform: 'translateX({{ x }}) translateY({{ y }}) scale({{scale}})',
     transformOrigin: '{{ ox }} {{ oy }}'
 };
-class OwlDialogContainerComponent extends BasePortalOutlet {
+class DialogContainerComponent extends BasePortalOutlet {
+    get config() {
+        return this._config;
+    }
+    get dialogContainerClass() {
+        return true;
+    }
+    get dialogContainerTabIndex() {
+        return -1;
+    }
+    get dialogContainerId() {
+        return this._config?.id;
+    }
+    get dialogContainerRole() {
+        return this._config?.role;
+    }
+    get dialogContainerAriaLabelledby() {
+        return this.ariaLabelledBy;
+    }
+    get dialogContainerAriaDescribedby() {
+        return this._config?.ariaDescribedBy;
+    }
+    get dialogContainerAnimation() {
+        return { value: this.state, params: this.params };
+    }
     constructor(changeDetector, elementRef, focusTrapFactory, document) {
         super();
         this.changeDetector = changeDetector;
         this.elementRef = elementRef;
         this.focusTrapFactory = focusTrapFactory;
         this.document = document;
-        /** ID of the element that should be considered as the dialog's label. */
-        this.ariaLabelledBy = null;
         /** Emits when an animation state changes. */
         this.animationStateChanged = new EventEmitter();
         this.isAnimating = false;
@@ -3902,40 +3844,13 @@ class OwlDialogContainerComponent extends BasePortalOutlet {
             oy: '50%',
             scale: 0
         };
-        // A variable to hold the focused element before the dialog was open.
-        // This would help us to refocus back to element when the dialog was closed.
-        this.elementFocusedBeforeDialogWasOpened = null;
-    }
-    get config() {
-        return this._config;
-    }
-    get owlDialogContainerClass() {
-        return true;
-    }
-    get owlDialogContainerTabIndex() {
-        return -1;
-    }
-    get owlDialogContainerId() {
-        return this._config.id;
-    }
-    get owlDialogContainerRole() {
-        return this._config.role || null;
-    }
-    get owlDialogContainerAriaLabelledby() {
-        return this.ariaLabelledBy;
-    }
-    get owlDialogContainerAriaDescribedby() {
-        return this._config.ariaDescribedBy || null;
-    }
-    get owlDialogContainerAnimation() {
-        return { value: this.state, params: this.params };
     }
     ngOnInit() { }
     /**
      * Attach a ComponentPortal as content to this dialog container.
      */
     attachComponentPortal(portal) {
-        if (this.portalOutlet.hasAttached()) {
+        if (this.portalOutlet?.hasAttached()) {
             throw Error('Attempting to attach dialog content after content is already attached');
         }
         this.savePreviouslyFocusedElement();
@@ -3998,30 +3913,30 @@ class OwlDialogContainerComponent extends BasePortalOutlet {
         if (this.document) {
             this.elementFocusedBeforeDialogWasOpened = this.document
                 .activeElement;
-            Promise.resolve().then(() => this.elementRef.nativeElement.focus());
+            Promise.resolve().then(() => this.elementRef.nativeElement.focus()).catch(() => { });
         }
     }
     trapFocus() {
         if (!this.focusTrap) {
             this.focusTrap = this.focusTrapFactory.create(this.elementRef.nativeElement);
         }
-        if (this._config.autoFocus) {
-            this.focusTrap.focusInitialElementWhenReady();
+        if (this._config?.autoFocus) {
+            this.focusTrap?.focusInitialElementWhenReady().catch(() => { });
         }
     }
     restoreFocus() {
         const toFocus = this.elementFocusedBeforeDialogWasOpened;
-        // We need the extra check, because IE can set the `activeElement` to null in some cases.
         if (toFocus && typeof toFocus.focus === 'function') {
             toFocus.focus();
         }
         if (this.focusTrap) {
             this.focusTrap.destroy();
+            this.focusTrap = undefined;
         }
     }
 }
-OwlDialogContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i4.ConfigurableFocusTrapFactory }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlDialogContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlDialogContainerComponent, selector: "owl-dialog-container", host: { listeners: { "@slideModal.start": "onAnimationStart($event)", "@slideModal.done": "onAnimationDone($event)" }, properties: { "class.owl-dialog-container": "this.owlDialogContainerClass", "attr.tabindex": "this.owlDialogContainerTabIndex", "attr.id": "this.owlDialogContainerId", "attr.role": "this.owlDialogContainerRole", "attr.aria-labelledby": "this.owlDialogContainerAriaLabelledby", "attr.aria-describedby": "this.owlDialogContainerAriaDescribedby", "@slideModal": "this.owlDialogContainerAnimation" } }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", dependencies: [{ kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [
+DialogContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i4.ConfigurableFocusTrapFactory }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+DialogContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: DialogContainerComponent, selector: "nxt-dialog-container", host: { listeners: { "@slideModal.start": "onAnimationStart($event)", "@slideModal.done": "onAnimationDone($event)" }, properties: { "class.nxt-dialog-container": "this.dialogContainerClass", "attr.tabindex": "this.dialogContainerTabIndex", "attr.id": "this.dialogContainerId", "attr.role": "this.dialogContainerRole", "attr.aria-labelledby": "this.dialogContainerAriaLabelledby", "attr.aria-describedby": "this.dialogContainerAriaDescribedby", "@slideModal": "this.dialogContainerAnimation" } }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", dependencies: [{ kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [
         trigger('slideModal', [
             transition('void => enter', [
                 style(zoomFadeInFrom),
@@ -4045,9 +3960,9 @@ OwlDialogContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.
             transition('enter => exit', [animateChild(), animate(200, style(zoomFadeIn))], { params: { x: '0px', y: '0px', ox: '50%', oy: '50%' } })
         ])
     ] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-dialog-container', animations: [
+            args: [{ selector: 'nxt-dialog-container', animations: [
                         trigger('slideModal', [
                             transition('void => enter', [
                                 style(zoomFadeInFrom),
@@ -4071,7 +3986,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                             transition('enter => exit', [animateChild(), animate(200, style(zoomFadeIn))], { params: { x: '0px', y: '0px', ox: '50%', oy: '50%' } })
                         ])
                     ], template: "<ng-template cdkPortalOutlet></ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i4.ConfigurableFocusTrapFactory }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i4.ConfigurableFocusTrapFactory }, { type: Document, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -4079,25 +3994,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 }] }]; }, propDecorators: { portalOutlet: [{
                 type: ViewChild,
                 args: [CdkPortalOutlet, { static: true }]
-            }], owlDialogContainerClass: [{
+            }], dialogContainerClass: [{
                 type: HostBinding,
-                args: ['class.owl-dialog-container']
-            }], owlDialogContainerTabIndex: [{
+                args: ['class.nxt-dialog-container']
+            }], dialogContainerTabIndex: [{
                 type: HostBinding,
                 args: ['attr.tabindex']
-            }], owlDialogContainerId: [{
+            }], dialogContainerId: [{
                 type: HostBinding,
                 args: ['attr.id']
-            }], owlDialogContainerRole: [{
+            }], dialogContainerRole: [{
                 type: HostBinding,
                 args: ['attr.role']
-            }], owlDialogContainerAriaLabelledby: [{
+            }], dialogContainerAriaLabelledby: [{
                 type: HostBinding,
                 args: ['attr.aria-labelledby']
-            }], owlDialogContainerAriaDescribedby: [{
+            }], dialogContainerAriaDescribedby: [{
                 type: HostBinding,
                 args: ['attr.aria-describedby']
-            }], owlDialogContainerAnimation: [{
+            }], dialogContainerAnimation: [{
                 type: HostBinding,
                 args: ['@slideModal']
             }], onAnimationStart: [{
@@ -4108,26 +4023,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 args: ['@slideModal.done', ['$event']]
             }] } });
 
-const OWL_DIALOG_DATA = new InjectionToken('OwlDialogData');
+const NXT_DIALOG_DATA = new InjectionToken('NXT_DIALOG_DATA');
 /**
  * Injection token that determines the scroll handling while the dialog is open.
  * */
-const OWL_DIALOG_SCROLL_STRATEGY = new InjectionToken('owl-dialog-scroll-strategy');
-function OWL_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
+const NXT_DIALOG_SCROLL_STRATEGY = new InjectionToken('NXT_DIALOG_SCROLL_STRATEGY');
+function NXT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
     const fn = () => overlay.scrollStrategies.block();
     return fn;
 }
 /** @docs-private */
-const OWL_DIALOG_SCROLL_STRATEGY_PROVIDER = {
-    provide: OWL_DIALOG_SCROLL_STRATEGY,
+const NXT_DIALOG_SCROLL_STRATEGY_PROVIDER = {
+    provide: NXT_DIALOG_SCROLL_STRATEGY,
     deps: [Overlay],
-    useFactory: OWL_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY
+    useFactory: NXT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY
 };
 /** I
  * njection token that can be used to specify default dialog options.
  * */
-const OWL_DIALOG_DEFAULT_OPTIONS = new InjectionToken('owl-dialog-default-options');
-class OwlDialogService {
+const NXT_DIALOG_DEFAULT_OPTIONS = new InjectionToken('NXT_DIALOG_DEFAULT_OPTIONS');
+class DialogService {
+    /** Keeps track of the currently-open dialogs. */
+    get openDialogs() {
+        return this.parentDialog
+            ? this.parentDialog.openDialogs
+            : this._openDialogsAtThisLevel;
+    }
+    /** Stream that emits when a dialog has been opened. */
+    get afterOpen() {
+        return this.parentDialog
+            ? this.parentDialog.afterOpen
+            : this._afterOpenAtThisLevel;
+    }
+    get _afterAllClosed() {
+        const parent = this.parentDialog;
+        return parent
+            ? parent._afterAllClosed
+            : this._afterAllClosedAtThisLevel;
+    }
     constructor(overlay, injector, location, scrollStrategy, defaultOptions, parentDialog, overlayContainer) {
         this.overlay = overlay;
         this.injector = injector;
@@ -4151,24 +4084,6 @@ class OwlDialogService {
             location.subscribe(() => this.closeAll());
         }
     }
-    /** Keeps track of the currently-open dialogs. */
-    get openDialogs() {
-        return this.parentDialog
-            ? this.parentDialog.openDialogs
-            : this._openDialogsAtThisLevel;
-    }
-    /** Stream that emits when a dialog has been opened. */
-    get afterOpen() {
-        return this.parentDialog
-            ? this.parentDialog.afterOpen
-            : this._afterOpenAtThisLevel;
-    }
-    get _afterAllClosed() {
-        const parent = this.parentDialog;
-        return parent
-            ? parent._afterAllClosed
-            : this._afterAllClosedAtThisLevel;
-    }
     open(componentOrTemplateRef, config) {
         config = applyConfigDefaults(config, this.defaultOptions);
         if (config.id && this.getDialogById(config.id)) {
@@ -4205,7 +4120,7 @@ class OwlDialogService {
         return this.openDialogs.find(dialog => dialog.id === id);
     }
     attachDialogContent(componentOrTemplateRef, dialogContainer, overlayRef, config) {
-        const dialogRef = new OwlDialogRef(overlayRef, dialogContainer, config.id, this.location);
+        const dialogRef = new DialogRef(overlayRef, dialogContainer, config.id, this.location);
         if (config.hasBackdrop) {
             overlayRef.backdropClick().subscribe(() => {
                 if (!dialogRef.disableClose) {
@@ -4213,9 +4128,7 @@ class OwlDialogService {
                 }
             });
         }
-        if (componentOrTemplateRef instanceof TemplateRef) {
-        }
-        else {
+        if (!(componentOrTemplateRef instanceof TemplateRef)) {
             const injector = this.createInjector(config, dialogRef, dialogContainer);
             const contentRef = dialogContainer.attachComponentPortal(new ComponentPortal(componentOrTemplateRef, undefined, injector));
             dialogRef.componentInstance = contentRef.instance;
@@ -4231,9 +4144,9 @@ class OwlDialogService {
             config.viewContainerRef.injector;
         return Injector.create({
             providers: [
-                { provide: OwlDialogRef, useValue: dialogRef },
-                { provide: OwlDialogContainerComponent, useValue: dialogContainer },
-                { provide: OWL_DIALOG_DATA, useValue: config.data }
+                { provide: DialogRef, useValue: dialogRef },
+                { provide: DialogContainerComponent, useValue: dialogContainer },
+                { provide: NXT_DIALOG_DATA, useValue: config.data }
             ],
             parent: userInjector || this.injector
         });
@@ -4243,7 +4156,7 @@ class OwlDialogService {
         return this.overlay.create(overlayConfig);
     }
     attachDialogContainer(overlayRef, config) {
-        const containerPortal = new ComponentPortal(OwlDialogContainerComponent, config.viewContainerRef);
+        const containerPortal = new ComponentPortal(DialogContainerComponent, config.viewContainerRef);
         const containerRef = overlayRef.attach(containerPortal);
         containerRef.instance.setConfig(config);
         return containerRef.instance;
@@ -4305,24 +4218,30 @@ class OwlDialogService {
         }
     }
 }
-OwlDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogService, deps: [{ token: i1.Overlay }, { token: i0.Injector }, { token: i3.Location, optional: true }, { token: OWL_DIALOG_SCROLL_STRATEGY }, { token: OWL_DIALOG_DEFAULT_OPTIONS, optional: true }, { token: OwlDialogService, optional: true, skipSelf: true }, { token: i1.OverlayContainer }], target: i0.ɵɵFactoryTarget.Injectable });
-OwlDialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogService, decorators: [{
+DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogService, deps: [{ token: i1.Overlay }, { token: i0.Injector }, { token: Location, optional: true }, { token: NXT_DIALOG_SCROLL_STRATEGY }, { token: NXT_DIALOG_DEFAULT_OPTIONS, optional: true }, { token: DialogService, optional: true, skipSelf: true }, { token: i1.OverlayContainer }], target: i0.ɵɵFactoryTarget.Injectable });
+DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.Injector }, { type: i3.Location, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.Injector }, { type: undefined, decorators: [{
                     type: Optional
+                }, {
+                    type: Inject,
+                    args: [Location]
                 }] }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DIALOG_SCROLL_STRATEGY]
-                }] }, { type: OwlDialogConfig, decorators: [{
+                    args: [NXT_DIALOG_SCROLL_STRATEGY]
+                }] }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
-                    args: [OWL_DIALOG_DEFAULT_OPTIONS]
-                }] }, { type: OwlDialogService, decorators: [{
+                    args: [NXT_DIALOG_DEFAULT_OPTIONS]
+                }] }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
                     type: SkipSelf
+                }, {
+                    type: Inject,
+                    args: [DialogService]
                 }] }, { type: i1.OverlayContainer }]; } });
 /**
  * Applies default options to the dialog config.
@@ -4332,85 +4251,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * @returns The new configuration object.
  */
 function applyConfigDefaults(config, defaultOptions) {
-    return extendObject(new OwlDialogConfig(), config, defaultOptions);
+    return extendObject(new DialogConfig(), config, defaultOptions);
 }
 
 /** Injection token that determines the scroll handling while the dtPicker is open. */
-const OWL_DTPICKER_SCROLL_STRATEGY = new InjectionToken('owl-dtpicker-scroll-strategy');
+const NXT_DTPICKER_SCROLL_STRATEGY = new InjectionToken('NXT_DTPICKER_SCROLL_STRATEGY');
 /** @docs-private */
-function OWL_DTPICKER_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
+function NXT_DTPICKER_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
     const fn = () => overlay.scrollStrategies.block();
     return fn;
 }
 /** @docs-private */
-const OWL_DTPICKER_SCROLL_STRATEGY_PROVIDER = {
-    provide: OWL_DTPICKER_SCROLL_STRATEGY,
+const NXT_DTPICKER_SCROLL_STRATEGY_PROVIDER = {
+    provide: NXT_DTPICKER_SCROLL_STRATEGY,
     deps: [Overlay],
-    useFactory: OWL_DTPICKER_SCROLL_STRATEGY_PROVIDER_FACTORY
+    useFactory: NXT_DTPICKER_SCROLL_STRATEGY_PROVIDER_FACTORY
 };
-class OwlDateTimeComponent extends OwlDateTimeDirective {
-    constructor(overlay, viewContainerRef, dialogService, ngZone, changeDetector, dateTimeAdapter, defaultScrollStrategy, dateTimeFormats, document) {
-        super(dateTimeAdapter, dateTimeFormats);
-        this.overlay = overlay;
-        this.viewContainerRef = viewContainerRef;
-        this.dialogService = dialogService;
-        this.ngZone = ngZone;
-        this.changeDetector = changeDetector;
-        this.dateTimeAdapter = dateTimeAdapter;
-        this.dateTimeFormats = dateTimeFormats;
-        this.document = document;
-        /** Custom class for the picker backdrop. */
-        this.backdropClass = [];
-        /** Custom class for the picker overlay pane. */
-        this.panelClass = [];
-        /**
-         * Set the type of the dateTime picker
-         *      'both' -- show both calendar and timer
-         *      'calendar' -- show only calendar
-         *      'timer' -- show only timer
-         */
-        this._pickerType = 'both';
-        /**
-         * Whether the picker open as a dialog
-         */
-        this._pickerMode = 'popup';
-        /** Whether the calendar is open. */
-        this._opened = false;
-        /**
-         * Callback when the picker is closed
-         * */
-        this.afterPickerClosed = new EventEmitter();
-        /**
-         * Callback when the picker is open
-         * */
-        this.afterPickerOpen = new EventEmitter();
-        /**
-         * Emits selected year in multi-year view
-         * This doesn't imply a change on the selected date.
-         * */
-        this.yearSelected = new EventEmitter();
-        /**
-         * Emits selected month in year view
-         * This doesn't imply a change on the selected date.
-         * */
-        this.monthSelected = new EventEmitter();
-        /**
-         * Emit when the selected value has been confirmed
-         * */
-        this.confirmSelectedChange = new EventEmitter();
-        /**
-         * Emits when the date time picker is disabled.
-         * */
-        this.disabledChange = new EventEmitter();
-        this.dtInputSub = Subscription.EMPTY;
-        this.hidePickerStreamSub = Subscription.EMPTY;
-        this.confirmSelectedStreamSub = Subscription.EMPTY;
-        this.pickerOpenedStreamSub = Subscription.EMPTY;
-        /** The element that was focused before the date time picker was opened. */
-        this.focusedElementBeforeOpen = null;
-        this._selecteds = [];
-        this.defaultScrollStrategy = defaultScrollStrategy;
-    }
+class DateTimeComponent extends DateTimeDirective {
     get startAt() {
         // If an explicit startAt is set we start there, otherwise we start at whatever the currently
         // selected value is.
@@ -4419,19 +4276,17 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
         }
         if (this._dtInput) {
             if (this._dtInput.selectMode === 'single') {
-                return this._dtInput.value || null;
+                return this._dtInput.value;
             }
             else if (this._dtInput.selectMode === 'range' ||
                 this._dtInput.selectMode === 'rangeFrom') {
-                return this._dtInput.values[0] || null;
+                return this._dtInput.values[0];
             }
             else if (this._dtInput.selectMode === 'rangeTo') {
-                return this._dtInput.values[1] || null;
+                return this._dtInput.values[1];
             }
         }
-        else {
-            return null;
-        }
+        return;
     }
     set startAt(date) {
         this._startAt = this.getValidDate(this.dateTimeAdapter.deserialize(date));
@@ -4459,9 +4314,7 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
         }
     }
     get disabled() {
-        return this._disabled === undefined && this._dtInput
-            ? this._dtInput.disabled
-            : !!this._disabled;
+        return this._disabled ?? !!this._dtInput?.disabled;
     }
     set disabled(value) {
         value = coerceBooleanProperty(value);
@@ -4490,36 +4343,91 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
         this.changeDetector.markForCheck();
     }
     get selecteds() {
-        return this._selecteds;
+        return this._selecteds || [];
     }
     set selecteds(values) {
         this._selecteds = values;
         this.changeDetector.markForCheck();
     }
     /** The minimum selectable date. */
-    get minDateTime() {
-        return this._dtInput && this._dtInput.min;
+    get min() {
+        return (this._dtInput && this._dtInput.min);
     }
     /** The maximum selectable date. */
-    get maxDateTime() {
-        return this._dtInput && this._dtInput.max;
+    get max() {
+        return (this._dtInput && this._dtInput.max);
     }
     get dateTimeFilter() {
-        return this._dtInput && this._dtInput.dateTimeFilter;
+        return this._dtInput?.dateTimeFilter;
     }
     get selectMode() {
-        return this._dtInput.selectMode;
+        return this._dtInput?.selectMode;
     }
     get isInSingleMode() {
-        return this._dtInput.isInSingleMode;
+        return !!this._dtInput?.isInSingleMode;
     }
     get isInRangeMode() {
-        return this._dtInput.isInRangeMode;
+        return !!this._dtInput?.isInRangeMode;
+    }
+    constructor(overlay, viewContainerRef, dialogService, ngZone, changeDetector, dateTimeAdapter, defaultScrollStrategy, dateTimeFormats, document) {
+        super(dateTimeAdapter, dateTimeFormats);
+        this.overlay = overlay;
+        this.viewContainerRef = viewContainerRef;
+        this.dialogService = dialogService;
+        this.ngZone = ngZone;
+        this.changeDetector = changeDetector;
+        this.defaultScrollStrategy = defaultScrollStrategy;
+        this.document = document;
+        /** Custom class for the picker backdrop. */
+        this.backdropClass = [];
+        /** Custom class for the picker overlay pane. */
+        this.panelClass = [];
+        /**
+         * Set the type of the dateTime picker
+         *      'both' -- show both calendar and timer
+         *      'calendar' -- show only calendar
+         *      'timer' -- show only timer
+         */
+        this._pickerType = 'both';
+        /**
+         * Whether the picker open as a dialog
+         */
+        this._pickerMode = 'popup';
+        /** Whether the calendar is open. */
+        this._opened = false;
+        /**
+         * Callback when the picker is closed
+         * */
+        this.afterPickerClosed = new EventEmitter();
+        /**
+         * Callback when the picker is open
+         * */
+        this.afterPickerOpen = new EventEmitter();
+        /**
+         * Emits selected year in multi-year view
+         * This doesn't imply a change on the selected date.
+         * */
+        this.yearSelected = new EventEmitter();
+        /**
+         * Emits selected month in year view
+         * This doesn't imply a change on the selected date.
+         * */
+        this.monthSelected = new EventEmitter();
+        /**
+         * Emit when the selected value has been confirmed
+         * */
+        this.confirmSelectedChange = new EventEmitter();
+        /**
+         * Emits when the date time picker is disabled.
+         * */
+        this.disabledChange = new EventEmitter();
+        this._selecteds = new Array();
     }
     ngOnInit() { }
     ngOnDestroy() {
         this.close();
-        this.dtInputSub.unsubscribe();
+        this.dtInputSub?.unsubscribe();
+        this.dtInputSub = undefined;
         this.disabledChange.complete();
         if (this.popupRef) {
             this.popupRef.dispose();
@@ -4527,7 +4435,7 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
     }
     registerInput(input) {
         if (this._dtInput) {
-            throw Error('A Owl DateTimePicker can only be associated with a single input.');
+            throw Error('A Nxt DateTimePicker can only be associated with a single input.');
         }
         this._dtInput = input;
         this.dtInputSub = this._dtInput.valueChange.subscribe((value) => {
@@ -4565,13 +4473,14 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
             this.openAsDialog();
         else
             this.openAsPopup();
-        this.pickerContainer.picker = this;
+        if (this.pickerContainer)
+            this.pickerContainer.picker = this;
         // Listen to picker container's hidePickerStream
-        this.hidePickerStreamSub = this.pickerContainer.hidePickerStream.subscribe(() => {
+        this.hidePickerStreamSub = this.pickerContainer?.hidePickerStream.subscribe(() => {
             this.close();
         });
         // Listen to picker container's confirmSelectedStream
-        this.confirmSelectedStreamSub = this.pickerContainer.confirmSelectedStream.subscribe((event) => {
+        this.confirmSelectedStreamSub = this.pickerContainer?.confirmSelectedStream.subscribe((event) => {
             this.confirmSelect(event);
         });
     }
@@ -4631,27 +4540,21 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
             this.pickerContainerPortal.isAttached) {
             this.pickerContainerPortal.detach();
         }
-        if (this.hidePickerStreamSub) {
-            this.hidePickerStreamSub.unsubscribe();
-            this.hidePickerStreamSub = null;
-        }
-        if (this.confirmSelectedStreamSub) {
-            this.confirmSelectedStreamSub.unsubscribe();
-            this.confirmSelectedStreamSub = null;
-        }
-        if (this.pickerOpenedStreamSub) {
-            this.pickerOpenedStreamSub.unsubscribe();
-            this.pickerOpenedStreamSub = null;
-        }
+        this.hidePickerStreamSub?.unsubscribe();
+        this.hidePickerStreamSub = undefined;
+        this.confirmSelectedStreamSub?.unsubscribe();
+        this.confirmSelectedStreamSub = undefined;
+        this.pickerOpenedStreamSub?.unsubscribe();
+        this.pickerOpenedStreamSub = undefined;
         if (this.dialogRef) {
             this.dialogRef.close();
-            this.dialogRef = null;
+            this.dialogRef = undefined;
         }
         const completeClose = () => {
             if (this._opened) {
                 this._opened = false;
-                this.afterPickerClosed.emit(null);
-                this.focusedElementBeforeOpen = null;
+                this.afterPickerClosed.emit();
+                this.focusedElementBeforeOpen = undefined;
             }
         };
         if (this.focusedElementBeforeOpen &&
@@ -4686,19 +4589,19 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
      * Open the picker as a dialog
      */
     openAsDialog() {
-        this.dialogRef = this.dialogService.open(OwlDateTimeContainerComponent, {
+        this.dialogRef = this.dialogService.open(DateTimeContainerComponent, {
             autoFocus: false,
             backdropClass: [
                 'cdk-overlay-dark-backdrop',
                 ...coerceArray(this.backdropClass)
             ],
-            paneClass: ['owl-dt-dialog', ...coerceArray(this.panelClass)],
+            paneClass: ['nxt-dt-dialog', ...coerceArray(this.panelClass)],
             viewContainerRef: this.viewContainerRef,
             scrollStrategy: this.scrollStrategy || this.defaultScrollStrategy()
         });
         this.pickerContainer = this.dialogRef.componentInstance;
         this.dialogRef.afterOpen().subscribe(() => {
-            this.afterPickerOpen.emit(null);
+            this.afterPickerOpen.emit();
             this._opened = true;
         });
         this.dialogRef.afterClosed().subscribe(() => this.close());
@@ -4708,26 +4611,26 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
      */
     openAsPopup() {
         if (!this.pickerContainerPortal) {
-            this.pickerContainerPortal = new ComponentPortal(OwlDateTimeContainerComponent, this.viewContainerRef);
+            this.pickerContainerPortal = new ComponentPortal(DateTimeContainerComponent, this.viewContainerRef);
         }
         if (!this.popupRef) {
             this.createPopup();
         }
-        if (!this.popupRef.hasAttached()) {
-            const componentRef = this.popupRef.attach(this.pickerContainerPortal);
-            this.pickerContainer = componentRef.instance;
+        if (!this.popupRef?.hasAttached()) {
+            const componentRef = this.popupRef?.attach(this.pickerContainerPortal);
+            this.pickerContainer = componentRef?.instance;
             // Update the position once the calendar has rendered.
             this.ngZone.onStable
                 .asObservable()
                 .pipe(take(1))
                 .subscribe(() => {
-                this.popupRef.updatePosition();
+                this.popupRef?.updatePosition();
             });
             // emit open stream
-            this.pickerOpenedStreamSub = this.pickerContainer.pickerOpenedStream
+            this.pickerOpenedStreamSub = this.pickerContainer?.pickerOpenedStream
                 .pipe(take(1))
                 .subscribe(() => {
-                this.afterPickerOpen.emit(null);
+                this.afterPickerOpen.emit();
                 this._opened = true;
             });
         }
@@ -4741,84 +4644,82 @@ class OwlDateTimeComponent extends OwlDateTimeDirective {
                 ...coerceArray(this.backdropClass)
             ],
             scrollStrategy: this.scrollStrategy || this.defaultScrollStrategy(),
-            panelClass: ['owl-dt-popup', ...coerceArray(this.panelClass)]
+            panelClass: ['nxt-dt-popup', ...coerceArray(this.panelClass)]
         });
         this.popupRef = this.overlay.create(overlayConfig);
         merge(this.popupRef.backdropClick(), this.popupRef.detachments(), this.popupRef
             .keydownEvents()
-            .pipe(filter(event => event.keyCode === ESCAPE ||
+            .pipe(filter(event => !!(event.keyCode === ESCAPE ||
             (this._dtInput &&
                 event.altKey &&
-                event.keyCode === UP_ARROW)))).subscribe(() => this.close());
+                event.keyCode === UP_ARROW))))).subscribe(() => this.close());
     }
     /**
      * Create the popup PositionStrategy.
      * */
     createPopupPositionStrategy() {
-        return this.overlay
-            .position()
-            .flexibleConnectedTo(this._dtInput.elementRef)
-            .withTransformOriginOn('.owl-dt-container')
-            .withFlexibleDimensions(false)
-            .withPush(false)
-            .withPositions([
-            {
-                originX: 'start',
-                originY: 'bottom',
-                overlayX: 'start',
-                overlayY: 'top'
-            },
-            {
-                originX: 'start',
-                originY: 'top',
-                overlayX: 'start',
-                overlayY: 'bottom'
-            },
-            {
-                originX: 'end',
-                originY: 'bottom',
-                overlayX: 'end',
-                overlayY: 'top'
-            },
-            {
-                originX: 'end',
-                originY: 'top',
-                overlayX: 'end',
-                overlayY: 'bottom'
-            },
-            {
-                originX: 'start',
-                originY: 'top',
-                overlayX: 'start',
-                overlayY: 'top',
-                offsetY: -176
-            },
-            {
-                originX: 'start',
-                originY: 'top',
-                overlayX: 'start',
-                overlayY: 'top',
-                offsetY: -352
-            }
-        ]);
+        if (this._dtInput)
+            return this.overlay
+                .position()
+                .flexibleConnectedTo(this._dtInput.elementRef)
+                .withTransformOriginOn('.nxt-dt-container')
+                .withFlexibleDimensions(false)
+                .withPush(false)
+                .withPositions([
+                {
+                    originX: 'start',
+                    originY: 'bottom',
+                    overlayX: 'start',
+                    overlayY: 'top'
+                },
+                {
+                    originX: 'start',
+                    originY: 'top',
+                    overlayX: 'start',
+                    overlayY: 'bottom'
+                },
+                {
+                    originX: 'end',
+                    originY: 'bottom',
+                    overlayX: 'end',
+                    overlayY: 'top'
+                },
+                {
+                    originX: 'end',
+                    originY: 'top',
+                    overlayX: 'end',
+                    overlayY: 'bottom'
+                },
+                {
+                    originX: 'start',
+                    originY: 'top',
+                    overlayX: 'start',
+                    overlayY: 'top',
+                    offsetY: -176
+                },
+                {
+                    originX: 'start',
+                    originY: 'top',
+                    overlayX: 'start',
+                    overlayY: 'top',
+                    offsetY: -352
+                }
+            ]);
+        return;
     }
 }
-OwlDateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeComponent, deps: [{ token: i1.Overlay }, { token: i0.ViewContainerRef }, { token: OwlDialogService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DTPICKER_SCROLL_STRATEGY }, { token: OWL_DATE_TIME_FORMATS, optional: true }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-OwlDateTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: OwlDateTimeComponent, selector: "owl-date-time", inputs: { backdropClass: "backdropClass", panelClass: "panelClass", startAt: "startAt", pickerType: "pickerType", pickerMode: "pickerMode", disabled: "disabled", opened: "opened", scrollStrategy: "scrollStrategy" }, outputs: { afterPickerClosed: "afterPickerClosed", afterPickerOpen: "afterPickerOpen", yearSelected: "yearSelected", monthSelected: "monthSelected" }, exportAs: ["owlDateTime"], usesInheritance: true, ngImport: i0, template: "<p>date-time-picker works!</p>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeComponent, decorators: [{
+DateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeComponent, deps: [{ token: i1.Overlay }, { token: i0.ViewContainerRef }, { token: DialogService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter }, { token: NXT_DTPICKER_SCROLL_STRATEGY }, { token: NXT_DATE_TIME_FORMATS }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+DateTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: DateTimeComponent, selector: "nxt-date-time", inputs: { backdropClass: "backdropClass", panelClass: "panelClass", startAt: "startAt", pickerType: "pickerType", pickerMode: "pickerMode", disabled: "disabled", opened: "opened", scrollStrategy: "scrollStrategy" }, outputs: { afterPickerClosed: "afterPickerClosed", afterPickerOpen: "afterPickerOpen", yearSelected: "yearSelected", monthSelected: "monthSelected" }, usesInheritance: true, ngImport: i0, template: "<p>date-time-picker works!</p>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'owl-date-time', exportAs: 'owlDateTime', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<p>date-time-picker works!</p>\n" }]
-        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: OwlDialogService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
+            args: [{ selector: 'nxt-date-time', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<p>date-time-picker works!</p>\n" }]
+        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: DialogService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [OWL_DTPICKER_SCROLL_STRATEGY]
+                    args: [NXT_DTPICKER_SCROLL_STRATEGY]
                 }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
                     type: Inject,
-                    args: [OWL_DATE_TIME_FORMATS]
-                }] }, { type: undefined, decorators: [{
+                    args: [NXT_DATE_TIME_FORMATS]
+                }] }, { type: Document, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -4849,90 +4750,111 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }] } });
 
-class OwlDialogModule {
+class DialogModule {
 }
-OwlDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-OwlDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogModule, declarations: [OwlDialogContainerComponent], imports: [CommonModule, A11yModule, OverlayModule, PortalModule] });
-OwlDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogModule, providers: [
-        OWL_DIALOG_SCROLL_STRATEGY_PROVIDER,
-        OwlDialogService
-    ], imports: [CommonModule, A11yModule, OverlayModule, PortalModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDialogModule, decorators: [{
+DialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+DialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: DialogModule, declarations: [DialogContainerComponent], imports: [CommonModule,
+        A11yModule,
+        OverlayModule,
+        PortalModule] });
+DialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogModule, providers: [
+        NXT_DIALOG_SCROLL_STRATEGY_PROVIDER,
+        DialogService
+    ], imports: [CommonModule,
+        A11yModule,
+        OverlayModule,
+        PortalModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DialogModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, A11yModule, OverlayModule, PortalModule],
-                    exports: [],
                     declarations: [
-                        OwlDialogContainerComponent
+                        DialogContainerComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        A11yModule,
+                        OverlayModule,
+                        PortalModule
                     ],
                     providers: [
-                        OWL_DIALOG_SCROLL_STRATEGY_PROVIDER,
-                        OwlDialogService
+                        NXT_DIALOG_SCROLL_STRATEGY_PROVIDER,
+                        DialogService
                     ]
                 }]
         }] });
 
-class OwlDateTimeModule {
+class DateTimeModule {
 }
-OwlDateTimeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-OwlDateTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeModule, declarations: [OwlDateTimeTriggerDirective,
-        OwlDateTimeInputDirective,
-        OwlDateTimeComponent,
-        OwlDateTimeContainerComponent,
-        OwlMultiYearViewComponent,
-        OwlYearViewComponent,
-        OwlMonthViewComponent,
-        OwlTimerComponent,
-        OwlTimerBoxComponent,
-        OwlCalendarComponent,
-        OwlCalendarBodyComponent,
+DateTimeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+DateTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: DateTimeModule, declarations: [DateTimeTriggerDirective,
+        DateTimeInputDirective,
+        DateTimeComponent,
+        DateTimeContainerComponent,
+        MultiYearViewComponent,
+        YearViewComponent,
+        MonthViewComponent,
+        TimerComponent,
+        TimerBoxComponent,
+        CalendarComponent,
+        CalendarBodyComponent,
         NumberFixedLenPipe,
-        OwlDateTimeInlineComponent], imports: [CommonModule, OverlayModule, OwlDialogModule, A11yModule], exports: [OwlCalendarComponent,
-        OwlTimerComponent,
-        OwlDateTimeTriggerDirective,
-        OwlDateTimeInputDirective,
-        OwlDateTimeComponent,
-        OwlDateTimeInlineComponent,
-        OwlMultiYearViewComponent,
-        OwlYearViewComponent,
-        OwlMonthViewComponent] });
-OwlDateTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeModule, providers: [
-        OwlDateTimeIntl,
-        OWL_DTPICKER_SCROLL_STRATEGY_PROVIDER
-    ], imports: [CommonModule, OverlayModule, OwlDialogModule, A11yModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: OwlDateTimeModule, decorators: [{
+        DateTimeInlineComponent], imports: [CommonModule,
+        OverlayModule,
+        DialogModule,
+        A11yModule], exports: [CalendarComponent,
+        TimerComponent,
+        DateTimeTriggerDirective,
+        DateTimeInputDirective,
+        DateTimeComponent,
+        DateTimeInlineComponent,
+        MultiYearViewComponent,
+        YearViewComponent,
+        MonthViewComponent] });
+DateTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeModule, providers: [
+        DateTimeIntl,
+        NXT_DTPICKER_SCROLL_STRATEGY_PROVIDER
+    ], imports: [CommonModule,
+        OverlayModule,
+        DialogModule,
+        A11yModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DateTimeModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, OverlayModule, OwlDialogModule, A11yModule],
-                    exports: [
-                        OwlCalendarComponent,
-                        OwlTimerComponent,
-                        OwlDateTimeTriggerDirective,
-                        OwlDateTimeInputDirective,
-                        OwlDateTimeComponent,
-                        OwlDateTimeInlineComponent,
-                        OwlMultiYearViewComponent,
-                        OwlYearViewComponent,
-                        OwlMonthViewComponent
-                    ],
                     declarations: [
-                        OwlDateTimeTriggerDirective,
-                        OwlDateTimeInputDirective,
-                        OwlDateTimeComponent,
-                        OwlDateTimeContainerComponent,
-                        OwlMultiYearViewComponent,
-                        OwlYearViewComponent,
-                        OwlMonthViewComponent,
-                        OwlTimerComponent,
-                        OwlTimerBoxComponent,
-                        OwlCalendarComponent,
-                        OwlCalendarBodyComponent,
+                        DateTimeTriggerDirective,
+                        DateTimeInputDirective,
+                        DateTimeComponent,
+                        DateTimeContainerComponent,
+                        MultiYearViewComponent,
+                        YearViewComponent,
+                        MonthViewComponent,
+                        TimerComponent,
+                        TimerBoxComponent,
+                        CalendarComponent,
+                        CalendarBodyComponent,
                         NumberFixedLenPipe,
-                        OwlDateTimeInlineComponent
+                        DateTimeInlineComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        OverlayModule,
+                        DialogModule,
+                        A11yModule
+                    ],
+                    exports: [
+                        CalendarComponent,
+                        TimerComponent,
+                        DateTimeTriggerDirective,
+                        DateTimeInputDirective,
+                        DateTimeComponent,
+                        DateTimeInlineComponent,
+                        MultiYearViewComponent,
+                        YearViewComponent,
+                        MonthViewComponent
                     ],
                     providers: [
-                        OwlDateTimeIntl,
-                        OWL_DTPICKER_SCROLL_STRATEGY_PROVIDER
+                        DateTimeIntl,
+                        NXT_DTPICKER_SCROLL_STRATEGY_PROVIDER
                     ]
                 }]
         }] });
@@ -4941,5 +4863,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { DateTimeAdapter, OWL_DATE_TIME_FORMATS, OWL_DATE_TIME_LOCALE, OWL_DATE_TIME_LOCALE_PROVIDER, OwlCalendarComponent, OwlDateTimeComponent, OwlDateTimeInlineComponent, OwlDateTimeInputDirective, OwlDateTimeIntl, OwlDateTimeModule, OwlDateTimeTriggerDirective, OwlMonthViewComponent, OwlMultiYearViewComponent, OwlTimerComponent, OwlYearViewComponent };
+export { CalendarComponent, DateTimeAdapter, DateTimeComponent, DateTimeInlineComponent, DateTimeInputDirective, DateTimeIntl, DateTimeModule, DateTimeTriggerDirective, MonthViewComponent, MultiYearViewComponent, NXT_DATE_TIME_FORMATS, NXT_DATE_TIME_LOCALE, NXT_DATE_TIME_LOCALE_PROVIDER, TimerComponent, YearViewComponent };
 //# sourceMappingURL=nxt-pick-datetime.mjs.map