@ng-nest/ui 15.0.13 → 15.0.15

package/fesm2015/ng-nest-ui-upload.mjs

@@ -72,8 +72,8 @@ class XUploadProperty extends XControlValueAccessor {
         this.uploadError = new EventEmitter();
     }
 }
-/** @nocollapse */ XUploadProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XUploadProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XUploadProperty, selector: "ng-component", inputs: { text: "text", action: "action", accept: "accept", type: "type", imgFallback: "imgFallback", imgCut: "imgCut", multiple: "multiple", download: "download", multipleModel: "multipleModel", filesTpl: "filesTpl", maxLimit: "maxLimit", headers: "headers" }, outputs: { removeClick: "removeClick", uploadReady: "uploadReady", uploading: "uploading", uploadSuccess: "uploadSuccess", uploadError: "uploadError" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XUploadProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XUploadProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XUploadProperty, selector: "ng-component", inputs: { text: "text", action: "action", accept: "accept", type: "type", imgFallback: "imgFallback", imgCut: "imgCut", multiple: "multiple", download: "download", multipleModel: "multipleModel", filesTpl: "filesTpl", maxLimit: "maxLimit", headers: "headers" }, outputs: { removeClick: "removeClick", uploadReady: "uploadReady", uploading: "uploading", uploadSuccess: "uploadSuccess", uploadError: "uploadError" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XInputBoolean()
 ], XUploadProperty.prototype, "imgCut", void 0);
@@ -90,7 +90,7 @@ __decorate([
 __decorate([
     XInputNumber()
 ], XUploadProperty.prototype, "maxLimit", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { text: [{
@@ -310,9 +310,9 @@ class XUploadPortalComponent {
         };
     }
 }
-/** @nocollapse */ XUploadPortalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadPortalComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XUploadPortalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XUploadPortalComponent, selector: "x-upload-portal", viewQueries: [{ propertyName: "imgRef", first: true, predicate: ["imgRef"], descendants: true }, { propertyName: "imgClipRef", first: true, predicate: ["imgClipRef"], descendants: true }, { propertyName: "boundaryRef", first: true, predicate: ["boundaryRef"], descendants: true }, { propertyName: "cutRef", first: true, predicate: ["cutRef"], descendants: true }], ngImport: i0, template: "<div class=\"x-upload-portal {{ cutType }}\" [class.x-upload-portal-ready]=\"ready\">\r\n  <div class=\"x-upload-portal-tools\">\r\n    <div class=\"x-upload-portal-title\">\r\n      <x-icon type=\"fto-image\"></x-icon>\r\n      <span>{{ file?.name }}</span>\r\n    </div>\r\n    <x-icon class=\"x-upload-portal-close\" type=\"fto-x\" (click)=\"closePortal()\"></x-icon>\r\n  </div>\r\n  <div class=\"x-upload-portal-img\">\r\n    <img #imgRef class=\"x-upload-portal-full-img\" [src]=\"file?.url\" />\r\n    <div #boundaryRef class=\"x-upload-portal-boundary\">\r\n      <img #imgClipRef class=\"x-upload-portal-clip-img\" [src]=\"file?.url\" />\r\n      <div #cutRef class=\"x-upload-portal-cut\">\r\n        <div class=\"x-upload-portal-cut-top-start\"></div>\r\n        <div class=\"x-upload-portal-cut-top\"></div>\r\n        <div class=\"x-upload-portal-cut-top-end\"></div>\r\n        <div class=\"x-upload-portal-cut-left\"></div>\r\n        <div class=\"x-upload-portal-cut-right\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom-start\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom-end\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-upload-portal-bottom-tools\">\r\n    <x-icon class=\"x-upload-portal-close\" type=\"fto-check\" (click)=\"sure()\"></x-icon>\r\n  </div>\r\n</div>\r\n", styles: ["x-upload-portal{width:100%;height:100%}.x-upload-portal{margin:0;padding:0;display:flex;position:relative;width:100%;height:100%;flex-direction:column}.x-upload-portal-tools{width:100%;height:3.25rem;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:1;color:#fff}.x-upload-portal-bottom-tools{width:100%;height:3.25rem;position:absolute;display:flex;justify-content:center;align-items:center;z-index:1;color:#fff;bottom:0}.x-upload-portal-title{display:flex;align-items:center;margin:0 1rem}.x-upload-portal-title>x-icon{font-size:1.25rem}.x-upload-portal-title>span{margin-left:.5rem}.x-upload-portal-close{font-size:1.75rem;padding:0 1rem;color:#fffc;transition:color var(--x-animation-duration-base);cursor:pointer}.x-upload-portal-close:hover{color:#fff}.x-upload-portal-img{flex:1;width:100%;position:relative;overflow:auto}.x-upload-portal-full-img{max-width:85%;max-height:85%;width:auto;height:auto;position:absolute;left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.x-upload-portal-clip-img{position:absolute}.x-upload-portal-ready .x-upload-portal-full-img{max-width:inherit;max-height:inherit}.x-upload-portal-boundary{width:0;height:0;left:50%;top:50%;transform:translate3d(-50%,-50%,0);position:relative;background-color:#00000080}.x-upload-portal-cut{width:0;height:0;border:.125rem var(--x-border-style) rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;position:relative;cursor:move}.x-upload-portal-cut-top-start,.x-upload-portal-cut-top,.x-upload-portal-cut-top-end,.x-upload-portal-cut-left,.x-upload-portal-cut-right,.x-upload-portal-cut-bottom-start,.x-upload-portal-cut-bottom,.x-upload-portal-cut-bottom-end{width:.825rem;height:.825rem;background:rgb(255,255,255);position:absolute;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-upload-portal-cut-top-start{top:-.4125rem;left:-.4125rem;cursor:se-resize}.x-upload-portal-cut-top{top:-.4125rem;cursor:s-resize}.x-upload-portal-cut-top-end{top:-.4125rem;right:-.4125rem;cursor:ne-resize}.x-upload-portal-cut-left{left:-.4125rem;cursor:w-resize}.x-upload-portal-cut-right{right:-.4125rem;cursor:w-resize}.x-upload-portal-cut-bottom-start{left:-.4125rem;bottom:-.4125rem;cursor:ne-resize}.x-upload-portal-cut-bottom{bottom:-.4125rem;cursor:s-resize}.x-upload-portal-cut-bottom-end{right:-.4125rem;bottom:-.4125rem;cursor:se-resize}.x-upload-portal-top-start{cursor:se-resize}.x-upload-portal-top{cursor:s-resize}.x-upload-portal-top-end{cursor:ne-resize}.x-upload-portal-left,.x-upload-portal-right{cursor:w-resize}.x-upload-portal-bottom-start{cursor:ne-resize}.x-upload-portal-bottom{cursor:s-resize}.x-upload-portal-bottom-end{cursor:se-resize}\n"], dependencies: [{ kind: "component", type: i1.XIconComponent, selector: "x-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadPortalComponent, decorators: [{
+/** @nocollapse */ XUploadPortalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadPortalComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XUploadPortalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XUploadPortalComponent, selector: "x-upload-portal", viewQueries: [{ propertyName: "imgRef", first: true, predicate: ["imgRef"], descendants: true }, { propertyName: "imgClipRef", first: true, predicate: ["imgClipRef"], descendants: true }, { propertyName: "boundaryRef", first: true, predicate: ["boundaryRef"], descendants: true }, { propertyName: "cutRef", first: true, predicate: ["cutRef"], descendants: true }], ngImport: i0, template: "<div class=\"x-upload-portal {{ cutType }}\" [class.x-upload-portal-ready]=\"ready\">\r\n  <div class=\"x-upload-portal-tools\">\r\n    <div class=\"x-upload-portal-title\">\r\n      <x-icon type=\"fto-image\"></x-icon>\r\n      <span>{{ file?.name }}</span>\r\n    </div>\r\n    <x-icon class=\"x-upload-portal-close\" type=\"fto-x\" (click)=\"closePortal()\"></x-icon>\r\n  </div>\r\n  <div class=\"x-upload-portal-img\">\r\n    <img #imgRef class=\"x-upload-portal-full-img\" [src]=\"file?.url\" />\r\n    <div #boundaryRef class=\"x-upload-portal-boundary\">\r\n      <img #imgClipRef class=\"x-upload-portal-clip-img\" [src]=\"file?.url\" />\r\n      <div #cutRef class=\"x-upload-portal-cut\">\r\n        <div class=\"x-upload-portal-cut-top-start\"></div>\r\n        <div class=\"x-upload-portal-cut-top\"></div>\r\n        <div class=\"x-upload-portal-cut-top-end\"></div>\r\n        <div class=\"x-upload-portal-cut-left\"></div>\r\n        <div class=\"x-upload-portal-cut-right\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom-start\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom-end\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-upload-portal-bottom-tools\">\r\n    <x-icon class=\"x-upload-portal-close\" type=\"fto-check\" (click)=\"sure()\"></x-icon>\r\n  </div>\r\n</div>\r\n", styles: ["x-upload-portal{width:100%;height:100%}.x-upload-portal{margin:0;padding:0;display:flex;position:relative;width:100%;height:100%;flex-direction:column}.x-upload-portal-tools{width:100%;height:3.25rem;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:1;color:#fff}.x-upload-portal-bottom-tools{width:100%;height:3.25rem;position:absolute;display:flex;justify-content:center;align-items:center;z-index:1;color:#fff;bottom:0}.x-upload-portal-title{display:flex;align-items:center;margin:0 1rem}.x-upload-portal-title>x-icon{font-size:1.25rem}.x-upload-portal-title>span{margin-left:.5rem}.x-upload-portal-close{font-size:1.75rem;padding:0 1rem;color:#fffc;transition:color var(--x-animation-duration-base);cursor:pointer}.x-upload-portal-close:hover{color:#fff}.x-upload-portal-img{flex:1;width:100%;position:relative;overflow:auto}.x-upload-portal-full-img{max-width:85%;max-height:85%;width:auto;height:auto;position:absolute;left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.x-upload-portal-clip-img{position:absolute}.x-upload-portal-ready .x-upload-portal-full-img{max-width:inherit;max-height:inherit}.x-upload-portal-boundary{width:0;height:0;left:50%;top:50%;transform:translate3d(-50%,-50%,0);position:relative;background-color:#00000080}.x-upload-portal-cut{width:0;height:0;border:.125rem var(--x-border-style) rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;position:relative;cursor:move}.x-upload-portal-cut-top-start,.x-upload-portal-cut-top,.x-upload-portal-cut-top-end,.x-upload-portal-cut-left,.x-upload-portal-cut-right,.x-upload-portal-cut-bottom-start,.x-upload-portal-cut-bottom,.x-upload-portal-cut-bottom-end{width:.825rem;height:.825rem;background:rgb(255,255,255);position:absolute;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-upload-portal-cut-top-start{top:-.4125rem;left:-.4125rem;cursor:se-resize}.x-upload-portal-cut-top{top:-.4125rem;cursor:s-resize}.x-upload-portal-cut-top-end{top:-.4125rem;right:-.4125rem;cursor:ne-resize}.x-upload-portal-cut-left{left:-.4125rem;cursor:w-resize}.x-upload-portal-cut-right{right:-.4125rem;cursor:w-resize}.x-upload-portal-cut-bottom-start{left:-.4125rem;bottom:-.4125rem;cursor:ne-resize}.x-upload-portal-cut-bottom{bottom:-.4125rem;cursor:s-resize}.x-upload-portal-cut-bottom-end{right:-.4125rem;bottom:-.4125rem;cursor:se-resize}.x-upload-portal-top-start{cursor:se-resize}.x-upload-portal-top{cursor:s-resize}.x-upload-portal-top-end{cursor:ne-resize}.x-upload-portal-left,.x-upload-portal-right{cursor:w-resize}.x-upload-portal-bottom-start{cursor:ne-resize}.x-upload-portal-bottom{cursor:s-resize}.x-upload-portal-bottom-end{cursor:se-resize}\n"], dependencies: [{ kind: "component", type: i1.XIconComponent, selector: "x-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadPortalComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XUploadPortalPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"x-upload-portal {{ cutType }}\" [class.x-upload-portal-ready]=\"ready\">\r\n  <div class=\"x-upload-portal-tools\">\r\n    <div class=\"x-upload-portal-title\">\r\n      <x-icon type=\"fto-image\"></x-icon>\r\n      <span>{{ file?.name }}</span>\r\n    </div>\r\n    <x-icon class=\"x-upload-portal-close\" type=\"fto-x\" (click)=\"closePortal()\"></x-icon>\r\n  </div>\r\n  <div class=\"x-upload-portal-img\">\r\n    <img #imgRef class=\"x-upload-portal-full-img\" [src]=\"file?.url\" />\r\n    <div #boundaryRef class=\"x-upload-portal-boundary\">\r\n      <img #imgClipRef class=\"x-upload-portal-clip-img\" [src]=\"file?.url\" />\r\n      <div #cutRef class=\"x-upload-portal-cut\">\r\n        <div class=\"x-upload-portal-cut-top-start\"></div>\r\n        <div class=\"x-upload-portal-cut-top\"></div>\r\n        <div class=\"x-upload-portal-cut-top-end\"></div>\r\n        <div class=\"x-upload-portal-cut-left\"></div>\r\n        <div class=\"x-upload-portal-cut-right\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom-start\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom\"></div>\r\n        <div class=\"x-upload-portal-cut-bottom-end\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-upload-portal-bottom-tools\">\r\n    <x-icon class=\"x-upload-portal-close\" type=\"fto-check\" (click)=\"sure()\"></x-icon>\r\n  </div>\r\n</div>\r\n", styles: ["x-upload-portal{width:100%;height:100%}.x-upload-portal{margin:0;padding:0;display:flex;position:relative;width:100%;height:100%;flex-direction:column}.x-upload-portal-tools{width:100%;height:3.25rem;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:1;color:#fff}.x-upload-portal-bottom-tools{width:100%;height:3.25rem;position:absolute;display:flex;justify-content:center;align-items:center;z-index:1;color:#fff;bottom:0}.x-upload-portal-title{display:flex;align-items:center;margin:0 1rem}.x-upload-portal-title>x-icon{font-size:1.25rem}.x-upload-portal-title>span{margin-left:.5rem}.x-upload-portal-close{font-size:1.75rem;padding:0 1rem;color:#fffc;transition:color var(--x-animation-duration-base);cursor:pointer}.x-upload-portal-close:hover{color:#fff}.x-upload-portal-img{flex:1;width:100%;position:relative;overflow:auto}.x-upload-portal-full-img{max-width:85%;max-height:85%;width:auto;height:auto;position:absolute;left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.x-upload-portal-clip-img{position:absolute}.x-upload-portal-ready .x-upload-portal-full-img{max-width:inherit;max-height:inherit}.x-upload-portal-boundary{width:0;height:0;left:50%;top:50%;transform:translate3d(-50%,-50%,0);position:relative;background-color:#00000080}.x-upload-portal-cut{width:0;height:0;border:.125rem var(--x-border-style) rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;position:relative;cursor:move}.x-upload-portal-cut-top-start,.x-upload-portal-cut-top,.x-upload-portal-cut-top-end,.x-upload-portal-cut-left,.x-upload-portal-cut-right,.x-upload-portal-cut-bottom-start,.x-upload-portal-cut-bottom,.x-upload-portal-cut-bottom-end{width:.825rem;height:.825rem;background:rgb(255,255,255);position:absolute;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-upload-portal-cut-top-start{top:-.4125rem;left:-.4125rem;cursor:se-resize}.x-upload-portal-cut-top{top:-.4125rem;cursor:s-resize}.x-upload-portal-cut-top-end{top:-.4125rem;right:-.4125rem;cursor:ne-resize}.x-upload-portal-cut-left{left:-.4125rem;cursor:w-resize}.x-upload-portal-cut-right{right:-.4125rem;cursor:w-resize}.x-upload-portal-cut-bottom-start{left:-.4125rem;bottom:-.4125rem;cursor:ne-resize}.x-upload-portal-cut-bottom{bottom:-.4125rem;cursor:s-resize}.x-upload-portal-cut-bottom-end{right:-.4125rem;bottom:-.4125rem;cursor:se-resize}.x-upload-portal-top-start{cursor:se-resize}.x-upload-portal-top{cursor:s-resize}.x-upload-portal-top-end{cursor:ne-resize}.x-upload-portal-left,.x-upload-portal-right{cursor:w-resize}.x-upload-portal-bottom-start{cursor:ne-resize}.x-upload-portal-bottom{cursor:s-resize}.x-upload-portal-bottom-end{cursor:se-resize}\n"] }]
         }], ctorParameters: function () {
@@ -561,9 +561,9 @@ class XUploadComponent extends XUploadProperty {
         this.cdr.detectChanges();
     }
 }
-/** @nocollapse */ XUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1$1.HttpClient, optional: true }, { token: i0.ChangeDetectorRef }, { token: i2.XPortalService }, { token: i0.ViewContainerRef }, { token: i3.XI18nService }, { token: i4.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XUploadComponent, selector: "x-upload", providers: [XValueAccessor(XUploadComponent)], viewQueries: [{ propertyName: "file", first: true, predicate: ["file"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #upload class=\"x-upload x-upload-{{ type }}\" [class.x-disabled]=\"disabled\">\r\n  <input type=\"file\" #file (change)=\"change($event)\" [attr.accept]=\"accept\" [multiple]=\"multiple\" style=\"display: none\" />\r\n\r\n  <ng-container [ngSwitch]=\"type\">\r\n    <ng-container *ngSwitchCase=\"'list'\">\r\n      <ng-container *ngTemplateOutlet=\"uploadBtnTpl\"></ng-container>\r\n      <ng-container *xOutlet=\"filesTpl; context: { $files: files }\">\r\n        <ul class=\"x-upload-files\">\r\n          <li *ngFor=\"let file of files; index as i; trackBy: trackByItem\" [class.x-upload-disabled]=\"!download\">\r\n            <ng-container *ngIf=\"download\">\r\n              <a [href]=\"file.url\" target=\"_blank\" [title]=\"file.name\">\r\n                <x-icon type=\"fto-file-text\"></x-icon>\r\n                <span class=\"x-upload-filename\">{{ file.name }}</span>\r\n              </a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!download\">\r\n              <a>\r\n                <x-icon type=\"fto-file-text\"></x-icon>\r\n                <span class=\"x-upload-filename\">{{ file.name }}</span>\r\n              </a>\r\n            </ng-container>\r\n\r\n            <ng-container [ngSwitch]=\"file.state\">\r\n              <x-icon class=\"x-upload-state\" *ngSwitchCase=\"'ready'\" type=\"fto-clock\"></x-icon>\r\n              <span class=\"x-upload-percent\" *ngSwitchCase=\"'uploading'\">{{ file.percent }}%</span>\r\n              <x-icon class=\"x-upload-state success\" *ngSwitchCase=\"'success'\" type=\"fto-check\"></x-icon>\r\n              <x-icon class=\"x-upload-state error\" *ngSwitchCase=\"'error'\" type=\"fto-info\"></x-icon>\r\n            </ng-container>\r\n            <x-button *ngIf=\"file.state !== 'uploading'\" icon=\"fto-x\" (click)=\"remove(file, i)\" onlyIcon closable size=\"mini\"></x-button>\r\n          </li>\r\n        </ul>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'img'\">\r\n      <x-image-group>\r\n        <ng-container *ngFor=\"let file of files; index as i; trackBy: trackByItem\">\r\n          <x-image\r\n            [src]=\"file.url\"\r\n            (load)=\"imgLoad(file)\"\r\n            (error)=\"imgError($event, file)\"\r\n            class=\"{{ file.state }}\"\r\n            [previewTpl]=\"previewTpl\"\r\n            [fallback]=\"imgFallback\"\r\n          >\r\n          </x-image>\r\n          <ng-template #previewTpl let-image=\"$image\">\r\n            <div class=\"x-upload-uploading\" *ngIf=\"file.state == 'uploading'\">\r\n              <x-progress [percent]=\"file.percent!\" info=\"false\"></x-progress>\r\n            </div>\r\n            <div class=\"x-image-overlay\">\r\n              <ng-container [ngSwitch]=\"file.state\">\r\n                <x-icon class=\"x-upload-state\" *ngSwitchCase=\"'ready'\" type=\"fto-clock\"></x-icon>\r\n                <x-icon type=\"fto-eye\" *ngSwitchCase=\"'success'\" (click)=\"image.onPreview()\"></x-icon>\r\n              </ng-container>\r\n              <x-icon *ngIf=\"imgCut && file.state === 'success'\" type=\"fto-crop\" (click)=\"onImgCut(file, i)\"></x-icon>\r\n              <x-icon *ngIf=\"file.state !== 'uploading'\" type=\"fto-trash-2\" (click)=\"remove(file, i)\"></x-icon>\r\n            </div>\r\n          </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngTemplateOutlet=\"uploadBtnTpl\"></ng-container>\r\n      </x-image-group>\r\n    </ng-container>\r\n  </ng-container>\r\n</div>\r\n\r\n<ng-template #uploadBtnTpl>\r\n  <div class=\"x-upload-buttons\" [class.x-upload-buttons-template]=\"isTemplateText\" (click)=\"uploadClick()\">\r\n    <ng-container *xOutlet=\"getText\">\r\n      <x-button icon=\"fto-upload\" [disabled]=\"disabled\" type=\"primary\">{{ getText }}</x-button>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-upload{margin:0;padding:0;color:var(--x-text);font-size:var(--x-font-size)}.x-upload-buttons{display:inline-flex}.x-upload-buttons>.x-button:not(:first-child){margin-left:.4rem}.x-upload-buttons-template{cursor:pointer}.x-upload-files{margin-top:.4rem}.x-upload-files>li{padding:0 .2rem;height:calc(var(--x-font-size) + .6rem);line-height:calc(var(--x-font-size) + .6rem);display:flex;align-items:center;overflow:hidden;cursor:pointer;border-radius:var(--x-border-radius)}.x-upload-files>li .x-icon{color:var(--x-text-400);font-size:1rem}.x-upload-files>li .x-icon.x-upload-state.success{color:var(--x-success)}.x-upload-files>li .x-icon.x-upload-state.error{color:var(--x-danger)}.x-upload-files>li a{flex:1;display:flex;align-items:center;height:calc(var(--x-font-size) + .6rem);line-height:calc(var(--x-font-size) + .6rem);color:inherit;text-decoration:none;overflow:hidden}.x-upload-files>li span.x-upload-filename{margin-left:.2rem;flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.x-upload-files>li span.x-upload-percent{color:var(--x-text-400)}.x-upload-files>li>.x-button{display:none;padding:0}.x-upload-files>li:not(:first-child){margin-top:.2rem}.x-upload-files>li.x-upload-disabled{cursor:default}.x-upload-files>li.x-upload-disabled>a{cursor:default}.x-upload-files>li:hover:not(.x-upload-disabled){color:var(--x-primary);background-color:var(--x-background)}.x-upload-files>li:hover>.x-button{display:inline-block}.x-upload-files>li:hover>.x-upload-state{display:none}.x-upload-img{display:flex;flex-wrap:wrap}.x-upload-img .x-upload-buttons-template{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;width:6.25rem;height:6.25rem;margin-right:.5rem;margin-bottom:.5rem;border:var(--x-border-width) dashed var(--x-border);background:var(--x-background);border-radius:var(--x-border-radius);transition:border-color var(--x-animation-duration-base)}.x-upload-img .x-upload-buttons-template:hover{border-color:var(--x-primary)}.x-upload-img .x-image{height:6.25rem;width:6.25rem;padding:.325rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);transition:border-color var(--x-animation-duration-base);margin-right:.5rem;margin-bottom:.5rem;position:relative;display:flex;align-items:center;justify-content:center}.x-upload-img .x-image-overlay x-icon{font-size:1rem;color:#fffc;padding:.25rem;transition:color var(--x-animation-duration-base)}.x-upload-img .x-image-overlay x-icon:hover{color:#fff}.x-upload-img x-image.error .x-image{border-color:var(--x-danger)}.x-upload-img x-image.error .x-image-error-icon{color:var(--x-danger)}.x-upload-uploading{position:absolute;margin-top:3rem;width:calc(100% - 1rem)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i6.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: i7.XButtonComponent, selector: "x-button" }, { kind: "component", type: i1.XIconComponent, selector: "x-icon" }, { kind: "component", type: i9.XImageComponent, selector: "x-image" }, { kind: "component", type: i9.XImageGroupComponent, selector: "x-image-group" }, { kind: "component", type: i10.XProgressComponent, selector: "x-progress" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadComponent, decorators: [{
+/** @nocollapse */ XUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1$1.HttpClient, optional: true }, { token: i0.ChangeDetectorRef }, { token: i2.XPortalService }, { token: i0.ViewContainerRef }, { token: i3.XI18nService }, { token: i4.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XUploadComponent, selector: "x-upload", providers: [XValueAccessor(XUploadComponent)], viewQueries: [{ propertyName: "file", first: true, predicate: ["file"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #upload class=\"x-upload x-upload-{{ type }}\" [class.x-disabled]=\"disabled\">\r\n  <input type=\"file\" #file (change)=\"change($event)\" [attr.accept]=\"accept\" [multiple]=\"multiple\" style=\"display: none\" />\r\n\r\n  <ng-container [ngSwitch]=\"type\">\r\n    <ng-container *ngSwitchCase=\"'list'\">\r\n      <ng-container *ngTemplateOutlet=\"uploadBtnTpl\"></ng-container>\r\n      <ng-container *xOutlet=\"filesTpl; context: { $files: files }\">\r\n        <ul class=\"x-upload-files\">\r\n          <li *ngFor=\"let file of files; index as i; trackBy: trackByItem\" [class.x-upload-disabled]=\"!download\">\r\n            <ng-container *ngIf=\"download\">\r\n              <a [href]=\"file.url\" target=\"_blank\" [title]=\"file.name\">\r\n                <x-icon type=\"fto-file-text\"></x-icon>\r\n                <span class=\"x-upload-filename\">{{ file.name }}</span>\r\n              </a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!download\">\r\n              <a>\r\n                <x-icon type=\"fto-file-text\"></x-icon>\r\n                <span class=\"x-upload-filename\">{{ file.name }}</span>\r\n              </a>\r\n            </ng-container>\r\n\r\n            <ng-container [ngSwitch]=\"file.state\">\r\n              <x-icon class=\"x-upload-state\" *ngSwitchCase=\"'ready'\" type=\"fto-clock\"></x-icon>\r\n              <span class=\"x-upload-percent\" *ngSwitchCase=\"'uploading'\">{{ file.percent }}%</span>\r\n              <x-icon class=\"x-upload-state success\" *ngSwitchCase=\"'success'\" type=\"fto-check\"></x-icon>\r\n              <x-icon class=\"x-upload-state error\" *ngSwitchCase=\"'error'\" type=\"fto-info\"></x-icon>\r\n            </ng-container>\r\n            <x-button *ngIf=\"file.state !== 'uploading'\" icon=\"fto-x\" (click)=\"remove(file, i)\" onlyIcon closable size=\"mini\"></x-button>\r\n          </li>\r\n        </ul>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'img'\">\r\n      <x-image-group>\r\n        <ng-container *ngFor=\"let file of files; index as i; trackBy: trackByItem\">\r\n          <x-image\r\n            [src]=\"file.url\"\r\n            (load)=\"imgLoad(file)\"\r\n            (error)=\"imgError($event, file)\"\r\n            class=\"{{ file.state }}\"\r\n            [previewTpl]=\"previewTpl\"\r\n            [fallback]=\"imgFallback\"\r\n          >\r\n          </x-image>\r\n          <ng-template #previewTpl let-image=\"$image\">\r\n            <div class=\"x-upload-uploading\" *ngIf=\"file.state == 'uploading'\">\r\n              <x-progress [percent]=\"file.percent!\" info=\"false\"></x-progress>\r\n            </div>\r\n            <div class=\"x-image-overlay\">\r\n              <ng-container [ngSwitch]=\"file.state\">\r\n                <x-icon class=\"x-upload-state\" *ngSwitchCase=\"'ready'\" type=\"fto-clock\"></x-icon>\r\n                <x-icon type=\"fto-eye\" *ngSwitchCase=\"'success'\" (click)=\"image.onPreview()\"></x-icon>\r\n              </ng-container>\r\n              <x-icon *ngIf=\"imgCut && file.state === 'success'\" type=\"fto-crop\" (click)=\"onImgCut(file, i)\"></x-icon>\r\n              <x-icon *ngIf=\"file.state !== 'uploading'\" type=\"fto-trash-2\" (click)=\"remove(file, i)\"></x-icon>\r\n            </div>\r\n          </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngTemplateOutlet=\"uploadBtnTpl\"></ng-container>\r\n      </x-image-group>\r\n    </ng-container>\r\n  </ng-container>\r\n</div>\r\n\r\n<ng-template #uploadBtnTpl>\r\n  <div class=\"x-upload-buttons\" [class.x-upload-buttons-template]=\"isTemplateText\" (click)=\"uploadClick()\">\r\n    <ng-container *xOutlet=\"getText\">\r\n      <x-button icon=\"fto-upload\" [disabled]=\"disabled\" type=\"primary\">{{ getText }}</x-button>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-upload{margin:0;padding:0;color:var(--x-text);font-size:var(--x-font-size)}.x-upload-buttons{display:inline-flex}.x-upload-buttons>.x-button:not(:first-child){margin-left:.4rem}.x-upload-buttons-template{cursor:pointer}.x-upload-files{margin-top:.4rem}.x-upload-files>li{padding:0 .2rem;height:calc(var(--x-font-size) + .6rem);line-height:calc(var(--x-font-size) + .6rem);display:flex;align-items:center;overflow:hidden;cursor:pointer;border-radius:var(--x-border-radius)}.x-upload-files>li .x-icon{color:var(--x-text-400);font-size:1rem}.x-upload-files>li .x-icon.x-upload-state.success{color:var(--x-success)}.x-upload-files>li .x-icon.x-upload-state.error{color:var(--x-danger)}.x-upload-files>li a{flex:1;display:flex;align-items:center;height:calc(var(--x-font-size) + .6rem);line-height:calc(var(--x-font-size) + .6rem);color:inherit;text-decoration:none;overflow:hidden}.x-upload-files>li span.x-upload-filename{margin-left:.2rem;flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.x-upload-files>li span.x-upload-percent{color:var(--x-text-400)}.x-upload-files>li>.x-button{display:none;padding:0}.x-upload-files>li:not(:first-child){margin-top:.2rem}.x-upload-files>li.x-upload-disabled{cursor:default}.x-upload-files>li.x-upload-disabled>a{cursor:default}.x-upload-files>li:hover:not(.x-upload-disabled){color:var(--x-primary);background-color:var(--x-background)}.x-upload-files>li:hover>.x-button{display:inline-block}.x-upload-files>li:hover>.x-upload-state{display:none}.x-upload-img{display:flex;flex-wrap:wrap}.x-upload-img .x-upload-buttons-template{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;width:6.25rem;height:6.25rem;margin-right:.5rem;margin-bottom:.5rem;border:var(--x-border-width) dashed var(--x-border);background:var(--x-background);border-radius:var(--x-border-radius);transition:border-color var(--x-animation-duration-base)}.x-upload-img .x-upload-buttons-template:hover{border-color:var(--x-primary)}.x-upload-img .x-image{height:6.25rem;width:6.25rem;padding:.325rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);transition:border-color var(--x-animation-duration-base);margin-right:.5rem;margin-bottom:.5rem;position:relative;display:flex;align-items:center;justify-content:center}.x-upload-img .x-image-overlay x-icon{font-size:1rem;color:#fffc;padding:.25rem;transition:color var(--x-animation-duration-base)}.x-upload-img .x-image-overlay x-icon:hover{color:#fff}.x-upload-img x-image.error .x-image{border-color:var(--x-danger)}.x-upload-img x-image.error .x-image-error-icon{color:var(--x-danger)}.x-upload-uploading{position:absolute;margin-top:3rem;width:calc(100% - 1rem)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i6.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: i7.XButtonComponent, selector: "x-button" }, { kind: "component", type: i1.XIconComponent, selector: "x-icon" }, { kind: "component", type: i9.XImageComponent, selector: "x-image" }, { kind: "component", type: i9.XImageGroupComponent, selector: "x-image-group" }, { kind: "component", type: i10.XProgressComponent, selector: "x-progress" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XUploadPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [XValueAccessor(XUploadComponent)], template: "<div #upload class=\"x-upload x-upload-{{ type }}\" [class.x-disabled]=\"disabled\">\r\n  <input type=\"file\" #file (change)=\"change($event)\" [attr.accept]=\"accept\" [multiple]=\"multiple\" style=\"display: none\" />\r\n\r\n  <ng-container [ngSwitch]=\"type\">\r\n    <ng-container *ngSwitchCase=\"'list'\">\r\n      <ng-container *ngTemplateOutlet=\"uploadBtnTpl\"></ng-container>\r\n      <ng-container *xOutlet=\"filesTpl; context: { $files: files }\">\r\n        <ul class=\"x-upload-files\">\r\n          <li *ngFor=\"let file of files; index as i; trackBy: trackByItem\" [class.x-upload-disabled]=\"!download\">\r\n            <ng-container *ngIf=\"download\">\r\n              <a [href]=\"file.url\" target=\"_blank\" [title]=\"file.name\">\r\n                <x-icon type=\"fto-file-text\"></x-icon>\r\n                <span class=\"x-upload-filename\">{{ file.name }}</span>\r\n              </a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!download\">\r\n              <a>\r\n                <x-icon type=\"fto-file-text\"></x-icon>\r\n                <span class=\"x-upload-filename\">{{ file.name }}</span>\r\n              </a>\r\n            </ng-container>\r\n\r\n            <ng-container [ngSwitch]=\"file.state\">\r\n              <x-icon class=\"x-upload-state\" *ngSwitchCase=\"'ready'\" type=\"fto-clock\"></x-icon>\r\n              <span class=\"x-upload-percent\" *ngSwitchCase=\"'uploading'\">{{ file.percent }}%</span>\r\n              <x-icon class=\"x-upload-state success\" *ngSwitchCase=\"'success'\" type=\"fto-check\"></x-icon>\r\n              <x-icon class=\"x-upload-state error\" *ngSwitchCase=\"'error'\" type=\"fto-info\"></x-icon>\r\n            </ng-container>\r\n            <x-button *ngIf=\"file.state !== 'uploading'\" icon=\"fto-x\" (click)=\"remove(file, i)\" onlyIcon closable size=\"mini\"></x-button>\r\n          </li>\r\n        </ul>\r\n      </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'img'\">\r\n      <x-image-group>\r\n        <ng-container *ngFor=\"let file of files; index as i; trackBy: trackByItem\">\r\n          <x-image\r\n            [src]=\"file.url\"\r\n            (load)=\"imgLoad(file)\"\r\n            (error)=\"imgError($event, file)\"\r\n            class=\"{{ file.state }}\"\r\n            [previewTpl]=\"previewTpl\"\r\n            [fallback]=\"imgFallback\"\r\n          >\r\n          </x-image>\r\n          <ng-template #previewTpl let-image=\"$image\">\r\n            <div class=\"x-upload-uploading\" *ngIf=\"file.state == 'uploading'\">\r\n              <x-progress [percent]=\"file.percent!\" info=\"false\"></x-progress>\r\n            </div>\r\n            <div class=\"x-image-overlay\">\r\n              <ng-container [ngSwitch]=\"file.state\">\r\n                <x-icon class=\"x-upload-state\" *ngSwitchCase=\"'ready'\" type=\"fto-clock\"></x-icon>\r\n                <x-icon type=\"fto-eye\" *ngSwitchCase=\"'success'\" (click)=\"image.onPreview()\"></x-icon>\r\n              </ng-container>\r\n              <x-icon *ngIf=\"imgCut && file.state === 'success'\" type=\"fto-crop\" (click)=\"onImgCut(file, i)\"></x-icon>\r\n              <x-icon *ngIf=\"file.state !== 'uploading'\" type=\"fto-trash-2\" (click)=\"remove(file, i)\"></x-icon>\r\n            </div>\r\n          </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngTemplateOutlet=\"uploadBtnTpl\"></ng-container>\r\n      </x-image-group>\r\n    </ng-container>\r\n  </ng-container>\r\n</div>\r\n\r\n<ng-template #uploadBtnTpl>\r\n  <div class=\"x-upload-buttons\" [class.x-upload-buttons-template]=\"isTemplateText\" (click)=\"uploadClick()\">\r\n    <ng-container *xOutlet=\"getText\">\r\n      <x-button icon=\"fto-upload\" [disabled]=\"disabled\" type=\"primary\">{{ getText }}</x-button>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-upload{margin:0;padding:0;color:var(--x-text);font-size:var(--x-font-size)}.x-upload-buttons{display:inline-flex}.x-upload-buttons>.x-button:not(:first-child){margin-left:.4rem}.x-upload-buttons-template{cursor:pointer}.x-upload-files{margin-top:.4rem}.x-upload-files>li{padding:0 .2rem;height:calc(var(--x-font-size) + .6rem);line-height:calc(var(--x-font-size) + .6rem);display:flex;align-items:center;overflow:hidden;cursor:pointer;border-radius:var(--x-border-radius)}.x-upload-files>li .x-icon{color:var(--x-text-400);font-size:1rem}.x-upload-files>li .x-icon.x-upload-state.success{color:var(--x-success)}.x-upload-files>li .x-icon.x-upload-state.error{color:var(--x-danger)}.x-upload-files>li a{flex:1;display:flex;align-items:center;height:calc(var(--x-font-size) + .6rem);line-height:calc(var(--x-font-size) + .6rem);color:inherit;text-decoration:none;overflow:hidden}.x-upload-files>li span.x-upload-filename{margin-left:.2rem;flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.x-upload-files>li span.x-upload-percent{color:var(--x-text-400)}.x-upload-files>li>.x-button{display:none;padding:0}.x-upload-files>li:not(:first-child){margin-top:.2rem}.x-upload-files>li.x-upload-disabled{cursor:default}.x-upload-files>li.x-upload-disabled>a{cursor:default}.x-upload-files>li:hover:not(.x-upload-disabled){color:var(--x-primary);background-color:var(--x-background)}.x-upload-files>li:hover>.x-button{display:inline-block}.x-upload-files>li:hover>.x-upload-state{display:none}.x-upload-img{display:flex;flex-wrap:wrap}.x-upload-img .x-upload-buttons-template{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;width:6.25rem;height:6.25rem;margin-right:.5rem;margin-bottom:.5rem;border:var(--x-border-width) dashed var(--x-border);background:var(--x-background);border-radius:var(--x-border-radius);transition:border-color var(--x-animation-duration-base)}.x-upload-img .x-upload-buttons-template:hover{border-color:var(--x-primary)}.x-upload-img .x-image{height:6.25rem;width:6.25rem;padding:.325rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);transition:border-color var(--x-animation-duration-base);margin-right:.5rem;margin-bottom:.5rem;position:relative;display:flex;align-items:center;justify-content:center}.x-upload-img .x-image-overlay x-icon{font-size:1rem;color:#fffc;padding:.25rem;transition:color var(--x-animation-duration-base)}.x-upload-img .x-image-overlay x-icon:hover{color:#fff}.x-upload-img x-image.error .x-image{border-color:var(--x-danger)}.x-upload-img x-image.error .x-image-error-icon{color:var(--x-danger)}.x-upload-uploading{position:absolute;margin-top:3rem;width:calc(100% - 1rem)}\n"] }]
         }], ctorParameters: function () {
@@ -577,8 +577,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
 
 class XUploadModule {
 }
-/** @nocollapse */ XUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0", ngImport: i0, type: XUploadModule, declarations: [XUploadComponent, XUploadPortalComponent, XUploadProperty], imports: [CommonModule,
+/** @nocollapse */ XUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.3", ngImport: i0, type: XUploadModule, declarations: [XUploadComponent, XUploadPortalComponent, XUploadProperty], imports: [CommonModule,
         FormsModule,
         ReactiveFormsModule,
         DragDropModule,
@@ -590,7 +590,7 @@ class XUploadModule {
         XBaseFormModule,
         XImageModule,
         XProgressModule], exports: [XUploadComponent] });
-/** @nocollapse */ XUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadModule, imports: [CommonModule,
+/** @nocollapse */ XUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadModule, imports: [CommonModule,
         FormsModule,
         ReactiveFormsModule,
         DragDropModule,
@@ -602,7 +602,7 @@ class XUploadModule {
         XBaseFormModule,
         XImageModule,
         XProgressModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XUploadModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XUploadModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [XUploadComponent, XUploadPortalComponent, XUploadProperty],
@@ -630,4 +630,3 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
 
 export { XUploadComponent, XUploadModule, XUploadPortalComponent, XUploadPortalPrefix, XUploadPrefix, XUploadProperty };
 //# sourceMappingURL=ng-nest-ui-upload.mjs.map
-//# sourceMappingURL=ng-nest-ui-upload.mjs.map

package/fesm2015/ng-nest-ui.mjs

@@ -92,4 +92,3 @@ export * from '@ng-nest/ui/inner';
  * Generated bundle index. Do not edit.
  */
 //# sourceMappingURL=ng-nest-ui.mjs.map
-//# sourceMappingURL=ng-nest-ui.mjs.map

package/fesm2020/ng-nest-ui-affix.mjs

@@ -17,15 +17,15 @@ const X_CONFIG_NAME = 'affix';
  */
 class XAffixProperty extends XProperty {
 }
-/** @nocollapse */ XAffixProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XAffixProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XAffixProperty, selector: "ng-component", inputs: { top: "top", left: "left" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XAffixProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAffixProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAffixProperty, selector: "ng-component", inputs: { top: "top", left: "left" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XWithConfig(X_CONFIG_NAME)
 ], XAffixProperty.prototype, "top", void 0);
 __decorate([
     XWithConfig(X_CONFIG_NAME)
 ], XAffixProperty.prototype, "left", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { top: [{
@@ -40,19 +40,19 @@ class XAffixComponent extends XAffixProperty {
         this.configService = configService;
     }
 }
-/** @nocollapse */ XAffixComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixComponent, deps: [{ token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XAffixComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XAffixComponent, selector: "x-affix", usesInheritance: true, ngImport: i0, template: "<div #affix class=\"x-affix\" [style.top]=\"top\" [style.left]=\"left\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".x-affix{margin:0;padding:0;position:sticky;display:inline-block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixComponent, decorators: [{
+/** @nocollapse */ XAffixComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixComponent, deps: [{ token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAffixComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAffixComponent, selector: "x-affix", usesInheritance: true, ngImport: i0, template: "<div #affix class=\"x-affix\" [style.top]=\"top\" [style.left]=\"left\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".x-affix{margin:0;padding:0;position:sticky;display:inline-block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XAffixPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #affix class=\"x-affix\" [style.top]=\"top\" [style.left]=\"left\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".x-affix{margin:0;padding:0;position:sticky;display:inline-block}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.XConfigService }]; } });
 
 class XAffixModule {
 }
-/** @nocollapse */ XAffixModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XAffixModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0", ngImport: i0, type: XAffixModule, declarations: [XAffixComponent, XAffixProperty], imports: [CommonModule], exports: [XAffixComponent] });
-/** @nocollapse */ XAffixModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAffixModule, decorators: [{
+/** @nocollapse */ XAffixModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XAffixModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.3", ngImport: i0, type: XAffixModule, declarations: [XAffixComponent, XAffixProperty], imports: [CommonModule], exports: [XAffixComponent] });
+/** @nocollapse */ XAffixModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAffixModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [XAffixComponent, XAffixProperty],
@@ -67,4 +67,3 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
 
 export { XAffixComponent, XAffixModule, XAffixPrefix, XAffixProperty };
 //# sourceMappingURL=ng-nest-ui-affix.mjs.map
-//# sourceMappingURL=ng-nest-ui-affix.mjs.map

package/fesm2020/ng-nest-ui-alert.mjs

@@ -63,8 +63,8 @@ class XAlertProperty extends XProperty {
         this.resizing = new EventEmitter();
     }
 }
-/** @nocollapse */ XAlertProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XAlertProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XAlertProperty, selector: "ng-component", inputs: { hide: "hide", title: "title", content: "content", type: "type", effect: "effect", hideClose: "hideClose", closeText: "closeText", showIcon: "showIcon", disabledAnimation: "disabledAnimation", duration: "duration", manual: "manual", draggable: "draggable", resizable: "resizable", offsetLeft: "offsetLeft", offsetTop: "offsetTop", minWidth: "minWidth", minHeight: "minHeight", dragBoundary: "dragBoundary", dragFreeDragPosition: "dragFreeDragPosition", operationTpl: "operationTpl" }, outputs: { close: "close", dragEnded: "dragEnded", resizing: "resizing" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XAlertProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAlertProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAlertProperty, selector: "ng-component", inputs: { hide: "hide", title: "title", content: "content", type: "type", effect: "effect", hideClose: "hideClose", closeText: "closeText", showIcon: "showIcon", disabledAnimation: "disabledAnimation", duration: "duration", manual: "manual", draggable: "draggable", resizable: "resizable", offsetLeft: "offsetLeft", offsetTop: "offsetTop", minWidth: "minWidth", minHeight: "minHeight", dragBoundary: "dragBoundary", dragFreeDragPosition: "dragFreeDragPosition", operationTpl: "operationTpl" }, outputs: { close: "close", dragEnded: "dragEnded", resizing: "resizing" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XInputBoolean()
 ], XAlertProperty.prototype, "hide", void 0);
@@ -110,7 +110,7 @@ __decorate([
 __decorate([
     XWithConfig(X_CONFIG_NAME, '0rem')
 ], XAlertProperty.prototype, "minHeight", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { hide: [{
@@ -213,9 +213,9 @@ class XAlertComponent extends XAlertProperty {
         }
     }
 }
-/** @nocollapse */ XAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XAlertComponent, selector: "x-alert", viewQueries: [{ propertyName: "alert", first: true, predicate: ["alert"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n  #alert\r\n  class=\"x-alert\"\r\n  cdkDrag\r\n  (cdkDragEnded)=\"dragEnded.emit($event)\"\r\n  [cdkDragFreeDragPosition]=\"dragFreeDragPosition\"\r\n  [cdkDragDisabled]=\"!draggable\"\r\n  [cdkDragBoundary]=\"dragBoundary\"\r\n  [ngClass]=\"classMap\"\r\n  *ngIf=\"!hide\"\r\n  @x-fade-animation\r\n  [@.disabled]=\"disabledAnimation\"\r\n  (@x-fade-animation.done)=\"onCloseAnimationDone()\"\r\n  [xResizable]=\"resizable!\"\r\n  (resizing)=\"resizing.emit($event)\"\r\n  [offsetLeft]=\"offsetLeft\"\r\n  [offsetTop]=\"offsetTop\"\r\n  [style.minWidth]=\"minWidth\"\r\n  [style.minHeight]=\"minHeight\"\r\n>\r\n  <ng-container *ngIf=\"showIcon\">\r\n    <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n  </ng-container>\r\n  <ng-template #iconTpl>\r\n    <ng-container [ngSwitch]=\"type\">\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'success'\" type=\"adf-check-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'info'\" type=\"adf-info-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'warning'\" type=\"adf-exclamation-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'error'\" type=\"adf-close-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'loading'\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n    </ng-container>\r\n  </ng-template>\r\n  <div class=\"x-alert-inner\">\r\n    <span class=\"x-alert-title\" cdkDragHandle [class.x-bold]=\"title && content\">\r\n      <ng-container *xOutlet=\"title; context: { $iconTpl: iconTpl }\">{{ title }}</ng-container>\r\n    </span>\r\n    <div class=\"x-alert-content\" *ngIf=\"content\">\r\n      <ng-container *xOutlet=\"content; context: { $iconTpl: iconTpl }\">{{ content }}</ng-container>\r\n    </div>\r\n    <div class=\"x-alert-close\">\r\n      <div class=\"x-alert-operation\" *xOutlet=\"operationTpl\">{{ operationTpl }}</div>\r\n      <x-button\r\n        *ngIf=\"!hideClose\"\r\n        size=\"small\"\r\n        [icon]=\"!closeText ? 'fto-x' : ''\"\r\n        [onlyIcon]=\"!closeText\"\r\n        [type]=\"closeText ? 'text' : 'initial'\"\r\n        (click)=\"onClose()\"\r\n        closable\r\n        >{{ closeText }}</x-button\r\n      >\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["x-alert{display:block}.x-alert{margin:0;padding:0;background-color:var(--x-background);border:.0625rem solid var(--x-border-300);border-radius:var(--x-border-radius);padding:.5rem 1rem;position:relative;display:flex;align-items:center}.x-alert-close{position:absolute;top:.425rem;right:.425rem}.x-alert-inner{width:100%}.x-alert-title.x-bold{font-weight:600}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon.x-icon{font-size:calc(var(--x-font-size) + .25rem);margin-right:.5rem}.x-alert-icon-medium>.x-icon{font-size:1.75rem}.x-alert-draggable .cdk-drag-handle{cursor:move}.x-alert-success.x-light{color:var(--x-success);background-color:var(--x-success-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-light x-button.x-alert-close .x-button{color:var(--x-success-400)}.x-alert-success.x-light x-button.x-alert-close .x-button:hover{color:var(--x-success)}.x-alert-success.x-dark{color:var(--x-success-900);background-color:var(--x-success);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-dark x-button.x-alert-close .x-button{color:var(--x-success-900)}.x-alert-success.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-success.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-white .x-alert-icon.x-icon{color:var(--x-success)}.x-alert-success.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-success.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-info.x-light{color:var(--x-info);background-color:var(--x-info-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-light x-button.x-alert-close .x-button{color:var(--x-info-400)}.x-alert-info.x-light x-button.x-alert-close .x-button:hover{color:var(--x-info)}.x-alert-info.x-dark{color:var(--x-info-900);background-color:var(--x-info);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-dark x-button.x-alert-close .x-button{color:var(--x-info-900)}.x-alert-info.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-info.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-white .x-alert-icon.x-icon{color:var(--x-info)}.x-alert-info.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-info.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-warning.x-light{color:var(--x-warning);background-color:var(--x-warning-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-light x-button.x-alert-close .x-button{color:var(--x-warning-400)}.x-alert-warning.x-light x-button.x-alert-close .x-button:hover{color:var(--x-warning)}.x-alert-warning.x-dark{color:var(--x-warning-900);background-color:var(--x-warning);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-dark x-button.x-alert-close .x-button{color:var(--x-warning-900)}.x-alert-warning.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-warning.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-white .x-alert-icon.x-icon{color:var(--x-warning)}.x-alert-warning.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-warning.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-error.x-light{color:var(--x-danger);background-color:var(--x-danger-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-light x-button.x-alert-close .x-button{color:var(--x-danger-400)}.x-alert-error.x-light x-button.x-alert-close .x-button:hover{color:var(--x-danger)}.x-alert-error.x-dark{color:var(--x-danger-900);background-color:var(--x-danger);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-dark x-button.x-alert-close .x-button{color:var(--x-danger-900)}.x-alert-error.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-error.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-white .x-alert-icon.x-icon{color:var(--x-danger)}.x-alert-error.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-error.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-loading.x-light{color:var(--x-primary);background-color:var(--x-info-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-light x-button.x-alert-close .x-button{color:var(--x-info-400)}.x-alert-loading.x-light x-button.x-alert-close .x-button:hover{color:var(--x-primary)}.x-alert-loading.x-dark{color:var(--x-info-900);background-color:var(--x-primary);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-dark x-button.x-alert-close .x-button{color:var(--x-info-900)}.x-alert-loading.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-loading.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-white .x-alert-icon.x-icon{color:var(--x-primary)}.x-alert-loading.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-loading.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i4.XIconComponent, selector: "x-icon" }, { kind: "component", type: i5.XButtonComponent, selector: "x-button" }, { kind: "directive", type: i6.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "directive", type: i7.XResizableDirective, selector: "[xResizable]" }], animations: [XFadeAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertComponent, decorators: [{
+/** @nocollapse */ XAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAlertComponent, selector: "x-alert", viewQueries: [{ propertyName: "alert", first: true, predicate: ["alert"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n  #alert\r\n  class=\"x-alert\"\r\n  cdkDrag\r\n  (cdkDragEnded)=\"dragEnded.emit($event)\"\r\n  [cdkDragFreeDragPosition]=\"dragFreeDragPosition\"\r\n  [cdkDragDisabled]=\"!draggable\"\r\n  [cdkDragBoundary]=\"dragBoundary\"\r\n  [ngClass]=\"classMap\"\r\n  *ngIf=\"!hide\"\r\n  @x-fade-animation\r\n  [@.disabled]=\"disabledAnimation\"\r\n  (@x-fade-animation.done)=\"onCloseAnimationDone()\"\r\n  [xResizable]=\"resizable!\"\r\n  (resizing)=\"resizing.emit($event)\"\r\n  [offsetLeft]=\"offsetLeft\"\r\n  [offsetTop]=\"offsetTop\"\r\n  [style.minWidth]=\"minWidth\"\r\n  [style.minHeight]=\"minHeight\"\r\n>\r\n  <ng-container *ngIf=\"showIcon\">\r\n    <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n  </ng-container>\r\n  <ng-template #iconTpl>\r\n    <ng-container [ngSwitch]=\"type\">\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'success'\" type=\"adf-check-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'info'\" type=\"adf-info-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'warning'\" type=\"adf-exclamation-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'error'\" type=\"adf-close-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'loading'\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n    </ng-container>\r\n  </ng-template>\r\n  <div class=\"x-alert-inner\">\r\n    <span class=\"x-alert-title\" cdkDragHandle [class.x-bold]=\"title && content\">\r\n      <ng-container *xOutlet=\"title; context: { $iconTpl: iconTpl }\">{{ title }}</ng-container>\r\n    </span>\r\n    <div class=\"x-alert-content\" *ngIf=\"content\">\r\n      <ng-container *xOutlet=\"content; context: { $iconTpl: iconTpl }\">{{ content }}</ng-container>\r\n    </div>\r\n    <div class=\"x-alert-close\">\r\n      <div class=\"x-alert-operation\" *xOutlet=\"operationTpl\">{{ operationTpl }}</div>\r\n      <x-button\r\n        *ngIf=\"!hideClose\"\r\n        size=\"small\"\r\n        [icon]=\"!closeText ? 'fto-x' : ''\"\r\n        [onlyIcon]=\"!closeText\"\r\n        [type]=\"closeText ? 'text' : 'initial'\"\r\n        (click)=\"onClose()\"\r\n        closable\r\n        >{{ closeText }}</x-button\r\n      >\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["x-alert{display:block}.x-alert{margin:0;padding:0;background-color:var(--x-background);border:.0625rem solid var(--x-border-300);border-radius:var(--x-border-radius);padding:.5rem 1rem;position:relative;display:flex;align-items:center}.x-alert-close{position:absolute;top:.425rem;right:.425rem}.x-alert-inner{width:100%}.x-alert-title.x-bold{font-weight:600}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon.x-icon{font-size:calc(var(--x-font-size) + .25rem);margin-right:.5rem}.x-alert-icon-medium>.x-icon{font-size:1.75rem}.x-alert-draggable .cdk-drag-handle{cursor:move}.x-alert-success.x-light{color:var(--x-success);background-color:var(--x-success-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-light x-button.x-alert-close .x-button{color:var(--x-success-400)}.x-alert-success.x-light x-button.x-alert-close .x-button:hover{color:var(--x-success)}.x-alert-success.x-dark{color:var(--x-success-900);background-color:var(--x-success);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-dark x-button.x-alert-close .x-button{color:var(--x-success-900)}.x-alert-success.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-success.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-white .x-alert-icon.x-icon{color:var(--x-success)}.x-alert-success.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-success.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-info.x-light{color:var(--x-info);background-color:var(--x-info-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-light x-button.x-alert-close .x-button{color:var(--x-info-400)}.x-alert-info.x-light x-button.x-alert-close .x-button:hover{color:var(--x-info)}.x-alert-info.x-dark{color:var(--x-info-900);background-color:var(--x-info);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-dark x-button.x-alert-close .x-button{color:var(--x-info-900)}.x-alert-info.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-info.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-white .x-alert-icon.x-icon{color:var(--x-info)}.x-alert-info.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-info.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-warning.x-light{color:var(--x-warning);background-color:var(--x-warning-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-light x-button.x-alert-close .x-button{color:var(--x-warning-400)}.x-alert-warning.x-light x-button.x-alert-close .x-button:hover{color:var(--x-warning)}.x-alert-warning.x-dark{color:var(--x-warning-900);background-color:var(--x-warning);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-dark x-button.x-alert-close .x-button{color:var(--x-warning-900)}.x-alert-warning.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-warning.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-white .x-alert-icon.x-icon{color:var(--x-warning)}.x-alert-warning.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-warning.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-error.x-light{color:var(--x-danger);background-color:var(--x-danger-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-light x-button.x-alert-close .x-button{color:var(--x-danger-400)}.x-alert-error.x-light x-button.x-alert-close .x-button:hover{color:var(--x-danger)}.x-alert-error.x-dark{color:var(--x-danger-900);background-color:var(--x-danger);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-dark x-button.x-alert-close .x-button{color:var(--x-danger-900)}.x-alert-error.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-error.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-white .x-alert-icon.x-icon{color:var(--x-danger)}.x-alert-error.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-error.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-loading.x-light{color:var(--x-primary);background-color:var(--x-info-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-light x-button.x-alert-close .x-button{color:var(--x-info-400)}.x-alert-loading.x-light x-button.x-alert-close .x-button:hover{color:var(--x-primary)}.x-alert-loading.x-dark{color:var(--x-info-900);background-color:var(--x-primary);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-dark x-button.x-alert-close .x-button{color:var(--x-info-900)}.x-alert-loading.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-loading.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-white .x-alert-icon.x-icon{color:var(--x-primary)}.x-alert-loading.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-loading.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i4.XIconComponent, selector: "x-icon" }, { kind: "component", type: i5.XButtonComponent, selector: "x-button" }, { kind: "directive", type: i6.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "directive", type: i7.XResizableDirective, selector: "[xResizable]" }], animations: [XFadeAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XAlertPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [XFadeAnimation], template: "<div\r\n  #alert\r\n  class=\"x-alert\"\r\n  cdkDrag\r\n  (cdkDragEnded)=\"dragEnded.emit($event)\"\r\n  [cdkDragFreeDragPosition]=\"dragFreeDragPosition\"\r\n  [cdkDragDisabled]=\"!draggable\"\r\n  [cdkDragBoundary]=\"dragBoundary\"\r\n  [ngClass]=\"classMap\"\r\n  *ngIf=\"!hide\"\r\n  @x-fade-animation\r\n  [@.disabled]=\"disabledAnimation\"\r\n  (@x-fade-animation.done)=\"onCloseAnimationDone()\"\r\n  [xResizable]=\"resizable!\"\r\n  (resizing)=\"resizing.emit($event)\"\r\n  [offsetLeft]=\"offsetLeft\"\r\n  [offsetTop]=\"offsetTop\"\r\n  [style.minWidth]=\"minWidth\"\r\n  [style.minHeight]=\"minHeight\"\r\n>\r\n  <ng-container *ngIf=\"showIcon\">\r\n    <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n  </ng-container>\r\n  <ng-template #iconTpl>\r\n    <ng-container [ngSwitch]=\"type\">\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'success'\" type=\"adf-check-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'info'\" type=\"adf-info-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'warning'\" type=\"adf-exclamation-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'error'\" type=\"adf-close-circle\"></x-icon>\r\n      <x-icon class=\"x-alert-icon\" *ngSwitchCase=\"'loading'\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n    </ng-container>\r\n  </ng-template>\r\n  <div class=\"x-alert-inner\">\r\n    <span class=\"x-alert-title\" cdkDragHandle [class.x-bold]=\"title && content\">\r\n      <ng-container *xOutlet=\"title; context: { $iconTpl: iconTpl }\">{{ title }}</ng-container>\r\n    </span>\r\n    <div class=\"x-alert-content\" *ngIf=\"content\">\r\n      <ng-container *xOutlet=\"content; context: { $iconTpl: iconTpl }\">{{ content }}</ng-container>\r\n    </div>\r\n    <div class=\"x-alert-close\">\r\n      <div class=\"x-alert-operation\" *xOutlet=\"operationTpl\">{{ operationTpl }}</div>\r\n      <x-button\r\n        *ngIf=\"!hideClose\"\r\n        size=\"small\"\r\n        [icon]=\"!closeText ? 'fto-x' : ''\"\r\n        [onlyIcon]=\"!closeText\"\r\n        [type]=\"closeText ? 'text' : 'initial'\"\r\n        (click)=\"onClose()\"\r\n        closable\r\n        >{{ closeText }}</x-button\r\n      >\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["x-alert{display:block}.x-alert{margin:0;padding:0;background-color:var(--x-background);border:.0625rem solid var(--x-border-300);border-radius:var(--x-border-radius);padding:.5rem 1rem;position:relative;display:flex;align-items:center}.x-alert-close{position:absolute;top:.425rem;right:.425rem}.x-alert-inner{width:100%}.x-alert-title.x-bold{font-weight:600}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon.x-icon{font-size:calc(var(--x-font-size) + .25rem);margin-right:.5rem}.x-alert-icon-medium>.x-icon{font-size:1.75rem}.x-alert-draggable .cdk-drag-handle{cursor:move}.x-alert-success.x-light{color:var(--x-success);background-color:var(--x-success-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-light x-button.x-alert-close .x-button{color:var(--x-success-400)}.x-alert-success.x-light x-button.x-alert-close .x-button:hover{color:var(--x-success)}.x-alert-success.x-dark{color:var(--x-success-900);background-color:var(--x-success);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-dark x-button.x-alert-close .x-button{color:var(--x-success-900)}.x-alert-success.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-success.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-success.x-white .x-alert-icon.x-icon{color:var(--x-success)}.x-alert-success.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-success.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-info.x-light{color:var(--x-info);background-color:var(--x-info-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-light x-button.x-alert-close .x-button{color:var(--x-info-400)}.x-alert-info.x-light x-button.x-alert-close .x-button:hover{color:var(--x-info)}.x-alert-info.x-dark{color:var(--x-info-900);background-color:var(--x-info);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-dark x-button.x-alert-close .x-button{color:var(--x-info-900)}.x-alert-info.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-info.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-info.x-white .x-alert-icon.x-icon{color:var(--x-info)}.x-alert-info.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-info.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-warning.x-light{color:var(--x-warning);background-color:var(--x-warning-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-light x-button.x-alert-close .x-button{color:var(--x-warning-400)}.x-alert-warning.x-light x-button.x-alert-close .x-button:hover{color:var(--x-warning)}.x-alert-warning.x-dark{color:var(--x-warning-900);background-color:var(--x-warning);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-dark x-button.x-alert-close .x-button{color:var(--x-warning-900)}.x-alert-warning.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-warning.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-warning.x-white .x-alert-icon.x-icon{color:var(--x-warning)}.x-alert-warning.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-warning.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-error.x-light{color:var(--x-danger);background-color:var(--x-danger-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-light x-button.x-alert-close .x-button{color:var(--x-danger-400)}.x-alert-error.x-light x-button.x-alert-close .x-button:hover{color:var(--x-danger)}.x-alert-error.x-dark{color:var(--x-danger-900);background-color:var(--x-danger);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-dark x-button.x-alert-close .x-button{color:var(--x-danger-900)}.x-alert-error.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-error.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-error.x-white .x-alert-icon.x-icon{color:var(--x-danger)}.x-alert-error.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-error.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}.x-alert-loading.x-light{color:var(--x-primary);background-color:var(--x-info-900);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-light x-button.x-alert-close .x-button{color:var(--x-info-400)}.x-alert-loading.x-light x-button.x-alert-close .x-button:hover{color:var(--x-primary)}.x-alert-loading.x-dark{color:var(--x-info-900);background-color:var(--x-primary);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-dark x-button.x-alert-close .x-button{color:var(--x-info-900)}.x-alert-loading.x-dark x-button.x-alert-close .x-button:hover{color:var(--x-background-100)}.x-alert-loading.x-white{color:var(--x-text-300);background-color:var(--x-background);border-color:transparent;box-shadow:var(--x-box-shadow) var(--x-box-shadow-base-color)}.x-alert-loading.x-white .x-alert-icon.x-icon{color:var(--x-primary)}.x-alert-loading.x-white x-button.x-alert-close .x-button{color:var(--x-text-400)}.x-alert-loading.x-white x-button.x-alert-close .x-button:hover{color:var(--x-text-300)}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.XConfigService }]; }, propDecorators: { alert: [{
@@ -225,10 +225,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
 
 class XAlertModule {
 }
-/** @nocollapse */ XAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0", ngImport: i0, type: XAlertModule, declarations: [XAlertComponent, XAlertProperty], imports: [CommonModule, DragDropModule, XIconModule, XButtonModule, XOutletModule, XResizableModule], exports: [XAlertComponent] });
-/** @nocollapse */ XAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertModule, imports: [CommonModule, DragDropModule, XIconModule, XButtonModule, XOutletModule, XResizableModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAlertModule, decorators: [{
+/** @nocollapse */ XAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.3", ngImport: i0, type: XAlertModule, declarations: [XAlertComponent, XAlertProperty], imports: [CommonModule, DragDropModule, XIconModule, XButtonModule, XOutletModule, XResizableModule], exports: [XAlertComponent] });
+/** @nocollapse */ XAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertModule, imports: [CommonModule, DragDropModule, XIconModule, XButtonModule, XOutletModule, XResizableModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [XAlertComponent, XAlertProperty],
@@ -243,4 +243,3 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
 
 export { XAlertComponent, XAlertModule, XAlertPrefix, XAlertProperty };
 //# sourceMappingURL=ng-nest-ui-alert.mjs.map
-//# sourceMappingURL=ng-nest-ui-alert.mjs.map

package/fesm2020/ng-nest-ui-anchor.mjs

@@ -6,7 +6,7 @@ import { XProperty, XWithConfig, computedStyle, XIsEmpty, XIsUndefined, XIsNumbe
 import * as i2 from '@angular/common';
 import { DOCUMENT, CommonModule } from '@angular/common';
 import { Subject, fromEvent } from 'rxjs';
-import { throttleTime, takeUntil } from 'rxjs/operators';
+import { distinctUntilChanged, takeUntil, throttleTime } from 'rxjs/operators';
 import * as i3 from '@ng-nest/ui/affix';
 import { XAffixModule } from '@ng-nest/ui/affix';
 import * as i4 from '@ng-nest/ui/slider';
@@ -24,8 +24,8 @@ const X_CONFIG_NAME = 'anchor';
  */
 class XAnchorProperty extends XProperty {
 }
-/** @nocollapse */ XAnchorProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XAnchorProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XAnchorProperty, selector: "ng-component", inputs: { scroll: "scroll", affixTop: "affixTop", layout: "layout", justify: "justify" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XAnchorProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAnchorProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAnchorProperty, selector: "ng-component", inputs: { scroll: "scroll", affixTop: "affixTop", layout: "layout", justify: "justify" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XWithConfig(X_CONFIG_NAME, '0')
 ], XAnchorProperty.prototype, "affixTop", void 0);
@@ -35,7 +35,7 @@ __decorate([
 __decorate([
     XWithConfig(X_CONFIG_NAME, 'start')
 ], XAnchorProperty.prototype, "justify", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { scroll: [{
@@ -46,7 +46,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
                 type: Input
             }], justify: [{
                 type: Input
-            }] } });
+            }] } });
+/**
+ * Anchor inner
+ * @selector x-anchor-inner
+ * @decorator component
+ */
+const XAnchorInnerPrefix = 'x-anchor-inner';
+/**
+ * Anchor inner Property
+ */
+class XAnchorInnerProperty {
+}
+/** @nocollapse */ XAnchorInnerProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorInnerProperty, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAnchorInnerProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAnchorInnerProperty, selector: "ng-component", ngImport: i0, template: '', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorInnerProperty, decorators: [{
+            type: Component,
+            args: [{ template: '' }]
+        }] });
 
 class XAnchorComponent extends XAnchorProperty {
     constructor(renderer, elementRef, cdr, doc, configService) {
@@ -57,11 +74,15 @@ class XAnchorComponent extends XAnchorProperty {
         this.configService = configService;
         this.sliderData = [];
         this.activatedIndex = 0;
+        this.contentChange = new Subject();
         this._scrolling = false;
         this._unSubject = new Subject();
         this.document = doc;
         this._fontSize = parseFloat(computedStyle(this.document.documentElement, 'font-size'));
     }
+    ngAfterContentChecked() {
+        this.contentChange.next(this.elementRef.nativeElement.innerHTML);
+    }
     ngOnInit() {
         this.setClassMap();
         this.setSliderData();
@@ -69,6 +90,11 @@ class XAnchorComponent extends XAnchorProperty {
     }
     ngAfterViewInit() {
         this.setScroll();
+        this.contentChange.pipe(distinctUntilChanged(), takeUntil(this._unSubject)).subscribe(() => {
+            this.setSliderData();
+            this.setHeight();
+            this.cdr.detectChanges();
+        });
     }
     ngOnDestroy() {
         this._unSubject.next();
@@ -113,7 +139,7 @@ class XAnchorComponent extends XAnchorProperty {
         this.cdr.detectChanges();
     }
     setSliderData() {
-        this.hElements = this.content.nativeElement.querySelectorAll(':scope> h1,:scope> h2,:scope> h3,:scope> h4,:scope> h5');
+        this.hElements = this.content.nativeElement.querySelectorAll(':scope> h1,:scope> h2,:scope> h3,:scope> h4,:scope> h5,:scope> x-anchor-inner> h1,:scope> x-anchor-inner>h2,:scope> x-anchor-inner>h3,:scope> x-anchor-inner>h4,:scope> x-anchor-inner>h5');
         if (this.hElements.length > 0) {
             let list = [];
             this.hElements.forEach((x, i) => {
@@ -132,6 +158,9 @@ class XAnchorComponent extends XAnchorProperty {
             });
             this.sliderData = list;
         }
+        else {
+            this.sliderData = [];
+        }
     }
     setLeft(element) {
         const eles = ['H1', 'H2', 'H3', 'H4', 'H5'];
@@ -140,12 +169,17 @@ class XAnchorComponent extends XAnchorProperty {
     }
     setHeight() {
         if (this.scroll) {
-            let height = this.scroll.offsetHeight;
-            let top = parseFloat(computedStyle(this.scroll, 'padding-top'));
-            let borderTop = parseFloat(computedStyle(this.scroll, 'border-top'));
-            let bottom = parseFloat(computedStyle(this.scroll, 'padding-bottom'));
-            let borderBottom = parseFloat(computedStyle(this.scroll, 'border-bottom'));
-            this.sliderHeight = height - top - bottom - borderTop - borderBottom - this.getTop();
+            if (XIsEmpty(this.sliderData)) {
+                this.sliderHeight = 0;
+            }
+            else {
+                let height = this.scroll.offsetHeight;
+                let top = parseFloat(computedStyle(this.scroll, 'padding-top'));
+                let borderTop = parseFloat(computedStyle(this.scroll, 'border-top'));
+                let bottom = parseFloat(computedStyle(this.scroll, 'padding-bottom'));
+                let borderBottom = parseFloat(computedStyle(this.scroll, 'border-bottom'));
+                this.sliderHeight = height - top - bottom - borderTop - borderBottom - this.getTop();
+            }
         }
     }
     getTop() {
@@ -174,11 +208,11 @@ class XAnchorComponent extends XAnchorProperty {
         });
     }
 }
-/** @nocollapse */ XAnchorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: XAnchorComponent, selector: "x-anchor", viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #anchor class=\"x-anchor\" [ngClass]=\"classMap\">\r\n  <div #content class=\"x-anchor-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  <x-affix class=\"x-anchor-affix\" [top]=\"affixTop\">\r\n    <div class=\"x-anchor-slider\" [style.height.px]=\"sliderHeight\">\r\n      <x-slider\r\n        [data]=\"sliderData\"\r\n        layout=\"column\"\r\n        [activatedIndex]=\"activatedIndex\"\r\n        [nodeJustify]=\"justify\"\r\n        [nodeTpl]=\"sliderNodeTpl\"\r\n        [showAnchor]=\"true\"\r\n        (indexChange)=\"activatedChange($event)\"\r\n      ></x-slider>\r\n    </div>\r\n  </x-affix>\r\n</div>\r\n\r\n<ng-template #sliderNodeTpl let-node=\"$node\">\r\n  <span [style.padding-left.rem]=\"node.left - 1\">{{ node.label }}</span>\r\n</ng-template>\r\n", styles: [".x-anchor{margin:0;padding:0;display:flex}.x-anchor-content{flex:1}.x-anchor-affix{display:block}.x-anchor-slider{float:left;overflow:hidden}.x-anchor-slider:hover{overflow-y:auto}.x-anchor-right{flex-direction:row}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-left:.125rem solid var(--x-border)}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-left-radius:0;border-bottom-left-radius:0;z-index:2;border-left:.125rem solid var(--x-primary)}.x-anchor-left{flex-direction:row-reverse}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-right:.125rem solid var(--x-border)}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-right-radius:0;border-bottom-right-radius:0;z-index:2;border-right:.125rem solid var(--x-primary)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.XAffixComponent, selector: "x-affix" }, { kind: "component", type: i4.XSliderComponent, selector: "x-slider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorComponent, decorators: [{
+/** @nocollapse */ XAnchorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAnchorComponent, selector: "x-anchor", viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #anchor class=\"x-anchor\" [ngClass]=\"classMap\">\r\n  <div #content class=\"x-anchor-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  <x-affix class=\"x-anchor-affix\" [top]=\"affixTop\">\r\n    <div class=\"x-anchor-slider\" [style.height.px]=\"sliderHeight\">\r\n      <x-slider\r\n        [data]=\"sliderData\"\r\n        layout=\"column\"\r\n        [activatedIndex]=\"activatedIndex\"\r\n        [nodeJustify]=\"justify\"\r\n        [nodeTpl]=\"sliderNodeTpl\"\r\n        [showAnchor]=\"true\"\r\n        (indexChange)=\"activatedChange($event)\"\r\n      ></x-slider>\r\n    </div>\r\n  </x-affix>\r\n</div>\r\n\r\n<ng-template #sliderNodeTpl let-node=\"$node\">\r\n  <span [style.padding-left.rem]=\"node.left - 1\">{{ node.label }}</span>\r\n</ng-template>\r\n", styles: [".x-anchor{margin:0;padding:0;display:flex}.x-anchor-content{flex:1}.x-anchor-affix{display:block}.x-anchor-slider{float:left}.x-anchor-slider:hover{overflow-y:auto}.x-anchor-slider .x-slider{overflow:hidden}.x-anchor-right{flex-direction:row}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-left:.125rem solid var(--x-border)}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-left-radius:0;border-bottom-left-radius:0;z-index:2;border-left:.125rem solid var(--x-primary)}.x-anchor-left{flex-direction:row-reverse}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-right:.125rem solid var(--x-border)}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-right-radius:0;border-bottom-right-radius:0;z-index:2;border-right:.125rem solid var(--x-primary)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.XAffixComponent, selector: "x-affix" }, { kind: "component", type: i4.XSliderComponent, selector: "x-slider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorComponent, decorators: [{
             type: Component,
-            args: [{ selector: `${XAnchorPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #anchor class=\"x-anchor\" [ngClass]=\"classMap\">\r\n  <div #content class=\"x-anchor-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  <x-affix class=\"x-anchor-affix\" [top]=\"affixTop\">\r\n    <div class=\"x-anchor-slider\" [style.height.px]=\"sliderHeight\">\r\n      <x-slider\r\n        [data]=\"sliderData\"\r\n        layout=\"column\"\r\n        [activatedIndex]=\"activatedIndex\"\r\n        [nodeJustify]=\"justify\"\r\n        [nodeTpl]=\"sliderNodeTpl\"\r\n        [showAnchor]=\"true\"\r\n        (indexChange)=\"activatedChange($event)\"\r\n      ></x-slider>\r\n    </div>\r\n  </x-affix>\r\n</div>\r\n\r\n<ng-template #sliderNodeTpl let-node=\"$node\">\r\n  <span [style.padding-left.rem]=\"node.left - 1\">{{ node.label }}</span>\r\n</ng-template>\r\n", styles: [".x-anchor{margin:0;padding:0;display:flex}.x-anchor-content{flex:1}.x-anchor-affix{display:block}.x-anchor-slider{float:left;overflow:hidden}.x-anchor-slider:hover{overflow-y:auto}.x-anchor-right{flex-direction:row}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-left:.125rem solid var(--x-border)}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-left-radius:0;border-bottom-left-radius:0;z-index:2;border-left:.125rem solid var(--x-primary)}.x-anchor-left{flex-direction:row-reverse}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-right:.125rem solid var(--x-border)}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-right-radius:0;border-bottom-right-radius:0;z-index:2;border-right:.125rem solid var(--x-primary)}\n"] }]
+            args: [{ selector: `${XAnchorPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #anchor class=\"x-anchor\" [ngClass]=\"classMap\">\r\n  <div #content class=\"x-anchor-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  <x-affix class=\"x-anchor-affix\" [top]=\"affixTop\">\r\n    <div class=\"x-anchor-slider\" [style.height.px]=\"sliderHeight\">\r\n      <x-slider\r\n        [data]=\"sliderData\"\r\n        layout=\"column\"\r\n        [activatedIndex]=\"activatedIndex\"\r\n        [nodeJustify]=\"justify\"\r\n        [nodeTpl]=\"sliderNodeTpl\"\r\n        [showAnchor]=\"true\"\r\n        (indexChange)=\"activatedChange($event)\"\r\n      ></x-slider>\r\n    </div>\r\n  </x-affix>\r\n</div>\r\n\r\n<ng-template #sliderNodeTpl let-node=\"$node\">\r\n  <span [style.padding-left.rem]=\"node.left - 1\">{{ node.label }}</span>\r\n</ng-template>\r\n", styles: [".x-anchor{margin:0;padding:0;display:flex}.x-anchor-content{flex:1}.x-anchor-affix{display:block}.x-anchor-slider{float:left}.x-anchor-slider:hover{overflow-y:auto}.x-anchor-slider .x-slider{overflow:hidden}.x-anchor-right{flex-direction:row}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-left:.125rem solid var(--x-border)}.x-anchor-right .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-left-radius:0;border-bottom-left-radius:0;z-index:2;border-left:.125rem solid var(--x-primary)}.x-anchor-left{flex-direction:row-reverse}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll{overflow-y:auto}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li{border-right:.125rem solid var(--x-border)}.x-anchor-left .x-anchor-slider .x-slider-column>.x-slider-scroll>ul>li.x-slider-highlight{border:none;border-top-right-radius:0;border-bottom-right-radius:0;z-index:2;border-right:.125rem solid var(--x-primary)}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -190,16 +224,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
                 args: ['content', { static: true }]
             }] } });
 
+class XAnchorInnerComponent extends XAnchorInnerProperty {
+}
+/** @nocollapse */ XAnchorInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorInnerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XAnchorInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: XAnchorInnerComponent, selector: "x-anchor-inner", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorInnerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: `${XAnchorInnerPrefix}`,
+                    template: '<ng-content></ng-content>',
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }] });
+
 class XAnchorModule {
 }
-/** @nocollapse */ XAnchorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XAnchorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0", ngImport: i0, type: XAnchorModule, declarations: [XAnchorComponent, XAnchorProperty], imports: [CommonModule, XAffixModule, XSliderModule], exports: [XAnchorComponent] });
-/** @nocollapse */ XAnchorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorModule, imports: [CommonModule, XAffixModule, XSliderModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: XAnchorModule, decorators: [{
+/** @nocollapse */ XAnchorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XAnchorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.3", ngImport: i0, type: XAnchorModule, declarations: [XAnchorComponent, XAnchorProperty, XAnchorInnerComponent, XAnchorInnerProperty], imports: [CommonModule, XAffixModule, XSliderModule], exports: [XAnchorComponent, XAnchorInnerComponent] });
+/** @nocollapse */ XAnchorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorModule, imports: [CommonModule, XAffixModule, XSliderModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: XAnchorModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [XAnchorComponent, XAnchorProperty],
-                    exports: [XAnchorComponent],
+                    declarations: [XAnchorComponent, XAnchorProperty, XAnchorInnerComponent, XAnchorInnerProperty],
+                    exports: [XAnchorComponent, XAnchorInnerComponent],
                     imports: [CommonModule, XAffixModule, XSliderModule]
                 }]
         }] });
@@ -208,6 +256,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { XAnchorComponent, XAnchorModule, XAnchorPrefix, XAnchorProperty };
-//# sourceMappingURL=ng-nest-ui-anchor.mjs.map
+export { XAnchorComponent, XAnchorInnerComponent, XAnchorInnerPrefix, XAnchorInnerProperty, XAnchorModule, XAnchorPrefix, XAnchorProperty };
 //# sourceMappingURL=ng-nest-ui-anchor.mjs.map