npm - @ng-nest/ui - Versions diffs - 18.0.8 → 18.0.9 - Mend

@ng-nest/ui 18.0.8 → 18.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (151) hide show

package/alert/alert.component.d.ts +3 -3
package/auto-complete/auto-complete-portal.component.d.ts +6 -9
package/auto-complete/auto-complete.component.d.ts +1 -0
package/cascade/cascade-portal.component.d.ts +7 -9
package/cascade/cascade.component.d.ts +1 -9
package/cascade/cascade.property.d.ts +5 -2
package/checkbox/checkbox.property.d.ts +10 -98
package/color-picker/color-picker-portal.component.d.ts +6 -9
package/core/functions/convert.d.ts +5 -0
package/core/util/public-api.d.ts +1 -0
package/core/util/sleep.d.ts +5 -0
package/date-picker/date-picker-portal.component.d.ts +5 -6
package/date-picker/date-picker.property.d.ts +1 -31
package/date-picker/date-range-portal.component.d.ts +5 -6
package/dialog/dialog.component.d.ts +4 -3
package/dropdown/dropdown-portal.component.d.ts +5 -7
package/esm2022/alert/alert.component.mjs +13 -10
package/esm2022/auto-complete/auto-complete-portal.component.mjs +17 -10
package/esm2022/auto-complete/auto-complete.component.mjs +7 -4
package/esm2022/back-top/back-top.component.mjs +4 -2
package/esm2022/cascade/cascade-portal.component.mjs +20 -11
package/esm2022/cascade/cascade.component.mjs +5 -3
package/esm2022/cascade/cascade.property.mjs +2 -2
package/esm2022/checkbox/checkbox.property.mjs +3 -43
package/esm2022/color-picker/color-picker-portal.component.mjs +17 -10
package/esm2022/color-picker/color-picker.component.mjs +3 -3
package/esm2022/color-picker/color-picker.property.mjs +3 -3
package/esm2022/core/functions/convert.mjs +15 -1
package/esm2022/core/util/public-api.mjs +2 -1
package/esm2022/core/util/sleep.mjs +8 -0
package/esm2022/date-picker/date-picker-portal.component.mjs +17 -6
package/esm2022/date-picker/date-picker.component.mjs +3 -3
package/esm2022/date-picker/date-picker.property.mjs +2 -17
package/esm2022/date-picker/date-range-portal.component.mjs +17 -6
package/esm2022/date-picker/date-range.component.mjs +3 -3
package/esm2022/dialog/dialog.component.mjs +23 -18
package/esm2022/dropdown/dropdown-portal.component.mjs +17 -8
package/esm2022/dropdown/dropdown.component.mjs +3 -3
package/esm2022/find/find.component.mjs +15 -8
package/esm2022/find/find.property.mjs +7 -57
package/esm2022/form/form.component.mjs +3 -3
package/esm2022/form/form.property.mjs +3 -3
package/esm2022/highlight/highlight.component.mjs +3 -3
package/esm2022/icon/icon.component.mjs +2 -2
package/esm2022/image/image.component.mjs +3 -3
package/esm2022/input/input.component.mjs +3 -3
package/esm2022/input-number/input-number.component.mjs +3 -3
package/esm2022/input-number/input-number.property.mjs +3 -23
package/esm2022/loading/loading.component.mjs +3 -3
package/esm2022/loading/loading.property.mjs +5 -5
package/esm2022/radio/radio.property.mjs +3 -53
package/esm2022/rate/rate.property.mjs +3 -58
package/esm2022/select/select-portal.component.mjs +17 -10
package/esm2022/select/select.component.mjs +15 -5
package/esm2022/select/select.property.mjs +2 -2
package/esm2022/slider-select/slider-select.property.mjs +3 -58
package/esm2022/switch/switch.property.mjs +3 -58
package/esm2022/table/table-body.component.mjs +5 -4
package/esm2022/table/table.component.mjs +3 -3
package/esm2022/table/table.property.mjs +14 -4
package/esm2022/textarea/textarea.property.mjs +3 -38
package/esm2022/time-picker/time-picker-portal.component.mjs +17 -6
package/esm2022/time-picker/time-picker.component.mjs +3 -3
package/esm2022/time-picker/time-picker.property.mjs +3 -3
package/esm2022/transfer/transfer.component.mjs +3 -3
package/esm2022/tree/tree-node.component.mjs +10 -2
package/esm2022/tree/tree.component.mjs +11 -9
package/esm2022/tree/tree.property.mjs +1 -1
package/esm2022/tree/tree.service.mjs +28 -4
package/esm2022/tree-select/tree-select-portal.component.mjs +17 -6
package/esm2022/tree-select/tree-select.component.mjs +20 -4
package/fesm2022/ng-nest-ui-alert.mjs +12 -9
package/fesm2022/ng-nest-ui-alert.mjs.map +1 -1
package/fesm2022/ng-nest-ui-auto-complete.mjs +21 -11
package/fesm2022/ng-nest-ui-auto-complete.mjs.map +1 -1
package/fesm2022/ng-nest-ui-back-top.mjs +3 -1
package/fesm2022/ng-nest-ui-back-top.mjs.map +1 -1
package/fesm2022/ng-nest-ui-cascade.mjs +24 -13
package/fesm2022/ng-nest-ui-cascade.mjs.map +1 -1
package/fesm2022/ng-nest-ui-checkbox.mjs +2 -42
package/fesm2022/ng-nest-ui-checkbox.mjs.map +1 -1
package/fesm2022/ng-nest-ui-color-picker.mjs +20 -13
package/fesm2022/ng-nest-ui-color-picker.mjs.map +1 -1
package/fesm2022/ng-nest-ui-core.mjs +23 -1
package/fesm2022/ng-nest-ui-core.mjs.map +1 -1
package/fesm2022/ng-nest-ui-date-picker.mjs +36 -29
package/fesm2022/ng-nest-ui-date-picker.mjs.map +1 -1
package/fesm2022/ng-nest-ui-dialog.mjs +22 -17
package/fesm2022/ng-nest-ui-dialog.mjs.map +1 -1
package/fesm2022/ng-nest-ui-dropdown.mjs +19 -10
package/fesm2022/ng-nest-ui-dropdown.mjs.map +1 -1
package/fesm2022/ng-nest-ui-find.mjs +20 -63
package/fesm2022/ng-nest-ui-find.mjs.map +1 -1
package/fesm2022/ng-nest-ui-form.mjs +4 -4
package/fesm2022/ng-nest-ui-form.mjs.map +1 -1
package/fesm2022/ng-nest-ui-highlight.mjs +2 -2
package/fesm2022/ng-nest-ui-highlight.mjs.map +1 -1
package/fesm2022/ng-nest-ui-icon.mjs +1 -1
package/fesm2022/ng-nest-ui-icon.mjs.map +1 -1
package/fesm2022/ng-nest-ui-image.mjs +2 -2
package/fesm2022/ng-nest-ui-image.mjs.map +1 -1
package/fesm2022/ng-nest-ui-input-number.mjs +4 -24
package/fesm2022/ng-nest-ui-input-number.mjs.map +1 -1
package/fesm2022/ng-nest-ui-input.mjs +2 -2
package/fesm2022/ng-nest-ui-input.mjs.map +1 -1
package/fesm2022/ng-nest-ui-loading.mjs +6 -6
package/fesm2022/ng-nest-ui-loading.mjs.map +1 -1
package/fesm2022/ng-nest-ui-radio.mjs +2 -52
package/fesm2022/ng-nest-ui-radio.mjs.map +1 -1
package/fesm2022/ng-nest-ui-rate.mjs +2 -57
package/fesm2022/ng-nest-ui-rate.mjs.map +1 -1
package/fesm2022/ng-nest-ui-select.mjs +31 -14
package/fesm2022/ng-nest-ui-select.mjs.map +1 -1
package/fesm2022/ng-nest-ui-slider-select.mjs +2 -57
package/fesm2022/ng-nest-ui-slider-select.mjs.map +1 -1
package/fesm2022/ng-nest-ui-switch.mjs +2 -57
package/fesm2022/ng-nest-ui-switch.mjs.map +1 -1
package/fesm2022/ng-nest-ui-table.mjs +19 -8
package/fesm2022/ng-nest-ui-table.mjs.map +1 -1
package/fesm2022/ng-nest-ui-textarea.mjs +2 -37
package/fesm2022/ng-nest-ui-textarea.mjs.map +1 -1
package/fesm2022/ng-nest-ui-time-picker.mjs +20 -9
package/fesm2022/ng-nest-ui-time-picker.mjs.map +1 -1
package/fesm2022/ng-nest-ui-transfer.mjs +2 -2
package/fesm2022/ng-nest-ui-transfer.mjs.map +1 -1
package/fesm2022/ng-nest-ui-tree-select.mjs +35 -8
package/fesm2022/ng-nest-ui-tree-select.mjs.map +1 -1
package/fesm2022/ng-nest-ui-tree.mjs +46 -12
package/fesm2022/ng-nest-ui-tree.mjs.map +1 -1
package/find/find.component.d.ts +2 -0
package/find/find.property.d.ts +20 -97
package/form/form.property.d.ts +4 -4
package/input-number/input-number.property.d.ts +4 -56
package/loading/loading.property.d.ts +4 -4
package/package.json +157 -157
package/radio/radio.property.d.ts +10 -118
package/rate/rate.property.d.ts +16 -121
package/select/select-portal.component.d.ts +6 -9
package/select/select.component.d.ts +3 -1
package/slider-select/slider-select.property.d.ts +6 -113
package/switch/switch.property.d.ts +2 -117
package/table/table-body.component.d.ts +1 -1
package/table/table.property.d.ts +13 -3
package/textarea/textarea.property.d.ts +10 -45
package/time-picker/time-picker-portal.component.d.ts +5 -6
package/time-picker/time-picker.property.d.ts +1 -2
package/tree/tree.component.d.ts +2 -3
package/tree/tree.property.d.ts +1 -1
package/tree/tree.service.d.ts +1 -1
package/tree-select/tree-select-portal.component.d.ts +5 -6
package/tree-select/tree-select.component.d.ts +7 -4

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, output, Component, signal, computed, inject, PLATFORM_ID, effect, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import { input, output, Component, signal, computed, inject, PLATFORM_ID, DestroyRef, effect, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
 import { XPropertyFunction, XToBoolean, XToNumber, XToCssPixelValue, XIsEmpty, XFadeAnimation } from '@ng-nest/ui/core';
 import { Subject, of } from 'rxjs';
 import { delay, takeUntil } from 'rxjs/operators';
@@ -333,11 +333,14 @@ class XAlertComponent extends XAlertProperty {
         }));
         this.unSubject = new Subject();
         this.isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+        this.destoryRef = inject(DestroyRef);
+        this.destory = signal(false);
         effect(() => this.setDuration());
-    }
-    ngOnDestroy() {
-        this.unSubject.next();
-        this.unSubject.complete();
+        this.destoryRef.onDestroy(() => {
+            this.destory.set(true);
+            this.unSubject.next();
+            this.unSubject.complete();
+        });
     }
     setDuration() {
         if (this.duration() && this.isBrowser) {
@@ -351,7 +354,7 @@ class XAlertComponent extends XAlertProperty {
     }
     onClose() {
         if (this.manual()) {
-            this.close.emit();
+            !this.destory() && this.close.emit();
         }
         else {
             this.styleHide.set(true);
@@ -359,11 +362,11 @@ class XAlertComponent extends XAlertProperty {
     }
     onCloseAnimationDone() {
         if (this.hide()) {
-            this.close.emit();
+            !this.destory() && this.close.emit();
         }
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.2", 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}.x-alert{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", "cdkDragScale"], 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.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.2", 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 class=\"x-alert-operation-close\" 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}.x-alert{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", "cdkDragScale"], 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.2.2", ngImport: i0, type: XAlertComponent, decorators: [{
             type: Component,
@@ -375,7 +378,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.2", 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}.x-alert{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 class=\"x-alert-operation-close\" 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}.x-alert{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 {

package/fesm2022/ng-nest-ui-alert.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ng-nest-ui-alert.mjs","sources":["../../../../lib/ng-nest/ui/alert/alert.property.ts","../../../../lib/ng-nest/ui/alert/alert.component.ts","../../../../lib/ng-nest/ui/alert/alert.component.html","../../../../lib/ng-nest/ui/alert/alert.module.ts","../../../../lib/ng-nest/ui/alert/ng-nest-ui-alert.ts"],"sourcesContent":["import { XPropertyFunction, XToBoolean, XToCssPixelValue, XToNumber } from '@ng-nest/ui/core';\r\nimport { Component, ElementRef, input, output } from '@angular/core';\r\nimport type { CdkDragEnd } from '@angular/cdk/drag-drop';\r\nimport type { XResizableEvent } from '@ng-nest/ui/resizable';\r\nimport type { XBoolean, XNumber, XEffect, XTemplate, XStatus } from '@ng-nest/ui/core';\r\n\r\n/*\r\n Alert\r\n * @selector x-alert\r\n * @decorator component\r\n /\r\nexport const XAlertPrefix = 'x-alert';\r\nexport const X_ALERT_CONFIG_NAME = 'alert';\r\n\r\n/\r\n Alert Property\r\n /\r\n@Component({ selector: `${XAlertPrefix}-property`, template: '' })\r\nexport class XAlertProperty extends XPropertyFunction(X_ALERT_CONFIG_NAME) {\r\n /\r\n @zh_CN 隐藏\r\n * @en_US Hide\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"隐藏，看不见\" hide> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly hide = input<boolean, XBoolean>(false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 标题\r\n * @en_US Title\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"Title\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly title = input<XTemplate>();\r\n /*\r\n @zh_CN 内容\r\n * @en_US Content\r\n * @example\r\n \r\n ```html\r\n * <x-alert content=\"Content\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly content = input<XTemplate>();\r\n /*\r\n @zh_CN 类型\r\n * @en_US Alert type\r\n * @example\r\n \r\n ```html\r\n * <x-alert type=\"success\" > </x-alert>\r\n * <x-alert type=\"info\" > </x-alert>\r\n * <x-alert type=\"warning\" > </x-alert>\r\n * <x-alert type=\"error\" > </x-alert>\r\n * <x-alert type=\"loading\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly type = input<XAlertType>('info');\r\n /*\r\n @zh_CN 主题\r\n * @en_US Theme\r\n * @example\r\n \r\n ```html\r\n * <x-alert effect=\"light\" > </x-alert>\r\n * <x-alert effect=\"dark\" > </x-alert>\r\n * <x-alert effect=\"white\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly effect = input<XEffect>(this.config?.effect ?? 'light');\r\n /*\r\n @zh_CN 隐藏关闭按钮\r\n * @en_US Hide close button\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"no close button\" hideClose> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly hideClose = input<boolean, XBoolean>(this.config?.hideClose ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 使用文本关闭按钮\r\n * @en_US Use the text to close button\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"close button is text\" closeText=\"close\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly closeText = input<string>();\r\n /*\r\n @zh_CN 显示图标\r\n * @en_US Show icon\r\n * @example\r\n \r\n ```html\r\n * <x-alert type=\"success\" showIcon> </x-alert>\r\n * <x-alert type=\"info\" showIcon> </x-alert>\r\n * <x-alert type=\"warning\" showIcon> </x-alert>\r\n * <x-alert type=\"error\" showIcon> </x-alert>\r\n * <x-alert type=\"loading\" showIcon> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly showIcon = input<boolean, XBoolean>(this.config?.showIcon ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 禁用动画\r\n * @en_US Disable animation\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"disabled animation\" disabledAnimation> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly disabledAnimation = input<boolean, XBoolean>(this.config?.disabledAnimation ?? false, {\r\n transform: XToBoolean\r\n });\r\n /*\r\n @zh_CN 延迟关闭，默认 0 表示不关闭，ms\r\n * @en_US Delay close, the default value of 0 means do not close. ms\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"duration close\" duration=\"1000\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly duration = input<number, XNumber>(this.config?.duration ?? 0, { transform: XToNumber });\r\n /*\r\n @zh_CN 手动处理关闭事件\r\n * @en_US Manually handle close events\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"manual close\" manual> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly manual = input<boolean, XBoolean>(false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 拖动提示框\r\n * @en_US Drag dialog\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"draggable alert\" draggable> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly draggable = input<boolean, XBoolean>(this.config?.draggable ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 调整提示框大小\r\n * @en_US Adjust the size of the box\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable alert\" resizable> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly resizable = input<boolean, XBoolean>(this.config?.resizable ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 开启 resizable 调整大小，偏移屏幕左边\r\n * @en_US Open the resizable resize, offset screen left\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable alert\" resizable offsetLeft=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly offsetLeft = input<number, XNumber>(0, { transform: XToNumber });\r\n /*\r\n @zh_CN 开启 resizable 调整大小，偏移屏幕顶部\r\n * @en_US Open the resizable resize, offset screen top\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable alert\" resizable offsetTop=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly offsetTop = input<number, XNumber>(0, { transform: XToNumber });\r\n /*\r\n @zh_CN 最小宽度\r\n * @en_US Min width\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"alert min-width\" minWidth=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly minWidth = input<string, XNumber>(this.config?.minWidth ?? '0', { transform: XToCssPixelValue });\r\n /*\r\n @zh_CN 最小高度\r\n * @en_US Min height\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"alert min-height\" minHeight=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly minHeight = input<string, XNumber>(this.config?.minHeight ?? '0', { transform: XToCssPixelValue });\r\n /*\r\n @zh_CN 拖动范围限制，父节点选择器或者对象\r\n * @en_US Drag dialog\r\n * @example\r\n \r\n ```html\r\n * <div #element style=\"width:300px; height: 300px\">\r\n * <x-alert title=\"draggable boundary\" draggable [dragBoundary]=\"element\"> </x-alert>\r\n * </div>\r\n * ```\r\n \r\n /\r\n readonly dragBoundary = input<string \| ElementRef<HTMLElement> \| HTMLElement>();\r\n /*\r\n @zh_CN 设置投放容器外部的 CdkDrag 的位置。可用于为返回的用户恢复元素的位置\r\n * @en_US Set the location of the CDKDRAG outside the container. Can be used to recover elements for returned users\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"draggable boundary\" draggable [dragFreeDragPosition]=\"{ x: 100, y: 100 }\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly dragFreeDragPosition = input<XAlertDragFreeDragPosition>();\r\n /*\r\n @zh_CN 自定义操作\r\n * @en_US Custom operation\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"operation template\" [operationTpl]=\"operationTpl\"> </x-alert>\r\n * <ng-template #operationTpl>\r\n * <x-button>Button</x-button>\r\n * </ng-template>\r\n * ```\r\n \r\n /\r\n readonly operationTpl = input<XTemplate>();\r\n /*\r\n @zh_CN 关闭的事件\r\n * @en_US Closed event\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"operation template\" (close)=\"close()\"> </x-alert>\r\n * ```\r\n \r\n ```typescript\r\n * close() {\r\n * console.log(\"close\")\r\n * }\r\n * ```\r\n \r\n /\r\n readonly close = output();\r\n /*\r\n @zh_CN 拖动结束的事件\r\n * @en_US Drag end event\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"draggable event\" draggable (dragEnded)=\"dragEnded($event)\"> </x-alert>\r\n * ```\r\n \r\n ```typescript\r\n * dragEnded(event: CdkDragEnd) {\r\n * console.log(event)\r\n * }\r\n * ```\r\n \r\n /\r\n readonly dragEnded = output<CdkDragEnd>();\r\n /*\r\n @zh_CN 改变尺寸事件\r\n * @en_US Change the size event\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable event\" resizable (resizing)=\"resizing($event)\"> </x-alert>\r\n * ```\r\n \r\n ```typescript\r\n * resizing(event: XResizableEvent) {\r\n * console.log(event)\r\n * }\r\n * ```\r\n \r\n /\r\n readonly resizing = output<XResizableEvent>();\r\n}\r\n\r\n/*\r\n Alert Option\r\n * @undocument true\r\n /\r\nexport interface XAlertOption {\r\n /\r\n 隐藏\r\n /\r\n hide?: boolean;\r\n /\r\n 标题\r\n /\r\n title?: XTemplate;\r\n /\r\n 内容\r\n /\r\n content?: XTemplate;\r\n /\r\n 类型\r\n /\r\n type?: XAlertType;\r\n /\r\n 主题\r\n /\r\n effect?: XEffect;\r\n /\r\n 隐藏关闭按钮\r\n /\r\n hideClose?: boolean;\r\n /\r\n 关闭按钮文字替换\r\n /\r\n closeText?: string;\r\n /\r\n 显示图标\r\n /\r\n showIcon?: boolean;\r\n /\r\n 禁用动画\r\n /\r\n disabledAnimation?: boolean;\r\n /\r\n 延迟关闭，默认 0 表示不关闭\r\n /\r\n duration?: number;\r\n /\r\n 手动处理关闭事件\r\n /\r\n manual?: boolean;\r\n /\r\n 拖动提示框\r\n /\r\n draggable?: boolean;\r\n /\r\n 调整提示框大小\r\n /\r\n resizable?: boolean;\r\n /\r\n 开启 resizable 调整大小，偏移屏幕左边\r\n /\r\n offsetLeft?: string;\r\n /\r\n 开启 resizable 调整大小，偏移屏幕顶部\r\n /\r\n offsetTop?: string;\r\n /\r\n 最小宽度\r\n /\r\n minWidth?: string;\r\n /\r\n 最小高度\r\n /\r\n minHeight?: string;\r\n}\r\n\r\n/\r\n @zh_CN 类型\r\n * @en_US Type\r\n /\r\nexport type XAlertType = XStatus;\r\n\r\n/\r\n @zh_CN 设置投放容器外部的 CdkDrag 的位置。可用于为返回的用户恢复元素的位置\r\n * @en_US Set the location of the CDKDRAG outside the container. Can be used to recover elements for returned users\r\n /\r\nexport type XAlertDragFreeDragPosition = { x: number; y: number };\r\n","import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n OnDestroy,\r\n inject,\r\n PLATFORM_ID,\r\n computed,\r\n signal,\r\n effect\r\n} from '@angular/core';\r\nimport { XAlertPrefix, XAlertProperty } from './alert.property';\r\nimport { XFadeAnimation, XIsEmpty } from '@ng-nest/ui/core';\r\nimport { of, Subject, Subscription } from 'rxjs';\r\nimport { delay, takeUntil } from 'rxjs/operators';\r\nimport { XIconComponent } from '@ng-nest/ui/icon';\r\nimport { XOutletDirective } from '@ng-nest/ui/outlet';\r\nimport { XButtonComponent } from '@ng-nest/ui/button';\r\nimport { DragDropModule } from '@angular/cdk/drag-drop';\r\nimport { XResizableDirective } from '@ng-nest/ui/resizable';\r\nimport { NgClass, NgTemplateOutlet, isPlatformBrowser } from '@angular/common';\r\n\r\n@Component({\r\n selector: `${XAlertPrefix}`,\r\n standalone: true,\r\n imports: [\r\n NgClass,\r\n NgTemplateOutlet,\r\n DragDropModule,\r\n XIconComponent,\r\n XButtonComponent,\r\n XOutletDirective,\r\n XResizableDirective\r\n ],\r\n templateUrl: './alert.component.html',\r\n styleUrls: ['./alert.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n animations: [XFadeAnimation]\r\n})\r\nexport class XAlertComponent extends XAlertProperty implements OnDestroy {\r\n styleHide = signal(false);\r\n classMap = computed(() => ({\r\n [`${XAlertPrefix}-${this.type()}`]: !XIsEmpty(this.type()),\r\n [`x-${this.effect()}`]: !XIsEmpty(this.effect()),\r\n [`${XAlertPrefix}-icon-medium`]: !XIsEmpty(this.title()) && !XIsEmpty(this.content()) && !XIsEmpty(this.showIcon()),\r\n [`${XAlertPrefix}-draggable`]: this.draggable()\r\n }));\r\n\r\n private unSubject = new Subject<void>();\r\n private durationSubscription?: Subscription;\r\n private isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\r\n\r\n constructor() {\r\n super();\r\n effect(() => this.setDuration());\r\n }\r\n\r\n ngOnDestroy() {\r\n this.unSubject.next();\r\n this.unSubject.complete();\r\n }\r\n\r\n setDuration() {\r\n if (this.duration() && this.isBrowser) {\r\n this.durationSubscription?.unsubscribe();\r\n this.durationSubscription = of(true)\r\n .pipe(delay(this.duration()), takeUntil(this.unSubject))\r\n .subscribe(() => {\r\n this.onClose();\r\n });\r\n }\r\n }\r\n\r\n onClose() {\r\n if (this.manual()) {\r\n this.close.emit();\r\n } else {\r\n this.styleHide.set(true);\r\n }\r\n }\r\n\r\n onCloseAnimationDone() {\r\n if (this.hide()) {\r\n this.close.emit();\r\n }\r\n }\r\n}\r\n","@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","import { NgModule } from '@angular/core';\r\nimport { XAlertComponent } from './alert.component';\r\n\r\n@NgModule({\r\n exports: [XAlertComponent],\r\n imports: [XAlertComponent]\r\n})\r\nexport class XAlertModule {}\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"ng-nest-ui-alert.mjs","sources":["../../../../lib/ng-nest/ui/alert/alert.property.ts","../../../../lib/ng-nest/ui/alert/alert.component.ts","../../../../lib/ng-nest/ui/alert/alert.component.html","../../../../lib/ng-nest/ui/alert/alert.module.ts","../../../../lib/ng-nest/ui/alert/ng-nest-ui-alert.ts"],"sourcesContent":["import { XPropertyFunction, XToBoolean, XToCssPixelValue, XToNumber } from '@ng-nest/ui/core';\r\nimport { Component, ElementRef, input, output } from '@angular/core';\r\nimport type { CdkDragEnd } from '@angular/cdk/drag-drop';\r\nimport type { XResizableEvent } from '@ng-nest/ui/resizable';\r\nimport type { XBoolean, XNumber, XEffect, XTemplate, XStatus } from '@ng-nest/ui/core';\r\n\r\n/*\r\n Alert\r\n * @selector x-alert\r\n * @decorator component\r\n /\r\nexport const XAlertPrefix = 'x-alert';\r\nexport const X_ALERT_CONFIG_NAME = 'alert';\r\n\r\n/\r\n Alert Property\r\n /\r\n@Component({ selector: `${XAlertPrefix}-property`, template: '' })\r\nexport class XAlertProperty extends XPropertyFunction(X_ALERT_CONFIG_NAME) {\r\n /\r\n @zh_CN 隐藏\r\n * @en_US Hide\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"隐藏，看不见\" hide> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly hide = input<boolean, XBoolean>(false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 标题\r\n * @en_US Title\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"Title\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly title = input<XTemplate>();\r\n /*\r\n @zh_CN 内容\r\n * @en_US Content\r\n * @example\r\n \r\n ```html\r\n * <x-alert content=\"Content\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly content = input<XTemplate>();\r\n /*\r\n @zh_CN 类型\r\n * @en_US Alert type\r\n * @example\r\n \r\n ```html\r\n * <x-alert type=\"success\" > </x-alert>\r\n * <x-alert type=\"info\" > </x-alert>\r\n * <x-alert type=\"warning\" > </x-alert>\r\n * <x-alert type=\"error\" > </x-alert>\r\n * <x-alert type=\"loading\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly type = input<XAlertType>('info');\r\n /*\r\n @zh_CN 主题\r\n * @en_US Theme\r\n * @example\r\n \r\n ```html\r\n * <x-alert effect=\"light\" > </x-alert>\r\n * <x-alert effect=\"dark\" > </x-alert>\r\n * <x-alert effect=\"white\" > </x-alert>\r\n * ```\r\n \r\n /\r\n readonly effect = input<XEffect>(this.config?.effect ?? 'light');\r\n /*\r\n @zh_CN 隐藏关闭按钮\r\n * @en_US Hide close button\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"no close button\" hideClose> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly hideClose = input<boolean, XBoolean>(this.config?.hideClose ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 使用文本关闭按钮\r\n * @en_US Use the text to close button\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"close button is text\" closeText=\"close\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly closeText = input<string>();\r\n /*\r\n @zh_CN 显示图标\r\n * @en_US Show icon\r\n * @example\r\n \r\n ```html\r\n * <x-alert type=\"success\" showIcon> </x-alert>\r\n * <x-alert type=\"info\" showIcon> </x-alert>\r\n * <x-alert type=\"warning\" showIcon> </x-alert>\r\n * <x-alert type=\"error\" showIcon> </x-alert>\r\n * <x-alert type=\"loading\" showIcon> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly showIcon = input<boolean, XBoolean>(this.config?.showIcon ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 禁用动画\r\n * @en_US Disable animation\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"disabled animation\" disabledAnimation> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly disabledAnimation = input<boolean, XBoolean>(this.config?.disabledAnimation ?? false, {\r\n transform: XToBoolean\r\n });\r\n /*\r\n @zh_CN 延迟关闭，默认 0 表示不关闭，ms\r\n * @en_US Delay close, the default value of 0 means do not close. ms\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"duration close\" duration=\"1000\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly duration = input<number, XNumber>(this.config?.duration ?? 0, { transform: XToNumber });\r\n /*\r\n @zh_CN 手动处理关闭事件\r\n * @en_US Manually handle close events\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"manual close\" manual> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly manual = input<boolean, XBoolean>(false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 拖动提示框\r\n * @en_US Drag dialog\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"draggable alert\" draggable> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly draggable = input<boolean, XBoolean>(this.config?.draggable ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 调整提示框大小\r\n * @en_US Adjust the size of the box\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable alert\" resizable> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly resizable = input<boolean, XBoolean>(this.config?.resizable ?? false, { transform: XToBoolean });\r\n /*\r\n @zh_CN 开启 resizable 调整大小，偏移屏幕左边\r\n * @en_US Open the resizable resize, offset screen left\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable alert\" resizable offsetLeft=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly offsetLeft = input<number, XNumber>(0, { transform: XToNumber });\r\n /*\r\n @zh_CN 开启 resizable 调整大小，偏移屏幕顶部\r\n * @en_US Open the resizable resize, offset screen top\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable alert\" resizable offsetTop=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly offsetTop = input<number, XNumber>(0, { transform: XToNumber });\r\n /*\r\n @zh_CN 最小宽度\r\n * @en_US Min width\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"alert min-width\" minWidth=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly minWidth = input<string, XNumber>(this.config?.minWidth ?? '0', { transform: XToCssPixelValue });\r\n /*\r\n @zh_CN 最小高度\r\n * @en_US Min height\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"alert min-height\" minHeight=\"100\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly minHeight = input<string, XNumber>(this.config?.minHeight ?? '0', { transform: XToCssPixelValue });\r\n /*\r\n @zh_CN 拖动范围限制，父节点选择器或者对象\r\n * @en_US Drag dialog\r\n * @example\r\n \r\n ```html\r\n * <div #element style=\"width:300px; height: 300px\">\r\n * <x-alert title=\"draggable boundary\" draggable [dragBoundary]=\"element\"> </x-alert>\r\n * </div>\r\n * ```\r\n \r\n /\r\n readonly dragBoundary = input<string \| ElementRef<HTMLElement> \| HTMLElement>();\r\n /*\r\n @zh_CN 设置投放容器外部的 CdkDrag 的位置。可用于为返回的用户恢复元素的位置\r\n * @en_US Set the location of the CDKDRAG outside the container. Can be used to recover elements for returned users\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"draggable boundary\" draggable [dragFreeDragPosition]=\"{ x: 100, y: 100 }\"> </x-alert>\r\n * ```\r\n \r\n /\r\n readonly dragFreeDragPosition = input<XAlertDragFreeDragPosition>();\r\n /*\r\n @zh_CN 自定义操作\r\n * @en_US Custom operation\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"operation template\" [operationTpl]=\"operationTpl\"> </x-alert>\r\n * <ng-template #operationTpl>\r\n * <x-button>Button</x-button>\r\n * </ng-template>\r\n * ```\r\n \r\n /\r\n readonly operationTpl = input<XTemplate>();\r\n /*\r\n @zh_CN 关闭的事件\r\n * @en_US Closed event\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"operation template\" (close)=\"close()\"> </x-alert>\r\n * ```\r\n \r\n ```typescript\r\n * close() {\r\n * console.log(\"close\")\r\n * }\r\n * ```\r\n \r\n /\r\n readonly close = output();\r\n /*\r\n @zh_CN 拖动结束的事件\r\n * @en_US Drag end event\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"draggable event\" draggable (dragEnded)=\"dragEnded($event)\"> </x-alert>\r\n * ```\r\n \r\n ```typescript\r\n * dragEnded(event: CdkDragEnd) {\r\n * console.log(event)\r\n * }\r\n * ```\r\n \r\n /\r\n readonly dragEnded = output<CdkDragEnd>();\r\n /*\r\n @zh_CN 改变尺寸事件\r\n * @en_US Change the size event\r\n * @example\r\n \r\n ```html\r\n * <x-alert title=\"resizable event\" resizable (resizing)=\"resizing($event)\"> </x-alert>\r\n * ```\r\n \r\n ```typescript\r\n * resizing(event: XResizableEvent) {\r\n * console.log(event)\r\n * }\r\n * ```\r\n \r\n /\r\n readonly resizing = output<XResizableEvent>();\r\n}\r\n\r\n/*\r\n Alert Option\r\n * @undocument true\r\n /\r\nexport interface XAlertOption {\r\n /\r\n 隐藏\r\n /\r\n hide?: boolean;\r\n /\r\n 标题\r\n /\r\n title?: XTemplate;\r\n /\r\n 内容\r\n /\r\n content?: XTemplate;\r\n /\r\n 类型\r\n /\r\n type?: XAlertType;\r\n /\r\n 主题\r\n /\r\n effect?: XEffect;\r\n /\r\n 隐藏关闭按钮\r\n /\r\n hideClose?: boolean;\r\n /\r\n 关闭按钮文字替换\r\n /\r\n closeText?: string;\r\n /\r\n 显示图标\r\n /\r\n showIcon?: boolean;\r\n /\r\n 禁用动画\r\n /\r\n disabledAnimation?: boolean;\r\n /\r\n 延迟关闭，默认 0 表示不关闭\r\n /\r\n duration?: number;\r\n /\r\n 手动处理关闭事件\r\n /\r\n manual?: boolean;\r\n /\r\n 拖动提示框\r\n /\r\n draggable?: boolean;\r\n /\r\n 调整提示框大小\r\n /\r\n resizable?: boolean;\r\n /\r\n 开启 resizable 调整大小，偏移屏幕左边\r\n /\r\n offsetLeft?: string;\r\n /\r\n 开启 resizable 调整大小，偏移屏幕顶部\r\n /\r\n offsetTop?: string;\r\n /\r\n 最小宽度\r\n /\r\n minWidth?: string;\r\n /\r\n 最小高度\r\n /\r\n minHeight?: string;\r\n}\r\n\r\n/\r\n @zh_CN 类型\r\n * @en_US Type\r\n /\r\nexport type XAlertType = XStatus;\r\n\r\n/\r\n @zh_CN 设置投放容器外部的 CdkDrag 的位置。可用于为返回的用户恢复元素的位置\r\n * @en_US Set the location of the CDKDRAG outside the container. Can be used to recover elements for returned users\r\n /\r\nexport type XAlertDragFreeDragPosition = { x: number; y: number };\r\n","import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n inject,\r\n PLATFORM_ID,\r\n computed,\r\n signal,\r\n effect,\r\n DestroyRef\r\n} from '@angular/core';\r\nimport { XAlertPrefix, XAlertProperty } from './alert.property';\r\nimport { XFadeAnimation, XIsEmpty } from '@ng-nest/ui/core';\r\nimport { of, Subject, Subscription } from 'rxjs';\r\nimport { delay, takeUntil } from 'rxjs/operators';\r\nimport { XIconComponent } from '@ng-nest/ui/icon';\r\nimport { XOutletDirective } from '@ng-nest/ui/outlet';\r\nimport { XButtonComponent } from '@ng-nest/ui/button';\r\nimport { DragDropModule } from '@angular/cdk/drag-drop';\r\nimport { XResizableDirective } from '@ng-nest/ui/resizable';\r\nimport { NgClass, NgTemplateOutlet, isPlatformBrowser } from '@angular/common';\r\n\r\n@Component({\r\n selector: `${XAlertPrefix}`,\r\n standalone: true,\r\n imports: [\r\n NgClass,\r\n NgTemplateOutlet,\r\n DragDropModule,\r\n XIconComponent,\r\n XButtonComponent,\r\n XOutletDirective,\r\n XResizableDirective\r\n ],\r\n templateUrl: './alert.component.html',\r\n styleUrls: ['./alert.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n animations: [XFadeAnimation]\r\n})\r\nexport class XAlertComponent extends XAlertProperty {\r\n styleHide = signal(false);\r\n classMap = computed(() => ({\r\n [`${XAlertPrefix}-${this.type()}`]: !XIsEmpty(this.type()),\r\n [`x-${this.effect()}`]: !XIsEmpty(this.effect()),\r\n [`${XAlertPrefix}-icon-medium`]: !XIsEmpty(this.title()) && !XIsEmpty(this.content()) && !XIsEmpty(this.showIcon()),\r\n [`${XAlertPrefix}-draggable`]: this.draggable()\r\n }));\r\n\r\n private unSubject = new Subject<void>();\r\n private durationSubscription?: Subscription;\r\n private isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\r\n private destoryRef = inject(DestroyRef);\r\n private destory = signal(false);\r\n\r\n constructor() {\r\n super();\r\n effect(() => this.setDuration());\r\n this.destoryRef.onDestroy(() => {\r\n this.destory.set(true);\r\n this.unSubject.next();\r\n this.unSubject.complete();\r\n });\r\n }\r\n\r\n setDuration() {\r\n if (this.duration() && this.isBrowser) {\r\n this.durationSubscription?.unsubscribe();\r\n this.durationSubscription = of(true)\r\n .pipe(delay(this.duration()), takeUntil(this.unSubject))\r\n .subscribe(() => {\r\n this.onClose();\r\n });\r\n }\r\n }\r\n\r\n onClose() {\r\n if (this.manual()) {\r\n !this.destory() && this.close.emit();\r\n } else {\r\n this.styleHide.set(true);\r\n }\r\n }\r\n\r\n onCloseAnimationDone() {\r\n if (this.hide()) {\r\n !this.destory() && this.close.emit();\r\n }\r\n }\r\n}\r\n","@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 class=\"x-alert-operation-close\" 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","import { NgModule } from '@angular/core';\r\nimport { XAlertComponent } from './alert.component';\r\n\r\n@NgModule({\r\n exports: [XAlertComponent],\r\n imports: [XAlertComponent]\r\n})\r\nexport class XAlertModule {}\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-nest-ui-auto-complete.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Subject, BehaviorSubject, fromEvent } from 'rxjs';
 import * as i0 from '@angular/core';
-import { input, model, output, Component, viewChild, signal, ViewEncapsulation, ChangeDetectionStrategy, HostBinding, HostListener, inject, ViewContainerRef, ElementRef, effect, NgModule } from '@angular/core';
+import { input, model, output, Component, viewChild, signal, inject, DestroyRef, ViewEncapsulation, ChangeDetectionStrategy, HostBinding, HostListener, computed, ViewContainerRef, ElementRef, effect, NgModule } from '@angular/core';
 import { XToNumber, XToBoolean, XToCssPixelValue, XConnectBaseAnimation, XIsChange, XIsObservable, XIsFunction, XSetData, XParents, XIsEmpty } from '@ng-nest/ui/core';
 import { XFormControlFunction, XValueAccessor } from '@ng-nest/ui/base-form';
 import { XPortalService, XPortalConnectedPosition } from '@ng-nest/ui/portal';
@@ -195,16 +195,22 @@ class XAutoCompletePortalComponent {
         this.animating = output();
         this.nodeClick = output();
         this.active = signal(-1);
+        this.destroy = signal(false);
         this.unSubject = new Subject();
+        this.destroyRef = inject(DestroyRef);
     }
     get getPlacement() {
         return this.placement();
     }
-    done(event) {
-        event.toState !== 'void' && this.animating.emit(false);
+    done() {
+        if (this.destroy())
+            return;
+        this.animating.emit(false);
     }
-    start(event) {
-        event.toState !== 'void' && this.animating.emit(true);
+    start() {
+        if (this.destroy())
+            return;
+        this.animating.emit(true);
     }
     ngOnInit() {
         this.closeSubject.pipe(takeUntil(this.unSubject)).subscribe(() => {
@@ -213,10 +219,11 @@ class XAutoCompletePortalComponent {
         this.keydownSubject.pipe(takeUntil(this.unSubject)).subscribe((x) => {
             this.list().keydown(x);
         });
-    }
-    ngOnDestroy() {
-        this.unSubject.next();
-        this.unSubject.complete();
+        this.destroyRef.onDestroy(() => {
+            this.destroy.set(true);
+            this.unSubject.next();
+            this.unSubject.complete();
+        });
     }
     stopPropagation(event) {
         event.stopPropagation();
@@ -258,6 +265,9 @@ class XAutoCompleteComponent extends XAutoCompleteProperty {
         this.iconSpin = signal(false);
         this.animating = signal(false);
         this.valueTplContextSignal = signal({ $node: null, $isValue: true });
+        this.valueTplContextComputed = computed(() => {
+            return this.valueTplContext() ? this.valueTplContext() : this.valueTplContextSignal();
+        });
         this.inputChange = new BehaviorSubject(null);
         this.closeSubject = new Subject();
         this.keydownSubject = new Subject();
@@ -528,11 +538,11 @@ class XAutoCompleteComponent extends XAutoCompleteProperty {
         });
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XAutoCompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.2", type: XAutoCompleteComponent, isStandalone: true, selector: "x-auto-complete", providers: [XValueAccessor(XAutoCompleteComponent)], viewQueries: [{ propertyName: "inputCom", first: true, predicate: ["inputCom"], descendants: true, read: XInputComponent, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #autoComplete class=\"x-auto-complete\">\r\n  <div class=\"x-auto-complete-row\">\r\n    <x-input\r\n      #inputCom\r\n      type=\"text\"\r\n      [label]=\"label()\"\r\n      [labelWidth]=\"labelWidth()\"\r\n      [labelAlign]=\"labelAlign()\"\r\n      [justify]=\"justify()\"\r\n      [align]=\"align()\"\r\n      [direction]=\"direction()\"\r\n      [disabled]=\"disabledComputed()\"\r\n      [required]=\"requiredComputed()\"\r\n      [validator]=\"validatorComputed()\"\r\n      [icon]=\"icon()\"\r\n      [iconSpin]=\"iconSpin()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [readonly]=\"readonly()\"\r\n      [clearable]=\"false\"\r\n      [(ngModel)]=\"value\"\r\n      [valueTpl]=\"valueTpl()\"\r\n      [valueTplContext]=\"valueTplContextSignal()\"\r\n      [size]=\"size()\"\r\n      [bordered]=\"bordered()\"\r\n      [before]=\"before()\"\r\n      [after]=\"after()\"\r\n      [pattern]=\"patternComputed()\"\r\n      [message]=\"messageComputed()\"\r\n      [pointer]=\"pointer()\"\r\n      [(active)]=\"active\"\r\n      (xInput)=\"onInput($event)\"\r\n      (xKeydown)=\"onKeydown($event)\"\r\n      (xClick)=\"showPortal()\"\r\n    ></x-input>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";x-auto-complete{display:inline-block;width:12rem}.x-auto-complete{margin:0;padding:0}.x-auto-complete{width:100%}.x-auto-complete x-input{width:100%}.x-auto-complete-portal{margin:.0625rem 0;font-size:var(--x-font-size);color:var(--x-text);width:100%;border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;background-color:var(--x-background-100);overflow-y:auto;max-height:calc(calc(var(--x-font-size) + .875rem) * 6 + var(--x-border-width) * 7)}.x-auto-complete-portal:focus{outline:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: XInputComponent, selector: "x-input" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.2", type: XAutoCompleteComponent, isStandalone: true, selector: "x-auto-complete", providers: [XValueAccessor(XAutoCompleteComponent)], viewQueries: [{ propertyName: "inputCom", first: true, predicate: ["inputCom"], descendants: true, read: XInputComponent, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #autoComplete class=\"x-auto-complete\">\r\n  <div class=\"x-auto-complete-row\">\r\n    <x-input\r\n      #inputCom\r\n      type=\"text\"\r\n      [label]=\"label()\"\r\n      [labelWidth]=\"labelWidth()\"\r\n      [labelAlign]=\"labelAlign()\"\r\n      [justify]=\"justify()\"\r\n      [align]=\"align()\"\r\n      [direction]=\"direction()\"\r\n      [disabled]=\"disabledComputed()\"\r\n      [required]=\"requiredComputed()\"\r\n      [validator]=\"validatorComputed()\"\r\n      [inputValidator]=\"inputValidator()\"\r\n      [icon]=\"icon()\"\r\n      [iconSpin]=\"iconSpin()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [readonly]=\"readonly()\"\r\n      [clearable]=\"false\"\r\n      [(ngModel)]=\"value\"\r\n      [valueTpl]=\"valueTpl()\"\r\n      [valueTplContext]=\"valueTplContextComputed()\"\r\n      [size]=\"size()\"\r\n      [bordered]=\"bordered()\"\r\n      [before]=\"before()\"\r\n      [after]=\"after()\"\r\n      [pattern]=\"patternComputed()\"\r\n      [message]=\"messageComputed()\"\r\n      [pointer]=\"pointer()\"\r\n      [(active)]=\"active\"\r\n      (xInput)=\"onInput($event)\"\r\n      (xKeydown)=\"onKeydown($event)\"\r\n      (xClick)=\"showPortal()\"\r\n    ></x-input>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";x-auto-complete{display:inline-block;width:12rem}.x-auto-complete{margin:0;padding:0}.x-auto-complete{width:100%}.x-auto-complete x-input{width:100%}.x-auto-complete-portal{margin:.0625rem 0;font-size:var(--x-font-size);color:var(--x-text);width:100%;border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;background-color:var(--x-background-100);overflow-y:auto;max-height:calc(calc(var(--x-font-size) + .875rem) * 6 + var(--x-border-width) * 7)}.x-auto-complete-portal:focus{outline:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: XInputComponent, selector: "x-input" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XAutoCompleteComponent, decorators: [{
             type: Component,
-            args: [{ selector: `${XAutoCompletePrefix}`, standalone: true, imports: [NgClass, FormsModule, ReactiveFormsModule, XInputComponent, XAutoCompletePortalComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [XValueAccessor(XAutoCompleteComponent)], template: "<div #autoComplete class=\"x-auto-complete\">\r\n  <div class=\"x-auto-complete-row\">\r\n    <x-input\r\n      #inputCom\r\n      type=\"text\"\r\n      [label]=\"label()\"\r\n      [labelWidth]=\"labelWidth()\"\r\n      [labelAlign]=\"labelAlign()\"\r\n      [justify]=\"justify()\"\r\n      [align]=\"align()\"\r\n      [direction]=\"direction()\"\r\n      [disabled]=\"disabledComputed()\"\r\n      [required]=\"requiredComputed()\"\r\n      [validator]=\"validatorComputed()\"\r\n      [icon]=\"icon()\"\r\n      [iconSpin]=\"iconSpin()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [readonly]=\"readonly()\"\r\n      [clearable]=\"false\"\r\n      [(ngModel)]=\"value\"\r\n      [valueTpl]=\"valueTpl()\"\r\n      [valueTplContext]=\"valueTplContextSignal()\"\r\n      [size]=\"size()\"\r\n      [bordered]=\"bordered()\"\r\n      [before]=\"before()\"\r\n      [after]=\"after()\"\r\n      [pattern]=\"patternComputed()\"\r\n      [message]=\"messageComputed()\"\r\n      [pointer]=\"pointer()\"\r\n      [(active)]=\"active\"\r\n      (xInput)=\"onInput($event)\"\r\n      (xKeydown)=\"onKeydown($event)\"\r\n      (xClick)=\"showPortal()\"\r\n    ></x-input>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";x-auto-complete{display:inline-block;width:12rem}.x-auto-complete{margin:0;padding:0}.x-auto-complete{width:100%}.x-auto-complete x-input{width:100%}.x-auto-complete-portal{margin:.0625rem 0;font-size:var(--x-font-size);color:var(--x-text);width:100%;border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;background-color:var(--x-background-100);overflow-y:auto;max-height:calc(calc(var(--x-font-size) + .875rem) * 6 + var(--x-border-width) * 7)}.x-auto-complete-portal:focus{outline:none}\n"] }]
+            args: [{ selector: `${XAutoCompletePrefix}`, standalone: true, imports: [NgClass, FormsModule, ReactiveFormsModule, XInputComponent, XAutoCompletePortalComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [XValueAccessor(XAutoCompleteComponent)], template: "<div #autoComplete class=\"x-auto-complete\">\r\n  <div class=\"x-auto-complete-row\">\r\n    <x-input\r\n      #inputCom\r\n      type=\"text\"\r\n      [label]=\"label()\"\r\n      [labelWidth]=\"labelWidth()\"\r\n      [labelAlign]=\"labelAlign()\"\r\n      [justify]=\"justify()\"\r\n      [align]=\"align()\"\r\n      [direction]=\"direction()\"\r\n      [disabled]=\"disabledComputed()\"\r\n      [required]=\"requiredComputed()\"\r\n      [validator]=\"validatorComputed()\"\r\n      [inputValidator]=\"inputValidator()\"\r\n      [icon]=\"icon()\"\r\n      [iconSpin]=\"iconSpin()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [readonly]=\"readonly()\"\r\n      [clearable]=\"false\"\r\n      [(ngModel)]=\"value\"\r\n      [valueTpl]=\"valueTpl()\"\r\n      [valueTplContext]=\"valueTplContextComputed()\"\r\n      [size]=\"size()\"\r\n      [bordered]=\"bordered()\"\r\n      [before]=\"before()\"\r\n      [after]=\"after()\"\r\n      [pattern]=\"patternComputed()\"\r\n      [message]=\"messageComputed()\"\r\n      [pointer]=\"pointer()\"\r\n      [(active)]=\"active\"\r\n      (xInput)=\"onInput($event)\"\r\n      (xKeydown)=\"onKeydown($event)\"\r\n      (xClick)=\"showPortal()\"\r\n    ></x-input>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";x-auto-complete{display:inline-block;width:12rem}.x-auto-complete{margin:0;padding:0}.x-auto-complete{width:100%}.x-auto-complete x-input{width:100%}.x-auto-complete-portal{margin:.0625rem 0;font-size:var(--x-font-size);color:var(--x-text);width:100%;border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;background-color:var(--x-background-100);overflow-y:auto;max-height:calc(calc(var(--x-font-size) + .875rem) * 6 + var(--x-border-width) * 7)}.x-auto-complete-portal:focus{outline:none}\n"] }]
         }], ctorParameters: () => [] });
 class XAutoCompleteModule {