@ng-nest/ui 12.0.6 → 12.0.11

package/fesm2015/ng-nest-ui-transfer.js

@@ -40,8 +40,8 @@ class XTransferProperty extends XControlValueAccessor {
         this.data = [];
     }
 }
-/** @nocollapse */ XTransferProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTransferProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTransferProperty, selector: "ng-component", inputs: { data: "data", titles: "titles", drag: "drag", search: "search", nodeTpl: "nodeTpl", titleTpl: "titleTpl" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XTransferProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTransferProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTransferProperty, selector: "ng-component", inputs: { data: "data", titles: "titles", drag: "drag", search: "search", nodeTpl: "nodeTpl", titleTpl: "titleTpl" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XDataConvert()
 ], XTransferProperty.prototype, "data", void 0);
@@ -55,7 +55,7 @@ __decorate([
 __decorate([
     XInputBoolean()
 ], XTransferProperty.prototype, "search", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { data: [{
@@ -104,7 +104,8 @@ class XTransferComponent extends XTransferProperty {
         this.setTitles();
     }
     ngOnChanges(changes) {
-        XIsChange(changes.data) && this.setData();
+        const { data } = changes;
+        XIsChange(data) && this.setData();
     }
     ngOnDestroy() {
         this._unSubject.next();
@@ -174,7 +175,7 @@ class XTransferComponent extends XTransferProperty {
     predicate(item) {
         return !item.data.disabled;
     }
-    trackByNode(index, item) {
+    trackByNode(_index, item) {
         return item.id;
     }
     setCheckedAll(...sources) {
@@ -246,9 +247,9 @@ class XTransferComponent extends XTransferProperty {
         this.cdr.detectChanges();
     }
 }
-/** @nocollapse */ XTransferComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTransferComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTransferComponent, selector: "x-transfer", providers: [XValueAccessor(XTransferComponent)], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #transfer class=\"x-transfer\" cdkDropListGroup [ngClass]=\"classMap\">\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: left }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"left.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of left.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: left }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n  <div class=\"x-transfer-buttons\">\r\n    <x-button type=\"primary\" icon=\"fto-chevron-right\" [disabled]=\"left.disabledButton\" (click)=\"move(left, right)\"></x-button>\r\n    <x-button type=\"primary\" icon=\"fto-chevron-left\" [disabled]=\"right.disabledButton\" (click)=\"move(right, left)\"></x-button>\r\n  </div>\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: right }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"right.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of right.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: right }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #sourceTitleTpl let-source=\"source\">\r\n  <div class=\"x-transfer-title\">\r\n    <x-checkbox\r\n      [data]=\"[titleTpl ? '' : source.title]\"\r\n      [(ngModel)]=\"source.checkedAll\"\r\n      (ngModelChange)=\"checkedAllChange($event, source)\"\r\n      [indeterminate]=\"source.indeterminate\"\r\n    ></x-checkbox>\r\n    <ng-container *xOutlet=\"titleTpl; context: { $title: source.title, $checkedCount: source.checkedCount, $count: source.list.length }\"\r\n      ><span>{{ source.checkedCount }} / {{ source.list.length }}</span></ng-container\r\n    >\r\n  </div>\r\n  <!-- <div class=\"x-transfer-search\" *ngIf=\"search\">\r\n    <x-input\r\n      icon=\"fto-search\"\r\n      [(ngModel)]=\"source.searchInput\"\r\n      (ngModelChange)=\"searchInputChange(source)\"\r\n      clearable\r\n    ></x-input>\r\n  </div> -->\r\n</ng-template>\r\n\r\n<ng-template #sourceNodeTpl let-node=\"node\" let-source=\"source\">\r\n  <x-checkbox\r\n    [data]=\"[{ id: node.id, label: nodeTpl ? nodeTpl : node.label, node: node }]\"\r\n    [disabled]=\"node.disabled\"\r\n    [(ngModel)]=\"node.checked\"\r\n    (ngModelChange)=\"checkedChange($event, source)\"\r\n  ></x-checkbox>\r\n</ng-template>\r\n", styles: [".x-transfer{margin:0;padding:0;display:inline-flex;align-items:center}.x-transfer-box{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);width:12rem}.x-transfer-title{padding:.25rem .5625rem;display:flex;align-items:center;justify-content:space-between;border-bottom:.0625rem solid var(--x-border);background-color:var(--x-background);color:var(--x-text-300)}.x-transfer-title>span{margin-left:.325rem}.x-transfer-list{display:flex;flex-direction:column;padding:.25rem;height:18rem;overflow-y:auto}.x-transfer-list>li{padding:.125rem .25rem;border-radius:var(--x-border-radius);display:flex;align-items:center;border:.0625rem dashed #0000;transition:border-color var(--x-animation-duration-base),background-color var(--x-animation-duration-base),color var(--x-animation-duration-base)}.x-transfer-list.cdk-drop-list-dragging>li:hover{background-color:initial}.x-transfer-list.cdk-drop-list-dragging>li.cdk-drag-placeholder{border-color:var(--x-border);color:var(--x-text-400);background-color:var(--x-background-a100);opacity:.9}.x-transfer-list.cdk-drop-list-dragging>li:not(.cdk-drag-placeholder){transition:transform var(--x-animation-duration-base) cubic-bezier(0,0,.2,1)}.x-transfer-buttons{margin:0 1rem;display:flex;flex-direction:column}.x-transfer-buttons>x-button:not(:first-child){margin-top:.5rem}.x-transfer-search{padding:.5rem;border-bottom:.0625rem solid var(--x-border)}body>li.x-transfer-item.cdk-drag-preview{padding:.125rem .25rem;border-radius:var(--x-border-radius);display:flex;align-items:center;border:.0625rem dashed #0000;border-color:var(--x-primary);color:var(--x-primary);background-color:var(--x-background);opacity:.8}body>li.x-transfer-item.cdk-drag-animating{transition:transform var(--x-animation-duration-base) cubic-bezier(0,0,.2,1)}"], components: [{ type: i2.XButtonComponent, selector: "x-button" }, { type: i3.XCheckboxComponent, selector: "x-checkbox" }], directives: [{ type: i4.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferComponent, decorators: [{
+/** @nocollapse */ XTransferComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTransferComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTransferComponent, selector: "x-transfer", providers: [XValueAccessor(XTransferComponent)], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #transfer class=\"x-transfer\" cdkDropListGroup [ngClass]=\"classMap\">\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: left }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"left.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of left.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: left }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n  <div class=\"x-transfer-buttons\">\r\n    <x-button type=\"primary\" icon=\"fto-chevron-right\" [disabled]=\"left.disabledButton\" (click)=\"move(left, right)\"></x-button>\r\n    <x-button type=\"primary\" icon=\"fto-chevron-left\" [disabled]=\"right.disabledButton\" (click)=\"move(right, left)\"></x-button>\r\n  </div>\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: right }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"right.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of right.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: right }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #sourceTitleTpl let-source=\"source\">\r\n  <div class=\"x-transfer-title\">\r\n    <x-checkbox\r\n      [data]=\"[titleTpl ? '' : source.title]\"\r\n      [(ngModel)]=\"source.checkedAll\"\r\n      (ngModelChange)=\"checkedAllChange($event, source)\"\r\n      [indeterminate]=\"source.indeterminate\"\r\n    ></x-checkbox>\r\n    <ng-container *xOutlet=\"titleTpl; context: { $title: source.title, $checkedCount: source.checkedCount, $count: source.list.length }\"\r\n      ><span>{{ source.checkedCount }} / {{ source.list.length }}</span></ng-container\r\n    >\r\n  </div>\r\n  <!-- <div class=\"x-transfer-search\" *ngIf=\"search\">\r\n    <x-input\r\n      icon=\"fto-search\"\r\n      [(ngModel)]=\"source.searchInput\"\r\n      (ngModelChange)=\"searchInputChange(source)\"\r\n      clearable\r\n    ></x-input>\r\n  </div> -->\r\n</ng-template>\r\n\r\n<ng-template #sourceNodeTpl let-node=\"node\" let-source=\"source\">\r\n  <x-checkbox\r\n    [data]=\"[{ id: node.id, label: nodeTpl ? nodeTpl : node.label, node: node }]\"\r\n    [disabled]=\"node.disabled\"\r\n    [(ngModel)]=\"node.checked\"\r\n    (ngModelChange)=\"checkedChange($event, source)\"\r\n  ></x-checkbox>\r\n</ng-template>\r\n", styles: [".x-transfer{margin:0;padding:0;display:inline-flex;align-items:center}.x-transfer-box{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);width:12rem}.x-transfer-title{padding:.25rem .5625rem;display:flex;align-items:center;justify-content:space-between;border-bottom:.0625rem solid var(--x-border);background-color:var(--x-background);color:var(--x-text-300)}.x-transfer-title>span{margin-left:.325rem}.x-transfer-list{display:flex;flex-direction:column;padding:.25rem;height:18rem;overflow-y:auto}.x-transfer-list>li{padding:.125rem .25rem;border-radius:var(--x-border-radius);display:flex;align-items:center;border:.0625rem dashed transparent;transition:border-color var(--x-animation-duration-base),background-color var(--x-animation-duration-base),color var(--x-animation-duration-base)}.x-transfer-list.cdk-drop-list-dragging>li:hover{background-color:transparent}.x-transfer-list.cdk-drop-list-dragging>li.cdk-drag-placeholder{border-color:var(--x-border);color:var(--x-text-400);background-color:var(--x-background-a100);opacity:.9}.x-transfer-list.cdk-drop-list-dragging>li:not(.cdk-drag-placeholder){transition:transform var(--x-animation-duration-base) cubic-bezier(0,0,.2,1)}.x-transfer-buttons{margin:0 1rem;display:flex;flex-direction:column}.x-transfer-buttons>x-button:not(:first-child){margin-top:.5rem}.x-transfer-search{padding:.5rem;border-bottom:.0625rem solid var(--x-border)}body>li.x-transfer-item.cdk-drag-preview{padding:.125rem .25rem;border-radius:var(--x-border-radius);display:flex;align-items:center;border:.0625rem dashed transparent;border-color:var(--x-primary);color:var(--x-primary);background-color:var(--x-background);opacity:.8}body>li.x-transfer-item.cdk-drag-animating{transition:transform var(--x-animation-duration-base) cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i2.XButtonComponent, selector: "x-button" }, { type: i3.XCheckboxComponent, selector: "x-checkbox" }], directives: [{ type: i4.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferComponent, decorators: [{
             type: Component,
             args: [{
                     selector: `${XTransferPrefix}`,
@@ -262,10 +263,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImpor
 
 class XTransferModule {
 }
-/** @nocollapse */ XTransferModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XTransferModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferModule, declarations: [XTransferComponent, XTransferProperty], imports: [CommonModule, FormsModule, DragDropModule, XOutletModule, XCheckboxModule, XButtonModule, XInputModule, XBaseFormModule], exports: [XTransferComponent] });
-/** @nocollapse */ XTransferModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferModule, imports: [[CommonModule, FormsModule, DragDropModule, XOutletModule, XCheckboxModule, XButtonModule, XInputModule, XBaseFormModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTransferModule, decorators: [{
+/** @nocollapse */ XTransferModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XTransferModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferModule, declarations: [XTransferComponent, XTransferProperty], imports: [CommonModule, FormsModule, DragDropModule, XOutletModule, XCheckboxModule, XButtonModule, XInputModule, XBaseFormModule], exports: [XTransferComponent] });
+/** @nocollapse */ XTransferModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferModule, imports: [[CommonModule, FormsModule, DragDropModule, XOutletModule, XCheckboxModule, XButtonModule, XInputModule, XBaseFormModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTransferModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [XTransferComponent, XTransferProperty],

package/fesm2015/ng-nest-ui-transfer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ng-nest-ui-transfer.js","sources":["../../../../lib/ng-nest/ui/transfer/transfer.property.ts","../../../../lib/ng-nest/ui/transfer/transfer.component.ts","../../../../lib/ng-nest/ui/transfer/transfer.component.html","../../../../lib/ng-nest/ui/transfer/transfer.module.ts","../../../../lib/ng-nest/ui/transfer/ng-nest-ui-transfer.ts"],"sourcesContent":["import {\r\n  XData,\r\n  XDataConvert,\r\n  XInputBoolean,\r\n  XParentIdentityProperty,\r\n  XBoolean,\r\n  XWithConfig\r\n} from '@ng-nest/ui/core';\r\nimport { TemplateRef, Input, Component } from '@angular/core';\r\nimport { XControlValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n/**\r\n * Transfer\r\n * @selector x-transfer\r\n * @decorator component\r\n */\r\nexport const XTransferPrefix = 'x-transfer';\r\n\r\nconst X_CONFIG_NAME = 'transfer';\r\n\r\n/**\r\n * Transfer Property\r\n */\r\n@Component({ template: '' })\r\nexport class XTransferProperty extends XControlValueAccessor<any[]> {\r\n  /**\r\n   * @zh_CN 数据对象\r\n   * @en_US Data object\r\n   */\r\n  @Input() @XDataConvert() data: XData<XTransferNode> = [];\r\n  /**\r\n   * @zh_CN 标题\r\n   * @en_US Title\r\n   */\r\n  @Input() @XWithConfig<string[]>(X_CONFIG_NAME) titles!: string[];\r\n  /**\r\n   * @zh_CN 是否能拖动\r\n   * @en_US Can drag\r\n   */\r\n  @Input() @XWithConfig<XBoolean>(X_CONFIG_NAME) @XInputBoolean() drag?: XBoolean;\r\n  /**\r\n   * @zh_CN 是否显示搜索（暂未实现）\r\n   * @en_US Whether to display search (not implemented yet)\r\n   */\r\n  @Input() @XInputBoolean() search?: XBoolean;\r\n  /**\r\n   * @zh_CN 数据自定义模板\r\n   * @en_US Data customization template\r\n   */\r\n  @Input() nodeTpl?: TemplateRef<any>;\r\n  /**\r\n   * @zh_CN 标题自定义模板\r\n   * @en_US Title custom template\r\n   */\r\n  @Input() titleTpl?: TemplateRef<any>;\r\n}\r\n\r\n/**\r\n * Transfer Node\r\n */\r\nexport interface XTransferNode extends XParentIdentityProperty<XTransferNode> {\r\n  /**\r\n   * @zh_CN checkbox 是否选中\r\n   * @en_US whether checkbox is selected\r\n   */\r\n  checked?: boolean;\r\n  /**\r\n   * @zh_CN 序号\r\n   * @en_US Serial number\r\n   */\r\n  index?: number;\r\n}\r\n\r\n/**\r\n * Transfer Source\r\n */\r\nexport interface XTransferSource {\r\n  /**\r\n   * @zh_CN 标题\r\n   * @en_US Title\r\n   */\r\n  title?: string;\r\n  /**\r\n   * @zh_CN 搜索的数据\r\n   * @en_US Searched data\r\n   */\r\n  searchInput?: string;\r\n  /**\r\n   * @zh_CN 全选\r\n   * @en_US Select all\r\n   */\r\n  checkedAll?: boolean;\r\n  /**\r\n   * @zh_CN 选中的数量\r\n   * @en_US Selected quantity\r\n   */\r\n  checkedCount?: number;\r\n  /**\r\n   * @zh_CN 不确定状态的样式\r\n   * @en_US Uncertain state style\r\n   */\r\n  indeterminate?: boolean;\r\n  /**\r\n   * @zh_CN 列表数据\r\n   * @en_US List data\r\n   */\r\n  list?: XTransferNode[];\r\n  /**\r\n   * @zh_CN 搜索数据，用来还原\r\n   * @en_US Search data to restore\r\n   */\r\n  searchList?: XTransferNode[];\r\n  /**\r\n   * @zh_CN 按钮禁用\r\n   * @en_US Button disabled\r\n   */\r\n  disabledButton?: boolean;\r\n}\r\n","import {\r\n  Component,\r\n  OnInit,\r\n  ViewEncapsulation,\r\n  Renderer2,\r\n  ElementRef,\r\n  ChangeDetectorRef,\r\n  ChangeDetectionStrategy,\r\n  SimpleChanges,\r\n  OnChanges,\r\n  OnDestroy\r\n} from '@angular/core';\r\nimport { XTransferPrefix, XTransferNode, XTransferSource, XTransferProperty } from './transfer.property';\r\nimport { XIsChange, XIsEmpty, XSetData, XConfigService } from '@ng-nest/ui/core';\r\nimport { of, Subject } from 'rxjs';\r\nimport { delay, takeUntil } from 'rxjs/operators';\r\nimport { transferArrayItem, moveItemInArray, CdkDragDrop, CdkDrag } from '@angular/cdk/drag-drop';\r\nimport { XValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n@Component({\r\n  selector: `${XTransferPrefix}`,\r\n  templateUrl: './transfer.component.html',\r\n  styleUrls: ['./transfer.component.scss'],\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [XValueAccessor(XTransferComponent)]\r\n})\r\nexport class XTransferComponent extends XTransferProperty implements OnInit, OnChanges, OnDestroy {\r\n  nodes: XTransferNode[] = [];\r\n  left: XTransferSource = {\r\n    list: [],\r\n    searchList: [],\r\n    checkedCount: 0,\r\n    disabledButton: true\r\n  };\r\n  right: XTransferSource = {\r\n    list: [],\r\n    searchList: [],\r\n    checkedCount: 0,\r\n    disabledButton: true\r\n  };\r\n  searchInput: string = '';\r\n  private _titles = ['List', 'Selected'];\r\n  private _unSubject = new Subject<void>();\r\n\r\n  writeValue(value: any): void {\r\n    this.value = value;\r\n    this.setList();\r\n  }\r\n\r\n  constructor(\r\n    public renderer: Renderer2,\r\n    public elementRef: ElementRef,\r\n    public cdr: ChangeDetectorRef,\r\n    public configService: XConfigService\r\n  ) {\r\n    super();\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.setTitles();\r\n  }\r\n\r\n  ngOnChanges(changes: SimpleChanges) {\r\n    XIsChange(changes.data) && this.setData();\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this._unSubject.next();\r\n    this._unSubject.unsubscribe();\r\n  }\r\n\r\n  searchInputChange(source: XTransferSource) {\r\n    source.list = source.searchList?.filter((x) => x.label.indexOf(source.searchInput) >= 0);\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  checkedAllChange($event: boolean, source: XTransferSource) {\r\n    let list = (source.list?.filter((x) => !x.disabled) as XTransferNode[]).map((x) => {\r\n      x.checked = $event;\r\n      return x;\r\n    });\r\n    source.checkedCount = $event ? list.length : 0;\r\n    source.indeterminate = $event;\r\n    this.setButtonDisabled(source);\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  checkedChange($event: boolean, source: XTransferSource) {\r\n    if (!$event) (source.checkedCount as number)--;\r\n    else (source.checkedCount as number)++;\r\n    this.setCheckedAll(source);\r\n    this.setButtonDisabled(source);\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  move(from: XTransferSource, to: XTransferSource) {\r\n    if (from.disabledButton) return;\r\n    let checkedItems = from.list?.filter((x) => !XIsEmpty(x.checked)) as XTransferNode[];\r\n    let j = 0;\r\n    checkedItems.forEach((x) => {\r\n      const index = from.list?.indexOf(x) as number;\r\n      x.checked = false;\r\n      transferArrayItem(from.list as XTransferNode[], to.list as XTransferNode[], index, j);\r\n      j++;\r\n    });\r\n    from.checkedAll = false;\r\n    from.checkedCount = 0;\r\n    from.indeterminate = false;\r\n    from.disabledButton = true;\r\n    this.setSearchList(from, to);\r\n    this.setValue();\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  dropCdk(event: CdkDragDrop<XTransferNode[] | undefined, any>) {\r\n    const ev = event as CdkDragDrop<XTransferNode[]>;\r\n    if (ev.previousContainer === ev.container) {\r\n      moveItemInArray(ev.container.data, ev.previousIndex, ev.currentIndex);\r\n    } else {\r\n      transferArrayItem(ev.previousContainer.data, ev.container.data, ev.previousIndex, ev.currentIndex);\r\n      this.setCheckedCount(this.left, this.right);\r\n      this.setCheckedAll(this.left, this.right);\r\n      this.setButtonDisabled(this.left, this.right);\r\n    }\r\n    this.setSearchList(this.left, this.right);\r\n    this.setValue();\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  predicate(item: CdkDrag<XTransferNode>) {\r\n    return !item.data.disabled;\r\n  }\r\n\r\n  trackByNode(index: number, item: XTransferNode) {\r\n    return item.id;\r\n  }\r\n\r\n  private setCheckedAll(...sources: XTransferSource[]) {\r\n    for (let source of sources) {\r\n      if ((source.checkedCount as number) > 0) {\r\n        if (source.checkedCount === source.list?.filter((x) => !x.disabled).length) {\r\n          source.checkedAll = true;\r\n        } else {\r\n          source.checkedAll = false;\r\n          source.indeterminate = true;\r\n        }\r\n      } else {\r\n        source.indeterminate = false;\r\n      }\r\n    }\r\n  }\r\n\r\n  private setCheckedCount(...sources: XTransferSource[]) {\r\n    for (let source of sources) source.checkedCount = source.list?.filter((x) => !XIsEmpty(x.checked)).length;\r\n  }\r\n\r\n  private setButtonDisabled(...sources: XTransferSource[]) {\r\n    for (let source of sources) source.disabledButton = source.checkedCount === 0;\r\n  }\r\n\r\n  private setValue() {\r\n    this.value = this.right.list?.map((x) => x.id) as any[];\r\n    this.onChange(this.value);\r\n  }\r\n\r\n  private setSearchList(...sources: XTransferSource[]) {\r\n    if (this.search) {\r\n      for (let source of sources) {\r\n        if (XIsEmpty(source.searchInput)) {\r\n          source.searchList = [...(source.list as XTransferNode[])];\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  private setData() {\r\n    XSetData<XTransferNode>(this.data, this._unSubject).subscribe((x) => {\r\n      this.nodes = x;\r\n    });\r\n  }\r\n\r\n  private setList() {\r\n    if (!XIsEmpty(this.value)) {\r\n      this.left.list = this.nodes.filter((x) => this.value.indexOf(x.id) < 0);\r\n      this.right.list = this.nodes.filter((x) => this.value.indexOf(x.id) >= 0);\r\n    } else {\r\n      this.left.list = this.nodes;\r\n    }\r\n    this.setSearchList(this.left, this.right);\r\n    // ToDo: x-checkbox error. Attempt to use a destroyed view: detectChanges\r\n    of(true)\r\n      .pipe(delay(0), takeUntil(this._unSubject))\r\n      .subscribe(() => this.cdr.detectChanges());\r\n  }\r\n\r\n  private setTitles() {\r\n    if (XIsEmpty(this.titles)) {\r\n      this.titles = this._titles;\r\n    }\r\n    this.left.title = this.titles[0];\r\n    if (this.titles.length > 1) this.right.title = this.titles[1];\r\n    this.cdr.detectChanges();\r\n  }\r\n}\r\n","<div #transfer class=\"x-transfer\" cdkDropListGroup [ngClass]=\"classMap\">\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: left }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"left.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of left.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: left }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n  <div class=\"x-transfer-buttons\">\r\n    <x-button type=\"primary\" icon=\"fto-chevron-right\" [disabled]=\"left.disabledButton\" (click)=\"move(left, right)\"></x-button>\r\n    <x-button type=\"primary\" icon=\"fto-chevron-left\" [disabled]=\"right.disabledButton\" (click)=\"move(right, left)\"></x-button>\r\n  </div>\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: right }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"right.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of right.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: right }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #sourceTitleTpl let-source=\"source\">\r\n  <div class=\"x-transfer-title\">\r\n    <x-checkbox\r\n      [data]=\"[titleTpl ? '' : source.title]\"\r\n      [(ngModel)]=\"source.checkedAll\"\r\n      (ngModelChange)=\"checkedAllChange($event, source)\"\r\n      [indeterminate]=\"source.indeterminate\"\r\n    ></x-checkbox>\r\n    <ng-container *xOutlet=\"titleTpl; context: { $title: source.title, $checkedCount: source.checkedCount, $count: source.list.length }\"\r\n      ><span>{{ source.checkedCount }} / {{ source.list.length }}</span></ng-container\r\n    >\r\n  </div>\r\n  <!-- <div class=\"x-transfer-search\" *ngIf=\"search\">\r\n    <x-input\r\n      icon=\"fto-search\"\r\n      [(ngModel)]=\"source.searchInput\"\r\n      (ngModelChange)=\"searchInputChange(source)\"\r\n      clearable\r\n    ></x-input>\r\n  </div> -->\r\n</ng-template>\r\n\r\n<ng-template #sourceNodeTpl let-node=\"node\" let-source=\"source\">\r\n  <x-checkbox\r\n    [data]=\"[{ id: node.id, label: nodeTpl ? nodeTpl : node.label, node: node }]\"\r\n    [disabled]=\"node.disabled\"\r\n    [(ngModel)]=\"node.checked\"\r\n    (ngModelChange)=\"checkedChange($event, source)\"\r\n  ></x-checkbox>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XTransferComponent } from './transfer.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XCheckboxModule } from '@ng-nest/ui/checkbox';\r\nimport { XButtonModule } from '@ng-nest/ui/button';\r\nimport { DragDropModule } from '@angular/cdk/drag-drop';\r\nimport { XInputModule } from '@ng-nest/ui/input';\r\nimport { XOutletModule } from '@ng-nest/ui/outlet';\r\nimport { XTransferProperty } from './transfer.property';\r\nimport { XBaseFormModule } from '@ng-nest/ui/base-form';\r\n\r\n@NgModule({\r\n  declarations: [XTransferComponent, XTransferProperty],\r\n  exports: [XTransferComponent],\r\n  imports: [CommonModule, FormsModule, DragDropModule, XOutletModule, XCheckboxModule, XButtonModule, XInputModule, XBaseFormModule]\r\n})\r\nexport class XTransferModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ng-nest-ui-transfer.js","sources":["../../../../lib/ng-nest/ui/transfer/transfer.property.ts","../../../../lib/ng-nest/ui/transfer/transfer.component.ts","../../../../lib/ng-nest/ui/transfer/transfer.component.html","../../../../lib/ng-nest/ui/transfer/transfer.module.ts","../../../../lib/ng-nest/ui/transfer/ng-nest-ui-transfer.ts"],"sourcesContent":["import {\r\n  XData,\r\n  XDataConvert,\r\n  XInputBoolean,\r\n  XParentIdentityProperty,\r\n  XBoolean,\r\n  XWithConfig\r\n} from '@ng-nest/ui/core';\r\nimport { TemplateRef, Input, Component } from '@angular/core';\r\nimport { XControlValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n/**\r\n * Transfer\r\n * @selector x-transfer\r\n * @decorator component\r\n */\r\nexport const XTransferPrefix = 'x-transfer';\r\n\r\nconst X_CONFIG_NAME = 'transfer';\r\n\r\n/**\r\n * Transfer Property\r\n */\r\n@Component({ template: '' })\r\nexport class XTransferProperty extends XControlValueAccessor<any[]> {\r\n  /**\r\n   * @zh_CN 数据对象\r\n   * @en_US Data object\r\n   */\r\n  @Input() @XDataConvert() data: XData<XTransferNode> = [];\r\n  /**\r\n   * @zh_CN 标题\r\n   * @en_US Title\r\n   */\r\n  @Input() @XWithConfig<string[]>(X_CONFIG_NAME) titles!: string[];\r\n  /**\r\n   * @zh_CN 是否能拖动\r\n   * @en_US Can drag\r\n   */\r\n  @Input() @XWithConfig<XBoolean>(X_CONFIG_NAME) @XInputBoolean() drag?: XBoolean;\r\n  /**\r\n   * @zh_CN 是否显示搜索（暂未实现）\r\n   * @en_US Whether to display search (not implemented yet)\r\n   */\r\n  @Input() @XInputBoolean() search?: XBoolean;\r\n  /**\r\n   * @zh_CN 数据自定义模板\r\n   * @en_US Data customization template\r\n   */\r\n  @Input() nodeTpl?: TemplateRef<any>;\r\n  /**\r\n   * @zh_CN 标题自定义模板\r\n   * @en_US Title custom template\r\n   */\r\n  @Input() titleTpl?: TemplateRef<any>;\r\n}\r\n\r\n/**\r\n * Transfer Node\r\n */\r\nexport interface XTransferNode extends XParentIdentityProperty<XTransferNode> {\r\n  /**\r\n   * @zh_CN checkbox 是否选中\r\n   * @en_US whether checkbox is selected\r\n   */\r\n  checked?: boolean;\r\n  /**\r\n   * @zh_CN 序号\r\n   * @en_US Serial number\r\n   */\r\n  index?: number;\r\n}\r\n\r\n/**\r\n * Transfer Source\r\n */\r\nexport interface XTransferSource {\r\n  /**\r\n   * @zh_CN 标题\r\n   * @en_US Title\r\n   */\r\n  title?: string;\r\n  /**\r\n   * @zh_CN 搜索的数据\r\n   * @en_US Searched data\r\n   */\r\n  searchInput?: string;\r\n  /**\r\n   * @zh_CN 全选\r\n   * @en_US Select all\r\n   */\r\n  checkedAll?: boolean;\r\n  /**\r\n   * @zh_CN 选中的数量\r\n   * @en_US Selected quantity\r\n   */\r\n  checkedCount?: number;\r\n  /**\r\n   * @zh_CN 不确定状态的样式\r\n   * @en_US Uncertain state style\r\n   */\r\n  indeterminate?: boolean;\r\n  /**\r\n   * @zh_CN 列表数据\r\n   * @en_US List data\r\n   */\r\n  list?: XTransferNode[];\r\n  /**\r\n   * @zh_CN 搜索数据，用来还原\r\n   * @en_US Search data to restore\r\n   */\r\n  searchList?: XTransferNode[];\r\n  /**\r\n   * @zh_CN 按钮禁用\r\n   * @en_US Button disabled\r\n   */\r\n  disabledButton?: boolean;\r\n}\r\n","import {\r\n  Component,\r\n  OnInit,\r\n  ViewEncapsulation,\r\n  Renderer2,\r\n  ElementRef,\r\n  ChangeDetectorRef,\r\n  ChangeDetectionStrategy,\r\n  SimpleChanges,\r\n  OnChanges,\r\n  OnDestroy\r\n} from '@angular/core';\r\nimport { XTransferPrefix, XTransferNode, XTransferSource, XTransferProperty } from './transfer.property';\r\nimport { XIsChange, XIsEmpty, XSetData, XConfigService } from '@ng-nest/ui/core';\r\nimport { of, Subject } from 'rxjs';\r\nimport { delay, takeUntil } from 'rxjs/operators';\r\nimport { transferArrayItem, moveItemInArray, CdkDragDrop, CdkDrag } from '@angular/cdk/drag-drop';\r\nimport { XValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n@Component({\r\n  selector: `${XTransferPrefix}`,\r\n  templateUrl: './transfer.component.html',\r\n  styleUrls: ['./transfer.component.scss'],\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [XValueAccessor(XTransferComponent)]\r\n})\r\nexport class XTransferComponent extends XTransferProperty implements OnInit, OnChanges, OnDestroy {\r\n  nodes: XTransferNode[] = [];\r\n  left: XTransferSource = {\r\n    list: [],\r\n    searchList: [],\r\n    checkedCount: 0,\r\n    disabledButton: true\r\n  };\r\n  right: XTransferSource = {\r\n    list: [],\r\n    searchList: [],\r\n    checkedCount: 0,\r\n    disabledButton: true\r\n  };\r\n  searchInput: string = '';\r\n  private _titles = ['List', 'Selected'];\r\n  private _unSubject = new Subject<void>();\r\n\r\n  writeValue(value: any): void {\r\n    this.value = value;\r\n    this.setList();\r\n  }\r\n\r\n  constructor(\r\n    public renderer: Renderer2,\r\n    public elementRef: ElementRef,\r\n    public cdr: ChangeDetectorRef,\r\n    public configService: XConfigService\r\n  ) {\r\n    super();\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.setTitles();\r\n  }\r\n\r\n  ngOnChanges(changes: SimpleChanges) {\r\n    const { data } = changes;\r\n    XIsChange(data) && this.setData();\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this._unSubject.next();\r\n    this._unSubject.unsubscribe();\r\n  }\r\n\r\n  searchInputChange(source: XTransferSource) {\r\n    source.list = source.searchList?.filter((x) => x.label.indexOf(source.searchInput) >= 0);\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  checkedAllChange($event: boolean, source: XTransferSource) {\r\n    let list = (source.list?.filter((x) => !x.disabled) as XTransferNode[]).map((x) => {\r\n      x.checked = $event;\r\n      return x;\r\n    });\r\n    source.checkedCount = $event ? list.length : 0;\r\n    source.indeterminate = $event;\r\n    this.setButtonDisabled(source);\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  checkedChange($event: boolean, source: XTransferSource) {\r\n    if (!$event) (source.checkedCount as number)--;\r\n    else (source.checkedCount as number)++;\r\n    this.setCheckedAll(source);\r\n    this.setButtonDisabled(source);\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  move(from: XTransferSource, to: XTransferSource) {\r\n    if (from.disabledButton) return;\r\n    let checkedItems = from.list?.filter((x) => !XIsEmpty(x.checked)) as XTransferNode[];\r\n    let j = 0;\r\n    checkedItems.forEach((x) => {\r\n      const index = from.list?.indexOf(x) as number;\r\n      x.checked = false;\r\n      transferArrayItem(from.list as XTransferNode[], to.list as XTransferNode[], index, j);\r\n      j++;\r\n    });\r\n    from.checkedAll = false;\r\n    from.checkedCount = 0;\r\n    from.indeterminate = false;\r\n    from.disabledButton = true;\r\n    this.setSearchList(from, to);\r\n    this.setValue();\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  dropCdk(event: CdkDragDrop<XTransferNode[] | undefined, any>) {\r\n    const ev = event as CdkDragDrop<XTransferNode[]>;\r\n    if (ev.previousContainer === ev.container) {\r\n      moveItemInArray(ev.container.data, ev.previousIndex, ev.currentIndex);\r\n    } else {\r\n      transferArrayItem(ev.previousContainer.data, ev.container.data, ev.previousIndex, ev.currentIndex);\r\n      this.setCheckedCount(this.left, this.right);\r\n      this.setCheckedAll(this.left, this.right);\r\n      this.setButtonDisabled(this.left, this.right);\r\n    }\r\n    this.setSearchList(this.left, this.right);\r\n    this.setValue();\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  predicate(item: CdkDrag<XTransferNode>) {\r\n    return !item.data.disabled;\r\n  }\r\n\r\n  trackByNode(_index: number, item: XTransferNode) {\r\n    return item.id;\r\n  }\r\n\r\n  private setCheckedAll(...sources: XTransferSource[]) {\r\n    for (let source of sources) {\r\n      if ((source.checkedCount as number) > 0) {\r\n        if (source.checkedCount === source.list?.filter((x) => !x.disabled).length) {\r\n          source.checkedAll = true;\r\n        } else {\r\n          source.checkedAll = false;\r\n          source.indeterminate = true;\r\n        }\r\n      } else {\r\n        source.indeterminate = false;\r\n      }\r\n    }\r\n  }\r\n\r\n  private setCheckedCount(...sources: XTransferSource[]) {\r\n    for (let source of sources) source.checkedCount = source.list?.filter((x) => !XIsEmpty(x.checked)).length;\r\n  }\r\n\r\n  private setButtonDisabled(...sources: XTransferSource[]) {\r\n    for (let source of sources) source.disabledButton = source.checkedCount === 0;\r\n  }\r\n\r\n  private setValue() {\r\n    this.value = this.right.list?.map((x) => x.id) as any[];\r\n    this.onChange(this.value);\r\n  }\r\n\r\n  private setSearchList(...sources: XTransferSource[]) {\r\n    if (this.search) {\r\n      for (let source of sources) {\r\n        if (XIsEmpty(source.searchInput)) {\r\n          source.searchList = [...(source.list as XTransferNode[])];\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  private setData() {\r\n    XSetData<XTransferNode>(this.data, this._unSubject).subscribe((x) => {\r\n      this.nodes = x;\r\n    });\r\n  }\r\n\r\n  private setList() {\r\n    if (!XIsEmpty(this.value)) {\r\n      this.left.list = this.nodes.filter((x) => this.value.indexOf(x.id) < 0);\r\n      this.right.list = this.nodes.filter((x) => this.value.indexOf(x.id) >= 0);\r\n    } else {\r\n      this.left.list = this.nodes;\r\n    }\r\n    this.setSearchList(this.left, this.right);\r\n    // ToDo: x-checkbox error. Attempt to use a destroyed view: detectChanges\r\n    of(true)\r\n      .pipe(delay(0), takeUntil(this._unSubject))\r\n      .subscribe(() => this.cdr.detectChanges());\r\n  }\r\n\r\n  private setTitles() {\r\n    if (XIsEmpty(this.titles)) {\r\n      this.titles = this._titles;\r\n    }\r\n    this.left.title = this.titles[0];\r\n    if (this.titles.length > 1) this.right.title = this.titles[1];\r\n    this.cdr.detectChanges();\r\n  }\r\n}\r\n","<div #transfer class=\"x-transfer\" cdkDropListGroup [ngClass]=\"classMap\">\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: left }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"left.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of left.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: left }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n  <div class=\"x-transfer-buttons\">\r\n    <x-button type=\"primary\" icon=\"fto-chevron-right\" [disabled]=\"left.disabledButton\" (click)=\"move(left, right)\"></x-button>\r\n    <x-button type=\"primary\" icon=\"fto-chevron-left\" [disabled]=\"right.disabledButton\" (click)=\"move(right, left)\"></x-button>\r\n  </div>\r\n  <div class=\"x-transfer-box\">\r\n    <ng-container *ngTemplateOutlet=\"sourceTitleTpl; context: { source: right }\"></ng-container>\r\n    <ul\r\n      class=\"x-transfer-list\"\r\n      cdkDropList\r\n      (cdkDropListDropped)=\"dropCdk($event)\"\r\n      [cdkDropListData]=\"right.list\"\r\n      [cdkDropListDisabled]=\"!drag\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      <li class=\"x-transfer-item\" *ngFor=\"let node of right.list; trackBy: trackByNode\" cdkDrag [cdkDragData]=\"node\">\r\n        <ng-container *ngTemplateOutlet=\"sourceNodeTpl; context: { node: node, source: right }\"></ng-container>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #sourceTitleTpl let-source=\"source\">\r\n  <div class=\"x-transfer-title\">\r\n    <x-checkbox\r\n      [data]=\"[titleTpl ? '' : source.title]\"\r\n      [(ngModel)]=\"source.checkedAll\"\r\n      (ngModelChange)=\"checkedAllChange($event, source)\"\r\n      [indeterminate]=\"source.indeterminate\"\r\n    ></x-checkbox>\r\n    <ng-container *xOutlet=\"titleTpl; context: { $title: source.title, $checkedCount: source.checkedCount, $count: source.list.length }\"\r\n      ><span>{{ source.checkedCount }} / {{ source.list.length }}</span></ng-container\r\n    >\r\n  </div>\r\n  <!-- <div class=\"x-transfer-search\" *ngIf=\"search\">\r\n    <x-input\r\n      icon=\"fto-search\"\r\n      [(ngModel)]=\"source.searchInput\"\r\n      (ngModelChange)=\"searchInputChange(source)\"\r\n      clearable\r\n    ></x-input>\r\n  </div> -->\r\n</ng-template>\r\n\r\n<ng-template #sourceNodeTpl let-node=\"node\" let-source=\"source\">\r\n  <x-checkbox\r\n    [data]=\"[{ id: node.id, label: nodeTpl ? nodeTpl : node.label, node: node }]\"\r\n    [disabled]=\"node.disabled\"\r\n    [(ngModel)]=\"node.checked\"\r\n    (ngModelChange)=\"checkedChange($event, source)\"\r\n  ></x-checkbox>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XTransferComponent } from './transfer.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XCheckboxModule } from '@ng-nest/ui/checkbox';\r\nimport { XButtonModule } from '@ng-nest/ui/button';\r\nimport { DragDropModule } from '@angular/cdk/drag-drop';\r\nimport { XInputModule } from '@ng-nest/ui/input';\r\nimport { XOutletModule } from '@ng-nest/ui/outlet';\r\nimport { XTransferProperty } from './transfer.property';\r\nimport { XBaseFormModule } from '@ng-nest/ui/base-form';\r\n\r\n@NgModule({\r\n  declarations: [XTransferComponent, XTransferProperty],\r\n  exports: [XTransferComponent],\r\n  imports: [CommonModule, FormsModule, DragDropModule, XOutletModule, XCheckboxModule, XButtonModule, XInputModule, XBaseFormModule]\r\n})\r\nexport class XTransferModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/ng-nest-ui-tree-file.js

@@ -66,8 +66,8 @@ class XTreeFileProperty extends XTreeProperty {
         this.showCrumb = true;
     }
 }
-/** @nocollapse */ XTreeFileProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTreeFileProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTreeFileProperty, selector: "ng-component", inputs: { data: "data", domain: "domain", toggle: "toggle", showToggle: "showToggle", showTree: "showTree", showCrumb: "showCrumb", maxHeight: "maxHeight", spacing: "spacing" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XTreeFileProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTreeFileProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTreeFileProperty, selector: "ng-component", inputs: { data: "data", domain: "domain", toggle: "toggle", showToggle: "showToggle", showTree: "showTree", showCrumb: "showCrumb", maxHeight: "maxHeight", spacing: "spacing" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XDataConvert()
 ], XTreeFileProperty.prototype, "data", void 0);
@@ -91,7 +91,7 @@ __decorate([
     XWithConfig(X_CONFIG_NAME, 0.5),
     XInputNumber()
 ], XTreeFileProperty.prototype, "spacing", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { data: [{
@@ -204,9 +204,9 @@ class XTreeFileComponent extends XTreeFileProperty {
         this.cdr.detectChanges();
     }
 }
-/** @nocollapse */ XTreeFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.HttpClient }, { token: i2.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTreeFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTreeFileComponent, selector: "x-tree-file", usesInheritance: true, ngImport: i0, template: "<div #treeFile class=\"x-tree-file\" [ngClass]=\"classMap\" [class.x-tree-file-toggle]=\"toggle\">\r\n  <div class=\"x-tree-file-catalog\" [style.max-height.rem]=\"catalogHeight\" *ngIf=\"showTree\">\r\n    <x-tree\r\n      [data]=\"data\"\r\n      (activatedChange)=\"catalogChange($event)\"\r\n      nodeOpen\r\n      [expandedAll]=\"expandedAll\"\r\n      [expandedLevel]=\"expandedLevel\"\r\n      [expanded]=\"expanded\"\r\n      [spacing]=\"spacing\"\r\n      [activatedId]=\"activatedId\"\r\n    ></x-tree>\r\n  </div>\r\n  <div class=\"x-tree-file-body\" [x-loading]=\"loading\">\r\n    <div class=\"x-tree-file-crumb\" *ngIf=\"showCrumb\">\r\n      <x-link icon=\"fto-menu\" *ngIf=\"showToggle && showTree\" (click)=\"menuToggle()\"></x-link>\r\n      <x-crumb [data]=\"getCrumbData\" [separator]=\"separatorTpl\"></x-crumb>\r\n      <ng-template #separatorTpl>\r\n        <x-icon type=\"fto-chevron-right\"></x-icon>\r\n      </ng-template>\r\n    </div>\r\n    <div class=\"x-tree-file-content\" [style.max-height.rem]=\"codeHeight\" [ngSwitch]=\"activatedNode?.fileType\">\r\n      <div *ngSwitchCase=\"'img'\" class=\"x-tree-file-img\"><img [src]=\"activatedNode?.url\" (load)=\"imgOnload()\"/></div>\r\n      <x-highlight\r\n        *ngSwitchCase=\"'code'\"\r\n        [type]=\"activatedNode?.type\"\r\n        [data]=\"activatedNode?.content\"\r\n        [highlightLines]=\"getHighlightLines\"\r\n      ></x-highlight>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".x-tree-file{margin:0;padding:0;display:flex;background-color:var(--x-background);border-radius:var(--x-border-radius);border:var(--x-border-width) var(--x-border-style) var(--x-border);color:var(--x-text)}.x-tree-file-catalog{width:0;overflow:auto;opacity:0;font-size:.8125rem;transition:var(--x-animation-duration-slow)}.x-tree-file-catalog .x-tree{padding:.5rem}.x-tree-file-catalog .x-tree-node-content{height:1.375rem}.x-tree-file-catalog .x-tree-node-content.x-activated,.x-tree-file-catalog .x-tree-node-content:hover{background-color:var(--x-border)}.x-tree-file-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.x-tree-file-crumb{background-color:var(--x-background);display:flex}.x-tree-file-crumb>x-link{line-height:1.5rem;height:1.5rem;transition:var(--x-animation-duration-base)}.x-tree-file-crumb>x-link>a{padding:0 .5rem}.x-tree-file-crumb>x-crumb{flex:1}.x-tree-file-crumb>x-crumb>.x-crumb{padding:0 .5rem;color:var(--x-text-300)}.x-tree-file-crumb>x-crumb>.x-crumb .x-crumb-separator{margin:0 .125rem}.x-tree-file-content{flex:1;overflow:auto;transition:var(--x-animation-duration-slow);display:flex;min-height:3rem}.x-tree-file-content>x-highlight{border:none}.x-tree-file-content>x-highlight>pre{overflow:inherit}.x-tree-file-content>.x-tree-file-img{margin:auto;padding:1.5rem;display:flex;align-items:center}.x-tree-file-content>.x-tree-file-img>img{max-width:100%;height:auto;margin:auto;box-shadow:var(--x-box-shadow) var(--x-box-shadow-light-color);border-radius:var(--x-border-radius);background-color:var(--x-background-a100)}.x-tree-file-toggle>.x-tree-file-catalog{width:16rem;opacity:1;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}"], components: [{ type: i3.XTreeComponent, selector: "x-tree" }, { type: i4.XLoadingComponent, selector: "x-loading, [x-loading]" }, { type: i5.XLinkComponent, selector: "x-link" }, { type: i6.XCrumbComponent, selector: "x-crumb" }, { type: i7.XIconComponent, selector: "x-icon" }, { type: i8.XHighlightComponent, selector: "x-highlight" }], directives: [{ type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i9.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileComponent, decorators: [{
+/** @nocollapse */ XTreeFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.HttpClient }, { token: i2.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTreeFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTreeFileComponent, selector: "x-tree-file", usesInheritance: true, ngImport: i0, template: "<div #treeFile class=\"x-tree-file\" [ngClass]=\"classMap\" [class.x-tree-file-toggle]=\"toggle\">\r\n  <div class=\"x-tree-file-catalog\" [style.max-height.rem]=\"catalogHeight\" *ngIf=\"showTree\">\r\n    <x-tree\r\n      [data]=\"data\"\r\n      (activatedChange)=\"catalogChange($event)\"\r\n      nodeOpen\r\n      [expandedAll]=\"expandedAll\"\r\n      [expandedLevel]=\"expandedLevel\"\r\n      [expanded]=\"expanded\"\r\n      [spacing]=\"spacing\"\r\n      [activatedId]=\"activatedId\"\r\n    ></x-tree>\r\n  </div>\r\n  <div class=\"x-tree-file-body\" [x-loading]=\"loading\">\r\n    <div class=\"x-tree-file-crumb\" *ngIf=\"showCrumb\">\r\n      <x-link icon=\"fto-menu\" *ngIf=\"showToggle && showTree\" (click)=\"menuToggle()\"></x-link>\r\n      <x-crumb [data]=\"getCrumbData\" [separator]=\"separatorTpl\"></x-crumb>\r\n      <ng-template #separatorTpl>\r\n        <x-icon type=\"fto-chevron-right\"></x-icon>\r\n      </ng-template>\r\n    </div>\r\n    <div class=\"x-tree-file-content\" [style.max-height.rem]=\"codeHeight\" [ngSwitch]=\"activatedNode?.fileType\">\r\n      <div *ngSwitchCase=\"'img'\" class=\"x-tree-file-img\"><img [src]=\"activatedNode?.url\" (load)=\"imgOnload()\"/></div>\r\n      <x-highlight\r\n        *ngSwitchCase=\"'code'\"\r\n        [type]=\"activatedNode?.type\"\r\n        [data]=\"activatedNode?.content\"\r\n        [highlightLines]=\"getHighlightLines\"\r\n      ></x-highlight>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".x-tree-file{margin:0;padding:0;display:flex;background-color:var(--x-background);border-radius:var(--x-border-radius);border:var(--x-border-width) var(--x-border-style) var(--x-border);color:var(--x-text)}.x-tree-file-catalog{width:0;overflow:auto;opacity:0;font-size:.8125rem;transition:var(--x-animation-duration-slow)}.x-tree-file-catalog .x-tree{padding:.5rem}.x-tree-file-catalog .x-tree-node-content{height:1.375rem}.x-tree-file-catalog .x-tree-node-content:hover{background-color:var(--x-border)}.x-tree-file-catalog .x-tree-node-content.x-activated{background-color:var(--x-border)}.x-tree-file-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.x-tree-file-crumb{background-color:var(--x-background);display:flex}.x-tree-file-crumb>x-link{line-height:1.5rem;height:1.5rem;transition:var(--x-animation-duration-base)}.x-tree-file-crumb>x-link>a{padding:0 .5rem}.x-tree-file-crumb>x-crumb{flex:1}.x-tree-file-crumb>x-crumb>.x-crumb{padding:0 .5rem;color:var(--x-text-300)}.x-tree-file-crumb>x-crumb>.x-crumb .x-crumb-separator{margin:0 .125rem}.x-tree-file-content{flex:1;overflow:auto;transition:var(--x-animation-duration-slow);display:flex;min-height:3rem}.x-tree-file-content>x-highlight{border:none}.x-tree-file-content>x-highlight>pre{overflow:inherit}.x-tree-file-content>.x-tree-file-img{margin:auto;padding:1.5rem;display:flex;align-items:center}.x-tree-file-content>.x-tree-file-img>img{max-width:100%;height:auto;margin:auto;box-shadow:var(--x-box-shadow) var(--x-box-shadow-light-color);border-radius:var(--x-border-radius);background-color:var(--x-background-a100)}.x-tree-file-toggle>.x-tree-file-catalog{width:16rem;opacity:1;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}\n"], components: [{ type: i3.XTreeComponent, selector: "x-tree" }, { type: i4.XLoadingComponent, selector: "x-loading, [x-loading]" }, { type: i5.XLinkComponent, selector: "x-link" }, { type: i6.XCrumbComponent, selector: "x-crumb" }, { type: i7.XIconComponent, selector: "x-icon" }, { type: i8.XHighlightComponent, selector: "x-highlight" }], directives: [{ type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i9.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileComponent, decorators: [{
             type: Component,
             args: [{
                     selector: `${XTreeFilePrefix}`,
@@ -219,10 +219,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImpor
 
 class XTreeFileModule {
 }
-/** @nocollapse */ XTreeFileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XTreeFileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileModule, declarations: [XTreeFileComponent, XTreeFileProperty], imports: [CommonModule, HttpClientModule, XTreeModule, XLinkModule, XCrumbModule, XIconModule, XLoadingModule, XHighlightModule], exports: [XTreeFileComponent] });
-/** @nocollapse */ XTreeFileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileModule, imports: [[CommonModule, HttpClientModule, XTreeModule, XLinkModule, XCrumbModule, XIconModule, XLoadingModule, XHighlightModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeFileModule, decorators: [{
+/** @nocollapse */ XTreeFileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XTreeFileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileModule, declarations: [XTreeFileComponent, XTreeFileProperty], imports: [CommonModule, HttpClientModule, XTreeModule, XLinkModule, XCrumbModule, XIconModule, XLoadingModule, XHighlightModule], exports: [XTreeFileComponent] });
+/** @nocollapse */ XTreeFileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileModule, imports: [[CommonModule, HttpClientModule, XTreeModule, XLinkModule, XCrumbModule, XIconModule, XLoadingModule, XHighlightModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeFileModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [XTreeFileComponent, XTreeFileProperty],

package/fesm2015/ng-nest-ui-tree.js

@@ -88,8 +88,8 @@ class XTreeProperty extends XProperty {
         this.manualChange = new EventEmitter();
     }
 }
-/** @nocollapse */ XTreeProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTreeProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTreeProperty, selector: "ng-component", inputs: { data: "data", checkbox: "checkbox", lazy: "lazy", activatedId: "activatedId", expanded: "expanded", checked: "checked", expandedAll: "expandedAll", expandedLevel: "expandedLevel", nodeOpen: "nodeOpen", spacing: "spacing", labelTpl: "labelTpl", nodeHeight: "nodeHeight", allowManyActivated: "allowManyActivated", manual: "manual", levelCheck: "levelCheck", nodeNowrap: "nodeNowrap", nodeAlignItems: "nodeAlignItems", actions: "actions" }, outputs: { activatedChange: "activatedChange", checkboxChange: "checkboxChange", manualChange: "manualChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XTreeProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTreeProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTreeProperty, selector: "ng-component", inputs: { data: "data", checkbox: "checkbox", lazy: "lazy", activatedId: "activatedId", expanded: "expanded", checked: "checked", expandedAll: "expandedAll", expandedLevel: "expandedLevel", nodeOpen: "nodeOpen", spacing: "spacing", labelTpl: "labelTpl", nodeHeight: "nodeHeight", allowManyActivated: "allowManyActivated", manual: "manual", levelCheck: "levelCheck", nodeNowrap: "nodeNowrap", nodeAlignItems: "nodeAlignItems", actions: "actions" }, outputs: { activatedChange: "activatedChange", checkboxChange: "checkboxChange", manualChange: "manualChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XDataConvert()
 ], XTreeProperty.prototype, "data", void 0);
@@ -131,7 +131,7 @@ __decorate([
 __decorate([
     XWithConfig(X_CONFIG_NAME, 'center')
 ], XTreeProperty.prototype, "nodeAlignItems", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { data: [{
@@ -206,8 +206,8 @@ class XTreeNodeProperty extends XProperty {
         this.nodeAlignItems = 'center';
     }
 }
-/** @nocollapse */ XTreeNodeProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeNodeProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTreeNodeProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTreeNodeProperty, selector: "ng-component", inputs: { node: "node", level: "level", lazy: "lazy", nodeHeight: "nodeHeight", nodeNowrap: "nodeNowrap", nodeAlignItems: "nodeAlignItems", lazyData: "lazyData" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ XTreeNodeProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeNodeProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTreeNodeProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTreeNodeProperty, selector: "ng-component", inputs: { node: "node", level: "level", lazy: "lazy", nodeHeight: "nodeHeight", nodeNowrap: "nodeNowrap", nodeAlignItems: "nodeAlignItems", lazyData: "lazyData" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XInputBoolean()
 ], XTreeNodeProperty.prototype, "lazy", void 0);
@@ -217,7 +217,7 @@ __decorate([
 __decorate([
     XInputBoolean()
 ], XTreeNodeProperty.prototype, "nodeNowrap", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeNodeProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeNodeProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], propDecorators: { node: [{
@@ -373,13 +373,13 @@ class XTreeNodeComponent extends XTreeNodeProperty {
         action.handler && action.handler(node);
         event.stopPropagation();
     }
-    trackByItem(index, item) {
+    trackByItem(_index, item) {
         return item.id;
     }
 }
-/** @nocollapse */ XTreeNodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeNodeComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTreeNodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", inputs: { parent: "parent", tree: "tree" }, host: { properties: { "class.x-tree-node": "this.rootClass" } }, usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"x-tree-node-content\"\r\n  [class.x-activated]=\"tree.activatedNode?.id === node.id\"\r\n  [style.padding-left.rem]=\"paddingLeft\"\r\n  [style.height.rem]=\"node.height ? node.height : nodeHeight ? nodeHeight : ''\"\r\n  [style.align-items]=\"node.alignItems ? node.alignItems : nodeAlignItems\"\r\n  (click)=\"onActivate($event, node)\"\r\n>\r\n  <x-icon\r\n    *ngIf=\"!loading\"\r\n    [class.is-leaf]=\"!node.leaf\"\r\n    [class.is-open]=\"node.open\"\r\n    type=\"fto-chevron-right\"\r\n    (click)=\"!tree.nodeOpen && onToggle($event, node)\"\r\n  ></x-icon>\r\n  <x-icon *ngIf=\"loading\" type=\"fto-loader\" [spin]=\"loading\"></x-icon>\r\n  <x-checkbox\r\n    *ngIf=\"tree.checkbox\"\r\n    [data]=\"[{ label: '', id: node.id }]\"\r\n    [(ngModel)]=\"node.checked\"\r\n    (ngModelChange)=\"onCheckboxChange()\"\r\n    [indeterminate]=\"node.indeterminate\"\r\n    [disabled]=\"getNodeDisabled(node.disabled)\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  ></x-checkbox>\r\n  <span\r\n    class=\"x-tree-node-label\"\r\n    [class.nowrap]=\"node.nowrap === false || node.nowrap === true ? node.nowrap : nodeNowrap\"\r\n    [title]=\"node.label\"\r\n    *ngIf=\"!tree.labelTpl; else labelTpl\"\r\n    >{{ node.label }}</span\r\n  >\r\n  <ng-template #labelTpl>\r\n    <ng-container *xOutlet=\"tree.labelTpl; context: { $node: node }\"></ng-container>\r\n  </ng-template>\r\n  <span class=\"x-tree-node-operations\">\r\n    <x-link\r\n      *ngFor=\"let action of tree.actions; trackBy: trackByItem\"\r\n      [icon]=\"action.icon\"\r\n      [title]=\"action.label\"\r\n      (click)=\"onAction($event, action, node)\"\r\n    ></x-link>\r\n  </span>\r\n</div>\r\n<ul *ngIf=\"node.childrenLoaded || (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n  <li\r\n    x-tree-node\r\n    *ngFor=\"let child of node.children; trackBy: trackByItem\"\r\n    [node]=\"child\"\r\n    [parent]=\"this\"\r\n    [lazy]=\"lazy\"\r\n    [lazyData]=\"lazyData\"\r\n    [nodeHeight]=\"nodeHeight\"\r\n    [nodeNowrap]=\"nodeNowrap\"\r\n    [nodeAlignItems]=\"nodeAlignItems\"\r\n    [tree]=\"tree\"\r\n  ></li>\r\n</ul>\r\n", styles: [".x-tree-node{margin:0;padding:0}.x-tree-node-content{display:flex;padding:.0625rem 0;cursor:pointer}.x-tree-node-content x-icon{padding:.25rem;color:var(--x-text-400);font-size:1rem;margin-right:.125rem;transition:var(--x-animation-duration-base)}.x-tree-node-content x-icon.is-leaf{visibility:hidden}.x-tree-node-content x-icon.is-open{transform:rotate(90deg)}.x-tree-node-content x-icon:hover{color:var(--x-text-300)}.x-tree-node-content x-checkbox{margin-right:.325rem;padding:.25rem 0}.x-tree-node-content.x-activated,.x-tree-node-content:hover{background-color:var(--x-background-a100)}.x-tree-node-content:hover .x-tree-node-operations{display:flex;align-items:center}.x-tree-node-operations{display:none}.x-tree-node-operations .x-link{padding:0 .125rem}.x-tree-node-label{flex:1;-webkit-user-select:none;user-select:none}.x-tree-node-label.nowrap{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}"], components: [{ type: i2.XIconComponent, selector: "x-icon" }, { type: i3.XCheckboxComponent, selector: "x-checkbox" }, { type: i4.XLinkComponent, selector: "x-link" }, { type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", inputs: ["parent", "tree"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeNodeComponent, decorators: [{
+/** @nocollapse */ XTreeNodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeNodeComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTreeNodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", inputs: { parent: "parent", tree: "tree" }, host: { properties: { "class.x-tree-node": "this.rootClass" } }, usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"x-tree-node-content\"\r\n  [class.x-activated]=\"tree.activatedNode?.id === node.id\"\r\n  [style.padding-left.rem]=\"paddingLeft\"\r\n  [style.height.rem]=\"node.height ? node.height : nodeHeight ? nodeHeight : ''\"\r\n  [style.align-items]=\"node.alignItems ? node.alignItems : nodeAlignItems\"\r\n  (click)=\"onActivate($event, node)\"\r\n>\r\n  <x-icon\r\n    *ngIf=\"!loading\"\r\n    [class.is-leaf]=\"!node.leaf\"\r\n    [class.is-open]=\"node.open\"\r\n    type=\"fto-chevron-right\"\r\n    (click)=\"!tree.nodeOpen && onToggle($event, node)\"\r\n  ></x-icon>\r\n  <x-icon *ngIf=\"loading\" type=\"fto-loader\" [spin]=\"loading\"></x-icon>\r\n  <x-checkbox\r\n    *ngIf=\"tree.checkbox\"\r\n    [data]=\"[{ label: '', id: node.id }]\"\r\n    [(ngModel)]=\"node.checked\"\r\n    (ngModelChange)=\"onCheckboxChange()\"\r\n    [indeterminate]=\"node.indeterminate\"\r\n    [disabled]=\"getNodeDisabled(node.disabled)\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  ></x-checkbox>\r\n  <span\r\n    class=\"x-tree-node-label\"\r\n    [class.nowrap]=\"node.nowrap === false || node.nowrap === true ? node.nowrap : nodeNowrap\"\r\n    [title]=\"node.label\"\r\n    *ngIf=\"!tree.labelTpl; else labelTpl\"\r\n    >{{ node.label }}</span\r\n  >\r\n  <ng-template #labelTpl>\r\n    <ng-container *xOutlet=\"tree.labelTpl; context: { $node: node }\"></ng-container>\r\n  </ng-template>\r\n  <span class=\"x-tree-node-operations\">\r\n    <x-link\r\n      *ngFor=\"let action of tree.actions; trackBy: trackByItem\"\r\n      [icon]=\"action.icon\"\r\n      [title]=\"action.label\"\r\n      (click)=\"onAction($event, action, node)\"\r\n    ></x-link>\r\n  </span>\r\n</div>\r\n<ul *ngIf=\"node.childrenLoaded || (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n  <li\r\n    x-tree-node\r\n    *ngFor=\"let child of node.children; trackBy: trackByItem\"\r\n    [node]=\"child\"\r\n    [parent]=\"this\"\r\n    [lazy]=\"lazy\"\r\n    [lazyData]=\"lazyData\"\r\n    [nodeHeight]=\"nodeHeight\"\r\n    [nodeNowrap]=\"nodeNowrap\"\r\n    [nodeAlignItems]=\"nodeAlignItems\"\r\n    [tree]=\"tree\"\r\n  ></li>\r\n</ul>\r\n", styles: [".x-tree-node{margin:0;padding:0}.x-tree-node-content{display:flex;padding:.0625rem 0;cursor:pointer}.x-tree-node-content x-icon{padding:.25rem;color:var(--x-text-400);font-size:1rem;margin-right:.125rem;transition:var(--x-animation-duration-base)}.x-tree-node-content x-icon.is-leaf{visibility:hidden}.x-tree-node-content x-icon.is-open{transform:rotate(90deg)}.x-tree-node-content x-icon:hover{color:var(--x-text-300)}.x-tree-node-content x-checkbox{margin-right:.325rem;padding:.25rem 0}.x-tree-node-content:hover,.x-tree-node-content.x-activated{background-color:var(--x-background-a100)}.x-tree-node-content:hover .x-tree-node-operations{display:flex;align-items:center}.x-tree-node-operations{display:none}.x-tree-node-operations .x-link{padding:0 .125rem}.x-tree-node-label{flex:1;-webkit-user-select:none;user-select:none}.x-tree-node-label.nowrap{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}\n"], components: [{ type: i2.XIconComponent, selector: "x-icon" }, { type: i3.XCheckboxComponent, selector: "x-checkbox" }, { type: i4.XLinkComponent, selector: "x-link" }, { type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", inputs: ["parent", "tree"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeNodeComponent, decorators: [{
             type: Component,
             args: [{
                     selector: `${XTreeNodePrefix}, [${XTreeNodePrefix}]`,
@@ -411,11 +411,12 @@ class XTreeComponent extends XTreeProperty {
         this._unSubject = new Subject();
     }
     ngOnChanges(changes) {
-        XIsChange(changes.expandedAll) && this.setExpandedAll();
-        XIsChange(changes.data) && this.setData();
-        XIsChange(changes.activatedId) && this.setActivatedNode(this.treeData);
-        XIsChange(changes.checked) && this.setCheckedKeys(this.checked);
-        XIsChange(changes.manual) && this.setManual();
+        const { expandedAll, data, activatedId, checked, manual } = changes;
+        XIsChange(expandedAll) && this.setExpandedAll();
+        XIsChange(data) && this.setData();
+        XIsChange(activatedId) && this.setActivatedNode(this.treeData);
+        XIsChange(checked) && this.setCheckedKeys(this.checked);
+        XIsChange(manual) && this.setManual();
     }
     ngOnDestroy() {
         this._unSubject.next();
@@ -582,13 +583,13 @@ class XTreeComponent extends XTreeProperty {
         Object.assign(node, nowNode);
         node.change && node.change();
     }
-    trackByItem(index, item) {
+    trackByItem(_index, item) {
         return item.id;
     }
 }
-/** @nocollapse */ XTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.3", type: XTreeComponent, selector: "x-tree", viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #tree class=\"x-tree\">\r\n  <ul>\r\n    <li\r\n      x-tree-node\r\n      *ngFor=\"let node of nodes; trackBy: trackByItem\"\r\n      [node]=\"node\"\r\n      [lazy]=\"lazy\"\r\n      [lazyData]=\"data\"\r\n      [nodeHeight]=\"nodeHeight\"\r\n      [nodeNowrap]=\"nodeNowrap\"\r\n      [nodeAlignItems]=\"nodeAlignItems\"\r\n      [tree]=\"this\"\r\n    ></li>\r\n  </ul>\r\n</div>\r\n\r\n<!-- \u63D0\u524D\u52A0\u8F7Dloading\u7684\u56FE\u6807-->\r\n<x-icon *ngIf=\"lazy\" [style.display]=\"'none'\" type=\"fto-loader\"></x-icon>\r\n", styles: [".x-tree{margin:0;padding:0}"], components: [{ type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", inputs: ["parent", "tree"] }, { type: i2.XIconComponent, selector: "x-icon" }], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeComponent, decorators: [{
+/** @nocollapse */ XTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ XTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XTreeComponent, selector: "x-tree", viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #tree class=\"x-tree\">\r\n  <ul>\r\n    <li\r\n      x-tree-node\r\n      *ngFor=\"let node of nodes; trackBy: trackByItem\"\r\n      [node]=\"node\"\r\n      [lazy]=\"lazy\"\r\n      [lazyData]=\"data\"\r\n      [nodeHeight]=\"nodeHeight\"\r\n      [nodeNowrap]=\"nodeNowrap\"\r\n      [nodeAlignItems]=\"nodeAlignItems\"\r\n      [tree]=\"this\"\r\n    ></li>\r\n  </ul>\r\n</div>\r\n\r\n<!-- \u63D0\u524D\u52A0\u8F7Dloading\u7684\u56FE\u6807-->\r\n<x-icon *ngIf=\"lazy\" [style.display]=\"'none'\" type=\"fto-loader\"></x-icon>\r\n", styles: [".x-tree{margin:0;padding:0}\n"], components: [{ type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", inputs: ["parent", "tree"] }, { type: i2.XIconComponent, selector: "x-icon" }], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeComponent, decorators: [{
             type: Component,
             args: [{
                     selector: `${XTreePrefix}`,
@@ -604,10 +605,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImpor
 
 class XTreeModule {
 }
-/** @nocollapse */ XTreeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XTreeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeModule, declarations: [XTreeComponent, XTreeNodeComponent, XTreeProperty, XTreeNodeProperty], imports: [CommonModule, FormsModule, XIconModule, XCheckboxModule, XOutletModule, XLinkModule], exports: [XTreeComponent, XTreeNodeComponent] });
-/** @nocollapse */ XTreeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeModule, imports: [[CommonModule, FormsModule, XIconModule, XCheckboxModule, XOutletModule, XLinkModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.3", ngImport: i0, type: XTreeModule, decorators: [{
+/** @nocollapse */ XTreeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ XTreeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeModule, declarations: [XTreeComponent, XTreeNodeComponent, XTreeProperty, XTreeNodeProperty], imports: [CommonModule, FormsModule, XIconModule, XCheckboxModule, XOutletModule, XLinkModule], exports: [XTreeComponent, XTreeNodeComponent] });
+/** @nocollapse */ XTreeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeModule, imports: [[CommonModule, FormsModule, XIconModule, XCheckboxModule, XOutletModule, XLinkModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XTreeModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [XTreeComponent, XTreeNodeComponent, XTreeProperty, XTreeNodeProperty],