@acorex/components 21.0.2-next.36 → 21.0.2-next.37

package/fesm2022/acorex-components-navbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-navbar.mjs","sources":["../tmp-esm2022/navbar/lib/navbar.component.js","../tmp-esm2022/navbar/lib/navbar.module.js","../tmp-esm2022/navbar/acorex-components-navbar.js"],"sourcesContent":["import { AXComponent, MXLookComponent } from '@acorex/cdk/common';\nimport { ChangeDetectionStrategy, Component, HostBinding, ViewEncapsulation } from '@angular/core';\nimport * as i0 from \"@angular/core\";\n/**\n * @category Components\n * A navigation bar component that supports custom styling and encapsulation.\n * It provides a consistent way to display navigation elements with prefix, title, and suffix content areas.\n */\nexport class AXNavbarComponent extends MXLookComponent {\n    /**\n     * Gets the host CSS classes for the navbar component.\n     *\n     * @returns string - The CSS classes for the navbar component\n     */\n    get __hostClass() {\n        return `ax-alert ax-none ax-${this.look}`;\n    }\n    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXNavbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }\n    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: \"14.0.0\", version: \"20.3.3\", type: AXNavbarComponent, isStandalone: true, selector: \"ax-navbar\", inputs: { look: \"look\" }, host: { properties: { \"class\": \"this.__hostClass\" } }, providers: [{ provide: AXComponent, useExisting: AXNavbarComponent }], usesInheritance: true, ngImport: i0, template: \"<div class=\\\"ax-navbar-start-side\\\">\\n  <ng-content select=\\\"ax-prefix\\\"></ng-content>\\n  <ng-content select=\\\"ax-title\\\"></ng-content>\\n</div>\\n<ng-content></ng-content>\\n<div class=\\\"ax-navbar-end-side\\\">\\n  <ng-content select=\\\"ax-suffix\\\"></ng-content>\\n</div>\\n\", styles: [\"ax-navbar.ax-fill{--ax-comp-navbar-bg-color: var(--ax-sys-color-surface)}ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-navbar-border-width: 1px}.ax-dark ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-darkest-surface)}ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-lightest-surface)}.ax-dark ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-darkest-surface)}ax-navbar{display:flex;min-height:3.5rem;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:1rem;padding-block:.5rem;background-color:rgba(var(--ax-comp-navbar-bg-color, none));border-bottom-width:var(--ax-comp-navbar-border-width, 0);border-color:rgba(var(--ax-comp-navbar-border-color, none))}ax-navbar .ax-navbar-start-side{margin-inline-end:2rem;display:flex;align-items:center;gap:.5rem;font-size:1rem;line-height:1.5rem}ax-navbar .ax-navbar-start-side ax-title{font-size:1.125rem;line-height:1.75rem;font-weight:600}ax-navbar .ax-navbar-end-side ax-suffix{display:flex;gap:.5rem}\\n\"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXNavbarComponent, decorators: [{\n            type: Component,\n            args: [{ selector: 'ax-navbar', inputs: ['look'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXComponent, useExisting: AXNavbarComponent }], template: \"<div class=\\\"ax-navbar-start-side\\\">\\n  <ng-content select=\\\"ax-prefix\\\"></ng-content>\\n  <ng-content select=\\\"ax-title\\\"></ng-content>\\n</div>\\n<ng-content></ng-content>\\n<div class=\\\"ax-navbar-end-side\\\">\\n  <ng-content select=\\\"ax-suffix\\\"></ng-content>\\n</div>\\n\", styles: [\"ax-navbar.ax-fill{--ax-comp-navbar-bg-color: var(--ax-sys-color-surface)}ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-navbar-border-width: 1px}.ax-dark ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-darkest-surface)}ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-lightest-surface)}.ax-dark ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-darkest-surface)}ax-navbar{display:flex;min-height:3.5rem;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:1rem;padding-block:.5rem;background-color:rgba(var(--ax-comp-navbar-bg-color, none));border-bottom-width:var(--ax-comp-navbar-border-width, 0);border-color:rgba(var(--ax-comp-navbar-border-color, none))}ax-navbar .ax-navbar-start-side{margin-inline-end:2rem;display:flex;align-items:center;gap:.5rem;font-size:1rem;line-height:1.5rem}ax-navbar .ax-navbar-start-side ax-title{font-size:1.125rem;line-height:1.75rem;font-weight:600}ax-navbar .ax-navbar-end-side ax-suffix{display:flex;gap:.5rem}\\n\"] }]\n        }], propDecorators: { __hostClass: [{\n                type: HostBinding,\n                args: ['class']\n            }] } });\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2YmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvbmF2YmFyL3NyYy9saWIvbmF2YmFyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvbmF2YmFyL3NyYy9saWIvbmF2YmFyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxXQUFXLEVBQUUsZUFBZSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDbEUsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBRW5HOzs7O0dBSUc7QUFVSCxNQUFNLE9BQU8saUJBQWtCLFNBQVEsZUFBZTtJQUNwRDs7OztPQUlHO0lBQ0gsSUFDSSxXQUFXO1FBQ2IsT0FBTyx1QkFBdUIsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDO0lBQzVDLENBQUM7OEdBVFUsaUJBQWlCO2tHQUFqQixpQkFBaUIseUlBRmpCLENBQUMsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsRUFBRSxpQkFBaUIsRUFBRSxDQUFDLGlEQ2Z2RSw0UUFRQTs7MkZEU2EsaUJBQWlCO2tCQVQ3QixTQUFTOytCQUNFLFdBQVcsVUFHYixDQUFDLE1BQU0sQ0FBQyxtQkFDQyx1QkFBdUIsQ0FBQyxNQUFNLGlCQUNoQyxpQkFBaUIsQ0FBQyxJQUFJLGFBQzFCLENBQUMsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsbUJBQW1CLEVBQUUsQ0FBQzs4QkFTakUsV0FBVztzQkFEZCxXQUFXO3VCQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBWENvbXBvbmVudCwgTVhMb29rQ29tcG9uZW50IH0gZnJvbSAnQGFjb3JleC9jZGsvY29tbW9uJztcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIEhvc3RCaW5kaW5nLCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG4vKipcbiAqIEBjYXRlZ29yeSBDb21wb25lbnRzXG4gKiBBIG5hdmlnYXRpb24gYmFyIGNvbXBvbmVudCB0aGF0IHN1cHBvcnRzIGN1c3RvbSBzdHlsaW5nIGFuZCBlbmNhcHN1bGF0aW9uLlxuICogSXQgcHJvdmlkZXMgYSBjb25zaXN0ZW50IHdheSB0byBkaXNwbGF5IG5hdmlnYXRpb24gZWxlbWVudHMgd2l0aCBwcmVmaXgsIHRpdGxlLCBhbmQgc3VmZml4IGNvbnRlbnQgYXJlYXMuXG4gKi9cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2F4LW5hdmJhcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9uYXZiYXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9uYXZiYXIuY29tcG9uZW50LnNjc3MnXSxcbiAgaW5wdXRzOiBbJ2xvb2snXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIHByb3ZpZGVyczogW3sgcHJvdmlkZTogQVhDb21wb25lbnQsIHVzZUV4aXN0aW5nOiBBWE5hdmJhckNvbXBvbmVudCB9XSxcbn0pXG5leHBvcnQgY2xhc3MgQVhOYXZiYXJDb21wb25lbnQgZXh0ZW5kcyBNWExvb2tDb21wb25lbnQge1xuICAvKipcbiAgICogR2V0cyB0aGUgaG9zdCBDU1MgY2xhc3NlcyBmb3IgdGhlIG5hdmJhciBjb21wb25lbnQuXG4gICAqXG4gICAqIEByZXR1cm5zIHN0cmluZyAtIFRoZSBDU1MgY2xhc3NlcyBmb3IgdGhlIG5hdmJhciBjb21wb25lbnRcbiAgICovXG4gIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICBnZXQgX19ob3N0Q2xhc3MoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gYGF4LWFsZXJ0IGF4LW5vbmUgYXgtJHt0aGlzLmxvb2t9YDtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImF4LW5hdmJhci1zdGFydC1zaWRlXCI+XG4gIDxuZy1jb250ZW50IHNlbGVjdD1cImF4LXByZWZpeFwiPjwvbmctY29udGVudD5cbiAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiYXgtdGl0bGVcIj48L25nLWNvbnRlbnQ+XG48L2Rpdj5cbjxuZy1jb250ZW50PjwvbmctY29udGVudD5cbjxkaXYgY2xhc3M9XCJheC1uYXZiYXItZW5kLXNpZGVcIj5cbiAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiYXgtc3VmZml4XCI+PC9uZy1jb250ZW50PlxuPC9kaXY+XG4iXX0=","import { NgModule } from '@angular/core';\nimport { AXNavbarComponent } from './navbar.component';\nimport * as i0 from \"@angular/core\";\nexport class AXNavbarModule {\n    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXNavbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }\n    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: \"14.0.0\", version: \"20.3.3\", ngImport: i0, type: AXNavbarModule, imports: [AXNavbarComponent], exports: [AXNavbarComponent] }); }\n    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXNavbarModule }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXNavbarModule, decorators: [{\n            type: NgModule,\n            args: [{\n                    imports: [AXNavbarComponent],\n                    exports: [AXNavbarComponent],\n                }]\n        }] });\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2YmFyLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvbmF2YmFyL3NyYy9saWIvbmF2YmFyLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLG9CQUFvQixDQUFDOztBQU12RCxNQUFNLE9BQU8sY0FBYzs4R0FBZCxjQUFjOytHQUFkLGNBQWMsWUFIZixpQkFBaUIsYUFDakIsaUJBQWlCOytHQUVoQixjQUFjOzsyRkFBZCxjQUFjO2tCQUoxQixRQUFRO21CQUFDO29CQUNSLE9BQU8sRUFBRSxDQUFDLGlCQUFpQixDQUFDO29CQUM1QixPQUFPLEVBQUUsQ0FBQyxpQkFBaUIsQ0FBQztpQkFDN0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQVhOYXZiYXJDb21wb25lbnQgfSBmcm9tICcuL25hdmJhci5jb21wb25lbnQnO1xuXG5ATmdNb2R1bGUoe1xuICBpbXBvcnRzOiBbQVhOYXZiYXJDb21wb25lbnRdLFxuICBleHBvcnRzOiBbQVhOYXZiYXJDb21wb25lbnRdLFxufSlcbmV4cG9ydCBjbGFzcyBBWE5hdmJhck1vZHVsZSB7fVxuIl19","/**\n * Generated bundle index. Do not edit.\n */\nexport * from './index';\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWNvcmV4LWNvbXBvbmVudHMtbmF2YmFyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9uYXZiYXIvc3JjL2Fjb3JleC1jb21wb25lbnRzLW5hdmJhci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2luZGV4JztcbiJdfQ=="],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-navbar.mjs","sources":["../../../../packages/components/navbar/src/lib/navbar.component.ts","../../../../packages/components/navbar/src/lib/navbar.component.html","../../../../packages/components/navbar/src/lib/navbar.module.ts","../../../../packages/components/navbar/src/acorex-components-navbar.ts"],"sourcesContent":["import { AXComponent, MXLookComponent } from '@acorex/cdk/common';\nimport { ChangeDetectionStrategy, Component, HostBinding, ViewEncapsulation } from '@angular/core';\n\n/**\n * @category Components\n * A navigation bar component that supports custom styling and encapsulation.\n * It provides a consistent way to display navigation elements with prefix, title, and suffix content areas.\n */\n@Component({\n  selector: 'ax-navbar',\n  templateUrl: './navbar.component.html',\n  styleUrls: ['./navbar.component.compiled.css'],\n  inputs: ['look'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  providers: [{ provide: AXComponent, useExisting: AXNavbarComponent }],\n})\nexport class AXNavbarComponent extends MXLookComponent {\n  /**\n   * Gets the host CSS classes for the navbar component.\n   *\n   * @returns string - The CSS classes for the navbar component\n   */\n  @HostBinding('class')\n  get __hostClass(): string {\n    return `ax-alert ax-none ${this.look}`;\n  }\n}\n","<div class=\"ax-navbar-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { AXNavbarComponent } from './navbar.component';\n\n@NgModule({\n  imports: [AXNavbarComponent],\n  exports: [AXNavbarComponent],\n})\nexport class AXNavbarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAGA;;;;AAIG;AAUG,MAAO,iBAAkB,SAAQ,eAAe,CAAA;AACpD;;;;AAIG;AACH,IAAA,IACI,WAAW,GAAA;AACb,QAAA,OAAO,CAAA,iBAAA,EAAoB,IAAI,CAAC,IAAI,EAAE;IACxC;8GATW,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,SAAA,EAFjB,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,CAAC,iDCfvE,4QAQA,EAAA,MAAA,EAAA,CAAA,6hEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDSa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAT7B,SAAS;+BACE,WAAW,EAAA,MAAA,EAGb,CAAC,MAAM,CAAC,mBACC,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,SAAA,EAC1B,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAA,iBAAmB,EAAE,CAAC,EAAA,QAAA,EAAA,4QAAA,EAAA,MAAA,EAAA,CAAA,6hEAAA,CAAA,EAAA;;sBAQpE,WAAW;uBAAC,OAAO;;;MEhBT,cAAc,CAAA;8GAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;+GAAd,cAAc,EAAA,OAAA,EAAA,CAHf,iBAAiB,CAAA,EAAA,OAAA,EAAA,CACjB,iBAAiB,CAAA,EAAA,CAAA,CAAA;+GAEhB,cAAc,EAAA,CAAA,CAAA;;2FAAd,cAAc,EAAA,UAAA,EAAA,CAAA;kBAJ1B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,iBAAiB,CAAC;oBAC5B,OAAO,EAAE,CAAC,iBAAiB,CAAC;AAC7B,iBAAA;;;ACND;;AAEG;;;;"}

package/fesm2022/acorex-components-notification.mjs

@@ -35,12 +35,12 @@ class AXNotificationService {
         this.overlayService = inject(AXOverlayService);
         this.translationService = inject(AXTranslationService);
         this.defaultConfig = inject(AX_NOTIFICATION_CONFIG);
-        this.activeNotifications = signal([], ...(ngDevMode ? [{ debugName: "activeNotifications" }] : []));
-        this.reservedNotifications = signal([], ...(ngDevMode ? [{ debugName: "reservedNotifications" }] : []));
-        this.notificationCounterRef = signal(null, ...(ngDevMode ? [{ debugName: "notificationCounterRef" }] : []));
-        this.moreNotificationsColor = signal('primary', ...(ngDevMode ? [{ debugName: "moreNotificationsColor" }] : []));
-        this.moreNotificationsLocation = signal('bottom-center', ...(ngDevMode ? [{ debugName: "moreNotificationsLocation" }] : []));
-        this.reserveCounter = signal(0, ...(ngDevMode ? [{ debugName: "reserveCounter" }] : []));
+        this.activeNotifications = signal([], ...(ngDevMode ? [{ debugName: "activeNotifications" }] : /* istanbul ignore next */ []));
+        this.reservedNotifications = signal([], ...(ngDevMode ? [{ debugName: "reservedNotifications" }] : /* istanbul ignore next */ []));
+        this.notificationCounterRef = signal(null, ...(ngDevMode ? [{ debugName: "notificationCounterRef" }] : /* istanbul ignore next */ []));
+        this.moreNotificationsColor = signal('primary', ...(ngDevMode ? [{ debugName: "moreNotificationsColor" }] : /* istanbul ignore next */ []));
+        this.moreNotificationsLocation = signal('bottom-center', ...(ngDevMode ? [{ debugName: "moreNotificationsLocation" }] : /* istanbul ignore next */ []));
+        this.reserveCounter = signal(0, ...(ngDevMode ? [{ debugName: "reserveCounter" }] : /* istanbul ignore next */ []));
     }
     show(config) {
         config = { ...this.defaultConfig, ...config };
@@ -92,7 +92,7 @@ class AXNotificationService {
                 onClose: closeNotification,
             },
             centered: false,
-            panelClass: ['ax-animate-animated', 'ax-animate-fadeIn', 'ax-animate-faster'],
+            panelClass: ['animate-animated', 'animate-fadeIn', 'animate-faster'],
             onDispose: () => {
                 // Clean up when disposed externally
                 const currentNotifications = this.activeNotifications();
@@ -192,7 +192,7 @@ class AXNotificationService {
                 },
             },
             centered: false,
-            panelClass: ['ax-animate-animated', 'ax-animate-fadeIn', 'ax-animate-faster'],
+            panelClass: ['animate-animated', 'animate-fadeIn', 'animate-faster'],
         });
         const counterInternalRef = {
             id: notificationId,
@@ -324,10 +324,10 @@ class AXNotificationService {
         }
         return element.offsetTop + element.offsetHeight;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -343,28 +343,28 @@ class AXNotificationComponent extends MXBaseComponent {
     constructor() {
         super(...arguments);
         /** Notification configuration data */
-        this.config = input.required(...(ngDevMode ? [{ debugName: "config" }] : []));
+        this.config = input.required(...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
         /** @internal Callback function to close the notification */
-        this.onClose = input(...(ngDevMode ? [undefined, { debugName: "onClose" }] : []));
+        this.onClose = input(...(ngDevMode ? [undefined, { debugName: "onClose" }] : /* istanbul ignore next */ []));
         this.notificationService = inject(AXNotificationService);
-        this.isPaused = signal(false, ...(ngDevMode ? [{ debugName: "isPaused" }] : []));
-        this.remainingTime = signal(0, ...(ngDevMode ? [{ debugName: "remainingTime" }] : []));
-        this.transitionDuration = signal(150, ...(ngDevMode ? [{ debugName: "transitionDuration" }] : []));
+        this.isPaused = signal(false, ...(ngDevMode ? [{ debugName: "isPaused" }] : /* istanbul ignore next */ []));
+        this.remainingTime = signal(0, ...(ngDevMode ? [{ debugName: "remainingTime" }] : /* istanbul ignore next */ []));
+        this.transitionDuration = signal(150, ...(ngDevMode ? [{ debugName: "transitionDuration" }] : /* istanbul ignore next */ []));
         /** Template content if config.content is a TemplateRef */
         this.templateContent = computed(() => {
             const content = this.config().content;
             return content instanceof TemplateRef ? content : null;
-        }, ...(ngDevMode ? [{ debugName: "templateContent" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "templateContent" }] : /* istanbul ignore next */ []));
         /** Component content if config.content is a component Type */
         this.componentContent = computed(() => {
             const content = this.config().content;
             return typeof content === 'function' ? content : null;
-        }, ...(ngDevMode ? [{ debugName: "componentContent" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "componentContent" }] : /* istanbul ignore next */ []));
         /** String content if config.content is a string */
         this.stringContent = computed(() => {
             const content = this.config().content;
             return typeof content === 'string' ? content : '';
-        }, ...(ngDevMode ? [{ debugName: "stringContent" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "stringContent" }] : /* istanbul ignore next */ []));
     }
     ngOnInit() {
         super.ngOnInit();
@@ -447,13 +447,13 @@ class AXNotificationComponent extends MXBaseComponent {
     closeAll() {
         this.notificationService.hideAll();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXNotificationComponent, isStandalone: true, selector: "ax-notification", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, onClose: { classPropertyName: "onClose", publicName: "onClose", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "\"ax-\" + config().color" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXNotificationComponent, isStandalone: true, selector: "ax-notification", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, onClose: { classPropertyName: "onClose", publicName: "onClose", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "\"ax-\" + config().color" } }, providers: [
             { provide: AXClosableComponent, useExisting: AXNotificationComponent },
             { provide: AXComponent, useExisting: AXNotificationComponent },
-        ], usesInheritance: true, ngImport: i0, template: "<span class=\"ax-notification-icon ax-icon-solid {{ _icon }}\"></span>\n<div class=\"ax-notification-content\">\n  <div class=\"ax-notification-title\">{{ config().title | translate | async }}</div>\n  @if (templateContent()) {\n    <ng-container *ngTemplateOutlet=\"templateContent()\"></ng-container>\n  } @else if (componentContent()) {\n    <ng-container *ngComponentOutlet=\"componentContent()\"></ng-container>\n  } @else {\n    <div>{{ stringContent() | translate | async }}</div>\n  }\n\n  @if (config().buttons?.length) {\n    <div class=\"ax-notification-buttons\">\n      @for (button of config().buttons; track $index) {\n        <ax-button\n          class=\"ax-xs\"\n          [text]=\"button.text | translate | async\"\n          [color]=\"button.color\"\n          [look]=\"button.look\"\n          [disabled]=\"button.disabled\"\n          (onClick)=\"_handleButtonClick(button)\"\n        >\n          @if (button.loading) {\n            <ax-loading></ax-loading>\n          }\n        </ax-button>\n      }\n    </div>\n  }\n</div>\n@if (config().closeButton) {\n  <ax-close-button></ax-close-button>\n}\n@if (config().timeOutProgress && config().timeOut && remainingTime()) {\n  <div\n    class=\"ax-notification-progress\"\n    [style.transition-duration]=\"transitionDuration()\"\n    [style.width]=\"(remainingTime() * 100) / config().timeOut + '%'\"\n  ></div>\n}\n", styles: ["ax-notification.ax-default{--ax-comp-notification-icon-text-color: var(--ax-sys-color-on-lightest-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-surface)}.ax-dark ax-notification.ax-default{--ax-comp-notification-icon-text-color: var(--ax-sys-color-on-darkest-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-lightest-surface)}ax-notification.ax-primary{--ax-comp-notification-icon-text-color: var(--ax-sys-color-primary-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-primary-surface)}ax-notification.ax-secondary{--ax-comp-notification-icon-text-color: var(--ax-sys-color-secondary-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-secondary-surface)}ax-notification.ax-success{--ax-comp-notification-icon-text-color: var(--ax-sys-color-success-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-success-surface)}ax-notification.ax-warning{--ax-comp-notification-icon-text-color: var(--ax-sys-color-warning-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-warning-surface)}ax-notification.ax-danger{--ax-comp-notification-icon-text-color: var(--ax-sys-color-danger-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-danger-surface)}ax-notification.ax-accent1{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent1-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent1-surface)}ax-notification.ax-accent2{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent2-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent2-surface)}ax-notification.ax-accent3{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent3-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent3-surface)}ax-notification.ax-accent4{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent4-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent4-surface)}ax-notification.ax-accent5{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent5-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent5-surface)}ax-notification.ax-accent6{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent6-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent6-surface)}ax-notification.ax-accent7{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent7-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent7-surface)}ax-notification{position:relative;display:flex;width:98vw;overflow:hidden;padding:1rem;--ax-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color), 0 4px 6px -4px var(--ax-shadow-color);box-shadow:var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-shadow);background-color:rgba(var(--ax-comp-notification-bg-color, var(--ax-sys-color-lightest-surface)));font-size:var(--ax-comp-notification-font-size, .875rem);line-height:var(--ax-comp-notification-line-height, 1.25rem);border-width:var(--ax-comp-notification-border-width, 1px);border-color:rgba(var(--ax-comp-notification-border-color, var(--ax-sys-color-border-lightest-surface)));border-radius:var(--ax-comp-notification-border-radius, var(--ax-sys-border-radius))}@media (min-width: 768px){ax-notification{width:24rem}}ax-notification .ax-notification-icon,ax-notification .ax-icon-close{font-size:1.25rem;line-height:1.75rem;max-width:fit-content;align-items:flex-start}ax-notification .ax-notification-icon{color:rgba(var(--ax-comp-notification-icon-text-color));padding-inline-end:.75rem}ax-notification .ax-notification-content{display:flex;flex:1 1 0%;flex-direction:column;font-weight:400;justify-content:center;color:rgba(var(--ax-comp-notification-text-color, var(--ax-sys-color-on-surface)))}ax-notification .ax-notification-content .ax-notification-title{font-weight:500;line-height:1.5}ax-notification .ax-notification-content .ax-notification-buttons{margin-top:.75rem;display:flex;gap:.75rem}ax-notification .ax-notification-progress{width:100%;bottom:0;height:.25rem;position:absolute;inset-inline-end:0px;inset-inline-start:0px;transition-property:width;transition-timing-function:linear;transition-duration:var(--ax-sys-transition-duration);background-color:rgba(var(--ax-comp-notification-progress-bg-color, 255, 255, 255, .46))}.ax-dark ax-notification{--ax-comp-notification-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-notification-border-color: var(--ax-sys-color-border-darkest-surface)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<span class=\"ax-notification-icon ax-icon-solid {{ _icon }} ax-{{ this.config().color }}\"></span>\n<div class=\"ax-notification-content\">\n  <div class=\"ax-notification-title\">{{ config().title | translate | async }}</div>\n  @if (templateContent()) {\n    <ng-container *ngTemplateOutlet=\"templateContent()\"></ng-container>\n  } @else if (componentContent()) {\n    <ng-container *ngComponentOutlet=\"componentContent()\"></ng-container>\n  } @else {\n    <div>{{ stringContent() | translate | async }}</div>\n  }\n\n  @if (config().buttons?.length) {\n    <div class=\"ax-notification-buttons\">\n      @for (button of config().buttons; track $index) {\n        <ax-button\n          class=\"ax-xs\"\n          [text]=\"button.text | translate | async\"\n          [color]=\"'ax-' + button.color\"\n          [look]=\"'ax-' + button.look\"\n          [disabled]=\"button.disabled\"\n          (onClick)=\"_handleButtonClick(button)\"\n        >\n          @if (button.loading) {\n            <ax-loading></ax-loading>\n          }\n        </ax-button>\n      }\n    </div>\n  }\n</div>\n@if (config().closeButton) {\n  <ax-close-button></ax-close-button>\n}\n@if (config().timeOutProgress && config().timeOut && remainingTime()) {\n  <div\n    [class]=\"'ax-notification-progress ax-' + this.config().color\"\n    [style.transition-duration]=\"transitionDuration()\"\n    [style.width]=\"(remainingTime() * 100) / config().timeOut + '%'\"\n  ></div>\n}\n", styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-font-weight:initial;--tw-leading:initial;--tw-duration:initial;--tw-ease:initial}}}@layer components{ax-notification{border-radius:var(--radius-lg,.5rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));width:98vw;padding:calc(var(--spacing,.25rem) * 4);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);display:flex;position:relative;overflow:hidden}ax-notification:where(.ax-dark,.ax-dark *){background-color:rgba(var(--ax-sys-color-darkest-surface))}@media(min-width:768px){ax-notification{width:calc(var(--spacing,.25rem) * 96)}}ax-notification .ax-notification-icon{color:var(--ax-comp-bg);padding-inline-end:calc(var(--spacing,.25rem) * 3)}ax-notification .ax-notification-content{--tw-font-weight:var(--font-weight-normal,400);font-weight:var(--font-weight-normal,400);color:rgba(var(--ax-sys-color-on-surface));flex-direction:column;flex:1;justify-content:center;display:flex}ax-notification .ax-notification-content .ax-notification-title{--tw-leading:calc(var(--spacing,.25rem) * 5);line-height:calc(var(--spacing,.25rem) * 5);--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500)}ax-notification .ax-notification-content .ax-notification-buttons{margin-top:calc(var(--spacing,.25rem) * 3);gap:calc(var(--spacing,.25rem) * 3);display:flex}ax-notification .ax-notification-progress{height:var(--spacing,.25rem);background-color:var(--ax-comp-bg);width:100%;transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));--tw-duration:.3s;--tw-ease:linear;inset-inline-start:calc(var(--spacing,.25rem) * 0);inset-inline-end:calc(var(--spacing,.25rem) * 0);transition-duration:.3s;transition-timing-function:linear;position:absolute;bottom:0}ax-notification .ax-notification-icon,ax-notification .ax-icon-close{max-width:fit-content;font-size:var(--text-xl,1.25rem)!important;line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75 / 1.25)))!important;align-items:flex-start!important}}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-leading{syntax:\"*\";inherits:false}@property --tw-duration{syntax:\"*\";inherits:false}@property --tw-ease{syntax:\"*\";inherits:false}\n/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-notification', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         '[class]': '"ax-" + config().color',
@@ -468,15 +468,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
                         AXDecoratorCloseButtonComponent,
                         AsyncPipe,
                         AXTranslatorPipe,
-                    ], template: "<span class=\"ax-notification-icon ax-icon-solid {{ _icon }}\"></span>\n<div class=\"ax-notification-content\">\n  <div class=\"ax-notification-title\">{{ config().title | translate | async }}</div>\n  @if (templateContent()) {\n    <ng-container *ngTemplateOutlet=\"templateContent()\"></ng-container>\n  } @else if (componentContent()) {\n    <ng-container *ngComponentOutlet=\"componentContent()\"></ng-container>\n  } @else {\n    <div>{{ stringContent() | translate | async }}</div>\n  }\n\n  @if (config().buttons?.length) {\n    <div class=\"ax-notification-buttons\">\n      @for (button of config().buttons; track $index) {\n        <ax-button\n          class=\"ax-xs\"\n          [text]=\"button.text | translate | async\"\n          [color]=\"button.color\"\n          [look]=\"button.look\"\n          [disabled]=\"button.disabled\"\n          (onClick)=\"_handleButtonClick(button)\"\n        >\n          @if (button.loading) {\n            <ax-loading></ax-loading>\n          }\n        </ax-button>\n      }\n    </div>\n  }\n</div>\n@if (config().closeButton) {\n  <ax-close-button></ax-close-button>\n}\n@if (config().timeOutProgress && config().timeOut && remainingTime()) {\n  <div\n    class=\"ax-notification-progress\"\n    [style.transition-duration]=\"transitionDuration()\"\n    [style.width]=\"(remainingTime() * 100) / config().timeOut + '%'\"\n  ></div>\n}\n", styles: ["ax-notification.ax-default{--ax-comp-notification-icon-text-color: var(--ax-sys-color-on-lightest-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-surface)}.ax-dark ax-notification.ax-default{--ax-comp-notification-icon-text-color: var(--ax-sys-color-on-darkest-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-lightest-surface)}ax-notification.ax-primary{--ax-comp-notification-icon-text-color: var(--ax-sys-color-primary-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-primary-surface)}ax-notification.ax-secondary{--ax-comp-notification-icon-text-color: var(--ax-sys-color-secondary-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-secondary-surface)}ax-notification.ax-success{--ax-comp-notification-icon-text-color: var(--ax-sys-color-success-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-success-surface)}ax-notification.ax-warning{--ax-comp-notification-icon-text-color: var(--ax-sys-color-warning-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-warning-surface)}ax-notification.ax-danger{--ax-comp-notification-icon-text-color: var(--ax-sys-color-danger-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-danger-surface)}ax-notification.ax-accent1{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent1-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent1-surface)}ax-notification.ax-accent2{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent2-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent2-surface)}ax-notification.ax-accent3{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent3-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent3-surface)}ax-notification.ax-accent4{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent4-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent4-surface)}ax-notification.ax-accent5{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent5-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent5-surface)}ax-notification.ax-accent6{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent6-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent6-surface)}ax-notification.ax-accent7{--ax-comp-notification-icon-text-color: var(--ax-sys-color-accent7-surface);--ax-comp-notification-progress-bg-color: var(--ax-sys-color-accent7-surface)}ax-notification{position:relative;display:flex;width:98vw;overflow:hidden;padding:1rem;--ax-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color), 0 4px 6px -4px var(--ax-shadow-color);box-shadow:var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-shadow);background-color:rgba(var(--ax-comp-notification-bg-color, var(--ax-sys-color-lightest-surface)));font-size:var(--ax-comp-notification-font-size, .875rem);line-height:var(--ax-comp-notification-line-height, 1.25rem);border-width:var(--ax-comp-notification-border-width, 1px);border-color:rgba(var(--ax-comp-notification-border-color, var(--ax-sys-color-border-lightest-surface)));border-radius:var(--ax-comp-notification-border-radius, var(--ax-sys-border-radius))}@media (min-width: 768px){ax-notification{width:24rem}}ax-notification .ax-notification-icon,ax-notification .ax-icon-close{font-size:1.25rem;line-height:1.75rem;max-width:fit-content;align-items:flex-start}ax-notification .ax-notification-icon{color:rgba(var(--ax-comp-notification-icon-text-color));padding-inline-end:.75rem}ax-notification .ax-notification-content{display:flex;flex:1 1 0%;flex-direction:column;font-weight:400;justify-content:center;color:rgba(var(--ax-comp-notification-text-color, var(--ax-sys-color-on-surface)))}ax-notification .ax-notification-content .ax-notification-title{font-weight:500;line-height:1.5}ax-notification .ax-notification-content .ax-notification-buttons{margin-top:.75rem;display:flex;gap:.75rem}ax-notification .ax-notification-progress{width:100%;bottom:0;height:.25rem;position:absolute;inset-inline-end:0px;inset-inline-start:0px;transition-property:width;transition-timing-function:linear;transition-duration:var(--ax-sys-transition-duration);background-color:rgba(var(--ax-comp-notification-progress-bg-color, 255, 255, 255, .46))}.ax-dark ax-notification{--ax-comp-notification-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-notification-border-color: var(--ax-sys-color-border-darkest-surface)}\n"] }]
-        }] });
+                    ], template: "<span class=\"ax-notification-icon ax-icon-solid {{ _icon }} ax-{{ this.config().color }}\"></span>\n<div class=\"ax-notification-content\">\n  <div class=\"ax-notification-title\">{{ config().title | translate | async }}</div>\n  @if (templateContent()) {\n    <ng-container *ngTemplateOutlet=\"templateContent()\"></ng-container>\n  } @else if (componentContent()) {\n    <ng-container *ngComponentOutlet=\"componentContent()\"></ng-container>\n  } @else {\n    <div>{{ stringContent() | translate | async }}</div>\n  }\n\n  @if (config().buttons?.length) {\n    <div class=\"ax-notification-buttons\">\n      @for (button of config().buttons; track $index) {\n        <ax-button\n          class=\"ax-xs\"\n          [text]=\"button.text | translate | async\"\n          [color]=\"'ax-' + button.color\"\n          [look]=\"'ax-' + button.look\"\n          [disabled]=\"button.disabled\"\n          (onClick)=\"_handleButtonClick(button)\"\n        >\n          @if (button.loading) {\n            <ax-loading></ax-loading>\n          }\n        </ax-button>\n      }\n    </div>\n  }\n</div>\n@if (config().closeButton) {\n  <ax-close-button></ax-close-button>\n}\n@if (config().timeOutProgress && config().timeOut && remainingTime()) {\n  <div\n    [class]=\"'ax-notification-progress ax-' + this.config().color\"\n    [style.transition-duration]=\"transitionDuration()\"\n    [style.width]=\"(remainingTime() * 100) / config().timeOut + '%'\"\n  ></div>\n}\n", styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-font-weight:initial;--tw-leading:initial;--tw-duration:initial;--tw-ease:initial}}}@layer components{ax-notification{border-radius:var(--radius-lg,.5rem);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));width:98vw;padding:calc(var(--spacing,.25rem) * 4);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);display:flex;position:relative;overflow:hidden}ax-notification:where(.ax-dark,.ax-dark *){background-color:rgba(var(--ax-sys-color-darkest-surface))}@media(min-width:768px){ax-notification{width:calc(var(--spacing,.25rem) * 96)}}ax-notification .ax-notification-icon{color:var(--ax-comp-bg);padding-inline-end:calc(var(--spacing,.25rem) * 3)}ax-notification .ax-notification-content{--tw-font-weight:var(--font-weight-normal,400);font-weight:var(--font-weight-normal,400);color:rgba(var(--ax-sys-color-on-surface));flex-direction:column;flex:1;justify-content:center;display:flex}ax-notification .ax-notification-content .ax-notification-title{--tw-leading:calc(var(--spacing,.25rem) * 5);line-height:calc(var(--spacing,.25rem) * 5);--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500)}ax-notification .ax-notification-content .ax-notification-buttons{margin-top:calc(var(--spacing,.25rem) * 3);gap:calc(var(--spacing,.25rem) * 3);display:flex}ax-notification .ax-notification-progress{height:var(--spacing,.25rem);background-color:var(--ax-comp-bg);width:100%;transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));--tw-duration:.3s;--tw-ease:linear;inset-inline-start:calc(var(--spacing,.25rem) * 0);inset-inline-end:calc(var(--spacing,.25rem) * 0);transition-duration:.3s;transition-timing-function:linear;position:absolute;bottom:0}ax-notification .ax-notification-icon,ax-notification .ax-icon-close{max-width:fit-content;font-size:var(--text-xl,1.25rem)!important;line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75 / 1.25)))!important;align-items:flex-start!important}}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-leading{syntax:\"*\";inherits:false}@property --tw-duration{syntax:\"*\";inherits:false}@property --tw-ease{syntax:\"*\";inherits:false}\n/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */\n"] }]
+        }], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], onClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "onClose", required: false }] }] } });
 
 class AXNotificationModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationModule, imports: [AXNotificationComponent], exports: [AXNotificationComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationModule, imports: [AXNotificationComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationModule, imports: [AXNotificationComponent], exports: [AXNotificationComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationModule, imports: [AXNotificationComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNotificationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXNotificationModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [AXNotificationComponent],