@ng-nest/ui 20.3.3 → 20.3.5

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

@@ -1,1399 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, model, output, Component, Injectable, InjectionToken, inject, computed, signal, ChangeDetectorRef, ElementRef, HostListener, HostBinding, ChangeDetectionStrategy, ViewEncapsulation, viewChild, viewChildren, effect, NgModule } from '@angular/core';
-import { XPropertyFunction, XToBoolean, XToNumber, XToCssPixelValue, XProperty, XIsEmpty, XRemove, XComputedStyle, XToCssPx, XIsObjectArray, XIsArray, XIsChange, XResize, XIsFunction, XSetData, XIsUndefined, XOrderBy } from '@ng-nest/ui/core';
-import { Subject, debounceTime, map } from 'rxjs';
-import * as i3 from '@angular/cdk/scrolling';
-import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrolling';
-import { DOCUMENT, NgStyle } from '@angular/common';
-import { XIconComponent } from '@ng-nest/ui/icon';
-import { XCheckboxComponent } from '@ng-nest/ui/checkbox';
-import * as i1 from '@angular/forms';
-import { FormsModule } from '@angular/forms';
-import { XKeywordDirective } from '@ng-nest/ui/keyword';
-import { XLinkComponent } from '@ng-nest/ui/link';
-import { XOutletDirective } from '@ng-nest/ui/outlet';
-import * as i2 from '@angular/cdk/drag-drop';
-import { CdkDropList, DragDropModule } from '@angular/cdk/drag-drop';
-
-/**
- * Tree
- * @selector x-tree
- * @decorator component
- */
-const XTreePrefix = 'x-tree';
-const X_TREE_CONFIG_NAME = 'tree';
-/**
- * @zh_CN Tree 节点排序默认值
- * @en_US Tree node order default value
- */
-const X_TREE_ORDER_DEFAULT = [
-    { property: 'sort', order: 'asc' },
-    { property: 'label', order: 'asc' }
-];
-/**
- * Tree Property
- */
-class XTreeProperty extends XPropertyFunction(X_TREE_CONFIG_NAME) {
-    constructor() {
-        super(...arguments);
-        /**
-         * @zh_CN 节点数据
-         * @en_US Node data
-         */
-        this.data = input([], ...(ngDevMode ? [{ debugName: "data" }] : []));
-        /**
-         * @zh_CN 显示多选框
-         * @en_US Show checkbox
-         */
-        this.checkbox = input(false, ...(ngDevMode ? [{ debugName: "checkbox", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 开启懒加载节点，data 必须设置成函数类型
-         * @en_US Open lazy loading node, data must be set to function type
-         */
-        this.lazy = input(false, ...(ngDevMode ? [{ debugName: "lazy", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 当前激活的节点 Id, 当 multiple 为 true 时，值为数组（默认是 Id 数组，objectArray 为 true，对象数组）
-         * @en_US Currently active node Id. When Multiple is true, the value is the Id array
-         */
-        this.activatedId = model(null, ...(ngDevMode ? [{ debugName: "activatedId" }] : []));
-        /**
-         * @zh_CN 展开的节点
-         * @en_US Expanded node
-         */
-        this.expanded = model([], ...(ngDevMode ? [{ debugName: "expanded" }] : []));
-        /**
-         * @zh_CN checkbox 选中的节点
-         * @en_US Checkbox selected node
-         */
-        this.checked = model([], ...(ngDevMode ? [{ debugName: "checked" }] : []));
-        /**
-         * @zh_CN 展开所有节点
-         * @en_US Expand all nodes
-         */
-        this.expandedAll = input(false, ...(ngDevMode ? [{ debugName: "expandedAll", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 默认展开的层级
-         * @en_US Default expanded level
-         */
-        this.expandedLevel = input(-1, ...(ngDevMode ? [{ debugName: "expandedLevel", transform: XToNumber }] : [{ transform: XToNumber }]));
-        /**
-         * @zh_CN 点击节点就触发展开/收起的操作，请确保节点上没有其它操作（checkbox、自定义的操作按钮）
-         * @en_US Click the node to trigger the expand/collapse operation, please make sure that there are no other operations on the node (checkbox, custom operation button)
-         */
-        this.nodeOpen = input(false, ...(ngDevMode ? [{ debugName: "nodeOpen", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 单位间距，这个与层级的乘积算出节点的左边距
-         * @en_US Unit spacing, the product of this and the level calculates the left margin of the node
-         */
-        this.spacing = input(this.config?.spacing ?? '1.5rem', ...(ngDevMode ? [{ debugName: "spacing", transform: XToCssPixelValue }] : [{ transform: XToCssPixelValue }]));
-        /**
-         * @zh_CN 标签自定义模板
-         * @en_US Label custom template
-         */
-        this.labelTpl = input(...(ngDevMode ? [undefined, { debugName: "labelTpl" }] : []));
-        /**
-         * @zh_CN 节点的高度, 默认是自适应高度
-         * @en_US The height of the node
-         */
-        this.nodeHeight = input(this.config?.nodeHeight ?? '', ...(ngDevMode ? [{ debugName: "nodeHeight", transform: XToCssPixelValue }] : [{ transform: XToCssPixelValue }]));
-        /**
-         * @zh_CN 是否允许多次点击一个节点触发多次事件
-         * @en_US Whether to allow multiple clicks on a node to trigger multiple events
-         */
-        this.allowManyActivated = input(false, ...(ngDevMode ? [{ debugName: "allowManyActivated", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 拖动节点
-         * @en_US Drag node
-         */
-        this.drag = input(false, ...(ngDevMode ? [{ debugName: "drag", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 当前点击选中的节点变化的事件
-         * @en_US The event of the currently clicked node change
-         */
-        this.activatedChange = output();
-        /**
-         * @zh_CN 使用 checkedbox 选中变化的事件
-         * @en_US Use checkedbox to select changed events
-         */
-        this.checkboxChange = output();
-        /**
-         * @zh_CN 如果 data 是函数类型，可以通过此参数控制请求，用于弹框中的表格，弹出后再请求
-         * @en_US If data is a function type, you can use this parameter to control the request, which is often used in the form in the pop-up box, and then request it after it pops up
-         */
-        this.manual = model(true, ...(ngDevMode ? [{ debugName: "manual" }] : []));
-        /**
-         * @zh_CN checkbox 状态改变触发层级检查
-         * @en_US Checkbox status changes trigger level checks
-         */
-        this.levelCheck = input(true, ...(ngDevMode ? [{ debugName: "levelCheck", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 节点内容不换行显示省略号
-         * @en_US Show ellipsis without wrapping
-         */
-        this.nodeNowrap = input(true, ...(ngDevMode ? [{ debugName: "nodeNowrap", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 节点垂直对齐方式
-         * @en_US Show ellipsis without wrapping
-         */
-        this.nodeAlignItems = input(this.config?.nodeAlignItems ?? 'center', ...(ngDevMode ? [{ debugName: "nodeAlignItems" }] : []));
-        /**
-         * @zh_CN 树节点操作按钮
-         * @en_US Tree node operation buttons
-         */
-        this.actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : []));
-        /**
-         * @zh_CN 滚动区域元素
-         * @en_US Rolling area element
-         */
-        this.scrollElement = input(...(ngDevMode ? [undefined, { debugName: "scrollElement" }] : []));
-        /**
-         * @zh_CN 开启虚拟滚动
-         * @en_US Turn on virtual scrolling
-         */
-        this.virtualScroll = input(this.config?.virtualScroll ?? false, ...(ngDevMode ? [{ debugName: "virtualScroll", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 滚动区域高度，开启虚拟滚动的时候生效
-         * @en_US Rolling area height
-         */
-        this.virtualScrollHeight = input(this.config?.virtualScrollHeight ?? '400px', ...(ngDevMode ? [{ debugName: "virtualScrollHeight", transform: XToCssPixelValue }] : [{
-                transform: XToCssPixelValue
-            }]));
-        /**
-         * @zh_CN 虚拟滚动高度自适应指定元素
-         * @en_US virtual rolling height follows the specified object
-         */
-        this.heightAdaption = input(...(ngDevMode ? [undefined, { debugName: "heightAdaption" }] : []));
-        /**
-         * @zh_CN itemSize，对应 cdk scroll 中的参数，开启虚拟滚动才生效
-         * @en_US itemSize，corresponding to the parameters in cdk scroll
-         */
-        this.itemSize = input(this.config?.itemSize ?? 34, ...(ngDevMode ? [{ debugName: "itemSize", transform: XToNumber }] : [{ transform: XToNumber }]));
-        /**
-         * @zh_CN 超出可视窗口缓冲区的最小值，对应 cdk scroll 中的参数，开启虚拟滚动才生效
-         * @en_US Exceed the minimum value of the visible window buffer, corresponding to the parameters in cdk scroll
-         */
-        this.minBufferPx = input(100, ...(ngDevMode ? [{ debugName: "minBufferPx", transform: XToNumber }] : [{ transform: XToNumber }]));
-        /**
-         * @zh_CN 渲染新数据缓冲区的像素，对应 cdk scroll 中的参数，开启虚拟滚动才生效
-         * @en_US Render the pixels of the new data buffer, corresponding to the parameters in cdk scroll
-         */
-        this.maxBufferPx = input(200, ...(ngDevMode ? [{ debugName: "maxBufferPx", transform: XToNumber }] : [{ transform: XToNumber }]));
-        /**
-         * @zh_CN 多选功能，当前激活的节点可以是多个
-         * @en_US Multiple choice
-         */
-        this.multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 当开启多选的时候，activatedId 的值为对象数组
-         * @en_US When multiple selection is enabled, the value of activatedId is an array of objects
-         */
-        this.objectArray = input(false, ...(ngDevMode ? [{ debugName: "objectArray", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 当开启多选的时候，点击父节点，包含子节点
-         * @en_US When selecting multiple options, click on the parent node to include the child nodes
-         */
-        this.includeChildren = input(this.config?.includeChildren ?? false, ...(ngDevMode ? [{ debugName: "includeChildren", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 关键字高亮，针对下拉树搜索
-         * @en_US Keyword highlighting
-         */
-        this.keywordText = input(...(ngDevMode ? [undefined, { debugName: "keywordText" }] : []));
-        /**
-         * @zh_CN 匹配关键字区分大小写，针对下拉树搜索
-         * @en_US Case-sensitive
-         */
-        this.caseSensitive = input(this.config?.caseSensitive ?? true, ...(ngDevMode ? [{ debugName: "caseSensitive", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 只能选择叶子节点
-         * @en_US Only leaf nodes can be selected
-         */
-        this.onlyLeaf = input(this.config?.onlyLeaf ?? false, ...(ngDevMode ? [{ debugName: "onlyLeaf", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 展开收起的图标自定义模版
-         * @en_US Expand the folded icon custom template
-         */
-        this.expandedIcon = input(...(ngDevMode ? [undefined, { debugName: "expandedIcon" }] : []));
-        /**
-         * @zh_CN 显示连接线
-         * @en_US Show line
-         */
-        this.showLine = input(this.config?.showLine ?? false, ...(ngDevMode ? [{ debugName: "showLine", transform: XToBoolean }] : [{ transform: XToBoolean }]));
-        /**
-         * @zh_CN 排序属性
-         * @en_US Order property
-         */
-        this.order = input(this.config?.order ?? X_TREE_ORDER_DEFAULT, ...(ngDevMode ? [{ debugName: "order" }] : []));
-        /**
-         * @zh_CN 节点点击事件
-         * @en_US Node click event
-         */
-        this.nodeClick = output();
-        /**
-         * @zh_CN 节点开始拖动事件
-         * @en_US Node drag started
-         */
-        this.nodeDragStarted = output();
-        /**
-         * @zh_CN 节点结束拖动事件
-         * @en_US Node drag ended
-         */
-        this.nodeDragEnded = output();
-        /**
-         * @zh_CN 节点正在拖动事件
-         * @en_US Node drag moved
-         */
-        this.nodeDragMoved = output();
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XTreeProperty, isStandalone: true, selector: "x-tree-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, activatedId: { classPropertyName: "activatedId", publicName: "activatedId", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, expandedAll: { classPropertyName: "expandedAll", publicName: "expandedAll", isSignal: true, isRequired: false, transformFunction: null }, expandedLevel: { classPropertyName: "expandedLevel", publicName: "expandedLevel", isSignal: true, isRequired: false, transformFunction: null }, nodeOpen: { classPropertyName: "nodeOpen", publicName: "nodeOpen", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, labelTpl: { classPropertyName: "labelTpl", publicName: "labelTpl", isSignal: true, isRequired: false, transformFunction: null }, nodeHeight: { classPropertyName: "nodeHeight", publicName: "nodeHeight", isSignal: true, isRequired: false, transformFunction: null }, allowManyActivated: { classPropertyName: "allowManyActivated", publicName: "allowManyActivated", isSignal: true, isRequired: false, transformFunction: null }, drag: { classPropertyName: "drag", publicName: "drag", isSignal: true, isRequired: false, transformFunction: null }, manual: { classPropertyName: "manual", publicName: "manual", isSignal: true, isRequired: false, transformFunction: null }, levelCheck: { classPropertyName: "levelCheck", publicName: "levelCheck", isSignal: true, isRequired: false, transformFunction: null }, nodeNowrap: { classPropertyName: "nodeNowrap", publicName: "nodeNowrap", isSignal: true, isRequired: false, transformFunction: null }, nodeAlignItems: { classPropertyName: "nodeAlignItems", publicName: "nodeAlignItems", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, scrollElement: { classPropertyName: "scrollElement", publicName: "scrollElement", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollHeight: { classPropertyName: "virtualScrollHeight", publicName: "virtualScrollHeight", isSignal: true, isRequired: false, transformFunction: null }, heightAdaption: { classPropertyName: "heightAdaption", publicName: "heightAdaption", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, minBufferPx: { classPropertyName: "minBufferPx", publicName: "minBufferPx", isSignal: true, isRequired: false, transformFunction: null }, maxBufferPx: { classPropertyName: "maxBufferPx", publicName: "maxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, objectArray: { classPropertyName: "objectArray", publicName: "objectArray", isSignal: true, isRequired: false, transformFunction: null }, includeChildren: { classPropertyName: "includeChildren", publicName: "includeChildren", isSignal: true, isRequired: false, transformFunction: null }, keywordText: { classPropertyName: "keywordText", publicName: "keywordText", isSignal: true, isRequired: false, transformFunction: null }, caseSensitive: { classPropertyName: "caseSensitive", publicName: "caseSensitive", isSignal: true, isRequired: false, transformFunction: null }, onlyLeaf: { classPropertyName: "onlyLeaf", publicName: "onlyLeaf", isSignal: true, isRequired: false, transformFunction: null }, expandedIcon: { classPropertyName: "expandedIcon", publicName: "expandedIcon", isSignal: true, isRequired: false, transformFunction: null }, showLine: { classPropertyName: "showLine", publicName: "showLine", isSignal: true, isRequired: false, transformFunction: null }, order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activatedId: "activatedIdChange", expanded: "expandedChange", checked: "checkedChange", activatedChange: "activatedChange", checkboxChange: "checkboxChange", manual: "manualChange", nodeClick: "nodeClick", nodeDragStarted: "nodeDragStarted", nodeDragEnded: "nodeDragEnded", nodeDragMoved: "nodeDragMoved" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeProperty, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTreePrefix}-property`, template: '' }]
-        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], checkbox: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkbox", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], activatedId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activatedId", required: false }] }, { type: i0.Output, args: ["activatedIdChange"] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], expandedAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedAll", required: false }] }], expandedLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedLevel", required: false }] }], nodeOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeOpen", required: false }] }], spacing: [{ type: i0.Input, args: [{ isSignal: true, alias: "spacing", required: false }] }], labelTpl: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelTpl", required: false }] }], nodeHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeHeight", required: false }] }], allowManyActivated: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowManyActivated", required: false }] }], drag: [{ type: i0.Input, args: [{ isSignal: true, alias: "drag", required: false }] }], activatedChange: [{ type: i0.Output, args: ["activatedChange"] }], checkboxChange: [{ type: i0.Output, args: ["checkboxChange"] }], manual: [{ type: i0.Input, args: [{ isSignal: true, alias: "manual", required: false }] }, { type: i0.Output, args: ["manualChange"] }], levelCheck: [{ type: i0.Input, args: [{ isSignal: true, alias: "levelCheck", required: false }] }], nodeNowrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeNowrap", required: false }] }], nodeAlignItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeAlignItems", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], scrollElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollElement", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualScrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollHeight", required: false }] }], heightAdaption: [{ type: i0.Input, args: [{ isSignal: true, alias: "heightAdaption", required: false }] }], itemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemSize", required: false }] }], minBufferPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "minBufferPx", required: false }] }], maxBufferPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxBufferPx", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], objectArray: [{ type: i0.Input, args: [{ isSignal: true, alias: "objectArray", required: false }] }], includeChildren: [{ type: i0.Input, args: [{ isSignal: true, alias: "includeChildren", required: false }] }], keywordText: [{ type: i0.Input, args: [{ isSignal: true, alias: "keywordText", required: false }] }], caseSensitive: [{ type: i0.Input, args: [{ isSignal: true, alias: "caseSensitive", required: false }] }], onlyLeaf: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyLeaf", required: false }] }], expandedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedIcon", required: false }] }], showLine: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLine", required: false }] }], order: [{ type: i0.Input, args: [{ isSignal: true, alias: "order", required: false }] }], nodeClick: [{ type: i0.Output, args: ["nodeClick"] }], nodeDragStarted: [{ type: i0.Output, args: ["nodeDragStarted"] }], nodeDragEnded: [{ type: i0.Output, args: ["nodeDragEnded"] }], nodeDragMoved: [{ type: i0.Output, args: ["nodeDragMoved"] }] } });
-/**
- * TreeNode
- * @selector x-tree-node
- * @decorator directive
- */
-const XTreeNodePrefix = 'x-tree-node';
-/**
- * TreeNode Property
- */
-class XTreeNodeProperty extends XProperty {
-    constructor() {
-        super(...arguments);
-        /**
-         * @zh_CN 节点数据
-         * @en_US Node data
-         */
-        this.node = input({}, ...(ngDevMode ? [{ debugName: "node" }] : []));
-        /**
-         * @zh_CN 层级
-         * @en_US Level
-         */
-        this.level = model(0, ...(ngDevMode ? [{ debugName: "level" }] : []));
-        /**
-         * @zh_CN 节点的高度
-         * @en_US The height of the node
-         */
-        this.nodeHeight = model('', ...(ngDevMode ? [{ debugName: "nodeHeight" }] : []));
-        /**
-         * @zh_CN 节点内容不换行显示省略号
-         * @en_US Show ellipsis without wrapping
-         */
-        this.nodeNowrap = model(false, ...(ngDevMode ? [{ debugName: "nodeNowrap" }] : []));
-        /**
-         * @zh_CN 节点垂直对齐方式
-         * @en_US Show ellipsis without wrapping
-         */
-        this.nodeAlignItems = model('center', ...(ngDevMode ? [{ debugName: "nodeAlignItems" }] : []));
-        /**
-         * @zh_CN 标记为虚拟滚动的节点
-         * @en_US Mark as a node of virtual rolling
-         */
-        this.virtualScroll = model(false, ...(ngDevMode ? [{ debugName: "virtualScroll" }] : []));
-        /**
-         * @zh_CN 禁用
-         * @en_US Disabled
-         */
-        this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        /**
-         * @zh_CN id
-         * @en_US Id
-         */
-        this.id = model(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
-        /**
-         * @zh_CN pid
-         * @en_US pId
-         */
-        this.pid = model(...(ngDevMode ? [undefined, { debugName: "pid" }] : []));
-        /**
-         * @zh_CN 叶子节点
-         * @en_US A leaf node
-         */
-        this.leaf = model(false, ...(ngDevMode ? [{ debugName: "leaf" }] : []));
-        /**
-         * @zh_CN 节点的高度
-         * @en_US The height of the node
-         */
-        this.height = model('', ...(ngDevMode ? [{ debugName: "height" }] : []));
-        /**
-         * @zh_CN 节点垂直对齐方式
-         * @en_US Show ellipsis without wrapping
-         */
-        this.alignItems = model(...(ngDevMode ? [undefined, { debugName: "alignItems" }] : []));
-        /**
-         * @zh_CN 节点垂直对齐方式
-         * @en_US Show ellipsis without wrapping
-         */
-        this.loading = model(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
-        /**
-         * @zh_CN 展开
-         * @en_US open
-         */
-        this.open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
-        /**
-         * @zh_CN checkbox 是否选中
-         * @en_US whether checkbox is selected
-         */
-        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
-        /**
-         * @zh_CN checkbox 子节点是否有选中的状态
-         * @en_US Whether the child node of checkbox is selected
-         */
-        this.indeterminate = model(false, ...(ngDevMode ? [{ debugName: "indeterminate" }] : []));
-        /**
-         * @zh_CN 节点名称
-         * @en_US The name of the node
-         */
-        this.label = model('', ...(ngDevMode ? [{ debugName: "label" }] : []));
-        /**
-         * @zh_CN 节点内容不换行显示省略号，优先级高于 tree 参数
-         * @en_US Show ellipsis without wrapping, highest priority
-         */
-        this.nowrap = model(false, ...(ngDevMode ? [{ debugName: "nowrap" }] : []));
-        /**
-         * @zh_CN 节点展开收起事件
-         * @en_US Node expansion pack up
-         */
-        this.toggle = output();
-        /**
-         * @zh_CN 树节点操作按钮
-         * @en_US Tree node operation buttons
-         */
-        this.actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : []));
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeNodeProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XTreeNodeProperty, isStandalone: true, selector: "x-tree-node-property", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, nodeHeight: { classPropertyName: "nodeHeight", publicName: "nodeHeight", isSignal: true, isRequired: false, transformFunction: null }, nodeNowrap: { classPropertyName: "nodeNowrap", publicName: "nodeNowrap", isSignal: true, isRequired: false, transformFunction: null }, nodeAlignItems: { classPropertyName: "nodeAlignItems", publicName: "nodeAlignItems", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, pid: { classPropertyName: "pid", publicName: "pid", isSignal: true, isRequired: false, transformFunction: null }, leaf: { classPropertyName: "leaf", publicName: "leaf", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, alignItems: { classPropertyName: "alignItems", publicName: "alignItems", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, nowrap: { classPropertyName: "nowrap", publicName: "nowrap", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { level: "levelChange", nodeHeight: "nodeHeightChange", nodeNowrap: "nodeNowrapChange", nodeAlignItems: "nodeAlignItemsChange", virtualScroll: "virtualScrollChange", disabled: "disabledChange", id: "idChange", pid: "pidChange", leaf: "leafChange", height: "heightChange", alignItems: "alignItemsChange", loading: "loadingChange", open: "openChange", checked: "checkedChange", indeterminate: "indeterminateChange", label: "labelChange", nowrap: "nowrapChange", toggle: "toggle" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeNodeProperty, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTreeNodePrefix}-property`, template: '' }]
-        }], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: false }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }, { type: i0.Output, args: ["levelChange"] }], nodeHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeHeight", required: false }] }, { type: i0.Output, args: ["nodeHeightChange"] }], nodeNowrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeNowrap", required: false }] }, { type: i0.Output, args: ["nodeNowrapChange"] }], nodeAlignItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeAlignItems", required: false }] }, { type: i0.Output, args: ["nodeAlignItemsChange"] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }, { type: i0.Output, args: ["virtualScrollChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }, { type: i0.Output, args: ["idChange"] }], pid: [{ type: i0.Input, args: [{ isSignal: true, alias: "pid", required: false }] }, { type: i0.Output, args: ["pidChange"] }], leaf: [{ type: i0.Input, args: [{ isSignal: true, alias: "leaf", required: false }] }, { type: i0.Output, args: ["leafChange"] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }, { type: i0.Output, args: ["heightChange"] }], alignItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignItems", required: false }] }, { type: i0.Output, args: ["alignItemsChange"] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }, { type: i0.Output, args: ["loadingChange"] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }, { type: i0.Output, args: ["indeterminateChange"] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }, { type: i0.Output, args: ["labelChange"] }], nowrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "nowrap", required: false }] }, { type: i0.Output, args: ["nowrapChange"] }], toggle: [{ type: i0.Output, args: ["toggle"] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }] } });
-
-class XTreeService {
-    getChildren(data, node) {
-        const res = [];
-        const gChildren = (nd) => {
-            const children = data.filter((x) => x.pid === nd.id);
-            if (XIsEmpty(children))
-                return;
-            for (let child of children) {
-                res.push(child);
-                gChildren(child);
-            }
-        };
-        gChildren(node);
-        return res;
-    }
-    getParents(data, node) {
-        const res = [];
-        const gParent = (nd) => {
-            if (!nd.pid)
-                return;
-            const parent = data.find((x) => x.id === nd.pid);
-            if (!parent)
-                return;
-            res.push(parent);
-            gParent(parent);
-        };
-        gParent(node);
-        return res;
-    }
-    getOpenChildren(data, node) {
-        const res = [];
-        const gChildren = (nd) => {
-            if (!nd.open)
-                return;
-            const children = data.filter((x) => x.pid === nd.id);
-            if (XIsEmpty(children))
-                return;
-            for (let child of children) {
-                res.push(child);
-                gChildren(child);
-            }
-        };
-        gChildren(node);
-        return res;
-    }
-    moveNode(data, from, to, pos) {
-        if (XIsEmpty(data))
-            return;
-        const isAddChildNode = pos === 0;
-        const formIndex = data.findIndex((x) => x.id === from.id);
-        const toIndex = data.findIndex((x) => x.id === to.id);
-        XRemove(data, (x) => x.id === from.id);
-        if (from.pid === to.pid) {
-            let diffLevel = 0;
-            if (isAddChildNode) {
-                from.pid = to.id;
-                diffLevel = to.level + 1 - from.level;
-                from.level = to.level + 1;
-                to.open = true;
-            }
-            else {
-                diffLevel = to.level - from.level;
-            }
-            const fromChildren = this.getChildren(data, from);
-            fromChildren.forEach((x) => {
-                x.level = x.level + diffLevel;
-            });
-            const index = toIndex > formIndex ? toIndex - 1 : toIndex;
-            data.splice(pos === -1 ? index : index + 1, 0, from);
-        }
-        else if (from.pid !== to.pid) {
-            let diffLevel = 0;
-            if (isAddChildNode) {
-                from.pid = to.id;
-                diffLevel = to.level + 1 - from.level;
-                from.level = to.level + 1;
-                to.open = true;
-            }
-            else {
-                from.pid = to.pid;
-                diffLevel = to.level - from.level;
-                from.level = to.level;
-            }
-            const fromChildren = this.getChildren(data, from);
-            fromChildren.forEach((x) => {
-                x.level = x.level + diffLevel;
-            });
-            const index = toIndex > formIndex ? toIndex - 1 : toIndex;
-            data.splice(pos === -1 ? index : index + 1, 0, from);
-        }
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-const X_TREE_CONTEXT = new InjectionToken('X_TREE_CONTEXT');
-
-class XTreeNodeComponent extends XTreeNodeProperty {
-    constructor() {
-        super(...arguments);
-        this.tree = inject(X_TREE_CONTEXT, { optional: true });
-        this.nodeMouseenter = output();
-        this.rootClass = true;
-        this.document = inject(DOCUMENT);
-        this.fontSize = computed(() => parseFloat(XComputedStyle(this.document.documentElement, 'font-size')), ...(ngDevMode ? [{ debugName: "fontSize" }] : []));
-        this.unSubject = new Subject();
-        this.showDragIndicator = computed(() => {
-            return this.tree.dragging() && this.tree.hoverTreeNode()?.id === this.id();
-        }, ...(ngDevMode ? [{ debugName: "showDragIndicator" }] : []));
-        this.isChildrenLast = computed(() => {
-            let parent = this.tree.nodes().find((x) => x.id === this.pid());
-            if (!parent || !parent.children)
-                return false;
-            const index = parent.children.indexOf(this.node());
-            return index + 1 === parent.children.length;
-        }, ...(ngDevMode ? [{ debugName: "isChildrenLast" }] : []));
-        this.isParentLast = computed(() => {
-            let parents = this.treeService.getParents(this.tree.nodes(), this.node());
-            if (parents.length <= 1)
-                return [];
-            const res = [];
-            parents.reduce((pre, curr) => {
-                if (pre === null)
-                    return curr;
-                const index = curr.children?.indexOf(pre);
-                res.push(index + 1 === curr.children?.length);
-                return curr;
-            });
-            return res.reverse();
-        }, ...(ngDevMode ? [{ debugName: "isParentLast" }] : []));
-        this.verticalLevel = computed(() => {
-            if (this.level() > 0) {
-                return Array.from({ length: this.level() }).map((_x, index) => index + 1);
-            }
-            else {
-                return [];
-            }
-        }, ...(ngDevMode ? [{ debugName: "verticalLevel" }] : []));
-        this.verticalWidth = computed(() => {
-            return XToCssPx(this.tree.spacing(), this.fontSize()) / 2;
-        }, ...(ngDevMode ? [{ debugName: "verticalWidth" }] : []));
-        this.paddingLeft = computed(() => (this.level() ? this.level() : 0) * XToCssPx(this.tree.spacing(), this.fontSize()), ...(ngDevMode ? [{ debugName: "paddingLeft" }] : []));
-        this.indicatorWidth = computed(() => {
-            if (this.tree.dragPosition() === 0) {
-                return `calc(100% - ${this.paddingLeft() + XToCssPx(this.tree.spacing(), this.fontSize()) + (this.leaf() ? this.fontSize() * 1.5 : 0)}px)`;
-            }
-            return `calc(100% - ${this.paddingLeft() + (this.leaf() ? this.fontSize() * 1.5 : 0)}px)`;
-        }, ...(ngDevMode ? [{ debugName: "indicatorWidth" }] : []));
-        this.indicatorStyle = computed(() => {
-            if (this.tree.dragPosition() === 1) {
-                return { bottom: `-${0.0625 * this.fontSize()}px` };
-            }
-            else if (this.tree.dragPosition() === -1) {
-                return { top: `-${0.0625 * this.fontSize()}px` };
-            }
-            else if (this.tree.dragPosition() === 0) {
-                return {
-                    bottom: `-${0.0625 * this.fontSize()}px`
-                };
-            }
-            return {};
-        }, ...(ngDevMode ? [{ debugName: "indicatorStyle" }] : []));
-        this.changed = signal(false, ...(ngDevMode ? [{ debugName: "changed" }] : []));
-        this.activated = computed(() => {
-            this.changed();
-            const activatedId = this.tree.activatedId();
-            if (this.tree.multiple()) {
-                if (this.tree.objectArray()) {
-                    return XIsObjectArray(activatedId) && activatedId.map((x) => x.id).includes(this.id());
-                }
-                else {
-                    return XIsArray(activatedId) && activatedId.includes(this.id());
-                }
-            }
-            else {
-                return activatedId === this.id();
-            }
-        }, ...(ngDevMode ? [{ debugName: "activated" }] : []));
-        this.cdr = inject(ChangeDetectorRef);
-        this.treeService = inject(XTreeService);
-        this.elementRef = inject(ElementRef);
-    }
-    onMouseenter(event) {
-        this.nodeMouseenter.emit({ event: event, node: this.node(), ele: this.elementRef });
-    }
-    onMouseleave(_event) {
-        if (!this.tree.dragging())
-            return;
-        const hoverTreeNode = this.tree.hoverTreeNode();
-        hoverTreeNode && hoverTreeNode.change && hoverTreeNode.change();
-        this.cdr.detectChanges();
-    }
-    ngOnInit() {
-        const node = this.node();
-        node.change = (check) => {
-            if (check)
-                this.setCheckbox();
-            this.cdr.detectChanges();
-        };
-        if (!this.tree.levelCheck())
-            return;
-        if (this.checked())
-            this.setCheckbox();
-        this.setIndeterminate(this.node());
-    }
-    ngOnDestroy() {
-        this.unSubject.next();
-        this.unSubject.complete();
-    }
-    onActivate(event, node) {
-        const change = this.tree.activatedNode()?.change;
-        this.tree.nodeOpen() && !this.leaf() && this.onToggle(event, node);
-        const onChange = () => {
-            change && change();
-            event.preventDefault();
-            event.stopPropagation();
-            this.cdr.detectChanges();
-        };
-        if (this.tree.onlyLeaf() && !this.leaf()) {
-            onChange();
-            return;
-        }
-        if (this.tree.multiple()) {
-            if (!this.tree.activatedId())
-                this.tree.activatedId.set([]);
-            const nodes = [node];
-            if (this.tree.includeChildren()) {
-                nodes.push(...this.getChildren());
-            }
-            if (this.tree.objectArray()) {
-                const ids = this.tree.activatedId().map((x) => x.id);
-                if (ids.includes(node.id)) {
-                    this.tree.activatedId.update((x) => {
-                        for (let it of nodes) {
-                            x.splice(ids.indexOf(it.id), 1);
-                        }
-                        return [...x];
-                    });
-                }
-                else {
-                    this.tree.activatedId.update((x) => {
-                        for (let it of nodes) {
-                            if (!x.includes(it)) {
-                                x.push(it);
-                            }
-                        }
-                        return [...x];
-                    });
-                }
-            }
-            else {
-                if (this.tree.activatedId().includes(node.id)) {
-                    this.tree.activatedId.update((x) => {
-                        for (let it of nodes) {
-                            x.splice(this.tree.activatedId().indexOf(it.id), 1);
-                        }
-                        return [...x];
-                    });
-                }
-                else {
-                    this.tree.activatedId.update((x) => {
-                        for (let it of nodes) {
-                            if (!x.includes(it.id)) {
-                                x.push(it.id);
-                            }
-                        }
-                        return [...x];
-                    });
-                }
-            }
-        }
-        else {
-            this.tree.activatedId.set(node.id);
-        }
-        if (this.tree.activatedNode()) {
-            if (this.tree.activatedNode()?.id === node.id && !this.tree.allowManyActivated())
-                return;
-        }
-        this.tree.activatedNode.set(node);
-        this.changed.update((x) => !x);
-        this.tree.activatedChange.emit(node);
-        this.tree.nodeClick.emit(node);
-        onChange();
-    }
-    onCheckboxChange() {
-        this.setCheckbox();
-        this.tree.checkboxChange?.emit(this.node());
-    }
-    getVerticalLeft(i) {
-        const spacing = XToCssPx(this.tree.spacing(), this.fontSize());
-        return (i - 1) * spacing + spacing / 2;
-    }
-    setCheckbox() {
-        if (!this.tree.levelCheck())
-            return;
-        this.node().indeterminate = this.checked();
-        this.node().children && this.setChildrenCheckbox(this.checked());
-        const setParent = (node) => {
-            let parent = this.tree.nodes().find((x) => x.id === node.pid);
-            if (!parent || XIsEmpty(parent.children))
-                return;
-            let checkedList = parent.children?.filter((y) => y.checked);
-            let indeterminateList = parent.children?.filter((y) => y.indeterminate);
-            parent.checked = checkedList?.length === parent.children?.length;
-            parent.indeterminate = checkedList.length > 0 || indeterminateList.length > 0;
-            parent.change && parent.change();
-            setParent(parent);
-        };
-        setParent(this.node());
-        this.cdr.detectChanges();
-    }
-    getChildren() {
-        const res = [];
-        const getChildren = (children) => {
-            if (XIsEmpty(children))
-                return;
-            for (let x of children) {
-                if (x.disabled)
-                    continue;
-                res.push(x);
-                getChildren(x.children);
-            }
-        };
-        getChildren(this.node().children);
-        return res;
-    }
-    setChildrenCheckbox(checked) {
-        const setChildren = (children, isChecked) => {
-            if (XIsEmpty(children))
-                return;
-            for (let x of children) {
-                if (x.disabled)
-                    continue;
-                x.checked = isChecked;
-                x.indeterminate = isChecked;
-                x.change && x.change();
-                setChildren(x.children, isChecked);
-            }
-        };
-        setChildren(this.node().children, checked);
-        this.cdr.detectChanges();
-    }
-    setParentCheckbox() {
-        if (XIsEmpty(this.node().children))
-            return;
-        let checkedList = this.node().children?.filter((x) => x.checked);
-        let indeterminateList = this.node().children?.filter((x) => x.indeterminate);
-        this.node().checked = checkedList?.length === this.node().children?.length;
-        this.node().indeterminate =
-            checkedList.length > 0 || indeterminateList.length > 0;
-        this.cdr.detectChanges();
-    }
-    setIndeterminate(node) {
-        const getChildren = (children) => {
-            if (XIsEmpty(children))
-                return;
-            children.forEach((x) => {
-                if (x.indeterminate || x.checked) {
-                    node.indeterminate = true;
-                    return;
-                }
-                getChildren(x.children);
-            });
-        };
-        getChildren(node.children);
-        this.cdr.detectChanges();
-    }
-    getNodeDisabled(disabled) {
-        return disabled;
-    }
-    onAction(event, action, node) {
-        action.handler && action.handler(node);
-        event.stopPropagation();
-    }
-    onToggle(event, node) {
-        this.toggle.emit(node);
-        event?.preventDefault();
-        event?.stopPropagation();
-    }
-    trackByItem(_index, item) {
-        return `${item.id}-${item.level}`;
-    }
-    trackByAction(_index, item) {
-        return item.id;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeNodeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XTreeNodeComponent, isStandalone: true, selector: "x-tree-node, [x-tree-node]", outputs: { nodeMouseenter: "nodeMouseenter" }, host: { listeners: { "mouseenter": "onMouseenter($event)", "mouseleave": "onMouseleave($event)" }, 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]=\"activated()\"\r\n  [class.x-disabled]=\"disabled()\"\r\n  [class.x-tree-node-sub]=\"!leaf()\"\r\n  [class.x-tree-node-last]=\"isChildrenLast()\"\r\n  [style.padding-left.px]=\"paddingLeft() + fontSize() / 2\"\r\n  [style.height]=\"height() ? height() : nodeHeight() ? nodeHeight() : ''\"\r\n  [style.align-items]=\"alignItems() ? alignItems() : nodeAlignItems()\"\r\n  (click)=\"!disabled() && onActivate($event, node())\"\r\n>\r\n  @if (tree.showLine() && level()! > 0) {\r\n    <div class=\"x-tree-node-line\" [style.width.px]=\"paddingLeft()\">\r\n      @for (i of verticalLevel(); track i) {\r\n        <div\r\n          class=\"x-tree-node-line-vertical\"\r\n          [hidden]=\"isParentLast()[i - 1]\"\r\n          [class.is-last]=\"i === verticalLevel().length\"\r\n          [style.left.px]=\"getVerticalLeft(i)\"\r\n        ></div>\r\n      }\r\n      <div\r\n        class=\"x-tree-node-line-horizontal\"\r\n        [style.width.px]=\"verticalWidth()\"\r\n        [style.left.px]=\"getVerticalLeft(verticalLevel().length)\"\r\n      ></div>\r\n    </div>\r\n  }\r\n  @if (showDragIndicator()) {\r\n    <div class=\"x-tree-node-drag-indicator\" [style.width]=\"indicatorWidth()\" [ngStyle]=\"indicatorStyle()\"></div>\r\n  }\r\n  @if (loading()) {\r\n    <x-icon class=\"x-tree-node-loading\" type=\"fto-loader\" [spin]=\"loading()!\"></x-icon>\r\n  } @else {\r\n    <div\r\n      class=\"x-tree-node-right\"\r\n      [class.is-leaf]=\"leaf()\"\r\n      [class.is-open]=\"open()\"\r\n      [class.is-template]=\"tree.expandedIcon()\"\r\n      [style.width.px]=\"verticalWidth() * 2\"\r\n      (click)=\"!tree.nodeOpen() && onToggle($event, node())\"\r\n    >\r\n      @if (!leaf()) {\r\n        @if (tree.expandedIcon()) {\r\n          <ng-container *xOutlet=\"tree.expandedIcon(); context: { $node: node() }\"></ng-container>\r\n        } @else {\r\n          <x-icon class=\"x-tree-node-icon\" type=\"fto-chevron-right\"></x-icon>\r\n        }\r\n      }\r\n    </div>\r\n  }\r\n  @if (tree.checkbox()) {\r\n    <x-checkbox\r\n      class=\"x-tree-node-checkbox\"\r\n      [data]=\"[{ label: '', id: id() }]\"\r\n      [(ngModel)]=\"checked\"\r\n      (ngModelChange)=\"onCheckboxChange()\"\r\n      [indeterminate]=\"indeterminate()!\"\r\n      [disabled]=\"disabled()!\"\r\n      (click)=\"$event.stopPropagation()\"\r\n      single\r\n    ></x-checkbox>\r\n  }\r\n  @if (!tree.labelTpl()) {\r\n    <span\r\n      class=\"x-tree-node-label\"\r\n      [class.nowrap]=\"nowrap() === false || nowrap() === true ? nowrap() : nodeNowrap()\"\r\n      [title]=\"label()\"\r\n      x-keyword\r\n      [text]=\"tree.keywordText()\"\r\n      [caseSensitive]=\"tree.caseSensitive()\"\r\n      >{{ label() }}</span\r\n    >\r\n  } @else {\r\n    <ng-container *xOutlet=\"tree.labelTpl(); context: { $node: node() }\"></ng-container>\r\n  }\r\n  <span class=\"x-tree-node-operations\">\r\n    @for (action of actions(); track action.id) {\r\n      <x-link [icon]=\"action.icon\" [title]=\"action.label\" (click)=\"onAction($event, action, node())\">{{\r\n        action.label\r\n      }}</x-link>\r\n    }\r\n  </span>\r\n  @if (tree.multiple() && activated()) {\r\n    <x-icon class=\"x-tree-node-checked\" type=\"fto-check\"></x-icon>\r\n  }\r\n</div>\r\n", styles: ["x-tree-node{display:block}.x-tree-node{display:block}.x-tree-node{margin:0;padding:0}.x-tree-node-content{position:relative;display:flex;border-radius:var(--x-border-radius);margin:.125rem 0;padding-right:.5rem;line-height:var(--x-height-small);cursor:pointer}.x-tree-node-content .x-tree-node-icon,.x-tree-node-content .x-tree-node-right x-icon{padding:.25rem;font-size:1.25rem;transition:var(--x-animation-duration-base)}.x-tree-node-content .x-tree-node-icon:hover,.x-tree-node-content .x-tree-node-right x-icon:hover{color:var(--x-text-200)}.x-tree-node-content .x-tree-node-checkbox{margin-right:.325rem;padding:.25rem 0}.x-tree-node-content.x-disabled{color:var(--x-text-400)}.x-tree-node-content:not(.x-disabled):hover{background-color:var(--x-background-a200)}.x-tree-node-content:not(.x-disabled):hover .x-tree-node-operations{display:flex;align-items:center}.x-tree-node-content:not(.x-disabled).x-activated{background-color:var(--x-primary-900);color:var(--x-primary)}.x-tree-node-content:not(.x-disabled).x-tree-node-checked{color:var(--x-primary)}.x-tree-node x-icon.x-tree-node-loading{padding:.2rem;font-size:1.25rem;color:var(--x-text-300)}.x-tree-node-right{display:flex;align-items:center;justify-content:center;margin-right:.125rem}.x-tree-node-right.is-leaf{visibility:hidden}.x-tree-node-right.is-open:not(.is-template) x-icon{transform:rotate(90deg)}.x-tree-node-line{position:absolute;left:.5rem;height:calc(100% + .25rem);display:flex;align-items:center;justify-content:space-between}.x-tree-node-line-vertical{position:absolute;height:100%;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-tree-node-line-horizontal{position:absolute;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-tree-node-last .x-tree-node-line-vertical.is-last{height:50%;top:0}.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}.x-tree-node-drag-indicator{position:absolute;height:.0625rem;border-radius:var(--x-border-radius);background-color:var(--x-primary);right:0;z-index:1}.x-tree-node-drag-indicator:before{position:absolute;top:-.125rem;left:-.2625rem;width:.325rem;height:.325rem;background-color:transparent;border-color:var(--x-primary);border-style:solid;border-width:.0625rem .0625rem 0 0;content:\" \";transform:rotate(45deg)}body>x-tree-node{display:block}body>x-tree-node.cdk-drag-preview .x-tree-node-content{position:relative;display:flex;border-radius:var(--x-border-radius);margin:.125rem 0;padding-right:.5rem;line-height:var(--x-height-small);cursor:pointer}body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-icon,body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-right x-icon{padding:.25rem;font-size:1.25rem;transition:var(--x-animation-duration-base)}body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-icon:hover,body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-right x-icon:hover{color:var(--x-text-200)}body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-checkbox{margin-right:.325rem;padding:.25rem 0}body>x-tree-node.cdk-drag-preview .x-tree-node-content.x-disabled{color:var(--x-text-400)}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled):hover{background-color:var(--x-background-a200)}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled):hover .x-tree-node-operations{display:flex;align-items:center}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled).x-activated{background-color:var(--x-primary-900);color:var(--x-primary)}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled).x-tree-node-checked{color:var(--x-primary)}body>x-tree-node.cdk-drag-preview .x-tree-node x-icon.x-tree-node-loading{padding:.2rem;font-size:1.25rem;color:var(--x-text-300)}body>x-tree-node.cdk-drag-preview .x-tree-node-right{display:flex;align-items:center;justify-content:center;margin-right:.125rem}body>x-tree-node.cdk-drag-preview .x-tree-node-right.is-leaf{visibility:hidden}body>x-tree-node.cdk-drag-preview .x-tree-node-right.is-open:not(.is-template) x-icon{transform:rotate(90deg)}body>x-tree-node.cdk-drag-preview .x-tree-node-line{position:absolute;left:.5rem;height:calc(100% + .25rem);display:flex;align-items:center;justify-content:space-between}body>x-tree-node.cdk-drag-preview .x-tree-node-line-vertical{position:absolute;height:100%;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}body>x-tree-node.cdk-drag-preview .x-tree-node-line-horizontal{position:absolute;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}body>x-tree-node.cdk-drag-preview .x-tree-node-last .x-tree-node-line-vertical.is-last{height:50%;top:0}body>x-tree-node.cdk-drag-preview .x-tree-node-operations{display:none}body>x-tree-node.cdk-drag-preview .x-tree-node-operations .x-link{padding:0 .125rem}body>x-tree-node.cdk-drag-preview .x-tree-node-label{flex:1;-webkit-user-select:none;user-select:none}body>x-tree-node.cdk-drag-preview .x-tree-node-label.nowrap{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}body>x-tree-node.cdk-drag-preview .x-tree-node-drag-indicator{position:absolute;height:.0625rem;border-radius:var(--x-border-radius);background-color:var(--x-primary);right:0;z-index:1}body>x-tree-node.cdk-drag-preview .x-tree-node-drag-indicator:before{position:absolute;top:-.125rem;left:-.2625rem;width:.325rem;height:.325rem;background-color:transparent;border-color:var(--x-primary);border-style:solid;border-width:.0625rem .0625rem 0 0;content:\" \";transform:rotate(45deg)}body>x-tree-node.cdk-drag-preview .x-tree-node-content{border-color:var(--x-border);color:var(--x-text-400);background-color:var(--x-background-a100);opacity:.5}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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: XIconComponent, selector: "x-icon" }, { kind: "component", type: XCheckboxComponent, selector: "x-checkbox" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XLinkComponent, selector: "x-link" }, { kind: "directive", type: XKeywordDirective, selector: "[x-keyword]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeNodeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTreeNodePrefix}, [${XTreeNodePrefix}]`, imports: [
-                        NgStyle,
-                        FormsModule,
-                        XIconComponent,
-                        XCheckboxComponent,
-                        XOutletDirective,
-                        XLinkComponent,
-                        XKeywordDirective
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"x-tree-node-content\"\r\n  [class.x-activated]=\"activated()\"\r\n  [class.x-disabled]=\"disabled()\"\r\n  [class.x-tree-node-sub]=\"!leaf()\"\r\n  [class.x-tree-node-last]=\"isChildrenLast()\"\r\n  [style.padding-left.px]=\"paddingLeft() + fontSize() / 2\"\r\n  [style.height]=\"height() ? height() : nodeHeight() ? nodeHeight() : ''\"\r\n  [style.align-items]=\"alignItems() ? alignItems() : nodeAlignItems()\"\r\n  (click)=\"!disabled() && onActivate($event, node())\"\r\n>\r\n  @if (tree.showLine() && level()! > 0) {\r\n    <div class=\"x-tree-node-line\" [style.width.px]=\"paddingLeft()\">\r\n      @for (i of verticalLevel(); track i) {\r\n        <div\r\n          class=\"x-tree-node-line-vertical\"\r\n          [hidden]=\"isParentLast()[i - 1]\"\r\n          [class.is-last]=\"i === verticalLevel().length\"\r\n          [style.left.px]=\"getVerticalLeft(i)\"\r\n        ></div>\r\n      }\r\n      <div\r\n        class=\"x-tree-node-line-horizontal\"\r\n        [style.width.px]=\"verticalWidth()\"\r\n        [style.left.px]=\"getVerticalLeft(verticalLevel().length)\"\r\n      ></div>\r\n    </div>\r\n  }\r\n  @if (showDragIndicator()) {\r\n    <div class=\"x-tree-node-drag-indicator\" [style.width]=\"indicatorWidth()\" [ngStyle]=\"indicatorStyle()\"></div>\r\n  }\r\n  @if (loading()) {\r\n    <x-icon class=\"x-tree-node-loading\" type=\"fto-loader\" [spin]=\"loading()!\"></x-icon>\r\n  } @else {\r\n    <div\r\n      class=\"x-tree-node-right\"\r\n      [class.is-leaf]=\"leaf()\"\r\n      [class.is-open]=\"open()\"\r\n      [class.is-template]=\"tree.expandedIcon()\"\r\n      [style.width.px]=\"verticalWidth() * 2\"\r\n      (click)=\"!tree.nodeOpen() && onToggle($event, node())\"\r\n    >\r\n      @if (!leaf()) {\r\n        @if (tree.expandedIcon()) {\r\n          <ng-container *xOutlet=\"tree.expandedIcon(); context: { $node: node() }\"></ng-container>\r\n        } @else {\r\n          <x-icon class=\"x-tree-node-icon\" type=\"fto-chevron-right\"></x-icon>\r\n        }\r\n      }\r\n    </div>\r\n  }\r\n  @if (tree.checkbox()) {\r\n    <x-checkbox\r\n      class=\"x-tree-node-checkbox\"\r\n      [data]=\"[{ label: '', id: id() }]\"\r\n      [(ngModel)]=\"checked\"\r\n      (ngModelChange)=\"onCheckboxChange()\"\r\n      [indeterminate]=\"indeterminate()!\"\r\n      [disabled]=\"disabled()!\"\r\n      (click)=\"$event.stopPropagation()\"\r\n      single\r\n    ></x-checkbox>\r\n  }\r\n  @if (!tree.labelTpl()) {\r\n    <span\r\n      class=\"x-tree-node-label\"\r\n      [class.nowrap]=\"nowrap() === false || nowrap() === true ? nowrap() : nodeNowrap()\"\r\n      [title]=\"label()\"\r\n      x-keyword\r\n      [text]=\"tree.keywordText()\"\r\n      [caseSensitive]=\"tree.caseSensitive()\"\r\n      >{{ label() }}</span\r\n    >\r\n  } @else {\r\n    <ng-container *xOutlet=\"tree.labelTpl(); context: { $node: node() }\"></ng-container>\r\n  }\r\n  <span class=\"x-tree-node-operations\">\r\n    @for (action of actions(); track action.id) {\r\n      <x-link [icon]=\"action.icon\" [title]=\"action.label\" (click)=\"onAction($event, action, node())\">{{\r\n        action.label\r\n      }}</x-link>\r\n    }\r\n  </span>\r\n  @if (tree.multiple() && activated()) {\r\n    <x-icon class=\"x-tree-node-checked\" type=\"fto-check\"></x-icon>\r\n  }\r\n</div>\r\n", styles: ["x-tree-node{display:block}.x-tree-node{display:block}.x-tree-node{margin:0;padding:0}.x-tree-node-content{position:relative;display:flex;border-radius:var(--x-border-radius);margin:.125rem 0;padding-right:.5rem;line-height:var(--x-height-small);cursor:pointer}.x-tree-node-content .x-tree-node-icon,.x-tree-node-content .x-tree-node-right x-icon{padding:.25rem;font-size:1.25rem;transition:var(--x-animation-duration-base)}.x-tree-node-content .x-tree-node-icon:hover,.x-tree-node-content .x-tree-node-right x-icon:hover{color:var(--x-text-200)}.x-tree-node-content .x-tree-node-checkbox{margin-right:.325rem;padding:.25rem 0}.x-tree-node-content.x-disabled{color:var(--x-text-400)}.x-tree-node-content:not(.x-disabled):hover{background-color:var(--x-background-a200)}.x-tree-node-content:not(.x-disabled):hover .x-tree-node-operations{display:flex;align-items:center}.x-tree-node-content:not(.x-disabled).x-activated{background-color:var(--x-primary-900);color:var(--x-primary)}.x-tree-node-content:not(.x-disabled).x-tree-node-checked{color:var(--x-primary)}.x-tree-node x-icon.x-tree-node-loading{padding:.2rem;font-size:1.25rem;color:var(--x-text-300)}.x-tree-node-right{display:flex;align-items:center;justify-content:center;margin-right:.125rem}.x-tree-node-right.is-leaf{visibility:hidden}.x-tree-node-right.is-open:not(.is-template) x-icon{transform:rotate(90deg)}.x-tree-node-line{position:absolute;left:.5rem;height:calc(100% + .25rem);display:flex;align-items:center;justify-content:space-between}.x-tree-node-line-vertical{position:absolute;height:100%;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-tree-node-line-horizontal{position:absolute;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-tree-node-last .x-tree-node-line-vertical.is-last{height:50%;top:0}.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}.x-tree-node-drag-indicator{position:absolute;height:.0625rem;border-radius:var(--x-border-radius);background-color:var(--x-primary);right:0;z-index:1}.x-tree-node-drag-indicator:before{position:absolute;top:-.125rem;left:-.2625rem;width:.325rem;height:.325rem;background-color:transparent;border-color:var(--x-primary);border-style:solid;border-width:.0625rem .0625rem 0 0;content:\" \";transform:rotate(45deg)}body>x-tree-node{display:block}body>x-tree-node.cdk-drag-preview .x-tree-node-content{position:relative;display:flex;border-radius:var(--x-border-radius);margin:.125rem 0;padding-right:.5rem;line-height:var(--x-height-small);cursor:pointer}body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-icon,body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-right x-icon{padding:.25rem;font-size:1.25rem;transition:var(--x-animation-duration-base)}body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-icon:hover,body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-right x-icon:hover{color:var(--x-text-200)}body>x-tree-node.cdk-drag-preview .x-tree-node-content .x-tree-node-checkbox{margin-right:.325rem;padding:.25rem 0}body>x-tree-node.cdk-drag-preview .x-tree-node-content.x-disabled{color:var(--x-text-400)}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled):hover{background-color:var(--x-background-a200)}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled):hover .x-tree-node-operations{display:flex;align-items:center}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled).x-activated{background-color:var(--x-primary-900);color:var(--x-primary)}body>x-tree-node.cdk-drag-preview .x-tree-node-content:not(.x-disabled).x-tree-node-checked{color:var(--x-primary)}body>x-tree-node.cdk-drag-preview .x-tree-node x-icon.x-tree-node-loading{padding:.2rem;font-size:1.25rem;color:var(--x-text-300)}body>x-tree-node.cdk-drag-preview .x-tree-node-right{display:flex;align-items:center;justify-content:center;margin-right:.125rem}body>x-tree-node.cdk-drag-preview .x-tree-node-right.is-leaf{visibility:hidden}body>x-tree-node.cdk-drag-preview .x-tree-node-right.is-open:not(.is-template) x-icon{transform:rotate(90deg)}body>x-tree-node.cdk-drag-preview .x-tree-node-line{position:absolute;left:.5rem;height:calc(100% + .25rem);display:flex;align-items:center;justify-content:space-between}body>x-tree-node.cdk-drag-preview .x-tree-node-line-vertical{position:absolute;height:100%;border-right:var(--x-border-width) var(--x-border-style) var(--x-border)}body>x-tree-node.cdk-drag-preview .x-tree-node-line-horizontal{position:absolute;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}body>x-tree-node.cdk-drag-preview .x-tree-node-last .x-tree-node-line-vertical.is-last{height:50%;top:0}body>x-tree-node.cdk-drag-preview .x-tree-node-operations{display:none}body>x-tree-node.cdk-drag-preview .x-tree-node-operations .x-link{padding:0 .125rem}body>x-tree-node.cdk-drag-preview .x-tree-node-label{flex:1;-webkit-user-select:none;user-select:none}body>x-tree-node.cdk-drag-preview .x-tree-node-label.nowrap{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}body>x-tree-node.cdk-drag-preview .x-tree-node-drag-indicator{position:absolute;height:.0625rem;border-radius:var(--x-border-radius);background-color:var(--x-primary);right:0;z-index:1}body>x-tree-node.cdk-drag-preview .x-tree-node-drag-indicator:before{position:absolute;top:-.125rem;left:-.2625rem;width:.325rem;height:.325rem;background-color:transparent;border-color:var(--x-primary);border-style:solid;border-width:.0625rem .0625rem 0 0;content:\" \";transform:rotate(45deg)}body>x-tree-node.cdk-drag-preview .x-tree-node-content{border-color:var(--x-border);color:var(--x-text-400);background-color:var(--x-background-a100);opacity:.5}\n"] }]
-        }], propDecorators: { nodeMouseenter: [{ type: i0.Output, args: ["nodeMouseenter"] }], rootClass: [{
-                type: HostBinding,
-                args: ['class.x-tree-node']
-            }], onMouseenter: [{
-                type: HostListener,
-                args: ['mouseenter', ['$event']]
-            }], onMouseleave: [{
-                type: HostListener,
-                args: ['mouseleave', ['$event']]
-            }] } });
-
-class XTreeComponent extends XTreeProperty {
-    constructor(renderer, elementRef, cdr, treeService) {
-        super();
-        this.renderer = renderer;
-        this.elementRef = elementRef;
-        this.cdr = cdr;
-        this.treeService = treeService;
-        this.tree = viewChild('tree', ...(ngDevMode ? [{ debugName: "tree", read: (ElementRef) }] : [{ read: (ElementRef) }]));
-        this.virtualBody = viewChild('virtualBody', ...(ngDevMode ? [{ debugName: "virtualBody", read: CdkVirtualScrollViewport }] : [{ read: CdkVirtualScrollViewport }]));
-        this.dropList = viewChild('dropList', ...(ngDevMode ? [{ debugName: "dropList", read: (CdkDropList) }] : [{ read: (CdkDropList) }]));
-        this.nodeComponents = viewChildren(XTreeNodeComponent, ...(ngDevMode ? [{ debugName: "nodeComponents" }] : []));
-        this.document = inject(DOCUMENT);
-        this.fontSize = computed(() => parseFloat(XComputedStyle(this.document.documentElement, 'font-size')), ...(ngDevMode ? [{ debugName: "fontSize" }] : []));
-        this.nodes = signal([], ...(ngDevMode ? [{ debugName: "nodes" }] : []));
-        this.virtualNodes = signal([], ...(ngDevMode ? [{ debugName: "virtualNodes" }] : []));
-        this.activatedNode = signal(null, ...(ngDevMode ? [{ debugName: "activatedNode" }] : []));
-        this.dataIsFunc = signal(false, ...(ngDevMode ? [{ debugName: "dataIsFunc" }] : []));
-        this.getting = signal(false, ...(ngDevMode ? [{ debugName: "getting" }] : []));
-        this.treeData = signal([], ...(ngDevMode ? [{ debugName: "treeData" }] : []));
-        this.dragging = signal(false, ...(ngDevMode ? [{ debugName: "dragging" }] : []));
-        this.dragPosition = signal(-1, ...(ngDevMode ? [{ debugName: "dragPosition" }] : []));
-        this.hoverTreeNode = signal(null, ...(ngDevMode ? [{ debugName: "hoverTreeNode" }] : []));
-        this.draggingTreeNode = signal(null, ...(ngDevMode ? [{ debugName: "draggingTreeNode" }] : []));
-        this.isEmpty = computed(() => XIsEmpty(this.nodes()), ...(ngDevMode ? [{ debugName: "isEmpty" }] : []));
-        this.hasChecked = signal(false, ...(ngDevMode ? [{ debugName: "hasChecked" }] : []));
-        this.unSubject = new Subject();
-        this.heightAdaptionSignal = signal(0, ...(ngDevMode ? [{ debugName: "heightAdaptionSignal" }] : []));
-        this.isVirtualScrollAdaption = computed(() => {
-            return !!(this.virtualScroll() && this.heightAdaption());
-        }, ...(ngDevMode ? [{ debugName: "isVirtualScrollAdaption" }] : []));
-        this.virtualScrollHeightSignal = computed(() => {
-            if (this.isVirtualScrollAdaption()) {
-                return this.heightAdaptionSignal();
-            }
-            else {
-                return XToCssPx(this.virtualScrollHeight(), this.fontSize());
-            }
-        }, ...(ngDevMode ? [{ debugName: "virtualScrollHeightSignal" }] : []));
-        this.minBufferPxSignal = computed(() => {
-            if (this.isVirtualScrollAdaption()) {
-                return this.virtualScrollHeightSignal();
-            }
-            else {
-                return this.minBufferPx();
-            }
-        }, ...(ngDevMode ? [{ debugName: "minBufferPxSignal" }] : []));
-        this.maxBufferPxSignal = computed(() => {
-            if (this.isVirtualScrollAdaption()) {
-                return this.virtualScrollHeightSignal() * 1.2;
-            }
-            else {
-                return this.maxBufferPx();
-            }
-        }, ...(ngDevMode ? [{ debugName: "maxBufferPxSignal" }] : []));
-        effect(() => {
-            const virtualBody = this.virtualBody();
-            if (virtualBody) {
-                virtualBody['_scrollStrategy']['_minBufferPx'] = this.minBufferPxSignal();
-                virtualBody['_scrollStrategy']['_maxBufferPx'] = this.maxBufferPxSignal();
-            }
-        });
-    }
-    ngOnChanges(changes) {
-        const { expandedAll, data, checked, manual, expanded } = changes;
-        XIsChange(data) && this.setData();
-        XIsChange(expandedAll) && this.setExpandedAll();
-        XIsChange(expanded) && this.setChangeExpanded();
-        XIsChange(checked) && this.setCheckedKeys(this.checked());
-        XIsChange(manual) && this.setManual();
-    }
-    ngAfterViewInit() {
-        if (this.isVirtualScrollAdaption()) {
-            this.heightAdaptionSignal.set(this.heightAdaption().clientHeight);
-            XResize(this.heightAdaption())
-                .pipe(debounceTime(30), map(({ resizeObserver }) => {
-                this.resizeObserver = resizeObserver;
-                this.heightAdaptionSignal.set(this.heightAdaption().clientHeight);
-            }))
-                .subscribe();
-        }
-        this.setActivatedNode(this.treeData());
-        this.setScrollTop();
-    }
-    ngOnDestroy() {
-        this.unSubject.next();
-        this.unSubject.complete();
-        this.resizeObserver?.disconnect();
-    }
-    setData() {
-        if (typeof this.data() === 'undefined')
-            return;
-        this.dataIsFunc.set(false);
-        if (XIsFunction(this.data())) {
-            this.dataIsFunc.set(true);
-            this.getDataByFunc();
-        }
-        else {
-            XSetData(this.data(), this.unSubject).subscribe((x) => {
-                this.setDataChange(x);
-            });
-        }
-    }
-    cdkDragStarted(event) {
-        this.dragging.set(true);
-        this.draggingTreeNode.set(event.source.data);
-        if (event.source.data.open) {
-            this.onToggle(event.event, event.source.data);
-        }
-        this.nodeDragStarted.emit({ event, from: this.draggingTreeNode() });
-    }
-    cdkDragEnded(event) {
-        this.dragging.set(false);
-        const hoverTreeNode = this.hoverTreeNode();
-        if (hoverTreeNode) {
-            if (hoverTreeNode.id !== event.source.data.id) {
-                this.insertNode(event.source.data, hoverTreeNode, this.dragPosition());
-            }
-            hoverTreeNode.change && hoverTreeNode.change();
-            this.nodeDragEnded.emit({
-                event,
-                from: event.source.data,
-                to: hoverTreeNode,
-                position: this.dragPosition()
-            });
-        }
-    }
-    insertNode(dragNode, hoverNode, dragPosition) {
-        let parent = this.nodes().find((x) => x.id === dragNode.pid);
-        this.treeService.moveNode(this.treeData(), dragNode, hoverNode, dragPosition);
-        this.setDataChange(this.treeData(), true, false, true, parent);
-    }
-    cdkDragMoved(event) {
-        const hoverTreeNode = this.hoverTreeNode();
-        if (!this.dragging() || !hoverTreeNode)
-            return;
-        const y = event.pointerPosition.y;
-        if (event.source.data.id === hoverTreeNode.id)
-            return;
-        const target = this.hoverTreeEle.nativeElement;
-        const { top, height } = target.getBoundingClientRect();
-        const des = Math.max(height * 0.5, 2);
-        if (y > top && y < top + des - 2) {
-            this.dragPosition.set(-1);
-        }
-        else if (y > top + des + 2 && y < top + height) {
-            this.dragPosition.set(1);
-        }
-        else if (y >= top + des - 2 && y <= top + des + 2) {
-            this.dragPosition.set(0);
-        }
-        hoverTreeNode.change && hoverTreeNode.change();
-        this.nodeDragMoved.emit({
-            event,
-            from: this.draggingTreeNode(),
-            to: hoverTreeNode,
-            position: this.dragPosition()
-        });
-    }
-    predicate(_drag, _drop) {
-        return true;
-    }
-    setManual() {
-        if (this.dataIsFunc())
-            this.getDataByFunc();
-    }
-    getDataByFunc() {
-        if (!this.manual())
-            return;
-        XSetData(this.data()(), this.unSubject).subscribe((x) => {
-            this.setDataChange(x);
-        });
-    }
-    setDataChange(value, regetChildren = false, init = true, parentOpen = true, lazyParant, out = false) {
-        if (XIsEmpty(this.checked()) || !this.hasChecked())
-            this.checked.set([]);
-        const getChildren = (node, level) => {
-            if (init) {
-                const open = this.expandedAll() || level <= this.expandedLevel() || this.expanded().includes(node.id);
-                node.level = level;
-                node.open = out ? open : open || node.open;
-                node.checked = this.checked().includes(node.id) || node.checked;
-                node.childrenLoaded = node.open;
-            }
-            if (XIsUndefined(node.children) || regetChildren) {
-                node.children = XOrderBy(value.filter((y) => y.pid === node.id), this.order().map((x) => x.property), this.order().map((x) => x.order));
-                if (this.levelCheck() && node.children && node.checked) {
-                    for (let nd of node.children) {
-                        nd.checked = true;
-                        this.checked.update((x) => {
-                            x.push(nd.id);
-                            return [...x];
-                        });
-                    }
-                }
-            }
-            if ((!this.lazy() && (XIsUndefined(node.leaf) || regetChildren)) || node.id === lazyParant?.id) {
-                node.leaf = node.children?.length === 0;
-            }
-            if (!node.leaf)
-                node.children?.map((y) => getChildren(y, level + 1));
-            return node;
-        };
-        this.treeData.set(value);
-        this.nodes.set(XOrderBy(value.filter((x) => XIsEmpty(x.pid)), this.order().map((x) => x.property), this.order().map((x) => x.order)).map((x) => getChildren(x, 0)));
-        if (parentOpen) {
-            for (let item of value) {
-                if (!item.leaf && item.open) {
-                    this.setParentOpen(value, item);
-                }
-            }
-        }
-        this.setExpanded();
-        this.cdr.markForCheck();
-    }
-    nodeMouseenter($event) {
-        const { node, ele } = $event;
-        if (!this.dragging())
-            return;
-        let before = this.hoverTreeNode();
-        this.hoverTreeNode.set(node);
-        this.hoverTreeEle = ele;
-        const hoverTreeNode = this.hoverTreeNode();
-        if (hoverTreeNode) {
-            hoverTreeNode.change && hoverTreeNode.change();
-        }
-        if (before) {
-            before.change && before.change();
-        }
-        if (!node.leaf && !node.open) {
-            let from = this.nodes().indexOf(this.draggingTreeNode());
-            let to = this.nodes().indexOf(node);
-            if (to - from !== -1) {
-                this.onToggle(null, node);
-            }
-        }
-    }
-    setScrollTop() {
-        const scrollElement = this.scrollElement();
-        if (!scrollElement || !this.activatedNode())
-            return;
-        const inx = this.nodes().indexOf(this.activatedNode());
-        let com = this.nodeComponents().find((_, index) => index === inx);
-        if (!com)
-            return;
-        let ele = com.elementRef.nativeElement;
-        let scrollEle = scrollElement;
-        let min = scrollEle.scrollTop;
-        let max = scrollEle.scrollTop + scrollEle.clientHeight;
-        if (ele.offsetTop + ele.clientHeight > max) {
-            let scrollTop = ele.offsetTop + ele.clientHeight - scrollEle.clientHeight;
-            scrollEle.scrollTop = scrollTop;
-        }
-        if (ele.offsetTop < min) {
-            scrollEle.scrollTop = ele.offsetTop;
-        }
-    }
-    getCheckedNodes() {
-        let result = [];
-        const getChildren = (nodes) => {
-            if (XIsEmpty(nodes))
-                return;
-            nodes.forEach((x) => {
-                if (x.checked && !result.includes(x)) {
-                    result = [...result, x];
-                }
-                getChildren(x.children);
-            });
-        };
-        getChildren(this.nodes());
-        return result;
-    }
-    getCheckedKeys() {
-        return this.getCheckedNodes().map((x) => x.id);
-    }
-    setCheckedKeys(keys = []) {
-        if (!XIsEmpty(keys))
-            this.hasChecked.set(true);
-        const setChildren = (nodes, clear = false) => {
-            if (XIsEmpty(nodes))
-                return;
-            nodes.forEach((x) => {
-                x.checked = !clear && keys.includes(x.id);
-                x.change && x.change(true);
-                setChildren(x.children, clear);
-            });
-        };
-        setChildren(this.nodes(), XIsEmpty(keys));
-        this.cdr.markForCheck();
-    }
-    setExpandedAll() {
-        if (this.expandedAll() && this.treeData().length === this.nodes().length)
-            return;
-        const updateNodeStates = (nodes) => {
-            nodes.forEach((node) => {
-                node.open = this.expandedAll();
-                node.change && node.change();
-                if (node.children) {
-                    updateNodeStates(node.children);
-                }
-            });
-        };
-        updateNodeStates(this.treeData());
-        if (this.expandedAll() === false) {
-            this.nodes.set(XOrderBy(this.treeData().filter((x) => XIsEmpty(x.pid)), this.order().map((x) => x.property), this.order().map((x) => x.order)));
-        }
-        else {
-            const allExpandedNodes = [];
-            const traverse = (nodes) => {
-                for (const node of nodes) {
-                    allExpandedNodes.push(node);
-                    if (node.children && node.children.length > 0) {
-                        traverse(node.children);
-                    }
-                }
-            };
-            const rootNodes = XOrderBy(this.treeData().filter((x) => XIsEmpty(x.pid)), this.order().map((x) => x.property), this.order().map((x) => x.order));
-            traverse(rootNodes);
-            this.nodes.set(allExpandedNodes);
-            this.virtualNodes.set([...allExpandedNodes]);
-        }
-        this.virtualBody()?.checkViewportSize();
-    }
-    setExpanded() {
-        for (let i = 0; i < this.nodes().length; i++) {
-            let item = this.nodes()[i];
-            if (item.open && item.children && item.children.length > 0) {
-                let index = this.nodes().indexOf(item);
-                this.nodes.update((x) => {
-                    x.splice(index + 1, 0, ...item.children);
-                    return [...x];
-                });
-            }
-            item.change && item.change();
-        }
-    }
-    setChangeExpanded() {
-        this.setDataChange(this.treeData(), true, true, false, undefined, true);
-    }
-    setVirtualExpandedAll(item, expandedAll) {
-        let index = this.nodes().indexOf(item);
-        if (expandedAll) {
-            let addNodes = [];
-            const getNodes = (nd) => {
-                for (let child of nd.children) {
-                    addNodes.push(child);
-                    getNodes(child);
-                }
-            };
-            getNodes(item);
-            this.nodes.update((x) => {
-                x.splice(index + 1, 0, ...addNodes);
-                return [...x];
-            });
-        }
-    }
-    virtualToggle(node) {
-        let index = this.nodes().indexOf(node);
-        if (node.open) {
-            let addNodes = [];
-            const getNodes = (nd) => {
-                if (XIsEmpty(nd.children))
-                    return;
-                for (let child of nd.children) {
-                    addNodes.push(child);
-                    child.open && getNodes(child);
-                }
-            };
-            getNodes(node);
-            this.nodes.update((x) => {
-                x.splice(index + 1, 0, ...addNodes);
-                return [...x];
-            });
-        }
-        else {
-            let delCount = 0;
-            const getCount = (nd) => {
-                if (XIsEmpty(nd.children))
-                    return;
-                delCount += nd.children.length;
-                for (let child of nd.children) {
-                    child.open && getCount(child);
-                }
-            };
-            getCount(node);
-            this.nodes.update((x) => {
-                x.splice(index + 1, delCount);
-                return [...x];
-            });
-        }
-        this.addOrRemoveExpanded(node);
-        this.virtualBody()?.checkViewportSize();
-        this.cdr.detectChanges();
-    }
-    addOrRemoveExpanded(node) {
-        if (node.open) {
-            if (!this.expanded().includes(node.id)) {
-                this.expanded.update((x) => {
-                    x.push(node.id);
-                    return [...x];
-                });
-            }
-        }
-        else {
-            if (this.expanded().includes(node.id)) {
-                this.expanded.update((x) => {
-                    x.splice(x.indexOf(node.id), 1);
-                    return [...x];
-                });
-            }
-        }
-    }
-    setActivatedNode(nodes, parentOpen = true, dataChange = true) {
-        if (XIsEmpty(this.activatedId()) && this.multiple()) {
-            this.activatedId.set([]);
-        }
-        let before = this.activatedNode();
-        if (this.multiple()) {
-            if (this.activatedId().length > 0) {
-                let ids = this.objectArray() ? this.activatedId().map((x) => x.id) : this.activatedId();
-                for (let i = 0; i < ids.length; i++) {
-                    let node = nodes.find((x) => x.id === ids[i]);
-                    if (node) {
-                        parentOpen && this.setParentOpen(nodes, node);
-                        if (i === ids.length - 1) {
-                            this.activatedNode.set(node);
-                            this.activatedChange.emit(this.activatedNode());
-                        }
-                    }
-                }
-            }
-        }
-        else {
-            let activatedId = this.activatedId();
-            this.activatedNode.set(nodes.find((x) => x.id === activatedId));
-            if (this.activatedNode()) {
-                parentOpen && this.setParentOpen(nodes, this.activatedNode());
-                this.activatedChange.emit(this.activatedNode());
-            }
-        }
-        if (before) {
-            before.change && before.change();
-        }
-        if (!XIsEmpty(nodes) && dataChange) {
-            this.setDataChange(nodes, false, true, parentOpen);
-        }
-    }
-    setParentOpen(nodes, node) {
-        const getParent = (child) => {
-            if (XIsEmpty(child.pid))
-                return;
-            const parent = nodes.find((x) => x.id === child.pid);
-            if (!XIsEmpty(parent)) {
-                if (!this.expanded().includes(parent.id)) {
-                    this.expanded.update((x) => [...x, parent.id]);
-                }
-                parent.open = true;
-                parent.change && parent.change();
-                getParent(parent);
-            }
-        };
-        getParent(node);
-    }
-    onToggle(event, node) {
-        node.open = !node.open;
-        if (this.lazy() && !node.childrenLoaded) {
-            this.getLazyData(node, () => this.virtualToggle(node));
-        }
-        else {
-            this.virtualToggle(node);
-        }
-        event?.preventDefault();
-        event?.stopPropagation();
-    }
-    getLazyData(node, callBack) {
-        node.loading = true;
-        node.change && node.change();
-        this.data()(node.id)
-            .pipe(map((x) => x.map((y) => {
-            y.level = node.level + 1;
-            y.checked = node.checked;
-            return y;
-        })))
-            .subscribe((x) => {
-            node.children = x;
-            node.childrenLoaded = true;
-            node.loading = false;
-            this.treeData.set([...this.treeData(), ...x]);
-            if (callBack)
-                callBack();
-            node.change && node.change();
-            this.cdr.markForCheck();
-        });
-    }
-    addNode(node) {
-        let parent = this.treeData().find((x) => x.id === node.pid);
-        const _addNode = () => {
-            if (parent) {
-                node.level = parent.level + 1;
-                node.pid = parent.id;
-                node.leaf = true;
-                parent.leaf = false;
-                parent.open = true;
-                this.treeData.set([...this.treeData(), node]);
-                this.setParentOpen(this.treeData(), node);
-                this.setDataChange(this.treeData(), true, false, false);
-                this.setActivatedId(node);
-                this.setActivatedNode(this.nodes(), true, false);
-                node.change && node.change();
-            }
-            else if (XIsEmpty(node.pid)) {
-                node.level = 0;
-                node.leaf = true;
-                this.treeData.set([...this.treeData(), node]);
-                this.setParentOpen(this.treeData(), node);
-                this.setDataChange(this.treeData(), true, false, false);
-                this.setActivatedId(node);
-                this.setActivatedNode(this.nodes(), true, false);
-                node.change && node.change();
-            }
-        };
-        if (this.lazy() && parent && !parent.childrenLoaded) {
-            this.getLazyData(parent, () => {
-                _addNode();
-            });
-        }
-        else {
-            _addNode();
-        }
-    }
-    setActivatedId(node) {
-        if (this.multiple()) {
-            if (this.objectArray()) {
-                this.activatedId.set([node]);
-            }
-            else {
-                this.activatedId.set([node.id]);
-            }
-        }
-        else {
-            this.activatedId.set(node.id);
-        }
-    }
-    removeNode(node) {
-        let parent = this.treeData().find((x) => x.id === node.pid);
-        const removeChildren = (nd) => {
-            XRemove(this.treeData(), (x) => x.id === nd.id);
-            if (nd.children) {
-                for (let item of nd.children) {
-                    removeChildren(item);
-                }
-            }
-        };
-        removeChildren(node);
-        if (parent) {
-            if (!parent.children)
-                parent.children = [];
-            const childIndex = parent.children.findIndex((x) => x.id === node.id);
-            if (childIndex > -1) {
-                parent.children.splice(childIndex, 1);
-            }
-            parent.leaf = parent.children.length === 0;
-        }
-        this.setDataChange(this.treeData(), true, false, false);
-    }
-    updateNode(node, nowNode) {
-        Object.assign(node, nowNode);
-        this.setDataChange(this.treeData(), true, false, false);
-        this.setActivatedId(node);
-        this.setActivatedNode(this.nodes(), true, false);
-        node.change && node.change();
-    }
-    trackByItem(_index, item) {
-        return item;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: XTreeService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XTreeComponent, isStandalone: true, selector: "x-tree", providers: [
-            {
-                provide: X_TREE_CONTEXT,
-                useExisting: XTreeComponent
-            }
-        ], viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "virtualBody", first: true, predicate: ["virtualBody"], descendants: true, read: CdkVirtualScrollViewport, isSignal: true }, { propertyName: "dropList", first: true, predicate: ["dropList"], descendants: true, read: CdkDropList, isSignal: true }, { propertyName: "nodeComponents", predicate: XTreeNodeComponent, descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #tree class=\"x-tree\" [class.x-tree-only-leaf]=\"onlyLeaf()\">\r\n  @if (virtualScroll()) {\r\n    <cdk-virtual-scroll-viewport\r\n      #virtualBody\r\n      [itemSize]=\"itemSize()\"\r\n      [minBufferPx]=\"minBufferPxSignal()\"\r\n      [maxBufferPx]=\"maxBufferPxSignal()\"\r\n      [style.height.px]=\"virtualScrollHeightSignal()\"\r\n    >\r\n      <div\r\n        class=\"x-tree-content\"\r\n        #dropList\r\n        cdkDropList\r\n        [cdkDropListDisabled]=\"!drag()\"\r\n        [cdkDropListSortingDisabled]=\"true\"\r\n        [hidden]=\"isEmpty()\"\r\n        [cdkDropListData]=\"nodes()\"\r\n        [cdkDropListEnterPredicate]=\"predicate\"\r\n      >\r\n        <x-tree-node\r\n          *cdkVirtualFor=\"let node of nodes(); templateCacheSize: 0; trackBy: trackByItem\"\r\n          cdkDrag\r\n          [cdkDragDisabled]=\"node.disabled\"\r\n          (cdkDragStarted)=\"cdkDragStarted($event)\"\r\n          (cdkDragEnded)=\"cdkDragEnded($event)\"\r\n          (cdkDragMoved)=\"cdkDragMoved($event)\"\r\n          [cdkDragData]=\"node\"\r\n          (nodeMouseenter)=\"nodeMouseenter($event)\"\r\n          [node]=\"node\"\r\n          [nodeHeight]=\"nodeHeight()\"\r\n          [nodeNowrap]=\"nodeNowrap()\"\r\n          [nodeAlignItems]=\"nodeAlignItems()\"\r\n          [actions]=\"actions()\"\r\n          [(disabled)]=\"node.disabled!\"\r\n          [(id)]=\"node.id\"\r\n          [(pid)]=\"node.pid\"\r\n          [(leaf)]=\"node.leaf!\"\r\n          [(height)]=\"node.height!\"\r\n          [(alignItems)]=\"node.alignItems!\"\r\n          [(loading)]=\"node.loading!\"\r\n          [(level)]=\"node.level!\"\r\n          [(open)]=\"node.open\"\r\n          [(checked)]=\"node.checked!\"\r\n          [(indeterminate)]=\"node.indeterminate!\"\r\n          [(label)]=\"node.label!\"\r\n          [(nowrap)]=\"node.nowrap!\"\r\n          (toggle)=\"onToggle(null, $event)\"\r\n        ></x-tree-node>\r\n      </div>\r\n    </cdk-virtual-scroll-viewport>\r\n  } @else {\r\n    <div\r\n      class=\"x-tree-content\"\r\n      #dropList\r\n      cdkDropList\r\n      [cdkDropListDisabled]=\"!drag()\"\r\n      [cdkDropListSortingDisabled]=\"true\"\r\n      [hidden]=\"isEmpty()\"\r\n      [cdkDropListData]=\"nodes()\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      @for (node of nodes(); track node.id + '' + $index) {\r\n        <x-tree-node\r\n          cdkDrag\r\n          [cdkDragDisabled]=\"node.disabled\"\r\n          (cdkDragStarted)=\"cdkDragStarted($event)\"\r\n          (cdkDragEnded)=\"cdkDragEnded($event)\"\r\n          (cdkDragMoved)=\"cdkDragMoved($event)\"\r\n          [cdkDragData]=\"node\"\r\n          (nodeMouseenter)=\"nodeMouseenter($event)\"\r\n          [node]=\"node\"\r\n          [nodeHeight]=\"nodeHeight()\"\r\n          [nodeNowrap]=\"nodeNowrap()\"\r\n          [nodeAlignItems]=\"nodeAlignItems()\"\r\n          [actions]=\"actions()\"\r\n          [(disabled)]=\"node.disabled\"\r\n          [(id)]=\"node.id\"\r\n          [(pid)]=\"node.pid\"\r\n          [(leaf)]=\"node.leaf\"\r\n          [(height)]=\"node.height!\"\r\n          [(alignItems)]=\"node.alignItems\"\r\n          [(loading)]=\"node.loading\"\r\n          [(level)]=\"node.level\"\r\n          [(open)]=\"node.open\"\r\n          [(checked)]=\"node.checked\"\r\n          [(indeterminate)]=\"node.indeterminate\"\r\n          [(label)]=\"node.label\"\r\n          [(nowrap)]=\"node.nowrap\"\r\n          (toggle)=\"onToggle(null, $event)\"\r\n        ></x-tree-node>\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n\r\n<!-- \u63D0\u524D\u52A0\u8F7Dloading\u7684\u56FE\u6807-->\r\n@if (lazy()) {\r\n  <x-icon [style.display]=\"'none'\" type=\"fto-loader\"></x-icon>\r\n}\r\n", styles: [".x-tree{margin:0;padding:0}.x-tree-only-leaf .x-tree-node-sub{color:var(--x-text-300)}.x-tree-content.cdk-drop-list-dragging x-tree-node .x-tree-node-content:not(.x-disabled):not(.x-activated):hover{background-color:transparent}.x-tree-content.cdk-drop-list-dragging x-tree-node.cdk-drag-placeholder .x-tree-node-content{color:var(--x-primary);background-color:var(--x-background-a200);opacity:.8}.x-tree-content.cdk-drop-list-dragging x-tree-node:not(.cdk-drag-placeholder){transition:transform var(--x-animation-duration-base) cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: XTreeNodeComponent, selector: "x-tree-node, [x-tree-node]", outputs: ["nodeMouseenter"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTreePrefix}`, imports: [DragDropModule, ScrollingModule, XTreeNodeComponent, XIconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
-                        {
-                            provide: X_TREE_CONTEXT,
-                            useExisting: XTreeComponent
-                        }
-                    ], template: "<div #tree class=\"x-tree\" [class.x-tree-only-leaf]=\"onlyLeaf()\">\r\n  @if (virtualScroll()) {\r\n    <cdk-virtual-scroll-viewport\r\n      #virtualBody\r\n      [itemSize]=\"itemSize()\"\r\n      [minBufferPx]=\"minBufferPxSignal()\"\r\n      [maxBufferPx]=\"maxBufferPxSignal()\"\r\n      [style.height.px]=\"virtualScrollHeightSignal()\"\r\n    >\r\n      <div\r\n        class=\"x-tree-content\"\r\n        #dropList\r\n        cdkDropList\r\n        [cdkDropListDisabled]=\"!drag()\"\r\n        [cdkDropListSortingDisabled]=\"true\"\r\n        [hidden]=\"isEmpty()\"\r\n        [cdkDropListData]=\"nodes()\"\r\n        [cdkDropListEnterPredicate]=\"predicate\"\r\n      >\r\n        <x-tree-node\r\n          *cdkVirtualFor=\"let node of nodes(); templateCacheSize: 0; trackBy: trackByItem\"\r\n          cdkDrag\r\n          [cdkDragDisabled]=\"node.disabled\"\r\n          (cdkDragStarted)=\"cdkDragStarted($event)\"\r\n          (cdkDragEnded)=\"cdkDragEnded($event)\"\r\n          (cdkDragMoved)=\"cdkDragMoved($event)\"\r\n          [cdkDragData]=\"node\"\r\n          (nodeMouseenter)=\"nodeMouseenter($event)\"\r\n          [node]=\"node\"\r\n          [nodeHeight]=\"nodeHeight()\"\r\n          [nodeNowrap]=\"nodeNowrap()\"\r\n          [nodeAlignItems]=\"nodeAlignItems()\"\r\n          [actions]=\"actions()\"\r\n          [(disabled)]=\"node.disabled!\"\r\n          [(id)]=\"node.id\"\r\n          [(pid)]=\"node.pid\"\r\n          [(leaf)]=\"node.leaf!\"\r\n          [(height)]=\"node.height!\"\r\n          [(alignItems)]=\"node.alignItems!\"\r\n          [(loading)]=\"node.loading!\"\r\n          [(level)]=\"node.level!\"\r\n          [(open)]=\"node.open\"\r\n          [(checked)]=\"node.checked!\"\r\n          [(indeterminate)]=\"node.indeterminate!\"\r\n          [(label)]=\"node.label!\"\r\n          [(nowrap)]=\"node.nowrap!\"\r\n          (toggle)=\"onToggle(null, $event)\"\r\n        ></x-tree-node>\r\n      </div>\r\n    </cdk-virtual-scroll-viewport>\r\n  } @else {\r\n    <div\r\n      class=\"x-tree-content\"\r\n      #dropList\r\n      cdkDropList\r\n      [cdkDropListDisabled]=\"!drag()\"\r\n      [cdkDropListSortingDisabled]=\"true\"\r\n      [hidden]=\"isEmpty()\"\r\n      [cdkDropListData]=\"nodes()\"\r\n      [cdkDropListEnterPredicate]=\"predicate\"\r\n    >\r\n      @for (node of nodes(); track node.id + '' + $index) {\r\n        <x-tree-node\r\n          cdkDrag\r\n          [cdkDragDisabled]=\"node.disabled\"\r\n          (cdkDragStarted)=\"cdkDragStarted($event)\"\r\n          (cdkDragEnded)=\"cdkDragEnded($event)\"\r\n          (cdkDragMoved)=\"cdkDragMoved($event)\"\r\n          [cdkDragData]=\"node\"\r\n          (nodeMouseenter)=\"nodeMouseenter($event)\"\r\n          [node]=\"node\"\r\n          [nodeHeight]=\"nodeHeight()\"\r\n          [nodeNowrap]=\"nodeNowrap()\"\r\n          [nodeAlignItems]=\"nodeAlignItems()\"\r\n          [actions]=\"actions()\"\r\n          [(disabled)]=\"node.disabled\"\r\n          [(id)]=\"node.id\"\r\n          [(pid)]=\"node.pid\"\r\n          [(leaf)]=\"node.leaf\"\r\n          [(height)]=\"node.height!\"\r\n          [(alignItems)]=\"node.alignItems\"\r\n          [(loading)]=\"node.loading\"\r\n          [(level)]=\"node.level\"\r\n          [(open)]=\"node.open\"\r\n          [(checked)]=\"node.checked\"\r\n          [(indeterminate)]=\"node.indeterminate\"\r\n          [(label)]=\"node.label\"\r\n          [(nowrap)]=\"node.nowrap\"\r\n          (toggle)=\"onToggle(null, $event)\"\r\n        ></x-tree-node>\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n\r\n<!-- \u63D0\u524D\u52A0\u8F7Dloading\u7684\u56FE\u6807-->\r\n@if (lazy()) {\r\n  <x-icon [style.display]=\"'none'\" type=\"fto-loader\"></x-icon>\r\n}\r\n", styles: [".x-tree{margin:0;padding:0}.x-tree-only-leaf .x-tree-node-sub{color:var(--x-text-300)}.x-tree-content.cdk-drop-list-dragging x-tree-node .x-tree-node-content:not(.x-disabled):not(.x-activated):hover{background-color:transparent}.x-tree-content.cdk-drop-list-dragging x-tree-node.cdk-drag-placeholder .x-tree-node-content{color:var(--x-primary);background-color:var(--x-background-a200);opacity:.8}.x-tree-content.cdk-drop-list-dragging x-tree-node:not(.cdk-drag-placeholder){transition:transform var(--x-animation-duration-base) cubic-bezier(0,0,.2,1)}\n"] }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: XTreeService }], propDecorators: { tree: [{ type: i0.ViewChild, args: ['tree', { ...{ read: (ElementRef) }, isSignal: true }] }], virtualBody: [{ type: i0.ViewChild, args: ['virtualBody', { ...{ read: CdkVirtualScrollViewport }, isSignal: true }] }], dropList: [{ type: i0.ViewChild, args: ['dropList', { ...{ read: (CdkDropList) }, isSignal: true }] }], nodeComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => XTreeNodeComponent), { isSignal: true }] }] } });
-
-class XTreeModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XTreeModule, imports: [XTreeComponent, XTreeNodeComponent], exports: [XTreeComponent, XTreeNodeComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeModule, imports: [XTreeComponent, XTreeNodeComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XTreeModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [XTreeComponent, XTreeNodeComponent],
-                    imports: [XTreeComponent, XTreeNodeComponent]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { XTreeComponent, XTreeModule, XTreeNodeComponent, XTreeNodePrefix, XTreeNodeProperty, XTreePrefix, XTreeProperty, X_TREE_ORDER_DEFAULT };
-//# sourceMappingURL=ng-nest-ui-tree.mjs.map