@ngbase/adk 0.1.16 → 0.1.18

package/fesm2022/ngbase-adk-datepicker.mjs

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, ElementRef, input, effect, Directive, Injector, booleanAttribute, computed, afterNextRender, viewChild, model, signal, viewChildren, output, untracked } from '@angular/core';
+import { InjectionToken, inject, ElementRef, input, effect, Directive, Injector, booleanAttribute, computed, afterNextRender, viewChild, model, signal, viewChildren, untracked } from '@angular/core';
 import * as i1$1 from '@ngbase/adk/a11y';
 import { AccessibleGroup, AccessibleItem } from '@ngbase/adk/a11y';
 import { Directionality } from '@ngbase/adk/bidi';
 import { DialogRef } from '@ngbase/adk/portal';
 import * as i1$2 from '@ngbase/adk/utils';
-import { uniqueId, NumberOnly, padString, provideValueAccessor } from '@ngbase/adk/utils';
+import { uniqueId, NumberOnly, padString } from '@ngbase/adk/utils';
 import * as i1 from '@ngbase/adk/form-field';
 import { InputBase } from '@ngbase/adk/form-field';
 import { ngbPopoverPortal } from '@ngbase/adk/popover';
@@ -125,10 +125,10 @@ class NgbEndDate {
             this.ngbEndDate().endDate = this;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbEndDate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: NgbEndDate, isStandalone: true, selector: "[ngbEndDate]", inputs: { ngbEndDate: { classPropertyName: "ngbEndDate", publicName: "ngbEndDate", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["ngbEndDate"], hostDirectives: [{ directive: i1.InputBase, inputs: ["value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbEndDate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: NgbEndDate, isStandalone: true, selector: "[ngbEndDate]", inputs: { ngbEndDate: { classPropertyName: "ngbEndDate", publicName: "ngbEndDate", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["ngbEndDate"], hostDirectives: [{ directive: i1.InputBase, inputs: ["value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbEndDate, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbEndDate, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbEndDate]',
@@ -138,7 +138,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                     // '(click)': 'open()',
                     },
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { ngbEndDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngbEndDate", required: true }] }] } });
 class NgbDatepickerTrigger {
     constructor() {
         this.el = inject(ElementRef);
@@ -149,9 +149,9 @@ class NgbDatepickerTrigger {
         this.popover = ngbPopoverPortal();
         this.datepicker = inject(DatePicker, { optional: true }) ?? (NgbDatePicker);
         // readonly datepicker = input<NgbDatePicker<D>>();
-        this.noOfCalendars = input(1, ...(ngDevMode ? [{ debugName: "noOfCalendars", transform: (v) => Math.max(1, Number(v)) }] : [{ transform: (v) => Math.max(1, Number(v)) }]));
-        this.range = input(false, ...(ngDevMode ? [{ debugName: "range", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
-        this.time = input(false, ...(ngDevMode ? [{ debugName: "time", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        this.noOfCalendars = input(1, { ...(ngDevMode ? { debugName: "noOfCalendars" } : {}), transform: (v) => Math.max(1, Number(v)) });
+        this.range = input(false, { ...(ngDevMode ? { debugName: "range" } : {}), transform: booleanAttribute });
+        this.time = input(false, { ...(ngDevMode ? { debugName: "time" } : {}), transform: booleanAttribute });
         this.format = input('', ...(ngDevMode ? [{ debugName: "format" }] : []));
         this.fieldFormat = input(DEFAULT_FIELD_FORMAT, ...(ngDevMode ? [{ debugName: "fieldFormat" }] : []));
         this.dateFilter = input(() => true, ...(ngDevMode ? [{ debugName: "dateFilter" }] : []));
@@ -208,15 +208,15 @@ class NgbDatepickerTrigger {
                 return;
             }
             if (this.endDate) {
-                this.inputS.setValue(formatDate[0], true);
-                this.endDate.inputS.setValue(formatDate[1], true);
+                this.inputS.setValue(formatDate[0]);
+                this.endDate.inputS.setValue(formatDate[1]);
             }
             else {
-                this.inputS?.setValue(formatDate, true);
+                this.inputS?.setValue(formatDate);
             }
         }
         else if (filtered.length) {
-            this.inputS?.setValue(formatDate[0], true);
+            this.inputS?.setValue(formatDate[0]);
         }
         this.updateField(filtered);
     }
@@ -233,10 +233,10 @@ class NgbDatepickerTrigger {
             }
         }, { injector: this.injector });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbDatepickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: NgbDatepickerTrigger, isStandalone: true, selector: "[ngbDatepickerTrigger]", inputs: { noOfCalendars: { classPropertyName: "noOfCalendars", publicName: "noOfCalendars", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, time: { classPropertyName: "time", publicName: "time", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, fieldFormat: { classPropertyName: "fieldFormat", publicName: "fieldFormat", isSignal: true, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, pickerType: { classPropertyName: "pickerType", publicName: "pickerType", isSignal: true, isRequired: false, transformFunction: null }, pickerTemplate: { classPropertyName: "pickerTemplate", publicName: "pickerTemplate", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "readonly": "true" }, listeners: { "click": "open()" } }, exportAs: ["ngbDatepickerTrigger"], hostDirectives: [{ directive: i1.InputBase, inputs: ["value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbDatepickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: NgbDatepickerTrigger, isStandalone: true, selector: "[ngbDatepickerTrigger]", inputs: { noOfCalendars: { classPropertyName: "noOfCalendars", publicName: "noOfCalendars", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, time: { classPropertyName: "time", publicName: "time", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, fieldFormat: { classPropertyName: "fieldFormat", publicName: "fieldFormat", isSignal: true, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, pickerType: { classPropertyName: "pickerType", publicName: "pickerType", isSignal: true, isRequired: false, transformFunction: null }, pickerTemplate: { classPropertyName: "pickerTemplate", publicName: "pickerTemplate", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "readonly": "true" }, listeners: { "click": "open()" } }, exportAs: ["ngbDatepickerTrigger"], hostDirectives: [{ directive: i1.InputBase, inputs: ["value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbDatepickerTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbDatepickerTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbDatepickerTrigger]',
@@ -247,7 +247,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                         readonly: 'true',
                     },
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { noOfCalendars: [{ type: i0.Input, args: [{ isSignal: true, alias: "noOfCalendars", required: false }] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }], time: [{ type: i0.Input, args: [{ isSignal: true, alias: "time", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], fieldFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldFormat", required: false }] }], dateFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFilter", required: false }] }], pickerType: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerType", required: false }] }], pickerTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerTemplate", required: false }] }] } });
 function aliasDatePickerTrigger(trigger) {
     return { provide: NgbDatepickerTrigger, useExisting: trigger };
 }
@@ -266,10 +266,10 @@ class DatepickerGroup {
         this.allyGroup._columns.set(7);
         this.allyGroup._initialFocus.set(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: DatepickerGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: DatepickerGroup, isStandalone: true, selector: "[ngbDatepickerGroup]", exportAs: ["ngbDatepickerGroup"], hostDirectives: [{ directive: i1$1.AccessibleGroup }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DatepickerGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: DatepickerGroup, isStandalone: true, selector: "[ngbDatepickerGroup]", exportAs: ["ngbDatepickerGroup"], hostDirectives: [{ directive: i1$1.AccessibleGroup }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: DatepickerGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DatepickerGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbDatepickerGroup]',
@@ -440,15 +440,15 @@ class NgbDatePicker {
         }
         this.showType.set(type);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbDatePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.2.0", type: NgbDatePicker, isStandalone: true, selector: "[ngbDatepicker]", inputs: { dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, pickerType: { classPropertyName: "pickerType", publicName: "pickerType", isSignal: true, isRequired: false, transformFunction: null }, noOfCalendar: { classPropertyName: "noOfCalendar", publicName: "noOfCalendar", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { noOfCalendar: "noOfCalendarChange", range: "rangeChange" }, viewQueries: [{ propertyName: "allyGroup", first: true, predicate: AccessibleGroup, descendants: true, isSignal: true }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbDatePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.1.0", type: NgbDatePicker, isStandalone: true, selector: "[ngbDatepicker]", inputs: { dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, pickerType: { classPropertyName: "pickerType", publicName: "pickerType", isSignal: true, isRequired: false, transformFunction: null }, noOfCalendar: { classPropertyName: "noOfCalendar", publicName: "noOfCalendar", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { noOfCalendar: "noOfCalendarChange", range: "rangeChange" }, viewQueries: [{ propertyName: "allyGroup", first: true, predicate: AccessibleGroup, descendants: true, isSignal: true }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbDatePicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbDatePicker, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbDatepicker]',
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { allyGroup: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AccessibleGroup), { isSignal: true }] }], dateFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFilter", required: false }] }], pickerType: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerType", required: false }] }], noOfCalendar: [{ type: i0.Input, args: [{ isSignal: true, alias: "noOfCalendar", required: false }] }, { type: i0.Output, args: ["noOfCalendarChange"] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }, { type: i0.Output, args: ["rangeChange"] }] } });
 function aliasDatePicker(picker) {
     return {
         provide: NgbDatePicker,
@@ -467,10 +467,10 @@ class CalendarBtn {
             return this.ngbCalendarBtn() === 'left' ? this.cal.first() : this.cal.last();
         }, ...(ngDevMode ? [{ debugName: "visible" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: CalendarBtn, isStandalone: true, selector: "button[ngbCalendarBtn]", inputs: { ngbCalendarBtn: { classPropertyName: "ngbCalendarBtn", publicName: "ngbCalendarBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "cal.navigate(ngbCalendarBtn() === \"left\" ? -1 : 1)" }, properties: { "class": "!visible() ? \"invisible\" : \"\"", "disabled": "disabled()", "tabIndex": "disabled() ? -1 : 0" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: CalendarBtn, isStandalone: true, selector: "button[ngbCalendarBtn]", inputs: { ngbCalendarBtn: { classPropertyName: "ngbCalendarBtn", publicName: "ngbCalendarBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "cal.navigate(ngbCalendarBtn() === \"left\" ? -1 : 1)" }, properties: { "class": "!visible() ? \"invisible\" : \"\"", "disabled": "disabled()", "tabIndex": "disabled() ? -1 : 0" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarBtn, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarBtn, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[ngbCalendarBtn]',
@@ -482,15 +482,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                         '[tabIndex]': 'disabled() ? -1 : 0',
                     },
                 }]
-        }] });
+        }], propDecorators: { ngbCalendarBtn: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngbCalendarBtn", required: true }] }] } });
 class CalendarTitle {
     constructor() {
         this.cal = inject(NgbCalendar);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: CalendarTitle, isStandalone: true, selector: "[ngbCalendarTitle]", host: { attributes: { "type": "button" }, listeners: { "click": "cal.toggleView()" }, properties: { "tabIndex": "0" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: CalendarTitle, isStandalone: true, selector: "[ngbCalendarTitle]", host: { attributes: { "type": "button" }, listeners: { "click": "cal.toggleView()" }, properties: { "tabIndex": "0" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarTitle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarTitle, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbCalendarTitle]',
@@ -513,10 +513,10 @@ class CalendarYearBtn {
             this.ally._data.set(this.ngbCalYearBtn());
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarYearBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: CalendarYearBtn, isStandalone: true, selector: "[ngbCalYearBtn]", inputs: { ngbCalYearBtn: { classPropertyName: "ngbCalYearBtn", publicName: "ngbCalYearBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "!ngbCalYearBtn().disabled && cal.selectYear(ngbCalYearBtn().year)" } }, exportAs: ["ngbCalYearBtn"], hostDirectives: [{ directive: i1$1.AccessibleItem }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarYearBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: CalendarYearBtn, isStandalone: true, selector: "[ngbCalYearBtn]", inputs: { ngbCalYearBtn: { classPropertyName: "ngbCalYearBtn", publicName: "ngbCalYearBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "!ngbCalYearBtn().disabled && cal.selectYear(ngbCalYearBtn().year)" } }, exportAs: ["ngbCalYearBtn"], hostDirectives: [{ directive: i1$1.AccessibleItem }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarYearBtn, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarYearBtn, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbCalYearBtn]',
@@ -527,7 +527,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                         '(click)': '!ngbCalYearBtn().disabled && cal.selectYear(ngbCalYearBtn().year)',
                     },
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { ngbCalYearBtn: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngbCalYearBtn", required: true }] }] } });
 class CalendarMonthBtn {
     constructor() {
         this.cal = inject(NgbCalendar);
@@ -542,10 +542,10 @@ class CalendarMonthBtn {
             this.ally._data.set(this.ngbCalMonthBtn());
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarMonthBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: CalendarMonthBtn, isStandalone: true, selector: "[ngbCalMonthBtn]", inputs: { ngbCalMonthBtn: { classPropertyName: "ngbCalMonthBtn", publicName: "ngbCalMonthBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "!ngbCalMonthBtn().disabled && cal.selectMonth(ngbCalMonthBtn())" } }, exportAs: ["ngbCalMonthBtn"], hostDirectives: [{ directive: i1$1.AccessibleItem }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarMonthBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: CalendarMonthBtn, isStandalone: true, selector: "[ngbCalMonthBtn]", inputs: { ngbCalMonthBtn: { classPropertyName: "ngbCalMonthBtn", publicName: "ngbCalMonthBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "!ngbCalMonthBtn().disabled && cal.selectMonth(ngbCalMonthBtn())" } }, exportAs: ["ngbCalMonthBtn"], hostDirectives: [{ directive: i1$1.AccessibleItem }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarMonthBtn, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarMonthBtn, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbCalMonthBtn]',
@@ -556,7 +556,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                         '(click)': '!ngbCalMonthBtn().disabled && cal.selectMonth(ngbCalMonthBtn())',
                     },
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { ngbCalMonthBtn: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngbCalMonthBtn", required: true }] }] } });
 class CalendarDayBtn {
     constructor() {
         this.cal = inject(NgbCalendar);
@@ -580,10 +580,10 @@ class CalendarDayBtn {
             this.ally._skip.set(this.ngbCalDayBtn().disabled);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarDayBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: CalendarDayBtn, isStandalone: true, selector: "[ngbCalDayBtn]", inputs: { ngbCalDayBtn: { classPropertyName: "ngbCalDayBtn", publicName: "ngbCalDayBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "!ngbCalDayBtn().disabled && cal.selectDate(ngbCalDayBtn().day, ngbCalDayBtn().mon)" } }, exportAs: ["ngbCalDayBtn"], hostDirectives: [{ directive: i1$1.AccessibleItem }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarDayBtn, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: CalendarDayBtn, isStandalone: true, selector: "[ngbCalDayBtn]", inputs: { ngbCalDayBtn: { classPropertyName: "ngbCalDayBtn", publicName: "ngbCalDayBtn", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "button" }, listeners: { "click": "!ngbCalDayBtn().disabled && cal.selectDate(ngbCalDayBtn().day, ngbCalDayBtn().mon)" } }, exportAs: ["ngbCalDayBtn"], hostDirectives: [{ directive: i1$1.AccessibleItem }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CalendarDayBtn, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CalendarDayBtn, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbCalDayBtn]',
@@ -594,14 +594,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                         '(click)': '!ngbCalDayBtn().disabled && cal.selectDate(ngbCalDayBtn().day, ngbCalDayBtn().mon)',
                     },
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { ngbCalDayBtn: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngbCalDayBtn", required: true }] }] } });
 class NgbCalendar {
     constructor() {
         this.dir = inject(Directionality);
         this.datePicker = inject(NgbDatePicker);
-        this.days = viewChildren(CalendarDayBtn, ...(ngDevMode ? [{ debugName: "days", read: ElementRef }] : [{
-                read: ElementRef,
-            }]));
+        this.days = viewChildren(CalendarDayBtn, { ...(ngDevMode ? { debugName: "days" } : {}), read: ElementRef });
         this.first = input(false, ...(ngDevMode ? [{ debugName: "first" }] : []));
         this.last = input(false, ...(ngDevMode ? [{ debugName: "last" }] : []));
         this.index = input(0, ...(ngDevMode ? [{ debugName: "index" }] : []));
@@ -840,15 +838,17 @@ class NgbCalendar {
     ngOnDestroy() {
         this.clearListeners();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbCalendar, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.2.0", type: NgbCalendar, isStandalone: true, selector: "ngb-calendar", inputs: { first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, last: { classPropertyName: "last", publicName: "last", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "days", predicate: CalendarDayBtn, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbCalendar, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.1.0", type: NgbCalendar, isStandalone: true, selector: "ngb-calendar", inputs: { first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, last: { classPropertyName: "last", publicName: "last", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "days", predicate: CalendarDayBtn, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbCalendar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbCalendar, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ngb-calendar',
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { days: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => CalendarDayBtn), { ...{
+                            read: ElementRef,
+                        }, isSignal: true }] }], first: [{ type: i0.Input, args: [{ isSignal: true, alias: "first", required: false }] }], last: [{ type: i0.Input, args: [{ isSignal: true, alias: "last", required: false }] }], index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: false }] }] } });
 function aliasCalendar(cal) {
     return {
         provide: NgbCalendar,
@@ -873,10 +873,10 @@ class NgbTimeInput {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbTimeInput, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: NgbTimeInput, isStandalone: true, selector: "[ngbTimeInput]", inputs: { ngbTimeInput: { classPropertyName: "ngbTimeInput", publicName: "ngbTimeInput", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "tel" } }, hostDirectives: [{ directive: i1$2.NumberOnly, inputs: ["value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbTimeInput, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: NgbTimeInput, isStandalone: true, selector: "[ngbTimeInput]", inputs: { ngbTimeInput: { classPropertyName: "ngbTimeInput", publicName: "ngbTimeInput", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "type": "tel" } }, hostDirectives: [{ directive: i1$2.NumberOnly, inputs: ["value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbTimeInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbTimeInput, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbTimeInput]',
@@ -885,12 +885,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImpor
                         type: 'tel',
                     },
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { ngbTimeInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngbTimeInput", required: true }] }] } });
 class NgbTimePicker {
     constructor() {
         this.is24 = input(false, ...(ngDevMode ? [{ debugName: "is24" }] : []));
-        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
-        this.valueChange = output();
+        this.value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
         this.time = computed(() => {
             return (`${padString(this.hours())}:${padString(this.minutes())}:${padString(this.seconds())}` +
                 (!this.is24() ? ` ${this.am() ? 'AM' : 'PM'}` : ''));
@@ -899,18 +900,16 @@ class NgbTimePicker {
         this.minutes = signal('00', ...(ngDevMode ? [{ debugName: "minutes" }] : []));
         this.seconds = signal('00', ...(ngDevMode ? [{ debugName: "seconds" }] : []));
         this.am = signal(true, ...(ngDevMode ? [{ debugName: "am" }] : []));
-        this.onChange = (_) => { };
-        this.onTouched = () => { };
         effect(() => {
-            const value = this.value();
+            const val = this.value();
             untracked(() => {
-                this.parseValue(value);
+                this.parseValue(val);
             });
         });
     }
-    parseValue(value) {
-        if (value) {
-            const [time, period] = value.split(' ');
+    parseValue(val) {
+        if (val) {
+            const [time, period] = val.split(' ');
             const [hours, minutes, seconds = '00'] = time.split(':');
             const am = period === 'AM';
             this.hours.set(padString(hours));
@@ -924,39 +923,21 @@ class NgbTimePicker {
         this.updateValue();
     }
     updateValue() {
-        this.notify(this.time());
-    }
-    notify(time) {
-        this.valueChange.emit(time);
-        this.onChange(time);
-        this.onTouched();
-    }
-    writeValue(value) {
-        if (value) {
-            this.parseValue(value);
-        }
+        const time = this.time();
+        this.value.set(time);
+        this.touched.set(true);
     }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbTimePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: NgbTimePicker, isStandalone: true, selector: "[ngbTime]", inputs: { is24: { classPropertyName: "is24", publicName: "is24", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, providers: [_provide(NgbTimePicker)], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbTimePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.0", type: NgbTimePicker, isStandalone: true, selector: "[ngbTime]", inputs: { is24: { classPropertyName: "is24", publicName: "is24", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbTimePicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgbTimePicker, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbTime]',
-                    providers: [_provide(NgbTimePicker)],
                 }]
-        }], ctorParameters: () => [] });
-function _provide(picker) {
-    return [provideValueAccessor(picker)];
-}
+        }], ctorParameters: () => [], propDecorators: { is24: [{ type: i0.Input, args: [{ isSignal: true, alias: "is24", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 function aliasTimePicker(picker) {
-    return [_provide(picker), { provide: NgbTimePicker, useExisting: picker }];
+    return [{ provide: NgbTimePicker, useExisting: picker }];
 }
 
 /**