@ng-nest/ui 18.0.0 → 18.0.2

package/esm2022/upload/upload.property.mjs

@@ -101,10 +101,10 @@ export class XUploadProperty extends XFormControlFunction(X_UPLOAD_CONFIG_NAME)
          */
         this.uploadError = output();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XUploadProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.1", type: XUploadProperty, selector: "x-upload-property", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, action: { classPropertyName: "action", publicName: "action", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, imgFallback: { classPropertyName: "imgFallback", publicName: "imgFallback", isSignal: true, isRequired: false, transformFunction: null }, imgCut: { classPropertyName: "imgCut", publicName: "imgCut", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, download: { classPropertyName: "download", publicName: "download", isSignal: true, isRequired: false, transformFunction: null }, multipleModel: { classPropertyName: "multipleModel", publicName: "multipleModel", isSignal: true, isRequired: false, transformFunction: null }, filesTpl: { classPropertyName: "filesTpl", publicName: "filesTpl", isSignal: true, isRequired: false, transformFunction: null }, maxLimit: { classPropertyName: "maxLimit", publicName: "maxLimit", isSignal: true, isRequired: false, transformFunction: null }, headers: { classPropertyName: "headers", publicName: "headers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removeClick: "removeClick", uploadReady: "uploadReady", uploading: "uploading", uploadSuccess: "uploadSuccess", uploadError: "uploadError" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XUploadProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.6", type: XUploadProperty, selector: "x-upload-property", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, action: { classPropertyName: "action", publicName: "action", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, imgFallback: { classPropertyName: "imgFallback", publicName: "imgFallback", isSignal: true, isRequired: false, transformFunction: null }, imgCut: { classPropertyName: "imgCut", publicName: "imgCut", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, download: { classPropertyName: "download", publicName: "download", isSignal: true, isRequired: false, transformFunction: null }, multipleModel: { classPropertyName: "multipleModel", publicName: "multipleModel", isSignal: true, isRequired: false, transformFunction: null }, filesTpl: { classPropertyName: "filesTpl", publicName: "filesTpl", isSignal: true, isRequired: false, transformFunction: null }, maxLimit: { classPropertyName: "maxLimit", publicName: "maxLimit", isSignal: true, isRequired: false, transformFunction: null }, headers: { classPropertyName: "headers", publicName: "headers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removeClick: "removeClick", uploadReady: "uploadReady", uploading: "uploading", uploadSuccess: "uploadSuccess", uploadError: "uploadError" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XUploadProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XUploadProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XUploadPrefix}-property`, template: '' }]
         }] });

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

@@ -18,37 +18,53 @@ class XAffixProperty extends XPropertyFunction(X_AFFIX_CONFIG_NAME) {
         /**
          * @zh_CN 顶部距离
          * @en_US Distance from top
+         * @example
+         *
+         * ```html
+         * <x-affix top="5rem">
+         *   <div>有垂直滚动条，我与顶部距离5rem</div>
+         * </x-affix>
+         * ```
+         *
          */
         this.top = input(this.config?.top, { transform: XToCssPixelValue });
         /**
          * @zh_CN 左边距离
          * @en_US Distance from left
+         * @example
+         *
+         * ```html
+         * <x-affix left="5rem">
+         *   <div>有横向滚动条，我与左边距离5rem</div>
+         * </x-affix>
+         * ```
+         *
          */
         this.left = input(this.config?.left, { transform: XToCssPixelValue });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAffixProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.1", type: XAffixProperty, selector: "x-affix-property", inputs: { top: { classPropertyName: "top", publicName: "top", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.6", type: XAffixProperty, selector: "x-affix-property", inputs: { top: { classPropertyName: "top", publicName: "top", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAffixProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XAffixPrefix}-property`, template: '' }]
         }] });
 
 class XAffixComponent extends XAffixProperty {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAffixComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: XAffixComponent, isStandalone: true, 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 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: XAffixComponent, isStandalone: true, 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: "18.0.1", ngImport: i0, type: XAffixComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XAffixPrefix}`, standalone: true, 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"] }]
         }] });
 
 class XAffixModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAffixModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: XAffixModule, imports: [XAffixComponent], exports: [XAffixComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAffixModule }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.6", ngImport: i0, type: XAffixModule, imports: [XAffixComponent], exports: [XAffixComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAffixModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAffixModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XAffixComponent],

package/fesm2022/ng-nest-ui-affix.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-nest-ui-affix.mjs","sources":["../../../../lib/ng-nest/ui/affix/affix.property.ts","../../../../lib/ng-nest/ui/affix/affix.component.ts","../../../../lib/ng-nest/ui/affix/affix.component.html","../../../../lib/ng-nest/ui/affix/affix.module.ts","../../../../lib/ng-nest/ui/affix/ng-nest-ui-affix.ts"],"sourcesContent":["import { XNumber, XPropertyFunction, XToCssPixelValue } from '@ng-nest/ui/core';\r\nimport { Component, input } from '@angular/core';\r\n\r\n/**\r\n * Affix\r\n * @selector x-affix\r\n * @decorator component\r\n */\r\nexport const XAffixPrefix = 'x-affix';\r\nexport const X_AFFIX_CONFIG_NAME = 'affix';\r\n\r\n/**\r\n * Affix Property\r\n */\r\n@Component({ selector: `${XAffixPrefix}-property`, template: '' })\r\nexport class XAffixProperty extends XPropertyFunction(X_AFFIX_CONFIG_NAME) {\r\n  /**\r\n   * @zh_CN 顶部距离\r\n   * @en_US Distance from top\r\n   */\r\n  readonly top = input<string, XNumber>(this.config?.top!, { transform: XToCssPixelValue });\r\n  /**\r\n   * @zh_CN 左边距离\r\n   * @en_US Distance from left\r\n   */\r\n  readonly left = input<string, XNumber>(this.config?.left!, { transform: XToCssPixelValue });\r\n}\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';\r\nimport { XAffixPrefix, XAffixProperty } from './affix.property';\r\n\r\n@Component({\r\n  selector: `${XAffixPrefix}`,\r\n  standalone: true,\r\n  templateUrl: './affix.component.html',\r\n  styleUrls: ['./affix.component.scss'],\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XAffixComponent extends XAffixProperty {}\r\n","<div #affix class=\"x-affix\" [style.top]=\"top()\" [style.left]=\"left()\">\r\n  <ng-content></ng-content>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { XAffixComponent } from './affix.component';\r\n\r\n@NgModule({\r\n  exports: [XAffixComponent],\r\n  imports: [XAffixComponent]\r\n})\r\nexport class XAffixModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAGA;;;;AAIG;AACI,MAAM,YAAY,GAAG,UAAU;AAC/B,MAAM,mBAAmB,GAAG,QAAQ;AAE3C;;AAEG;MAEU,cAAe,SAAQ,iBAAiB,CAAC,mBAAmB,CAAC,CAAA;AAD1E,IAAA,WAAA,GAAA;;AAEE;;;AAGG;AACM,QAAA,IAAA,CAAA,GAAG,GAAG,KAAK,CAAkB,IAAI,CAAC,MAAM,EAAE,GAAI,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,CAAC;AAC1F;;;AAGG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAkB,IAAI,CAAC,MAAM,EAAE,IAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,CAAC;AAC7F,KAAA;iIAXY,cAAc,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,kUADkC,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAClD,cAAc,EAAA,UAAA,EAAA,CAAA;kBAD1B,SAAS;mBAAC,EAAE,QAAQ,EAAE,CAAG,EAAA,YAAY,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAA;;;ACH3D,MAAO,eAAgB,SAAQ,cAAc,CAAA;iIAAtC,eAAe,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAf,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,0FCX5B,2HAGA,EAAA,MAAA,EAAA,CAAA,qEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDQa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAR3B,SAAS;+BACE,CAAG,EAAA,YAAY,CAAE,CAAA,EAAA,UAAA,EACf,IAAI,EAAA,aAAA,EAGD,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,2HAAA,EAAA,MAAA,EAAA,CAAA,qEAAA,CAAA,EAAA,CAAA;;;MEFpC,YAAY,CAAA;iIAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;kIAAZ,YAAY,EAAA,OAAA,EAAA,CAFb,eAAe,CAAA,EAAA,OAAA,EAAA,CADf,eAAe,CAAA,EAAA,CAAA,CAAA,EAAA;kIAGd,YAAY,EAAA,CAAA,CAAA,EAAA;;2FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,eAAe,CAAC;oBAC1B,OAAO,EAAE,CAAC,eAAe,CAAC;AAC3B,iBAAA,CAAA;;;ACND;;AAEG;;;;"}
+{"version":3,"file":"ng-nest-ui-affix.mjs","sources":["../../../../lib/ng-nest/ui/affix/affix.property.ts","../../../../lib/ng-nest/ui/affix/affix.component.ts","../../../../lib/ng-nest/ui/affix/affix.component.html","../../../../lib/ng-nest/ui/affix/affix.module.ts","../../../../lib/ng-nest/ui/affix/ng-nest-ui-affix.ts"],"sourcesContent":["import { XNumber, XPropertyFunction, XToCssPixelValue } from '@ng-nest/ui/core';\r\nimport { Component, input } from '@angular/core';\r\n\r\n/**\r\n * Affix\r\n * @selector x-affix\r\n * @decorator component\r\n */\r\nexport const XAffixPrefix = 'x-affix';\r\nexport const X_AFFIX_CONFIG_NAME = 'affix';\r\n\r\n/**\r\n * Affix Property\r\n */\r\n@Component({ selector: `${XAffixPrefix}-property`, template: '' })\r\nexport class XAffixProperty extends XPropertyFunction(X_AFFIX_CONFIG_NAME) {\r\n  /**\r\n   * @zh_CN 顶部距离\r\n   * @en_US Distance from top\r\n   * @example\r\n   * \r\n   * ```html\r\n   * <x-affix top=\"5rem\">\r\n   *   <div>有垂直滚动条，我与顶部距离5rem</div>\r\n   * </x-affix>\r\n   * ```\r\n   * \r\n   */\r\n  readonly top = input<string, XNumber>(this.config?.top!, { transform: XToCssPixelValue });\r\n  /**\r\n   * @zh_CN 左边距离\r\n   * @en_US Distance from left\r\n   * @example\r\n   * \r\n   * ```html\r\n   * <x-affix left=\"5rem\">\r\n   *   <div>有横向滚动条，我与左边距离5rem</div>\r\n   * </x-affix>\r\n   * ```\r\n   * \r\n   */\r\n  readonly left = input<string, XNumber>(this.config?.left!, { transform: XToCssPixelValue });\r\n}\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';\r\nimport { XAffixPrefix, XAffixProperty } from './affix.property';\r\n\r\n@Component({\r\n  selector: `${XAffixPrefix}`,\r\n  standalone: true,\r\n  templateUrl: './affix.component.html',\r\n  styleUrls: ['./affix.component.scss'],\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XAffixComponent extends XAffixProperty {}\r\n","<div #affix class=\"x-affix\" [style.top]=\"top()\" [style.left]=\"left()\">\r\n  <ng-content></ng-content>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { XAffixComponent } from './affix.component';\r\n\r\n@NgModule({\r\n  exports: [XAffixComponent],\r\n  imports: [XAffixComponent]\r\n})\r\nexport class XAffixModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAGA;;;;AAIG;AACI,MAAM,YAAY,GAAG,UAAU;AAC/B,MAAM,mBAAmB,GAAG,QAAQ;AAE3C;;AAEG;MAEU,cAAe,SAAQ,iBAAiB,CAAC,mBAAmB,CAAC,CAAA;AAD1E,IAAA,WAAA,GAAA;;AAEE;;;;;;;;;;;AAWG;AACM,QAAA,IAAA,CAAA,GAAG,GAAG,KAAK,CAAkB,IAAI,CAAC,MAAM,EAAE,GAAI,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,CAAC;AAC1F;;;;;;;;;;;AAWG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAkB,IAAI,CAAC,MAAM,EAAE,IAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,CAAC;AAC7F,KAAA;iIA3BY,cAAc,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,kUADkC,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAClD,cAAc,EAAA,UAAA,EAAA,CAAA;kBAD1B,SAAS;mBAAC,EAAE,QAAQ,EAAE,CAAG,EAAA,YAAY,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAA;;;ACH3D,MAAO,eAAgB,SAAQ,cAAc,CAAA;iIAAtC,eAAe,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAf,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,0FCX5B,2HAGA,EAAA,MAAA,EAAA,CAAA,qEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDQa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAR3B,SAAS;+BACE,CAAG,EAAA,YAAY,CAAE,CAAA,EAAA,UAAA,EACf,IAAI,EAAA,aAAA,EAGD,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,2HAAA,EAAA,MAAA,EAAA,CAAA,qEAAA,CAAA,EAAA,CAAA;;;MEFpC,YAAY,CAAA;iIAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;kIAAZ,YAAY,EAAA,OAAA,EAAA,CAFb,eAAe,CAAA,EAAA,OAAA,EAAA,CADf,eAAe,CAAA,EAAA,CAAA,CAAA,EAAA;kIAGd,YAAY,EAAA,CAAA,CAAA,EAAA;;2FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,eAAe,CAAC;oBAC1B,OAAO,EAAE,CAAC,eAAe,CAAC;AAC3B,iBAAA,CAAA;;;ACND;;AAEG;;;;"}

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

@@ -27,125 +27,296 @@ class XAlertProperty extends XPropertyFunction(X_ALERT_CONFIG_NAME) {
         /**
          * @zh_CN 隐藏
          * @en_US Hide
+         * @example
+         *
+         * ```html
+         * <x-alert title="隐藏，看不见" hide> </x-alert>
+         * ```
+         *
          */
         this.hide = input(false, { transform: XToBoolean });
         /**
          * @zh_CN 标题
          * @en_US Title
+         * @example
+         *
+         * ```html
+         * <x-alert title="Title" > </x-alert>
+         * ```
+         *
          */
         this.title = input();
         /**
          * @zh_CN 内容
          * @en_US Content
+         * @example
+         *
+         * ```html
+         * <x-alert content="Content" > </x-alert>
+         * ```
+         *
          */
         this.content = input();
         /**
          * @zh_CN 类型
          * @en_US Alert type
+         * @example
+         *
+         * ```html
+         * <x-alert type="success" > </x-alert>
+         * <x-alert type="info" > </x-alert>
+         * <x-alert type="warning" > </x-alert>
+         * <x-alert type="error" > </x-alert>
+         * <x-alert type="loading" > </x-alert>
+         * ```
+         *
          */
         this.type = input('info');
         /**
          * @zh_CN 主题
          * @en_US Theme
+         * @example
+         *
+         * ```html
+         * <x-alert effect="light" > </x-alert>
+         * <x-alert effect="dark" > </x-alert>
+         * <x-alert effect="white" > </x-alert>
+         * ```
+         *
          */
         this.effect = input(this.config?.effect ?? 'light');
         /**
          * @zh_CN 隐藏关闭按钮
          * @en_US Hide close button
+         * @example
+         *
+         * ```html
+         * <x-alert title="no close button" hideClose> </x-alert>
+         * ```
+         *
          */
         this.hideClose = input(this.config?.hideClose ?? false, { transform: XToBoolean });
         /**
          * @zh_CN 使用文本关闭按钮
          * @en_US Use the text to close button
+         * @example
+         *
+         * ```html
+         * <x-alert title="close button is text" closeText="close"> </x-alert>
+         * ```
+         *
          */
         this.closeText = input();
         /**
          * @zh_CN 显示图标
          * @en_US Show icon
+         * @example
+         *
+         * ```html
+         * <x-alert type="success" showIcon> </x-alert>
+         * <x-alert type="info" showIcon> </x-alert>
+         * <x-alert type="warning" showIcon> </x-alert>
+         * <x-alert type="error" showIcon> </x-alert>
+         * <x-alert type="loading" showIcon> </x-alert>
+         * ```
+         *
          */
         this.showIcon = input(this.config?.showIcon ?? false, { transform: XToBoolean });
         /**
          * @zh_CN 禁用动画
          * @en_US Disable animation
+         * @example
+         *
+         * ```html
+         * <x-alert title="disabled animation" disabledAnimation> </x-alert>
+         * ```
+         *
          */
         this.disabledAnimation = input(this.config?.disabledAnimation ?? false, {
             transform: XToBoolean
         });
         /**
-         * @zh_CN 延迟关闭，默认 0 表示不关闭
-         * @en_US Delay close, the default value of 0 means do not close
+         * @zh_CN 延迟关闭，默认 0 表示不关闭，ms
+         * @en_US Delay close, the default value of 0 means do not close. ms
+         * @example
+         *
+         * ```html
+         * <x-alert title="duration close" duration="1000"> </x-alert>
+         * ```
+         *
          */
         this.duration = input(this.config?.duration ?? 0, { transform: XToNumber });
         /**
          * @zh_CN 手动处理关闭事件
          * @en_US Manually handle close events
+         * @example
+         *
+         * ```html
+         * <x-alert title="manual close" manual> </x-alert>
+         * ```
+         *
          */
         this.manual = input(false, { transform: XToBoolean });
         /**
          * @zh_CN 拖动提示框
          * @en_US Drag dialog
+         * @example
+         *
+         * ```html
+         * <x-alert title="draggable alert" draggable> </x-alert>
+         * ```
+         *
          */
         this.draggable = input(this.config?.draggable ?? false, { transform: XToBoolean });
         /**
          * @zh_CN 调整提示框大小
          * @en_US Adjust the size of the box
+         * @example
+         *
+         * ```html
+         * <x-alert title="resizable alert" resizable> </x-alert>
+         * ```
+         *
          */
         this.resizable = input(this.config?.resizable ?? false, { transform: XToBoolean });
         /**
          * @zh_CN 开启 resizable 调整大小，偏移屏幕左边
          * @en_US Open the resizable resize, offset screen left
+         * @example
+         *
+         * ```html
+         * <x-alert title="resizable alert" resizable offsetLeft="100"> </x-alert>
+         * ```
+         *
          */
         this.offsetLeft = input(0, { transform: XToNumber });
         /**
          * @zh_CN 开启 resizable 调整大小，偏移屏幕顶部
          * @en_US Open the resizable resize, offset screen top
+         * @example
+         *
+         * ```html
+         * <x-alert title="resizable alert" resizable offsetTop="100"> </x-alert>
+         * ```
+         *
          */
         this.offsetTop = input(0, { transform: XToNumber });
         /**
          * @zh_CN 最小宽度
          * @en_US Min width
+         * @example
+         *
+         * ```html
+         * <x-alert title="alert min-width" minWidth="100"> </x-alert>
+         * ```
+         *
          */
         this.minWidth = input(this.config?.minWidth ?? '0', { transform: XToCssPixelValue });
         /**
          * @zh_CN 最小高度
          * @en_US Min height
+         * @example
+         *
+         * ```html
+         * <x-alert title="alert min-height" minHeight="100"> </x-alert>
+         * ```
+         *
          */
         this.minHeight = input(this.config?.minHeight ?? '0', { transform: XToCssPixelValue });
         /**
          * @zh_CN 拖动范围限制，父节点选择器或者对象
          * @en_US Drag dialog
+         * @example
+         *
+         * ```html
+         * <div #element style="width:300px; height: 300px">
+         *   <x-alert title="draggable boundary" draggable [dragBoundary]="element"> </x-alert>
+         * </div>
+         * ```
+         *
          */
         this.dragBoundary = input();
         /**
          * @zh_CN 设置投放容器外部的 CdkDrag 的位置。可用于为返回的用户恢复元素的位置
          * @en_US Set the location of the CDKDRAG outside the container. Can be used to recover elements for returned users
+         * @example
+         *
+         * ```html
+         * <x-alert title="draggable boundary" draggable [dragFreeDragPosition]="{ x: 100, y: 100 }"> </x-alert>
+         * ```
+         *
          */
         this.dragFreeDragPosition = input();
         /**
          * @zh_CN 自定义操作
          * @en_US Custom operation
+         * @example
+         *
+         * ```html
+         * <x-alert title="operation template" [operationTpl]="operationTpl"> </x-alert>
+         * <ng-template #operationTpl>
+         *   <x-button>Button</x-button>
+         * </ng-template>
+         * ```
+         *
          */
         this.operationTpl = input();
         /**
          * @zh_CN 关闭的事件
-         * @en_US Closed events
+         * @en_US Closed event
+         * @example
+         *
+         * ```html
+         * <x-alert title="operation template" (close)="close()"> </x-alert>
+         * ```
+         *
+         * ```typescript
+         * close() {
+         *   console.log("close")
+         * }
+         * ```
+         *
          */
         this.close = output();
         /**
          * @zh_CN 拖动结束的事件
          * @en_US Drag end event
+         * @example
+         *
+         * ```html
+         * <x-alert title="draggable event" draggable (dragEnded)="dragEnded($event)"> </x-alert>
+         * ```
+         *
+         * ```typescript
+         * dragEnded(event: CdkDragEnd) {
+         *   console.log(event)
+         * }
+         * ```
+         *
          */
         this.dragEnded = output();
         /**
          * @zh_CN 改变尺寸事件
          * @en_US Change the size event
+         * @example
+         *
+         * ```html
+         * <x-alert title="resizable event" resizable (resizing)="resizing($event)"> </x-alert>
+         * ```
+         *
+         * ```typescript
+         * resizing(event: XResizableEvent) {
+         *   console.log(event)
+         * }
+         * ```
+         *
          */
         this.resizing = output();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.1", type: XAlertProperty, selector: "x-alert-property", inputs: { hide: { classPropertyName: "hide", publicName: "hide", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, effect: { classPropertyName: "effect", publicName: "effect", isSignal: true, isRequired: false, transformFunction: null }, hideClose: { classPropertyName: "hideClose", publicName: "hideClose", isSignal: true, isRequired: false, transformFunction: null }, closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, disabledAnimation: { classPropertyName: "disabledAnimation", publicName: "disabledAnimation", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, manual: { classPropertyName: "manual", publicName: "manual", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, offsetLeft: { classPropertyName: "offsetLeft", publicName: "offsetLeft", isSignal: true, isRequired: false, transformFunction: null }, offsetTop: { classPropertyName: "offsetTop", publicName: "offsetTop", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, dragBoundary: { classPropertyName: "dragBoundary", publicName: "dragBoundary", isSignal: true, isRequired: false, transformFunction: null }, dragFreeDragPosition: { classPropertyName: "dragFreeDragPosition", publicName: "dragFreeDragPosition", isSignal: true, isRequired: false, transformFunction: null }, operationTpl: { classPropertyName: "operationTpl", publicName: "operationTpl", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", dragEnded: "dragEnded", resizing: "resizing" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.6", type: XAlertProperty, selector: "x-alert-property", inputs: { hide: { classPropertyName: "hide", publicName: "hide", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, effect: { classPropertyName: "effect", publicName: "effect", isSignal: true, isRequired: false, transformFunction: null }, hideClose: { classPropertyName: "hideClose", publicName: "hideClose", isSignal: true, isRequired: false, transformFunction: null }, closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, disabledAnimation: { classPropertyName: "disabledAnimation", publicName: "disabledAnimation", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, manual: { classPropertyName: "manual", publicName: "manual", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, offsetLeft: { classPropertyName: "offsetLeft", publicName: "offsetLeft", isSignal: true, isRequired: false, transformFunction: null }, offsetTop: { classPropertyName: "offsetTop", publicName: "offsetTop", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, dragBoundary: { classPropertyName: "dragBoundary", publicName: "dragBoundary", isSignal: true, isRequired: false, transformFunction: null }, dragFreeDragPosition: { classPropertyName: "dragFreeDragPosition", publicName: "dragFreeDragPosition", isSignal: true, isRequired: false, transformFunction: null }, operationTpl: { classPropertyName: "operationTpl", publicName: "operationTpl", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", dragEnded: "dragEnded", resizing: "resizing" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XAlertPrefix}-property`, template: '' }]
         }] });
@@ -191,10 +362,10 @@ class XAlertComponent extends XAlertProperty {
             this.close.emit();
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: XAlertComponent, isStandalone: true, selector: "x-alert", usesInheritance: true, ngImport: i0, template: "@if (!styleHide() && !hide()) {\r\n  <div\r\n    class=\"x-alert\"\r\n    [class.x-alert-has-close]=\"!hideClose()\"\r\n    [class.x-alert-icon-content]=\"showIcon() && content()\"\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    @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    @if (showIcon()) {\r\n      <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n    }\r\n    <ng-template #iconTpl>\r\n      @switch (type()) {\r\n        @case ('success') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-check-circle\"></x-icon>\r\n        }\r\n        @case ('info') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-info-circle\"></x-icon>\r\n        }\r\n        @case ('warning') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-exclamation-circle\"></x-icon>\r\n        }\r\n        @case ('error') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-close-circle\"></x-icon>\r\n        }\r\n        @case ('loading') {\r\n          <x-icon class=\"x-alert-icon\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n        }\r\n      }\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      @if (content()) {\r\n        <div class=\"x-alert-content\">\r\n          <ng-container *xOutlet=\"content(); context: { $iconTpl: iconTpl }\">{{ content() }}</ng-container>\r\n        </div>\r\n      }\r\n      <div class=\"x-alert-close\">\r\n        <div class=\"x-alert-operation\" *xOutlet=\"operationTpl()\">{{ operationTpl() }}</div>\r\n        @if (!hideClose()) {\r\n          <x-button size=\"small\" [icon]=\"!closeText() ? 'fto-x' : ''\" [type]=\"'text'\" (click)=\"onClose()\" closable>{{\r\n            closeText()\r\n          }}</x-button>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\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-has-close .x-alert-title{margin-right:1.425rem}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon-content{align-items:flex-start}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1.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: i1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "directive", type: XResizableDirective, selector: "[xResizable]" }], animations: [XFadeAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: XAlertComponent, isStandalone: true, selector: "x-alert", usesInheritance: true, ngImport: i0, template: "@if (!styleHide() && !hide()) {\r\n  <div\r\n    class=\"x-alert\"\r\n    [class.x-alert-has-close]=\"!hideClose()\"\r\n    [class.x-alert-icon-content]=\"showIcon() && content()\"\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    @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    @if (showIcon()) {\r\n      <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n    }\r\n    <ng-template #iconTpl>\r\n      @switch (type()) {\r\n        @case ('success') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-check-circle\"></x-icon>\r\n        }\r\n        @case ('info') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-info-circle\"></x-icon>\r\n        }\r\n        @case ('warning') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-exclamation-circle\"></x-icon>\r\n        }\r\n        @case ('error') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-close-circle\"></x-icon>\r\n        }\r\n        @case ('loading') {\r\n          <x-icon class=\"x-alert-icon\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n        }\r\n      }\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      @if (content()) {\r\n        <div class=\"x-alert-content\">\r\n          <ng-container *xOutlet=\"content(); context: { $iconTpl: iconTpl }\">{{ content() }}</ng-container>\r\n        </div>\r\n      }\r\n      <div class=\"x-alert-close\">\r\n        <div class=\"x-alert-operation\" *xOutlet=\"operationTpl()\">{{ operationTpl() }}</div>\r\n        @if (!hideClose()) {\r\n          <x-button size=\"small\" [icon]=\"!closeText() ? 'fto-x' : ''\" [type]=\"'text'\" (click)=\"onClose()\" closable>\r\n            {{ closeText() }}\r\n          </x-button>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\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-has-close .x-alert-title{margin-right:1.425rem}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon-content{align-items:flex-start}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i1.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: i1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "directive", type: XResizableDirective, selector: "[xResizable]" }], animations: [XFadeAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XAlertPrefix}`, standalone: true, imports: [
                         NgClass,
@@ -204,15 +375,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
                         XButtonComponent,
                         XOutletDirective,
                         XResizableDirective
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [XFadeAnimation], template: "@if (!styleHide() && !hide()) {\r\n  <div\r\n    class=\"x-alert\"\r\n    [class.x-alert-has-close]=\"!hideClose()\"\r\n    [class.x-alert-icon-content]=\"showIcon() && content()\"\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    @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    @if (showIcon()) {\r\n      <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n    }\r\n    <ng-template #iconTpl>\r\n      @switch (type()) {\r\n        @case ('success') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-check-circle\"></x-icon>\r\n        }\r\n        @case ('info') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-info-circle\"></x-icon>\r\n        }\r\n        @case ('warning') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-exclamation-circle\"></x-icon>\r\n        }\r\n        @case ('error') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-close-circle\"></x-icon>\r\n        }\r\n        @case ('loading') {\r\n          <x-icon class=\"x-alert-icon\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n        }\r\n      }\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      @if (content()) {\r\n        <div class=\"x-alert-content\">\r\n          <ng-container *xOutlet=\"content(); context: { $iconTpl: iconTpl }\">{{ content() }}</ng-container>\r\n        </div>\r\n      }\r\n      <div class=\"x-alert-close\">\r\n        <div class=\"x-alert-operation\" *xOutlet=\"operationTpl()\">{{ operationTpl() }}</div>\r\n        @if (!hideClose()) {\r\n          <x-button size=\"small\" [icon]=\"!closeText() ? 'fto-x' : ''\" [type]=\"'text'\" (click)=\"onClose()\" closable>{{\r\n            closeText()\r\n          }}</x-button>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\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-has-close .x-alert-title{margin-right:1.425rem}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon-content{align-items:flex-start}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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"] }]
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [XFadeAnimation], template: "@if (!styleHide() && !hide()) {\r\n  <div\r\n    class=\"x-alert\"\r\n    [class.x-alert-has-close]=\"!hideClose()\"\r\n    [class.x-alert-icon-content]=\"showIcon() && content()\"\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    @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    @if (showIcon()) {\r\n      <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n    }\r\n    <ng-template #iconTpl>\r\n      @switch (type()) {\r\n        @case ('success') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-check-circle\"></x-icon>\r\n        }\r\n        @case ('info') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-info-circle\"></x-icon>\r\n        }\r\n        @case ('warning') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-exclamation-circle\"></x-icon>\r\n        }\r\n        @case ('error') {\r\n          <x-icon class=\"x-alert-icon\" type=\"adf-close-circle\"></x-icon>\r\n        }\r\n        @case ('loading') {\r\n          <x-icon class=\"x-alert-icon\" type=\"fto-loader\" [spin]=\"true\"></x-icon>\r\n        }\r\n      }\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      @if (content()) {\r\n        <div class=\"x-alert-content\">\r\n          <ng-container *xOutlet=\"content(); context: { $iconTpl: iconTpl }\">{{ content() }}</ng-container>\r\n        </div>\r\n      }\r\n      <div class=\"x-alert-close\">\r\n        <div class=\"x-alert-operation\" *xOutlet=\"operationTpl()\">{{ operationTpl() }}</div>\r\n        @if (!hideClose()) {\r\n          <x-button size=\"small\" [icon]=\"!closeText() ? 'fto-x' : ''\" [type]=\"'text'\" (click)=\"onClose()\" closable>\r\n            {{ closeText() }}\r\n          </x-button>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n}\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-has-close .x-alert-title{margin-right:1.425rem}.x-alert-content{font-size:calc(var(--x-font-size) - .0625rem);line-height:1.325rem;margin:.25rem 0 0}.x-alert-icon-content{align-items:flex-start}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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)}.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: () => [] });
 
 class XAlertModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: XAlertModule, imports: [XAlertComponent], exports: [XAlertComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertModule, imports: [XAlertComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.6", ngImport: i0, type: XAlertModule, imports: [XAlertComponent], exports: [XAlertComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertModule, imports: [XAlertComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XAlertModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: XAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XAlertComponent],