@acorex/components 7.17.9 → 7.17.11

package/esm2022/chips/lib/chips.component.mjs

@@ -14,11 +14,11 @@ export class AXChipsComponent extends MXColorComponent {
         return `ax-el-${this.color}-${this.look} ax-el-interactive`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXChipsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXChipsComponent, selector: "ax-chips", inputs: { tabIndex: "tabIndex", color: "color", look: "look", text: "text" }, outputs: { colorChange: "colorChange" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, hostDirectives: [{ directive: i1.AXRippleDirective }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-chips-text\" *ngIf=\"text\">{{text}}</div>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-chips{position:relative;display:flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-chips:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#00000080}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:.5rem;padding-right:.5rem}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center;font-size:1.125rem;line-height:1.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXChipsComponent, selector: "ax-chips", inputs: { tabIndex: "tabIndex", color: "color", look: "look", text: "text" }, outputs: { colorChange: "colorChange" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, hostDirectives: [{ directive: i1.AXRippleDirective }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-chips-text\" *ngIf=\"text\">{{text}}</div>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-chips{position:relative;display:flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:center;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-chips:focus-visible{outline-width:2px;outline-offset:2px;outline-color:rgba(0,0,0,.5)}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:.5rem;padding-right:.5rem}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center;font-size:1.125rem;line-height:1.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXChipsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-chips', inputs: ['tabIndex', 'color'], outputs: ['colorChange'], hostDirectives: [AXRippleDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-chips-text\" *ngIf=\"text\">{{text}}</div>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-chips{position:relative;display:flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;justify-content:center;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-chips:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#00000080}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:.5rem;padding-right:.5rem}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center;font-size:1.125rem;line-height:1.75rem}\n"] }]
+            args: [{ selector: 'ax-chips', inputs: ['tabIndex', 'color'], outputs: ['colorChange'], hostDirectives: [AXRippleDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"ax-prefix\"></ng-content>\n<div class=\"ax-chips-text\" *ngIf=\"text\">{{text}}</div>\n<ng-content select=\"ax-suffix\"></ng-content>", styles: ["ax-chips{position:relative;display:flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:center;border-radius:9999px;padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-chips:focus-visible{outline-width:2px;outline-offset:2px;outline-color:rgba(0,0,0,.5)}ax-chips .ax-chips-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:.5rem;padding-right:.5rem}ax-chips ax-prefix,ax-chips ax-suffix{display:flex;align-items:center;font-size:1.125rem;line-height:1.75rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { look: [{
                 type: Input
             }], text: [{

package/esm2022/collapse/lib/collapse.component.mjs

@@ -88,7 +88,7 @@ export class AXCollapseComponent extends classes(MXInteractiveComponent, MXLookC
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXCollapseComponent, deps: [{ token: i1.MXLookableComponent, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXCollapseComponent, selector: "ax-collapse", inputs: { disabled: "disabled", look: "look", isCollapsed: "isCollapsed", caption: "caption", icon: "icon", isLoading: "isLoading", headerTemplate: "headerTemplate" }, outputs: { onClick: "onClick", isCollapsedChange: "isCollapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick($event)\">\n  <ng-container *ngIf=\"headerTemplate; else default\">\n    <div class=\"ax-collapse-custom-header-container\">\n      <ng-container\n        [ngTemplateOutlet]=\"headerTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"\n      ></ng-container>\n    </div>\n  </ng-container>\n  <ng-template #default>\n    <div class=\"ax-collapse-header-container\">\n      <div class=\"ax-collapse-header-start\">\n        <span class=\"ax-collapse-header-icon\" [class]=\"icon\"> </span>\n        <span>\n          {{ caption }}\n        </span>\n      </div>\n      <div class=\"ax-collapse-header-end\">\n        <ng-container *ngIf=\"isLoading; else elseTemplate\">\n          <ax-loading></ax-loading>\n        </ng-container>\n        <ng-template #elseTemplate>\n          <span\n            class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n            [ngClass]=\"{ '-rotation-90': isCollapsed, 'rotation-90': !isCollapsed }\"\n          ></span>\n        </ng-template>\n      </div>\n    </div>\n  </ng-template>\n</div>\n<div class=\"ax-collapse-body\" [@collapse]=\"isCollapsed\">\n  <div class=\"ax-collapse-body-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: ["ax-collapse,ax-collapse-group{display:block;width:100%;overflow:hidden;font-size:1rem;line-height:1.5rem}ax-collapse-group.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse-group.ax-look-solid ax-collapse{border-radius:0;border-bottom-width:1px;border-inline-end-width:0px;border-left-width:0px;border-top-width:0px}ax-collapse-group.ax-look-fill ax-collapse{margin-bottom:.5rem}ax-collapse-group.ax-look-outline ax-collapse{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px}ax-collapse-group.ax-look-flat ax-collapse{margin-bottom:.5rem;border-bottom-width:1px}ax-collapse.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-solid .ax-collapse-header{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-fill .ax-collapse-header{border-radius:var(--ax-rounded-border-default);--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-outline{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-outline .ax-collapse-header{background-color:transparent}ax-collapse.ax-look-flat{margin-bottom:.5rem;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-flat .ax-collapse-header{background-color:transparent}ax-collapse.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-collapse .ax-collapse-header{cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start{display:flex;align-items:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start:not(:empty) .ax-collapse-header-icon{padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end{display:flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow{font-size:1.5rem;line-height:2rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.-rotation-90{--tw-rotate: -90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.rotation-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-body{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse .ax-collapse-body .ax-collapse-body-content{padding:1rem 1.25rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXCollapseComponent, selector: "ax-collapse", inputs: { disabled: "disabled", look: "look", isCollapsed: "isCollapsed", caption: "caption", icon: "icon", isLoading: "isLoading", headerTemplate: "headerTemplate" }, outputs: { onClick: "onClick", isCollapsedChange: "isCollapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick($event)\">\n  <ng-container *ngIf=\"headerTemplate; else default\">\n    <div class=\"ax-collapse-custom-header-container\">\n      <ng-container\n        [ngTemplateOutlet]=\"headerTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"\n      ></ng-container>\n    </div>\n  </ng-container>\n  <ng-template #default>\n    <div class=\"ax-collapse-header-container\">\n      <div class=\"ax-collapse-header-start\">\n        <span class=\"ax-collapse-header-icon\" [class]=\"icon\"> </span>\n        <span>\n          {{ caption }}\n        </span>\n      </div>\n      <div class=\"ax-collapse-header-end\">\n        <ng-container *ngIf=\"isLoading; else elseTemplate\">\n          <ax-loading></ax-loading>\n        </ng-container>\n        <ng-template #elseTemplate>\n          <span\n            class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n            [ngClass]=\"{ '-rotation-90': isCollapsed, 'rotation-90': !isCollapsed }\"\n          ></span>\n        </ng-template>\n      </div>\n    </div>\n  </ng-template>\n</div>\n<div class=\"ax-collapse-body\" [@collapse]=\"isCollapsed\">\n  <div class=\"ax-collapse-body-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: ["ax-collapse,ax-collapse-group{display:block;width:100%;overflow:hidden;font-size:1rem;line-height:1.5rem}ax-collapse-group.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse-group.ax-look-solid ax-collapse{border-radius:0;border-bottom-width:1px;border-inline-end-width:0px;border-left-width:0px;border-top-width:0px}ax-collapse-group.ax-look-fill ax-collapse{margin-bottom:.5rem}ax-collapse-group.ax-look-outline ax-collapse{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px}ax-collapse-group.ax-look-flat ax-collapse{margin-bottom:.5rem;border-bottom-width:1px}ax-collapse.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-solid .ax-collapse-header{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-fill .ax-collapse-header{border-radius:var(--ax-rounded-border-default);--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-outline{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-outline .ax-collapse-header{background-color:transparent}ax-collapse.ax-look-flat{margin-bottom:.5rem;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-flat .ax-collapse-header{background-color:transparent}ax-collapse.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-collapse .ax-collapse-header{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start{display:flex;align-items:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start:not(:empty) .ax-collapse-header-icon{-webkit-padding-end:.5rem;padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end{display:flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow{font-size:1.5rem;line-height:2rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.-rotation-90{--tw-rotate: -90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.rotation-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-body{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse .ax-collapse-body .ax-collapse-body-content{padding:1rem 1.25rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], animations: [
             trigger('collapse', [
                 state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),
                 state('true', style({ height: '0', visibility: 'hidden' })),
@@ -106,7 +106,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
                             transition('false => true', animate(150 + 'ms ease-in')),
                             transition('true => false', animate(150 + 'ms ease-out')),
                         ]),
-                    ], template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick($event)\">\n  <ng-container *ngIf=\"headerTemplate; else default\">\n    <div class=\"ax-collapse-custom-header-container\">\n      <ng-container\n        [ngTemplateOutlet]=\"headerTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"\n      ></ng-container>\n    </div>\n  </ng-container>\n  <ng-template #default>\n    <div class=\"ax-collapse-header-container\">\n      <div class=\"ax-collapse-header-start\">\n        <span class=\"ax-collapse-header-icon\" [class]=\"icon\"> </span>\n        <span>\n          {{ caption }}\n        </span>\n      </div>\n      <div class=\"ax-collapse-header-end\">\n        <ng-container *ngIf=\"isLoading; else elseTemplate\">\n          <ax-loading></ax-loading>\n        </ng-container>\n        <ng-template #elseTemplate>\n          <span\n            class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n            [ngClass]=\"{ '-rotation-90': isCollapsed, 'rotation-90': !isCollapsed }\"\n          ></span>\n        </ng-template>\n      </div>\n    </div>\n  </ng-template>\n</div>\n<div class=\"ax-collapse-body\" [@collapse]=\"isCollapsed\">\n  <div class=\"ax-collapse-body-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: ["ax-collapse,ax-collapse-group{display:block;width:100%;overflow:hidden;font-size:1rem;line-height:1.5rem}ax-collapse-group.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse-group.ax-look-solid ax-collapse{border-radius:0;border-bottom-width:1px;border-inline-end-width:0px;border-left-width:0px;border-top-width:0px}ax-collapse-group.ax-look-fill ax-collapse{margin-bottom:.5rem}ax-collapse-group.ax-look-outline ax-collapse{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px}ax-collapse-group.ax-look-flat ax-collapse{margin-bottom:.5rem;border-bottom-width:1px}ax-collapse.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-solid .ax-collapse-header{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-fill .ax-collapse-header{border-radius:var(--ax-rounded-border-default);--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-outline{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-outline .ax-collapse-header{background-color:transparent}ax-collapse.ax-look-flat{margin-bottom:.5rem;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-flat .ax-collapse-header{background-color:transparent}ax-collapse.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-collapse .ax-collapse-header{cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start{display:flex;align-items:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start:not(:empty) .ax-collapse-header-icon{padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end{display:flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow{font-size:1.5rem;line-height:2rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.-rotation-90{--tw-rotate: -90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.rotation-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-body{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse .ax-collapse-body .ax-collapse-body-content{padding:1rem 1.25rem}\n"] }]
+                    ], template: "<div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick($event)\">\n  <ng-container *ngIf=\"headerTemplate; else default\">\n    <div class=\"ax-collapse-custom-header-container\">\n      <ng-container\n        [ngTemplateOutlet]=\"headerTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"\n      ></ng-container>\n    </div>\n  </ng-container>\n  <ng-template #default>\n    <div class=\"ax-collapse-header-container\">\n      <div class=\"ax-collapse-header-start\">\n        <span class=\"ax-collapse-header-icon\" [class]=\"icon\"> </span>\n        <span>\n          {{ caption }}\n        </span>\n      </div>\n      <div class=\"ax-collapse-header-end\">\n        <ng-container *ngIf=\"isLoading; else elseTemplate\">\n          <ax-loading></ax-loading>\n        </ng-container>\n        <ng-template #elseTemplate>\n          <span\n            class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n            [ngClass]=\"{ '-rotation-90': isCollapsed, 'rotation-90': !isCollapsed }\"\n          ></span>\n        </ng-template>\n      </div>\n    </div>\n  </ng-template>\n</div>\n<div class=\"ax-collapse-body\" [@collapse]=\"isCollapsed\">\n  <div class=\"ax-collapse-body-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: ["ax-collapse,ax-collapse-group{display:block;width:100%;overflow:hidden;font-size:1rem;line-height:1.5rem}ax-collapse-group.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse-group.ax-look-solid ax-collapse{border-radius:0;border-bottom-width:1px;border-inline-end-width:0px;border-left-width:0px;border-top-width:0px}ax-collapse-group.ax-look-fill ax-collapse{margin-bottom:.5rem}ax-collapse-group.ax-look-outline ax-collapse{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px}ax-collapse-group.ax-look-flat ax-collapse{margin-bottom:.5rem;border-bottom-width:1px}ax-collapse.ax-look-solid{border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-solid .ax-collapse-header{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-fill .ax-collapse-header{border-radius:var(--ax-rounded-border-default);--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-collapse.ax-look-outline{margin-bottom:.5rem;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-outline .ax-collapse-header{background-color:transparent}ax-collapse.ax-look-flat{margin-bottom:.5rem;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-collapse.ax-look-flat .ax-collapse-header{background-color:transparent}ax-collapse.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-collapse .ax-collapse-header{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start{display:flex;align-items:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start:not(:empty) .ax-collapse-header-icon{-webkit-padding-end:.5rem;padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end{display:flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow{font-size:1.5rem;line-height:2rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.-rotation-90{--tw-rotate: -90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.rotation-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}ax-collapse .ax-collapse-body{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-collapse .ax-collapse-body .ax-collapse-body-content{padding:1rem 1.25rem}\n"] }]
         }], ctorParameters: () => [{ type: i1.MXLookableComponent, decorators: [{
                     type: Optional
                 }, {
@@ -129,4 +129,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
                 type: HostBinding,
                 args: ['class']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sbGFwc2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2NvbGxhcHNlL3NyYy9saWIvY29sbGFwc2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2NvbGxhcHNlL3NyYy9saWIvY29sbGFwc2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFlBQVksRUFDWixzQkFBc0IsRUFDdEIsZUFBZSxFQUNmLG1CQUFtQixHQUNwQixNQUFNLDJCQUEyQixDQUFDO0FBQ25DLE9BQU8sRUFBRSxVQUFVLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQzdGLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixJQUFJLEVBQ0osV0FBVyxFQUNYLEtBQUssRUFDTCxRQUFRLEVBQ1IsTUFBTSxFQUNOLFdBQVcsRUFDWCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLFVBQVUsQ0FBQzs7Ozs7QUFFbkMsTUFBTSxPQUFPLG9CQUFxQixTQUFRLFlBQVk7SUFBdEQ7O1FBQ0UsWUFBTyxHQUFHLEtBQUssQ0FBQztJQUNsQixDQUFDO0NBQUE7QUFrQkQsTUFBTSxPQUFPLG1CQUFvQixTQUFRLE9BQU8sQ0FBQyxzQkFBc0IsRUFBRSxlQUFlLENBQUM7SUFDdkYsWUFHVSxNQUE0QjtRQUVwQyxLQUFLLEVBQUUsQ0FBQztRQUZBLFdBQU0sR0FBTixNQUFNLENBQXNCO1FBS3RDOzs7V0FHRztRQUVILFlBQU8sR0FBdUMsSUFBSSxZQUFZLEVBQXdCLENBQUM7UUFHdkYsc0JBQWlCLEdBQXNCLElBQUksWUFBWSxFQUFPLENBQUM7UUFFdkQsaUJBQVksR0FBRyxLQUFLLENBQUM7UUFtQjdCLFlBQU8sR0FBRyxFQUFFLENBQUM7UUFHYixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBRUYsZUFBVSxHQUFHLEtBQUssQ0FBQztJQXBDM0IsQ0FBQztJQWFEOztPQUVHO0lBQ0gsSUFDVyxXQUFXO1FBQ3BCLE9BQU8sSUFBSSxDQUFDLFlBQVksQ0FBQztJQUMzQixDQUFDO0lBQ0QsSUFBVyxXQUFXLENBQUMsQ0FBVTtRQUMvQixJQUFJLENBQUMsU0FBUyxDQUFDO1lBQ2IsSUFBSSxFQUFFLGFBQWE7WUFDbkIsS0FBSyxFQUFFLENBQUM7WUFDUixhQUFhLEVBQUUsR0FBRyxFQUFFO2dCQUNsQixJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQzNCLENBQUM7U0FDRixDQUFDLENBQUM7SUFDTCxDQUFDO0lBU0Q7O09BRUc7SUFDSCxJQUNXLFNBQVM7UUFDbEIsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDO0lBQ3pCLENBQUM7SUFDRCxJQUFXLFNBQVMsQ0FBQyxDQUFVO1FBQzdCLElBQUksQ0FBQyxTQUFTLENBQUM7WUFDYixJQUFJLEVBQUUsV0FBVztZQUNqQixLQUFLLEVBQUUsQ0FBQztZQUNSLGFBQWEsRUFBRSxHQUFHLEVBQUU7Z0JBQ2xCLElBQUksQ0FBQyxHQUFHLENBQUMsYUFBYSxFQUFFLENBQUM7WUFDM0IsQ0FBQztTQUNGLENBQUMsQ0FBQztJQUNMLENBQUM7SUFLRCxpQkFBaUIsQ0FBQyxDQUFhO1FBQzdCLElBQUksSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsU0FBUztZQUFFLE9BQU87UUFDNUMsTUFBTSxLQUFLLEdBQUc7WUFDWixTQUFTLEVBQUUsSUFBSTtZQUNmLFdBQVcsRUFBRSxJQUFJLENBQUMsY0FBYyxFQUFFO1lBQ2xDLFdBQVcsRUFBRSxDQUFDO1lBQ2QsT0FBTyxFQUFFLEtBQUs7U0FDZixDQUFDO1FBQ0YsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDekIsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUU7WUFDbEIsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDO1NBQ2Y7SUFDSCxDQUFDO0lBRUQsSUFBSTtRQUNGLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxDQUFDO0lBQzNCLENBQUM7SUFFRCxLQUFLO1FBQ0gsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7SUFDMUIsQ0FBQztJQUVELE1BQU07UUFDSixJQUFJLENBQUMsV0FBVyxHQUFHLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUN2QyxDQUFDO0lBRUQsb0JBQW9CO0lBQ3BCLElBQ0ksV0FBVztRQUNiLE9BQU87WUFDTCxHQUFHLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLG1CQUFtQixDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7WUFDN0MsV0FBVyxJQUFJLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUU7U0FDOUQsQ0FBQztJQUNKLENBQUM7OEdBakdVLG1CQUFtQjtrR0FBbkIsbUJBQW1CLGtYQ3pDaEMsNHpDQW9DQSw0dUlESmM7WUFDVixPQUFPLENBQUMsVUFBVSxFQUFFO2dCQUNsQixLQUFLLENBQUMsT0FBTyxFQUFFLEtBQUssQ0FBQyxFQUFFLE1BQU0sRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxDQUFDLENBQUM7Z0JBQ3JFLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLENBQUMsQ0FBQztnQkFDM0QsVUFBVSxDQUFDLGVBQWUsRUFBRSxPQUFPLENBQUMsR0FBRyxHQUFHLFlBQVksQ0FBQyxDQUFDO2dCQUN4RCxVQUFVLENBQUMsZUFBZSxFQUFFLE9BQU8sQ0FBQyxHQUFHLEdBQUcsYUFBYSxDQUFDLENBQUM7YUFDMUQsQ0FBQztTQUNIOzsyRkFFVSxtQkFBbUI7a0JBaEIvQixTQUFTOytCQUNFLGFBQWEsVUFFZixDQUFDLFVBQVUsRUFBRSxNQUFNLENBQUMsbUJBRVgsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSSxjQUN6Qjt3QkFDVixPQUFPLENBQUMsVUFBVSxFQUFFOzRCQUNsQixLQUFLLENBQUMsT0FBTyxFQUFFLEtBQUssQ0FBQyxFQUFFLE1BQU0sRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxDQUFDLENBQUM7NEJBQ3JFLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLENBQUMsQ0FBQzs0QkFDM0QsVUFBVSxDQUFDLGVBQWUsRUFBRSxPQUFPLENBQUMsR0FBRyxHQUFHLFlBQVksQ0FBQyxDQUFDOzRCQUN4RCxVQUFVLENBQUMsZUFBZSxFQUFFLE9BQU8sQ0FBQyxHQUFHLEdBQUcsYUFBYSxDQUFDLENBQUM7eUJBQzFELENBQUM7cUJBQ0g7OzBCQUlFLFFBQVE7OzBCQUNSLElBQUk7eUNBV1AsT0FBTztzQkFETixNQUFNO2dCQUlQLGlCQUFpQjtzQkFEaEIsTUFBTTtnQkFRSSxXQUFXO3NCQURyQixLQUFLO2dCQWVOLE9BQU87c0JBRE4sS0FBSztnQkFJTixJQUFJO3NCQURILEtBQUs7Z0JBUUssU0FBUztzQkFEbkIsS0FBSztnQkFlTixjQUFjO3NCQURiLEtBQUs7Z0JBK0JGLFdBQVc7c0JBRGQsV0FBVzt1QkFBQyxPQUFPIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQVhDbGlja0V2ZW50LFxuICBNWEludGVyYWN0aXZlQ29tcG9uZW50LFxuICBNWExvb2tDb21wb25lbnQsXG4gIE1YTG9va2FibGVDb21wb25lbnQsXG59IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9jb21tb24nO1xuaW1wb3J0IHsgQVVUT19TVFlMRSwgYW5pbWF0ZSwgc3RhdGUsIHN0eWxlLCB0cmFuc2l0aW9uLCB0cmlnZ2VyIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBFdmVudEVtaXR0ZXIsXG4gIEhvc3QsXG4gIEhvc3RCaW5kaW5nLFxuICBJbnB1dCxcbiAgT3B0aW9uYWwsXG4gIE91dHB1dCxcbiAgVGVtcGxhdGVSZWYsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IGNsYXNzZXMgfSBmcm9tICdwb2x5dHlwZSc7XG5cbmV4cG9ydCBjbGFzcyBBWENvbGxhcHNlQ2xpY2tFdmVudCBleHRlbmRzIEFYQ2xpY2tFdmVudCB7XG4gIGhhbmRsZWQgPSBmYWxzZTtcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXgtY29sbGFwc2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vY29sbGFwc2UuY29tcG9uZW50Lmh0bWwnLFxuICBpbnB1dHM6IFsnZGlzYWJsZWQnLCAnbG9vayddLFxuICBzdHlsZVVybHM6IFsnLi9jb2xsYXBzZS5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgYW5pbWF0aW9uczogW1xuICAgIHRyaWdnZXIoJ2NvbGxhcHNlJywgW1xuICAgICAgc3RhdGUoJ2ZhbHNlJywgc3R5bGUoeyBoZWlnaHQ6IEFVVE9fU1RZTEUsIHZpc2liaWxpdHk6IEFVVE9fU1RZTEUgfSkpLFxuICAgICAgc3RhdGUoJ3RydWUnLCBzdHlsZSh7IGhlaWdodDogJzAnLCB2aXNpYmlsaXR5OiAnaGlkZGVuJyB9KSksXG4gICAgICB0cmFuc2l0aW9uKCdmYWxzZSA9PiB0cnVlJywgYW5pbWF0ZSgxNTAgKyAnbXMgZWFzZS1pbicpKSxcbiAgICAgIHRyYW5zaXRpb24oJ3RydWUgPT4gZmFsc2UnLCBhbmltYXRlKDE1MCArICdtcyBlYXNlLW91dCcpKSxcbiAgICBdKSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgQVhDb2xsYXBzZUNvbXBvbmVudCBleHRlbmRzIGNsYXNzZXMoTVhJbnRlcmFjdGl2ZUNvbXBvbmVudCwgTVhMb29rQ29tcG9uZW50KSB7XG4gIGNvbnN0cnVjdG9yKFxuICAgIEBPcHRpb25hbCgpXG4gICAgQEhvc3QoKVxuICAgIHByaXZhdGUgcGFyZW50PzogTVhMb29rYWJsZUNvbXBvbmVudCxcbiAgKSB7XG4gICAgc3VwZXIoKTtcbiAgfVxuXG4gIC8qKlxuICAgKiAgRmlyZXMgZWFjaCB0aW1lIHRoZSB1c2VyIGNsaWNrcyB0aGUgcGFuZWwgaGVhZGVyLlxuICAgKiAgQGV2ZW50XG4gICAqL1xuICBAT3V0cHV0KClcbiAgb25DbGljazogRXZlbnRFbWl0dGVyPEFYQ29sbGFwc2VDbGlja0V2ZW50PiA9IG5ldyBFdmVudEVtaXR0ZXI8QVhDb2xsYXBzZUNsaWNrRXZlbnQ+KCk7XG5cbiAgQE91dHB1dCgpXG4gIGlzQ29sbGFwc2VkQ2hhbmdlOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuXG4gIHByaXZhdGUgX2lzQ29sbGFwc2VkID0gZmFsc2U7XG4gIC8qKlxuICAgKiAgUHJvdmlkaW5nIGEgYm9vbGVhbiB2YWx1ZSBmb3IgaXRzIGNvbGxhcHNlIHN0YXRlXG4gICAqL1xuICBASW5wdXQoKVxuICBwdWJsaWMgZ2V0IGlzQ29sbGFwc2VkKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLl9pc0NvbGxhcHNlZDtcbiAgfVxuICBwdWJsaWMgc2V0IGlzQ29sbGFwc2VkKHY6IGJvb2xlYW4pIHtcbiAgICB0aGlzLnNldE9wdGlvbih7XG4gICAgICBuYW1lOiAnaXNDb2xsYXBzZWQnLFxuICAgICAgdmFsdWU6IHYsXG4gICAgICBhZnRlckNhbGxiYWNrOiAoKSA9PiB7XG4gICAgICAgIHRoaXMuY2RyLmRldGVjdENoYW5nZXMoKTtcbiAgICAgIH0sXG4gICAgfSk7XG4gIH1cblxuICBASW5wdXQoKVxuICBjYXB0aW9uID0gJyc7XG5cbiAgQElucHV0KClcbiAgaWNvbiA9ICcnO1xuXG4gIHByaXZhdGUgX2lzTG9hZGluZyA9IGZhbHNlO1xuICAvKipcbiAgICogIFByb3ZpZGluZyBhIGJvb2xlYW4gdmFsdWUgZm9yIGl0cyBjb2xsYXBzZSBzdGF0ZVxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIGdldCBpc0xvYWRpbmcoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuX2lzTG9hZGluZztcbiAgfVxuICBwdWJsaWMgc2V0IGlzTG9hZGluZyh2OiBib29sZWFuKSB7XG4gICAgdGhpcy5zZXRPcHRpb24oe1xuICAgICAgbmFtZTogJ2lzTG9hZGluZycsXG4gICAgICB2YWx1ZTogdixcbiAgICAgIGFmdGVyQ2FsbGJhY2s6ICgpID0+IHtcbiAgICAgICAgdGhpcy5jZHIuZGV0ZWN0Q2hhbmdlcygpO1xuICAgICAgfSxcbiAgICB9KTtcbiAgfVxuXG4gIEBJbnB1dCgpXG4gIGhlYWRlclRlbXBsYXRlOiBUZW1wbGF0ZVJlZjxhbnk+O1xuXG4gIGhhbmRsZUhlYWRlckNsaWNrKGU6IE1vdXNlRXZlbnQpIHtcbiAgICBpZiAodGhpcy5kaXNhYmxlZCB8fCB0aGlzLmlzTG9hZGluZykgcmV0dXJuO1xuICAgIGNvbnN0IGV2ZW50ID0ge1xuICAgICAgY29tcG9uZW50OiB0aGlzLFxuICAgICAgaHRtbEVsZW1lbnQ6IHRoaXMuZ2V0SG9zdEVsZW1lbnQoKSxcbiAgICAgIG5hdGl2ZUV2ZW50OiBlLFxuICAgICAgaGFuZGxlZDogZmFsc2UsXG4gICAgfTtcbiAgICB0aGlzLm9uQ2xpY2suZW1pdChldmVudCk7XG4gICAgaWYgKCFldmVudC5oYW5kbGVkKSB7XG4gICAgICB0aGlzLnRvZ2dsZSgpO1xuICAgIH1cbiAgfVxuXG4gIG9wZW4oKSB7XG4gICAgdGhpcy5pc0NvbGxhcHNlZCA9IGZhbHNlO1xuICB9XG5cbiAgY2xvc2UoKSB7XG4gICAgdGhpcy5pc0NvbGxhcHNlZCA9IHRydWU7XG4gIH1cblxuICB0b2dnbGUoKSB7XG4gICAgdGhpcy5pc0NvbGxhcHNlZCA9ICF0aGlzLmlzQ29sbGFwc2VkO1xuICB9XG5cbiAgLy8gVE9ETzogQ2hlY2sgY2xhc3NcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcycpXG4gIGdldCBfX2hvc3RDbGFzcygpOiBzdHJpbmdbXSB7XG4gICAgcmV0dXJuIFtcbiAgICAgIGAke3RoaXMuZGlzYWJsZWQgPyAnYXgtc3RhdGUtZGlzYWJsZWQnIDogJyd9YCxcbiAgICAgIGBheC1sb29rLSR7dGhpcy5wYXJlbnQ/Lmxvb2sgPyB0aGlzLnBhcmVudC5sb29rIDogdGhpcy5sb29rfWAsXG4gICAgXTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImF4LWNvbGxhcHNlLWhlYWRlclwiIFtjbGFzcy5heC1zdGF0ZS1jb2xsYXBzZWRdPVwiaXNDb2xsYXBzZWRcIiAoY2xpY2spPVwiaGFuZGxlSGVhZGVyQ2xpY2soJGV2ZW50KVwiPlxuICA8bmctY29udGFpbmVyICpuZ0lmPVwiaGVhZGVyVGVtcGxhdGU7IGVsc2UgZGVmYXVsdFwiPlxuICAgIDxkaXYgY2xhc3M9XCJheC1jb2xsYXBzZS1jdXN0b20taGVhZGVyLWNvbnRhaW5lclwiPlxuICAgICAgPG5nLWNvbnRhaW5lclxuICAgICAgICBbbmdUZW1wbGF0ZU91dGxldF09XCJoZWFkZXJUZW1wbGF0ZVwiXG4gICAgICAgIFtuZ1RlbXBsYXRlT3V0bGV0Q29udGV4dF09XCJ7ICRpbXBsaWNpdDogeyBjYXB0aW9uLCBpc0NvbGxhcHNlZCB9IH1cIlxuICAgICAgPjwvbmctY29udGFpbmVyPlxuICAgIDwvZGl2PlxuICA8L25nLWNvbnRhaW5lcj5cbiAgPG5nLXRlbXBsYXRlICNkZWZhdWx0PlxuICAgIDxkaXYgY2xhc3M9XCJheC1jb2xsYXBzZS1oZWFkZXItY29udGFpbmVyXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtY29sbGFwc2UtaGVhZGVyLXN0YXJ0XCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwiYXgtY29sbGFwc2UtaGVhZGVyLWljb25cIiBbY2xhc3NdPVwiaWNvblwiPiA8L3NwYW4+XG4gICAgICAgIDxzcGFuPlxuICAgICAgICAgIHt7IGNhcHRpb24gfX1cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtY29sbGFwc2UtaGVhZGVyLWVuZFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiaXNMb2FkaW5nOyBlbHNlIGVsc2VUZW1wbGF0ZVwiPlxuICAgICAgICAgIDxheC1sb2FkaW5nPjwvYXgtbG9hZGluZz5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy10ZW1wbGF0ZSAjZWxzZVRlbXBsYXRlPlxuICAgICAgICAgIDxzcGFuXG4gICAgICAgICAgICBjbGFzcz1cImF4LWljb24gYXgtaWNvbi1jaGV2cm9uLWxlZnQgYXgtY29sbGFwc2UtYXJyb3dcIlxuICAgICAgICAgICAgW25nQ2xhc3NdPVwieyAnLXJvdGF0aW9uLTkwJzogaXNDb2xsYXBzZWQsICdyb3RhdGlvbi05MCc6ICFpc0NvbGxhcHNlZCB9XCJcbiAgICAgICAgICA+PC9zcGFuPlxuICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvbmctdGVtcGxhdGU+XG48L2Rpdj5cbjxkaXYgY2xhc3M9XCJheC1jb2xsYXBzZS1ib2R5XCIgW0Bjb2xsYXBzZV09XCJpc0NvbGxhcHNlZFwiPlxuICA8ZGl2IGNsYXNzPVwiYXgtY29sbGFwc2UtYm9keS1jb250ZW50XCI+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sbGFwc2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2NvbGxhcHNlL3NyYy9saWIvY29sbGFwc2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2NvbGxhcHNlL3NyYy9saWIvY29sbGFwc2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFlBQVksRUFDWixzQkFBc0IsRUFDdEIsZUFBZSxFQUNmLG1CQUFtQixHQUNwQixNQUFNLDJCQUEyQixDQUFDO0FBQ25DLE9BQU8sRUFBRSxVQUFVLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQzdGLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixJQUFJLEVBQ0osV0FBVyxFQUNYLEtBQUssRUFDTCxRQUFRLEVBQ1IsTUFBTSxFQUNOLFdBQVcsRUFDWCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLFVBQVUsQ0FBQzs7Ozs7QUFFbkMsTUFBTSxPQUFPLG9CQUFxQixTQUFRLFlBQVk7SUFBdEQ7O1FBQ0UsWUFBTyxHQUFHLEtBQUssQ0FBQztJQUNsQixDQUFDO0NBQUE7QUFrQkQsTUFBTSxPQUFPLG1CQUFvQixTQUFRLE9BQU8sQ0FBQyxzQkFBc0IsRUFBRSxlQUFlLENBQUM7SUFDdkYsWUFHVSxNQUE0QjtRQUVwQyxLQUFLLEVBQUUsQ0FBQztRQUZBLFdBQU0sR0FBTixNQUFNLENBQXNCO1FBS3RDOzs7V0FHRztRQUVILFlBQU8sR0FBdUMsSUFBSSxZQUFZLEVBQXdCLENBQUM7UUFHdkYsc0JBQWlCLEdBQXNCLElBQUksWUFBWSxFQUFPLENBQUM7UUFFdkQsaUJBQVksR0FBRyxLQUFLLENBQUM7UUFtQjdCLFlBQU8sR0FBRyxFQUFFLENBQUM7UUFHYixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBRUYsZUFBVSxHQUFHLEtBQUssQ0FBQztJQXBDM0IsQ0FBQztJQWFEOztPQUVHO0lBQ0gsSUFDVyxXQUFXO1FBQ3BCLE9BQU8sSUFBSSxDQUFDLFlBQVksQ0FBQztJQUMzQixDQUFDO0lBQ0QsSUFBVyxXQUFXLENBQUMsQ0FBVTtRQUMvQixJQUFJLENBQUMsU0FBUyxDQUFDO1lBQ2IsSUFBSSxFQUFFLGFBQWE7WUFDbkIsS0FBSyxFQUFFLENBQUM7WUFDUixhQUFhLEVBQUUsR0FBRyxFQUFFO2dCQUNsQixJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQzNCLENBQUM7U0FDRixDQUFDLENBQUM7SUFDTCxDQUFDO0lBU0Q7O09BRUc7SUFDSCxJQUNXLFNBQVM7UUFDbEIsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDO0lBQ3pCLENBQUM7SUFDRCxJQUFXLFNBQVMsQ0FBQyxDQUFVO1FBQzdCLElBQUksQ0FBQyxTQUFTLENBQUM7WUFDYixJQUFJLEVBQUUsV0FBVztZQUNqQixLQUFLLEVBQUUsQ0FBQztZQUNSLGFBQWEsRUFBRSxHQUFHLEVBQUU7Z0JBQ2xCLElBQUksQ0FBQyxHQUFHLENBQUMsYUFBYSxFQUFFLENBQUM7WUFDM0IsQ0FBQztTQUNGLENBQUMsQ0FBQztJQUNMLENBQUM7SUFLRCxpQkFBaUIsQ0FBQyxDQUFhO1FBQzdCLElBQUksSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsU0FBUztZQUFFLE9BQU87UUFDNUMsTUFBTSxLQUFLLEdBQUc7WUFDWixTQUFTLEVBQUUsSUFBSTtZQUNmLFdBQVcsRUFBRSxJQUFJLENBQUMsY0FBYyxFQUFFO1lBQ2xDLFdBQVcsRUFBRSxDQUFDO1lBQ2QsT0FBTyxFQUFFLEtBQUs7U0FDZixDQUFDO1FBQ0YsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDekIsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUU7WUFDbEIsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDO1NBQ2Y7SUFDSCxDQUFDO0lBRUQsSUFBSTtRQUNGLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxDQUFDO0lBQzNCLENBQUM7SUFFRCxLQUFLO1FBQ0gsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7SUFDMUIsQ0FBQztJQUVELE1BQU07UUFDSixJQUFJLENBQUMsV0FBVyxHQUFHLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUN2QyxDQUFDO0lBRUQsb0JBQW9CO0lBQ3BCLElBQ0ksV0FBVztRQUNiLE9BQU87WUFDTCxHQUFHLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLG1CQUFtQixDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7WUFDN0MsV0FBVyxJQUFJLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUU7U0FDOUQsQ0FBQztJQUNKLENBQUM7OEdBakdVLG1CQUFtQjtrR0FBbkIsbUJBQW1CLGtYQ3pDaEMsNHpDQW9DQSw0eElESmM7WUFDVixPQUFPLENBQUMsVUFBVSxFQUFFO2dCQUNsQixLQUFLLENBQUMsT0FBTyxFQUFFLEtBQUssQ0FBQyxFQUFFLE1BQU0sRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxDQUFDLENBQUM7Z0JBQ3JFLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLENBQUMsQ0FBQztnQkFDM0QsVUFBVSxDQUFDLGVBQWUsRUFBRSxPQUFPLENBQUMsR0FBRyxHQUFHLFlBQVksQ0FBQyxDQUFDO2dCQUN4RCxVQUFVLENBQUMsZUFBZSxFQUFFLE9BQU8sQ0FBQyxHQUFHLEdBQUcsYUFBYSxDQUFDLENBQUM7YUFDMUQsQ0FBQztTQUNIOzsyRkFFVSxtQkFBbUI7a0JBaEIvQixTQUFTOytCQUNFLGFBQWEsVUFFZixDQUFDLFVBQVUsRUFBRSxNQUFNLENBQUMsbUJBRVgsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSSxjQUN6Qjt3QkFDVixPQUFPLENBQUMsVUFBVSxFQUFFOzRCQUNsQixLQUFLLENBQUMsT0FBTyxFQUFFLEtBQUssQ0FBQyxFQUFFLE1BQU0sRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxDQUFDLENBQUM7NEJBQ3JFLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxDQUFDLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLENBQUMsQ0FBQzs0QkFDM0QsVUFBVSxDQUFDLGVBQWUsRUFBRSxPQUFPLENBQUMsR0FBRyxHQUFHLFlBQVksQ0FBQyxDQUFDOzRCQUN4RCxVQUFVLENBQUMsZUFBZSxFQUFFLE9BQU8sQ0FBQyxHQUFHLEdBQUcsYUFBYSxDQUFDLENBQUM7eUJBQzFELENBQUM7cUJBQ0g7OzBCQUlFLFFBQVE7OzBCQUNSLElBQUk7eUNBV1AsT0FBTztzQkFETixNQUFNO2dCQUlQLGlCQUFpQjtzQkFEaEIsTUFBTTtnQkFRSSxXQUFXO3NCQURyQixLQUFLO2dCQWVOLE9BQU87c0JBRE4sS0FBSztnQkFJTixJQUFJO3NCQURILEtBQUs7Z0JBUUssU0FBUztzQkFEbkIsS0FBSztnQkFlTixjQUFjO3NCQURiLEtBQUs7Z0JBK0JGLFdBQVc7c0JBRGQsV0FBVzt1QkFBQyxPQUFPIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQVhDbGlja0V2ZW50LFxuICBNWEludGVyYWN0aXZlQ29tcG9uZW50LFxuICBNWExvb2tDb21wb25lbnQsXG4gIE1YTG9va2FibGVDb21wb25lbnQsXG59IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9jb21tb24nO1xuaW1wb3J0IHsgQVVUT19TVFlMRSwgYW5pbWF0ZSwgc3RhdGUsIHN0eWxlLCB0cmFuc2l0aW9uLCB0cmlnZ2VyIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBFdmVudEVtaXR0ZXIsXG4gIEhvc3QsXG4gIEhvc3RCaW5kaW5nLFxuICBJbnB1dCxcbiAgT3B0aW9uYWwsXG4gIE91dHB1dCxcbiAgVGVtcGxhdGVSZWYsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IGNsYXNzZXMgfSBmcm9tICdwb2x5dHlwZSc7XG5cbmV4cG9ydCBjbGFzcyBBWENvbGxhcHNlQ2xpY2tFdmVudCBleHRlbmRzIEFYQ2xpY2tFdmVudCB7XG4gIGhhbmRsZWQgPSBmYWxzZTtcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXgtY29sbGFwc2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vY29sbGFwc2UuY29tcG9uZW50Lmh0bWwnLFxuICBpbnB1dHM6IFsnZGlzYWJsZWQnLCAnbG9vayddLFxuICBzdHlsZVVybHM6IFsnLi9jb2xsYXBzZS5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgYW5pbWF0aW9uczogW1xuICAgIHRyaWdnZXIoJ2NvbGxhcHNlJywgW1xuICAgICAgc3RhdGUoJ2ZhbHNlJywgc3R5bGUoeyBoZWlnaHQ6IEFVVE9fU1RZTEUsIHZpc2liaWxpdHk6IEFVVE9fU1RZTEUgfSkpLFxuICAgICAgc3RhdGUoJ3RydWUnLCBzdHlsZSh7IGhlaWdodDogJzAnLCB2aXNpYmlsaXR5OiAnaGlkZGVuJyB9KSksXG4gICAgICB0cmFuc2l0aW9uKCdmYWxzZSA9PiB0cnVlJywgYW5pbWF0ZSgxNTAgKyAnbXMgZWFzZS1pbicpKSxcbiAgICAgIHRyYW5zaXRpb24oJ3RydWUgPT4gZmFsc2UnLCBhbmltYXRlKDE1MCArICdtcyBlYXNlLW91dCcpKSxcbiAgICBdKSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgQVhDb2xsYXBzZUNvbXBvbmVudCBleHRlbmRzIGNsYXNzZXMoTVhJbnRlcmFjdGl2ZUNvbXBvbmVudCwgTVhMb29rQ29tcG9uZW50KSB7XG4gIGNvbnN0cnVjdG9yKFxuICAgIEBPcHRpb25hbCgpXG4gICAgQEhvc3QoKVxuICAgIHByaXZhdGUgcGFyZW50PzogTVhMb29rYWJsZUNvbXBvbmVudCxcbiAgKSB7XG4gICAgc3VwZXIoKTtcbiAgfVxuXG4gIC8qKlxuICAgKiAgRmlyZXMgZWFjaCB0aW1lIHRoZSB1c2VyIGNsaWNrcyB0aGUgcGFuZWwgaGVhZGVyLlxuICAgKiAgQGV2ZW50XG4gICAqL1xuICBAT3V0cHV0KClcbiAgb25DbGljazogRXZlbnRFbWl0dGVyPEFYQ29sbGFwc2VDbGlja0V2ZW50PiA9IG5ldyBFdmVudEVtaXR0ZXI8QVhDb2xsYXBzZUNsaWNrRXZlbnQ+KCk7XG5cbiAgQE91dHB1dCgpXG4gIGlzQ29sbGFwc2VkQ2hhbmdlOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuXG4gIHByaXZhdGUgX2lzQ29sbGFwc2VkID0gZmFsc2U7XG4gIC8qKlxuICAgKiAgUHJvdmlkaW5nIGEgYm9vbGVhbiB2YWx1ZSBmb3IgaXRzIGNvbGxhcHNlIHN0YXRlXG4gICAqL1xuICBASW5wdXQoKVxuICBwdWJsaWMgZ2V0IGlzQ29sbGFwc2VkKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLl9pc0NvbGxhcHNlZDtcbiAgfVxuICBwdWJsaWMgc2V0IGlzQ29sbGFwc2VkKHY6IGJvb2xlYW4pIHtcbiAgICB0aGlzLnNldE9wdGlvbih7XG4gICAgICBuYW1lOiAnaXNDb2xsYXBzZWQnLFxuICAgICAgdmFsdWU6IHYsXG4gICAgICBhZnRlckNhbGxiYWNrOiAoKSA9PiB7XG4gICAgICAgIHRoaXMuY2RyLmRldGVjdENoYW5nZXMoKTtcbiAgICAgIH0sXG4gICAgfSk7XG4gIH1cblxuICBASW5wdXQoKVxuICBjYXB0aW9uID0gJyc7XG5cbiAgQElucHV0KClcbiAgaWNvbiA9ICcnO1xuXG4gIHByaXZhdGUgX2lzTG9hZGluZyA9IGZhbHNlO1xuICAvKipcbiAgICogIFByb3ZpZGluZyBhIGJvb2xlYW4gdmFsdWUgZm9yIGl0cyBjb2xsYXBzZSBzdGF0ZVxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIGdldCBpc0xvYWRpbmcoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuX2lzTG9hZGluZztcbiAgfVxuICBwdWJsaWMgc2V0IGlzTG9hZGluZyh2OiBib29sZWFuKSB7XG4gICAgdGhpcy5zZXRPcHRpb24oe1xuICAgICAgbmFtZTogJ2lzTG9hZGluZycsXG4gICAgICB2YWx1ZTogdixcbiAgICAgIGFmdGVyQ2FsbGJhY2s6ICgpID0+IHtcbiAgICAgICAgdGhpcy5jZHIuZGV0ZWN0Q2hhbmdlcygpO1xuICAgICAgfSxcbiAgICB9KTtcbiAgfVxuXG4gIEBJbnB1dCgpXG4gIGhlYWRlclRlbXBsYXRlOiBUZW1wbGF0ZVJlZjxhbnk+O1xuXG4gIGhhbmRsZUhlYWRlckNsaWNrKGU6IE1vdXNlRXZlbnQpIHtcbiAgICBpZiAodGhpcy5kaXNhYmxlZCB8fCB0aGlzLmlzTG9hZGluZykgcmV0dXJuO1xuICAgIGNvbnN0IGV2ZW50ID0ge1xuICAgICAgY29tcG9uZW50OiB0aGlzLFxuICAgICAgaHRtbEVsZW1lbnQ6IHRoaXMuZ2V0SG9zdEVsZW1lbnQoKSxcbiAgICAgIG5hdGl2ZUV2ZW50OiBlLFxuICAgICAgaGFuZGxlZDogZmFsc2UsXG4gICAgfTtcbiAgICB0aGlzLm9uQ2xpY2suZW1pdChldmVudCk7XG4gICAgaWYgKCFldmVudC5oYW5kbGVkKSB7XG4gICAgICB0aGlzLnRvZ2dsZSgpO1xuICAgIH1cbiAgfVxuXG4gIG9wZW4oKSB7XG4gICAgdGhpcy5pc0NvbGxhcHNlZCA9IGZhbHNlO1xuICB9XG5cbiAgY2xvc2UoKSB7XG4gICAgdGhpcy5pc0NvbGxhcHNlZCA9IHRydWU7XG4gIH1cblxuICB0b2dnbGUoKSB7XG4gICAgdGhpcy5pc0NvbGxhcHNlZCA9ICF0aGlzLmlzQ29sbGFwc2VkO1xuICB9XG5cbiAgLy8gVE9ETzogQ2hlY2sgY2xhc3NcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcycpXG4gIGdldCBfX2hvc3RDbGFzcygpOiBzdHJpbmdbXSB7XG4gICAgcmV0dXJuIFtcbiAgICAgIGAke3RoaXMuZGlzYWJsZWQgPyAnYXgtc3RhdGUtZGlzYWJsZWQnIDogJyd9YCxcbiAgICAgIGBheC1sb29rLSR7dGhpcy5wYXJlbnQ/Lmxvb2sgPyB0aGlzLnBhcmVudC5sb29rIDogdGhpcy5sb29rfWAsXG4gICAgXTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImF4LWNvbGxhcHNlLWhlYWRlclwiIFtjbGFzcy5heC1zdGF0ZS1jb2xsYXBzZWRdPVwiaXNDb2xsYXBzZWRcIiAoY2xpY2spPVwiaGFuZGxlSGVhZGVyQ2xpY2soJGV2ZW50KVwiPlxuICA8bmctY29udGFpbmVyICpuZ0lmPVwiaGVhZGVyVGVtcGxhdGU7IGVsc2UgZGVmYXVsdFwiPlxuICAgIDxkaXYgY2xhc3M9XCJheC1jb2xsYXBzZS1jdXN0b20taGVhZGVyLWNvbnRhaW5lclwiPlxuICAgICAgPG5nLWNvbnRhaW5lclxuICAgICAgICBbbmdUZW1wbGF0ZU91dGxldF09XCJoZWFkZXJUZW1wbGF0ZVwiXG4gICAgICAgIFtuZ1RlbXBsYXRlT3V0bGV0Q29udGV4dF09XCJ7ICRpbXBsaWNpdDogeyBjYXB0aW9uLCBpc0NvbGxhcHNlZCB9IH1cIlxuICAgICAgPjwvbmctY29udGFpbmVyPlxuICAgIDwvZGl2PlxuICA8L25nLWNvbnRhaW5lcj5cbiAgPG5nLXRlbXBsYXRlICNkZWZhdWx0PlxuICAgIDxkaXYgY2xhc3M9XCJheC1jb2xsYXBzZS1oZWFkZXItY29udGFpbmVyXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtY29sbGFwc2UtaGVhZGVyLXN0YXJ0XCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwiYXgtY29sbGFwc2UtaGVhZGVyLWljb25cIiBbY2xhc3NdPVwiaWNvblwiPiA8L3NwYW4+XG4gICAgICAgIDxzcGFuPlxuICAgICAgICAgIHt7IGNhcHRpb24gfX1cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtY29sbGFwc2UtaGVhZGVyLWVuZFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiaXNMb2FkaW5nOyBlbHNlIGVsc2VUZW1wbGF0ZVwiPlxuICAgICAgICAgIDxheC1sb2FkaW5nPjwvYXgtbG9hZGluZz5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy10ZW1wbGF0ZSAjZWxzZVRlbXBsYXRlPlxuICAgICAgICAgIDxzcGFuXG4gICAgICAgICAgICBjbGFzcz1cImF4LWljb24gYXgtaWNvbi1jaGV2cm9uLWxlZnQgYXgtY29sbGFwc2UtYXJyb3dcIlxuICAgICAgICAgICAgW25nQ2xhc3NdPVwieyAnLXJvdGF0aW9uLTkwJzogaXNDb2xsYXBzZWQsICdyb3RhdGlvbi05MCc6ICFpc0NvbGxhcHNlZCB9XCJcbiAgICAgICAgICA+PC9zcGFuPlxuICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvbmctdGVtcGxhdGU+XG48L2Rpdj5cbjxkaXYgY2xhc3M9XCJheC1jb2xsYXBzZS1ib2R5XCIgW0Bjb2xsYXBzZV09XCJpc0NvbGxhcHNlZFwiPlxuICA8ZGl2IGNsYXNzPVwiYXgtY29sbGFwc2UtYm9keS1jb250ZW50XCI+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19

package/esm2022/color-box/lib/color-box.component.mjs

@@ -46,7 +46,7 @@ export class AXColorBoxComponent extends classes(MXDropdownBoxBaseComponent, (MX
                 useExisting: forwardRef(() => AXColorBoxComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "picker", first: true, predicate: AXColorPalleteComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: AXDropdownBoxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ax-dropdown-box\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)\">\n      <div *ngIf=\"value\" class=\"color-badge\" [ngStyle]=\"{ 'background-color': value }\"></div>\n      <div class=\"color-value\">{{ value }}</div>\n    </div>\n    <ng-content select=\"ax-clear-button\" *ngIf=\"value && !disabled && !readonly\"></ng-content>\n    <button\n      type=\"button\"\n      class=\"ax-general-button ax-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    <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      [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: ["ax-color-box{display:flex;flex:1 1 0%}ax-color-box .ax-content{margin-left:.5rem;margin-right:.5rem;display:flex;height:100%;flex:1 1 0%;align-items:center}ax-color-box .ax-content .color-badge{margin-inline-end:.5rem;display:block;height:1rem;width:1rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-box .ax-content .color-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.AXColorPalleteComponent, selector: "ax-color-palette", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "checked"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: i3.AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: i3.AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: i3.AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }, { kind: "component", type: i4.AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: ["disabled", "look"], outputs: ["disabledChange", "onBlur", "onFocus", "onClick", "onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "picker", first: true, predicate: AXColorPalleteComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: AXDropdownBoxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ax-dropdown-box\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)\">\n      <div *ngIf=\"value\" class=\"color-badge\" [ngStyle]=\"{ 'background-color': value }\"></div>\n      <div class=\"color-value\">{{ value }}</div>\n    </div>\n    <ng-content select=\"ax-clear-button\" *ngIf=\"value && !disabled && !readonly\"></ng-content>\n    <button\n      type=\"button\"\n      class=\"ax-general-button ax-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    <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      [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: ["ax-color-box{display:flex;flex:1 1 0%}ax-color-box .ax-content{margin-left:.5rem;margin-right:.5rem;display:flex;height:100%;flex:1 1 0%;align-items:center}ax-color-box .ax-content .color-badge{-webkit-margin-end:.5rem;margin-inline-end:.5rem;display:block;height:1rem;width:1rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-box .ax-content .color-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.AXColorPalleteComponent, selector: "ax-color-palette", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "checked"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: i3.AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: i3.AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: i3.AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }, { kind: "component", type: i4.AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: ["disabled", "look"], outputs: ["disabledChange", "onBlur", "onFocus", "onClick", "onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXColorBoxComponent, decorators: [{
             type: Component,
@@ -80,7 +80,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
                             useExisting: forwardRef(() => AXColorBoxComponent),
                             multi: true,
                         },
-                    ], template: "<ax-dropdown-box\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)\">\n      <div *ngIf=\"value\" class=\"color-badge\" [ngStyle]=\"{ 'background-color': value }\"></div>\n      <div class=\"color-value\">{{ value }}</div>\n    </div>\n    <ng-content select=\"ax-clear-button\" *ngIf=\"value && !disabled && !readonly\"></ng-content>\n    <button\n      type=\"button\"\n      class=\"ax-general-button ax-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    <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      [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: ["ax-color-box{display:flex;flex:1 1 0%}ax-color-box .ax-content{margin-left:.5rem;margin-right:.5rem;display:flex;height:100%;flex:1 1 0%;align-items:center}ax-color-box .ax-content .color-badge{margin-inline-end:.5rem;display:block;height:1rem;width:1rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-box .ax-content .color-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase}\n"] }]
+                    ], template: "<ax-dropdown-box\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)\">\n      <div *ngIf=\"value\" class=\"color-badge\" [ngStyle]=\"{ 'background-color': value }\"></div>\n      <div class=\"color-value\">{{ value }}</div>\n    </div>\n    <ng-content select=\"ax-clear-button\" *ngIf=\"value && !disabled && !readonly\"></ng-content>\n    <button\n      type=\"button\"\n      class=\"ax-general-button ax-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    <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      [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: ["ax-color-box{display:flex;flex:1 1 0%}ax-color-box .ax-content{margin-left:.5rem;margin-right:.5rem;display:flex;height:100%;flex:1 1 0%;align-items:center}ax-color-box .ax-content .color-badge{-webkit-margin-end:.5rem;margin-inline-end:.5rem;display:block;height:1rem;width:1rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-box .ax-content .color-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase}\n"] }]
         }], propDecorators: { picker: [{
                 type: ViewChild,
                 args: [AXColorPalleteComponent]

package/esm2022/color-palette/lib/color-palette.component.mjs

@@ -23,7 +23,7 @@ export class AXColorPalleteComponent extends MXValueComponent {
                 provide: AXColorPaletteParentComponent,
                 useExisting: AXColorPalleteComponent,
             },
-        ], queries: [{ propertyName: "_children", predicate: AXColorPaletteChildComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select='ax-header'></ng-content>\n\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children?.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children?.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content select='ax-color-palette-preview'></ng-content>\n    <ng-content select='ax-color-palette-picker'></ng-content>\n    <ng-content select='ax-color-palette-swatches'></ng-content>\n    <ng-content select='ax-color-palette-favorite'></ng-content>\n    <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n    <ax-color-palette-preview></ax-color-palette-preview>\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</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{outline-width:1px;outline-offset:1px;outline-color:#0000004d}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff 0%,rgba(255,255,255,0) 100%);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient input{background:linear-gradient(to right,rgb(255,0,0) 0%,rgb(255,255,0) 17%,rgb(0,255,0) 33%,rgb(0,255,255) 50%,rgb(0,0,255) 67%,rgb(255,0,255) 83%,rgb(255,0,0) 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent input{background-image:linear-gradient(to right,rgba(245,246,252,0),rgb(0,0,0)),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: i3.AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: i4.AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: i5.AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "_children", predicate: AXColorPaletteChildComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select='ax-header'></ng-content>\n\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children?.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children?.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content select='ax-color-palette-preview'></ng-content>\n    <ng-content select='ax-color-palette-picker'></ng-content>\n    <ng-content select='ax-color-palette-swatches'></ng-content>\n    <ng-content select='ax-color-palette-favorite'></ng-content>\n    <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n    <ax-color-palette-preview></ax-color-palette-preview>\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</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));grid-gap:.5rem;gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{outline-width:1px;outline-offset:1px;outline-color:rgba(0,0,0,.3)}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff 0%,rgba(255,255,255,0) 100%);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient input{background:linear-gradient(to right,rgb(255,0,0) 0%,rgb(255,255,0) 17%,rgb(0,255,0) 33%,rgb(0,255,255) 50%,rgb(0,0,255) 67%,rgb(255,0,255) 83%,rgb(255,0,0) 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent input{background-image:linear-gradient(to right,rgba(245,246,252,0),rgb(0,0,0)),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: i3.AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: i4.AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: i5.AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXColorPalleteComponent, decorators: [{
             type: Component,
@@ -45,7 +45,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
                             provide: AXColorPaletteParentComponent,
                             useExisting: AXColorPalleteComponent,
                         },
-                    ], template: "<ng-content select='ax-header'></ng-content>\n\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children?.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children?.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content select='ax-color-palette-preview'></ng-content>\n    <ng-content select='ax-color-palette-picker'></ng-content>\n    <ng-content select='ax-color-palette-swatches'></ng-content>\n    <ng-content select='ax-color-palette-favorite'></ng-content>\n    <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n    <ax-color-palette-preview></ax-color-palette-preview>\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</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{outline-width:1px;outline-offset:1px;outline-color:#0000004d}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff 0%,rgba(255,255,255,0) 100%);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient input{background:linear-gradient(to right,rgb(255,0,0) 0%,rgb(255,255,0) 17%,rgb(0,255,0) 33%,rgb(0,255,255) 50%,rgb(0,0,255) 67%,rgb(255,0,255) 83%,rgb(255,0,0) 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent input{background-image:linear-gradient(to right,rgba(245,246,252,0),rgb(0,0,0)),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}\n"] }]
+                    ], template: "<ng-content select='ax-header'></ng-content>\n\n<ng-container [ngTemplateOutlet]=\"default\" *ngIf=\"!_children?.length\"></ng-container>\n<ng-container [ngTemplateOutlet]=\"custom\" *ngIf=\"_children?.length\"></ng-container>\n\n<ng-template #custom>\n    <ng-content select='ax-color-palette-preview'></ng-content>\n    <ng-content select='ax-color-palette-picker'></ng-content>\n    <ng-content select='ax-color-palette-swatches'></ng-content>\n    <ng-content select='ax-color-palette-favorite'></ng-content>\n    <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n    <ax-color-palette-preview></ax-color-palette-preview>\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</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));grid-gap:.5rem;gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{outline-width:1px;outline-offset:1px;outline-color:rgba(0,0,0,.3)}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff 0%,rgba(255,255,255,0) 100%);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient input{background:linear-gradient(to right,rgb(255,0,0) 0%,rgb(255,255,0) 17%,rgb(0,255,0) 33%,rgb(0,255,255) 50%,rgb(0,0,255) 67%,rgb(255,0,255) 83%,rgb(255,0,0) 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent input{background-image:linear-gradient(to right,rgba(245,246,252,0),rgb(0,0,0)),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}\n"] }]
         }], propDecorators: { _children: [{
                 type: ContentChildren,
                 args: [AXColorPaletteChildComponent]

package/esm2022/dialog/lib/dialog.component.mjs

@@ -39,7 +39,7 @@ export class AXDialogComponent extends MXBaseComponent {
                 provide: AXClosbaleComponent,
                 useExisting: AXDialogComponent,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\"\n  cdkDrag\n  cdkDragHandle\n  tabindex=\"-1\"\n>\n  <div class=\"ax-dialog-content-wrapper\">\n    <div class=\"ax-dialog-icon-side\" *ngIf=\"data.icon !== 'none'\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      <i class=\"ax-icon ax-icon-close\" *ngIf=\"data.closeButton\"></i>\n    </div>\n  </div>\n  <ax-footer>\n    <ng-container *ngFor=\"let button of data.buttons; let i = index\">\n      <ax-button\n        [text]=\"button.text\"\n        [tabindex]=\"i\"\n        [axHotkey]=\"button.hotkey\"\n        [axAutoFocus]=\"_hasAutoFocus(button)\"\n        (onClick)=\"_handleButtonClick(button)\"\n        [look]=\"button.look\"\n        [disabled]=\"button.disabled\"\n        [color]=\"button.color\"\n      >\n        <ax-loading *ngIf=\"button.loading\"></ax-loading>\n      </ax-button>\n    </ng-container>\n  </ax-footer>\n</div>\n", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore),var(--tw-text-opacity))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;font-weight:500;line-height:1.5rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore-tint),var(--tw-text-opacity))}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "directive", type: i3.AXHotkeyDirective, selector: "[axHotkey]", inputs: ["axHotkey"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i6.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\"\n  cdkDrag\n  cdkDragHandle\n  tabindex=\"-1\"\n>\n  <div class=\"ax-dialog-content-wrapper\">\n    <div class=\"ax-dialog-icon-side\" *ngIf=\"data.icon !== 'none'\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      <i class=\"ax-icon ax-icon-close\" *ngIf=\"data.closeButton\"></i>\n    </div>\n  </div>\n  <ax-footer>\n    <ng-container *ngFor=\"let button of data.buttons; let i = index\">\n      <ax-button\n        [text]=\"button.text\"\n        [tabindex]=\"i\"\n        [axHotkey]=\"button.hotkey\"\n        [axAutoFocus]=\"_hasAutoFocus(button)\"\n        (onClick)=\"_handleButtonClick(button)\"\n        [look]=\"button.look\"\n        [disabled]=\"button.disabled\"\n        [color]=\"button.color\"\n      >\n        <ax-loading *ngIf=\"button.loading\"></ax-loading>\n      </ax-button>\n    </ng-container>\n  </ax-footer>\n</div>\n", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore),var(--tw-text-opacity))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{-webkit-margin-start:1rem;margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;font-weight:500;line-height:1.5rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore-tint),var(--tw-text-opacity))}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "directive", type: i3.AXHotkeyDirective, selector: "[axHotkey]", inputs: ["axHotkey"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i6.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXDialogComponent, decorators: [{
             type: Component,
@@ -48,7 +48,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
                             provide: AXClosbaleComponent,
                             useExisting: AXDialogComponent,
                         },
-                    ], template: "<div\n  class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\"\n  cdkDrag\n  cdkDragHandle\n  tabindex=\"-1\"\n>\n  <div class=\"ax-dialog-content-wrapper\">\n    <div class=\"ax-dialog-icon-side\" *ngIf=\"data.icon !== 'none'\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      <i class=\"ax-icon ax-icon-close\" *ngIf=\"data.closeButton\"></i>\n    </div>\n  </div>\n  <ax-footer>\n    <ng-container *ngFor=\"let button of data.buttons; let i = index\">\n      <ax-button\n        [text]=\"button.text\"\n        [tabindex]=\"i\"\n        [axHotkey]=\"button.hotkey\"\n        [axAutoFocus]=\"_hasAutoFocus(button)\"\n        (onClick)=\"_handleButtonClick(button)\"\n        [look]=\"button.look\"\n        [disabled]=\"button.disabled\"\n        [color]=\"button.color\"\n      >\n        <ax-loading *ngIf=\"button.loading\"></ax-loading>\n      </ax-button>\n    </ng-container>\n  </ax-footer>\n</div>\n", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore),var(--tw-text-opacity))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;font-weight:500;line-height:1.5rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore-tint),var(--tw-text-opacity))}\n"] }]
+                    ], template: "<div\n  class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\"\n  cdkDrag\n  cdkDragHandle\n  tabindex=\"-1\"\n>\n  <div class=\"ax-dialog-content-wrapper\">\n    <div class=\"ax-dialog-icon-side\" *ngIf=\"data.icon !== 'none'\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      <i class=\"ax-icon ax-icon-close\" *ngIf=\"data.closeButton\"></i>\n    </div>\n  </div>\n  <ax-footer>\n    <ng-container *ngFor=\"let button of data.buttons; let i = index\">\n      <ax-button\n        [text]=\"button.text\"\n        [tabindex]=\"i\"\n        [axHotkey]=\"button.hotkey\"\n        [axAutoFocus]=\"_hasAutoFocus(button)\"\n        (onClick)=\"_handleButtonClick(button)\"\n        [look]=\"button.look\"\n        [disabled]=\"button.disabled\"\n        [color]=\"button.color\"\n      >\n        <ax-loading *ngIf=\"button.loading\"></ax-loading>\n      </ax-button>\n    </ng-container>\n  </ax-footer>\n</div>\n", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-500),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore),var(--tw-text-opacity))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{-webkit-margin-start:1rem;margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;font-weight:500;line-height:1.5rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info-100),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore-tint),var(--tw-text-opacity))}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [DIALOG_DATA]

package/esm2022/drawer/lib/drawer.component.mjs

@@ -106,7 +106,7 @@ export class AXDrawerComponent extends MXBaseComponent {
         ], usesInheritance: true, ngImport: i0, template: `
     <ng-content select="ax-header"></ng-content>
     <ng-content select="ax-content"></ng-content>
-  `, isInline: true, styles: ["ax-drawer-container{position:relative;display:flex;height:100%;width:100%;overflow:hidden}ax-drawer-container.ax-fixed{bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;z-index:50;display:none}ax-drawer-container.ax-fixed.ax-visible{display:flex}ax-drawer-container .ax-backdrop{position:absolute;bottom:0;top:0;z-index:10;height:100%;width:100%;background-color:#0000000d;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer{display:flex;height:100%;max-width:95%;flex-direction:column;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-drawer-container ax-drawer.ax-state-loaded{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer ax-header,ax-drawer-container ax-drawer ax-footer{padding:.75rem}ax-drawer-container ax-drawer ax-footer{border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer ax-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer>ax-content{flex:1 1 0%;overflow:auto}ax-drawer-container ax-drawer.ax-drawer-overlay{position:absolute}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-expanded{z-index:20}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-collapsed{z-index:0}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-expanded{inset-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-collapsed{inset-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-expanded{inset-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-collapsed{inset-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push{flex:0 1 auto}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start{order:-9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-expanded{margin-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-collapsed{margin-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end{order:9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-expanded{margin-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-collapsed{margin-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container>ax-content{height:100%;flex:1 1 0%;overflow:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, styles: ["ax-drawer-container{position:relative;display:flex;height:100%;width:100%;overflow:hidden}ax-drawer-container.ax-fixed{bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;z-index:50;display:none}ax-drawer-container.ax-fixed.ax-visible{display:flex}ax-drawer-container .ax-backdrop{position:absolute;bottom:0;top:0;z-index:10;height:100%;width:100%;background-color:rgba(0,0,0,.05);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer{display:flex;height:100%;max-width:95%;flex-direction:column;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-drawer-container ax-drawer.ax-state-loaded{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer ax-header,ax-drawer-container ax-drawer ax-footer{padding:.75rem}ax-drawer-container ax-drawer ax-footer{border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer ax-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer>ax-content{flex:1 1 0%;overflow:auto}ax-drawer-container ax-drawer.ax-drawer-overlay{position:absolute}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-expanded{z-index:20}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-collapsed{z-index:0}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-expanded{inset-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-collapsed{inset-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-expanded{inset-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-collapsed{inset-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push{flex:0 1 auto}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start{order:-9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-expanded{-webkit-margin-start:0px;margin-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-collapsed{-webkit-margin-start:calc(-1 * var(--ax-el-width));margin-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end{order:9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-expanded{-webkit-margin-end:0px;margin-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-collapsed{-webkit-margin-end:calc(-1 * var(--ax-el-width));margin-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container>ax-content{height:100%;flex:1 1 0%;overflow:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXDrawerComponent, decorators: [{
             type: Component,
@@ -116,7 +116,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
   `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         { provide: AXComponent, useExisting: AXDrawerComponent },
                         { provide: AXClosbaleComponent, useExisting: AXDrawerComponent },
-                    ], styles: ["ax-drawer-container{position:relative;display:flex;height:100%;width:100%;overflow:hidden}ax-drawer-container.ax-fixed{bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;z-index:50;display:none}ax-drawer-container.ax-fixed.ax-visible{display:flex}ax-drawer-container .ax-backdrop{position:absolute;bottom:0;top:0;z-index:10;height:100%;width:100%;background-color:#0000000d;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer{display:flex;height:100%;max-width:95%;flex-direction:column;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-drawer-container ax-drawer.ax-state-loaded{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer ax-header,ax-drawer-container ax-drawer ax-footer{padding:.75rem}ax-drawer-container ax-drawer ax-footer{border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer ax-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer>ax-content{flex:1 1 0%;overflow:auto}ax-drawer-container ax-drawer.ax-drawer-overlay{position:absolute}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-expanded{z-index:20}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-collapsed{z-index:0}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-expanded{inset-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-collapsed{inset-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-expanded{inset-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-collapsed{inset-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push{flex:0 1 auto}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start{order:-9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-expanded{margin-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-collapsed{margin-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end{order:9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-expanded{margin-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-collapsed{margin-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container>ax-content{height:100%;flex:1 1 0%;overflow:auto}\n"] }]
+                    ], styles: ["ax-drawer-container{position:relative;display:flex;height:100%;width:100%;overflow:hidden}ax-drawer-container.ax-fixed{bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;z-index:50;display:none}ax-drawer-container.ax-fixed.ax-visible{display:flex}ax-drawer-container .ax-backdrop{position:absolute;bottom:0;top:0;z-index:10;height:100%;width:100%;background-color:rgba(0,0,0,.05);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer{display:flex;height:100%;max-width:95%;flex-direction:column;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}ax-drawer-container ax-drawer.ax-state-loaded{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer ax-header,ax-drawer-container ax-drawer ax-footer{padding:.75rem}ax-drawer-container ax-drawer ax-footer{border-top-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer ax-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-border-default),var(--tw-border-opacity))}ax-drawer-container ax-drawer>ax-content{flex:1 1 0%;overflow:auto}ax-drawer-container ax-drawer.ax-drawer-overlay{position:absolute}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-expanded{z-index:20}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-collapsed{z-index:0}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-expanded{inset-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-collapsed{inset-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-expanded{inset-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-collapsed{inset-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push{flex:0 1 auto}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start{order:-9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-expanded{-webkit-margin-start:0px;margin-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-collapsed{-webkit-margin-start:calc(-1 * var(--ax-el-width));margin-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end{order:9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-expanded{-webkit-margin-end:0px;margin-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-collapsed{-webkit-margin-end:calc(-1 * var(--ax-el-width));margin-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container>ax-content{height:100%;flex:1 1 0%;overflow:auto}\n"] }]
         }], ctorParameters: () => [{ type: i0.NgZone }], propDecorators: { locationChange: [{
                 type: Output
             }], location: [{

package/esm2022/form/lib/form-field.component.mjs

@@ -3,10 +3,10 @@ import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/
 import * as i0 from "@angular/core";
 export class AXFormFieldComponent extends MXBaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXFormFieldComponent, selector: "ax-form-field", usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-200),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-700),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-500),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));padding:.25rem .5rem;font-weight:400;--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;--tw-content: \"\";content:var(--tw-content)}ax-form form.ax-float-error .ax-error-message:before{margin-inline-start:-1px;border-width:4px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXFormFieldComponent, selector: "ax-form-field", usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-200),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-700),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-500),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));padding:.25rem .5rem;font-weight:400;--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;--tw-content: \"\";content:var(--tw-content)}ax-form form.ax-float-error .ax-error-message:before{-webkit-margin-start:-1px;margin-inline-start:-1px;border-width:4px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXFormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-form-field', template: `<ng-content></ng-content>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-200),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-700),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-500),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));padding:.25rem .5rem;font-weight:400;--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;--tw-content: \"\";content:var(--tw-content)}ax-form form.ax-float-error .ax-error-message:before{margin-inline-start:-1px;border-width:4px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"] }]
+            args: [{ selector: 'ax-form-field', template: `<ng-content></ng-content>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-200),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore-tint),var(--tw-text-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message{--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-700),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-700),var(--tw-border-opacity))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-500),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger-500),var(--tw-bg-opacity));padding:.25rem .5rem;font-weight:400;--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;--tw-content: \"\";content:var(--tw-content)}ax-form form.ax-float-error .ax-error-message:before{-webkit-margin-start:-1px;margin-inline-start:-1px;border-width:4px;--tw-border-opacity: 1;border-bottom-color:rgba(var(--ax-color-danger-500),var(--tw-border-opacity))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"] }]
         }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1maWVsZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvZm9ybS9zcmMvbGliL2Zvcm0tZmllbGQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUM1RCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVN0RixNQUFNLE9BQU8sb0JBQXFCLFNBQVEsZUFBZTs4R0FBNUMsb0JBQW9CO2tHQUFwQixvQkFBb0IsNEVBTHJCLDJCQUEyQjs7MkZBSzFCLG9CQUFvQjtrQkFQaEMsU0FBUzsrQkFDRSxlQUFlLFlBQ2YsMkJBQTJCLGlCQUV0QixpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTVhCYXNlQ29tcG9uZW50IH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2NvbW1vbic7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdheC1mb3JtLWZpZWxkJyxcbiAgdGVtcGxhdGU6IGA8bmctY29udGVudD48L25nLWNvbnRlbnQ+YCxcbiAgc3R5bGVVcmxzOiBbJy4vZm9ybS1maWVsZC5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgQVhGb3JtRmllbGRDb21wb25lbnQgZXh0ZW5kcyBNWEJhc2VDb21wb25lbnQge31cbiJdfQ==

package/esm2022/image/lib/image.component.mjs

@@ -47,11 +47,11 @@ export class AXImageComponent extends MXBaseComponent {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXImageComponent, selector: "ax-image", inputs: { overlayMode: "overlayMode", src: "src", alt: "alt", priority: "priority", lazy: "lazy" }, outputs: { onLoad: "onLoad", onError: "onError" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], usesInheritance: true, ngImport: i0, template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\"\n/>\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#000000bf}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: AXImageComponent, selector: "ax-image", inputs: { overlayMode: "overlayMode", src: "src", alt: "alt", priority: "priority", lazy: "lazy" }, outputs: { onLoad: "onLoad", onError: "onError" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], usesInheritance: true, ngImport: i0, template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\"\n/>\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(0,0,0,.75)}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXImageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-image', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\"\n/>\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#000000bf}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"] }]
+            args: [{ selector: 'ax-image', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\"\n/>\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(0,0,0,.75)}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"] }]
         }], propDecorators: { overlayMode: [{
                 type: Input
             }], src: [{

package/esm2022/list/lib/list.component.mjs

@@ -134,7 +134,7 @@ export class AXListComponent extends MXSelectionValueComponent {
                 },
                 deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]]
             }
-        ], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'layout.loading.text' | trans}}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;justify-content:space-between;padding-inline-end:1rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{font-size:1.5rem;line-height:2rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-500),var(--tw-text-opacity))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i2.CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'layout.loading.text' | trans}}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:space-between;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:.75rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{-webkit-margin-start:.5rem;margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{font-size:1.5rem;line-height:2rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-500),var(--tw-text-opacity))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i2.CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: AXListComponent, decorators: [{
             type: Component,
@@ -164,7 +164,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
                             },
                             deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]]
                         }
-                    ], template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'layout.loading.text' | trans}}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;justify-content:space-between;padding-inline-end:1rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{font-size:1.5rem;line-height:2rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-500),var(--tw-text-opacity))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"] }]
+                    ], template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'layout.loading.text' | trans}}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:space-between;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:.75rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{-webkit-margin-start:.5rem;margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{font-size:1.5rem;line-height:2rem;--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-500),var(--tw-text-opacity))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"] }]
         }], propDecorators: { dataSource: [{
                 type: Input
             }], itemHeight: [{