@acorex/components 7.11.3 → 7.11.5

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 (43) hide show
  1. package/esm2022/action-sheet/lib/action-sheet.component.mjs +2 -2
  2. package/esm2022/alert/lib/alert.component.mjs +2 -2
  3. package/esm2022/button/lib/button.component.mjs +2 -2
  4. package/esm2022/chips/lib/chips.component.mjs +2 -2
  5. package/esm2022/collapse/lib/collapse.component.mjs +3 -3
  6. package/esm2022/list/lib/list.component.mjs +2 -2
  7. package/esm2022/loading/lib/loading.component.mjs +2 -2
  8. package/esm2022/menu/lib/class/root-menu.class.mjs +1 -1
  9. package/esm2022/menu/lib/menu-item/menu-item.component.mjs +10 -5
  10. package/esm2022/menu/lib/menu.component.mjs +47 -13
  11. package/esm2022/menu/lib/menu.module.mjs +14 -3
  12. package/esm2022/scheduler/lib/scheduler.component.mjs +2 -2
  13. package/esm2022/select-box/lib/select-box.component.mjs +2 -2
  14. package/esm2022/tabs/lib/tabs.component.mjs +4 -4
  15. package/esm2022/toast/lib/toast.service.mjs +3 -2
  16. package/fesm2022/acorex-components-action-sheet.mjs +2 -2
  17. package/fesm2022/acorex-components-action-sheet.mjs.map +1 -1
  18. package/fesm2022/acorex-components-alert.mjs +2 -2
  19. package/fesm2022/acorex-components-alert.mjs.map +1 -1
  20. package/fesm2022/acorex-components-button.mjs +2 -2
  21. package/fesm2022/acorex-components-button.mjs.map +1 -1
  22. package/fesm2022/acorex-components-chips.mjs +2 -2
  23. package/fesm2022/acorex-components-chips.mjs.map +1 -1
  24. package/fesm2022/acorex-components-collapse.mjs +2 -2
  25. package/fesm2022/acorex-components-collapse.mjs.map +1 -1
  26. package/fesm2022/acorex-components-list.mjs +2 -2
  27. package/fesm2022/acorex-components-list.mjs.map +1 -1
  28. package/fesm2022/acorex-components-loading.mjs +2 -2
  29. package/fesm2022/acorex-components-loading.mjs.map +1 -1
  30. package/fesm2022/acorex-components-menu.mjs +66 -17
  31. package/fesm2022/acorex-components-menu.mjs.map +1 -1
  32. package/fesm2022/acorex-components-scheduler.mjs +2 -2
  33. package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
  34. package/fesm2022/acorex-components-select-box.mjs +2 -2
  35. package/fesm2022/acorex-components-select-box.mjs.map +1 -1
  36. package/fesm2022/acorex-components-tabs.mjs +3 -3
  37. package/fesm2022/acorex-components-tabs.mjs.map +1 -1
  38. package/fesm2022/acorex-components-toast.mjs +2 -1
  39. package/fesm2022/acorex-components-toast.mjs.map +1 -1
  40. package/menu/lib/class/root-menu.class.d.ts +1 -1
  41. package/menu/lib/menu-item/menu-item.component.d.ts +4 -3
  42. package/menu/lib/menu.component.d.ts +12 -5
  43. package/package.json +1 -1
@@ -71,7 +71,7 @@ export class AXActionSheetComponent extends MXBaseComponent {
71
71
  provide: AXFocusableComponent,
72
72
  useExisting: AXActionSheetComponent,
73
73
  },
74
- ], usesInheritance: true, ngImport: i0, template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\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 data.items\">\n <div\n class=\"ax-action-sheet-item ax-{{ item.color }}\"\n [class.ax-state-disabled]=\"item.disabled\"\n tabindex=\"0\"\n (click)=\"onItemClick(item)\"\n >\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: ["ax-action-sheet{display:block}@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:1rem;font-size:1.125rem;font-weight:500;border-bottom:1px solid;border-color:rgba(var(--ax-color-border-default))}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}@media (max-width: 599px){ax-action-sheet ax-header{font-size:1rem}}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: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
74
+ ], usesInheritance: true, ngImport: i0, template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\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 data.items\">\n <div\n class=\"ax-action-sheet-item ax-{{ item.color }}\"\n [class.ax-state-disabled]=\"item.disabled\"\n tabindex=\"0\"\n (click)=\"onItemClick(item)\"\n >\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: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:1rem;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{--tw-bg-opacity: 1;background-color:rgb(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}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: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
75
75
  }
76
76
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXActionSheetComponent, decorators: [{
77
77
  type: Component,
@@ -84,7 +84,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
84
84
  provide: AXFocusableComponent,
85
85
  useExisting: AXActionSheetComponent,
86
86
  },
87
- ], template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\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 data.items\">\n <div\n class=\"ax-action-sheet-item ax-{{ item.color }}\"\n [class.ax-state-disabled]=\"item.disabled\"\n tabindex=\"0\"\n (click)=\"onItemClick(item)\"\n >\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: ["ax-action-sheet{display:block}@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:1rem;font-size:1.125rem;font-weight:500;border-bottom:1px solid;border-color:rgba(var(--ax-color-border-default))}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}@media (max-width: 599px){ax-action-sheet ax-header{font-size:1rem}}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"] }]
87
+ ], template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\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 data.items\">\n <div\n class=\"ax-action-sheet-item ax-{{ item.color }}\"\n [class.ax-state-disabled]=\"item.disabled\"\n tabindex=\"0\"\n (click)=\"onItemClick(item)\"\n >\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: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:1rem;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{--tw-bg-opacity: 1;background-color:rgb(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}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"] }]
88
88
  }], ctorParameters: function () { return [{ type: undefined, decorators: [{
89
89
  type: Inject,
90
90
  args: [DIALOG_DATA]
@@ -157,11 +157,11 @@ export class AXAlertComponent extends MXColorComponent {
157
157
  this.onOptionChanged?.unsubscribe();
158
158
  }
159
159
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
160
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", 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: ["ax-icon"], descendants: true }, { propertyName: "_titleComp", first: true, predicate: ["ax-title"], descendants: true }, { propertyName: "_contentComp", first: true, predicate: ["ax-content"], descendants: true }, { propertyName: "_footerComp", first: true, predicate: ["ax-footer"], descendants: true }, { propertyName: "_buttonComps", predicate: AXButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"_showInline; else elseTpl\">\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #elseTpl>\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n</ng-template>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-500))}.ax-dark ax-alert.ax-primary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-900),.25);border-color:rgba(var(--ax-color-secondary-500))}.ax-dark ax-alert.ax-secondary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-900),.25);border-color:rgba(var(--ax-color-success-500))}.ax-dark ax-alert.ax-success-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-900),.25);border-color:rgba(var(--ax-color-warning-500))}.ax-dark ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-900),.25);border-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-alert.ax-danger-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-900),.25);border-color:rgba(var(--ax-color-info-500))}.ax-dark ax-alert.ax-info-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;padding:1rem;border-radius:var(--ax-rounded-border-default);border:1px solid;border-color:rgba(var(--ax-color-border-default));font-size:.875rem;display:flex;gap:1rem;overflow:hidden}ax-alert .ax-alert-inline{display:flex;align-items:center;align-content:center;flex:1}ax-alert .ax-alert-block{display:flex}ax-alert .ax-alert-block .ax-alert-content{display:flex;flex-direction:column}ax-alert .ax-alert-block .ax-alert-content ax-footer{margin-top:1rem}ax-alert .ax-alert-icon{border-radius:99rem;display:grid;font-size:1.25rem;line-height:1.25rem;padding-inline-end:.5rem}ax-alert .ax-alert-buttons{padding-inline-start:1rem}ax-alert .ax-alert-title{display:flex;flex-direction:column;flex:1}ax-alert .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}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-solid{background-color:rgba(var(--ax-color-primary-100));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-100));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid .ax-alert-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-100));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-100));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-100));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-100));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid .ax-alert-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
160
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", 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: ["ax-icon"], descendants: true }, { propertyName: "_titleComp", first: true, predicate: ["ax-title"], descendants: true }, { propertyName: "_contentComp", first: true, predicate: ["ax-content"], descendants: true }, { propertyName: "_footerComp", first: true, predicate: ["ax-footer"], descendants: true }, { propertyName: "_buttonComps", predicate: AXButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"_showInline; else elseTpl\">\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #elseTpl>\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n</ng-template>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-500))}.ax-dark ax-alert.ax-primary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-900),.25);border-color:rgba(var(--ax-color-secondary-500))}.ax-dark ax-alert.ax-secondary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-900),.25);border-color:rgba(var(--ax-color-success-500))}.ax-dark ax-alert.ax-success-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-900),.25);border-color:rgba(var(--ax-color-warning-500))}.ax-dark ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-900),.25);border-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-alert.ax-danger-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-900),.25);border-color:rgba(var(--ax-color-info-500))}.ax-dark ax-alert.ax-info-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;display:flex;gap:1rem;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));padding:1rem;font-size:.875rem;line-height:1.25rem}ax-alert .ax-alert-inline{display:flex;flex:1 1 0%;align-items:center;justify-content:center}ax-alert .ax-alert-block{display:flex}ax-alert .ax-alert-block .ax-alert-content{display:flex;flex-direction:column}ax-alert .ax-alert-block .ax-alert-content ax-footer{margin-top:1rem}ax-alert .ax-alert-icon{display:grid;border-radius:9999px;padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-alert .ax-alert-buttons{padding-inline-start:1rem}ax-alert .ax-alert-title{display:flex;flex:1 1 0%;flex-direction:column}ax-alert .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-progress{position:absolute;bottom:0;inset-inline-start:0px;height:.25rem}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-100));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-100));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid .ax-alert-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-100));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-100));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-100));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-100));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid .ax-alert-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
161
161
  }
162
162
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXAlertComponent, decorators: [{
163
163
  type: Component,
164
- args: [{ selector: 'ax-alert', inputs: ['color'], outputs: ['colorChange'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], template: "<ng-container *ngIf=\"_showInline; else elseTpl\">\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #elseTpl>\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n</ng-template>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-500))}.ax-dark ax-alert.ax-primary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-900),.25);border-color:rgba(var(--ax-color-secondary-500))}.ax-dark ax-alert.ax-secondary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-900),.25);border-color:rgba(var(--ax-color-success-500))}.ax-dark ax-alert.ax-success-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-900),.25);border-color:rgba(var(--ax-color-warning-500))}.ax-dark ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-900),.25);border-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-alert.ax-danger-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-900),.25);border-color:rgba(var(--ax-color-info-500))}.ax-dark ax-alert.ax-info-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;padding:1rem;border-radius:var(--ax-rounded-border-default);border:1px solid;border-color:rgba(var(--ax-color-border-default));font-size:.875rem;display:flex;gap:1rem;overflow:hidden}ax-alert .ax-alert-inline{display:flex;align-items:center;align-content:center;flex:1}ax-alert .ax-alert-block{display:flex}ax-alert .ax-alert-block .ax-alert-content{display:flex;flex-direction:column}ax-alert .ax-alert-block .ax-alert-content ax-footer{margin-top:1rem}ax-alert .ax-alert-icon{border-radius:99rem;display:grid;font-size:1.25rem;line-height:1.25rem;padding-inline-end:.5rem}ax-alert .ax-alert-buttons{padding-inline-start:1rem}ax-alert .ax-alert-title{display:flex;flex-direction:column;flex:1}ax-alert .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}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-solid{background-color:rgba(var(--ax-color-primary-100));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-100));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid .ax-alert-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-100));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-100));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-100));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-100));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid .ax-alert-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"] }]
164
+ args: [{ selector: 'ax-alert', inputs: ['color'], outputs: ['colorChange'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], template: "<ng-container *ngIf=\"_showInline; else elseTpl\">\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #elseTpl>\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n</ng-template>\n<div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut\" *ngIf=\"timeOut\"></div>\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-500))}.ax-dark ax-alert.ax-primary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-900),.25);border-color:rgba(var(--ax-color-secondary-500))}.ax-dark ax-alert.ax-secondary-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-fore))}.ax-dark ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-900),.25);border-color:rgba(var(--ax-color-success-500))}.ax-dark ax-alert.ax-success-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-900),.25);border-color:rgba(var(--ax-color-warning-500))}.ax-dark ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-900),.25);border-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-alert.ax-danger-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-900),.25);border-color:rgba(var(--ax-color-info-500))}.ax-dark ax-alert.ax-info-solid ax-button[class$=blank]{color:rgba(var(--ax-color-text-default))}.ax-dark ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-fore))}ax-alert{position:relative;display:flex;gap:1rem;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));padding:1rem;font-size:.875rem;line-height:1.25rem}ax-alert .ax-alert-inline{display:flex;flex:1 1 0%;align-items:center;justify-content:center}ax-alert .ax-alert-block{display:flex}ax-alert .ax-alert-block .ax-alert-content{display:flex;flex-direction:column}ax-alert .ax-alert-block .ax-alert-content ax-footer{margin-top:1rem}ax-alert .ax-alert-icon{display:grid;border-radius:9999px;padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-alert .ax-alert-buttons{padding-inline-start:1rem}ax-alert .ax-alert-title{display:flex;flex:1 1 0%;flex-direction:column}ax-alert .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-progress{position:absolute;bottom:0;inset-inline-start:0px;height:.25rem}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-100));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-900))}ax-alert.ax-secondary-solid{background-color:rgba(var(--ax-color-secondary-100));border-color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-secondary-solid .ax-alert-icon{color:rgba(var(--ax-color-secondary-500))}ax-alert.ax-secondary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-secondary-900))}ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-100));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-900))}ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-100));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgba(var(--ax-color-warning-fore))}ax-alert.ax-warning-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-900))}ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-100));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-900))}ax-alert.ax-info-solid{background-color:rgba(var(--ax-color-info-100));border-color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid ax-title{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid ax-content{color:rgba(var(--ax-color-text-default))}ax-alert.ax-info-solid .ax-alert-icon{color:rgba(var(--ax-color-info-500))}ax-alert.ax-info-solid .ax-alert-progress{background-color:rgba(var(--ax-color-info-900))}\n"] }]
165
165
  }], propDecorators: { _iconComp: [{
166
166
  type: ContentChild,
167
167
  args: ['ax-icon']