@ng-nest/ui 20.2.4 → 21.0.0

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

@@ -66,10 +66,10 @@ class XDrawerProperty extends XPropertyFunction(X_DRAWER_CONFIG_NAME) {
          */
         this.close = output();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XDrawerProperty, isStandalone: true, selector: "x-drawer-property", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, backdropClose: { classPropertyName: "backdropClose", publicName: "backdropClose", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", close: "close" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XDrawerProperty, isStandalone: true, selector: "x-drawer-property", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, backdropClose: { classPropertyName: "backdropClose", publicName: "backdropClose", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", close: "close" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XDrawerPrefix}-property`, template: '' }]
         }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], backdropClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "backdropClose", required: false }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], close: [{ type: i0.Output, args: ["close"] }] } });
@@ -84,10 +84,10 @@ const X_DRAWER_CONTAINER = new InjectionToken('X_DRAWER_CONTAINER');
  * Drawer Container Property
  */
 class XDrawerContainerProperty extends XProperty {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerContainerProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.5", type: XDrawerContainerProperty, isStandalone: true, selector: "x-drawer-container-property", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerContainerProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: XDrawerContainerProperty, isStandalone: true, selector: "x-drawer-container-property", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerContainerProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerContainerProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XDrawerContainerPrefix}-property`, template: '' }]
         }] });
@@ -163,10 +163,10 @@ class XDrawerComponent extends XDrawerProperty {
             this.visible.set(false);
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XDrawerComponent, isStandalone: true, selector: "x-drawer", host: { properties: { "class.x-drawer-visible": "this.getVisible" } }, viewQueries: [{ propertyName: "drawerTpl", first: true, predicate: ["drawerTpl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #drawerTpl>\r\n  @if (visible()) {\r\n    @if (hasContainer() && hasBackdrop()) {\r\n      <div\r\n        class=\"x-drawer-backdrop\"\r\n        [animate.enter]=\"`x-opacity-enter`\"\r\n        [animate.leave]=\"`x-opacity-leave`\"\r\n        (click)=\"closePortal()\"\r\n      ></div>\r\n    }\r\n\r\n    <div\r\n      class=\"x-drawer\"\r\n      [ngClass]=\"classMap()\"\r\n      [style.width]=\"hasContainer() ? width() : '100%'\"\r\n      [style.height]=\"hasContainer() ? height() : '100%'\"\r\n      [animate.enter]=\"`x-slide-${placement()}-enter`\"\r\n      [animate.leave]=\"`x-slide-${placement()}-leave`\"\r\n    >\r\n      @if (title()) {\r\n        {{ hasContainer() }} {{ hasBackdrop() }}\r\n        <div class=\"x-drawer-header\">\r\n          <div class=\"x-drawer-title\">\r\n            <ng-container *xOutlet=\"title()\">{{ title() }}</ng-container>\r\n          </div>\r\n          <x-button\r\n            size=\"small\"\r\n            class=\"x-drawer-close\"\r\n            icon=\"fto-x\"\r\n            type=\"text\"\r\n            (click)=\"closePortal()\"\r\n            closable\r\n          ></x-button>\r\n        </div>\r\n      }\r\n      <div class=\"x-drawer-content\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  }\r\n</ng-template>\r\n@if (hasContainer()) {\r\n  <ng-container *ngTemplateOutlet=\"drawerTpl\"></ng-container>\r\n}\r\n", styles: [".x-drawer{margin:0;padding:0}.x-drawer{background-color:var(--x-background);position:relative;box-shadow:var(--x-box-shadow)}.x-drawer-header{padding:1rem 1rem .5rem}.x-drawer-title{font-weight:600;color:var(--x-text-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-drawer-close{position:absolute;top:.425rem;right:.425rem}.x-drawer-title{padding:0}.x-drawer-content{padding:0 1rem 1rem;height:calc(100% - 3rem);overflow:auto}.x-drawer-no-title .x-drawer-content{padding:.5rem 1rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XButtonComponent, selector: "x-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: XDrawerComponent, isStandalone: true, selector: "x-drawer", host: { properties: { "class.x-drawer-visible": "this.getVisible" } }, viewQueries: [{ propertyName: "drawerTpl", first: true, predicate: ["drawerTpl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #drawerTpl>\r\n  @if (visible()) {\r\n    @if (hasContainer() && hasBackdrop()) {\r\n      <div\r\n        class=\"x-drawer-backdrop\"\r\n        [animate.enter]=\"`x-opacity-enter`\"\r\n        [animate.leave]=\"`x-opacity-leave`\"\r\n        (click)=\"closePortal()\"\r\n      ></div>\r\n    }\r\n\r\n    <div\r\n      class=\"x-drawer\"\r\n      [ngClass]=\"classMap()\"\r\n      [style.width]=\"hasContainer() ? width() : '100%'\"\r\n      [style.height]=\"hasContainer() ? height() : '100%'\"\r\n      [animate.enter]=\"`x-slide-${placement()}-enter`\"\r\n      [animate.leave]=\"`x-slide-${placement()}-leave`\"\r\n    >\r\n      @if (title()) {\r\n        {{ hasContainer() }} {{ hasBackdrop() }}\r\n        <div class=\"x-drawer-header\">\r\n          <div class=\"x-drawer-title\">\r\n            <ng-container *xOutlet=\"title()\">{{ title() }}</ng-container>\r\n          </div>\r\n          <x-button\r\n            size=\"small\"\r\n            class=\"x-drawer-close\"\r\n            icon=\"fto-x\"\r\n            type=\"text\"\r\n            (click)=\"closePortal()\"\r\n            closable\r\n          ></x-button>\r\n        </div>\r\n      }\r\n      <div class=\"x-drawer-content\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  }\r\n</ng-template>\r\n@if (hasContainer()) {\r\n  <ng-container *ngTemplateOutlet=\"drawerTpl\"></ng-container>\r\n}\r\n", styles: [".x-drawer{margin:0;padding:0}.x-drawer{background-color:var(--x-background);position:relative;box-shadow:var(--x-box-shadow)}.x-drawer-header{padding:1rem 1rem .5rem}.x-drawer-title{font-weight:600;color:var(--x-text-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-drawer-close{position:absolute;top:.425rem;right:.425rem}.x-drawer-title{padding:0}.x-drawer-content{padding:0 1rem 1rem;height:calc(100% - 3rem);overflow:auto}.x-drawer-no-title .x-drawer-content{padding:.5rem 1rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XButtonComponent, selector: "x-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XDrawerPrefix}`, imports: [NgClass, NgTemplateOutlet, XOutletDirective, XButtonComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #drawerTpl>\r\n  @if (visible()) {\r\n    @if (hasContainer() && hasBackdrop()) {\r\n      <div\r\n        class=\"x-drawer-backdrop\"\r\n        [animate.enter]=\"`x-opacity-enter`\"\r\n        [animate.leave]=\"`x-opacity-leave`\"\r\n        (click)=\"closePortal()\"\r\n      ></div>\r\n    }\r\n\r\n    <div\r\n      class=\"x-drawer\"\r\n      [ngClass]=\"classMap()\"\r\n      [style.width]=\"hasContainer() ? width() : '100%'\"\r\n      [style.height]=\"hasContainer() ? height() : '100%'\"\r\n      [animate.enter]=\"`x-slide-${placement()}-enter`\"\r\n      [animate.leave]=\"`x-slide-${placement()}-leave`\"\r\n    >\r\n      @if (title()) {\r\n        {{ hasContainer() }} {{ hasBackdrop() }}\r\n        <div class=\"x-drawer-header\">\r\n          <div class=\"x-drawer-title\">\r\n            <ng-container *xOutlet=\"title()\">{{ title() }}</ng-container>\r\n          </div>\r\n          <x-button\r\n            size=\"small\"\r\n            class=\"x-drawer-close\"\r\n            icon=\"fto-x\"\r\n            type=\"text\"\r\n            (click)=\"closePortal()\"\r\n            closable\r\n          ></x-button>\r\n        </div>\r\n      }\r\n      <div class=\"x-drawer-content\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  }\r\n</ng-template>\r\n@if (hasContainer()) {\r\n  <ng-container *ngTemplateOutlet=\"drawerTpl\"></ng-container>\r\n}\r\n", styles: [".x-drawer{margin:0;padding:0}.x-drawer{background-color:var(--x-background);position:relative;box-shadow:var(--x-box-shadow)}.x-drawer-header{padding:1rem 1rem .5rem}.x-drawer-title{font-weight:600;color:var(--x-text-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-drawer-close{position:absolute;top:.425rem;right:.425rem}.x-drawer-title{padding:0}.x-drawer-content{padding:0 1rem 1rem;height:calc(100% - 3rem);overflow:auto}.x-drawer-no-title .x-drawer-content{padding:.5rem 1rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { getVisible: [{
@@ -189,10 +189,10 @@ class XDrawerPortalComponent {
     ngAfterViewInit() {
         this.portalOutlet().setDisposeFn(() => { });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.5", type: XDrawerPortalComponent, isStandalone: true, selector: "x-drawer-portal", inputs: { placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.x-drawer-portal": "this._has", "animate.enter": "this.animateEnter", "animate.leave": "this.animateLeave" } }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template [cdkPortalOutlet]=\"portal\"></ng-template>\r\n", styles: [".x-drawer-portal{margin:0;padding:0}.x-drawer-portal{height:100%;width:100%;background-color:var(--x-background-100);position:relative;box-shadow:var(--x-box-shadow);overflow:auto;padding:1rem}.x-drawer-portal-title{display:block;margin:0 0 .5rem;font-weight:600;color:var(--x-text-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-drawer-portal-content{display:block;margin:0 -1rem;padding:0 1rem;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.0", type: XDrawerPortalComponent, isStandalone: true, selector: "x-drawer-portal", inputs: { placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.x-drawer-portal": "this._has", "animate.enter": "this.animateEnter", "animate.leave": "this.animateLeave" } }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template [cdkPortalOutlet]=\"portal\"></ng-template>\r\n", styles: [".x-drawer-portal{margin:0;padding:0}.x-drawer-portal{height:100%;width:100%;background-color:var(--x-background-100);position:relative;box-shadow:var(--x-box-shadow);overflow:auto;padding:1rem}.x-drawer-portal-title{display:block;margin:0 0 .5rem;font-weight:600;color:var(--x-text-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-drawer-portal-content{display:block;margin:0 -1rem;padding:0 1rem;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerPortalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerPortalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'x-drawer-portal', imports: [PortalModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template [cdkPortalOutlet]=\"portal\"></ng-template>\r\n", styles: [".x-drawer-portal{margin:0;padding:0}.x-drawer-portal{height:100%;width:100%;background-color:var(--x-background-100);position:relative;box-shadow:var(--x-box-shadow);overflow:auto;padding:1rem}.x-drawer-portal-title{display:block;margin:0 0 .5rem;font-weight:600;color:var(--x-text-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-drawer-portal-content{display:block;margin:0 -1rem;padding:0 1rem;overflow:auto}\n"] }]
         }], propDecorators: { _has: [{
@@ -224,10 +224,10 @@ class XDrawerCloseDirective {
     onCloseClick() {
         this.drawerRef && this.drawerRef.close();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.5", type: XDrawerCloseDirective, isStandalone: true, selector: "[x-drawer-close]", host: { listeners: { "click": "onCloseClick()" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: XDrawerCloseDirective, isStandalone: true, selector: "[x-drawer-close]", host: { listeners: { "click": "onCloseClick()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerCloseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerCloseDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: `[x-drawer-close]`
@@ -240,10 +240,10 @@ class XDrawerTitleDirective {
     constructor() {
         this._has = true;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.5", type: XDrawerTitleDirective, isStandalone: true, selector: "[x-drawer-title]", host: { properties: { "class.x-drawer-portal-title": "this._has" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: XDrawerTitleDirective, isStandalone: true, selector: "[x-drawer-title]", host: { properties: { "class.x-drawer-portal-title": "this._has" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: `[x-drawer-title]`
@@ -256,10 +256,10 @@ class XDrawerContentDirective {
     constructor() {
         this._has = true;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.5", type: XDrawerContentDirective, isStandalone: true, selector: "[x-drawer-content], x-drawer-content", host: { properties: { "class.x-drawer-portal-content": "this._has" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: XDrawerContentDirective, isStandalone: true, selector: "[x-drawer-content], x-drawer-content", host: { properties: { "class.x-drawer-portal-content": "this._has" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: `[x-drawer-content], x-drawer-content`
@@ -274,15 +274,15 @@ class XDrawerContainerComponent extends XDrawerContainerProperty {
         super(...arguments);
         this.className = XDrawerContainerPrefix;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.5", type: XDrawerContainerComponent, isStandalone: true, selector: "x-drawer-container", host: { properties: { "class": "this.className" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: XDrawerContainerComponent, isStandalone: true, selector: "x-drawer-container", host: { properties: { "class": "this.className" } }, providers: [
             {
                 provide: X_DRAWER_CONTAINER,
                 useExisting: XDrawerContainerComponent
             }
         ], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [".x-drawer-container{margin:0;padding:0}.x-drawer-container{position:relative;z-index:1;box-sizing:border-box;display:block;overflow:hidden}.x-drawer-container .x-drawer{position:absolute;display:block;outline:0;z-index:1001;width:initial;height:initial}.x-drawer-container .x-drawer-left{left:0;top:0}.x-drawer-container .x-drawer-right{right:0;top:0}.x-drawer-container .x-drawer-top{top:0;left:0}.x-drawer-container .x-drawer-bottom{bottom:0;left:0}.x-drawer-container .x-drawer-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;background:#00000052}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: XDrawerContainerPrefix, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -296,8 +296,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImpor
             }] } });
 
 class XDrawerModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XDrawerModule, imports: [XDrawerComponent,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XDrawerModule, imports: [XDrawerComponent,
             XDrawerCloseDirective,
             XDrawerTitleDirective,
             XDrawerContentDirective,
@@ -306,9 +306,9 @@ class XDrawerModule {
             XDrawerTitleDirective,
             XDrawerContentDirective,
             XDrawerContainerComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerModule, imports: [XDrawerComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerModule, imports: [XDrawerComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [
@@ -379,10 +379,10 @@ class XDrawerService {
             });
         return drawerRef;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerService, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDrawerService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDrawerService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });

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

@@ -94,10 +94,10 @@ class XDropdownProperty extends XPropertyFunction(X_DROPDOWN_CONFIG_NAME) {
          */
         this.nodeClick = output();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XDropdownProperty, isStandalone: true, selector: "x-dropdown-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, children: { classPropertyName: "children", publicName: "children", isSignal: true, isRequired: false, transformFunction: null }, portalMinWidth: { classPropertyName: "portalMinWidth", publicName: "portalMinWidth", isSignal: true, isRequired: false, transformFunction: null }, portalMaxWidth: { classPropertyName: "portalMaxWidth", publicName: "portalMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, portalMinHeight: { classPropertyName: "portalMinHeight", publicName: "portalMinHeight", isSignal: true, isRequired: false, transformFunction: null }, portalMaxHeight: { classPropertyName: "portalMaxHeight", publicName: "portalMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, hoverDelay: { classPropertyName: "hoverDelay", publicName: "hoverDelay", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, activatedId: { classPropertyName: "activatedId", publicName: "activatedId", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", activatedId: "activatedIdChange", nodeClick: "nodeClick" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XDropdownProperty, isStandalone: true, selector: "x-dropdown-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, children: { classPropertyName: "children", publicName: "children", isSignal: true, isRequired: false, transformFunction: null }, portalMinWidth: { classPropertyName: "portalMinWidth", publicName: "portalMinWidth", isSignal: true, isRequired: false, transformFunction: null }, portalMaxWidth: { classPropertyName: "portalMaxWidth", publicName: "portalMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, portalMinHeight: { classPropertyName: "portalMinHeight", publicName: "portalMinHeight", isSignal: true, isRequired: false, transformFunction: null }, portalMaxHeight: { classPropertyName: "portalMaxHeight", publicName: "portalMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, hoverDelay: { classPropertyName: "hoverDelay", publicName: "hoverDelay", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, activatedId: { classPropertyName: "activatedId", publicName: "activatedId", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", activatedId: "activatedIdChange", nodeClick: "nodeClick" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XDropdownPrefix}-property`, template: '' }]
         }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], children: [{ type: i0.Input, args: [{ isSignal: true, alias: "children", required: false }] }], portalMinWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "portalMinWidth", required: false }] }], portalMaxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "portalMaxWidth", required: false }] }], portalMinHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "portalMinHeight", required: false }] }], portalMaxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "portalMaxHeight", required: false }] }], hoverDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverDelay", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], activatedId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activatedId", required: false }] }, { type: i0.Output, args: ["activatedIdChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], nodeClick: [{ type: i0.Output, args: ["nodeClick"] }] } });
@@ -343,10 +343,10 @@ class XDropdownPortalComponent {
         }
         return null;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.5", type: XDropdownPortalComponent, isStandalone: true, selector: "x-dropdown-portal", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, parentPortalComponent: { classPropertyName: "parentPortalComponent", publicName: "parentPortalComponent", isSignal: true, isRequired: false, transformFunction: null }, isKeyboardControlled: { classPropertyName: "isKeyboardControlled", publicName: "isKeyboardControlled", isSignal: true, isRequired: false, transformFunction: null }, activatedId: { classPropertyName: "activatedId", publicName: "activatedId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isKeyboardControlled: "isKeyboardControlledChange", closed: "closed", animating: "animating", nodeClick: "nodeClick", portalHover: "portalHover", activatedId: "activatedIdChange" }, host: { listeners: { "animationend": "done()", "animationstart": "start()", "mouseenter": "mouseenter()", "mouseleave": "mouseleave()" }, properties: { "animate.enter": "this.animateEnter", "animate.leave": "this.animateLeave" } }, viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  #dropdownPortal\r\n  class=\"x-dropdown-portal\"\r\n  [style.minWidth]=\"minWidth()\"\r\n  [style.maxWidth]=\"maxWidth()\"\r\n  [style.minHeight]=\"minHeight()\"\r\n  [style.maxHeight]=\"maxHeight()\"\r\n>\r\n  <x-list\r\n    #list\r\n    [data]=\"data()\"\r\n    [ngModel]=\"activatedIdComputed()\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    (keyManagerChange)=\"onActive($event)\"\r\n    (keyManagerTabOut)=\"onTabOut()\"\r\n    (nodeMouseenter)=\"onEnter($event)\"\r\n    (nodeMouseleave)=\"onLeave()\"\r\n    [isKeyboardControlled]=\"isKeyboardControlled()\"\r\n    [inPortal]=\"true\"\r\n    [size]=\"size()\"\r\n  ></x-list>\r\n</div>\r\n", styles: ["x-dropdown-portal{width:100%}.x-dropdown-portal{margin:.0625rem 0;color:var(--x-text);width:100%;background-color:var(--x-background-100);border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;overflow:auto}.x-dropdown-portal .x-open-portal{background-color:var(--x-background-a200)}.x-dropdown-portal-child{margin-top:-.3125rem}.x-dropdown-portal-child>x-dropdown-portal{padding:0 .3125rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XListComponent, selector: "x-list" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.0", type: XDropdownPortalComponent, isStandalone: true, selector: "x-dropdown-portal", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, parentPortalComponent: { classPropertyName: "parentPortalComponent", publicName: "parentPortalComponent", isSignal: true, isRequired: false, transformFunction: null }, isKeyboardControlled: { classPropertyName: "isKeyboardControlled", publicName: "isKeyboardControlled", isSignal: true, isRequired: false, transformFunction: null }, activatedId: { classPropertyName: "activatedId", publicName: "activatedId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isKeyboardControlled: "isKeyboardControlledChange", closed: "closed", animating: "animating", nodeClick: "nodeClick", portalHover: "portalHover", activatedId: "activatedIdChange" }, host: { listeners: { "animationend": "done()", "animationstart": "start()", "mouseenter": "mouseenter()", "mouseleave": "mouseleave()" }, properties: { "animate.enter": "this.animateEnter", "animate.leave": "this.animateLeave" } }, viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  #dropdownPortal\r\n  class=\"x-dropdown-portal\"\r\n  [style.minWidth]=\"minWidth()\"\r\n  [style.maxWidth]=\"maxWidth()\"\r\n  [style.minHeight]=\"minHeight()\"\r\n  [style.maxHeight]=\"maxHeight()\"\r\n>\r\n  <x-list\r\n    #list\r\n    [data]=\"data()\"\r\n    [ngModel]=\"activatedIdComputed()\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    (keyManagerChange)=\"onActive($event)\"\r\n    (keyManagerTabOut)=\"onTabOut()\"\r\n    (nodeMouseenter)=\"onEnter($event)\"\r\n    (nodeMouseleave)=\"onLeave()\"\r\n    [isKeyboardControlled]=\"isKeyboardControlled()\"\r\n    [inPortal]=\"true\"\r\n    [size]=\"size()\"\r\n  ></x-list>\r\n</div>\r\n", styles: ["x-dropdown-portal{width:100%}.x-dropdown-portal{margin:.0625rem 0;color:var(--x-text);width:100%;background-color:var(--x-background-100);border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;overflow:auto}.x-dropdown-portal .x-open-portal{background-color:var(--x-background-a200)}.x-dropdown-portal-child{margin-top:-.3125rem}.x-dropdown-portal-child>x-dropdown-portal{padding:0 .3125rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XListComponent, selector: "x-list" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownPortalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownPortalComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XDropdownPortalPrefix}`, imports: [FormsModule, XListComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  #dropdownPortal\r\n  class=\"x-dropdown-portal\"\r\n  [style.minWidth]=\"minWidth()\"\r\n  [style.maxWidth]=\"maxWidth()\"\r\n  [style.minHeight]=\"minHeight()\"\r\n  [style.maxHeight]=\"maxHeight()\"\r\n>\r\n  <x-list\r\n    #list\r\n    [data]=\"data()\"\r\n    [ngModel]=\"activatedIdComputed()\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    (keyManagerChange)=\"onActive($event)\"\r\n    (keyManagerTabOut)=\"onTabOut()\"\r\n    (nodeMouseenter)=\"onEnter($event)\"\r\n    (nodeMouseleave)=\"onLeave()\"\r\n    [isKeyboardControlled]=\"isKeyboardControlled()\"\r\n    [inPortal]=\"true\"\r\n    [size]=\"size()\"\r\n  ></x-list>\r\n</div>\r\n", styles: ["x-dropdown-portal{width:100%}.x-dropdown-portal{margin:.0625rem 0;color:var(--x-text);width:100%;background-color:var(--x-background-100);border-radius:var(--x-border-small-radius);box-shadow:var(--x-box-shadow);position:relative;display:flex;overflow:auto}.x-dropdown-portal .x-open-portal{background-color:var(--x-background-a200)}.x-dropdown-portal-child{margin-top:-.3125rem}.x-dropdown-portal-child>x-dropdown-portal{padding:0 .3125rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { animateEnter: [{
@@ -575,20 +575,20 @@ class XDropdownComponent extends XDropdownProperty {
             transformOriginOn: 'x-dropdown-portal'
         });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.5", type: XDropdownComponent, isStandalone: true, selector: "x-dropdown", viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n  #dropdown\r\n  class=\"x-dropdown\"\r\n  [class.x-visible]=\"visibleClass()\"\r\n  (mouseenter)=\"onEnter()\"\r\n  (mouseleave)=\"onLeave()\"\r\n  (click)=\"onClickShow()\"\r\n  (keydown)=\"onKeydown($event)\"\r\n  tabindex=\"-1\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".x-dropdown{margin:0;padding:0}.x-dropdown{display:inline-block}.x-dropdown.x-visible{color:var(--x-primary)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.0", type: XDropdownComponent, isStandalone: true, selector: "x-dropdown", viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n  #dropdown\r\n  class=\"x-dropdown\"\r\n  [class.x-visible]=\"visibleClass()\"\r\n  (mouseenter)=\"onEnter()\"\r\n  (mouseleave)=\"onLeave()\"\r\n  (click)=\"onClickShow()\"\r\n  (keydown)=\"onKeydown($event)\"\r\n  tabindex=\"-1\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".x-dropdown{margin:0;padding:0}.x-dropdown{display:inline-block}.x-dropdown.x-visible{color:var(--x-primary)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XDropdownPrefix}`, imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  #dropdown\r\n  class=\"x-dropdown\"\r\n  [class.x-visible]=\"visibleClass()\"\r\n  (mouseenter)=\"onEnter()\"\r\n  (mouseleave)=\"onLeave()\"\r\n  (click)=\"onClickShow()\"\r\n  (keydown)=\"onKeydown($event)\"\r\n  tabindex=\"-1\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".x-dropdown{margin:0;padding:0}.x-dropdown{display:inline-block}.x-dropdown.x-visible{color:var(--x-primary)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { dropdown: [{ type: i0.ViewChild, args: ['dropdown', { isSignal: true }] }] } });
 
 class XDropdownModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XDropdownModule, imports: [XDropdownComponent], exports: [XDropdownComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownModule }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XDropdownModule, imports: [XDropdownComponent], exports: [XDropdownComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XDropdownModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XDropdownModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [XDropdownComponent],

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

@@ -48,29 +48,29 @@ class XEmptyProperty extends XPropertyFunction(X_EMPTY_CONFIG_NAME) {
          */
         this.content = input(this.config?.content ?? '', ...(ngDevMode ? [{ debugName: "content" }] : []));
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XEmptyProperty, isStandalone: true, selector: "x-empty-property", inputs: { img: { classPropertyName: "img", publicName: "img", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XEmptyProperty, isStandalone: true, selector: "x-empty-property", inputs: { img: { classPropertyName: "img", publicName: "img", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XEmptyPrefix}-property`, template: '' }]
         }], propDecorators: { img: [{ type: i0.Input, args: [{ isSignal: true, alias: "img", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }] } });
 
 class XEmptyComponent extends XEmptyProperty {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XEmptyComponent, isStandalone: true, selector: "x-empty", usesInheritance: true, ngImport: i0, template: "<div #empty class=\"x-empty\">\r\n  @if (img()) {\r\n    <ng-container *xOutlet=\"img()\">\r\n      <img class=\"x-empty-img\" [src]=\"img()\" />\r\n    </ng-container>\r\n  } @else {\r\n    <x-icon type=\"fto-inbox\"></x-icon>\r\n  }\r\n  @if (content()) {\r\n    <ng-container *xOutlet=\"content()\">\r\n      <span>{{ content() }}</span>\r\n    </ng-container>\r\n  } @else {\r\n    <span>{{ 'empty.noData' | xI18n }}</span>\r\n  }\r\n</div>\r\n", styles: [".x-empty{margin:0;padding:0}.x-empty{display:flex;align-items:center;flex-direction:column;color:var(--x-text-800)}.x-empty>.x-icon{font-size:calc(var(--x-font-size) + 1.125rem)}.x-empty>span{line-height:calc(var(--x-font-size) + 1rem)}.x-empty-img{height:5rem}\n"], dependencies: [{ kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "pipe", type: XI18nPipe, name: "xI18n" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: XEmptyComponent, isStandalone: true, selector: "x-empty", usesInheritance: true, ngImport: i0, template: "<div #empty class=\"x-empty\">\r\n  @if (img()) {\r\n    <ng-container *xOutlet=\"img()\">\r\n      <img class=\"x-empty-img\" [src]=\"img()\" />\r\n    </ng-container>\r\n  } @else {\r\n    <x-icon type=\"fto-inbox\"></x-icon>\r\n  }\r\n  @if (content()) {\r\n    <ng-container *xOutlet=\"content()\">\r\n      <span>{{ content() }}</span>\r\n    </ng-container>\r\n  } @else {\r\n    <span>{{ 'empty.noData' | xI18n }}</span>\r\n  }\r\n</div>\r\n", styles: [".x-empty{margin:0;padding:0}.x-empty{display:flex;align-items:center;flex-direction:column;color:var(--x-text-800)}.x-empty>.x-icon{font-size:calc(var(--x-font-size) + 1.125rem)}.x-empty>span{line-height:calc(var(--x-font-size) + 1rem)}.x-empty-img{height:5rem}\n"], dependencies: [{ kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "pipe", type: XI18nPipe, name: "xI18n" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XEmptyPrefix}`, imports: [XOutletDirective, XIconComponent, XI18nPipe], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #empty class=\"x-empty\">\r\n  @if (img()) {\r\n    <ng-container *xOutlet=\"img()\">\r\n      <img class=\"x-empty-img\" [src]=\"img()\" />\r\n    </ng-container>\r\n  } @else {\r\n    <x-icon type=\"fto-inbox\"></x-icon>\r\n  }\r\n  @if (content()) {\r\n    <ng-container *xOutlet=\"content()\">\r\n      <span>{{ content() }}</span>\r\n    </ng-container>\r\n  } @else {\r\n    <span>{{ 'empty.noData' | xI18n }}</span>\r\n  }\r\n</div>\r\n", styles: [".x-empty{margin:0;padding:0}.x-empty{display:flex;align-items:center;flex-direction:column;color:var(--x-text-800)}.x-empty>.x-icon{font-size:calc(var(--x-font-size) + 1.125rem)}.x-empty>span{line-height:calc(var(--x-font-size) + 1rem)}.x-empty-img{height:5rem}\n"] }]
         }] });
 
 class XEmptyModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XEmptyModule, imports: [XEmptyComponent], exports: [XEmptyComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyModule, imports: [XEmptyComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XEmptyModule, imports: [XEmptyComponent], exports: [XEmptyComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyModule, imports: [XEmptyComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XEmptyModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XEmptyModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XEmptyComponent],

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

@@ -12,10 +12,10 @@ class XExamplesComponent {
     constructor() {
         this.className = XExamplesPrefix;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XExamplesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.5", type: XExamplesComponent, isStandalone: true, selector: "x-examples", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [".x-examples{margin:0;padding:0}.x-examples{display:block}.x-examples .x-examples-html{padding:1.5rem 1.5rem 3.75rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-bottom-left-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius);position:relative}.x-examples .x-examples-tools{position:absolute;bottom:0;right:0;width:100%;display:flex;justify-content:center;align-items:center;border-top:.125rem dashed var(--x-border-500)}.x-examples .x-examples-code{margin-top:.25rem}.x-examples .x-examples-code>x-tabs>.x-tabs{border-radius:.125rem}.x-examples .x-examples-code>x-tabs>.x-tabs>.x-tabs-contents>.x-tab-content>.x-highlight{border-top-left-radius:0;border-top-right-radius:0;border:0;max-height:37.5rem;overflow:auto}.x-examples .x-examples-code>x-tabs>.x-tabs>.x-tabs-contents>.x-tab-content>.x-highlight>pre{background-color:transparent}.x-examples .x-examples-info{padding:1rem 1.5rem;border-top-left-radius:var(--x-border-radius);border-top-right-radius:var(--x-border-radius);border-top:var(--x-border-width) var(--x-border-style) var(--x-border);border-left:var(--x-border-width) var(--x-border-style) var(--x-border);border-right:var(--x-border-width) var(--x-border-style) var(--x-border);background-color:var(--x-background-a100)}.x-examples .x-examples-info>p{margin:.25rem 0 0}.x-examples .x-examples-info>p:first-of-type{margin-top:0}.x-examples .x-examples-info>ul{margin:.25rem 0}.x-examples .x-examples-info>ul>li{list-style-type:circle;margin:.125rem .125rem .125rem 1.25rem;line-height:1.75rem}.x-examples .x-examples-info>ul>li::marker{color:var(--x-text-500)}.x-examples .x-examples-info>table{width:100%;border-collapse:collapse;border:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-examples .x-examples-info>table tr>th,.x-examples .x-examples-info>table tr>td{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);border-right:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left;padding:var(--x-padding-mini) var(--x-padding-small)}.x-examples .x-examples-info>table tr th{white-space:nowrap;color:var(--x-text)}.x-examples>x-tabs>.x-tabs{width:100%}.x-examples>x-tabs>.x-tabs>.x-tabs-list{border:none}.x-examples>x-tabs>.x-tabs-top>.x-tabs-list{border:none}.x-examples>x-tabs>.x-tabs-left>.x-tabs-contents,.x-examples>x-tabs>.x-tabs-top>.x-tabs-contents{background-color:transparent}.x-examples>x-tabs>.x-tabs-left>.x-tabs-list{padding:0}.x-examples>x-tabs>.x-tabs-left>.x-tabs-list>x-slider>.x-slider>.x-slider-scroll>ul{min-width:6rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XExamplesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: XExamplesComponent, isStandalone: true, selector: "x-examples", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [".x-examples{margin:0;padding:0}.x-examples{display:block}.x-examples .x-examples-html{padding:1.5rem 1.5rem 3.75rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-bottom-left-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius);position:relative}.x-examples .x-examples-tools{position:absolute;bottom:0;right:0;width:100%;display:flex;justify-content:center;align-items:center;border-top:.125rem dashed var(--x-border-500)}.x-examples .x-examples-code{margin-top:.25rem}.x-examples .x-examples-code>x-tabs>.x-tabs{border-radius:.125rem}.x-examples .x-examples-code>x-tabs>.x-tabs>.x-tabs-contents>.x-tab-content>.x-highlight{border-top-left-radius:0;border-top-right-radius:0;border:0;max-height:37.5rem;overflow:auto}.x-examples .x-examples-code>x-tabs>.x-tabs>.x-tabs-contents>.x-tab-content>.x-highlight>pre{background-color:transparent}.x-examples .x-examples-info{padding:1rem 1.5rem;border-top-left-radius:var(--x-border-radius);border-top-right-radius:var(--x-border-radius);border-top:var(--x-border-width) var(--x-border-style) var(--x-border);border-left:var(--x-border-width) var(--x-border-style) var(--x-border);border-right:var(--x-border-width) var(--x-border-style) var(--x-border);background-color:var(--x-background-a100)}.x-examples .x-examples-info>p{margin:.25rem 0 0}.x-examples .x-examples-info>p:first-of-type{margin-top:0}.x-examples .x-examples-info>ul{margin:.25rem 0}.x-examples .x-examples-info>ul>li{list-style-type:circle;margin:.125rem .125rem .125rem 1.25rem;line-height:1.75rem}.x-examples .x-examples-info>ul>li::marker{color:var(--x-text-500)}.x-examples .x-examples-info>table{width:100%;border-collapse:collapse;border:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-examples .x-examples-info>table tr>th,.x-examples .x-examples-info>table tr>td{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);border-right:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left;padding:var(--x-padding-mini) var(--x-padding-small)}.x-examples .x-examples-info>table tr th{white-space:nowrap;color:var(--x-text)}.x-examples>x-tabs>.x-tabs{width:100%}.x-examples>x-tabs>.x-tabs>.x-tabs-list{border:none}.x-examples>x-tabs>.x-tabs-top>.x-tabs-list{border:none}.x-examples>x-tabs>.x-tabs-left>.x-tabs-contents,.x-examples>x-tabs>.x-tabs-top>.x-tabs-contents{background-color:transparent}.x-examples>x-tabs>.x-tabs-left>.x-tabs-list{padding:0}.x-examples>x-tabs>.x-tabs-left>.x-tabs-list>x-slider>.x-slider>.x-slider-scroll>ul{min-width:6rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XExamplesComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XExamplesComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XExamplesPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\r\n", styles: [".x-examples{margin:0;padding:0}.x-examples{display:block}.x-examples .x-examples-html{padding:1.5rem 1.5rem 3.75rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-bottom-left-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius);position:relative}.x-examples .x-examples-tools{position:absolute;bottom:0;right:0;width:100%;display:flex;justify-content:center;align-items:center;border-top:.125rem dashed var(--x-border-500)}.x-examples .x-examples-code{margin-top:.25rem}.x-examples .x-examples-code>x-tabs>.x-tabs{border-radius:.125rem}.x-examples .x-examples-code>x-tabs>.x-tabs>.x-tabs-contents>.x-tab-content>.x-highlight{border-top-left-radius:0;border-top-right-radius:0;border:0;max-height:37.5rem;overflow:auto}.x-examples .x-examples-code>x-tabs>.x-tabs>.x-tabs-contents>.x-tab-content>.x-highlight>pre{background-color:transparent}.x-examples .x-examples-info{padding:1rem 1.5rem;border-top-left-radius:var(--x-border-radius);border-top-right-radius:var(--x-border-radius);border-top:var(--x-border-width) var(--x-border-style) var(--x-border);border-left:var(--x-border-width) var(--x-border-style) var(--x-border);border-right:var(--x-border-width) var(--x-border-style) var(--x-border);background-color:var(--x-background-a100)}.x-examples .x-examples-info>p{margin:.25rem 0 0}.x-examples .x-examples-info>p:first-of-type{margin-top:0}.x-examples .x-examples-info>ul{margin:.25rem 0}.x-examples .x-examples-info>ul>li{list-style-type:circle;margin:.125rem .125rem .125rem 1.25rem;line-height:1.75rem}.x-examples .x-examples-info>ul>li::marker{color:var(--x-text-500)}.x-examples .x-examples-info>table{width:100%;border-collapse:collapse;border:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-examples .x-examples-info>table tr>th,.x-examples .x-examples-info>table tr>td{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);border-right:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left;padding:var(--x-padding-mini) var(--x-padding-small)}.x-examples .x-examples-info>table tr th{white-space:nowrap;color:var(--x-text)}.x-examples>x-tabs>.x-tabs{width:100%}.x-examples>x-tabs>.x-tabs>.x-tabs-list{border:none}.x-examples>x-tabs>.x-tabs-top>.x-tabs-list{border:none}.x-examples>x-tabs>.x-tabs-left>.x-tabs-contents,.x-examples>x-tabs>.x-tabs-top>.x-tabs-contents{background-color:transparent}.x-examples>x-tabs>.x-tabs-left>.x-tabs-list{padding:0}.x-examples>x-tabs>.x-tabs-left>.x-tabs-list>x-slider>.x-slider>.x-slider-scroll>ul{min-width:6rem}\n"] }]
         }], propDecorators: { className: [{
@@ -24,11 +24,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImpor
             }] } });
 
 class XExamplesModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XExamplesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XExamplesModule, imports: [XExamplesComponent], exports: [XExamplesComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XExamplesModule }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XExamplesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XExamplesModule, imports: [XExamplesComponent], exports: [XExamplesComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XExamplesModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XExamplesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XExamplesModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XExamplesComponent],

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

@@ -266,10 +266,10 @@ class XFindProperty extends XFormControlFunction(X_FIND_CONFIG_NAME) {
          */
         this.required = input(false, ...(ngDevMode ? [{ debugName: "required", transform: XToBoolean }] : [{ transform: XToBoolean }]));
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XFindProperty, isStandalone: true, selector: "x-find-property", inputs: { bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, columnLabel: { classPropertyName: "columnLabel", publicName: "columnLabel", isSignal: true, isRequired: false, transformFunction: null }, dialogTitle: { classPropertyName: "dialogTitle", publicName: "dialogTitle", isSignal: true, isRequired: false, transformFunction: null }, dialogCheckboxLabel: { classPropertyName: "dialogCheckboxLabel", publicName: "dialogCheckboxLabel", isSignal: true, isRequired: false, transformFunction: null }, dialogCheckboxWidth: { classPropertyName: "dialogCheckboxWidth", publicName: "dialogCheckboxWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogEmptyContent: { classPropertyName: "dialogEmptyContent", publicName: "dialogEmptyContent", isSignal: true, isRequired: false, transformFunction: null }, dialogWidth: { classPropertyName: "dialogWidth", publicName: "dialogWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogHeight: { classPropertyName: "dialogHeight", publicName: "dialogHeight", isSignal: true, isRequired: false, transformFunction: null }, dialogVisible: { classPropertyName: "dialogVisible", publicName: "dialogVisible", isSignal: true, isRequired: false, transformFunction: null }, dialogButtonsCenter: { classPropertyName: "dialogButtonsCenter", publicName: "dialogButtonsCenter", isSignal: true, isRequired: false, transformFunction: null }, tableData: { classPropertyName: "tableData", publicName: "tableData", isSignal: true, isRequired: false, transformFunction: null }, tableIndex: { classPropertyName: "tableIndex", publicName: "tableIndex", isSignal: true, isRequired: false, transformFunction: null }, tableSize: { classPropertyName: "tableSize", publicName: "tableSize", isSignal: true, isRequired: false, transformFunction: null }, tableQuery: { classPropertyName: "tableQuery", publicName: "tableQuery", isSignal: true, isRequired: false, transformFunction: null }, tableTotal: { classPropertyName: "tableTotal", publicName: "tableTotal", isSignal: true, isRequired: false, transformFunction: null }, tableColumns: { classPropertyName: "tableColumns", publicName: "tableColumns", isSignal: true, isRequired: false, transformFunction: null }, tableActivatedRow: { classPropertyName: "tableActivatedRow", publicName: "tableActivatedRow", isSignal: true, isRequired: false, transformFunction: null }, tableCheckedRow: { classPropertyName: "tableCheckedRow", publicName: "tableCheckedRow", isSignal: true, isRequired: false, transformFunction: null }, tableLoading: { classPropertyName: "tableLoading", publicName: "tableLoading", isSignal: true, isRequired: false, transformFunction: null }, tableVirtualScroll: { classPropertyName: "tableVirtualScroll", publicName: "tableVirtualScroll", isSignal: true, isRequired: false, transformFunction: null }, tableScroll: { classPropertyName: "tableScroll", publicName: "tableScroll", isSignal: true, isRequired: false, transformFunction: null }, tableBodyHeight: { classPropertyName: "tableBodyHeight", publicName: "tableBodyHeight", isSignal: true, isRequired: false, transformFunction: null }, tableMinBufferPx: { classPropertyName: "tableMinBufferPx", publicName: "tableMinBufferPx", isSignal: true, isRequired: false, transformFunction: null }, tableMaxBufferPx: { classPropertyName: "tableMaxBufferPx", publicName: "tableMaxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, tableAdaptionHeight: { classPropertyName: "tableAdaptionHeight", publicName: "tableAdaptionHeight", isSignal: true, isRequired: false, transformFunction: null }, tableDocPercent: { classPropertyName: "tableDocPercent", publicName: "tableDocPercent", isSignal: true, isRequired: false, transformFunction: null }, tableRowHeight: { classPropertyName: "tableRowHeight", publicName: "tableRowHeight", isSignal: true, isRequired: false, transformFunction: null }, treeData: { classPropertyName: "treeData", publicName: "treeData", isSignal: true, isRequired: false, transformFunction: null }, treeActivatedId: { classPropertyName: "treeActivatedId", publicName: "treeActivatedId", isSignal: true, isRequired: false, transformFunction: null }, treeExpandedLevel: { classPropertyName: "treeExpandedLevel", publicName: "treeExpandedLevel", isSignal: true, isRequired: false, transformFunction: null }, treeChecked: { classPropertyName: "treeChecked", publicName: "treeChecked", isSignal: true, isRequired: false, transformFunction: null }, treeCheckbox: { classPropertyName: "treeCheckbox", publicName: "treeCheckbox", isSignal: true, isRequired: false, transformFunction: null }, treeTableConnect: { classPropertyName: "treeTableConnect", publicName: "treeTableConnect", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null }, labelAlign: { classPropertyName: "labelAlign", publicName: "labelAlign", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dialogVisible: "dialogVisibleChange", tableIndex: "tableIndexChange", tableSize: "tableSizeChange", tableQuery: "tableQueryChange", tableTotal: "tableTotalChange", tableSortChange: "tableSortChange", tableActivatedRow: "tableActivatedRowChange", tableRowEmit: "tableRowEmit", tableCheckedRow: "tableCheckedRowChange", treeActivatedId: "treeActivatedIdChange", treeChecked: "treeCheckedChange", search: "searchChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XFindProperty, isStandalone: true, selector: "x-find-property", inputs: { bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, columnLabel: { classPropertyName: "columnLabel", publicName: "columnLabel", isSignal: true, isRequired: false, transformFunction: null }, dialogTitle: { classPropertyName: "dialogTitle", publicName: "dialogTitle", isSignal: true, isRequired: false, transformFunction: null }, dialogCheckboxLabel: { classPropertyName: "dialogCheckboxLabel", publicName: "dialogCheckboxLabel", isSignal: true, isRequired: false, transformFunction: null }, dialogCheckboxWidth: { classPropertyName: "dialogCheckboxWidth", publicName: "dialogCheckboxWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogEmptyContent: { classPropertyName: "dialogEmptyContent", publicName: "dialogEmptyContent", isSignal: true, isRequired: false, transformFunction: null }, dialogWidth: { classPropertyName: "dialogWidth", publicName: "dialogWidth", isSignal: true, isRequired: false, transformFunction: null }, dialogHeight: { classPropertyName: "dialogHeight", publicName: "dialogHeight", isSignal: true, isRequired: false, transformFunction: null }, dialogVisible: { classPropertyName: "dialogVisible", publicName: "dialogVisible", isSignal: true, isRequired: false, transformFunction: null }, dialogButtonsCenter: { classPropertyName: "dialogButtonsCenter", publicName: "dialogButtonsCenter", isSignal: true, isRequired: false, transformFunction: null }, tableData: { classPropertyName: "tableData", publicName: "tableData", isSignal: true, isRequired: false, transformFunction: null }, tableIndex: { classPropertyName: "tableIndex", publicName: "tableIndex", isSignal: true, isRequired: false, transformFunction: null }, tableSize: { classPropertyName: "tableSize", publicName: "tableSize", isSignal: true, isRequired: false, transformFunction: null }, tableQuery: { classPropertyName: "tableQuery", publicName: "tableQuery", isSignal: true, isRequired: false, transformFunction: null }, tableTotal: { classPropertyName: "tableTotal", publicName: "tableTotal", isSignal: true, isRequired: false, transformFunction: null }, tableColumns: { classPropertyName: "tableColumns", publicName: "tableColumns", isSignal: true, isRequired: false, transformFunction: null }, tableActivatedRow: { classPropertyName: "tableActivatedRow", publicName: "tableActivatedRow", isSignal: true, isRequired: false, transformFunction: null }, tableCheckedRow: { classPropertyName: "tableCheckedRow", publicName: "tableCheckedRow", isSignal: true, isRequired: false, transformFunction: null }, tableLoading: { classPropertyName: "tableLoading", publicName: "tableLoading", isSignal: true, isRequired: false, transformFunction: null }, tableVirtualScroll: { classPropertyName: "tableVirtualScroll", publicName: "tableVirtualScroll", isSignal: true, isRequired: false, transformFunction: null }, tableScroll: { classPropertyName: "tableScroll", publicName: "tableScroll", isSignal: true, isRequired: false, transformFunction: null }, tableBodyHeight: { classPropertyName: "tableBodyHeight", publicName: "tableBodyHeight", isSignal: true, isRequired: false, transformFunction: null }, tableMinBufferPx: { classPropertyName: "tableMinBufferPx", publicName: "tableMinBufferPx", isSignal: true, isRequired: false, transformFunction: null }, tableMaxBufferPx: { classPropertyName: "tableMaxBufferPx", publicName: "tableMaxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, tableAdaptionHeight: { classPropertyName: "tableAdaptionHeight", publicName: "tableAdaptionHeight", isSignal: true, isRequired: false, transformFunction: null }, tableDocPercent: { classPropertyName: "tableDocPercent", publicName: "tableDocPercent", isSignal: true, isRequired: false, transformFunction: null }, tableRowHeight: { classPropertyName: "tableRowHeight", publicName: "tableRowHeight", isSignal: true, isRequired: false, transformFunction: null }, treeData: { classPropertyName: "treeData", publicName: "treeData", isSignal: true, isRequired: false, transformFunction: null }, treeActivatedId: { classPropertyName: "treeActivatedId", publicName: "treeActivatedId", isSignal: true, isRequired: false, transformFunction: null }, treeExpandedLevel: { classPropertyName: "treeExpandedLevel", publicName: "treeExpandedLevel", isSignal: true, isRequired: false, transformFunction: null }, treeChecked: { classPropertyName: "treeChecked", publicName: "treeChecked", isSignal: true, isRequired: false, transformFunction: null }, treeCheckbox: { classPropertyName: "treeCheckbox", publicName: "treeCheckbox", isSignal: true, isRequired: false, transformFunction: null }, treeTableConnect: { classPropertyName: "treeTableConnect", publicName: "treeTableConnect", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null }, labelAlign: { classPropertyName: "labelAlign", publicName: "labelAlign", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dialogVisible: "dialogVisibleChange", tableIndex: "tableIndexChange", tableSize: "tableSizeChange", tableQuery: "tableQueryChange", tableTotal: "tableTotalChange", tableSortChange: "tableSortChange", tableActivatedRow: "tableActivatedRowChange", tableRowEmit: "tableRowEmit", tableCheckedRow: "tableCheckedRowChange", treeActivatedId: "treeActivatedIdChange", treeChecked: "treeCheckedChange", search: "searchChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XFindPrefix}-property`, template: '' }]
         }], propDecorators: { bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], columnLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnLabel", required: false }] }], dialogTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogTitle", required: false }] }], dialogCheckboxLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogCheckboxLabel", required: false }] }], dialogCheckboxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogCheckboxWidth", required: false }] }], dialogEmptyContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogEmptyContent", required: false }] }], dialogWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogWidth", required: false }] }], dialogHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogHeight", required: false }] }], dialogVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogVisible", required: false }] }, { type: i0.Output, args: ["dialogVisibleChange"] }], dialogButtonsCenter: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogButtonsCenter", required: false }] }], tableData: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableData", required: false }] }], tableIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableIndex", required: false }] }, { type: i0.Output, args: ["tableIndexChange"] }], tableSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableSize", required: false }] }, { type: i0.Output, args: ["tableSizeChange"] }], tableQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableQuery", required: false }] }, { type: i0.Output, args: ["tableQueryChange"] }], tableTotal: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableTotal", required: false }] }, { type: i0.Output, args: ["tableTotalChange"] }], tableSortChange: [{ type: i0.Output, args: ["tableSortChange"] }], tableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableColumns", required: false }] }], tableActivatedRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableActivatedRow", required: false }] }, { type: i0.Output, args: ["tableActivatedRowChange"] }], tableRowEmit: [{ type: i0.Output, args: ["tableRowEmit"] }], tableCheckedRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableCheckedRow", required: false }] }, { type: i0.Output, args: ["tableCheckedRowChange"] }], tableLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableLoading", required: false }] }], tableVirtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableVirtualScroll", required: false }] }], tableScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableScroll", required: false }] }], tableBodyHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableBodyHeight", required: false }] }], tableMinBufferPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableMinBufferPx", required: false }] }], tableMaxBufferPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableMaxBufferPx", required: false }] }], tableAdaptionHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableAdaptionHeight", required: false }] }], tableDocPercent: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableDocPercent", required: false }] }], tableRowHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableRowHeight", required: false }] }], treeData: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeData", required: false }] }], treeActivatedId: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeActivatedId", required: false }] }, { type: i0.Output, args: ["treeActivatedIdChange"] }], treeExpandedLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeExpandedLevel", required: false }] }], treeChecked: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeChecked", required: false }] }, { type: i0.Output, args: ["treeCheckedChange"] }], treeCheckbox: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeCheckbox", required: false }] }], treeTableConnect: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeTableConnect", required: false }] }], search: [{ type: i0.Input, args: [{ isSignal: true, alias: "search", required: false }] }, { type: i0.Output, args: ["searchChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelWidth", required: false }] }], labelAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelAlign", required: false }] }], justify: [{ type: i0.Input, args: [{ isSignal: true, alias: "justify", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }] } });
@@ -566,10 +566,10 @@ class XFindComponent extends XFindProperty {
         this.tableQuery.set(tableQuery);
         this.tableCom().change(1);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XFindComponent, isStandalone: true, selector: "x-find", providers: [XValueAccessor(XFindComponent)], viewQueries: [{ propertyName: "find", first: true, predicate: ["find"], descendants: true, isSignal: true }, { propertyName: "dialogCom", first: true, predicate: ["dialogCom"], descendants: true, isSignal: true }, { propertyName: "tableCom", first: true, predicate: ["tableCom"], descendants: true, isSignal: true }, { propertyName: "treeCom", first: true, predicate: ["treeCom"], descendants: true, isSignal: true }, { propertyName: "buttonCom", first: true, predicate: ["buttonCom"], descendants: true, isSignal: true }, { propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }, { propertyName: "treeRef", first: true, predicate: ["treeRef"], descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n  #find\r\n  class=\"x-find\"\r\n  [class.x-flex]=\"justify() || align() || direction()\"\r\n  [class.x-checked]=\"value()\"\r\n  [class.x-disabled]=\"disabledComputed()\"\r\n  [class.x-required]=\"requiredIsEmpty()\"\r\n  [class.x-invalid]=\"invalid()\"\r\n  [ngClass]=\"classMap()\"\r\n>\r\n  @if (label()) {\r\n    <label\r\n      [class.x-find-label-required]=\"requiredComputed()\"\r\n      [style.width]=\"labelWidth()\"\r\n      [ngClass]=\"labelMapSignal()\"\r\n      *xOutlet=\"label()\"\r\n    >\r\n      {{ label() }}\r\n    </label>\r\n  }\r\n  <div class=\"x-find-row\">\r\n    <x-button\r\n      #buttonCom\r\n      icon=\"fto-search\"\r\n      [onlyIcon]=\"!bordered()\"\r\n      [size]=\"size()\"\r\n      [disabled]=\"disabledComputed()\"\r\n      attrType=\"button\"\r\n      (click)=\"showModal()\"\r\n      flat\r\n      plain\r\n    ></x-button>\r\n    <div class=\"x-find-tags\">\r\n      @if (multiple()) {\r\n        @for (item of value(); track item.id; let i = $index) {\r\n          <x-tag\r\n            closable\r\n            [size]=\"size()\"\r\n            [bordered]=\"bordered()\"\r\n            [disabled]=\"disabledComputed()\"\r\n            (close)=\"tagClose(i)\"\r\n            >{{ item[columnLabel()] }}</x-tag\r\n          >\r\n        }\r\n      } @else if (value()) {\r\n        <x-tag closable [disabled]=\"disabledComputed()\" [bordered]=\"bordered()\" [size]=\"size()\" (close)=\"tagClose()\">{{\r\n          value()[columnLabel()]\r\n        }}</x-tag>\r\n      }\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<x-dialog\r\n  #dialogCom\r\n  [title]=\"dialogTitle()\"\r\n  [width]=\"dialogWidthSignal()\"\r\n  [height]=\"dialogHeight()\"\r\n  [buttonsCenter]=\"dialogButtonsCenter()\"\r\n  [className]=\"'x-find-dialog-container'\"\r\n  [(visible)]=\"dialogVisible\"\r\n  (closeDone)=\"dialogCloseDone()\"\r\n  (confirm)=\"sure()\"\r\n>\r\n  <div class=\"x-find-dialog\" [class.x-find-dialog-tree-table]=\"hasTable() && hasTree()\">\r\n    @if (hasTree()) {\r\n      <div class=\"x-find-dialog-tree\" #treeRef [style.height.px]=\"hasTreeTable() && multiple() && height()\">\r\n        <x-tree\r\n          #treeCom\r\n          [data]=\"treeData()\"\r\n          [nodeHeight]=\"'1.8rem'\"\r\n          [(manual)]=\"dialogVisible\"\r\n          [activatedId]=\"treeActivatedId()\"\r\n          [expandedLevel]=\"treeExpandedLevel()\"\r\n          (activatedChange)=\"treeActivatedClick($event)\"\r\n          [checkbox]=\"hasTreeMultiple() || treeCheckbox()\"\r\n          [(checked)]=\"treeChecked\"\r\n          (checkboxChange)=\"treeCheckboxChange($event)\"\r\n          [levelCheck]=\"!hasTreeMultiple()\"\r\n        ></x-tree>\r\n      </div>\r\n    }\r\n    @if (hasTable()) {\r\n      <div class=\"x-find-dialog-table\" #tableRef>\r\n        @if (hasSearch()) {\r\n          <div class=\"x-find-search\">\r\n            <x-input\r\n              [label]=\"search()!.label!\"\r\n              direction=\"row\"\r\n              (xKeydown)=\"searchKeyDown($event)\"\r\n              [(ngModel)]=\"search()!.value\"\r\n            ></x-input>\r\n            <x-button plain text (click)=\"searchClick()\">{{ search()!.button || '\u67E5\u8BE2' }}</x-button>\r\n          </div>\r\n        }\r\n        <x-table\r\n          #tableCom\r\n          [data]=\"tableData()\"\r\n          [columns]=\"tableColumnsSignal()\"\r\n          [(manual)]=\"dialogVisible\"\r\n          [(index)]=\"tableIndex\"\r\n          [(size)]=\"tableSize\"\r\n          [(query)]=\"tableQuery\"\r\n          [(total)]=\"tableTotal\"\r\n          [allowSelectRow]=\"!multiple()\"\r\n          [allowCheckRow]=\"multiple()\"\r\n          [checkedRow]=\"tableCheckedRow()\"\r\n          [loading]=\"tableLoading()\"\r\n          (sortChange)=\"tableSortChange.emit($event)\"\r\n          [(activatedRow)]=\"tableActivatedRow\"\r\n          (activatedRowChange)=\"tableActivatedRowChange($event!)\"\r\n          [rowHeight]=\"tableRowHeight()\"\r\n          [bodyHeight]=\"tableBodyHeight()!\"\r\n          [virtualScroll]=\"tableVirtualScroll()\"\r\n          [scroll]=\"tableScroll()\"\r\n          [minBufferPx]=\"tableMinBufferPx()\"\r\n          [maxBufferPx]=\"tableMaxBufferPx()\"\r\n          [adaptionHeight]=\"tableAdaptionHeight()!\"\r\n          [docPercent]=\"tableDocPercent()\"\r\n          (rowClick)=\"tableRowEmit.emit($event)\"\r\n        ></x-table>\r\n      </div>\r\n    }\r\n    @if (multiple()) {\r\n      <div class=\"x-find-dialog-checked\" [class.x-find-empty]=\"getEmpty()\" [style.height.px]=\"height()\">\r\n        @if (getEmpty()) {\r\n          <x-empty [content]=\"dialogEmptyContent()\"></x-empty>\r\n        }\r\n        <div class=\"x-find-dialog-tags\">\r\n          @for (item of temp(); track item.id; let i = $index) {\r\n            <x-tag closable (close)=\"tempClose(i, item)\">\r\n              <span>{{ item[columnLabel()] }}</span>\r\n            </x-tag>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  </div>\r\n</x-dialog>\r\n\r\n<ng-template #treeLabelTpl let-node=\"$node\">\r\n  <div class=\"x-find-dialog-tree-node\">\r\n    <span>{{ node.label }} </span>\r\n    @if (node.$checked) {\r\n      <x-icon type=\"fto-check\"></x-icon>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.x-find{margin:0;padding:0}.x-find{width:100%}.x-find.x-flex{display:flex}.x-find.x-justify-start{justify-content:flex-start}.x-find.x-justify-center{justify-content:center}.x-find.x-justify-end{justify-content:flex-end}.x-find.x-justify-space-between{justify-content:space-between}.x-find.x-justify-space-around{justify-content:space-around}.x-find.x-align-start{align-items:flex-start}.x-find.x-align-center{align-items:center}.x-find.x-align-end{align-items:flex-end}.x-find.x-direction-column{flex-direction:column}.x-find.x-direction-column-reverse{flex-direction:column-reverse}.x-find.x-direction-row{flex-direction:row}.x-find.x-direction-row-reverse{flex-direction:row-reverse}.x-find>label{display:inline-block;white-space:nowrap;position:relative;color:var(--x-text-300);font-weight:500}.x-find>label.x-text-align-start{text-align:start}.x-find>label.x-text-align-center{text-align:center}.x-find>label.x-text-align-end{text-align:end}.x-find-label-required:before{display:inline-block;margin-right:.25rem;color:var(--x-danger);line-height:1;font-size:var(--x-font-size-small);content:\"*\"}.x-find-row{flex:1;display:flex;align-items:flex-start;position:relative}.x-find-tags{margin:-.0625rem -.0625rem -.0625rem .4375rem}.x-find-tags>x-tag{margin:.0625rem}.x-find.x-required>label{color:var(--x-danger)}.x-find.x-direction-row>label{padding:0 .5rem 0 0}.x-find.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-find.x-direction-column,.x-find.x-direction-column-reverse{align-items:inherit}.x-find-big>label{height:var(--x-height-big);line-height:var(--x-height-big)}.x-find-large>label{height:var(--x-height-large);line-height:var(--x-height-large)}.x-find-medium>label{height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-find-small>label{height:var(--x-height-small);line-height:var(--x-height-small)}.x-find-small .x-find-tags{margin-top:-.1875rem}.x-find-small .x-find-tags>x-tag{margin-top:.125rem}.x-find-mini>label{height:var(--x-height-mini);line-height:var(--x-height-mini)}.x-find-mini .x-find-tags{margin-top:-.25rem}.x-find-mini .x-find-tags>x-tag{margin-top:.125rem}.x-find-dialog{flex:1;display:flex}.x-find-dialog-table{flex:1;min-height:18.75rem;height:fit-content}.x-find-dialog-tree{flex:1;min-height:18.75rem;max-height:25rem;overflow-y:auto}.x-find-dialog-tree .x-tree-node-content.x-activated{color:var(--x-primary)}.x-find-dialog-tree-node{flex:1;display:flex;align-items:center;justify-content:space-between}.x-find-dialog-tree-node>span{flex:1;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-user-select:none;user-select:none}.x-find-dialog-tree-table .x-find-dialog-tree{flex:initial;min-height:initial;max-height:initial;width:14rem;margin-right:1rem;padding-right:1rem;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-find-dialog-checked{margin-left:1rem;border-left:var(--x-border-width) var(--x-border-style) var(--x-border);padding-left:1rem;width:10rem;overflow-y:auto;height:100%}.x-find-dialog-checked x-tag{display:block}.x-find-dialog-checked x-tag:not(:first-child){margin-top:.5rem}.x-find-dialog-checked x-tag .x-tag{width:100%;display:flex;justify-content:space-between}.x-find-dialog-checked x-tag .x-tag>span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x-find-dialog-checked.x-find-empty{display:flex;align-items:center;justify-content:center}.x-find-dialog-container .x-dialog-content{overflow:initial}.x-find-search{display:flex;padding:.3rem}.x-find-search .x-input,.x-find-search x-input{width:15rem}.x-find-search .x-button{margin-left:.5rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { 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: XTagComponent, selector: "x-tag" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XDialogComponent, selector: "x-dialog" }, { kind: "component", type: XTableComponent, selector: "x-table" }, { kind: "component", type: XTreeComponent, selector: "x-tree" }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "component", type: XEmptyComponent, selector: "x-empty" }, { kind: "component", type: XInputComponent, selector: "x-input" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: XFindComponent, isStandalone: true, selector: "x-find", providers: [XValueAccessor(XFindComponent)], viewQueries: [{ propertyName: "find", first: true, predicate: ["find"], descendants: true, isSignal: true }, { propertyName: "dialogCom", first: true, predicate: ["dialogCom"], descendants: true, isSignal: true }, { propertyName: "tableCom", first: true, predicate: ["tableCom"], descendants: true, isSignal: true }, { propertyName: "treeCom", first: true, predicate: ["treeCom"], descendants: true, isSignal: true }, { propertyName: "buttonCom", first: true, predicate: ["buttonCom"], descendants: true, isSignal: true }, { propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }, { propertyName: "treeRef", first: true, predicate: ["treeRef"], descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n  #find\r\n  class=\"x-find\"\r\n  [class.x-flex]=\"justify() || align() || direction()\"\r\n  [class.x-checked]=\"value()\"\r\n  [class.x-disabled]=\"disabledComputed()\"\r\n  [class.x-required]=\"requiredIsEmpty()\"\r\n  [class.x-invalid]=\"invalid()\"\r\n  [ngClass]=\"classMap()\"\r\n>\r\n  @if (label()) {\r\n    <label\r\n      [class.x-find-label-required]=\"requiredComputed()\"\r\n      [style.width]=\"labelWidth()\"\r\n      [ngClass]=\"labelMapSignal()\"\r\n      *xOutlet=\"label()\"\r\n    >\r\n      {{ label() }}\r\n    </label>\r\n  }\r\n  <div class=\"x-find-row\">\r\n    <x-button\r\n      #buttonCom\r\n      icon=\"fto-search\"\r\n      [onlyIcon]=\"!bordered()\"\r\n      [size]=\"size()\"\r\n      [disabled]=\"disabledComputed()\"\r\n      attrType=\"button\"\r\n      (click)=\"showModal()\"\r\n      flat\r\n      plain\r\n    ></x-button>\r\n    <div class=\"x-find-tags\">\r\n      @if (multiple()) {\r\n        @for (item of value(); track item.id; let i = $index) {\r\n          <x-tag\r\n            closable\r\n            [size]=\"size()\"\r\n            [bordered]=\"bordered()\"\r\n            [disabled]=\"disabledComputed()\"\r\n            (close)=\"tagClose(i)\"\r\n            >{{ item[columnLabel()] }}</x-tag\r\n          >\r\n        }\r\n      } @else if (value()) {\r\n        <x-tag closable [disabled]=\"disabledComputed()\" [bordered]=\"bordered()\" [size]=\"size()\" (close)=\"tagClose()\">{{\r\n          value()[columnLabel()]\r\n        }}</x-tag>\r\n      }\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<x-dialog\r\n  #dialogCom\r\n  [title]=\"dialogTitle()\"\r\n  [width]=\"dialogWidthSignal()\"\r\n  [height]=\"dialogHeight()\"\r\n  [buttonsCenter]=\"dialogButtonsCenter()\"\r\n  [className]=\"'x-find-dialog-container'\"\r\n  [(visible)]=\"dialogVisible\"\r\n  (closeDone)=\"dialogCloseDone()\"\r\n  (confirm)=\"sure()\"\r\n>\r\n  <div class=\"x-find-dialog\" [class.x-find-dialog-tree-table]=\"hasTable() && hasTree()\">\r\n    @if (hasTree()) {\r\n      <div class=\"x-find-dialog-tree\" #treeRef [style.height.px]=\"hasTreeTable() && multiple() && height()\">\r\n        <x-tree\r\n          #treeCom\r\n          [data]=\"treeData()\"\r\n          [nodeHeight]=\"'1.8rem'\"\r\n          [(manual)]=\"dialogVisible\"\r\n          [activatedId]=\"treeActivatedId()\"\r\n          [expandedLevel]=\"treeExpandedLevel()\"\r\n          (activatedChange)=\"treeActivatedClick($event)\"\r\n          [checkbox]=\"hasTreeMultiple() || treeCheckbox()\"\r\n          [(checked)]=\"treeChecked\"\r\n          (checkboxChange)=\"treeCheckboxChange($event)\"\r\n          [levelCheck]=\"!hasTreeMultiple()\"\r\n        ></x-tree>\r\n      </div>\r\n    }\r\n    @if (hasTable()) {\r\n      <div class=\"x-find-dialog-table\" #tableRef>\r\n        @if (hasSearch()) {\r\n          <div class=\"x-find-search\">\r\n            <x-input\r\n              [label]=\"search()!.label!\"\r\n              direction=\"row\"\r\n              (xKeydown)=\"searchKeyDown($event)\"\r\n              [(ngModel)]=\"search()!.value\"\r\n            ></x-input>\r\n            <x-button plain text (click)=\"searchClick()\">{{ search()!.button || '\u67E5\u8BE2' }}</x-button>\r\n          </div>\r\n        }\r\n        <x-table\r\n          #tableCom\r\n          [data]=\"tableData()\"\r\n          [columns]=\"tableColumnsSignal()\"\r\n          [(manual)]=\"dialogVisible\"\r\n          [(index)]=\"tableIndex\"\r\n          [(size)]=\"tableSize\"\r\n          [(query)]=\"tableQuery\"\r\n          [(total)]=\"tableTotal\"\r\n          [allowSelectRow]=\"!multiple()\"\r\n          [allowCheckRow]=\"multiple()\"\r\n          [checkedRow]=\"tableCheckedRow()\"\r\n          [loading]=\"tableLoading()\"\r\n          (sortChange)=\"tableSortChange.emit($event)\"\r\n          [(activatedRow)]=\"tableActivatedRow\"\r\n          (activatedRowChange)=\"tableActivatedRowChange($event!)\"\r\n          [rowHeight]=\"tableRowHeight()\"\r\n          [bodyHeight]=\"tableBodyHeight()!\"\r\n          [virtualScroll]=\"tableVirtualScroll()\"\r\n          [scroll]=\"tableScroll()\"\r\n          [minBufferPx]=\"tableMinBufferPx()\"\r\n          [maxBufferPx]=\"tableMaxBufferPx()\"\r\n          [adaptionHeight]=\"tableAdaptionHeight()!\"\r\n          [docPercent]=\"tableDocPercent()\"\r\n          (rowClick)=\"tableRowEmit.emit($event)\"\r\n        ></x-table>\r\n      </div>\r\n    }\r\n    @if (multiple()) {\r\n      <div class=\"x-find-dialog-checked\" [class.x-find-empty]=\"getEmpty()\" [style.height.px]=\"height()\">\r\n        @if (getEmpty()) {\r\n          <x-empty [content]=\"dialogEmptyContent()\"></x-empty>\r\n        }\r\n        <div class=\"x-find-dialog-tags\">\r\n          @for (item of temp(); track item.id; let i = $index) {\r\n            <x-tag closable (close)=\"tempClose(i, item)\">\r\n              <span>{{ item[columnLabel()] }}</span>\r\n            </x-tag>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  </div>\r\n</x-dialog>\r\n\r\n<ng-template #treeLabelTpl let-node=\"$node\">\r\n  <div class=\"x-find-dialog-tree-node\">\r\n    <span>{{ node.label }} </span>\r\n    @if (node.$checked) {\r\n      <x-icon type=\"fto-check\"></x-icon>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.x-find{margin:0;padding:0}.x-find{width:100%}.x-find.x-flex{display:flex}.x-find.x-justify-start{justify-content:flex-start}.x-find.x-justify-center{justify-content:center}.x-find.x-justify-end{justify-content:flex-end}.x-find.x-justify-space-between{justify-content:space-between}.x-find.x-justify-space-around{justify-content:space-around}.x-find.x-align-start{align-items:flex-start}.x-find.x-align-center{align-items:center}.x-find.x-align-end{align-items:flex-end}.x-find.x-direction-column{flex-direction:column}.x-find.x-direction-column-reverse{flex-direction:column-reverse}.x-find.x-direction-row{flex-direction:row}.x-find.x-direction-row-reverse{flex-direction:row-reverse}.x-find>label{display:inline-block;white-space:nowrap;position:relative;color:var(--x-text-300);font-weight:500}.x-find>label.x-text-align-start{text-align:start}.x-find>label.x-text-align-center{text-align:center}.x-find>label.x-text-align-end{text-align:end}.x-find-label-required:before{display:inline-block;margin-right:.25rem;color:var(--x-danger);line-height:1;font-size:var(--x-font-size-small);content:\"*\"}.x-find-row{flex:1;display:flex;align-items:flex-start;position:relative}.x-find-tags{margin:-.0625rem -.0625rem -.0625rem .4375rem}.x-find-tags>x-tag{margin:.0625rem}.x-find.x-required>label{color:var(--x-danger)}.x-find.x-direction-row>label{padding:0 .5rem 0 0}.x-find.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-find.x-direction-column,.x-find.x-direction-column-reverse{align-items:inherit}.x-find-big>label{height:var(--x-height-big);line-height:var(--x-height-big)}.x-find-large>label{height:var(--x-height-large);line-height:var(--x-height-large)}.x-find-medium>label{height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-find-small>label{height:var(--x-height-small);line-height:var(--x-height-small)}.x-find-small .x-find-tags{margin-top:-.1875rem}.x-find-small .x-find-tags>x-tag{margin-top:.125rem}.x-find-mini>label{height:var(--x-height-mini);line-height:var(--x-height-mini)}.x-find-mini .x-find-tags{margin-top:-.25rem}.x-find-mini .x-find-tags>x-tag{margin-top:.125rem}.x-find-dialog{flex:1;display:flex}.x-find-dialog-table{flex:1;min-height:18.75rem;height:fit-content}.x-find-dialog-tree{flex:1;min-height:18.75rem;max-height:25rem;overflow-y:auto}.x-find-dialog-tree .x-tree-node-content.x-activated{color:var(--x-primary)}.x-find-dialog-tree-node{flex:1;display:flex;align-items:center;justify-content:space-between}.x-find-dialog-tree-node>span{flex:1;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-user-select:none;user-select:none}.x-find-dialog-tree-table .x-find-dialog-tree{flex:initial;min-height:initial;max-height:initial;width:14rem;margin-right:1rem;padding-right:1rem;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-find-dialog-checked{margin-left:1rem;border-left:var(--x-border-width) var(--x-border-style) var(--x-border);padding-left:1rem;width:10rem;overflow-y:auto;height:100%}.x-find-dialog-checked x-tag{display:block}.x-find-dialog-checked x-tag:not(:first-child){margin-top:.5rem}.x-find-dialog-checked x-tag .x-tag{width:100%;display:flex;justify-content:space-between}.x-find-dialog-checked x-tag .x-tag>span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x-find-dialog-checked.x-find-empty{display:flex;align-items:center;justify-content:center}.x-find-dialog-container .x-dialog-content{overflow:initial}.x-find-search{display:flex;padding:.3rem}.x-find-search .x-input,.x-find-search x-input{width:15rem}.x-find-search .x-button{margin-left:.5rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { 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: XTagComponent, selector: "x-tag" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XDialogComponent, selector: "x-dialog" }, { kind: "component", type: XTableComponent, selector: "x-table" }, { kind: "component", type: XTreeComponent, selector: "x-tree" }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "component", type: XEmptyComponent, selector: "x-empty" }, { kind: "component", type: XInputComponent, selector: "x-input" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XFindPrefix}`, imports: [
                         NgClass,
@@ -588,11 +588,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImpor
         }], propDecorators: { find: [{ type: i0.ViewChild, args: ['find', { isSignal: true }] }], dialogCom: [{ type: i0.ViewChild, args: ['dialogCom', { isSignal: true }] }], tableCom: [{ type: i0.ViewChild, args: ['tableCom', { isSignal: true }] }], treeCom: [{ type: i0.ViewChild, args: ['treeCom', { isSignal: true }] }], buttonCom: [{ type: i0.ViewChild, args: ['buttonCom', { isSignal: true }] }], tableRef: [{ type: i0.ViewChild, args: ['tableRef', { isSignal: true }] }], treeRef: [{ type: i0.ViewChild, args: ['treeRef', { isSignal: true }] }] } });
 
 class XFindModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XFindModule, imports: [XFindComponent], exports: [XFindComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindModule, imports: [XFindComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XFindModule, imports: [XFindComponent], exports: [XFindComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindModule, imports: [XFindComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XFindModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XFindModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XFindComponent],