@acorex/components 5.0.24 → 5.0.25

package/fesm2020/acorex-components.mjs

@@ -1192,24 +1192,24 @@ class AXAlertButtonComponent extends AXBaseClickableMixin {
     }
 }
 AXAlertButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAlertButtonComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXAlertButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXAlertButtonComponent, selector: "ax-alert-button", inputs: { title: "title", icon: "icon" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", onClick: "onClick", selectedChange: "selectedChange", toggleableChange: "toggleableChange" }, host: { listeners: { "click": "_handleOnClick($event)", "focus": "_handleOnFocus($event)", "blur": "_handleOnBlur($event)" }, classAttribute: "ax-alert-button" }, usesInheritance: true, ngImport: i0, template: `
-       {{title}}
-       <i *ngIf="icon" class="{{icon}}"></i>
-    `, isInline: true, directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+AXAlertButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXAlertButtonComponent, selector: "ax-alert-button", inputs: { text: "text", icon: "icon" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", onClick: "onClick", selectedChange: "selectedChange", toggleableChange: "toggleableChange" }, host: { listeners: { "click": "_handleOnClick($event)", "focus": "_handleOnFocus($event)", "blur": "_handleOnBlur($event)" }, classAttribute: "ax-alert-button" }, usesInheritance: true, ngImport: i0, template: `
+       {{text}}
+       <ng-content select="ax-icon"></ng-content>
+    `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAlertButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-alert-button',
                     template: `
-       {{title}}
-       <i *ngIf="icon" class="{{icon}}"></i>
+       {{text}}
+       <ng-content select="ax-icon"></ng-content>
     `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
                     outputs: [...BUTTON_OUTPUT],
                     host: { class: 'ax-alert-button' }
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { title: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { text: [{
                 type: Input
             }], icon: [{
                 type: Input
@@ -1293,7 +1293,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 }]
         }] });
 
-const COMPONENT$o = [
+class AXIconComponent extends AXSizableComponentMixin {
+    constructor(elementRef, cdr) {
+        super(elementRef, cdr);
+    }
+    get __iconClass() {
+        return `ax-ic ${this.icon}`;
+    }
+}
+AXIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AXIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXIconComponent, selector: "ax-icon", inputs: { icon: "icon" }, host: { properties: { "class": "this.__iconClass" } }, usesInheritance: true, ngImport: i0, template: '<ng-content select="ax-content"></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ax-icon',
+                    template: '<ng-content select="ax-content"></ng-content>',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { icon: [{
+                type: Input
+            }], __iconClass: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+const COMPONENT$o = [AXIconComponent];
+const MODULES$o = [CommonModule];
+class AXIconModule {
+}
+AXIconModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AXIconModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, declarations: [AXIconComponent], imports: [CommonModule], exports: [AXIconComponent] });
+AXIconModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, providers: [], imports: [[...MODULES$o]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [...COMPONENT$o],
+                    imports: [...MODULES$o],
+                    exports: [...COMPONENT$o],
+                    providers: [],
+                }]
+        }] });
+
+const COMPONENT$n = [
     AXAlertComponent,
     AXAlertContentComponent,
     AXAlertTitleComponent,
@@ -1301,7 +1343,7 @@ const COMPONENT$o = [
     AXAlertFooterComponent,
     AXAlertSuffixComponent
 ];
-const MODULES$o = [CommonModule];
+const MODULES$n = [CommonModule, AXIconModule];
 class AXAlertModule {
 }
 AXAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -1310,19 +1352,19 @@ AXAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         AXAlertTitleComponent,
         AXAlertButtonComponent,
         AXAlertFooterComponent,
-        AXAlertSuffixComponent], imports: [CommonModule], exports: [AXAlertComponent,
+        AXAlertSuffixComponent], imports: [CommonModule, AXIconModule], exports: [AXAlertComponent,
         AXAlertContentComponent,
         AXAlertTitleComponent,
         AXAlertButtonComponent,
         AXAlertFooterComponent,
         AXAlertSuffixComponent] });
-AXAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAlertModule, providers: [], imports: [[...MODULES$o]] });
+AXAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAlertModule, providers: [], imports: [[...MODULES$n]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAlertModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [...COMPONENT$o],
-                    imports: [...MODULES$o],
-                    exports: [...COMPONENT$o],
+                    declarations: [...COMPONENT$n],
+                    imports: [...MODULES$n],
+                    exports: [...COMPONENT$n],
                     providers: [],
                 }]
         }] });
@@ -1371,19 +1413,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 type: Input
             }] } });
 
-const COMPONENT$n = [AXAvatarComponent];
-const MODULES$n = [CommonModule];
+const COMPONENT$m = [AXAvatarComponent];
+const MODULES$m = [CommonModule];
 class AXAvatarModule {
 }
 AXAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 AXAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAvatarModule, declarations: [AXAvatarComponent], imports: [CommonModule], exports: [AXAvatarComponent] });
-AXAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAvatarModule, providers: [], imports: [[...MODULES$n]] });
+AXAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAvatarModule, providers: [], imports: [[...MODULES$m]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXAvatarModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [...COMPONENT$n],
-                    imports: [...MODULES$n],
-                    exports: [...COMPONENT$n],
+                    declarations: [...COMPONENT$m],
+                    imports: [...MODULES$m],
+                    exports: [...COMPONENT$m],
                     providers: [],
                 }]
         }] });
@@ -1413,19 +1455,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENT$m = [AXBadgeComponent];
-const MODULES$m = [CommonModule];
+const COMPONENT$l = [AXBadgeComponent];
+const MODULES$l = [CommonModule];
 class AXBadgeModule {
 }
 AXBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 AXBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXBadgeModule, declarations: [AXBadgeComponent], imports: [CommonModule], exports: [AXBadgeComponent] });
-AXBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXBadgeModule, providers: [], imports: [[...MODULES$m]] });
+AXBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXBadgeModule, providers: [], imports: [[...MODULES$l]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXBadgeModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [...COMPONENT$m],
-                    imports: [...MODULES$m],
-                    exports: [...COMPONENT$m],
+                    declarations: [...COMPONENT$l],
+                    imports: [...MODULES$l],
+                    exports: [...COMPONENT$l],
                     providers: [],
                 }]
         }] });
@@ -1777,56 +1819,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; } });
 
-const COMPONENT$l = [AXDecoratorPrefixComponent, AXDecoratorSuffixComponent, AXDecoratorContentComponent, AXDecoratorHeaderComponent];
-const MODULES$l = [CommonModule];
+const COMPONENT$k = [AXDecoratorPrefixComponent, AXDecoratorSuffixComponent, AXDecoratorContentComponent, AXDecoratorHeaderComponent];
+const MODULES$k = [CommonModule];
 class AXEditorDecoratorModule {
 }
 AXEditorDecoratorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXEditorDecoratorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 AXEditorDecoratorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXEditorDecoratorModule, declarations: [AXDecoratorPrefixComponent, AXDecoratorSuffixComponent, AXDecoratorContentComponent, AXDecoratorHeaderComponent], imports: [CommonModule], exports: [AXDecoratorPrefixComponent, AXDecoratorSuffixComponent, AXDecoratorContentComponent, AXDecoratorHeaderComponent] });
-AXEditorDecoratorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXEditorDecoratorModule, providers: [], imports: [[...MODULES$l]] });
+AXEditorDecoratorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXEditorDecoratorModule, providers: [], imports: [[...MODULES$k]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXEditorDecoratorModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [...COMPONENT$l],
-                    imports: [...MODULES$l],
-                    exports: [...COMPONENT$l],
-                    providers: [],
-                }]
-        }] });
-
-class AXIconComponent extends AXSizableComponentMixin {
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-    }
-    get __iconClass() {
-        return `ax-ic ${this.icon}`;
-    }
-}
-AXIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXIconComponent, selector: "ax-icon", inputs: { icon: "icon" }, host: { properties: { "class": "this.__iconClass" } }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ax-icon',
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { icon: [{
-                type: Input
-            }], __iconClass: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-const COMPONENT$k = [AXIconComponent];
-const MODULES$k = [CommonModule];
-class AXIconModule {
-}
-AXIconModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AXIconModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, declarations: [AXIconComponent], imports: [CommonModule], exports: [AXIconComponent] });
-AXIconModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, providers: [], imports: [[...MODULES$k]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXIconModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT$k],
@@ -5048,10 +5048,10 @@ class AXPopupComponent extends AXBaseComponentMixin {
     onFullScreen() { }
 }
 AXPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXPopupComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.ViewContainerRef }, { token: AXLoadingService }], target: i0.ɵɵFactoryTarget.Component });
-AXPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXPopupComponent, selector: "ax-popup", host: { listeners: { "keydown.escape": "onKeydownHandler($event)" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" cdkTrapFocus>\r\n    <div class=\"ax-popup ax-{{size}}\" tabindex=\"0\" cdkDrag>\r\n        <ng-container *ngIf=\"showHeader\">\r\n            <header cdkDragHandle class=\"ax-cursor-move\">\r\n                <div>\r\n                    <div class=\"ax-text-lg ax-font-medium\">\r\n                        <span>\r\n                            {{title}}\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n                <div *ngIf=\"showCloseButton\">\r\n                    <i class=\"ax-ic ax-ic-close ax-text-gray ax-cursor-pointer\" (click)=\"_handleCloseClick()\"\r\n                        tabindex=\"1\"></i>\r\n                </div>\r\n            </header>\r\n        </ng-container>\r\n        <main>\r\n            <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n        </main>\r\n    </div>\r\n</div>", directives: [{ type: i2$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i1$3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+AXPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXPopupComponent, selector: "ax-popup", host: { listeners: { "keydown.escape": "onKeydownHandler($event)" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" cdkTrapFocus>\r\n    <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag>\r\n        <ng-container *ngIf=\"showHeader\">\r\n            <header cdkDragHandle class=\"ax-cursor-move\">\r\n                <div>\r\n                    <div class=\"ax-text-lg ax-font-medium\">\r\n                        <span>\r\n                            {{title}}\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n                <div *ngIf=\"showCloseButton\">\r\n                    <i class=\"ax-ic ax-ic-close ax-text-gray ax-cursor-pointer\" (click)=\"_handleCloseClick()\"\r\n                        tabindex=\"1\"></i>\r\n                </div>\r\n            </header>\r\n        </ng-container>\r\n        <main>\r\n            <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n        </main>\r\n    </div>\r\n</div>", directives: [{ type: i2$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i1$3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXPopupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-popup', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" cdkTrapFocus>\r\n    <div class=\"ax-popup ax-{{size}}\" tabindex=\"0\" cdkDrag>\r\n        <ng-container *ngIf=\"showHeader\">\r\n            <header cdkDragHandle class=\"ax-cursor-move\">\r\n                <div>\r\n                    <div class=\"ax-text-lg ax-font-medium\">\r\n                        <span>\r\n                            {{title}}\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n                <div *ngIf=\"showCloseButton\">\r\n                    <i class=\"ax-ic ax-ic-close ax-text-gray ax-cursor-pointer\" (click)=\"_handleCloseClick()\"\r\n                        tabindex=\"1\"></i>\r\n                </div>\r\n            </header>\r\n        </ng-container>\r\n        <main>\r\n            <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n        </main>\r\n    </div>\r\n</div>" }]
+            args: [{ selector: 'ax-popup', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" cdkTrapFocus>\r\n    <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag>\r\n        <ng-container *ngIf=\"showHeader\">\r\n            <header cdkDragHandle class=\"ax-cursor-move\">\r\n                <div>\r\n                    <div class=\"ax-text-lg ax-font-medium\">\r\n                        <span>\r\n                            {{title}}\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n                <div *ngIf=\"showCloseButton\">\r\n                    <i class=\"ax-ic ax-ic-close ax-text-gray ax-cursor-pointer\" (click)=\"_handleCloseClick()\"\r\n                        tabindex=\"1\"></i>\r\n                </div>\r\n            </header>\r\n        </ng-container>\r\n        <main>\r\n            <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n        </main>\r\n    </div>\r\n</div>" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.ViewContainerRef }, { type: AXLoadingService }]; }, propDecorators: { onKeydownHandler: [{
                 type: HostListener,
                 args: ['keydown.escape', ['$event']]
@@ -5533,154 +5533,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 }]
         }] });
 
-class AXTabStripComponent extends AXSizableComponentMixin {
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        this.mode = 'default';
-        this.direction = "horizontal";
-        this.fitParent = false;
-        this.minWidth = false;
-        this.onSelectionChanged = new EventEmitter();
-    }
-    get items() {
-        return this._items;
-    }
-    set items(v) {
-        this._items = v;
-        if (this._items &&
-            this.items.length &&
-            !this._items.some((c) => c.active)) {
-            this._handleClick(this.items[0], 0);
-        }
-    }
-    _handleClick(tab, index) {
-        if (tab.disabled) {
-            return;
-        }
-        this.items.forEach((c) => (c.active = false));
-        tab.active = true;
-        this.onSelectionChanged.emit({
-            component: this,
-            selectedIndex: index,
-            selectedTab: tab,
-            htmlElement: this._getHostElement(),
-        });
-    }
-    get __hostClass() {
-        return [`ax-tabs`, `ax-tabs-${this.mode ? this.mode : 'default'}`, `ax-tabs-${this.direction}`, `${this.fitParent ? 'ax-tabs-fit' : ''}`].join(' ');
-    }
-}
-AXTabStripComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabStripComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXTabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXTabStripComponent, selector: "ax-tab-strip", inputs: { size: "size", items: "items", mode: "mode", direction: "direction", fitParent: "fitParent", minWidth: "minWidth" }, outputs: { onSelectionChanged: "onSelectionChanged" }, host: { properties: { "class": "this.__hostClass" }, classAttribute: "ax-tab-strip" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngFor=\"let item of items;let i = index\">\r\n    <div class=\"ax-tab-item\" [class.ax-state-active]=\"item.active\" [class.ax-state-disabled]=\"item.disabled\" *ngIf=\"item.visible!=false\" (click)=\"_handleClick(item,i)\">\r\n        <ng-content select=\"ax-prefix\"></ng-content>\r\n        <span *ngIf=\"item.text\">{{item.text}}</span>\r\n        <ng-content select=\"ax-suffix\"></ng-content>\r\n    </div>\r\n</ng-container>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabStripComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ax-tab-strip', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, inputs: ['size'], host: { class: 'ax-tab-strip' }, template: "<ng-container *ngFor=\"let item of items;let i = index\">\r\n    <div class=\"ax-tab-item\" [class.ax-state-active]=\"item.active\" [class.ax-state-disabled]=\"item.disabled\" *ngIf=\"item.visible!=false\" (click)=\"_handleClick(item,i)\">\r\n        <ng-content select=\"ax-prefix\"></ng-content>\r\n        <span *ngIf=\"item.text\">{{item.text}}</span>\r\n        <ng-content select=\"ax-suffix\"></ng-content>\r\n    </div>\r\n</ng-container>" }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
-                type: Input
-            }], mode: [{
-                type: Input
-            }], direction: [{
-                type: Input
-            }], fitParent: [{
-                type: Input
-            }], minWidth: [{
-                type: Input
-            }], onSelectionChanged: [{
-                type: Output
-            }], __hostClass: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class AXTabComponent extends AXBaseComponentMixin {
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        this.visible = true;
-        this.disabled = false;
-        this._render = false;
-    }
-    show() {
-        this._getHostElement().style.display = 'unset';
-        if (!this._render) {
-            this._render = true;
-            this._cdr.detectChanges();
-        }
-    }
-    hide() {
-        this._getHostElement().style.display = 'none';
-    }
-}
-AXTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXTabComponent, selector: "ax-tab", inputs: { name: "name", caption: "caption", tooltip: "tooltip", icon: "icon", visible: "visible", disabled: "disabled", data: "data" }, host: { styleAttribute: "display:none", classAttribute: "ax-tab" }, usesInheritance: true, ngImport: i0, template: `
-      <div *ngIf="_render" >
-        <ng-content>
-        </ng-content>
-      </div>
-    `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ax-tab',
-                    template: `
-      <div *ngIf="_render" >
-        <ng-content>
-        </ng-content>
-      </div>
-    `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                    host: { class: 'ax-tab', style: 'display:none' }
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { name: [{
-                type: Input
-            }], caption: [{
-                type: Input
-            }], tooltip: [{
-                type: Input
-            }], icon: [{
-                type: Input
-            }], visible: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], data: [{
-                type: Input
-            }] } });
-
-class AXTabViewComponent extends AXBaseComponent {
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        this._tabs = [];
-    }
-    onViewInit() {
-        this._tabs = Array.from(this._contentTabs).map(c => ({
-            name: c.name,
-            text: c.caption,
-            tooltip: c.tooltip,
-            icon: c.icon,
-            visible: c.visible,
-            disabled: c.disabled,
-        }));
-        this._cdr.detectChanges();
-    }
-    _handleSelectionChanged(e) {
-        const tabs = Array.from(this._contentTabs);
-        tabs.forEach(tab => {
-            tab.hide();
-        });
-        tabs[e.selectedIndex].show();
-    }
-}
-AXTabViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXTabViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXTabViewComponent, selector: "ax-tab-view", inputs: { size: "size" }, host: { classAttribute: "ax-tab-view" }, queries: [{ propertyName: "_contentTabs", predicate: AXTabComponent }], usesInheritance: true, ngImport: i0, template: "<!-- <ax-tab-strip [items]=\"_tabs\" (onSelectionChanged)=\"_handleSelectionChanged($event)\">\r\n\r\n</ax-tab-strip> -->\r\n<div class=\"ax-tab-view-container\">\r\n    <ng-content select=\"ax-tab\">\r\n    </ng-content>\r\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabViewComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ax-tab-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, inputs: ['size'], host: { class: 'ax-tab-view' }, template: "<!-- <ax-tab-strip [items]=\"_tabs\" (onSelectionChanged)=\"_handleSelectionChanged($event)\">\r\n\r\n</ax-tab-strip> -->\r\n<div class=\"ax-tab-view-container\">\r\n    <ng-content select=\"ax-tab\">\r\n    </ng-content>\r\n</div>" }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { _contentTabs: [{
-                type: ContentChildren,
-                args: [AXTabComponent]
-            }] } });
-
 class AXTabItemComponent extends AXBaseClickableMixin {
     constructor(elementRef, cdr) {
         super(elementRef, cdr);
@@ -5781,6 +5633,7 @@ class AXTabsComponent extends AXBaseComponent {
         super(elementRef, cdr);
         this.fitParent = false;
         this.minWidth = false;
+        this.onActiveTabChanged = new EventEmitter();
     }
     onRenderCssClass() {
         const classList = Array.from(this._getHostElement().classList);
@@ -5792,7 +5645,8 @@ class AXTabsComponent extends AXBaseComponent {
         }
     }
     onViewInit() {
-        this._handleSelectionChanged(this._contentTabs.get(0));
+        const selected = this._contentTabs.find(c => c.active) || this._contentTabs.get(0);
+        this._handleSelectionChanged(selected);
         this._contentTabs.forEach(c => {
             c.onClick.subscribe(t => {
                 this._handleSelectionChanged(c);
@@ -5806,10 +5660,15 @@ class AXTabsComponent extends AXBaseComponent {
             this.content.portal = e.template;
         }
         this._cdr.markForCheck();
+        this.onActiveTabChanged.emit({
+            component: this,
+            selectedTab: e,
+            selectedIndex: 0
+        });
     }
 }
 AXTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AXTabsComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXTabsComponent, selector: "ax-tabs", inputs: { fitParent: "fitParent", minWidth: "minWidth", content: "content" }, queries: [{ propertyName: "_contentTabs", predicate: AXTabItemComponent }], usesInheritance: true, ngImport: i0, template: `
+AXTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AXTabsComponent, selector: "ax-tabs", inputs: { fitParent: "fitParent", minWidth: "minWidth", content: "content" }, outputs: { onActiveTabChanged: "onActiveTabChanged" }, queries: [{ propertyName: "_contentTabs", predicate: AXTabItemComponent }], usesInheritance: true, ngImport: i0, template: `
         <div class="ax-items-wrapper">
             <ng-content select="ax-tab-item">
             </ng-content>
@@ -5837,6 +5696,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 type: Input
             }], content: [{
                 type: Input
+            }], onActiveTabChanged: [{
+                type: Output
             }] } });
 
 class AXTabStripChangedEvent extends AXEvent {
@@ -6470,5 +6331,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AXAlertButtonComponent, AXAlertComponent, AXAlertContentComponent, AXAlertFooterComponent, AXAlertModule, AXAlertSuffixComponent, AXAlertTitleComponent, AXAvatarComponent, AXAvatarModule, AXBadgeComponent, AXBadgeModule, AXBaseButtonMixin, AXBaseClickableMixin, AXBaseComponent, AXBaseComponentMixin, AXBaseDatePickerMixin, AXBaseDropdownMixin, AXBaseItemButtonMixin, AXBasePageComponent, AXBaseSelectionDropdownMixin, AXBaseSelectionValueMixin, AXBaseTextBoxMixin, AXBaseValueComponentMixin, AXBaseValueDropdownMixin, AXButtonClickEvent, AXButtonComponent, AXButtonGroupComponent, AXButtonItemComponent, AXButtonModule, AXCalendarComponent, AXCalendarComponentMixin, AXCalendarModule, AXCarouselArrowsComponent, AXCarouselComponent, AXCarouselCore, AXCarouselItemComponent, AXCarouselModule, AXCarouselPagerComponent, AXCheckBoxComponent, AXCheckBoxModule, AXClickEvent, AXCommonModule, AXDataListComponent, AXDataListModule, AXDatePickerComponent, AXDatepickerModule, AXDecoratorContentComponent, AXDecoratorHeaderComponent, AXDecoratorPrefixComponent, AXDecoratorSuffixComponent, AXDialogComponent, AXDialogModule, AXDialogService, AXDrawerComponent, AXDrawerContainerComponent, AXDrawerContentComponent, AXDrawerModule, AXDropdownComponent, AXDropdownModule, AXDropdownPanelComponent, AXEditorDecoratorModule, AXEvent, AXFocusEvent, AXFormComponent, AXFormFieldComponent, AXFormHintComponent, AXFormModule, AXHtmlEvent, AXIconComponent, AXIconModule, AXInputMaskComponent, AXInputMaskModule, AXInteractiveComponenetMixin, AXItemClickEvent, AXLabelComponent, AXLabelModule, AXLoadingComponent, AXLoadingDirective, AXLoadingModule, AXLoadingService, AXLoadingSpinnerComponent, AXNumberBoxComponent, AXNumberBoxModule, AXPageCloseEvent, AXPageClosedPromise, AXPageClosing, AXPageComponent, AXPageFooterComponent, AXPageModule, AXPageResult, AXPasswordBoxComponent, AXPasswordBoxModule, AXPopoverComponent, AXPopoverModule, AXPopupComponent, AXPopupModule, AXPopupService, AXRadioComponent, AXRadioModule, AXRangeSliderComponent, AXRangeSliderModule, AXResponsiveDirective, AXSelectBoxComponent, AXSelectBoxModule, AXSelectionListComponent, AXSelectionListModule, AXSelectionValueChangedEvent, AXSideMenuComponent, AXSideMenuModule, AXSizableComponentMixin, AXSwitchComponent, AXSwitchModule, AXTabContentDirective, AXTabItemComponent, AXTabStripChangedEvent, AXTabStripComponent, AXTabViewComponent, AXTabsComponent, AXTabsModule, AXTextBoxComponent, AXTextBoxModule, AXTimeBoxComponent, AXTimeBoxModule, AXToastComponent, AXToastModule, AXToastService, AXTooltipComponent, AXTooltipDirective, AXTooltipModule, AXValidationModule, AXValidationRuleComponent, AXValidationRules, AXValueChangedEvent, AX_DIRECTIONS, AX_LOCATIONS, AX_STYLE_TYPES, BASE_INPUTS, BASE_OUTPUT, TAB_META_KEY, _BaseComponenetMixin };
+export { AXAlertButtonComponent, AXAlertComponent, AXAlertContentComponent, AXAlertFooterComponent, AXAlertModule, AXAlertSuffixComponent, AXAlertTitleComponent, AXAvatarComponent, AXAvatarModule, AXBadgeComponent, AXBadgeModule, AXBaseButtonMixin, AXBaseClickableMixin, AXBaseComponent, AXBaseComponentMixin, AXBaseDatePickerMixin, AXBaseDropdownMixin, AXBaseItemButtonMixin, AXBasePageComponent, AXBaseSelectionDropdownMixin, AXBaseSelectionValueMixin, AXBaseTextBoxMixin, AXBaseValueComponentMixin, AXBaseValueDropdownMixin, AXButtonClickEvent, AXButtonComponent, AXButtonGroupComponent, AXButtonItemComponent, AXButtonModule, AXCalendarComponent, AXCalendarComponentMixin, AXCalendarModule, AXCarouselArrowsComponent, AXCarouselComponent, AXCarouselCore, AXCarouselItemComponent, AXCarouselModule, AXCarouselPagerComponent, AXCheckBoxComponent, AXCheckBoxModule, AXClickEvent, AXCommonModule, AXDataListComponent, AXDataListModule, AXDatePickerComponent, AXDatepickerModule, AXDecoratorContentComponent, AXDecoratorHeaderComponent, AXDecoratorPrefixComponent, AXDecoratorSuffixComponent, AXDialogComponent, AXDialogModule, AXDialogService, AXDrawerComponent, AXDrawerContainerComponent, AXDrawerContentComponent, AXDrawerModule, AXDropdownComponent, AXDropdownModule, AXDropdownPanelComponent, AXEditorDecoratorModule, AXEvent, AXFocusEvent, AXFormComponent, AXFormFieldComponent, AXFormHintComponent, AXFormModule, AXHtmlEvent, AXIconComponent, AXIconModule, AXInputMaskComponent, AXInputMaskModule, AXInteractiveComponenetMixin, AXItemClickEvent, AXLabelComponent, AXLabelModule, AXLoadingComponent, AXLoadingDirective, AXLoadingModule, AXLoadingService, AXLoadingSpinnerComponent, AXNumberBoxComponent, AXNumberBoxModule, AXPageCloseEvent, AXPageClosedPromise, AXPageClosing, AXPageComponent, AXPageFooterComponent, AXPageModule, AXPageResult, AXPasswordBoxComponent, AXPasswordBoxModule, AXPopoverComponent, AXPopoverModule, AXPopupComponent, AXPopupModule, AXPopupService, AXRadioComponent, AXRadioModule, AXRangeSliderComponent, AXRangeSliderModule, AXResponsiveDirective, AXSelectBoxComponent, AXSelectBoxModule, AXSelectionListComponent, AXSelectionListModule, AXSelectionValueChangedEvent, AXSideMenuComponent, AXSideMenuModule, AXSizableComponentMixin, AXSwitchComponent, AXSwitchModule, AXTabContentDirective, AXTabItemComponent, AXTabStripChangedEvent, AXTabsComponent, AXTabsModule, AXTextBoxComponent, AXTextBoxModule, AXTimeBoxComponent, AXTimeBoxModule, AXToastComponent, AXToastModule, AXToastService, AXTooltipComponent, AXTooltipDirective, AXTooltipModule, AXValidationModule, AXValidationRuleComponent, AXValidationRules, AXValueChangedEvent, AX_DIRECTIONS, AX_LOCATIONS, AX_STYLE_TYPES, BASE_INPUTS, BASE_OUTPUT, TAB_META_KEY, _BaseComponenetMixin };
 //# sourceMappingURL=acorex-components.mjs.map