npm - @acorex/components - Versions diffs - 7.1.3 → 7.1.6 - Mend

@acorex/components 7.1.3 → 7.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (271) hide show

package/fesm2022/acorex-components-action-sheet.mjs CHANGED Viewed

@@ -1,6 +1,5 @@
 import * as i2$1 from '@acorex/components/common';
-import { TAB_META_KEY, AXCommonModule, AXComponentClosedPromise } from '@acorex/components/common';
-import { AXBaseComponent } from '@acorex/components/mixin';
+import { MXBaseComponent, TAB_META_KEY, AXCommonModule, AXComponentClosedPromise } from '@acorex/components/common';
 import * as i2 from '@angular/cdk/portal';
 import { TemplatePortal, ComponentPortal, PortalModule } from '@angular/cdk/portal';
 import * as i0 from '@angular/core';
@@ -15,8 +14,9 @@ import { AXButtonModule } from '@acorex/components/button';
 import { AXTranslator } from '@acorex/core/translation';
 import * as i1$1 from '@angular/cdk/overlay';
-class AXActionSheetComponent extends AXBaseComponent {
-    _viewContainerRef;
+;
+class AXActionSheetComponent extends MXBaseComponent {
     _selectedPortal;
     title;
     items = [];
@@ -25,18 +25,14 @@ class AXActionSheetComponent extends AXBaseComponent {
     showHeader = true;
     data = {};
     onClosed = new EventEmitter();
-    constructor(elementRef, cdr, _viewContainerRef) {
-        super(elementRef, cdr);
-        this._viewContainerRef = _viewContainerRef;
-    }
     close() {
         this.onClosed.emit({
             component: this[TAB_META_KEY].component,
-            htmlElement: this._getHostElement(),
+            htmlElement: this.getHostElement(),
         });
-        this._cdr.detectChanges();
+        this.cdr.detectChanges();
     }
-    onInit() {
+    ngOnInit() {
         if (this.content) {
             if (typeof this.content === 'string') {
                 //   this.rendererService.findLoadedComponentByRoute(this.content, 20).then(route => {
@@ -46,17 +42,17 @@ class AXActionSheetComponent extends AXBaseComponent {
                 //   });
             }
             else if (this.content instanceof TemplateRef) {
-                this._selectedPortal = new TemplatePortal(this.content, this._viewContainerRef, { $implicit: this.data, ref: this });
-                this._cdr.markForCheck();
+                this._selectedPortal = new TemplatePortal(this.content, this.getViewContainer(), { $implicit: this.data, ref: this });
+                this.cdr.markForCheck();
             }
             else if (typeof this.content === 'function') {
                 this._selectedPortal = new ComponentPortal(this.content);
-                this._cdr.markForCheck();
+                this.cdr.markForCheck();
             }
         }
     }
     onKeydownHandler(event) {
-        let focusedOrHasFocused = this._getHostElement().matches(':focus-within');
+        let focusedOrHasFocused = this.getHostElement().matches(':focus-within');
         if (this.showCloseButton && focusedOrHasFocused) {
             this.close();
         }
@@ -76,24 +72,24 @@ class AXActionSheetComponent extends AXBaseComponent {
     _handleCloseClick() {
         this.close();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXActionSheetComponent, selector: "ax-action-sheet", host: { listeners: { "keydown.escape": "onKeydownHandler($event)" } }, usesInheritance: true, ngImport: i0, template: "<ax-header>\n  <ax-title>{{ title }}</ax-title>\n  <ax-close-button (click)=\"_handleCloseClick()\" tabindex=\"1\"></ax-close-button>\n</ax-header>\n<ng-template *ngIf=\"_selectedPortal\">\n  <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n</ng-template>\n<!-- TODO: Are you sure we need this? if remove this content not showing -->\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n  <ng-container *ngFor=\"let item of items\">\n    <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" (click)=\"item.onClick()\">\n      <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n      <span class=\"item-text\">{{ item.text }}</span>\n    </div>\n  </ng-container>\n</div>\n", styles: ["@media (max-width: 599px){ax-action-sheet{width:100vw}}@media (min-width: 600px){ax-action-sheet{width:75vw}}@media (min-width: 1200px){ax-action-sheet{width:30vw}}@media (min-width: 1800px){ax-action-sheet{width:25vw}}ax-action-sheet ax-header{padding:.75rem}ax-action-sheet .ax-action-sheet-items{padding:.5rem 0}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{-webkit-user-select:none;user-select:none;cursor:pointer;padding:.75rem 1rem;display:flex}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{font-size:1.5rem;margin-inline-end:.75rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i3.AXDecoratorHeaderComponent, selector: "ax-header" }, { kind: "component", type: i3.AXDecoratorTitleComponent, selector: "ax-title" }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXActionSheetComponent, selector: "ax-action-sheet", host: { listeners: { "keydown.escape": "onKeydownHandler($event)" } }, usesInheritance: true, ngImport: i0, template: "<ax-header>\n  <ax-title>{{ title }}</ax-title>\n  <ax-close-button (click)=\"_handleCloseClick()\" tabindex=\"1\"></ax-close-button>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n  <ng-container *ngFor=\"let item of items\">\n    <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" (click)=\"item.onClick()\">\n      <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n      <span class=\"item-text\">{{ item.text }}</span>\n    </div>\n  </ng-container>\n</div>\n", styles: ["@media (max-width: 599px){ax-action-sheet{width:100vw}}@media (min-width: 600px){ax-action-sheet{width:75vw}}@media (min-width: 1200px){ax-action-sheet{width:30vw}}@media (min-width: 1800px){ax-action-sheet{width:25vw}}ax-action-sheet ax-header{padding:.75rem}ax-action-sheet .ax-action-sheet-items{padding:.5rem 0}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{-webkit-user-select:none;user-select:none;cursor:pointer;padding:.75rem 1rem;display:flex}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{font-size:1.5rem;margin-inline-end:.75rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i3.AXDecoratorHeaderComponent, selector: "ax-header" }, { kind: "component", type: i3.AXDecoratorTitleComponent, selector: "ax-title" }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-action-sheet', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ax-header>\n  <ax-title>{{ title }}</ax-title>\n  <ax-close-button (click)=\"_handleCloseClick()\" tabindex=\"1\"></ax-close-button>\n</ax-header>\n<ng-template *ngIf=\"_selectedPortal\">\n  <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n</ng-template>\n<!-- TODO: Are you sure we need this? if remove this content not showing -->\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n  <ng-container *ngFor=\"let item of items\">\n    <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" (click)=\"item.onClick()\">\n      <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n      <span class=\"item-text\">{{ item.text }}</span>\n    </div>\n  </ng-container>\n</div>\n", styles: ["@media (max-width: 599px){ax-action-sheet{width:100vw}}@media (min-width: 600px){ax-action-sheet{width:75vw}}@media (min-width: 1200px){ax-action-sheet{width:30vw}}@media (min-width: 1800px){ax-action-sheet{width:25vw}}ax-action-sheet ax-header{padding:.75rem}ax-action-sheet .ax-action-sheet-items{padding:.5rem 0}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{-webkit-user-select:none;user-select:none;cursor:pointer;padding:.75rem 1rem;display:flex}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{font-size:1.5rem;margin-inline-end:.75rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.ViewContainerRef }]; }, propDecorators: { onKeydownHandler: [{
+            args: [{ selector: 'ax-action-sheet', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ax-header>\n  <ax-title>{{ title }}</ax-title>\n  <ax-close-button (click)=\"_handleCloseClick()\" tabindex=\"1\"></ax-close-button>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n  <ng-container *ngFor=\"let item of items\">\n    <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" (click)=\"item.onClick()\">\n      <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n      <span class=\"item-text\">{{ item.text }}</span>\n    </div>\n  </ng-container>\n</div>\n", styles: ["@media (max-width: 599px){ax-action-sheet{width:100vw}}@media (min-width: 600px){ax-action-sheet{width:75vw}}@media (min-width: 1200px){ax-action-sheet{width:30vw}}@media (min-width: 1800px){ax-action-sheet{width:25vw}}ax-action-sheet ax-header{padding:.75rem}ax-action-sheet .ax-action-sheet-items{padding:.5rem 0}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{-webkit-user-select:none;user-select:none;cursor:pointer;padding:.75rem 1rem;display:flex}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{font-size:1.5rem;margin-inline-end:.75rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"] }]
+        }], propDecorators: { onKeydownHandler: [{
                 type: HostListener,
                 args: ['keydown.escape', ['$event']]
             }] } });
 const MODULES = [CommonModule, AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule];
 class AXActionSheetModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetModule, declarations: [AXActionSheetComponent], imports: [CommonModule, AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule], exports: [AXActionSheetComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetModule, imports: [MODULES] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetModule, declarations: [AXActionSheetComponent], imports: [CommonModule, AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule], exports: [AXActionSheetComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetModule, imports: [MODULES] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [AXActionSheetComponent],
@@ -106,14 +102,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
 class AXActionSheetService {
     _overlay;
     overlayService;
-    // _overlayRef: OverlayRef;
-    // _templatePortal!: ComponentPortal<any>;
     constructor(_overlay, overlayService) {
         this._overlay = _overlay;
         this.overlayService = overlayService;
     }
-    //open(items: AXActionSheetItem[],options?:AXActionSheetOptions);
-    //open(content:AXActionSheetContentType, options?: AXActionSheetOptions);
     open(options) {
         const opt = {
             title: AXTranslator.get('action-sheet.title'),
@@ -181,10 +173,10 @@ class AXActionSheetService {
             closeFunc(result);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetService, deps: [{ token: i1$1.Overlay }, { token: i2$1.AXOverlayService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetService, deps: [{ token: i1$1.Overlay }, { token: i2$1.AXOverlayService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXActionSheetService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXActionSheetService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i2$1.AXOverlayService }]; } });

package/fesm2022/acorex-components-action-sheet.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../projects/acorex/components/action-sheet/src/action-sheet.component.ts","../../../../projects/acorex/components/action-sheet/src/action-sheet.component.html","../../../../projects/acorex/components/action-sheet/src/action-sheet.module.ts","../../../../projects/acorex/components/action-sheet/src/action-sheet.service.ts","../../../../projects/acorex/components/action-sheet/acorex-components-action-sheet.ts"],"sourcesContent":["import { AXComponentCloseEvent, TAB_META_KEY } from '@acorex/components/common';\nimport { AXBaseComponent } from '@acorex/components/mixin';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ComponentRef, ElementRef, EventEmitter, HostListener, Input, TemplateRef, ViewContainerRef, ViewEncapsulation } from '@angular/core';\nimport { AXActionSheetItem } from './action-sheet.interface';\n\n@Component({\n selector: 'ax-action-sheet',\n templateUrl: './action-sheet.component.html',\n styleUrls: ['./action-sheet.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\n\nexport class AXActionSheetComponent extends AXBaseComponent {\n\n _selectedPortal: Portal<any>;\n title: string;\n items: AXActionSheetItem[] = [];\n content: any;\n showCloseButton: boolean = true;\n showHeader: boolean = true;\n data: any = {};\n\n onClosed: EventEmitter<AXComponentCloseEvent> = new EventEmitter<AXComponentCloseEvent>();\n\n constructor(elementRef: ElementRef, cdr: ChangeDetectorRef, private _viewContainerRef: ViewContainerRef,) {\n super(elementRef, cdr);\n }\n\n close(): void {\n this.onClosed.emit({\n component: this[TAB_META_KEY].component,\n htmlElement: this._getHostElement(),\n });\n this._cdr.detectChanges();\n }\n\n onInit(): void {\n if (this.content) {\n if (typeof this.content === 'string') {\n // this.rendererService.findLoadedComponentByRoute(this.content, 20).then(route => {\n // setTimeout(() => {\n // this.loadComponent(route.component);\n // }, 300);\n // });\n } else if (this.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(\n this.content,\n this._viewContainerRef,\n { $implicit: this.data, ref: this }\n );\n this._cdr.markForCheck();\n } else if (typeof this.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.content);\n this._cdr.markForCheck();\n }\n }\n }\n\n @HostListener('keydown.escape', ['$event'])\n onKeydownHandler(event: KeyboardEvent) {\n let focusedOrHasFocused = this._getHostElement().matches(':focus-within');\n if (this.showCloseButton && focusedOrHasFocused) {\n this.close();\n }\n }\n\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<any>;\n if (ref.instance) {\n this[TAB_META_KEY].component = ref.instance;\n Object.assign(this[TAB_META_KEY].component, this.data);\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.onClosed.emit(e);\n });\n }\n }\n }\n\n _handleCloseClick() {\n this.close();\n }\n}\n","<ax-header>\n <ax-title>{{ title }}</ax-title>\n <ax-close-button (click)=\"_handleCloseClick()\" tabindex=\"1\"></ax-close-button>\n</ax-header>\n<ng-template ngIf=\"_selectedPortal\">\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n</ng-template>\n<!-- TODO: Are you sure we need this? if remove this content not showing -->\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container ngFor=\"let item of items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" (click)=\"item.onClick()\">\n <span class=\"item-icon\" ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text }}</span>\n </div>\n </ng-container>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { AXButtonModule } from '@acorex/components/button';\n\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\n\nconst MODULES = [CommonModule,AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule];\n\n\n@NgModule({\n declarations: [AXActionSheetComponent],\n imports: [...MODULES],\n exports: [AXActionSheetComponent],\n providers: [],\n})\nexport class AXActionSheetModule { }\n","import {\n AXComponentClosedPromise,\n AXComponentCloseEvent,\n AXOverlayService,\n AXOverlayViewRef,\n TAB_META_KEY,\n} from '@acorex/components/common';\nimport { AXTranslator } from '@acorex/core/translation';\nimport { Overlay } from '@angular/cdk/overlay';\nimport { Injectable } from '@angular/core';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetOptions } from './action-sheet.interface';\n\n@Injectable({ providedIn: 'root' })\nexport class AXActionSheetService {\n // _overlayRef: OverlayRef;\n // _templatePortal!: ComponentPortal<any>;\n\n constructor(private _overlay: Overlay, private overlayService: AXOverlayService) {}\n\n //open(items: AXActionSheetItem[],options?:AXActionSheetOptions);\n //open(content:AXActionSheetContentType, options?: AXActionSheetOptions);\n open(options: AXActionSheetOptions): AXComponentClosedPromise {\n const opt: any = {\n title: AXTranslator.get('action-sheet.title'),\n showCloseButton: true,\n closeOnBackdrop: true,\n showHeader: true,\n };\n Object.assign(opt, options);\n const lastActiveElement = document.activeElement as HTMLElement;\n const com = this.overlayService.show(AXActionSheetComponent, opt, {\n hasBackdrop: true,\n closeOnClickOutside: opt.closeOnBackdrop,\n transparentBackdrop: false,\n panelClass: ['ax-actionsheet-panel'],\n position: this._overlay.position().global().bottom().centerHorizontally(),\n scroll: 'block',\n });\n const actionSheet = com.instance as AXActionSheetComponent;\n actionSheet[TAB_META_KEY] = {};\n actionSheet.onClosed.subscribe(c => {\n this.closePopup(actionSheet, com, c, lastActiveElement);\n });\n const promise = new AXComponentClosedPromise((resolve, reject) => {\n actionSheet[TAB_META_KEY].close = e => {\n if (resolve) {\n resolve(e);\n } else {\n reject(e);\n }\n };\n });\n promise['closeMethod'] = () => {\n actionSheet.close();\n };\n return promise;\n }\n\n private closePopup(popup: AXActionSheetComponent, com: AXOverlayViewRef, result: AXComponentCloseEvent, lastActiveElement?: HTMLElement) {\n const closeFunc = e => {\n com.dispose();\n delete e.cancel;\n popup[TAB_META_KEY].close(e);\n if (lastActiveElement?.focus) {\n lastActiveElement.focus();\n }\n };\n const e = { cancel: false };\n const closingFunc = popup[TAB_META_KEY].component?.onClosing;\n if (closingFunc) {\n const res = closingFunc(e);\n if (res instanceof Promise) {\n res.then(() => {\n if (e == null \|\| e.cancel !== true) {\n closeFunc(result);\n }\n });\n } else {\n if (e == null \|\| e.cancel !== true) {\n closeFunc(result);\n }\n }\n } else {\n closeFunc(result);\n }\n }\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1","i2"],"mappings":"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"}
1	+ {"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../projects/acorex/components/action-sheet/src/action-sheet.interface.ts","../../../../projects/acorex/components/action-sheet/src/action-sheet.component.ts","../../../../projects/acorex/components/action-sheet/src/action-sheet.component.html","../../../../projects/acorex/components/action-sheet/src/action-sheet.module.ts","../../../../projects/acorex/components/action-sheet/src/action-sheet.service.ts","../../../../projects/acorex/components/action-sheet/acorex-components-action-sheet.ts"],"sourcesContent":["import { AXStyleColorType } from \"@acorex/components/common\";\nimport { TemplateRef } from \"@angular/core\";\n\nexport interface AXActionSheetItem {\n name?: string,\n text: string,\n icon?: string;\n disabled?: boolean,\n color?: AXStyleColorType,\n onClick?: () => void,\n}\n\nexport type AXActionSheetContentType = TemplateRef<any> \| Function;\n\nexport interface AXActionSheetOptions {\n title?: string;\n showCloseButton?: boolean;\n closeOnBackdrop?: boolean;\n showHeader?: boolean;\n items?: AXActionSheetItem[]\n content?: AXActionSheetContentType;\n data?: any;\n};\n","import { AXComponentCloseEvent, MXBaseComponent, TAB_META_KEY } from '@acorex/components/common';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport { ChangeDetectionStrategy, Component, ComponentRef, EventEmitter, HostListener, TemplateRef, ViewEncapsulation } from '@angular/core';\nimport { AXActionSheetItem } from './action-sheet.interface';\n\n@Component({\n selector:'ax-action-sheet',\n templateUrl: './action-sheet.component.html',\n styleUrls: ['./action-sheet.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXActionSheetComponent extends MXBaseComponent {\n\n protected _selectedPortal: Portal<any>;\n title: string;\n items: AXActionSheetItem[] = [];\n content: any;\n showCloseButton: boolean = true;\n showHeader: boolean = true;\n data: any = {};\n\n onClosed: EventEmitter<AXComponentCloseEvent> = new EventEmitter<AXComponentCloseEvent>();\n\n close(): void {\n this.onClosed.emit({\n component: this[TAB_META_KEY].component,\n htmlElement: this.getHostElement(),\n });\n this.cdr.detectChanges();\n }\n\n protected ngOnInit(): void {\n if (this.content) {\n if (typeof this.content === 'string') {\n // this.rendererService.findLoadedComponentByRoute(this.content, 20).then(route => {\n // setTimeout(() => {\n // this.loadComponent(route.component);\n // }, 300);\n // });\n } else if (this.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(\n this.content,\n this.getViewContainer(),\n { $implicit: this.data, ref: this }\n );\n this.cdr.markForCheck();\n } else if (typeof this.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.content);\n this.cdr.markForCheck();\n }\n }\n }\n\n @HostListener('keydown.escape', ['$event'])\n protected onKeydownHandler(event: KeyboardEvent) {\n let focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.showCloseButton && focusedOrHasFocused) {\n this.close();\n }\n }\n\n protected _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<any>;\n if (ref.instance) {\n this[TAB_META_KEY].component = ref.instance;\n Object.assign(this[TAB_META_KEY].component, this.data);\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.onClosed.emit(e);\n });\n }\n }\n }\n\n protected _handleCloseClick() {\n this.close();\n }\n}\n","<ax-header>\n <ax-title>{{ title }}</ax-title>\n <ax-close-button (click)=\"_handleCloseClick()\" tabindex=\"1\"></ax-close-button>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container ngFor=\"let item of items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" (click)=\"item.onClick()\">\n <span class=\"item-icon\" ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text }}</span>\n </div>\n </ng-container>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { AXButtonModule } from '@acorex/components/button';\n\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\n\nconst MODULES = [CommonModule,AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule];\n\n\n@NgModule({\n declarations: [AXActionSheetComponent],\n imports: [...MODULES],\n exports: [AXActionSheetComponent],\n providers: [],\n})\nexport class AXActionSheetModule { }\n","import {\n AXComponentClosedPromise,\n AXComponentCloseEvent,\n AXOverlayService,\n AXOverlayViewRef,\n TAB_META_KEY,\n} from '@acorex/components/common';\nimport { AXTranslator } from '@acorex/core/translation';\nimport { Overlay } from '@angular/cdk/overlay';\nimport { Injectable } from '@angular/core';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetOptions } from './action-sheet.interface';\n\n@Injectable({ providedIn: 'root' })\nexport class AXActionSheetService {\n\n constructor(private _overlay: Overlay, private overlayService: AXOverlayService) {}\n\n open(options: AXActionSheetOptions): AXComponentClosedPromise {\n const opt: any = {\n title: AXTranslator.get('action-sheet.title'),\n showCloseButton: true,\n closeOnBackdrop: true,\n showHeader: true,\n };\n Object.assign(opt, options);\n const lastActiveElement = document.activeElement as HTMLElement;\n const com = this.overlayService.show(AXActionSheetComponent, opt, {\n hasBackdrop: true,\n closeOnClickOutside: opt.closeOnBackdrop,\n transparentBackdrop: false,\n panelClass: ['ax-actionsheet-panel'],\n position: this._overlay.position().global().bottom().centerHorizontally(),\n scroll: 'block',\n });\n const actionSheet = com.instance as AXActionSheetComponent;\n actionSheet[TAB_META_KEY] = {};\n actionSheet.onClosed.subscribe(c => {\n this.closePopup(actionSheet, com, c, lastActiveElement);\n });\n const promise = new AXComponentClosedPromise((resolve, reject) => {\n actionSheet[TAB_META_KEY].close = e => {\n if (resolve) {\n resolve(e);\n } else {\n reject(e);\n }\n };\n });\n promise['closeMethod'] = () => {\n actionSheet.close();\n };\n return promise;\n }\n\n private closePopup(popup: AXActionSheetComponent, com: AXOverlayViewRef, result: AXComponentCloseEvent, lastActiveElement?: HTMLElement) {\n const closeFunc = e => {\n com.dispose();\n delete e.cancel;\n popup[TAB_META_KEY].close(e);\n if (lastActiveElement?.focus) {\n lastActiveElement.focus();\n }\n };\n const e = { cancel: false };\n const closingFunc = popup[TAB_META_KEY].component?.onClosing;\n if (closingFunc) {\n const res = closingFunc(e);\n if (res instanceof Promise) {\n res.then(() => {\n if (e == null \|\| e.cancel !== true) {\n closeFunc(result);\n }\n });\n } else {\n if (e == null \|\| e.cancel !== true) {\n closeFunc(result);\n }\n }\n } else {\n closeFunc(result);\n }\n }\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1","i2"],"mappings":"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"}

package/fesm2022/acorex-components-alert.mjs CHANGED Viewed

@@ -2,23 +2,22 @@ import { AXButtonComponent } from '@acorex/components/button';
 import { AXDecoratorIconComponent, AXDecoratorTitleComponent, AXDecoratorContentComponent, AXDecoratorFooterComponent, AXDecoratorModule } from '@acorex/components/decorators';
 import * as i0 from '@angular/core';
 import { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, ContentChildren, Output, HostBinding, Input, NgModule } from '@angular/core';
-import { AXClosbaleComponent } from '@acorex/components/common';
-import { _ColorLookComponentMixin, AXBaseComponent } from '@acorex/components/mixin';
+import { MXColorComponent, AXClosbaleComponent } from '@acorex/components/common';
+import { classes } from 'polytype';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-const AXBaseAlertMixin = _ColorLookComponentMixin(AXBaseComponent);
 /**
  * Regular description
  *
  * @category Components
  */
-class AXAlertComponent extends AXBaseAlertMixin {
-    _icon;
-    _buttons;
-    _title;
-    _content;
-    _footer;
+class AXAlertComponent extends classes(MXColorComponent) {
+    _iconComp;
+    _buttonComps;
+    _titleComp;
+    _contentComp;
+    _footerComp;
     _showInline = false;
     onClosed = new EventEmitter();
     _customIcon;
@@ -27,7 +26,7 @@ class AXAlertComponent extends AXBaseAlertMixin {
      *  @ignore
      */
     get __hostClass() {
-        const _class = this.look ? `ax-${this.color}-${this.look}` : `ax-${this.color}-default`;
+        const _class = `ax-${this.color}-default`;
         return `ax-alert ax-none ${_class}`;
     }
     _timeOut;
@@ -35,15 +34,20 @@ class AXAlertComponent extends AXBaseAlertMixin {
         return this._timeOut;
     }
     set timeOut(v) {
-        if (v != this._timeOut) {
-            clearTimeout(this._timeOutRef);
-            this._timeOut = v;
-            if (v) {
-                this._timeOutRef = window.setTimeout(() => {
-                    this.close();
-                }, this.timeOut);
+        this.setOption({
+            name: "timeOut",
+            value: v,
+            beforeCallback: (oldValue, newValue) => {
+                clearTimeout(this._timeOutRef);
+            },
+            afterCallback: (oldValue, newValue) => {
+                if (newValue) {
+                    this._timeOutRef = window.setTimeout(() => {
+                        this.close();
+                    }, this.timeOut);
+                }
             }
-        }
+        });
     }
     _observer;
     _visible;
@@ -56,7 +60,7 @@ class AXAlertComponent extends AXBaseAlertMixin {
     set visible(v) {
         if (this._visible != v) {
             this._visible = v;
-            const host = this._getHostElement();
+            const host = this.getHostElement();
             if (v) {
                 host.classList.remove('ax-state-hidden');
                 host.classList.add('ax-state-visible');
@@ -67,60 +71,57 @@ class AXAlertComponent extends AXBaseAlertMixin {
             }
         }
     }
-    /**
-     *  @ignore
-     */
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        //
+    ngOnInit() {
         const config = { attributes: false, childList: true, subtree: true };
         const callback = (mutationList, observer) => {
             for (const mutation of mutationList) {
                 if (mutation.type === 'childList') {
                     this._setIcon();
                     this._applyButtonStyle();
-                    this._showInline = this._content != null || this._footer != null;
-                    this._cdr.markForCheck();
+                    this._showInline = this._contentComp != null || this._footerComp != null;
+                    this.cdr.markForCheck();
                 }
             }
         };
         // Create an observer instance linked to the callback function
         this._observer = new MutationObserver(callback);
         // Start observing the target node for configured mutations
-        this._observer.observe(this._getHostElement(), config);
+        this._observer.observe(this.getHostElement(), config);
+        //
+        this.onOptionChanged.subscribe(this._handleOnOptionChanged.bind(this));
     }
-    onViewInit() {
+    ngAfterViewInit() {
         if (this.visible == undefined) {
             this.visible = true;
         }
         //
-        this._customIcon = this._icon?.icon;
-        this._showInline = this._content != null || this._footer != null;
+        this._customIcon = this._iconComp?.icon;
+        this._showInline = this._contentComp != null || this._footerComp != null;
     }
-    _onOptionChanged(option) {
+    _handleOnOptionChanged(e) {
         this._setIcon();
         this._applyButtonStyle();
     }
     _setIcon() {
-        if (!this._icon || this._icon._getInnerElement())
+        if (!this._iconComp || this._iconComp._getInnerElement())
             return;
         switch (this.color) {
             case 'success':
-                this._icon.icon = 'ax-icon ax-icon-check-circle-fill';
+                this._iconComp.icon = 'ax-icon ax-icon-check-circle-fill';
                 break;
             case 'danger':
-                this._icon.icon = 'ax-icon ax-icon-error-fill';
+                this._iconComp.icon = 'ax-icon ax-icon-error-fill';
                 break;
             case 'warning':
-                this._icon.icon = 'ax-icon ax-icon-warning-fill';
+                this._iconComp.icon = 'ax-icon ax-icon-warning-fill';
                 break;
             default:
-                this._icon.icon = this._customIcon || 'ax-icon ax-icon-check-circle-fill';
+                this._iconComp.icon = this._customIcon || 'ax-icon ax-icon-check-circle-fill';
                 break;
         }
     }
     _applyButtonStyle() {
-        this._buttons?.forEach((c) => {
+        this._buttonComps?.forEach((c) => {
             c.color = this.color;
             c.getHostElement().classList.add('ax-sm');
             c.look = !c.look || c.look == 'default' ? 'default' : 'blank';
@@ -130,7 +131,7 @@ class AXAlertComponent extends AXBaseAlertMixin {
      *  Remove the alert from the container
      */
     close() {
-        const host = this._getHostElement();
+        const host = this.getHostElement();
         this.visible = false;
         const func = () => {
             host.parentElement?.removeChild(host);
@@ -153,28 +154,29 @@ class AXAlertComponent extends AXBaseAlertMixin {
     show() {
         this.visible = true;
     }
-    onDestroy() {
+    ngOnDestroy() {
         this._observer?.disconnect();
+        this.onOptionChanged?.unsubscribe();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAlertComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: AXAlertComponent, selector: "ax-alert", inputs: { color: "color", timeOut: "timeOut", visible: "visible" }, outputs: { onClosed: "onClosed" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], queries: [{ propertyName: "_icon", first: true, predicate: AXDecoratorIconComponent, descendants: true }, { propertyName: "_title", first: true, predicate: AXDecoratorTitleComponent, descendants: true }, { propertyName: "_content", first: true, predicate: AXDecoratorContentComponent, descendants: true }, { propertyName: "_footer", first: true, predicate: AXDecoratorFooterComponent, descendants: true }, { propertyName: "_buttons", predicate: AXButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-alert-inline-start\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-icon\"></ng-content>\n</div>\n<div class=\"ax-alert-inline-middle\">\n  <div class=\"ax-alert-middle-block-start\">\n    <div class=\"ax-alert-title\">\n      <ng-content select=\"ax-title\"></ng-content>\n    </div>\n  </div>\n  <div\n    class=\"ax-alert-middle-block-end\"\n    [class.ax-hidden]=\"!_showInline\"\n    [class.ax-title-gap]=\"_title\">\n    <ng-content select=\"ax-content\"> </ng-content>\n    <ng-content select=\"ax-footer\"> </ng-content>\n  </div>\n</div>\n<div class=\"ax-alert-inline-end\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-button\"></ng-content>\n  <ng-content select=\"ax-close-button\"></ng-content>\n</div>\n<div\n  class=\"ax-alert-progress\"\n  [style.animation-duration.ms]=\"timeOut\"\n  *ngIf=\"timeOut\"></div>\n", styles: [".ax-dark ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-600));border-color:rgba(var(--ax-color-primary-600))}.ax-dark ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-button[class$=blank]{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-600));border-color:rgba(var(--ax-color-secondary-600))}.ax-dark ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-button[class$=blank]{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-600));border-color:rgba(var(--ax-color-success-600))}.ax-dark ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-button[class$=blank]{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-600));border-color:rgba(var(--ax-color-warning-600))}.ax-dark ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-600));border-color:rgba(var(--ax-color-danger-600))}.ax-dark ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-button[class$=blank]{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-600));border-color:rgba(var(--ax-color-info-600))}.ax-dark ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-button[class$=blank]{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;padding:1rem;border-radius:var(--ax-rounded-border-default);font-size:.875rem;display:flex;gap:1rem;overflow:hidden}ax-alert.ax-state-hidden{visibility:hidden;opacity:0}ax-alert.ax-state-visible{visibility:visible;opacity:1}ax-alert .ax-alert-inline-middle{display:flex;flex-direction:column;justify-content:center;flex:1 1 0%}ax-alert .ax-alert-inline-start,ax-alert .ax-alert-inline-end{display:flex}ax-alert .ax-alert-inline-start.ax-items-start,ax-alert .ax-alert-inline-end.ax-items-start{align-items:flex-start!important}ax-alert .ax-alert-inline-start{align-items:center}ax-alert .ax-alert-inline-start>ax-icon{border-radius:99rem;display:grid;place-items:center;font-size:1.25rem;line-height:1.25rem}ax-alert .ax-alert-inline-end{align-items:center}ax-alert .ax-alert-middle-block-start{display:flex;align-items:center;justify-content:center}ax-alert .ax-alert-middle-block-start .ax-alert-title{display:flex;flex-direction:column;flex:1}ax-alert .ax-alert-middle-block-start .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-middle-block-end{display:flex;flex-direction:column;gap:1rem}ax-alert .ax-alert-middle-block-end.ax-title-gap{margin-top:.5rem}ax-alert .ax-alert-middle-block-end.ax-hidden{display:none!important}ax-alert .ax-alert-middle-block-end ax-content{display:block}ax-alert .ax-alert-middle-block-end ax-footer{background-color:transparent}ax-alert .ax-alert-progress{width:0px;height:.25rem;position:absolute;inset-inline-start:0px;bottom:0;animation-duration:4s;animation-timing-function:linear;animation-name:progressBar}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-50));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-50));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-50));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-50));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-50));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-50));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AXAlertComponent, selector: "ax-alert", inputs: { color: "color", timeOut: "timeOut", visible: "visible" }, outputs: { colorChange: "colorChange", onClosed: "onClosed" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], queries: [{ propertyName: "_iconComp", first: true, predicate: AXDecoratorIconComponent, descendants: true }, { propertyName: "_titleComp", first: true, predicate: AXDecoratorTitleComponent, descendants: true }, { propertyName: "_contentComp", first: true, predicate: AXDecoratorContentComponent, descendants: true }, { propertyName: "_footerComp", first: true, predicate: AXDecoratorFooterComponent, descendants: true }, { propertyName: "_buttonComps", predicate: AXButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-alert-inline-start\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-icon\"></ng-content>\n</div>\n<div class=\"ax-alert-inline-middle\">\n  <div class=\"ax-alert-middle-block-start\">\n    <div class=\"ax-alert-title\">\n      <ng-content select=\"ax-title\"></ng-content>\n    </div>\n  </div>\n  <div class=\"ax-alert-middle-block-end\" [class.ax-hidden]=\"!_showInline\" [class.ax-title-gap]=\"_titleComp\">\n    <ng-content select=\"ax-content\"> </ng-content>\n    <ng-content select=\"ax-footer\"> </ng-content>\n  </div>\n</div>\n<div class=\"ax-alert-inline-end\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-button\"></ng-content>\n  <ng-content select=\"ax-close-button\"></ng-content>\n</div>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>", styles: [".ax-dark ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-600));border-color:rgba(var(--ax-color-primary-600))}.ax-dark ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-button[class$=blank]{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-600));border-color:rgba(var(--ax-color-secondary-600))}.ax-dark ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-button[class$=blank]{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-600));border-color:rgba(var(--ax-color-success-600))}.ax-dark ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-button[class$=blank]{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-600));border-color:rgba(var(--ax-color-warning-600))}.ax-dark ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-600));border-color:rgba(var(--ax-color-danger-600))}.ax-dark ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-button[class$=blank]{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-600));border-color:rgba(var(--ax-color-info-600))}.ax-dark ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-button[class$=blank]{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;padding:1rem;border-radius:var(--ax-rounded-border-default);font-size:.875rem;display:flex;gap:1rem;overflow:hidden}ax-alert.ax-state-hidden{visibility:hidden;opacity:0}ax-alert.ax-state-visible{visibility:visible;opacity:1}ax-alert .ax-alert-inline-middle{display:flex;flex-direction:column;justify-content:center;flex:1 1 0%}ax-alert .ax-alert-inline-start,ax-alert .ax-alert-inline-end{display:flex}ax-alert .ax-alert-inline-start.ax-items-start,ax-alert .ax-alert-inline-end.ax-items-start{align-items:flex-start!important}ax-alert .ax-alert-inline-start{align-items:center}ax-alert .ax-alert-inline-start>ax-icon{border-radius:99rem;display:grid;place-items:center;font-size:1.25rem;line-height:1.25rem}ax-alert .ax-alert-inline-end{align-items:center}ax-alert .ax-alert-middle-block-start{display:flex;align-items:center;justify-content:center}ax-alert .ax-alert-middle-block-start .ax-alert-title{display:flex;flex-direction:column;flex:1}ax-alert .ax-alert-middle-block-start .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-middle-block-end{display:flex;flex-direction:column;gap:1rem}ax-alert .ax-alert-middle-block-end.ax-title-gap{margin-top:.5rem}ax-alert .ax-alert-middle-block-end.ax-hidden{display:none!important}ax-alert .ax-alert-middle-block-end ax-content{display:block}ax-alert .ax-alert-middle-block-end ax-footer{background-color:transparent}ax-alert .ax-alert-progress{width:0px;height:.25rem;position:absolute;inset-inline-start:0px;bottom:0;animation-duration:4s;animation-timing-function:linear;animation-name:progressBar}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-50));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-50));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-50));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-50));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-50));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-50));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\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: "16.0.0", ngImport: i0, type: AXAlertComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAlertComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-alert', inputs: ['color'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], template: "<div class=\"ax-alert-inline-start\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-icon\"></ng-content>\n</div>\n<div class=\"ax-alert-inline-middle\">\n  <div class=\"ax-alert-middle-block-start\">\n    <div class=\"ax-alert-title\">\n      <ng-content select=\"ax-title\"></ng-content>\n    </div>\n  </div>\n  <div\n    class=\"ax-alert-middle-block-end\"\n    [class.ax-hidden]=\"!_showInline\"\n    [class.ax-title-gap]=\"_title\">\n    <ng-content select=\"ax-content\"> </ng-content>\n    <ng-content select=\"ax-footer\"> </ng-content>\n  </div>\n</div>\n<div class=\"ax-alert-inline-end\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-button\"></ng-content>\n  <ng-content select=\"ax-close-button\"></ng-content>\n</div>\n<div\n  class=\"ax-alert-progress\"\n  [style.animation-duration.ms]=\"timeOut\"\n  *ngIf=\"timeOut\"></div>\n", styles: [".ax-dark ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-600));border-color:rgba(var(--ax-color-primary-600))}.ax-dark ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-button[class$=blank]{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-600));border-color:rgba(var(--ax-color-secondary-600))}.ax-dark ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-button[class$=blank]{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-600));border-color:rgba(var(--ax-color-success-600))}.ax-dark ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-button[class$=blank]{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-600));border-color:rgba(var(--ax-color-warning-600))}.ax-dark ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-600));border-color:rgba(var(--ax-color-danger-600))}.ax-dark ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-button[class$=blank]{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-600));border-color:rgba(var(--ax-color-info-600))}.ax-dark ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-button[class$=blank]{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;padding:1rem;border-radius:var(--ax-rounded-border-default);font-size:.875rem;display:flex;gap:1rem;overflow:hidden}ax-alert.ax-state-hidden{visibility:hidden;opacity:0}ax-alert.ax-state-visible{visibility:visible;opacity:1}ax-alert .ax-alert-inline-middle{display:flex;flex-direction:column;justify-content:center;flex:1 1 0%}ax-alert .ax-alert-inline-start,ax-alert .ax-alert-inline-end{display:flex}ax-alert .ax-alert-inline-start.ax-items-start,ax-alert .ax-alert-inline-end.ax-items-start{align-items:flex-start!important}ax-alert .ax-alert-inline-start{align-items:center}ax-alert .ax-alert-inline-start>ax-icon{border-radius:99rem;display:grid;place-items:center;font-size:1.25rem;line-height:1.25rem}ax-alert .ax-alert-inline-end{align-items:center}ax-alert .ax-alert-middle-block-start{display:flex;align-items:center;justify-content:center}ax-alert .ax-alert-middle-block-start .ax-alert-title{display:flex;flex-direction:column;flex:1}ax-alert .ax-alert-middle-block-start .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-middle-block-end{display:flex;flex-direction:column;gap:1rem}ax-alert .ax-alert-middle-block-end.ax-title-gap{margin-top:.5rem}ax-alert .ax-alert-middle-block-end.ax-hidden{display:none!important}ax-alert .ax-alert-middle-block-end ax-content{display:block}ax-alert .ax-alert-middle-block-end ax-footer{background-color:transparent}ax-alert .ax-alert-progress{width:0px;height:.25rem;position:absolute;inset-inline-start:0px;bottom:0;animation-duration:4s;animation-timing-function:linear;animation-name:progressBar}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-50));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-50));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-50));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-50));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-50));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-50));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { _icon: [{
+            args: [{ selector: 'ax-alert', inputs: ['color'], outputs: ['colorChange'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], template: "<div class=\"ax-alert-inline-start\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-icon\"></ng-content>\n</div>\n<div class=\"ax-alert-inline-middle\">\n  <div class=\"ax-alert-middle-block-start\">\n    <div class=\"ax-alert-title\">\n      <ng-content select=\"ax-title\"></ng-content>\n    </div>\n  </div>\n  <div class=\"ax-alert-middle-block-end\" [class.ax-hidden]=\"!_showInline\" [class.ax-title-gap]=\"_titleComp\">\n    <ng-content select=\"ax-content\"> </ng-content>\n    <ng-content select=\"ax-footer\"> </ng-content>\n  </div>\n</div>\n<div class=\"ax-alert-inline-end\" [class.!ax-items-start]=\"_showInline\">\n  <ng-content select=\"ax-button\"></ng-content>\n  <ng-content select=\"ax-close-button\"></ng-content>\n</div>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>", styles: [".ax-dark ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-600));border-color:rgba(var(--ax-color-primary-600))}.ax-dark ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default ax-button[class$=blank]{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-600));border-color:rgba(var(--ax-color-secondary-600))}.ax-dark ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default ax-button[class$=blank]{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-600));border-color:rgba(var(--ax-color-success-600))}.ax-dark ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default ax-button[class$=blank]{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-600));border-color:rgba(var(--ax-color-warning-600))}.ax-dark ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-600));border-color:rgba(var(--ax-color-danger-600))}.ax-dark ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default ax-button[class$=blank]{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-600));border-color:rgba(var(--ax-color-info-600))}.ax-dark ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default ax-button[class$=blank]{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-fore))}.ax-dark ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;padding:1rem;border-radius:var(--ax-rounded-border-default);font-size:.875rem;display:flex;gap:1rem;overflow:hidden}ax-alert.ax-state-hidden{visibility:hidden;opacity:0}ax-alert.ax-state-visible{visibility:visible;opacity:1}ax-alert .ax-alert-inline-middle{display:flex;flex-direction:column;justify-content:center;flex:1 1 0%}ax-alert .ax-alert-inline-start,ax-alert .ax-alert-inline-end{display:flex}ax-alert .ax-alert-inline-start.ax-items-start,ax-alert .ax-alert-inline-end.ax-items-start{align-items:flex-start!important}ax-alert .ax-alert-inline-start{align-items:center}ax-alert .ax-alert-inline-start>ax-icon{border-radius:99rem;display:grid;place-items:center;font-size:1.25rem;line-height:1.25rem}ax-alert .ax-alert-inline-end{align-items:center}ax-alert .ax-alert-middle-block-start{display:flex;align-items:center;justify-content:center}ax-alert .ax-alert-middle-block-start .ax-alert-title{display:flex;flex-direction:column;flex:1}ax-alert .ax-alert-middle-block-start .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-middle-block-end{display:flex;flex-direction:column;gap:1rem}ax-alert .ax-alert-middle-block-end.ax-title-gap{margin-top:.5rem}ax-alert .ax-alert-middle-block-end.ax-hidden{display:none!important}ax-alert .ax-alert-middle-block-end ax-content{display:block}ax-alert .ax-alert-middle-block-end ax-footer{background-color:transparent}ax-alert .ax-alert-progress{width:0px;height:.25rem;position:absolute;inset-inline-start:0px;bottom:0;animation-duration:4s;animation-timing-function:linear;animation-name:progressBar}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-default{background-color:rgba(var(--ax-color-primary-50));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-default .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-default{background-color:rgba(var(--ax-color-secondary-50));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-default .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-default{background-color:rgba(var(--ax-color-success-50));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-default .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-default{background-color:rgba(var(--ax-color-warning-50));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-default ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-default .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-default{background-color:rgba(var(--ax-color-danger-50));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-default .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-default{background-color:rgba(var(--ax-color-info-50));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-default .ax-alert-inline-start>ax-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-default .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"] }]
+        }], propDecorators: { _iconComp: [{
                 type: ContentChild,
                 args: [AXDecoratorIconComponent]
-            }], _buttons: [{
+            }], _buttonComps: [{
                 type: ContentChildren,
                 args: [AXButtonComponent, { descendants: true }]
-            }], _title: [{
+            }], _titleComp: [{
                 type: ContentChild,
                 args: [AXDecoratorTitleComponent]
-            }], _content: [{
+            }], _contentComp: [{
                 type: ContentChild,
                 args: [AXDecoratorContentComponent]
-            }], _footer: [{
+            }], _footerComp: [{
                 type: ContentChild,
                 args: [AXDecoratorFooterComponent]
             }], onClosed: [{
@@ -191,11 +193,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
 const COMPONENT = [AXAlertComponent];
 const MODULES = [CommonModule, AXDecoratorModule];
 class AXAlertModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.0", ngImport: i0, type: AXAlertModule, declarations: [AXAlertComponent], imports: [CommonModule, AXDecoratorModule], exports: [AXAlertComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAlertModule, imports: [MODULES] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: AXAlertModule, declarations: [AXAlertComponent], imports: [CommonModule, AXDecoratorModule], exports: [AXAlertComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAlertModule, imports: [MODULES] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: AXAlertModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AXAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],
@@ -209,5 +211,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
  * Generated bundle index. Do not edit.
  */
-export { AXAlertComponent, AXAlertModule, AXBaseAlertMixin };
+export { AXAlertComponent, AXAlertModule };
 //# sourceMappingURL=acorex-components-alert.mjs.map