@ardium-ui/ui 3.5.5 → 3.6.0

package/fesm2022/ardium-ui-ui.mjs

@@ -4831,10 +4831,11 @@ class _ButtonBase extends _FocusableComponentBase {
         this.color = input(this._DEFAULTS.color);
         this.lightColoring = input(this._DEFAULTS.lightColoring, { transform: v => coerceBooleanProperty(v) });
         this.compact = input(this._DEFAULTS.compact, { transform: v => coerceBooleanProperty(v) });
+        this.pointerEventsWhenDisabled = input(this._DEFAULTS.pointerEventsWhenDisabled, { transform: v => coerceBooleanProperty(v) });
         this._DEFAULTS = defaults;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ButtonBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: _ButtonBase, inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: _ButtonBase, inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, pointerEventsWhenDisabled: { classPropertyName: "pointerEventsWhenDisabled", publicName: "pointerEventsWhenDisabled", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ButtonBase, decorators: [{
             type: Directive
@@ -4907,6 +4908,7 @@ const _simpleButtonDefaults = {
     lightColoring: false,
     compact: false,
     type: ButtonType.Button,
+    pointerEventsWhenDisabled: false,
 };
 const _buttonBaseDefaults = {
     ..._simpleButtonDefaults,
@@ -4946,11 +4948,13 @@ class ArdiumButtonComponent extends _ButtonBase {
         ].join(' '));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonComponent, deps: [{ token: ARD_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumButtonComponent, selector: "ard-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignIcon: { classPropertyName: "alignIcon", publicName: "alignIcon", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumButtonComponent, selector: "ard-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignIcon: { classPropertyName: "alignIcon", publicName: "alignIcon", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-button-with-pointer-events-when-disabled": "pointerEventsWhenDisabled()" } }, usesInheritance: true, ngImport: i0, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ard-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"] }]
+            args: [{ selector: 'ard-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.ard-button-with-pointer-events-when-disabled]': 'pointerEventsWhenDisabled()',
+                    }, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [ARD_BUTTON_DEFAULTS]
@@ -5591,6 +5595,9 @@ class ArdiumIconButtonComponent extends _FocusableComponentBase {
         this.color = input(this._DEFAULTS.color);
         this.lightColoring = input(this._DEFAULTS.lightColoring, { transform: v => coerceBooleanProperty(v) });
         this.compact = input(this._DEFAULTS.compact, { transform: v => coerceBooleanProperty(v) });
+        this.pointerEventsWhenDisabled = input(this._DEFAULTS.pointerEventsWhenDisabled, {
+            transform: v => coerceBooleanProperty(v),
+        });
         this.ngClasses = computed(() => [
             'ard-appearance-transparent',
             `ard-color-${this.disabled() ? ComponentColor.None : this.color()}`,
@@ -5599,11 +5606,13 @@ class ArdiumIconButtonComponent extends _FocusableComponentBase {
         ].join(' '));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonComponent, deps: [{ token: ARD_ICON_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, pointerEventsWhenDisabled: { classPropertyName: "pointerEventsWhenDisabled", publicName: "pointerEventsWhenDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-button-with-pointer-events-when-disabled": "pointerEventsWhenDisabled()" } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ard-icon-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'ard-icon-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.ard-button-with-pointer-events-when-disabled]': 'pointerEventsWhenDisabled()',
+                    }, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [ARD_ICON_BUTTON_DEFAULTS]
@@ -5873,7 +5882,7 @@ class DaysViewComponent {
         this.triggerHighlightSameDayPreviousPage.emit(event.altKey);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DaysViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DaysViewComponent, selector: "ard-days-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, isDayFilteredOut: { classPropertyName: "isDayFilteredOut", publicName: "isDayFilteredOut", isSignal: true, isRequired: true, transformFunction: null }, highlightedDay: { classPropertyName: "highlightedDay", publicName: "highlightedDay", isSignal: true, isRequired: true, transformFunction: null }, firstWeekday: { classPropertyName: "firstWeekday", publicName: "firstWeekday", isSignal: true, isRequired: true, transformFunction: null }, daysViewHeaderTemplate: { classPropertyName: "daysViewHeaderTemplate", publicName: "daysViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, floatingMonthTemplate: { classPropertyName: "floatingMonthTemplate", publicName: "floatingMonthTemplate", isSignal: true, isRequired: true, transformFunction: null }, weekdayTemplate: { classPropertyName: "weekdayTemplate", publicName: "weekdayTemplate", isSignal: true, isRequired: true, transformFunction: null }, dayTemplate: { classPropertyName: "dayTemplate", publicName: "dayTemplate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenYearsView: "triggerOpenYearsView", triggerOpenMonthsView: "triggerOpenMonthsView", triggerSelectDay: "triggerSelectDay", triggerChangeMonth: "triggerChangeMonth", triggerChangeYear: "triggerChangeYear", triggerHighlightDay: "triggerHighlightDay", triggerHighlightNextDay: "triggerHighlightNextDay", triggerHighlightPreviousDay: "triggerHighlightPreviousDay", triggerHighlightFirstDay: "triggerHighlightFirstDay", triggerHighlightLastDay: "triggerHighlightLastDay", triggerHighlightSameDayPreviousPage: "triggerHighlightSameDayPreviousPage", triggerHighlightSameDayNextPage: "triggerHighlightSameDayNextPage", focusEvent: "focus", blurEvent: "blur" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-days-view\">\r\n  @if (!readOnly()) {\r\n  <div class=\"ard-calendar__top-toolbar\">\r\n    <ng-template\r\n      #defaultDaysViewHeaderTemplate\r\n      let-currDate\r\n      let-nextMonth=\"nextMonth\"\r\n      let-prevMonth=\"prevMonth\"\r\n      let-canGoToNextMonth=\"canGoToNextPage\"\r\n      let-canGoToPreviousMonth=\"canGoToPreviousPage\"\r\n      let-openYearsView=\"openYearsView\"\r\n    >\r\n      <div class=\"ard-calendar__calendar-header\">\r\n        <ard-button\r\n          class=\"ard-calendar__header-button\"\r\n          appearance=\"transparent\"\r\n          color=\"none\"\r\n          variant=\"pill\"\r\n          [tabIndex]=\"tabIndex()\"\r\n          (click)=\"openYearsView()\"\r\n        >\r\n          {{ currDate | date : 'MMM YYYY' | uppercase }}\r\n          <div class=\"ard-dropdown-arrow\"></div>\r\n        </ard-button>\r\n        <div class=\"ard-calendar__arrows\">\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"prevMonth()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToPreviousMonth\"\r\n          >\r\n            <ard-icon>chevron_left</ard-icon>\r\n          </ard-icon-button>\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"nextMonth()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToNextMonth\"\r\n          >\r\n            <ard-icon>chevron_right</ard-icon>\r\n          </ard-icon-button>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"daysViewHeaderTemplate() || defaultDaysViewHeaderTemplate\"\r\n      [ngTemplateOutletContext]=\"daysViewHeaderContext()\"\r\n    />\r\n  </div>\r\n  }\r\n  <div class=\"ard-calendar__weekdays\">\r\n    <ng-template\r\n      #defaultWeekdayTemplate\r\n      let-date\r\n    >\r\n      <div class=\"ard-calendar__weekday\">{{ date | date : 'EEEEE' }}</div>\r\n    </ng-template>\r\n    @for (weekdayIndex of weekdayArray(); track weekdayIndex) {\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"weekdayTemplate() || defaultWeekdayTemplate\"\r\n      [ngTemplateOutletContext]=\"weekdayContext()(weekdayIndex)\"\r\n    ></ng-template>\r\n    }\r\n  </div>\r\n  <div\r\n    #focusableElement\r\n    class=\"ard-calendar__days-grid\"\r\n    [class.ard-reserve-top-row]=\"reserveTopRow()\"\r\n    [tabindex]=\"tabIndex()\"\r\n    [ariaLabel]=\"currentAriaLabel()\"\r\n    (focus)=\"focusEvent.emit($event)\"\r\n    (focus)=\"onDayGridFocus()\"\r\n    (blur)=\"blurEvent.emit($event)\"\r\n    (blur)=\"onDayGridBlur()\"\r\n    (click)=\"onDayGridClick()\"\r\n    (keydown)=\"onMainGridKeydown($event)\"\r\n    role=\"grid\"\r\n  >\r\n    <div class=\"ard-calendar__floating-month\">\r\n      <ng-template\r\n        #defaultFloatingMonthTemplate\r\n        let-date\r\n      >\r\n        {{ date | date : 'LLL' | uppercase }}\r\n      </ng-template>\r\n\r\n      <ng-template\r\n        [ngTemplateOutlet]=\"floatingMonthTemplate() || defaultFloatingMonthTemplate\"\r\n        [ngTemplateOutletContext]=\"floatingMonthContext()\"\r\n      ></ng-template>\r\n    </div>\r\n    @for (week of activeCalendarData().array; track $index) { @for (day of week; track day ? day :\r\n    activeCalendarData().leadingSpaces - $index) { @if (day === null) {\r\n    <div class=\"ard-calendar__entry ard-calendar__entry-empty\"></div>\r\n    } @else {\r\n    <div\r\n      class=\"ard-calendar__entry\"\r\n      [class.ard-calendar__entry-highlighted]=\"highlightedDay() === day.value\"\r\n      [class.ard-calendar__entry-disabled]=\"day.disabled || isDayFilteredOut()(day.value)\"\r\n      [class.ard-calendar__entry-selected]=\"isDaySelected(day.value)\"\r\n      [class.ard-calendar-today]=\"isDayToday(day.value)\"\r\n      (click)=\"onCalendarDayClick(day.value)\"\r\n      (mousemove)=\"$event.stopPropagation()\"\r\n      (mouseover)=\"onCalendarDayMouseover(day.value)\"\r\n      role=\"gridcell\"\r\n    >\r\n      <div class=\"ard-calendar__entry-button\">\r\n        <div class=\"ard-focus-overlay\"></div>\r\n        <div class=\"ard-button-content\">\r\n          <ng-template\r\n            #defaultDayTemplate\r\n            let-day\r\n          >\r\n            {{ day }}\r\n          </ng-template>\r\n          <ng-template\r\n            [ngTemplateOutlet]=\"dayTemplate() || defaultDayTemplate\"\r\n            [ngTemplateOutletContext]=\"dayContext()(day.value)\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n    } } }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DaysViewComponent, selector: "ard-days-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, isDayFilteredOut: { classPropertyName: "isDayFilteredOut", publicName: "isDayFilteredOut", isSignal: true, isRequired: true, transformFunction: null }, highlightedDay: { classPropertyName: "highlightedDay", publicName: "highlightedDay", isSignal: true, isRequired: true, transformFunction: null }, firstWeekday: { classPropertyName: "firstWeekday", publicName: "firstWeekday", isSignal: true, isRequired: true, transformFunction: null }, daysViewHeaderTemplate: { classPropertyName: "daysViewHeaderTemplate", publicName: "daysViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, floatingMonthTemplate: { classPropertyName: "floatingMonthTemplate", publicName: "floatingMonthTemplate", isSignal: true, isRequired: true, transformFunction: null }, weekdayTemplate: { classPropertyName: "weekdayTemplate", publicName: "weekdayTemplate", isSignal: true, isRequired: true, transformFunction: null }, dayTemplate: { classPropertyName: "dayTemplate", publicName: "dayTemplate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenYearsView: "triggerOpenYearsView", triggerOpenMonthsView: "triggerOpenMonthsView", triggerSelectDay: "triggerSelectDay", triggerChangeMonth: "triggerChangeMonth", triggerChangeYear: "triggerChangeYear", triggerHighlightDay: "triggerHighlightDay", triggerHighlightNextDay: "triggerHighlightNextDay", triggerHighlightPreviousDay: "triggerHighlightPreviousDay", triggerHighlightFirstDay: "triggerHighlightFirstDay", triggerHighlightLastDay: "triggerHighlightLastDay", triggerHighlightSameDayPreviousPage: "triggerHighlightSameDayPreviousPage", triggerHighlightSameDayNextPage: "triggerHighlightSameDayNextPage", focusEvent: "focus", blurEvent: "blur" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-days-view\">\r\n  @if (!readOnly()) {\r\n  <div class=\"ard-calendar__top-toolbar\">\r\n    <ng-template\r\n      #defaultDaysViewHeaderTemplate\r\n      let-currDate\r\n      let-nextMonth=\"nextMonth\"\r\n      let-prevMonth=\"prevMonth\"\r\n      let-canGoToNextMonth=\"canGoToNextPage\"\r\n      let-canGoToPreviousMonth=\"canGoToPreviousPage\"\r\n      let-openYearsView=\"openYearsView\"\r\n    >\r\n      <div class=\"ard-calendar__calendar-header\">\r\n        <ard-button\r\n          class=\"ard-calendar__header-button\"\r\n          appearance=\"transparent\"\r\n          color=\"none\"\r\n          variant=\"pill\"\r\n          [tabIndex]=\"tabIndex()\"\r\n          (click)=\"openYearsView()\"\r\n        >\r\n          {{ currDate | date : 'MMM YYYY' | uppercase }}\r\n          <div class=\"ard-dropdown-arrow\"></div>\r\n        </ard-button>\r\n        <div class=\"ard-calendar__arrows\">\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"prevMonth()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToPreviousMonth\"\r\n          >\r\n            <ard-icon>chevron_left</ard-icon>\r\n          </ard-icon-button>\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"nextMonth()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToNextMonth\"\r\n          >\r\n            <ard-icon>chevron_right</ard-icon>\r\n          </ard-icon-button>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"daysViewHeaderTemplate() || defaultDaysViewHeaderTemplate\"\r\n      [ngTemplateOutletContext]=\"daysViewHeaderContext()\"\r\n    />\r\n  </div>\r\n  }\r\n  <div class=\"ard-calendar__weekdays\">\r\n    <ng-template\r\n      #defaultWeekdayTemplate\r\n      let-date\r\n    >\r\n      <div class=\"ard-calendar__weekday\">{{ date | date : 'EEEEE' }}</div>\r\n    </ng-template>\r\n    @for (weekdayIndex of weekdayArray(); track weekdayIndex) {\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"weekdayTemplate() || defaultWeekdayTemplate\"\r\n      [ngTemplateOutletContext]=\"weekdayContext()(weekdayIndex)\"\r\n    ></ng-template>\r\n    }\r\n  </div>\r\n  <div\r\n    #focusableElement\r\n    class=\"ard-calendar__days-grid\"\r\n    [class.ard-reserve-top-row]=\"reserveTopRow()\"\r\n    [tabindex]=\"tabIndex()\"\r\n    [ariaLabel]=\"currentAriaLabel()\"\r\n    (focus)=\"focusEvent.emit($event)\"\r\n    (focus)=\"onDayGridFocus()\"\r\n    (blur)=\"blurEvent.emit($event)\"\r\n    (blur)=\"onDayGridBlur()\"\r\n    (click)=\"onDayGridClick()\"\r\n    (keydown)=\"onMainGridKeydown($event)\"\r\n    role=\"grid\"\r\n  >\r\n    <div class=\"ard-calendar__floating-month\">\r\n      <ng-template\r\n        #defaultFloatingMonthTemplate\r\n        let-date\r\n      >\r\n        {{ date | date : 'LLL' | uppercase }}\r\n      </ng-template>\r\n\r\n      <ng-template\r\n        [ngTemplateOutlet]=\"floatingMonthTemplate() || defaultFloatingMonthTemplate\"\r\n        [ngTemplateOutletContext]=\"floatingMonthContext()\"\r\n      ></ng-template>\r\n    </div>\r\n    @for (week of activeCalendarData().array; track $index) { @for (day of week; track day ? day :\r\n    activeCalendarData().leadingSpaces - $index) { @if (day === null) {\r\n    <div class=\"ard-calendar__entry ard-calendar__entry-empty\"></div>\r\n    } @else {\r\n    <div\r\n      class=\"ard-calendar__entry\"\r\n      [class.ard-calendar__entry-highlighted]=\"highlightedDay() === day.value\"\r\n      [class.ard-calendar__entry-disabled]=\"day.disabled || isDayFilteredOut()(day.value)\"\r\n      [class.ard-calendar__entry-selected]=\"isDaySelected(day.value)\"\r\n      [class.ard-calendar-today]=\"isDayToday(day.value)\"\r\n      (click)=\"onCalendarDayClick(day.value)\"\r\n      (mousemove)=\"$event.stopPropagation()\"\r\n      (mouseover)=\"onCalendarDayMouseover(day.value)\"\r\n      role=\"gridcell\"\r\n    >\r\n      <div class=\"ard-calendar__entry-button\">\r\n        <div class=\"ard-focus-overlay\"></div>\r\n        <div class=\"ard-button-content\">\r\n          <ng-template\r\n            #defaultDayTemplate\r\n            let-day\r\n          >\r\n            {{ day }}\r\n          </ng-template>\r\n          <ng-template\r\n            [ngTemplateOutlet]=\"dayTemplate() || defaultDayTemplate\"\r\n            [ngTemplateOutletContext]=\"dayContext()(day.value)\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n    } } }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DaysViewComponent, decorators: [{
             type: Component,
@@ -6109,7 +6118,7 @@ class MonthsViewComponent {
         return isYearOutOfRange(year, this.min(), this.max());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MonthsViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MonthsViewComponent, selector: "ard-months-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, highlightedMonth: { classPropertyName: "highlightedMonth", publicName: "highlightedMonth", isSignal: true, isRequired: true, transformFunction: null }, monthsViewHeaderTemplate: { classPropertyName: "monthsViewHeaderTemplate", publicName: "monthsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, monthTemplate: { classPropertyName: "monthTemplate", publicName: "monthTemplate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenYearsView: "triggerOpenYearsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectMonth: "triggerSelectMonth", triggeChangeYear: "triggeChangeYear", triggerHighlightMonth: "triggerHighlightMonth", triggerHighlightNextMonth: "triggerHighlightNextMonth", triggerHighlightPreviousMonth: "triggerHighlightPreviousMonth", triggerHighlightFirstMonth: "triggerHighlightFirstMonth", triggerHighlightLastMonth: "triggerHighlightLastMonth", triggerHighlightSameMonthPreviousPage: "triggerHighlightSameMonthPreviousPage", triggerHighlightSameMonthNextPage: "triggerHighlightSameMonthNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-months-view\">\r\n  @if (!readOnly()) {\r\n  <div class=\"ard-calendar__top-toolbar\">\r\n    <ng-template\r\n      #defaultMonthsViewHeaderTemplate\r\n      let-year\r\n      let-nextPage=\"nextPage\"\r\n      let-prevPage=\"prevPage\"\r\n      let-canGoToNextPage=\"canGoToNextPage\"\r\n      let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n      let-openDaysView=\"openDaysView\"\r\n    >\r\n      <div class=\"ard-calendar__calendar-header\">\r\n        <ard-button\r\n          class=\"ard-calendar__header-button\"\r\n          appearance=\"transparent\"\r\n          [color]=\"color()\"\r\n          [tabIndex]=\"tabIndex()\"\r\n          (click)=\"openDaysView()\"\r\n        >\r\n          {{ year }}\r\n          <div class=\"ard-dropdown-arrow\"></div>\r\n        </ard-button>\r\n        <div class=\"ard-calendar-arrows\">\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"prevPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToPreviousPage\"\r\n          >\r\n            <ard-icon>chevron_left</ard-icon>\r\n          </ard-icon-button>\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"nextPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToNextPage\"\r\n          >\r\n            <ard-icon>chevron_right</ard-icon>\r\n          </ard-icon-button>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"monthsViewHeaderTemplate() || defaultMonthsViewHeaderTemplate\"\r\n      [ngTemplateOutletContext]=\"monthsViewHeaderContext()\"\r\n    />\r\n  </div>\r\n  }\r\n  <div\r\n    #focusableElement\r\n    class=\"ard-calendar__simple-grid\"\r\n    [tabindex]=\"tabIndex()\"\r\n    [ariaLabel]=\"currentAriaLabel()\"\r\n    (focus)=\"focusEvent.emit($event)\"\r\n    (focus)=\"onMonthGridFocus()\"\r\n    (blur)=\"blurEvent.emit($event)\"\r\n    (blur)=\"onMonthGridBlur()\"\r\n    (click)=\"onMonthGridClick()\"\r\n    (keydown)=\"onMainGridKeydown($event)\"\r\n    role=\"grid\"\r\n  >\r\n    @for (month of monthsArray(); track $index) {\r\n    <div\r\n      class=\"ard-calendar__entry\"\r\n      [class.ard-calendar__entry-highlighted]=\"highlightedMonth() === month.value\"\r\n      [class.ard-calendar__entry-disabled]=\"month.disabled\"\r\n      [class.ard-calendar__entry-selected]=\"isMonthSelected(month.value)\"\r\n      [class.ard-calendar-today]=\"isMonthToday(month.value)\"\r\n      (click)=\"onCalendarMonthClick(month.value)\"\r\n      (mousemove)=\"$event.stopPropagation()\"\r\n      (mouseover)=\"onCalendarMonthMouseover(month.value)\"\r\n      role=\"gridcell\"\r\n    >\r\n      <button\r\n        type=\"button\"\r\n        class=\"ard-calendar__entry-button\"\r\n        tabindex=\"-1\"\r\n      >\r\n        <div class=\"ard-focus-overlay\"></div>\r\n        <div class=\"ard-button-content\">\r\n          <ng-template\r\n            #defaultMonthTemplate\r\n            let-month\r\n          >\r\n            {{ month | date : 'MMM' | uppercase }}\r\n          </ng-template>\r\n          <ng-template\r\n            [ngTemplateOutlet]=\"monthTemplate() || defaultMonthTemplate\"\r\n            [ngTemplateOutletContext]=\"monthContext()(month.value)\"\r\n          />\r\n        </div>\r\n      </button>\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MonthsViewComponent, selector: "ard-months-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, highlightedMonth: { classPropertyName: "highlightedMonth", publicName: "highlightedMonth", isSignal: true, isRequired: true, transformFunction: null }, monthsViewHeaderTemplate: { classPropertyName: "monthsViewHeaderTemplate", publicName: "monthsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, monthTemplate: { classPropertyName: "monthTemplate", publicName: "monthTemplate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenYearsView: "triggerOpenYearsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectMonth: "triggerSelectMonth", triggeChangeYear: "triggeChangeYear", triggerHighlightMonth: "triggerHighlightMonth", triggerHighlightNextMonth: "triggerHighlightNextMonth", triggerHighlightPreviousMonth: "triggerHighlightPreviousMonth", triggerHighlightFirstMonth: "triggerHighlightFirstMonth", triggerHighlightLastMonth: "triggerHighlightLastMonth", triggerHighlightSameMonthPreviousPage: "triggerHighlightSameMonthPreviousPage", triggerHighlightSameMonthNextPage: "triggerHighlightSameMonthNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-months-view\">\r\n  @if (!readOnly()) {\r\n  <div class=\"ard-calendar__top-toolbar\">\r\n    <ng-template\r\n      #defaultMonthsViewHeaderTemplate\r\n      let-year\r\n      let-nextPage=\"nextPage\"\r\n      let-prevPage=\"prevPage\"\r\n      let-canGoToNextPage=\"canGoToNextPage\"\r\n      let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n      let-openDaysView=\"openDaysView\"\r\n    >\r\n      <div class=\"ard-calendar__calendar-header\">\r\n        <ard-button\r\n          class=\"ard-calendar__header-button\"\r\n          appearance=\"transparent\"\r\n          [color]=\"color()\"\r\n          [tabIndex]=\"tabIndex()\"\r\n          (click)=\"openDaysView()\"\r\n        >\r\n          {{ year }}\r\n          <div class=\"ard-dropdown-arrow\"></div>\r\n        </ard-button>\r\n        <div class=\"ard-calendar-arrows\">\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"prevPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToPreviousPage\"\r\n          >\r\n            <ard-icon>chevron_left</ard-icon>\r\n          </ard-icon-button>\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"nextPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToNextPage\"\r\n          >\r\n            <ard-icon>chevron_right</ard-icon>\r\n          </ard-icon-button>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"monthsViewHeaderTemplate() || defaultMonthsViewHeaderTemplate\"\r\n      [ngTemplateOutletContext]=\"monthsViewHeaderContext()\"\r\n    />\r\n  </div>\r\n  }\r\n  <div\r\n    #focusableElement\r\n    class=\"ard-calendar__simple-grid\"\r\n    [tabindex]=\"tabIndex()\"\r\n    [ariaLabel]=\"currentAriaLabel()\"\r\n    (focus)=\"focusEvent.emit($event)\"\r\n    (focus)=\"onMonthGridFocus()\"\r\n    (blur)=\"blurEvent.emit($event)\"\r\n    (blur)=\"onMonthGridBlur()\"\r\n    (click)=\"onMonthGridClick()\"\r\n    (keydown)=\"onMainGridKeydown($event)\"\r\n    role=\"grid\"\r\n  >\r\n    @for (month of monthsArray(); track $index) {\r\n    <div\r\n      class=\"ard-calendar__entry\"\r\n      [class.ard-calendar__entry-highlighted]=\"highlightedMonth() === month.value\"\r\n      [class.ard-calendar__entry-disabled]=\"month.disabled\"\r\n      [class.ard-calendar__entry-selected]=\"isMonthSelected(month.value)\"\r\n      [class.ard-calendar-today]=\"isMonthToday(month.value)\"\r\n      (click)=\"onCalendarMonthClick(month.value)\"\r\n      (mousemove)=\"$event.stopPropagation()\"\r\n      (mouseover)=\"onCalendarMonthMouseover(month.value)\"\r\n      role=\"gridcell\"\r\n    >\r\n      <button\r\n        type=\"button\"\r\n        class=\"ard-calendar__entry-button\"\r\n        tabindex=\"-1\"\r\n      >\r\n        <div class=\"ard-focus-overlay\"></div>\r\n        <div class=\"ard-button-content\">\r\n          <ng-template\r\n            #defaultMonthTemplate\r\n            let-month\r\n          >\r\n            {{ month | date : 'MMM' | uppercase }}\r\n          </ng-template>\r\n          <ng-template\r\n            [ngTemplateOutlet]=\"monthTemplate() || defaultMonthTemplate\"\r\n            [ngTemplateOutletContext]=\"monthContext()(month.value)\"\r\n          />\r\n        </div>\r\n      </button>\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MonthsViewComponent, decorators: [{
             type: Component,
@@ -6345,7 +6354,7 @@ class YearsViewComponent {
         this.triggerHighlightSameYearNextPage.emit(event.altKey);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: YearsViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: YearsViewComponent, selector: "ard-years-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, currentYearRangeStart: { classPropertyName: "currentYearRangeStart", publicName: "currentYearRangeStart", isSignal: true, isRequired: true, transformFunction: null }, highlightedYear: { classPropertyName: "highlightedYear", publicName: "highlightedYear", isSignal: true, isRequired: true, transformFunction: null }, yearsViewHeaderTemplate: { classPropertyName: "yearsViewHeaderTemplate", publicName: "yearsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, yearTemplate: { classPropertyName: "yearTemplate", publicName: "yearTemplate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenMonthsView: "triggerOpenMonthsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectYear: "triggerSelectYear", triggerChangeYearsViewPage: "triggerChangeYearsViewPage", triggerHighlightYear: "triggerHighlightYear", triggerHighlightNextYear: "triggerHighlightNextYear", triggerHighlightPreviousYear: "triggerHighlightPreviousYear", triggerHighlightFirstYear: "triggerHighlightFirstYear", triggerHighlightLastYear: "triggerHighlightLastYear", triggerHighlightSameYearPreviousPage: "triggerHighlightSameYearPreviousPage", triggerHighlightSameYearNextPage: "triggerHighlightSameYearNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-years-view\">\r\n  @if (!readOnly()) {\r\n  <div class=\"ard-calendar__top-toolbar\">\r\n    <ng-template\r\n      #defaultYearsViewHeaderTemplate\r\n      let-dateRange=\"dateRange\"\r\n      let-nextPage=\"nextPage\"\r\n      let-prevPage=\"prevPage\"\r\n      let-canGoToNextPage=\"canGoToNextPage\"\r\n      let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n      let-openDaysView=\"openDaysView\"\r\n    >\r\n      <div class=\"ard-calendar__calendar-header\">\r\n        <ard-button\r\n          class=\"ard-calendar__header-button\"\r\n          appearance=\"transparent\"\r\n          color=\"none\"\r\n          [tabIndex]=\"tabIndex()\"\r\n          (click)=\"openDaysView()\"\r\n          variant=\"pill\"\r\n        >\r\n          {{ dateRange.low | date : 'YYYY' }}\r\n          &mdash;\r\n          {{ dateRange.high | date : 'YYYY' }}\r\n          <div class=\"ard-dropdown-arrow\"></div>\r\n        </ard-button>\r\n        <div class=\"ard-calendar-arrows\">\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"prevPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToPreviousPage\"\r\n          >\r\n            <ard-icon>chevron_left</ard-icon>\r\n          </ard-icon-button>\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"nextPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToNextPage\"\r\n          >\r\n            <ard-icon>chevron_right</ard-icon>\r\n          </ard-icon-button>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"yearsViewHeaderTemplate() || defaultYearsViewHeaderTemplate\"\r\n      [ngTemplateOutletContext]=\"yearsViewHeaderContext()\"\r\n    />\r\n  </div>\r\n  }\r\n  <div\r\n    #focusableElement\r\n    class=\"ard-calendar__simple-grid\"\r\n    [tabindex]=\"tabIndex()\"\r\n    [ariaLabel]=\"currentAriaLabel()\"\r\n    (focus)=\"focusEvent.emit($event)\"\r\n    (focus)=\"onYearGridFocus()\"\r\n    (blur)=\"blurEvent.emit($event)\"\r\n    (blur)=\"onYearGridBlur()\"\r\n    (click)=\"onYearGridClick()\"\r\n    (keydown)=\"onMainGridKeydown($event)\"\r\n    role=\"grid\"\r\n  >\r\n    @for (year of yearsArray(); track year) {\r\n    <div\r\n      class=\"ard-calendar__entry\"\r\n      [class.ard-calendar__entry-highlighted]=\"highlightedYear() === year.value\"\r\n      [class.ard-calendar__entry-disabled]=\"year.disabled\"\r\n      [class.ard-calendar__entry-selected]=\"isYearSelected(year.value)\"\r\n      [class.ard-calendar-today]=\"isYearToday(year.value)\"\r\n      (click)=\"onCalendarYearClick(year.value)\"\r\n      (mousemove)=\"$event.stopPropagation()\"\r\n      (mouseover)=\"onCalendarYearMouseover(year.value)\"\r\n      role=\"gridcell\"\r\n    >\r\n      <button\r\n        type=\"button\"\r\n        class=\"ard-calendar__entry-button\"\r\n        tabindex=\"-1\"\r\n        aria-hidden=\"true\"\r\n      >\r\n        <div class=\"ard-focus-overlay\"></div>\r\n        <div class=\"ard-button-content\">\r\n          <ng-template\r\n            #defaultYearTemplate\r\n            let-year\r\n          >\r\n            {{ year | date : 'YYYY' }}\r\n          </ng-template>\r\n          <ng-template\r\n            [ngTemplateOutlet]=\"yearTemplate() || defaultYearTemplate\"\r\n            [ngTemplateOutletContext]=\"yearContext()(year.value)\"\r\n          />\r\n        </div>\r\n      </button>\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: YearsViewComponent, selector: "ard-years-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, currentYearRangeStart: { classPropertyName: "currentYearRangeStart", publicName: "currentYearRangeStart", isSignal: true, isRequired: true, transformFunction: null }, highlightedYear: { classPropertyName: "highlightedYear", publicName: "highlightedYear", isSignal: true, isRequired: true, transformFunction: null }, yearsViewHeaderTemplate: { classPropertyName: "yearsViewHeaderTemplate", publicName: "yearsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, yearTemplate: { classPropertyName: "yearTemplate", publicName: "yearTemplate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenMonthsView: "triggerOpenMonthsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectYear: "triggerSelectYear", triggerChangeYearsViewPage: "triggerChangeYearsViewPage", triggerHighlightYear: "triggerHighlightYear", triggerHighlightNextYear: "triggerHighlightNextYear", triggerHighlightPreviousYear: "triggerHighlightPreviousYear", triggerHighlightFirstYear: "triggerHighlightFirstYear", triggerHighlightLastYear: "triggerHighlightLastYear", triggerHighlightSameYearPreviousPage: "triggerHighlightSameYearPreviousPage", triggerHighlightSameYearNextPage: "triggerHighlightSameYearNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-years-view\">\r\n  @if (!readOnly()) {\r\n  <div class=\"ard-calendar__top-toolbar\">\r\n    <ng-template\r\n      #defaultYearsViewHeaderTemplate\r\n      let-dateRange=\"dateRange\"\r\n      let-nextPage=\"nextPage\"\r\n      let-prevPage=\"prevPage\"\r\n      let-canGoToNextPage=\"canGoToNextPage\"\r\n      let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n      let-openDaysView=\"openDaysView\"\r\n    >\r\n      <div class=\"ard-calendar__calendar-header\">\r\n        <ard-button\r\n          class=\"ard-calendar__header-button\"\r\n          appearance=\"transparent\"\r\n          color=\"none\"\r\n          [tabIndex]=\"tabIndex()\"\r\n          (click)=\"openDaysView()\"\r\n          variant=\"pill\"\r\n        >\r\n          {{ dateRange.low | date : 'YYYY' }}\r\n          &mdash;\r\n          {{ dateRange.high | date : 'YYYY' }}\r\n          <div class=\"ard-dropdown-arrow\"></div>\r\n        </ard-button>\r\n        <div class=\"ard-calendar-arrows\">\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"prevPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToPreviousPage\"\r\n          >\r\n            <ard-icon>chevron_left</ard-icon>\r\n          </ard-icon-button>\r\n          <ard-icon-button\r\n            size=\"small\"\r\n            appearance=\"transparent\"\r\n            color=\"none\"\r\n            (click)=\"nextPage()\"\r\n            [tabIndex]=\"tabIndex()\"\r\n            [disabled]=\"!canGoToNextPage\"\r\n          >\r\n            <ard-icon>chevron_right</ard-icon>\r\n          </ard-icon-button>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      [ngTemplateOutlet]=\"yearsViewHeaderTemplate() || defaultYearsViewHeaderTemplate\"\r\n      [ngTemplateOutletContext]=\"yearsViewHeaderContext()\"\r\n    />\r\n  </div>\r\n  }\r\n  <div\r\n    #focusableElement\r\n    class=\"ard-calendar__simple-grid\"\r\n    [tabindex]=\"tabIndex()\"\r\n    [ariaLabel]=\"currentAriaLabel()\"\r\n    (focus)=\"focusEvent.emit($event)\"\r\n    (focus)=\"onYearGridFocus()\"\r\n    (blur)=\"blurEvent.emit($event)\"\r\n    (blur)=\"onYearGridBlur()\"\r\n    (click)=\"onYearGridClick()\"\r\n    (keydown)=\"onMainGridKeydown($event)\"\r\n    role=\"grid\"\r\n  >\r\n    @for (year of yearsArray(); track year) {\r\n    <div\r\n      class=\"ard-calendar__entry\"\r\n      [class.ard-calendar__entry-highlighted]=\"highlightedYear() === year.value\"\r\n      [class.ard-calendar__entry-disabled]=\"year.disabled\"\r\n      [class.ard-calendar__entry-selected]=\"isYearSelected(year.value)\"\r\n      [class.ard-calendar-today]=\"isYearToday(year.value)\"\r\n      (click)=\"onCalendarYearClick(year.value)\"\r\n      (mousemove)=\"$event.stopPropagation()\"\r\n      (mouseover)=\"onCalendarYearMouseover(year.value)\"\r\n      role=\"gridcell\"\r\n    >\r\n      <button\r\n        type=\"button\"\r\n        class=\"ard-calendar__entry-button\"\r\n        tabindex=\"-1\"\r\n        aria-hidden=\"true\"\r\n      >\r\n        <div class=\"ard-focus-overlay\"></div>\r\n        <div class=\"ard-button-content\">\r\n          <ng-template\r\n            #defaultYearTemplate\r\n            let-year\r\n          >\r\n            {{ year | date : 'YYYY' }}\r\n          </ng-template>\r\n          <ng-template\r\n            [ngTemplateOutlet]=\"yearTemplate() || defaultYearTemplate\"\r\n            [ngTemplateOutletContext]=\"yearContext()(year.value)\"\r\n          />\r\n        </div>\r\n      </button>\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: YearsViewComponent, decorators: [{
             type: Component,
@@ -7110,7 +7119,7 @@ class ArdiumDateInputComponent extends _FormFieldComponentBase {
                 provide: _FormFieldComponentBase,
                 useExisting: ArdiumDateInputComponent,
             },
-        ], queries: [{ propertyName: "valueTemplate", first: true, predicate: ArdDateInputValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarIconTemplate", first: true, predicate: ArdDateInputCalendarIconTemplateDirective, descendants: true, isSignal: true }, { propertyName: "acceptButtonsTemplate", first: true, predicate: ArdDateInputAcceptButtonsTemplateDirective, descendants: true, isSignal: true }, { propertyName: "prefixTemplate", first: true, predicate: ArdDateInputPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdDateInputSuffixTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true, isSignal: true }, { propertyName: "dropdownHost", first: true, predicate: ["dropdownHost"], descendants: true, isSignal: true }, { propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, isSignal: true }, { propertyName: "dropdownPanel", first: true, predicate: ArdiumDropdownPanelComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\r\n  [appearance]=\"appearance()\"\r\n  [variant]=\"variant()\"\r\n  [compact]=\"compact()\"\r\n  [isFocused]=\"isFocused()\"\r\n  [hasError]=\"hasError()\"\r\n  [isSuccess]=\"isSuccess()\"\r\n  [prefixTemplate]=\"prefixTemplate()?.template\"\r\n  [suffixTemplate]=\"suffixTemplate()?.template\"\r\n>\r\n  <div\r\n    class=\"ard-date-input\"\r\n    #dropdownHost\r\n    (click)=\"onGeneralClick($event)\"\r\n    [class.ard-has-value]=\"!!value()\"\r\n    [ngClass]=\"ngClasses()\"\r\n  >\r\n    <div class=\"ard-date-input__value-container ard-input-container\">\r\n      <div\r\n        class=\"ard-date-input__placeholder ard-placeholder\"\r\n        [class.ard-date-input__placeholder-hidden]=\"!shouldDisplayPlaceholder()\"\r\n      >\r\n        {{ placeholder() }}\r\n      </div>\r\n      <div\r\n        class=\"ard-date-input__value\"\r\n        [class.ard-date-input__value-hidden]=\"!shouldDisplayValue()\"\r\n      >\r\n        <ng-template\r\n          #defaultValueTemplate\r\n          let-date\r\n        >\r\n          {{ serializeFn()(date) }}\r\n        </ng-template>\r\n\r\n        <ng-template\r\n          [ngTemplateOutlet]=\"valueTemplate()?.template || defaultValueTemplate\"\r\n          [ngTemplateOutletContext]=\"valueContext()\"\r\n        />\r\n      </div>\r\n      <div\r\n        class=\"ard-date-input__input-container\"\r\n        role=\"combobox\"\r\n        aria-haspopup=\"listbox\"\r\n        [attr.aria-expanded]=\"isOpen()\"\r\n        [attr.aria-owns]=\"isOpen() ? htmlId() : null\"\r\n        [class.ard-date-input__input-container-hidden]=\"!shouldDisplayDateInput()\"\r\n      >\r\n        <input\r\n          #dateInput\r\n          #focusableElement\r\n          type=\"text\"\r\n          class=\"ard-date-input__input\"\r\n          [attr.tabindex]=\"tabIndex()\"\r\n          [value]=\"dateInputValue()\"\r\n          [attr.aria-controls]=\"isOpen() ? htmlId() : null\"\r\n          (input)=\"onDateInputInput($event)\"\r\n          (change)=\"$event.stopPropagation()\"\r\n          (focus)=\"onDateInputFocus($event)\"\r\n          (blur)=\"onDateInputBlur($event)\"\r\n          (keydown)=\"onDateInputEnter($event)\"\r\n        />\r\n      </div>\r\n    </div>\r\n\r\n    @if (!calendarHidden()) {\r\n    <ard-icon-button\r\n      color=\"none\"\r\n      [disabled]=\"calendarDisabled()\"\r\n      (click)=\"onCalendarButtonClick($event)\"\r\n    >\r\n      <ng-template\r\n        #defaultCalendarIconTemplate\r\n        let-date\r\n      >\r\n        <ard-icon filled>today</ard-icon>\r\n      </ng-template>\r\n\r\n      <ng-template [ngTemplateOutlet]=\"calendarIconTemplate()?.template || defaultCalendarIconTemplate\" />\r\n    </ard-icon-button>\r\n    }\r\n  </div>\r\n</ard-form-field-frame>\r\n\r\n<ng-template #dropdownTemplate>\r\n  <ard-dropdown-panel\r\n    class=\"ard-dropdown-panel ard-date-input__dropdown-panel\"\r\n    [appearance]=\"dropdownAppearanceOrDefault()\"\r\n    [variant]=\"dropdownVariantOrDefault()\"\r\n    [isOpen]=\"true\"\r\n    [panelId]=\"htmlId()\"\r\n    [compact]=\"compact()\"\r\n    (ardClickOutside)=\"onOutsideClick($event)\"\r\n  >\r\n    <ard-calendar\r\n      class=\"ard-date-input__calendar\"\r\n      [(activeMonth)]=\"activeMonth\"\r\n      [(activeYear)]=\"activeYear\"\r\n      [(activeView)]=\"activeView\"\r\n      [firstWeekday]=\"firstWeekday()\"\r\n      [min]=\"min()\"\r\n      [max]=\"max()\"\r\n      autoFocus\r\n      [multipleYearPageChangeModifier]=\"multipleYearPageChangeModifier()\"\r\n      [color]=\"color()\"\r\n      [disabled]=\"disabled() || calendarDisabled()\"\r\n      [tabIndex]=\"tabIndex()\"\r\n      (selectedChange)=\"onCalendarSelectedChange($event)\"\r\n      (yearSelect)=\"yearSelect.emit($event)\"\r\n      (monthSelect)=\"monthSelect.emit($event)\"\r\n    />\r\n    @if (useAcceptButtonToSelect()) {\r\n    <div class=\"ard-date-input__accept-buttons-container\">\r\n      <ng-template\r\n        #defaultAcceptButtonsTemplate\r\n        let-date\r\n      >\r\n        {{ serializeFn()(date) }}\r\n      </ng-template>\r\n\r\n      <ng-template\r\n        [ngTemplateOutlet]=\"acceptButtonsTemplate()?.template || defaultAcceptButtonsTemplate\"\r\n        [ngTemplateOutletContext]=\"acceptButtonsContext()\"\r\n      />\r\n    </div>\r\n    }\r\n  </ard-dropdown-panel>\r\n</ng-template>\r\n", styles: [".ard-date-input .ard-date-input__placeholder.ard-date-input__placeholder-hidden,.ard-date-input .ard-date-input__value.ard-date-input__value-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["hasError", "isSuccess", "isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: ["panelId", "headerTemplate", "footerTemplate", "filterValue", "appearance", "variant", "compact", "isOpen"], outputs: ["scroll", "scrollToEnd"] }, { kind: "directive", type: i4.ClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "component", type: ArdiumCalendarComponent, selector: "ard-calendar", inputs: ["color", "activeView", "activeYear", "activeMonth", "firstWeekday", "multipleYearPageChangeModifier", "autoFocus", "selected", "min", "max", "filter"], outputs: ["activeViewChange", "activeYearChange", "activeMonthChange", "selectedChange", "yearSelect", "monthSelect"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "valueTemplate", first: true, predicate: ArdDateInputValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarIconTemplate", first: true, predicate: ArdDateInputCalendarIconTemplateDirective, descendants: true, isSignal: true }, { propertyName: "acceptButtonsTemplate", first: true, predicate: ArdDateInputAcceptButtonsTemplateDirective, descendants: true, isSignal: true }, { propertyName: "prefixTemplate", first: true, predicate: ArdDateInputPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdDateInputSuffixTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true, isSignal: true }, { propertyName: "dropdownHost", first: true, predicate: ["dropdownHost"], descendants: true, isSignal: true }, { propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, isSignal: true }, { propertyName: "dropdownPanel", first: true, predicate: ArdiumDropdownPanelComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\r\n  [appearance]=\"appearance()\"\r\n  [variant]=\"variant()\"\r\n  [compact]=\"compact()\"\r\n  [isFocused]=\"isFocused()\"\r\n  [hasError]=\"hasError()\"\r\n  [isSuccess]=\"isSuccess()\"\r\n  [prefixTemplate]=\"prefixTemplate()?.template\"\r\n  [suffixTemplate]=\"suffixTemplate()?.template\"\r\n>\r\n  <div\r\n    class=\"ard-date-input\"\r\n    #dropdownHost\r\n    (click)=\"onGeneralClick($event)\"\r\n    [class.ard-has-value]=\"!!value()\"\r\n    [ngClass]=\"ngClasses()\"\r\n  >\r\n    <div class=\"ard-date-input__value-container ard-input-container\">\r\n      <div\r\n        class=\"ard-date-input__placeholder ard-placeholder\"\r\n        [class.ard-date-input__placeholder-hidden]=\"!shouldDisplayPlaceholder()\"\r\n      >\r\n        {{ placeholder() }}\r\n      </div>\r\n      <div\r\n        class=\"ard-date-input__value\"\r\n        [class.ard-date-input__value-hidden]=\"!shouldDisplayValue()\"\r\n      >\r\n        <ng-template\r\n          #defaultValueTemplate\r\n          let-date\r\n        >\r\n          {{ serializeFn()(date) }}\r\n        </ng-template>\r\n\r\n        <ng-template\r\n          [ngTemplateOutlet]=\"valueTemplate()?.template || defaultValueTemplate\"\r\n          [ngTemplateOutletContext]=\"valueContext()\"\r\n        />\r\n      </div>\r\n      <div\r\n        class=\"ard-date-input__input-container\"\r\n        role=\"combobox\"\r\n        aria-haspopup=\"listbox\"\r\n        [attr.aria-expanded]=\"isOpen()\"\r\n        [attr.aria-owns]=\"isOpen() ? htmlId() : null\"\r\n        [class.ard-date-input__input-container-hidden]=\"!shouldDisplayDateInput()\"\r\n      >\r\n        <input\r\n          #dateInput\r\n          #focusableElement\r\n          type=\"text\"\r\n          class=\"ard-date-input__input\"\r\n          [attr.tabindex]=\"tabIndex()\"\r\n          [value]=\"dateInputValue()\"\r\n          [attr.aria-controls]=\"isOpen() ? htmlId() : null\"\r\n          (input)=\"onDateInputInput($event)\"\r\n          (change)=\"$event.stopPropagation()\"\r\n          (focus)=\"onDateInputFocus($event)\"\r\n          (blur)=\"onDateInputBlur($event)\"\r\n          (keydown)=\"onDateInputEnter($event)\"\r\n        />\r\n      </div>\r\n    </div>\r\n\r\n    @if (!calendarHidden()) {\r\n    <ard-icon-button\r\n      color=\"none\"\r\n      [disabled]=\"calendarDisabled()\"\r\n      (click)=\"onCalendarButtonClick($event)\"\r\n    >\r\n      <ng-template\r\n        #defaultCalendarIconTemplate\r\n        let-date\r\n      >\r\n        <ard-icon filled>today</ard-icon>\r\n      </ng-template>\r\n\r\n      <ng-template [ngTemplateOutlet]=\"calendarIconTemplate()?.template || defaultCalendarIconTemplate\" />\r\n    </ard-icon-button>\r\n    }\r\n  </div>\r\n</ard-form-field-frame>\r\n\r\n<ng-template #dropdownTemplate>\r\n  <ard-dropdown-panel\r\n    class=\"ard-dropdown-panel ard-date-input__dropdown-panel\"\r\n    [appearance]=\"dropdownAppearanceOrDefault()\"\r\n    [variant]=\"dropdownVariantOrDefault()\"\r\n    [isOpen]=\"true\"\r\n    [panelId]=\"htmlId()\"\r\n    [compact]=\"compact()\"\r\n    (ardClickOutside)=\"onOutsideClick($event)\"\r\n  >\r\n    <ard-calendar\r\n      class=\"ard-date-input__calendar\"\r\n      [(activeMonth)]=\"activeMonth\"\r\n      [(activeYear)]=\"activeYear\"\r\n      [(activeView)]=\"activeView\"\r\n      [firstWeekday]=\"firstWeekday()\"\r\n      [min]=\"min()\"\r\n      [max]=\"max()\"\r\n      autoFocus\r\n      [multipleYearPageChangeModifier]=\"multipleYearPageChangeModifier()\"\r\n      [color]=\"color()\"\r\n      [disabled]=\"disabled() || calendarDisabled()\"\r\n      [tabIndex]=\"tabIndex()\"\r\n      (selectedChange)=\"onCalendarSelectedChange($event)\"\r\n      (yearSelect)=\"yearSelect.emit($event)\"\r\n      (monthSelect)=\"monthSelect.emit($event)\"\r\n    />\r\n    @if (useAcceptButtonToSelect()) {\r\n    <div class=\"ard-date-input__accept-buttons-container\">\r\n      <ng-template\r\n        #defaultAcceptButtonsTemplate\r\n        let-date\r\n      >\r\n        {{ serializeFn()(date) }}\r\n      </ng-template>\r\n\r\n      <ng-template\r\n        [ngTemplateOutlet]=\"acceptButtonsTemplate()?.template || defaultAcceptButtonsTemplate\"\r\n        [ngTemplateOutletContext]=\"acceptButtonsContext()\"\r\n      />\r\n    </div>\r\n    }\r\n  </ard-dropdown-panel>\r\n</ng-template>\r\n", styles: [".ard-date-input .ard-date-input__placeholder.ard-date-input__placeholder-hidden,.ard-date-input .ard-date-input__value.ard-date-input__value-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["hasError", "isSuccess", "isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: ["panelId", "headerTemplate", "footerTemplate", "filterValue", "appearance", "variant", "compact", "isOpen"], outputs: ["scroll", "scrollToEnd"] }, { kind: "directive", type: i4.ClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "component", type: ArdiumCalendarComponent, selector: "ard-calendar", inputs: ["color", "activeView", "activeYear", "activeMonth", "firstWeekday", "multipleYearPageChangeModifier", "autoFocus", "selected", "min", "max", "filter"], outputs: ["activeViewChange", "activeYearChange", "activeMonthChange", "selectedChange", "yearSelect", "monthSelect"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDateInputComponent, decorators: [{
             type: Component,
@@ -7849,11 +7858,13 @@ class ArdiumFabComponent extends _ButtonBase {
         ].join(' '));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabComponent, deps: [{ token: ARD_FAB_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumFabComponent, selector: "ard-fab", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumFabComponent, selector: "ard-fab", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-button-with-pointer-events-when-disabled": "pointerEventsWhenDisabled()" } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ard-fab', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"] }]
+            args: [{ selector: 'ard-fab', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.ard-button-with-pointer-events-when-disabled]': 'pointerEventsWhenDisabled()',
+                    }, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [ARD_FAB_DEFAULTS]
@@ -11995,7 +12006,7 @@ class ArdiumTablePaginationComponent extends _FocusableComponentBase {
         this._emitPageEvent();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationComponent, deps: [{ token: ARD_TABLE_PAGINATION_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumTablePaginationComponent, selector: "ard-table-pagination", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange", itemsPerPageChangeEvent: "itemsPerPageChange", pageChangeEvent: "pageChange" }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-pagination\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-pagination__items-per-page\">\n    <div class=\"ard-pagination__text\">{{ itemsPerPageText() }}</div>\n    <ard-select\n      [items]=\"options()\"\n      [compact]=\"compact()\"\n      [value]=\"itemsPerPage()\"\n      autoHighlightFirst=\"false\"\n      [disabled]=\"disabled()\"\n      (valueChange)=\"onItemsPerPageChange($event[0])\"\n      clearable=\"false\"\n    />\n  </div>\n  <div class=\"ard-pagination__current-page\">\n    <div class=\"ard-pagination__text\">\n      {{ currentItemsFormatFn()(getCurrentItemsContext()) }}\n    </div>\n    <div class=\"ard-pagination__buttons\">\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || firstPageDisabled()\"\n          (click)=\"onFirstPage()\"\n        >\n          <ard-icon>first page</ard-icon>\n        </ard-icon-button>\n      }\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || firstPageDisabled()\"\n        (click)=\"onPrevPage()\"\n      >\n        <ard-icon>navigate before</ard-icon>\n      </ard-icon-button>\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || lastPageDisabled()\"\n        (click)=\"onNextPage()\"\n      >\n        <ard-icon>navigate next</ard-icon>\n      </ard-icon-button>\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || lastPageDisabled()\"\n          (click)=\"onLastPage()\"\n        >\n          <ard-icon>last page</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumSelectComponent, selector: "ard-select", inputs: ["valueFrom", "labelFrom", "disabledFrom", "groupLabelFrom", "groupDisabledFrom", "childrenFrom", "placeholder", "searchPlaceholder", "clearButtonTitle", "dropdownPosition", "noItemsFoundText", "loadingPlaceholderText", "searchInputId", "inputAttrs", "isLoading", "itemsAlreadyGrouped", "invertDisabled", "noGroupActions", "autoHighlightFirst", "autoFocus", "keepOpen", "hideSelected", "noBackspaceClear", "sortMultipleValues", "searchCaseSensitive", "keepSearchAfterSelect", "maxSelectedItems", "itemDisplayLimit", "searchFn", "compareWith", "appearance", "variant", "compact", "dropdownAppearance", "dropdownVariant", "items", "multiselectable", "clearable", "searchable", "addCustom", "value", "isOpen"], outputs: ["valueChange", "change", "add", "failedToAdd", "remove", "clear", "open", "close", "scroll", "scrollToEnd", "search", "isOpenChange"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumTablePaginationComponent, selector: "ard-table-pagination", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange", itemsPerPageChangeEvent: "itemsPerPageChange", pageChangeEvent: "pageChange" }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-pagination\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-pagination__items-per-page\">\n    <div class=\"ard-pagination__text\">{{ itemsPerPageText() }}</div>\n    <ard-select\n      [items]=\"options()\"\n      [compact]=\"compact()\"\n      [value]=\"itemsPerPage()\"\n      autoHighlightFirst=\"false\"\n      [disabled]=\"disabled()\"\n      (valueChange)=\"onItemsPerPageChange($event[0])\"\n      clearable=\"false\"\n    />\n  </div>\n  <div class=\"ard-pagination__current-page\">\n    <div class=\"ard-pagination__text\">\n      {{ currentItemsFormatFn()(getCurrentItemsContext()) }}\n    </div>\n    <div class=\"ard-pagination__buttons\">\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || firstPageDisabled()\"\n          (click)=\"onFirstPage()\"\n        >\n          <ard-icon>first page</ard-icon>\n        </ard-icon-button>\n      }\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || firstPageDisabled()\"\n        (click)=\"onPrevPage()\"\n      >\n        <ard-icon>navigate before</ard-icon>\n      </ard-icon-button>\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || lastPageDisabled()\"\n        (click)=\"onNextPage()\"\n      >\n        <ard-icon>navigate next</ard-icon>\n      </ard-icon-button>\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || lastPageDisabled()\"\n          (click)=\"onLastPage()\"\n        >\n          <ard-icon>last page</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumSelectComponent, selector: "ard-select", inputs: ["valueFrom", "labelFrom", "disabledFrom", "groupLabelFrom", "groupDisabledFrom", "childrenFrom", "placeholder", "searchPlaceholder", "clearButtonTitle", "dropdownPosition", "noItemsFoundText", "loadingPlaceholderText", "searchInputId", "inputAttrs", "isLoading", "itemsAlreadyGrouped", "invertDisabled", "noGroupActions", "autoHighlightFirst", "autoFocus", "keepOpen", "hideSelected", "noBackspaceClear", "sortMultipleValues", "searchCaseSensitive", "keepSearchAfterSelect", "maxSelectedItems", "itemDisplayLimit", "searchFn", "compareWith", "appearance", "variant", "compact", "dropdownAppearance", "dropdownVariant", "items", "multiselectable", "clearable", "searchable", "addCustom", "value", "isOpen"], outputs: ["valueChange", "change", "add", "failedToAdd", "remove", "clear", "open", "close", "scroll", "scrollToEnd", "search", "isOpenChange"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationComponent, decorators: [{
             type: Component,
@@ -13129,6 +13140,16 @@ function provideModalDefaults(config) {
     return { provide: ARD_MODAL_DEFAULTS, useValue: { ..._modalDefaults, ...config } };
 }
 
+const ArdDialogResult = {
+    Confirm: 'confirm',
+    Reject: 'reject',
+    Close: 'close',
+};
+const ArdDialogActionType = {
+    NoOp: 'no-op',
+    AutoClose: 'autoclose',
+};
+
 const _dialogDefaults = {
     ..._modalDefaults,
     confirmButtonText: 'Confirm',
@@ -13139,6 +13160,7 @@ const _dialogDefaults = {
     rejectButtonAppearance: ButtonAppearance.Transparent,
     noRejectButton: false,
     canConfirm: true,
+    buttonActionType: ArdDialogActionType.AutoClose,
 };
 const ARD_DIALOG_DEFAULTS = new InjectionToken('ard-dialog-defaults', {
     factory: () => ({
@@ -13223,11 +13245,11 @@ class ArdiumModalComponent {
         this._destroyOverlay();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumModalComponent, selector: "ard-modal", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, _open: { classPropertyName: "_open", publicName: "open", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { openChange: "openChange", closeEvent: "close" }, viewQueries: [{ propertyName: "modalTemplate", first: true, predicate: ["modalTemplate"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading\"\n    [class.ard-modal-has-close-button]=\"!this.noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumModalComponent, selector: "ard-modal", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, _open: { classPropertyName: "_open", publicName: "open", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { openChange: "openChange", closeEvent: "close" }, viewQueries: [{ propertyName: "modalTemplate", first: true, predicate: ["modalTemplate"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading()\"\n    [class.ard-modal-has-close-button]=\"!noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ard-modal', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading\"\n    [class.ard-modal-has-close-button]=\"!this.noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"] }]
+            args: [{ selector: 'ard-modal', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses()\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading()\"\n    [class.ard-modal-has-close-button]=\"!noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"] }]
         }], propDecorators: { _open: [{
                 type: Input,
                 args: [{ alias: 'open' }]
@@ -13251,6 +13273,7 @@ class ArdiumDialogComponent {
         this.disableBackdropClose = input(this._DEFAULTS.disableBackdropClose, {
             transform: v => coerceBooleanProperty(v),
         });
+        this.buttonActionType = input(this._DEFAULTS.buttonActionType);
         //! open state handling
         //all handled by modal component
         this.open = model(false);
@@ -13293,14 +13316,18 @@ class ArdiumDialogComponent {
     onConfirmClick() {
         if (!this.canConfirm())
             return;
-        this.open.set(false);
+        if (this.buttonActionType() === ArdDialogActionType.AutoClose) {
+            this.open.set(false);
+        }
         setTimeout(() => {
             this.closeEvent.emit('confirm');
             this.confirmEvent.emit();
         }, 0);
     }
     onRejectClick() {
-        this.open.set(false);
+        if (this.buttonActionType() === ArdDialogActionType.AutoClose) {
+            this.open.set(false);
+        }
         setTimeout(() => {
             this.closeEvent.emit('reject');
             this.rejectEvent.emit();
@@ -13310,7 +13337,7 @@ class ArdiumDialogComponent {
         this.closeEvent.emit('close');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumDialogComponent, selector: "ard-dialog", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonText: { classPropertyName: "confirmButtonText", publicName: "confirmButtonText", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonColor: { classPropertyName: "confirmButtonColor", publicName: "confirmButtonColor", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonAppearance: { classPropertyName: "confirmButtonAppearance", publicName: "confirmButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonText: { classPropertyName: "rejectButtonText", publicName: "rejectButtonText", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonColor: { classPropertyName: "rejectButtonColor", publicName: "rejectButtonColor", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonAppearance: { classPropertyName: "rejectButtonAppearance", publicName: "rejectButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, noRejectButton: { classPropertyName: "noRejectButton", publicName: "noRejectButton", isSignal: true, isRequired: false, transformFunction: null }, canConfirm: { classPropertyName: "canConfirm", publicName: "canConfirm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closeEvent: "close", confirmEvent: "confirm", rejectEvent: "reject" }, queries: [{ propertyName: "buttonsTemplate", first: true, predicate: ArdDialogButtonsTemplateDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<ard-modal\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [heading]=\"heading()\"\n  [noCloseButton]=\"noCloseButton()\"\n  [noBackdrop]=\"noBackdrop()\"\n  [disableBackdropClose]=\"disableBackdropClose()\"\n  [(open)]=\"open\"\n  (close)=\"onModalClose()\"\n>\n  <div class=\"ard-dialog-container\">\n    <div class=\"ard-dialog-content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"ard-dialog-buttons\">\n      <ng-template\n        #defaultButtonsTemplate\n        let-confirmButton=\"confirmButton\"\n        let-rejectButton=\"rejectButton\"\n        let-canConfirm=\"canConfirm\"\n        let-onConfirm=\"onConfirm\"\n        let-onReject=\"onReject\"\n        let-dialogVariant=\"dialogVariant\"\n        let-dialogCompact=\"dialogCompact\"\n      >\n        <div class=\"ard-dialog-buttons-container\">\n          @if (rejectButton.enabled) {\n            <ard-button\n              [color]=\"rejectButton.color\"\n              [appearance]=\"rejectButton.appearance\"\n              [variant]=\"dialogVariant\"\n              [compact]=\"dialogCompact\"\n              (click)=\"onReject()\"\n            >\n              {{ rejectButton.text }}\n            </ard-button>\n          }\n          <ard-button\n            [color]=\"confirmButton.color\"\n            [appearance]=\"confirmButton.appearance\"\n            [variant]=\"dialogVariant\"\n            [compact]=\"dialogCompact\"\n            (click)=\"onConfirm()\"\n            [disabled]=\"!canConfirm\"\n          >\n            {{ confirmButton.text }}\n          </ard-button>\n        </div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"buttonsTemplate()?.template ?? defaultButtonsTemplate\"\n        [ngTemplateOutletContext]=\"getButtonsContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</ard-modal>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "component", type: ArdiumModalComponent, selector: "ard-modal", inputs: ["appearance", "variant", "compact", "heading", "noCloseButton", "noBackdrop", "disableBackdropClose", "open"], outputs: ["openChange", "close"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumDialogComponent, selector: "ard-dialog", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, buttonActionType: { classPropertyName: "buttonActionType", publicName: "buttonActionType", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonText: { classPropertyName: "confirmButtonText", publicName: "confirmButtonText", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonColor: { classPropertyName: "confirmButtonColor", publicName: "confirmButtonColor", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonAppearance: { classPropertyName: "confirmButtonAppearance", publicName: "confirmButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonText: { classPropertyName: "rejectButtonText", publicName: "rejectButtonText", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonColor: { classPropertyName: "rejectButtonColor", publicName: "rejectButtonColor", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonAppearance: { classPropertyName: "rejectButtonAppearance", publicName: "rejectButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, noRejectButton: { classPropertyName: "noRejectButton", publicName: "noRejectButton", isSignal: true, isRequired: false, transformFunction: null }, canConfirm: { classPropertyName: "canConfirm", publicName: "canConfirm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closeEvent: "close", confirmEvent: "confirm", rejectEvent: "reject" }, queries: [{ propertyName: "buttonsTemplate", first: true, predicate: ArdDialogButtonsTemplateDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<ard-modal\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [heading]=\"heading()\"\n  [noCloseButton]=\"noCloseButton()\"\n  [noBackdrop]=\"noBackdrop()\"\n  [disableBackdropClose]=\"disableBackdropClose()\"\n  [(open)]=\"open\"\n  (close)=\"onModalClose()\"\n>\n  <div class=\"ard-dialog-container\">\n    <div class=\"ard-dialog-content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"ard-dialog-buttons\">\n      <ng-template\n        #defaultButtonsTemplate\n        let-confirmButton=\"confirmButton\"\n        let-rejectButton=\"rejectButton\"\n        let-canConfirm=\"canConfirm\"\n        let-onConfirm=\"onConfirm\"\n        let-onReject=\"onReject\"\n        let-dialogVariant=\"dialogVariant\"\n        let-dialogCompact=\"dialogCompact\"\n      >\n        <div class=\"ard-dialog-buttons-container\">\n          @if (rejectButton.enabled) {\n            <ard-button\n              [color]=\"rejectButton.color\"\n              [appearance]=\"rejectButton.appearance\"\n              [variant]=\"dialogVariant\"\n              [compact]=\"dialogCompact\"\n              (click)=\"onReject()\"\n            >\n              {{ rejectButton.text }}\n            </ard-button>\n          }\n          <ard-button\n            [color]=\"confirmButton.color\"\n            [appearance]=\"confirmButton.appearance\"\n            [variant]=\"dialogVariant\"\n            [compact]=\"dialogCompact\"\n            (click)=\"onConfirm()\"\n            [disabled]=\"!canConfirm\"\n          >\n            {{ confirmButton.text }}\n          </ard-button>\n        </div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"buttonsTemplate()?.template ?? defaultButtonsTemplate\"\n        [ngTemplateOutletContext]=\"getButtonsContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</ard-modal>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "component", type: ArdiumModalComponent, selector: "ard-modal", inputs: ["appearance", "variant", "compact", "heading", "noCloseButton", "noBackdrop", "disableBackdropClose", "open"], outputs: ["openChange", "close"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogComponent, decorators: [{
             type: Component,
@@ -13345,12 +13372,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 }]
         }] });
 
-const DialogResult = {
-    Confirm: 'confirm',
-    Reject: 'reject',
-    Close: 'close',
-};
-
 class Queue {
     push(item) {
         if (!this.tail)
@@ -13766,5 +13787,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ARD_BADGE_DEFAULTS, ARD_BUTTON_DEFAULTS, ARD_CALENDAR_DEFAULTS, ARD_CARD_DEFAULTS, ARD_CHECKBOX_DEFAULTS, ARD_CHECKBOX_LIST_DEFAULTS, ARD_CHIP_DEFAULTS, ARD_COLOR_DISPLAY_DEFAULTS, ARD_DATE_INPUT_DEFAULTS, ARD_DELETABLE_CHIP_DEFAULTS, ARD_DIALOG_DEFAULTS, ARD_DIGIT_INPUT_DEFAULTS, ARD_DIVIDER_DEFAULTS, ARD_DROPDOWN_PANEL_DEFAULTS, ARD_FAB_DEFAULTS, ARD_FILE_DROP_AREA_DEFAULTS, ARD_FILE_INPUT_DEFAULTS, ARD_FORM_FIELD_FRAME_DEFAULTS, ARD_HEX_INPUT_DEFAULTS, ARD_ICON_BUTTON_DEFAULTS, ARD_ICON_DEFAULTS, ARD_KBD_DEFAULTS, ARD_KBD_SHORTCUT_DEFAULTS, ARD_MODAL_DEFAULTS, ARD_NUMBER_INPUT_DEFAULTS, ARD_PASSWORD_INPUT_DEFAULTS, ARD_PROGRESS_BAR_DEFAULTS, ARD_PROGRESS_CIRCLE_DEFAULTS, ARD_RADIO_DEFAULTS, ARD_SEGMENT_DEFAULTS, ARD_SELECTABLE_CHIP_DEFAULTS, ARD_SELECT_DEFAULTS, ARD_SIMPLE_INPUT_DEFAULTS, ARD_SLIDER_DEFAULTS, ARD_SLIDE_TOGGLE_DEFAULTS, ARD_SNACKBAR_ANIMATION_LENGTH, ARD_SNACKBAR_DATA, ARD_SNACKBAR_DEFAULTS, ARD_SPINNER_DEFAULTS, ARD_STAR_BUTTON_DEFAULTS, ARD_STAR_DEFAULTS, ARD_STAR_DISPLAY_DEFAULTS, ARD_STAR_INPUT_DEFAULTS, ARD_STATEBOX_DEFAULTS, ARD_TABBER_DEFAULTS, ARD_TABLE_DEFAULTS, ARD_TABLE_FROM_CSV_DEFAULTS, ARD_TABLE_PAGINATION_DEFAULTS, ARD_TAB_DEFAULTS, ArdAddCustomTemplateDirective, ArdCalendarView, ArdDateInputAcceptButtonsTemplateDirective, ArdDateInputCalendarIconTemplateDirective, ArdDateInputMinMaxStrategy, ArdDateInputPrefixTemplateDirective, ArdDateInputSuffixTemplateDirective, ArdDateInputValueTemplateDirective, ArdDialogButtonsTemplateDirective, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdFileInputPlaceholderTemplateDirective, ArdFileInputPrefixTemplateDirective, ArdFileInputSuffixTemplateDirective, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective, ArdHexInputPlaceholderTemplateDirective, ArdHexInputPrefixTemplateDirective, ArdHexInputSuffixTemplateDirective, ArdInputLoadingTemplateDirective, ArdInputPlaceholderTemplateDirective, ArdInputPrefixTemplateDirective, ArdInputSuffixTemplateDirective, ArdInputSuggestionTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdNumberInputPlaceholderTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdPanelPosition, ArdPasswordInputPlaceholderTemplateDirective, ArdPasswordInputPrefixTemplateDirective, ArdPasswordInputRevealButtonTemplateDirective, ArdPasswordInputSuffixTemplateDirective, ArdProgressBarValueTemplateDirective, ArdProgressCircleValueTemplateDirective, searchFunctions as ArdSearchFunction, ArdSegmentOptionTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdSimpleInputPlaceholderTemplateDirective, ArdSimpleInputPrefixTemplateDirective, ArdSimpleInputSuffixTemplateDirective, ArdSlideToggleAppearance, ArdSliderTooltipDirective, ArdSnackbarAlignment, ArdSnackbarOriginRelation, ArdSnackbarQueueHandling, ArdSnackbarRef, ArdSnackbarType, ArdValueChipTemplateDirective, ArdValueTemplateDirective, ArdiumBadgeDirective, ArdiumBadgeModule, ArdiumButtonComponent, ArdiumButtonModule, ArdiumCalendarComponent, ArdiumCalendarModule, ArdiumCardActionButtonsDirective, ArdiumCardAvatarDirective, ArdiumCardComponent, ArdiumCardContentDirective, ArdiumCardDirective, ArdiumCardFooterDirective, ArdiumCardHeaderComponent, ArdiumCardImageDirective, ArdiumCardModule, ArdiumCardSubtitleDirective, ArdiumCardTitleDirective, ArdiumCheckboxComponent, ArdiumCheckboxListComponent, ArdiumCheckboxListModule, ArdiumCheckboxModule, ArdiumChipComponent, ArdiumChipModule, ArdiumColorDisplayComponent, ArdiumColorDisplayModule, ArdiumDateInputComponent, ArdiumDateInputModule, ArdiumDeletableChipComponent, ArdiumDialogComponent, ArdiumDialogModule, ArdiumDigitInputComponent, ArdiumDigitInputModule, ArdiumDividerComponent, ArdiumDividerModule, ArdiumDropdownPanelComponent, ArdiumDropdownPanelModule, ArdiumErrorComponent, ArdiumErrorDirective, ArdiumFabComponent, ArdiumFabModule, ArdiumFileDropAreaComponent, ArdiumFileDropAreaDragoverContentTemplateDirective, ArdiumFileDropAreaIdleContentTemplateDirective, ArdiumFileDropAreaModule, ArdiumFileDropAreaUploadedContentTemplateDirective, ArdiumFileInputComponent, ArdiumFileInputDragoverContentTemplateDirective, ArdiumFileInputIdleContentTemplateDirective, ArdiumFileInputModule, ArdiumFileInputUploadedContentTemplateDirective, ArdiumFormFieldComponent, ArdiumFormFieldFrameComponent, ArdiumFormFieldFrameModule, ArdiumFormFieldModule, ArdiumHexInputComponent, ArdiumHexInputModule, ArdiumHintComponent, ArdiumHintDirective, ArdiumHorizontalFormFieldComponent, ArdiumIconButtonComponent, ArdiumIconButtonModule, ArdiumIconComponent, ArdiumIconModule, ArdiumIconPipe, ArdiumInputComponent, ArdiumInputModule, ArdiumKbdComponent, ArdiumKbdDirective, ArdiumKbdModule, ArdiumKbdPipe, ArdiumKbdShortcutComponent, ArdiumKbdShortcutModule, ArdiumLabelComponent, ArdiumModalComponent, ArdiumModalModule, ArdiumNumberInputComponent, ArdiumNumberInputModule, ArdiumOptionComponent, ArdiumOptionModule, ArdiumPasswordInputComponent, ArdiumPasswordInputModule, ArdiumProgressBarComponent, ArdiumProgressBarModule, ArdiumProgressCircleComponent, ArdiumProgressCircleModule, ArdiumRadioComponent, ArdiumRadioGroupComponent, ArdiumRadioModule, ArdiumRangeSliderComponent, ArdiumRangeSliderModule, ArdiumSegmentComponent, ArdiumSegmentModule, ArdiumSelectComponent, ArdiumSelectModule, ArdiumSelectableChipComponent, ArdiumSimpleInputComponent, ArdiumSimpleInputModule, ArdiumSlideToggleComponent, ArdiumSlideToggleModule, ArdiumSliderComponent, ArdiumSliderModule, ArdiumSnackbarService, ArdiumSpinnerComponent, ArdiumSpinnerModule, ArdiumStarButtonComponent, ArdiumStarButtonModule, ArdiumStarComponent, ArdiumStarDisplayComponent, ArdiumStarDisplayModule, ArdiumStarInputComponent, ArdiumStarInputModule, ArdiumStarModule, ArdiumStateboxComponent, ArdiumStateboxModule, ArdiumTabComponent, ArdiumTabberComponent, ArdiumTabberModule, ArdiumTableCaptionTemplateDirective, ArdiumTableCheckboxTemplateDirective, ArdiumTableComponent, ArdiumTableFromCsvComponent, ArdiumTableFromCsvModule, ArdiumTableHeaderCheckboxTemplateDirective, ArdiumTableModule, ArdiumTablePaginationComponent, ArdiumTablePaginationModule, ArdiumTablePaginationTemplateDirective, ArdiumTableTemplateDirective, ArdiumTextListComponent, ArdiumTextListModule, ArdiumTextListPipe, BadgePosition, BadgeSize, ButtonAppearance, ButtonVariant, CardAppearance, CardVariant, CheckboxListAlignType, CheckboxState, ClickStrategy, ColorDisplayAppearance, ComponentColor, DecorationElementAppearance, DialogResult, DigitInputPrimitiveOption, DigitInputShape, DropdownPanelAppearance, DropdownPanelVariant, FabSize, FormElementAppearance, FormElementVariant, OneAxisAlignment, OutlinedAppearance, PaginationAlign, PanelAppearance, PanelVariant, ProgressBarAppearance, ProgressBarMode, ProgressBarSize, ProgressBarVariant, ProgressCircleAppearance, ProgressCircleVariant, SegmentAppearance, SegmentVariant, SimpleComponentColor, SimpleOneAxisAlignment, SliderDecorationPosition, SliderTooltipBehavior, SortType, StarColor, StarFillMode, TableAlignType, TableAppearance, TablePaginationStrategy, TableVariant, TransformType, _chipDefaults, _modalDefaults, provideBadgeDefaults, provideButtonDefaults, provideCalendarDefaults, provideCardDefaults, provideCheckboxDefaults, provideCheckboxListDefaults, provideChipDefaults, provideColorDisplayDefaults, provideDateInputDefaults, provideDeletableChipDefaults, provideDialogDefaults, provideDigitInputDefaults, provideDividerDefaults, provideDropdownPanelDefaults, provideFabDefaults, provideFileDropAreaDefaults, provideFileInputDefaults, provideFormFieldFrameDefaults, provideHexInputDefaults, provideIconButtonDefaults, provideIconDefaults, provideKbdDefaults, provideKbdShortcutDefaults, provideModalDefaults, provideNumberInputDefaults, providePasswordInputDefaults, provideProgressBarDefaults, provideProgressCircleDefaults, provideRadioDefaults, provideSegmentDefaults, provideSelectDefaults, provideSelectableChipDefaults, provideSimpleInputDefaults, provideSlideToggleDefaults, provideSliderDefaults, provideSnackbarDefaults, provideSpinnerDefaults, provideStarButtonDefaults, provideStarDefaults, provideStarDisplayDefaults, provideStarInputDefaults, provideStateboxDefaults, provideTabDefaults, provideTabberDefaults, provideTableDefaults, provideTableFromCsvDefaults, provideTablePaginationDefaults, searchInString };
+export { ARD_BADGE_DEFAULTS, ARD_BUTTON_DEFAULTS, ARD_CALENDAR_DEFAULTS, ARD_CARD_DEFAULTS, ARD_CHECKBOX_DEFAULTS, ARD_CHECKBOX_LIST_DEFAULTS, ARD_CHIP_DEFAULTS, ARD_COLOR_DISPLAY_DEFAULTS, ARD_DATE_INPUT_DEFAULTS, ARD_DELETABLE_CHIP_DEFAULTS, ARD_DIALOG_DEFAULTS, ARD_DIGIT_INPUT_DEFAULTS, ARD_DIVIDER_DEFAULTS, ARD_DROPDOWN_PANEL_DEFAULTS, ARD_FAB_DEFAULTS, ARD_FILE_DROP_AREA_DEFAULTS, ARD_FILE_INPUT_DEFAULTS, ARD_FORM_FIELD_FRAME_DEFAULTS, ARD_HEX_INPUT_DEFAULTS, ARD_ICON_BUTTON_DEFAULTS, ARD_ICON_DEFAULTS, ARD_KBD_DEFAULTS, ARD_KBD_SHORTCUT_DEFAULTS, ARD_MODAL_DEFAULTS, ARD_NUMBER_INPUT_DEFAULTS, ARD_PASSWORD_INPUT_DEFAULTS, ARD_PROGRESS_BAR_DEFAULTS, ARD_PROGRESS_CIRCLE_DEFAULTS, ARD_RADIO_DEFAULTS, ARD_SEGMENT_DEFAULTS, ARD_SELECTABLE_CHIP_DEFAULTS, ARD_SELECT_DEFAULTS, ARD_SIMPLE_INPUT_DEFAULTS, ARD_SLIDER_DEFAULTS, ARD_SLIDE_TOGGLE_DEFAULTS, ARD_SNACKBAR_ANIMATION_LENGTH, ARD_SNACKBAR_DATA, ARD_SNACKBAR_DEFAULTS, ARD_SPINNER_DEFAULTS, ARD_STAR_BUTTON_DEFAULTS, ARD_STAR_DEFAULTS, ARD_STAR_DISPLAY_DEFAULTS, ARD_STAR_INPUT_DEFAULTS, ARD_STATEBOX_DEFAULTS, ARD_TABBER_DEFAULTS, ARD_TABLE_DEFAULTS, ARD_TABLE_FROM_CSV_DEFAULTS, ARD_TABLE_PAGINATION_DEFAULTS, ARD_TAB_DEFAULTS, ArdAddCustomTemplateDirective, ArdCalendarView, ArdDateInputAcceptButtonsTemplateDirective, ArdDateInputCalendarIconTemplateDirective, ArdDateInputMinMaxStrategy, ArdDateInputPrefixTemplateDirective, ArdDateInputSuffixTemplateDirective, ArdDateInputValueTemplateDirective, ArdDialogActionType, ArdDialogButtonsTemplateDirective, ArdDialogResult, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdFileInputPlaceholderTemplateDirective, ArdFileInputPrefixTemplateDirective, ArdFileInputSuffixTemplateDirective, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective, ArdHexInputPlaceholderTemplateDirective, ArdHexInputPrefixTemplateDirective, ArdHexInputSuffixTemplateDirective, ArdInputLoadingTemplateDirective, ArdInputPlaceholderTemplateDirective, ArdInputPrefixTemplateDirective, ArdInputSuffixTemplateDirective, ArdInputSuggestionTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdNumberInputPlaceholderTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdPanelPosition, ArdPasswordInputPlaceholderTemplateDirective, ArdPasswordInputPrefixTemplateDirective, ArdPasswordInputRevealButtonTemplateDirective, ArdPasswordInputSuffixTemplateDirective, ArdProgressBarValueTemplateDirective, ArdProgressCircleValueTemplateDirective, searchFunctions as ArdSearchFunction, ArdSegmentOptionTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdSimpleInputPlaceholderTemplateDirective, ArdSimpleInputPrefixTemplateDirective, ArdSimpleInputSuffixTemplateDirective, ArdSlideToggleAppearance, ArdSliderTooltipDirective, ArdSnackbarAlignment, ArdSnackbarOriginRelation, ArdSnackbarQueueHandling, ArdSnackbarRef, ArdSnackbarType, ArdValueChipTemplateDirective, ArdValueTemplateDirective, ArdiumBadgeDirective, ArdiumBadgeModule, ArdiumButtonComponent, ArdiumButtonModule, ArdiumCalendarComponent, ArdiumCalendarModule, ArdiumCardActionButtonsDirective, ArdiumCardAvatarDirective, ArdiumCardComponent, ArdiumCardContentDirective, ArdiumCardDirective, ArdiumCardFooterDirective, ArdiumCardHeaderComponent, ArdiumCardImageDirective, ArdiumCardModule, ArdiumCardSubtitleDirective, ArdiumCardTitleDirective, ArdiumCheckboxComponent, ArdiumCheckboxListComponent, ArdiumCheckboxListModule, ArdiumCheckboxModule, ArdiumChipComponent, ArdiumChipModule, ArdiumColorDisplayComponent, ArdiumColorDisplayModule, ArdiumDateInputComponent, ArdiumDateInputModule, ArdiumDeletableChipComponent, ArdiumDialogComponent, ArdiumDialogModule, ArdiumDigitInputComponent, ArdiumDigitInputModule, ArdiumDividerComponent, ArdiumDividerModule, ArdiumDropdownPanelComponent, ArdiumDropdownPanelModule, ArdiumErrorComponent, ArdiumErrorDirective, ArdiumFabComponent, ArdiumFabModule, ArdiumFileDropAreaComponent, ArdiumFileDropAreaDragoverContentTemplateDirective, ArdiumFileDropAreaIdleContentTemplateDirective, ArdiumFileDropAreaModule, ArdiumFileDropAreaUploadedContentTemplateDirective, ArdiumFileInputComponent, ArdiumFileInputDragoverContentTemplateDirective, ArdiumFileInputIdleContentTemplateDirective, ArdiumFileInputModule, ArdiumFileInputUploadedContentTemplateDirective, ArdiumFormFieldComponent, ArdiumFormFieldFrameComponent, ArdiumFormFieldFrameModule, ArdiumFormFieldModule, ArdiumHexInputComponent, ArdiumHexInputModule, ArdiumHintComponent, ArdiumHintDirective, ArdiumHorizontalFormFieldComponent, ArdiumIconButtonComponent, ArdiumIconButtonModule, ArdiumIconComponent, ArdiumIconModule, ArdiumIconPipe, ArdiumInputComponent, ArdiumInputModule, ArdiumKbdComponent, ArdiumKbdDirective, ArdiumKbdModule, ArdiumKbdPipe, ArdiumKbdShortcutComponent, ArdiumKbdShortcutModule, ArdiumLabelComponent, ArdiumModalComponent, ArdiumModalModule, ArdiumNumberInputComponent, ArdiumNumberInputModule, ArdiumOptionComponent, ArdiumOptionModule, ArdiumPasswordInputComponent, ArdiumPasswordInputModule, ArdiumProgressBarComponent, ArdiumProgressBarModule, ArdiumProgressCircleComponent, ArdiumProgressCircleModule, ArdiumRadioComponent, ArdiumRadioGroupComponent, ArdiumRadioModule, ArdiumRangeSliderComponent, ArdiumRangeSliderModule, ArdiumSegmentComponent, ArdiumSegmentModule, ArdiumSelectComponent, ArdiumSelectModule, ArdiumSelectableChipComponent, ArdiumSimpleInputComponent, ArdiumSimpleInputModule, ArdiumSlideToggleComponent, ArdiumSlideToggleModule, ArdiumSliderComponent, ArdiumSliderModule, ArdiumSnackbarService, ArdiumSpinnerComponent, ArdiumSpinnerModule, ArdiumStarButtonComponent, ArdiumStarButtonModule, ArdiumStarComponent, ArdiumStarDisplayComponent, ArdiumStarDisplayModule, ArdiumStarInputComponent, ArdiumStarInputModule, ArdiumStarModule, ArdiumStateboxComponent, ArdiumStateboxModule, ArdiumTabComponent, ArdiumTabberComponent, ArdiumTabberModule, ArdiumTableCaptionTemplateDirective, ArdiumTableCheckboxTemplateDirective, ArdiumTableComponent, ArdiumTableFromCsvComponent, ArdiumTableFromCsvModule, ArdiumTableHeaderCheckboxTemplateDirective, ArdiumTableModule, ArdiumTablePaginationComponent, ArdiumTablePaginationModule, ArdiumTablePaginationTemplateDirective, ArdiumTableTemplateDirective, ArdiumTextListComponent, ArdiumTextListModule, ArdiumTextListPipe, BadgePosition, BadgeSize, ButtonAppearance, ButtonVariant, CardAppearance, CardVariant, CheckboxListAlignType, CheckboxState, ClickStrategy, ColorDisplayAppearance, ComponentColor, DecorationElementAppearance, DigitInputPrimitiveOption, DigitInputShape, DropdownPanelAppearance, DropdownPanelVariant, FabSize, FormElementAppearance, FormElementVariant, OneAxisAlignment, OutlinedAppearance, PaginationAlign, PanelAppearance, PanelVariant, ProgressBarAppearance, ProgressBarMode, ProgressBarSize, ProgressBarVariant, ProgressCircleAppearance, ProgressCircleVariant, SegmentAppearance, SegmentVariant, SimpleComponentColor, SimpleOneAxisAlignment, SliderDecorationPosition, SliderTooltipBehavior, SortType, StarColor, StarFillMode, TableAlignType, TableAppearance, TablePaginationStrategy, TableVariant, TransformType, _chipDefaults, _modalDefaults, provideBadgeDefaults, provideButtonDefaults, provideCalendarDefaults, provideCardDefaults, provideCheckboxDefaults, provideCheckboxListDefaults, provideChipDefaults, provideColorDisplayDefaults, provideDateInputDefaults, provideDeletableChipDefaults, provideDialogDefaults, provideDigitInputDefaults, provideDividerDefaults, provideDropdownPanelDefaults, provideFabDefaults, provideFileDropAreaDefaults, provideFileInputDefaults, provideFormFieldFrameDefaults, provideHexInputDefaults, provideIconButtonDefaults, provideIconDefaults, provideKbdDefaults, provideKbdShortcutDefaults, provideModalDefaults, provideNumberInputDefaults, providePasswordInputDefaults, provideProgressBarDefaults, provideProgressCircleDefaults, provideRadioDefaults, provideSegmentDefaults, provideSelectDefaults, provideSelectableChipDefaults, provideSimpleInputDefaults, provideSlideToggleDefaults, provideSliderDefaults, provideSnackbarDefaults, provideSpinnerDefaults, provideStarButtonDefaults, provideStarDefaults, provideStarDisplayDefaults, provideStarInputDefaults, provideStateboxDefaults, provideTabDefaults, provideTabberDefaults, provideTableDefaults, provideTableFromCsvDefaults, provideTablePaginationDefaults, searchInString };
 //# sourceMappingURL=ardium-ui-ui.mjs.map