@acorex/components 22.2.13 → 22.2.15

package/fesm2022/acorex-components-calendar.mjs

@@ -159,10 +159,10 @@ class MXCalendarBaseComponent extends MXBaseComponent {
         this.setOption({ name: 'holidayDates', value: v });
     }
     render() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: MXCalendarBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: MXCalendarBaseComponent }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MXCalendarBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MXCalendarBaseComponent }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: MXCalendarBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MXCalendarBaseComponent, decorators: [{
             type: Injectable
         }], propDecorators: { interface: [{
                 type: Input
@@ -1078,8 +1078,8 @@ class AXCalendarComponent extends classes((MXValueComponent), MXInteractiveCompo
             return String(monthIndex0 + 1);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXCalendarComponent, isStandalone: true, selector: "ax-calendar", inputs: { rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, depth: { classPropertyName: "depth", publicName: "depth", isSignal: false, isRequired: false, transformFunction: null }, activeView: { classPropertyName: "activeView", publicName: "activeView", isSignal: false, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: false, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: false, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: false, isRequired: false, transformFunction: null }, holidayDates: { classPropertyName: "holidayDates", publicName: "holidayDates", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, dayCellTemplate: { classPropertyName: "dayCellTemplate", publicName: "dayCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, monthCellTemplate: { classPropertyName: "monthCellTemplate", publicName: "monthCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, yearCellTemplate: { classPropertyName: "yearCellTemplate", publicName: "yearCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, cellClass: { classPropertyName: "cellClass", publicName: "cellClass", isSignal: false, isRequired: false, transformFunction: null }, showNavigation: { classPropertyName: "showNavigation", publicName: "showNavigation", isSignal: false, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, weekend: { classPropertyName: "weekend", publicName: "weekend", isSignal: true, isRequired: false, transformFunction: null }, weekdays: { classPropertyName: "weekdays", publicName: "weekdays", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, yearRange: { classPropertyName: "yearRange", publicName: "yearRange", isSignal: true, isRequired: false, transformFunction: null }, holidays: { classPropertyName: "holidays", publicName: "holidays", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onOptionChanged: "onOptionChanged", valueChange: "valueChange", onValueChanged: "onValueChanged", minValueChange: "minValueChange", maxValueChange: "maxValueChange", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", activeViewChange: "activeViewChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate", onSlotClick: "onSlotClick", countChange: "countChange" }, host: { listeners: { "keydown": "_handleOnKeydownEvent($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXCalendarComponent, isStandalone: true, selector: "ax-calendar", inputs: { rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, depth: { classPropertyName: "depth", publicName: "depth", isSignal: false, isRequired: false, transformFunction: null }, activeView: { classPropertyName: "activeView", publicName: "activeView", isSignal: false, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: false, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: false, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: false, isRequired: false, transformFunction: null }, holidayDates: { classPropertyName: "holidayDates", publicName: "holidayDates", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, dayCellTemplate: { classPropertyName: "dayCellTemplate", publicName: "dayCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, monthCellTemplate: { classPropertyName: "monthCellTemplate", publicName: "monthCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, yearCellTemplate: { classPropertyName: "yearCellTemplate", publicName: "yearCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, cellClass: { classPropertyName: "cellClass", publicName: "cellClass", isSignal: false, isRequired: false, transformFunction: null }, showNavigation: { classPropertyName: "showNavigation", publicName: "showNavigation", isSignal: false, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, weekend: { classPropertyName: "weekend", publicName: "weekend", isSignal: true, isRequired: false, transformFunction: null }, weekdays: { classPropertyName: "weekdays", publicName: "weekdays", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, yearRange: { classPropertyName: "yearRange", publicName: "yearRange", isSignal: true, isRequired: false, transformFunction: null }, holidays: { classPropertyName: "holidays", publicName: "holidays", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onOptionChanged: "onOptionChanged", valueChange: "valueChange", onValueChanged: "onValueChanged", minValueChange: "minValueChange", maxValueChange: "maxValueChange", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", activeViewChange: "activeViewChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate", onSlotClick: "onSlotClick", countChange: "countChange" }, host: { listeners: { "keydown": "_handleOnKeydownEvent($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => AXCalendarComponent),
@@ -1093,7 +1093,7 @@ class AXCalendarComponent extends classes((MXValueComponent), MXInteractiveCompo
             { provide: AXComponent, useExisting: AXCalendarComponent },
         ], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-calendar-frame\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <div class=\"ax-calendar-body\">\n  @for (v of views; let i = $index, first = $first, last = $last; track i) {\n    @switch (activeView) {\n      @case ('year') {\n        @if (showNavigation) {\n          <div class=\"ax-calendar-view-header\">\n            <div class=\"ax-calendar-header-info\">\n              <button\n                type=\"button\"\n                [attr.disabled]=\"disabled ? '' : null\"\n                [attr.readonly]=\"readonly ? '' : null\"\n                class=\"ax-general-button ax-button-rounded ax-state-disabled\"\n                (click)=\"_handleNavClick($event, 'year')\"\n              >\n                {{ v.range.startTime | format: 'date' : { calendar: calendarSystem(), format: 'YYYY' } | async }} -\n                {{ v.range.endTime | format: 'date' : { calendar: calendarSystem(), format: 'YYYY' } | async }}\n              </button>\n            </div>\n            @if (last) {\n              <div class=\"ax-calendar-header-buttons\">\n                <button\n                  type=\"button\"\n                  [attr.disabled]=\"disabled ? '' : null\"\n                  [attr.readonly]=\"readonly ? '' : null\"\n                  class=\"ax-general-button-icon ax-button-rounded ax-button-icon ax-next\"\n                  (click)=\"_handlePrevClick()\"\n                  [title]=\"'@acorex:common.actions.prev' | translate | async\"\n                >\n                  <i\n                    class=\"ax-icon\"\n                    [ngClass]=\"{\n                      'ax-icon-chevron-left': !isRtl(),\n                      'ax-icon-chevron-right': isRtl(),\n                    }\"\n                  ></i>\n                </button>\n                <button\n                  type=\"button\"\n                  [attr.disabled]=\"disabled ? '' : null\"\n                  [attr.readonly]=\"readonly ? '' : null\"\n                  class=\"ax-general-button-icon ax-button-rounded ax-button-icon\"\n                  (click)=\"_handleNextClick()\"\n                  [title]=\"'@acorex:common.actions.next' | translate | async\"\n                >\n                  <i\n                    class=\"ax-icon\"\n                    [ngClass]=\"{\n                      'ax-icon-chevron-right': !isRtl(),\n                      'ax-icon-chevron-left': isRtl(),\n                    }\"\n                  ></i>\n                </button>\n              </div>\n            }\n          </div>\n        }\n        <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !yearCellTemplate }\">\n          @for (slot of v.slots; track slot.date.date.getTime()) {\n            <button\n              tabindex=\"0\"\n              class=\"ax-calendar-slot\"\n              [class.ax-state-disabled]=\"disabled\"\n              [ngClass]=\"slot.cssClass\"\n              (click)=\"_handleSlotClick($event, slot)\"\n            >\n              @if (yearCellTemplate) {\n                <div>\n                  <ng-container\n                    [ngTemplateOutlet]=\"yearCellTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: { slot: slot } }\"\n                  >\n                  </ng-container>\n                </div>\n              } @else {\n                <div>\n                  {{ slot.text }}\n                </div>\n              }\n            </button>\n          }\n        </div>\n      }\n      @case ('month') {\n        @if (showNavigation) {\n          <div class=\"ax-calendar-view-header\">\n            <div class=\"ax-calendar-header-info\">\n              <button\n                type=\"button\"\n                [attr.disabled]=\"disabled ? '' : null\"\n                [attr.readonly]=\"readonly ? '' : null\"\n                class=\"ax-general-button ax-button-rounded\"\n                (click)=\"_handleNavClick($event, 'year')\"\n              >\n                {{ v.range.startTime | format: 'date' : { calendar: calendarSystem(), format: 'YYYY' } | async }}\n              </button>\n            </div>\n            @if (last) {\n              <div class=\"ax-calendar-header-buttons\">\n                <button\n                  type=\"button\"\n                  [attr.disabled]=\"disabled ? '' : null\"\n                  [attr.readonly]=\"readonly ? '' : null\"\n                  class=\"ax-general-button-icon ax-button-rounded ax-button-icon\"\n                  (click)=\"_handlePrevClick()\"\n                  [title]=\"'@acorex:common.actions.prev' | translate | async\"\n                >\n                  <i\n                    class=\"ax-icon\"\n                    [ngClass]=\"{\n                      'ax-icon-chevron-left': !isRtl(),\n                      'ax-icon-chevron-right': isRtl(),\n                    }\"\n                  ></i>\n                </button>\n                <button\n                  type=\"button\"\n                  [attr.disabled]=\"disabled ? '' : null\"\n                  [attr.readonly]=\"readonly ? '' : null\"\n                  class=\"ax-general-button-icon ax-button-rounded ax-button-icon\"\n                  (click)=\"_handleNextClick()\"\n                  [title]=\"'@acorex:common.actions.next' | translate | async\"\n                >\n                  <i\n                    class=\"ax-icon\"\n                    [ngClass]=\"{\n                      'ax-icon-chevron-right': !isRtl(),\n                      'ax-icon-chevron-left': isRtl(),\n                    }\"\n                  ></i>\n                </button>\n              </div>\n            }\n          </div>\n        }\n\n        <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !monthCellTemplate }\">\n          @for (slot of v.slots; track slot.date.date.getTime()) {\n            <button\n              tabindex=\"0\"\n              class=\"ax-calendar-slot\"\n              [class.ax-state-disabled]=\"disabled\"\n              [ngClass]=\"slot.cssClass\"\n              (click)=\"_handleSlotClick($event, slot)\"\n            >\n              @if (monthCellTemplate) {\n                <div>\n                  <ng-container\n                    [ngTemplateOutlet]=\"monthCellTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: { slot: slot } }\"\n                  >\n                  </ng-container>\n                </div>\n              } @else {\n                <div [title]=\"slot.date | format: 'date' : { calendar: calendarSystem(), format: 'MMMM YYYY' } | async\">\n                  {{ getMonthName(slot.date, 'short') }}\n                </div>\n              }\n            </button>\n          }\n        </div>\n      }\n      @default {\n        @if (showNavigation && look() === 'select' && last) {\n          <div class=\"ax-calendar-view-header ax-calendar-day-nav\">\n            <button\n              type=\"button\"\n              [attr.disabled]=\"disabled ? '' : null\"\n              [attr.readonly]=\"readonly ? '' : null\"\n              class=\"ax-general-button ax-button-rounded ax-button-icon ax-calendar-day-nav-prev\"\n              (click)=\"_handlePrevClick()\"\n              [title]=\"'@acorex:common.actions.prev' | translate | async\"\n            >\n              <i\n                class=\"ax-icon\"\n                [ngClass]=\"{\n                  'ax-icon-chevron-left': !isRtl(),\n                  'ax-icon-chevron-right': isRtl(),\n                }\"\n              ></i>\n            </button>\n            <div class=\"ax-calendar-day-nav-center\">\n              <ax-select-box\n                class=\"ax-calendar-month-select ax-sm\"\n                look=\"none\"\n                [disabled]=\"disabled\"\n                [readonly]=\"readonly\"\n                [dataSource]=\"_monthOptions\"\n                textField=\"text\"\n                valueField=\"id\"\n                [ngModel]=\"_selectedMonthOption\"\n                [isItemTruncated]=\"false\"\n                dropdownWidth=\"50\"\n                [maxVisibleItems]=\"12\"\n                [itemHeight]=\"32\"\n                (onValueChanged)=\"_handleMonthSelectChanged($event)\"\n                (click)=\"$event.stopPropagation()\"\n              ></ax-select-box>\n              <ax-select-box\n                class=\"ax-calendar-year-select ax-sm\"\n                look=\"none\"\n                [disabled]=\"disabled\"\n                [readonly]=\"readonly\"\n                [dataSource]=\"_yearOptions\"\n                textField=\"text\"\n                valueField=\"id\"\n                [ngModel]=\"_selectedYearOption\"\n                [isItemTruncated]=\"false\"\n                dropdownWidth=\"40\"\n                [maxVisibleItems]=\"10\"\n                [itemHeight]=\"32\"\n                (onValueChanged)=\"_handleYearSelectChanged($event)\"\n                (click)=\"$event.stopPropagation()\"\n              ></ax-select-box>\n            </div>\n            <button\n              type=\"button\"\n              [attr.disabled]=\"disabled ? '' : null\"\n              [attr.readonly]=\"readonly ? '' : null\"\n              class=\"ax-general-button ax-button-rounded ax-button-icon ax-calendar-day-nav-next\"\n              (click)=\"_handleNextClick()\"\n              [title]=\"'@acorex:common.actions.next' | translate | async\"\n            >\n              <i\n                class=\"ax-icon\"\n                [ngClass]=\"{\n                  'ax-icon-chevron-right': !isRtl(),\n                  'ax-icon-chevron-left': isRtl(),\n                }\"\n              ></i>\n            </button>\n          </div>\n        }\n        @if (showNavigation && look() === 'classic' && last) {\n          <div class=\"ax-calendar-view-header ax-calendar-day-nav\">\n            <button\n              type=\"button\"\n              [attr.disabled]=\"disabled ? '' : null\"\n              [attr.readonly]=\"readonly ? '' : null\"\n              class=\"ax-general-button ax-button-rounded ax-button-icon ax-calendar-day-nav-prev\"\n              (click)=\"_handlePrevClick()\"\n              [title]=\"'@acorex:common.actions.prev' | translate | async\"\n            >\n              <i\n                class=\"ax-icon\"\n                [ngClass]=\"{\n                  'ax-icon-chevron-left': !isRtl(),\n                  'ax-icon-chevron-right': isRtl(),\n                }\"\n              ></i>\n            </button>\n            <div class=\"ax-calendar-header-info ax-calendar-day-nav-center\">\n              <button\n                type=\"button\"\n                [attr.disabled]=\"disabled ? '' : null\"\n                [attr.readonly]=\"readonly ? '' : null\"\n                class=\"ax-general-button ax-button-rounded\"\n                (click)=\"_handleNavClick($event, 'year')\"\n              >\n                {{ v.range.startTime | format: 'date' : { calendar: calendarSystem(), format: 'YYYY' } | async }}\n              </button>\n              <button\n                type=\"button\"\n                [attr.disabled]=\"disabled ? '' : null\"\n                [attr.readonly]=\"readonly ? '' : null\"\n                class=\"ax-general-button ax-button-rounded\"\n                (click)=\"_handleNavClick($event, 'month')\"\n              >\n                {{ v.range.startTime | format: 'date' : { calendar: calendarSystem(), format: 'MMMM' } | async }}\n              </button>\n            </div>\n            <button\n              type=\"button\"\n              [attr.disabled]=\"disabled ? '' : null\"\n              [attr.readonly]=\"readonly ? '' : null\"\n              class=\"ax-general-button ax-button-rounded ax-button-icon ax-calendar-day-nav-next\"\n              (click)=\"_handleNextClick()\"\n              [title]=\"'@acorex:common.actions.next' | translate | async\"\n            >\n              <i\n                class=\"ax-icon\"\n                [ngClass]=\"{\n                  'ax-icon-chevron-right': !isRtl(),\n                  'ax-icon-chevron-left': isRtl(),\n                }\"\n              ></i>\n            </button>\n          </div>\n        }\n        <div class=\"ax-calendar-week\">\n          @for (d of weekLayout(); track d) {\n            <div>{{ weekdayLabel(d) }}</div>\n          }\n        </div>\n\n        <div\n          class=\"ax-calendar-slots ax-calendar-slots-day\"\n          [ngClass]=\"{ 'ax-default': !dayCellTemplate }\"\n          [style.--ax-calendar-day-rows]=\"v.weekCount ?? 5\"\n        >\n          @for (slot of v.slots; track slot.date.date.getTime()) {\n            <button\n              tabindex=\"0\"\n              class=\"ax-calendar-slot\"\n              [ngClass]=\"slot.cssClass\"\n              [class.ax-state-disabled]=\"disabled\"\n              [class.ax-has-holiday-color]=\"!!slot.holidayColor\"\n              [style.--ax-calendar-holiday-color]=\"slot.holidayColor ?? null\"\n              (click)=\"_handleSlotClick($event, slot)\"\n              [disabled]=\"disabled\"\n              [axRipple]\n              [axTooltip]=\"slot.tooltip ?? ''\"\n              [axTooltipDisabled]=\"!slot.tooltip\"\n              [title]=\"\n                !slot.tooltip ? (slot.date | format: 'date' : { calendar: calendarSystem(), format: 'long' } | async) : ''\n              \"\n            >\n              @if (dayCellTemplate) {\n                <div>\n                  <ng-container\n                    [ngTemplateOutlet]=\"dayCellTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: { slot: slot } }\"\n                  >\n                  </ng-container>\n                </div>\n              } @else {\n                <div class=\"ax-calendar-day-slot-content\">\n                  {{ slot.text }}\n                </div>\n              }\n            </button>\n          }\n        </div>\n      }\n    }\n  }\n</div>\n<ng-content select=\"ax-footer\"></ng-content>\n\n</div>", styles: ["@layer properties;@layer components{ax-calendar{margin-inline:auto;display:block;width:100%;max-width:100%}@media(min-width:48rem){ax-calendar{width:calc(var(--spacing, .25rem) * 65)}}ax-calendar .ax-calendar-frame{box-sizing:border-box;width:100%;overflow:hidden;border-radius:14px;border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding:calc(var(--spacing, .25rem) * 2)}ax-calendar .ax-calendar-frame>ax-header{flex-shrink:0}ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer{margin-inline:calc(var(--spacing, .25rem) * -2);box-sizing:border-box;display:flex;width:calc(100% + 1rem);flex-shrink:0;align-items:center;justify-content:center;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2);margin-top:var(--ax-comp-calendar-footer-margin-t)}:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button{display:block;width:100%;cursor:pointer;text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));padding-left:var(--ax-comp-calendar-footer-today-button-padding-x);padding-right:var(--ax-comp-calendar-footer-today-button-padding-x);height:var(--ax-comp-calendar-footer-today-button-height);border-radius:var(--ax-comp-calendar-footer-today-button-border-radius, var(--ax-sys-border-radius));color:rgba(var(--ax-comp-calendar-footer-today-button-text-color));background-color:rgba(var(--ax-comp-calendar-footer-today-button-bg-color))}:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button.ax-state-disabled{cursor:not-allowed;color:rgba(var(--ax-sys-color-on-darkest-surface));opacity:var(--ax-comp-calendar-slot-disabled-opacity);background-color:transparent}@supports (color: color-mix(in lab,red,red)){:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button.ax-state-disabled{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button.ax-state-readonly{cursor:text;opacity:var(--ax-comp-calendar-slot-readonly-opacity)}:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button:is(:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-comp-calendar-footer-today-button-hover-bg-color))}:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button:is(:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button:focus,:is(ax-calendar .ax-calendar-frame>ax-footer,ax-calendar .ax-calendar-frame .ax-calendar-footer) .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-comp-calendar-footer-today-button-focused-outline-color))}ax-calendar ax-popover{display:none}ax-calendar.ax-state-disabled{cursor:not-allowed}ax-calendar.ax-state-disabled .ax-calendar-header,ax-calendar.ax-state-disabled .ax-calendar-view-header,ax-calendar.ax-state-disabled .ax-calendar-week{cursor:not-allowed;color:rgba(var(--ax-sys-color-on-darkest-surface))}@supports (color: color-mix(in lab,red,red)){ax-calendar.ax-state-disabled .ax-calendar-header,ax-calendar.ax-state-disabled .ax-calendar-view-header,ax-calendar.ax-state-disabled .ax-calendar-week{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed}ax-calendar.ax-state-disabled ax-select-box.ax-calendar-month-select,ax-calendar.ax-state-disabled ax-select-box.ax-calendar-year-select{pointer-events:none;cursor:not-allowed;opacity:40%}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spacing, .25rem) * 1)}ax-calendar .ax-calendar-header .ax-calendar-header-info{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex;align-items:center}ax-calendar .ax-calendar-body{display:flex;width:100%;flex-direction:column;align-items:stretch;justify-content:center}ax-calendar .ax-calendar-body>div{width:100%}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;padding:calc(var(--spacing, .25rem) * 4)}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex;align-items:center}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 2)}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--radius-lg, .5rem);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){--tw-ring-color: rgba(var(--ax-sys-color-light-surface));--tw-outline-style: none;outline-style:none}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){--tw-ring-color: color-mix(in oklab, rgba(var(--ax-sys-color-light-surface)) 50%, transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{--tw-ring-color: color-mix(in srgb, #000 30%, transparent)}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{--tw-ring-color: color-mix(in oklab, var(--color-black, #000) 30%, transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){--tw-ring-color: color-mix(in srgb, #fff 30%, transparent)}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){--tw-ring-color: color-mix(in oklab, var(--color-white, #fff) 30%, transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;color:rgba(var(--ax-sys-color-on-darkest-surface));opacity:1;background-color:transparent!important;border-color:transparent!important;box-shadow:none!important}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled:hover,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled:focus-visible{color:rgba(var(--ax-sys-color-on-darkest-surface));background-color:transparent!important;border-color:transparent!important}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled:hover,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled:focus-visible{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-today,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-selected,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-holiday,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-holiday.ax-has-holiday-color{color:rgba(var(--ax-sys-color-on-darkest-surface));background-color:transparent!important;border-color:transparent!important}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-today,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-selected,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-holiday,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled.ax-state-holiday.ax-has-holiday-color{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:70%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:50%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other.ax-state-today{opacity:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot .ax-ripple{background-color:rgba(var(--ax-sys-color-light-surface))}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot .ax-ripple{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-light-surface)) 30%,transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{background-color:var(--color-darkest);color:var(--color-on-darkest);border-color:var(--color-border-darkest)}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday:not(.ax-has-holiday-color){border-color:rgba(var(--ax-sys-color-light-surface))!important;--tw-inset-ring-color: rgba(var(--ax-sys-color-secondary-600)) !important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday.ax-has-holiday-color{border-color:var(--ax-calendar-holiday-color)!important;--tw-inset-ring-color: var(--ax-calendar-holiday-color) !important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday.ax-has-holiday-color:not(.ax-state-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:var(--ax-calendar-holiday-color)!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-secondary-50))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-surface))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:not(.ax-has-holiday-color){background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-secondary-50))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:not(.ax-has-holiday-color):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-surface))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:not(.ax-has-holiday-color):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:not(.ax-has-holiday-color){color:rgba(var(--ax-sys-color-danger-600))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:not(.ax-has-holiday-color) .ax-ripple:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-on-danger-surface))}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:not(.ax-has-holiday-color) .ax-ripple:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-danger-surface)) 30%,transparent)}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:var(--ax-calendar-holiday-color)!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color:hover:not(.ax-state-disabled):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:var(--ax-calendar-holiday-color)!important}.ax-dark :is(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color):hover:not(.ax-state-disabled){background-color:var(--ax-calendar-holiday-color)!important;border-color:var(--ax-calendar-holiday-color)!important}@supports (color: color-mix(in lab,red,red)){.ax-dark :is(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color):hover:not(.ax-state-disabled){background-color:color-mix(in srgb,var(--ax-calendar-holiday-color) 14%,transparent)!important}}.ax-dark :is(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color) .ax-ripple{background-color:var(--ax-calendar-holiday-color)!important}@supports (color: color-mix(in lab,red,red)){.ax-dark :is(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color) .ax-ripple{background-color:color-mix(in srgb,var(--ax-calendar-holiday-color) 30%,transparent)!important}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-state-selected{color:rgba(var(--ax-comp-calendar-slot-holiday-selected-text-color))!important;background-color:var(--ax-calendar-holiday-color)!important;border-color:var(--ax-calendar-holiday-color)!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-state-selected:hover:not(.ax-state-disabled){color:rgba(var(--ax-comp-calendar-slot-holiday-selected-text-color))!important;background-color:var(--ax-calendar-holiday-color)!important;border-color:var(--ax-calendar-holiday-color)!important}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-state-selected:hover:not(.ax-state-disabled){background-color:color-mix(in srgb,var(--ax-calendar-holiday-color) 82%,black)!important}}@supports (color: color-mix(in lab,red,red)){ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-state-selected:hover:not(.ax-state-disabled){border-color:color-mix(in srgb,var(--ax-calendar-holiday-color) 82%,black)!important}}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color .ax-calendar-day-slot-content{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{column-gap:calc(var(--spacing, .25rem) * 0);row-gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(var(--ax-calendar-day-rows, 5),minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-top:var(--ax-comp-calendar-week-padding-t, .5rem);padding-left:var(--ax-comp-calendar-week-padding-x, .5rem);padding-right:var(--ax-comp-calendar-week-padding-x, .5rem)}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav,ax-calendar.ax-look-classic .ax-calendar-view-header.ax-calendar-day-nav{display:grid;align-items:center;gap:calc(var(--spacing, .25rem) * 1);grid-template-columns:auto 1fr auto}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav,ax-calendar.ax-look-classic .ax-calendar-view-header.ax-calendar-day-nav) .ax-icon{font-size:.875rem}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav,ax-calendar.ax-look-classic .ax-calendar-view-header.ax-calendar-day-nav) .ax-calendar-day-nav-prev{justify-self:start}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav,ax-calendar.ax-look-classic .ax-calendar-view-header.ax-calendar-day-nav) .ax-calendar-day-nav-center{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1)}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav,ax-calendar.ax-look-classic .ax-calendar-view-header.ax-calendar-day-nav) .ax-calendar-day-nav-next{justify-self:end}ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-month-select,ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-year-select{display:inline-block;height:calc(var(--spacing, .25rem) * 5);width:auto;flex-shrink:0;flex-grow:0;flex-basis:auto;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-month-select,ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-year-select) .ax-icon{font-size:.75rem}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-month-select,ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-year-select) .ax-editor-container{gap:0}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-month-select,ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-year-select) ax-dropdown-box.ax-editor-container{width:auto;justify-content:flex-start}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-month-select,ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-year-select) .ax-chips-container{width:auto;flex-shrink:0;flex-grow:0;flex-basis:auto}:is(ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-month-select,ax-calendar.ax-look-select .ax-calendar-view-header.ax-calendar-day-nav ax-select-box.ax-calendar-year-select) .ax-chips-container .ax-chips{overflow:visible;text-overflow:unset}}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-calendar{margin-inline:calc(var(--spacing, .25rem) * 0);display:block;width:100%}.ax-calendar-picker ax-calendar .ax-calendar-frame{width:100%}.ax-calendar-picker ax-picker{flex:1}ax-datetime-picker ax-calendar{margin-inline:calc(var(--spacing, .25rem) * 0);display:block;width:100%}ax-datetime-picker ax-calendar .ax-calendar-frame{width:100%}.ax-overlay-pane ax-calendar{margin-inline:calc(var(--spacing, .25rem) * 0);display:block;width:100%}.ax-overlay-pane ax-calendar .ax-calendar-frame{width:100%;border-radius:0;--tw-border-style: none;border-style:none;padding:calc(var(--spacing, .25rem) * 0);background:transparent}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXDateTimeModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i2.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-calendar', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, inputs: [
                         'rtl',
@@ -1542,8 +1542,8 @@ class AXCalendarRangeComponent extends classes((MXValueComponent), MXInteractive
             this._c1.navTo(e.startOf('year'));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.8", type: AXCalendarRangeComponent, isStandalone: true, selector: "ax-calendar-range", inputs: { rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, depth: { classPropertyName: "depth", publicName: "depth", isSignal: false, isRequired: false, transformFunction: null }, activeView: { classPropertyName: "activeView", publicName: "activeView", isSignal: false, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: false, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: false, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: false, isRequired: false, transformFunction: null }, holidayDates: { classPropertyName: "holidayDates", publicName: "holidayDates", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, dayCellTemplate: { classPropertyName: "dayCellTemplate", publicName: "dayCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, monthCellTemplate: { classPropertyName: "monthCellTemplate", publicName: "monthCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, yearCellTemplate: { classPropertyName: "yearCellTemplate", publicName: "yearCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, cellClass: { classPropertyName: "cellClass", publicName: "cellClass", isSignal: false, isRequired: false, transformFunction: null }, showNavigation: { classPropertyName: "showNavigation", publicName: "showNavigation", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, holidays: { classPropertyName: "holidays", publicName: "holidays", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onOptionChanged: "onOptionChanged", valueChange: "valueChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", activeViewChange: "activeViewChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate", onSlotClick: "onSlotClick" }, host: { properties: { "class.ax-state-disabled": "disabled" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: AXCalendarRangeComponent, isStandalone: true, selector: "ax-calendar-range", inputs: { rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, depth: { classPropertyName: "depth", publicName: "depth", isSignal: false, isRequired: false, transformFunction: null }, activeView: { classPropertyName: "activeView", publicName: "activeView", isSignal: false, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: false, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: false, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: false, isRequired: false, transformFunction: null }, holidayDates: { classPropertyName: "holidayDates", publicName: "holidayDates", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, dayCellTemplate: { classPropertyName: "dayCellTemplate", publicName: "dayCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, monthCellTemplate: { classPropertyName: "monthCellTemplate", publicName: "monthCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, yearCellTemplate: { classPropertyName: "yearCellTemplate", publicName: "yearCellTemplate", isSignal: false, isRequired: false, transformFunction: null }, cellClass: { classPropertyName: "cellClass", publicName: "cellClass", isSignal: false, isRequired: false, transformFunction: null }, showNavigation: { classPropertyName: "showNavigation", publicName: "showNavigation", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, holidays: { classPropertyName: "holidays", publicName: "holidays", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onOptionChanged: "onOptionChanged", valueChange: "valueChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", activeViewChange: "activeViewChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate", onSlotClick: "onSlotClick" }, host: { properties: { "class.ax-state-disabled": "disabled" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => AXCalendarRangeComponent),
@@ -1557,7 +1557,7 @@ class AXCalendarRangeComponent extends classes((MXValueComponent), MXInteractive
             { provide: AXComponent, useExisting: AXCalendarRangeComponent },
         ], viewQueries: [{ propertyName: "_c1", first: true, predicate: ["c1"], descendants: true, static: true }, { propertyName: "_c2", first: true, predicate: ["c2"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-calendar-range-header\">\n  <button\n    type=\"button\"\n    [attr.disabled]=\"disabled ? '' : null\"\n    class=\"ax-general-button ax-button-icon pb-4\"\n    (click)=\"handlePrevClick()\"\n  >\n    <i\n      class=\"ax-icon\"\n      [ngClass]=\"{\n        'ax-icon-chevron-left': !isRtl(),\n        'ax-icon-chevron-right': isRtl(),\n      }\"\n    ></i>\n  </button>\n  <div class=\"ax-calendar-header-range-info\">\n    <button\n      type=\"button\"\n      [attr.disabled]=\"disabled ? '' : null\"\n      class=\"ax-general-button ax-calendar-range-nav-label ax-calendar-range-nav-label--start\"\n      (click)=\"handleNavClick()\"\n    >\n      {{ _navText1 }}\n    </button>\n    <button\n      type=\"button\"\n      [attr.disabled]=\"disabled ? '' : null\"\n      class=\"ax-general-button ax-calendar-range-nav-label ax-calendar-range-nav-label--end\"\n      (click)=\"handleNavClick()\"\n    >\n      {{ _navText2 }}\n    </button>\n  </div>\n  <button\n    type=\"button\"\n    [attr.disabled]=\"disabled ? '' : null\"\n    class=\"ax-general-button ax-button-icon pb-4\"\n    (click)=\"handleNextClick()\"\n  >\n    <i\n      class=\"ax-icon\"\n      [ngClass]=\"{\n        'ax-icon-chevron-right': !isRtl(),\n        'ax-icon-chevron-left': isRtl(),\n      }\"\n    ></i>\n  </button>\n</div>\n\n<div class=\"ax-calendar-range-body\">\n  <div class=\"ax-calendar-range-panel ax-calendar-range-panel--start\">\n    <ax-calendar\n      #c1\n      [showNavigation]=\"false\"\n      [readonly]=\"true\"\n      [disabled]=\"disabled\"\n      [cellClass]=\"getCellClass\"\n      [type]=\"type\"\n      [dayCellTemplate]=\"dayCellTemplate\"\n      [monthCellTemplate]=\"monthCellTemplate\"\n      [yearCellTemplate]=\"yearCellTemplate\"\n      [minValue]=\"minValue\"\n      [maxValue]=\"maxValue\"\n      [depth]=\"depth\"\n      [look]=\"look()\"\n      [holidays]=\"holidays()\"\n      [holidayDates]=\"holidayDates\"\n      (onSlotClick)=\"handleSlotClick($event)\"\n      (onNavigate)=\"handleNavigate()\"\n      (activeViewChange)=\"handleActiveViewChange1()\"\n    >\n    </ax-calendar>\n  </div>\n  <div class=\"ax-calendar-range-panel ax-calendar-range-panel--end\">\n    <ax-calendar\n      #c2\n      [showNavigation]=\"false\"\n      [readonly]=\"true\"\n      [disabled]=\"disabled\"\n      [cellClass]=\"getCellClass\"\n      [type]=\"type\"\n      [dayCellTemplate]=\"dayCellTemplate\"\n      [monthCellTemplate]=\"monthCellTemplate\"\n      [yearCellTemplate]=\"yearCellTemplate\"\n      [minValue]=\"minValue\"\n      [maxValue]=\"maxValue\"\n      [depth]=\"depth\"\n      [look]=\"look()\"\n      [holidays]=\"holidays()\"\n      [holidayDates]=\"holidayDates\"\n      (onSlotClick)=\"handleSlotClick($event)\"\n      (onNavigate)=\"handleCalendar2Navigate()\"\n      (activeViewChange)=\"handleActiveViewChange2()\"\n    >\n    </ax-calendar>\n  </div>\n</div>\n\n<ng-content select=\"ax-footer\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-calendar-range{display:block;gap:calc(var(--spacing, .25rem) * 2);border-radius:14px;border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-light-surface));padding:calc(var(--spacing, .25rem) * 2)}ax-calendar-range>ax-footer{margin-inline:calc(var(--spacing, .25rem) * -2);box-sizing:border-box;width:calc(100% + 1rem);flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2);margin-top:var(--ax-comp-calendar-footer-margin-t)}ax-calendar-range.ax-state-disabled{cursor:not-allowed}ax-calendar-range.ax-state-disabled .ax-calendar-range-header{cursor:not-allowed}ax-calendar-range.ax-state-disabled .ax-calendar-range-header button{cursor:not-allowed;color:rgba(var(--ax-sys-color-on-darkest-surface))}@supports (color: color-mix(in lab,red,red)){ax-calendar-range.ax-state-disabled .ax-calendar-range-header button{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}ax-calendar-range.ax-state-disabled ax-calendar .ax-calendar-slot.ax-range-start,ax-calendar-range.ax-state-disabled ax-calendar .ax-calendar-slot.ax-range-end,ax-calendar-range.ax-state-disabled ax-calendar .ax-calendar-slot.ax-range-between{color:rgba(var(--ax-sys-color-on-darkest-surface));background-color:transparent!important;border-color:transparent!important;opacity:1}@supports (color: color-mix(in lab,red,red)){ax-calendar-range.ax-state-disabled ax-calendar .ax-calendar-slot.ax-range-start,ax-calendar-range.ax-state-disabled ax-calendar .ax-calendar-slot.ax-range-end,ax-calendar-range.ax-state-disabled ax-calendar .ax-calendar-slot.ax-range-between{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-darkest-surface)) 40%,transparent)}}ax-calendar-range .ax-calendar-range-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 1);padding-bottom:calc(var(--spacing, .25rem) * 0)!important}ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{display:flex;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{flex-direction:row}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{align-items:center}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{justify-content:space-between}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{gap:calc(var(--spacing, .25rem) * 6)}}ax-calendar-range .ax-calendar-range-header .ax-calendar-range-nav-label{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-on-lightest-surface))}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-header .ax-calendar-range-nav-label{display:flex}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-header .ax-calendar-range-nav-label{width:calc(var(--spacing, .25rem) * 40)}}ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-buttons{display:flex}ax-calendar-range .ax-calendar-range-body{display:flex;width:100%;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-body{flex-direction:row}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-body{align-items:flex-start}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-body{justify-content:space-between}}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-body{gap:calc(var(--spacing, .25rem) * 2)}}ax-calendar-range .ax-calendar-range-panel{display:flex;width:100%;flex-shrink:0;justify-content:center}@media(min-width:48rem){ax-calendar-range .ax-calendar-range-panel{width:calc(var(--spacing, .25rem) * 58)}}ax-calendar-range ax-calendar{margin:calc(var(--spacing, .25rem) * 0);margin-inline:calc(var(--spacing, .25rem) * 0);display:block;width:100%;padding:calc(var(--spacing, .25rem) * 0);--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-calendar-range ax-calendar .ax-calendar-frame{width:100%;max-width:none;border-radius:0;--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}ax-calendar-range ax-calendar .ax-calendar-body{width:100%}ax-calendar-range ax-calendar .ax-calendar-body>div{width:100%}@media(min-width:48rem){ax-calendar-range ax-calendar .ax-calendar-body>div{width:calc(var(--spacing, .25rem) * 58)}}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-week{padding-top:.25rem;padding-left:.25rem;padding-right:.25rem}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-week>div{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots{padding:calc(var(--spacing, .25rem) * 1)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{row-gap:calc(var(--spacing, .25rem) * 1)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:not(.ax-has-holiday-color):not(.ax-range-start):not(.ax-range-end){color:rgba(var(--ax-sys-color-danger-600))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between{background-color:var(--color-darkest);color:var(--color-on-darkest);border-color:var(--color-border-darkest);opacity:100%}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-end{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-dark-surface));opacity:100%}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-start:hover,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-end:hover{background-color:rgba(var(--ax-sys-color-on-lightest-surface));color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-start:not(.ax-range-continue-end),ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-end:not(.ax-range-continue-start),ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between:not(.ax-range-continue-start):not(.ax-range-continue-end){border-radius:var(--radius-lg, .5rem)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-start.ax-range-continue-end{border-radius:0;border-start-start-radius:var(--radius-lg, .5rem);border-end-start-radius:var(--radius-lg, .5rem)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-end.ax-range-continue-start{border-radius:0;border-start-end-radius:var(--radius-lg, .5rem);border-end-end-radius:var(--radius-lg, .5rem)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between.ax-range-continue-start.ax-range-continue-end{border-radius:0}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between.ax-range-continue-start:not(.ax-range-continue-end){border-radius:0;border-start-end-radius:var(--radius-lg, .5rem);border-end-end-radius:var(--radius-lg, .5rem)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between:not(.ax-range-continue-start).ax-range-continue-end{border-radius:0;border-start-start-radius:var(--radius-lg, .5rem);border-end-start-radius:var(--radius-lg, .5rem)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other.ax-range-end,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other.ax-range-between{opacity:100%}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-range-end{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-end{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-dark-surface));opacity:100%;border-color:transparent!important}:is(ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-end):hover{background-color:rgba(var(--ax-sys-color-on-lightest-surface));color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-between{color:rgba(var(--ax-sys-color-danger-600));border-color:transparent!important}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-between:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-range-between:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);color:rgba(var(--ax-sys-color-danger-600))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color:not(.ax-range-start):not(.ax-range-end):not(.ax-range-between):hover:not(.ax-state-disabled){background-color:rgba(var(--ax-sys-color-on-lightest-surface));color:var(--ax-calendar-holiday-color)!important;border-color:transparent!important}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-range-end{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-dark-surface));opacity:100%;border-color:transparent!important}:is(ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-range-end):hover{background-color:rgba(var(--ax-sys-color-on-lightest-surface));color:rgba(var(--ax-sys-color-dark-surface))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-range-between{background-color:var(--color-surface)!important;color:var(--color-on-surface)!important;border-color:var(--color-border-surface)!important;color:var(--ax-calendar-holiday-color)!important;border-color:transparent!important}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday.ax-has-holiday-color.ax-range-between:hover{background-color:var(--color-surface)!important;color:var(--color-on-surface)!important;border-color:var(--color-border-surface)!important;color:var(--ax-calendar-holiday-color)!important}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXCalendarComponent, selector: "ax-calendar", inputs: ["rtl", "readonly", "value", "name", "disabled", "depth", "activeView", "minValue", "maxValue", "disabledDates", "holidayDates", "type", "dayCellTemplate", "monthCellTemplate", "yearCellTemplate", "cellClass", "showNavigation", "count", "id", "weekend", "weekdays", "look", "yearRange", "holidays"], outputs: ["onOptionChanged", "valueChange", "onValueChanged", "minValueChange", "maxValueChange", "onBlur", "onFocus", "depthChange", "typeChange", "activeViewChange", "disabledDatesChange", "holidayDatesChange", "onNavigate", "onSlotClick", "countChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarRangeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarRangeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-calendar-range', encapsulation: ViewEncapsulation.None, inputs: [
                         'rtl',
@@ -1614,11 +1614,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             }] } });
 
 class AXCalendarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarModule, imports: [AXCalendarComponent, AXCalendarRangeComponent], exports: [AXCalendarComponent, AXCalendarRangeComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarModule, imports: [AXCalendarComponent, AXCalendarRangeComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarModule, imports: [AXCalendarComponent, AXCalendarRangeComponent], exports: [AXCalendarComponent, AXCalendarRangeComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarModule, imports: [AXCalendarComponent, AXCalendarRangeComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCalendarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCalendarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [AXCalendarComponent, AXCalendarRangeComponent],

package/fesm2022/acorex-components-check-box.mjs

@@ -107,8 +107,8 @@ class AXCheckBoxComponent extends classes((MXValueComponent), MXColorComponent)
             this.commitValue(!this.value, true);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCheckBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXCheckBoxComponent, isStandalone: true, selector: "ax-check-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "click": "_handleClick($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCheckBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXCheckBoxComponent, isStandalone: true, selector: "ax-check-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "click": "_handleClick($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
             { provide: AXValuableComponent, useExisting: AXCheckBoxComponent },
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -118,7 +118,7 @@ class AXCheckBoxComponent extends classes((MXValueComponent), MXColorComponent)
             { provide: AXComponent, useExisting: AXCheckBoxComponent },
         ], queries: [{ propertyName: "_labels", predicate: AXLabelComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-checkbox-label\" [class.ax-state-readonly]=\"readonly\" [class.ax-state-disabled]=\"disabled\">\n  <div class=\"ax-checkbox-start-side\">\n    @if (isLoading()) {\n      <div class=\"ax-loading-container\">\n        <ax-loading></ax-loading>\n      </div>\n    } @else {\n      <input\n        [id]=\"id\"\n        class=\"ax-check-box\"\n        type=\"checkbox\"\n        [indeterminate]=\"_stateIndeterminate\"\n        [ngModel]=\"value\"\n        (ngModelChange)=\"_handleModelChange($event)\"\n        [checked]=\"value\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [tabindex]=\"tabIndex\"\n        (focus)=\"emitOnFocusEvent($event)\"\n        (blur)=\"emitOnBlurEvent($event)\"\n        #cb\n      />\n      <div class=\"ax-checkbox-background\" (click)=\"changeValue()\">\n        @if (cb.indeterminate) {\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n            <rect x=\"3\" y=\"7\" width=\"10\" height=\"2\" />\n          </svg>\n        }\n        @if (cb.checked) {\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n            <path\n              d=\"M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z\"\n            />\n          </svg>\n        }\n      </div>\n    }\n  </div>\n  <div class=\"ax-checkbox-end-side\">\n    <ng-content select=\"ax-label\"></ng-content>\n    <ng-content select=\"ax-form-hint\"></ng-content>\n    <span class=\"ax-error-container\"></span>\n  </div>\n</div>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{.ax-checkbox-label{display:flex;width:fit-content;cursor:pointer;align-items:flex-start;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);-webkit-user-select:none;user-select:none}.ax-checkbox-label.ax-state-disabled .ax-check-box:disabled{opacity:100%}.ax-checkbox-label .ax-checkbox-start-side{position:relative;display:flex;align-items:center;--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5)}.ax-checkbox-label .ax-checkbox-start-side .ax-loading-container{width:calc(var(--spacing, .25rem) * 4)}.ax-checkbox-label .ax-checkbox-start-side .ax-check-box{margin:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 4);min-width:calc(var(--spacing, .25rem) * 4);cursor:pointer;-webkit-appearance:none;appearance:none;border-radius:var(--radius-sm, .25rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s))}.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:checked,.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:indeterminate{border-color:var(--ax-comp-bg,var(--color-primary));background-color:var(--ax-comp-bg,var(--color-primary));background-size:contain;background-repeat:no-repeat}.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:focus-visible,.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:focus{border-color:var(--ax-comp-bg,var(--color-primary));--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-ring-color: var(--ax-comp-border,rgba(var(--ax-sys-color-primary-surface)));--tw-outline-style: none;outline-style:none}@supports (color: color-mix(in lab,red,red)){.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:focus-visible,.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:focus{--tw-ring-color: color-mix(in oklab, var(--ax-comp-border,var(--color-primary)) 30%, transparent)}}.ax-checkbox-label .ax-checkbox-start-side .ax-check-box:disabled{cursor:not-allowed;opacity:50%}.ax-checkbox-label .ax-checkbox-start-side .ax-checkbox-background{position:absolute}.ax-checkbox-label .ax-checkbox-start-side .ax-checkbox-background svg{fill:var(--ax-comp-text,var(--color-on-primary))}.ax-checkbox-label .ax-checkbox-end-side{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 1)}.ax-checkbox-label .ax-checkbox-end-side ax-label label{margin-bottom:calc(var(--spacing, .25rem) * 0)!important}.ax-checkbox-label .ax-checkbox-end-side ax-form-hint{margin:calc(var(--spacing, .25rem) * 0)!important;cursor:text;-webkit-user-select:text;user-select:text}.ax-checkbox-label .ax-checkbox-end-side ax-label,.ax-checkbox-label .ax-checkbox-end-side ax-form-hint,.ax-checkbox-label .ax-checkbox-end-side .ax-error-container{padding-inline-start:calc(var(--spacing, .25rem) * 3)}}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCheckBoxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCheckBoxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-check-box', inputs: ['disabled', 'tabIndex', 'readonly', 'color', 'value', 'name', 'id'], outputs: ['onBlur', 'onFocus', 'valueChange', 'onValueChanged'], encapsulation: ViewEncapsulation.None, providers: [
                         { provide: AXValuableComponent, useExisting: AXCheckBoxComponent },
@@ -143,11 +143,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             }] } });
 
 class AXCheckBoxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCheckBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXCheckBoxModule, imports: [AXCheckBoxComponent], exports: [AXCheckBoxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCheckBoxModule, imports: [AXCheckBoxComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCheckBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXCheckBoxModule, imports: [AXCheckBoxComponent], exports: [AXCheckBoxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCheckBoxModule, imports: [AXCheckBoxComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCheckBoxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCheckBoxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [AXCheckBoxComponent],

package/fesm2022/acorex-components-chips.mjs

@@ -25,10 +25,10 @@ class AXChipsComponent extends MXColorLookComponent {
     get __hostClass() {
         return `${this.color} ${this.interactiveLook} `;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXChipsComponent, isStandalone: true, selector: "ax-chips", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXChipsComponent }], usesInheritance: true, hostDirectives: [{ directive: i1.AXRippleDirective }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@if (text()) {\n  <div class=\"ax-chips-text\">{{ text() }}</div>\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-chips{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));-webkit-user-select:none;user-select:none}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center}ax-chips.ax-xs{gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-chips.ax-sm{gap:calc(var(--spacing, .25rem) * 1.5);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-chips.ax-md{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-chips.ax-lg{gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}ax-chips.ax-xl{gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4);font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXChipsComponent, isStandalone: true, selector: "ax-chips", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXChipsComponent }], usesInheritance: true, hostDirectives: [{ directive: i1.AXRippleDirective }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@if (text()) {\n  <div class=\"ax-chips-text\">{{ text() }}</div>\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-chips{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));-webkit-user-select:none;user-select:none}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center}ax-chips.ax-xs{gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-chips.ax-sm{gap:calc(var(--spacing, .25rem) * 1.5);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-chips.ax-md{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-chips.ax-lg{gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}ax-chips.ax-xl{gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4);font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXChipsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXChipsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-chips', inputs: ['tabIndex', 'color', 'look'], hostDirectives: [AXRippleDirective], encapsulation: ViewEncapsulation.None, providers: [{ provide: AXComponent, useExisting: AXChipsComponent }], template: "<ng-content select=\"ax-prefix\"></ng-content>\n@if (text()) {\n  <div class=\"ax-chips-text\">{{ text() }}</div>\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-chips{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));-webkit-user-select:none;user-select:none}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center}ax-chips.ax-xs{gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-chips.ax-sm{gap:calc(var(--spacing, .25rem) * 1.5);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-chips.ax-md{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-chips.ax-lg{gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}ax-chips.ax-xl{gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 5);padding-block:calc(var(--spacing, .25rem) * 4);font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
         }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }, { type: i0.Output, args: ["textChange"] }], __hostClass: [{
@@ -37,11 +37,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             }] } });
 
 class AXChipsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXChipsModule, imports: [AXChipsComponent], exports: [AXChipsComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXChipsModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXChipsModule, imports: [AXChipsComponent], exports: [AXChipsComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXChipsModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXChipsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXChipsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [AXChipsComponent],

package/fesm2022/acorex-components-circular-progress.mjs

@@ -95,10 +95,10 @@ class AXCircularProgressComponent extends MXColorComponent {
             this.progress.set(65);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCircularProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: AXCircularProgressComponent, isStandalone: true, selector: "ax-circular-progress", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, stroke: { classPropertyName: "stroke", publicName: "stroke", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { progress: "progressChange", stroke: "strokeChange", size: "sizeChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXCircularProgressComponent }], viewQueries: [{ propertyName: "circle", first: true, predicate: ["circle"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-progress-circular ax-progress-{{ mode() }}\" #circle>\n  <span class=\"ax-progress-content\">\n    <ng-content></ng-content>\n  </span>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["@layer properties;@layer components{.dark ax-circular-progress .ax-progress-circular:before{background-color:rgba(var(--ax-sys-color-darkest-surface))}ax-circular-progress .ax-progress-circular{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);align-items:center;justify-content:center;border-radius:calc(infinity * 1px)}ax-circular-progress .ax-progress-circular:before{position:absolute;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-content: \"\";content:var(--tw-content)}ax-circular-progress .ax-progress-circular .ax-progress-content{position:relative;display:flex;align-items:center;justify-content:center}ax-circular-progress .ax-progress-circular.ax-progress-indeterminate{animation:var(--animate-spin, spin 1s linear infinite)}}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@keyframes spin{to{transform:rotate(360deg)}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCircularProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: AXCircularProgressComponent, isStandalone: true, selector: "ax-circular-progress", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, stroke: { classPropertyName: "stroke", publicName: "stroke", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { progress: "progressChange", stroke: "strokeChange", size: "sizeChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXCircularProgressComponent }], viewQueries: [{ propertyName: "circle", first: true, predicate: ["circle"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-progress-circular ax-progress-{{ mode() }}\" #circle>\n  <span class=\"ax-progress-content\">\n    <ng-content></ng-content>\n  </span>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["@layer properties;@layer components{.dark ax-circular-progress .ax-progress-circular:before{background-color:rgba(var(--ax-sys-color-darkest-surface))}ax-circular-progress .ax-progress-circular{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);align-items:center;justify-content:center;border-radius:calc(infinity * 1px)}ax-circular-progress .ax-progress-circular:before{position:absolute;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-content: \"\";content:var(--tw-content)}ax-circular-progress .ax-progress-circular .ax-progress-content{position:relative;display:flex;align-items:center;justify-content:center}ax-circular-progress .ax-progress-circular.ax-progress-indeterminate{animation:var(--animate-spin, spin 1s linear infinite)}}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@keyframes spin{to{transform:rotate(360deg)}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCircularProgressComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCircularProgressComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-circular-progress', inputs: ['color'], encapsulation: ViewEncapsulation.None, providers: [{ provide: AXComponent, useExisting: AXCircularProgressComponent }], template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-progress-circular ax-progress-{{ mode() }}\" #circle>\n  <span class=\"ax-progress-content\">\n    <ng-content></ng-content>\n  </span>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["@layer properties;@layer components{.dark ax-circular-progress .ax-progress-circular:before{background-color:rgba(var(--ax-sys-color-darkest-surface))}ax-circular-progress .ax-progress-circular{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);align-items:center;justify-content:center;border-radius:calc(infinity * 1px)}ax-circular-progress .ax-progress-circular:before{position:absolute;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-content: \"\";content:var(--tw-content)}ax-circular-progress .ax-progress-circular .ax-progress-content{position:relative;display:flex;align-items:center;justify-content:center}ax-circular-progress .ax-progress-circular.ax-progress-indeterminate{animation:var(--animate-spin, spin 1s linear infinite)}}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@keyframes spin{to{transform:rotate(360deg)}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { circle: [{ type: i0.ViewChild, args: ['circle', { isSignal: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], progress: [{ type: i0.Input, args: [{ isSignal: true, alias: "progress", required: false }] }, { type: i0.Output, args: ["progressChange"] }], stroke: [{ type: i0.Input, args: [{ isSignal: true, alias: "stroke", required: false }] }, { type: i0.Output, args: ["strokeChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }, { type: i0.Output, args: ["sizeChange"] }], __hostClass: [{
@@ -107,11 +107,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             }] } });
 
 class AXCircularProgressModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCircularProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXCircularProgressModule, imports: [AXCircularProgressComponent], exports: [AXCircularProgressComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCircularProgressModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCircularProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXCircularProgressModule, imports: [AXCircularProgressComponent], exports: [AXCircularProgressComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCircularProgressModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCircularProgressModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCircularProgressModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [AXCircularProgressComponent],

package/fesm2022/acorex-components-code-editor.mjs

@@ -455,10 +455,10 @@ class AXCodeEditorPluginRegistry {
     registerExtensionPlugin(plugin) {
         this.extensionPlugins.set(plugin.id, plugin);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorPluginRegistry, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorPluginRegistry, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorPluginRegistry, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorPluginRegistry, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorPluginRegistry, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorPluginRegistry, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
@@ -868,8 +868,8 @@ class AXCodeEditorComponent extends MXValueComponent {
         const text = this.value ?? '';
         return text ? text.split(/\r?\n/).length : 1;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: AXCodeEditorComponent, isStandalone: true, selector: "ax-code-editor", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, editorReadonly: { classPropertyName: "editorReadonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, lineNumbers: { classPropertyName: "lineNumbers", publicName: "lineNumbers", isSignal: true, isRequired: false, transformFunction: null }, lineWrapping: { classPropertyName: "lineWrapping", publicName: "lineWrapping", isSignal: true, isRequired: false, transformFunction: null }, tabSize: { classPropertyName: "tabSize", publicName: "tabSize", isSignal: true, isRequired: false, transformFunction: null }, indentWithTab: { classPropertyName: "indentWithTab", publicName: "indentWithTab", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, extensions: { classPropertyName: "extensions", publicName: "extensions", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, focusOnReady: { classPropertyName: "focusOnReady", publicName: "focusOnReady", isSignal: true, isRequired: false, transformFunction: null }, formatOnSave: { classPropertyName: "formatOnSave", publicName: "formatOnSave", isSignal: true, isRequired: false, transformFunction: null }, minRow: { classPropertyName: "minRow", publicName: "minRow", isSignal: true, isRequired: false, transformFunction: null }, customCompletions: { classPropertyName: "customCompletions", publicName: "customCompletions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChanged: "onValueChanged", valueChange: "valueChange", stateChange: "stateChange", readonlyChange: "readonlyChange", disabledChange: "disabledChange", ready: "ready", save: "save" }, host: { listeners: { "keydown.control.s": "onSaveShortcut($event)" }, classAttribute: "ax-code-editor block" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: AXCodeEditorComponent, isStandalone: true, selector: "ax-code-editor", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, editorReadonly: { classPropertyName: "editorReadonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, lineNumbers: { classPropertyName: "lineNumbers", publicName: "lineNumbers", isSignal: true, isRequired: false, transformFunction: null }, lineWrapping: { classPropertyName: "lineWrapping", publicName: "lineWrapping", isSignal: true, isRequired: false, transformFunction: null }, tabSize: { classPropertyName: "tabSize", publicName: "tabSize", isSignal: true, isRequired: false, transformFunction: null }, indentWithTab: { classPropertyName: "indentWithTab", publicName: "indentWithTab", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, extensions: { classPropertyName: "extensions", publicName: "extensions", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, focusOnReady: { classPropertyName: "focusOnReady", publicName: "focusOnReady", isSignal: true, isRequired: false, transformFunction: null }, formatOnSave: { classPropertyName: "formatOnSave", publicName: "formatOnSave", isSignal: true, isRequired: false, transformFunction: null }, minRow: { classPropertyName: "minRow", publicName: "minRow", isSignal: true, isRequired: false, transformFunction: null }, customCompletions: { classPropertyName: "customCompletions", publicName: "customCompletions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChanged: "onValueChanged", valueChange: "valueChange", stateChange: "stateChange", readonlyChange: "readonlyChange", disabledChange: "disabledChange", ready: "ready", save: "save" }, host: { listeners: { "keydown.control.s": "onSaveShortcut($event)" }, classAttribute: "ax-code-editor block" }, providers: [
             { provide: AXValuableComponent, useExisting: AXCodeEditorComponent },
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -893,7 +893,7 @@ class AXCodeEditorComponent extends MXValueComponent {
     <div class="ax-error-container"></div>
   `, isInline: true, styles: [":host{display:block;width:100%;max-height:90vh}:host.ax-disable{opacity:.5;cursor:not-allowed}:host>.ax-editor-container{height:100%;width:100%;padding:.5rem;align-items:start;--ax-comp-editor-space-start-size: 0;--ax-comp-editor-space-end-size: 0;--ax-comp-editor-border-width: 1px}:host .ax-code-editor-container{display:flex;flex-direction:column;height:100%;width:100%}:host .cm-editor{width:100%;max-width:100%;overflow:auto}:host .cm-editor.cm-focused{outline:none}:host .ax-error-message{padding-inline:.5rem}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-code-editor', host: {
                         '(keydown.control.s)': 'onSaveShortcut($event)',
@@ -924,11 +924,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         }], ctorParameters: () => [], propDecorators: { language: [{ type: i0.Input, args: [{ isSignal: true, alias: "language", required: false }] }], editorReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], lineNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "lineNumbers", required: false }] }], lineWrapping: [{ type: i0.Input, args: [{ isSignal: true, alias: "lineWrapping", required: false }] }], tabSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabSize", required: false }] }], indentWithTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "indentWithTab", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], extensions: [{ type: i0.Input, args: [{ isSignal: true, alias: "extensions", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], focusOnReady: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusOnReady", required: false }] }], formatOnSave: [{ type: i0.Input, args: [{ isSignal: true, alias: "formatOnSave", required: false }] }], minRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "minRow", required: false }] }], customCompletions: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCompletions", required: false }] }], ready: [{ type: i0.Output, args: ["ready"] }], save: [{ type: i0.Output, args: ["save"] }], host: [{ type: i0.ViewChild, args: ['host', { isSignal: true }] }] } });
 
 class AXCodeEditorModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorModule, imports: [CommonModule, AXCodeEditorComponent], exports: [AXCodeEditorComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorModule, imports: [CommonModule, AXCodeEditorComponent], exports: [AXCodeEditorComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXCodeEditorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXCodeEditorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, AXCodeEditorComponent],

package/fesm2022/acorex-components-color-box.mjs

@@ -87,8 +87,8 @@ class AXColorBoxComponent extends classes(MXDropdownBoxBaseComponent, (MXInputBa
     get __hostName() {
         return this.name;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXColorBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXColorBoxComponent, isStandalone: true, selector: "ax-color-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: false, isRequired: false, transformFunction: null }, showBadge: { classPropertyName: "showBadge", publicName: "showBadge", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, showClearButton: { classPropertyName: "showClearButton", publicName: "showClearButton", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", readonlyChange: "readonlyChange", disabledChange: "disabledChange", onOpened: "onOpened", onClosed: "onClosed" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "keydown": "handleKeyboardEvent($event)" }, properties: { "attr.name": "this.__hostName" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXColorBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXColorBoxComponent, isStandalone: true, selector: "ax-color-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: false, isRequired: false, transformFunction: null }, showBadge: { classPropertyName: "showBadge", publicName: "showBadge", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, showClearButton: { classPropertyName: "showClearButton", publicName: "showClearButton", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", readonlyChange: "readonlyChange", disabledChange: "disabledChange", onOpened: "onOpened", onClosed: "onClosed" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "keydown": "handleKeyboardEvent($event)" }, properties: { "attr.name": "this.__hostName" } }, providers: [
             { provide: AXComponent, useExisting: AXColorBoxComponent },
             { provide: AXFocusableComponent, useExisting: AXColorBoxComponent },
             { provide: AXValuableComponent, useExisting: AXColorBoxComponent },
@@ -100,7 +100,7 @@ class AXColorBoxComponent extends classes(MXDropdownBoxBaseComponent, (MXInputBa
             },
         ], viewQueries: [{ propertyName: "palettePicker", first: true, predicate: AXColorPalettePickerComponent, descendants: true, isSignal: true }, { propertyName: "picker", first: true, predicate: AXColorPaletteComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: AXDropdownBoxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ax-dropdown-box\n  [look]=\"look\"\n  [disabled]=\"disabled\"\n  (onOpened)=\"_handleOnOpenedEvent($event)\"\n  (onClosed)=\"_handleOnClosedEvent($event)\"\n>\n  <ng-container input>\n    <ng-content select=\"ax-prefix\"> </ng-content>\n    <div class=\"ax-content\" (click)=\"_handleInputClickEvent($event)\" [tabindex]=\"tabIndex\">\n      @if (value && showBadge()) {\n        <div class=\"color-badge\" [ngStyle]=\"{ 'background-color': value }\"></div>\n      } @else {\n        <div class=\"color-placeholder\">{{ placeholder }}</div>\n      }\n      @if (showValue()) {\n        <div class=\"color-value\">{{ value }}</div>\n      }\n    </div>\n    @if (showClearButton()) {\n      @if (value && !disabled && !readonly) {\n        <ng-content select=\"ax-clear-button\"></ng-content>\n      }\n    }\n    @if (showIcon()) {\n      <button\n        [name]=\"name\"\n        type=\"button\"\n        class=\"ax-general-button-icon\"\n        [tabIndex]=\"-1\"\n        [disabled]=\"disabled\"\n        (click)=\"_handleArrowClickEvent($event)\"\n      >\n        <span class=\"ax-icon ax-icon-color-palette\"></span>\n      </button>\n    }\n    <ng-content select=\"ax-suffix\"> </ng-content>\n    <ng-content select=\"ax-validation-rule\"> </ng-content>\n  </ng-container>\n  <ng-container panel>\n    <ax-color-palette\n      [ngModel]=\"value\"\n      (ngModelChange)=\"_handleModelChange($event)\"\n      [disabled]=\"disabled\"\n      [name]=\"name\"\n      [readonly]=\"readonly\"\n    >\n      <ax-color-palette-picker></ax-color-palette-picker>\n      <ax-color-palette-swatches></ax-color-palette-swatches>\n      <ax-color-palette-input></ax-color-palette-input>\n    </ax-color-palette>\n  </ng-container>\n</ax-dropdown-box>\n", styles: ["@layer properties;@layer components{ax-color-box{display:flex;flex:1;flex-basis:calc(var(--spacing, .25rem) * 0)}ax-color-box .ax-editor-container{width:var(--ax-comp-color-box-width,100%);font-size:var(--ax-comp-color-box-font-size, var(--ax-comp-editor-font-size))}ax-color-box .ax-editor-container .ax-content{display:flex;height:100%;flex:1;flex-basis:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 2);outline-style:var(--tw-outline-style)!important;outline-width:0px!important}ax-color-box .ax-editor-container .ax-content .color-badge{display:block;width:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 4);border-radius:var(--radius-sm, .25rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-surface))}ax-color-box .ax-editor-container .ax-content .color-placeholder{--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:inherit}ax-color-box .ax-editor-container .ax-content .color-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase}ax-color-box .ax-editor-container .ax-clear-button{margin:calc(var(--spacing, .25rem) * 0)!important;display:flex;flex-direction:row}app-demo-box .log-container{display:flex;flex-direction:row-reverse;justify-content:space-between}}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style: solid;--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: ["disabled", "look", "hasInput", "popoverWidth"], outputs: ["disabledChange", "onBlur", "onFocus", "onClick", "onOpened", "onClosed"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: AXColorPaletteComponent, selector: "ax-color-palette", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }, { kind: "component", type: AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: AXColorPaletteInputComponent, selector: "ax-color-palette-input" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXColorBoxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXColorBoxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-color-box', inputs: ['disabled', 'readonly', 'tabIndex', 'placeholder', 'value', 'state', 'name', 'id', 'look'], outputs: [
                         'valueChange',
@@ -146,11 +146,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             }] } });
 
 class AXColorBoxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXColorBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXColorBoxModule, imports: [AXColorBoxComponent], exports: [AXColorBoxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXColorBoxModule, imports: [AXColorBoxComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXColorBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXColorBoxModule, imports: [AXColorBoxComponent], exports: [AXColorBoxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXColorBoxModule, imports: [AXColorBoxComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXColorBoxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXColorBoxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [AXColorBoxComponent],