@ibiz-template/vue3-components 0.7.37-alpha.5 → 0.7.38-alpha.12

package/es/control/tree/index.d.ts

@@ -37,6 +37,27 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
         type: BooleanConstructor;
         default: boolean;
     };
+    isSimple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    data: {
+        type: {
+            (arrayLength: number): IData[];
+            (...items: IData[]): IData[];
+            new (arrayLength: number): IData[];
+            new (...items: IData[]): IData[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => never[];
+    };
 }, {
     c: import("@ibiz-template/runtime").TreeController<import("@ibiz/model-core").IDETree, import("@ibiz-template/runtime").ITreeState, import("@ibiz-template/runtime").ITreeEvent>;
     ns: import("@ibiz-template/core").Namespace;
@@ -63,6 +84,7 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
             readonly props: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps;
             readonly data: unknown[];
             readonly draggable: boolean;
+            readonly lazy: boolean;
             readonly renderAfterExpand: boolean;
             readonly checkStrictly: boolean;
             readonly defaultExpandAll: boolean;
@@ -71,7 +93,6 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
             readonly checkDescendants: boolean;
             readonly autoExpandParent: boolean;
             readonly showCheckbox: boolean;
-            readonly lazy: boolean;
             readonly highlightCurrent: boolean;
             readonly accordion: boolean;
             readonly indent: number;
@@ -178,7 +199,7 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
             "onNode-drag-leave"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-enter"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-over"?: ((...args: any[]) => any) | undefined;
-        }, "props" | "data" | "draggable" | "renderAfterExpand" | "checkStrictly" | "defaultExpandAll" | "expandOnClickNode" | "checkOnClickNode" | "checkDescendants" | "autoExpandParent" | "showCheckbox" | "lazy" | "highlightCurrent" | "accordion" | "indent">;
+        }, "props" | "data" | "draggable" | "lazy" | "renderAfterExpand" | "checkStrictly" | "defaultExpandAll" | "expandOnClickNode" | "checkOnClickNode" | "checkDescendants" | "autoExpandParent" | "showCheckbox" | "highlightCurrent" | "accordion" | "indent">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -579,7 +600,7 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
         };
         $forceUpdate: () => void;
         $nextTick: typeof import("vue").nextTick;
-        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+        $watch<T_5 extends string | ((...args: any) => any)>(source: T_5, cb: T_5 extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
     } & Readonly<import("vue").ExtractPropTypes<{
         data: {
             type: ArrayConstructor;
@@ -995,10 +1016,33 @@ export declare const IBizTreeControl: import("@ibiz-template/vue3-util").TypeWit
         type: BooleanConstructor;
         default: boolean;
     };
+    isSimple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    data: {
+        type: {
+            (arrayLength: number): IData[];
+            (...items: IData[]): IData[];
+            new (arrayLength: number): IData[];
+            new (...items: IData[]): IData[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => never[];
+    };
 }>>, {
+    data: IData[];
     params: IParams;
     mdctrlActiveMode: number;
     singleSelect: boolean;
+    isSimple: boolean;
     loadDefault: boolean;
     checkStrictly: boolean;
     navigational: boolean;

package/es/control/tree/index.mjs

@@ -1,4 +1,4 @@
-import { ControlType, registerControlProvider } from '@ibiz-template/runtime';
+import { registerControlProvider, ControlType } from '@ibiz-template/runtime';
 import { withInstall } from '@ibiz-template/vue3-util';
 import { TreeControl } from './tree.mjs';
 import { TreeProvider } from './tree.provider.mjs';

package/es/control/tree/tree.css

@@ -1 +1 @@
-.ibiz-control-treeview{--ibiz-control-treeview-text-color:var(--ibiz-color-text-0);--ibiz-control-treeview-bg-color:transparent;--ibiz-control-treeview-disabled-color:var(--ibiz-color-disabled-text);--ibiz-control-treeview-padding:var(--ibiz-spacing-tight) 0;--ibiz-control-treeview-row-hover-color:var(--ibiz-color-text-0);--ibiz-control-treeview-row-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-treeview-row-select-color:var(--ibiz-color-text-0);--ibiz-control-treeview-row-select-bg-color:var(--ibiz-color-primary-light-default);--ibiz-control-treeview-font-size:var(--ibiz-font-size-regular);--ibiz-control-treeview-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-treeview-node-icon-height:var(--ibiz-spacing-base);--ibiz-control-treeview-node-icon-width:var(--ibiz-spacing-base);--ibiz-control-treeview-node-icon-margin-right:var(--ibiz-spacing-tight);--ibiz-control-treeview-node-height:26px;--ibiz-control-treeview-context-menu-width:30px;--ibiz-control-treeview-context-menu-padding:var(--ibiz-spacing-extra-tight) 0;--ibiz-control-treeview-context-menu-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-treeview-quick-search-padding:0 var(--ibiz-spacing-base) var(--ibiz-spacing-tight);--ibiz-control-treeview-tree-padding:0 var(--ibiz-spacing-base);height:100%;padding:var(--ibiz-control-treeview-padding)}.ibiz-control-treeview-node{display:flex;flex-grow:1;flex-shrink:1;align-items:center;min-width:1px;height:100%}.ibiz-control-treeview-node__icon{display:flex;align-items:center;width:var(--ibiz-control-treeview-node-icon-width);height:var(--ibiz-control-treeview-node-icon-height);margin-right:var(--ibiz-control-treeview-node-icon-margin-right)}.ibiz-control-treeview-node__icon>svg{width:100%;height:100%}.ibiz-control-treeview-node__label{flex-grow:1;flex-shrink:1;min-width:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-treeview-node:hover .ibiz-control-treeview-context-menu-trigger{display:inline-block}.ibiz-control-treeview-node--disabled{color:var(--ibiz-control-treeview-disabled-color);cursor:not-allowed}.ibiz-control-treeview-context-menu-trigger{display:none;flex-shrink:0;width:var(--ibiz-control-treeview-context-menu-width);text-align:center;cursor:pointer}.ibiz-control-treeview-context-menu-trigger__caption-icon{vertical-align:middle}.ibiz-control-treeview-context-menu.mx-context-menu{padding:var(--ibiz-control-treeview-context-menu-padding)}.ibiz-control-treeview-context-menu.mx-context-menu .mx-context-menu-item{padding:var(--ibiz-control-treeview-context-menu-item-padding)}.ibiz-control-treeview-quick-search{padding:var(--ibiz-control-treeview-quick-search-padding)}.ibiz-control-treeview-tree.el-tree{--el-tree-text-color:var(--ibiz-control-treeview-text-color);--el-tree-node-content-height:var(--ibiz-control-treeview-node-height);padding:var(--ibiz-control-treeview-tree-padding);background-color:var(--ibiz-control-treeview-bg-color)}.ibiz-control-treeview-tree.el-tree .el-tree-node__content:hover{color:var(--ibiz-control-treeview-row-hover-color);background-color:var(--ibiz-control-treeview-row-hover-bg-color)}.ibiz-control-treeview-tree.el-tree.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{color:var(--ibiz-control-treeview-row-select-color);background-color:var(--ibiz-control-treeview-row-select-bg-color)}
+.ibiz-control-treeview{--ibiz-control-treeview-text-color:var(--ibiz-color-text-0);--ibiz-control-treeview-bg-color:transparent;--ibiz-control-treeview-disabled-color:var(--ibiz-color-disabled-text);--ibiz-control-treeview-padding:var(--ibiz-spacing-tight) 0;--ibiz-control-treeview-row-hover-color:var(--ibiz-color-text-0);--ibiz-control-treeview-row-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-treeview-row-select-color:var(--ibiz-color-text-0);--ibiz-control-treeview-row-select-bg-color:var(--ibiz-color-primary-light-default);--ibiz-control-treeview-font-size:var(--ibiz-font-size-regular);--ibiz-control-treeview-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-treeview-node-icon-height:var(--ibiz-spacing-base);--ibiz-control-treeview-node-icon-width:var(--ibiz-spacing-base);--ibiz-control-treeview-node-icon-margin-right:var(--ibiz-spacing-tight);--ibiz-control-treeview-node-height:26px;--ibiz-control-treeview-context-menu-width:30px;--ibiz-control-treeview-context-menu-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-control-treeview-context-menu-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-control-treeview-context-menu-item-height:40px;--ibiz-control-treeview-context-menu-border-radius:var(--ibiz-spacing-none);--ibiz-control-treeview-context-menu-bg-color:var(--ibiz-color-bg-3);--ibiz-control-treeview-context-menu-hover-color:var(--ibiz-color-fill-0);--ibiz-control-treeview-context-menu-text-color:var(--ibiz-color-text-2);--ibiz-control-treeview-quick-search-padding:0 var(--ibiz-spacing-base) var(--ibiz-spacing-tight);--ibiz-control-treeview-tree-padding:0 var(--ibiz-spacing-base);height:100%;padding:var(--ibiz-control-treeview-padding)}.ibiz-control-treeview-node{display:flex;flex-grow:1;flex-shrink:1;align-items:center;min-width:1px;height:100%}.ibiz-control-treeview-node__icon{display:flex;align-items:center;width:var(--ibiz-control-treeview-node-icon-width);height:var(--ibiz-control-treeview-node-icon-height);margin-right:var(--ibiz-control-treeview-node-icon-margin-right)}.ibiz-control-treeview-node__icon>svg{width:100%;height:100%}.ibiz-control-treeview-node__label{flex-grow:1;flex-shrink:1;min-width:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-treeview-node:hover .ibiz-control-treeview-context-menu-trigger{display:inline-block}.ibiz-control-treeview-node--disabled{color:var(--ibiz-control-treeview-disabled-color);cursor:not-allowed}.ibiz-control-treeview-context-menu-trigger{display:none;flex-shrink:0;width:var(--ibiz-control-treeview-context-menu-width);text-align:center;cursor:pointer}.ibiz-control-treeview-context-menu-trigger__caption-icon{vertical-align:middle}.ibiz-control-treeview-context-menu{--ibiz-control-treeview-context-menu-width:30px;--ibiz-control-treeview-context-menu-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-control-treeview-context-menu-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-control-treeview-context-menu-item-height:40px;--ibiz-control-treeview-context-menu-border-radius:var(--ibiz-spacing-none);--ibiz-control-treeview-context-menu-bg-color:var(--ibiz-color-bg-3);--ibiz-control-treeview-context-menu-hover-color:var(--ibiz-color-fill-0);--ibiz-control-treeview-context-menu-text-color:var(--ibiz-color-text-2)}.ibiz-control-treeview-context-menu.mx-context-menu{padding:var(--ibiz-control-treeview-context-menu-padding);background-color:var(--ibiz-control-treeview-context-menu-bg-color);border-radius:var(--ibiz-control-treeview-context-menu-border-radius);--mx-menu-text:var(--ibiz-control-treeview-context-menu-text-color)}.ibiz-control-treeview-context-menu.mx-context-menu .mx-context-menu-item{height:var(--ibiz-control-treeview-context-menu-item-height);padding:var(--ibiz-control-treeview-context-menu-item-padding)}.ibiz-control-treeview-context-menu.mx-context-menu .mx-context-menu-item:hover{color:var(--ibiz-control-treeview-context-menu-text-color);background-color:var(--ibiz-control-treeview-context-menu-hover-color)}.ibiz-control-treeview-quick-search{padding:var(--ibiz-control-treeview-quick-search-padding)}.ibiz-control-treeview-tree.el-tree{--el-tree-text-color:var(--ibiz-control-treeview-text-color);--el-tree-node-content-height:var(--ibiz-control-treeview-node-height);padding:var(--ibiz-control-treeview-tree-padding);background-color:var(--ibiz-control-treeview-bg-color)}.ibiz-control-treeview-tree.el-tree .el-tree-node__content:hover{color:var(--ibiz-control-treeview-row-hover-color);background-color:var(--ibiz-control-treeview-row-hover-bg-color)}.ibiz-control-treeview-tree.el-tree.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{color:var(--ibiz-control-treeview-row-select-color);background-color:var(--ibiz-control-treeview-row-select-bg-color)}

package/es/control/tree/tree.d.ts

@@ -58,6 +58,27 @@ export declare const TreeControl: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    isSimple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    data: {
+        type: {
+            (arrayLength: number): IData[];
+            (...items: IData[]): IData[];
+            new (arrayLength: number): IData[];
+            new (...items: IData[]): IData[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => never[];
+    };
 }, {
     c: TreeController<IDETree, import("@ibiz-template/runtime").ITreeState, import("@ibiz-template/runtime").ITreeEvent>;
     ns: import("@ibiz-template/core").Namespace;
@@ -84,6 +105,7 @@ export declare const TreeControl: import("vue").DefineComponent<{
             readonly props: import("element-plus/es/components/tree/src/tree.type").TreeOptionProps;
             readonly data: unknown[];
             readonly draggable: boolean;
+            readonly lazy: boolean;
             readonly renderAfterExpand: boolean;
             readonly checkStrictly: boolean;
             readonly defaultExpandAll: boolean;
@@ -92,7 +114,6 @@ export declare const TreeControl: import("vue").DefineComponent<{
             readonly checkDescendants: boolean;
             readonly autoExpandParent: boolean;
             readonly showCheckbox: boolean;
-            readonly lazy: boolean;
             readonly highlightCurrent: boolean;
             readonly accordion: boolean;
             readonly indent: number;
@@ -199,7 +220,7 @@ export declare const TreeControl: import("vue").DefineComponent<{
             "onNode-drag-leave"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-enter"?: ((...args: any[]) => any) | undefined;
             "onNode-drag-over"?: ((...args: any[]) => any) | undefined;
-        }, "props" | "data" | "draggable" | "renderAfterExpand" | "checkStrictly" | "defaultExpandAll" | "expandOnClickNode" | "checkOnClickNode" | "checkDescendants" | "autoExpandParent" | "showCheckbox" | "lazy" | "highlightCurrent" | "accordion" | "indent">;
+        }, "props" | "data" | "draggable" | "lazy" | "renderAfterExpand" | "checkStrictly" | "defaultExpandAll" | "expandOnClickNode" | "checkOnClickNode" | "checkDescendants" | "autoExpandParent" | "showCheckbox" | "highlightCurrent" | "accordion" | "indent">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -600,7 +621,7 @@ export declare const TreeControl: import("vue").DefineComponent<{
         };
         $forceUpdate: () => void;
         $nextTick: typeof nextTick;
-        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+        $watch<T_5 extends string | ((...args: any) => any)>(source: T_5, cb: T_5 extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
     } & Readonly<import("vue").ExtractPropTypes<{
         data: {
             type: ArrayConstructor;
@@ -1031,10 +1052,33 @@ export declare const TreeControl: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    isSimple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    data: {
+        type: {
+            (arrayLength: number): IData[];
+            (...items: IData[]): IData[];
+            new (arrayLength: number): IData[];
+            new (...items: IData[]): IData[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => never[];
+    };
 }>>, {
+    data: IData[];
     params: IParams;
     mdctrlActiveMode: number;
     singleSelect: boolean;
+    isSimple: boolean;
     loadDefault: boolean;
     checkStrictly: boolean;
     navigational: boolean;

package/es/control/tree/tree.mjs

@@ -1,4 +1,4 @@
-import { isVNode, ref, reactive, onUnmounted, watch, computed, nextTick, resolveComponent, createVNode, onMounted, resolveDirective, withDirectives, defineComponent } from 'vue';
+import { isVNode, defineComponent, ref, reactive, onUnmounted, watch, computed, nextTick, resolveComponent, createVNode, onMounted, withDirectives, resolveDirective } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import { createUUID } from 'qx-util';
 import { debounce } from 'lodash-es';
@@ -67,9 +67,17 @@ const TreeControl = /* @__PURE__ */ defineComponent({
     checkStrictly: {
       type: Boolean,
       default: true
+    },
+    isSimple: {
+      type: Boolean,
+      default: false
+    },
+    data: {
+      type: Array,
+      default: () => []
     }
   },
-  setup() {
+  setup(props) {
     const c = useControlController((...args) => new TreeController(...args));
     const cascadeSelect = ref(false);
     const counterData = reactive({});
@@ -169,7 +177,31 @@ const TreeControl = /* @__PURE__ */ defineComponent({
         treeRefreshKey.value = createUUID();
       }
     });
+    watch(() => c.state.expandedKeys, () => {
+      updateUI();
+    }, {
+      deep: true
+    });
     const loadData = async (item, callback) => {
+      if (props.isSimple) {
+        let nodes2 = [];
+        if (item.level === 0) {
+          const tempNodes = props.data.find((_item) => {
+            return _item.isRoot;
+          });
+          if (tempNodes) {
+            nodes2 = [tempNodes];
+          }
+        } else {
+          nodes2 = props.data.filter((_item) => {
+            return _item._pid.includes(item.data._uuid);
+          });
+        }
+        item._children = nodes2;
+        callback(toElNodes(nodes2));
+        updateUI();
+        return;
+      }
       let nodes;
       if (item.level === 0) {
         nodes = treeData.value;
@@ -266,7 +298,7 @@ const TreeControl = /* @__PURE__ */ defineComponent({
     const calcContextMenuItems = (toolbarItems, nodeData, evt, menuState) => {
       const result = [];
       toolbarItems.forEach((item) => {
-        var _a;
+        var _a, _b;
         if (item.itemType === "SEPERATOR") {
           result.push({
             divided: "self"
@@ -277,7 +309,7 @@ const TreeControl = /* @__PURE__ */ defineComponent({
         if (buttonState && !buttonState.visible) {
           return;
         }
-        const menuItem = {};
+        let menuItem = {};
         if (item.showCaption && item.caption) {
           menuItem.label = item.caption;
         }
@@ -307,11 +339,55 @@ const TreeControl = /* @__PURE__ */ defineComponent({
             }, null);
           }
         } else if (item.itemType === "ITEMS") {
-          if ((_a = item.detoolbarItems) == null ? void 0 : _a.length) {
-            menuItem.children = calcContextMenuItems(item.detoolbarItems, nodeData, evt, menuState);
+          const group = item;
+          if ((_a = group.detoolbarItems) == null ? void 0 : _a.length) {
+            menuItem.children = calcContextMenuItems(group.detoolbarItems, nodeData, evt, menuState);
           }
+          if (group.uiactionGroup && group.groupExtractMode) {
+            const menuItems = (_b = group.uiactionGroup.uiactionGroupDetails) == null ? void 0 : _b.filter((detail) => {
+              const detailState = menuState[detail.id];
+              return detailState.visible;
+            }).map((detail) => {
+              const detailState = menuState[detail.id];
+              const {
+                sysImage
+              } = detail;
+              return {
+                label: detail.showCaption ? detail.caption : void 0,
+                icon: detail.showIcon ? createVNode(iBizIcon, {
+                  "icon": sysImage
+                }, null) : void 0,
+                disabled: detailState.disabled,
+                clickableWhenHasChildren: true,
+                onClick: () => {
+                  ContextMenu.closeContextMenu();
+                  c.doUIAction(detail.uiactionId, nodeData, evt, detail.appId);
+                }
+              };
+            });
+            switch (group.groupExtractMode) {
+              case "ITEMS":
+                menuItem.children = menuItems;
+                break;
+              case "ITEMX":
+                if (menuItems) {
+                  menuItem = menuItems[0];
+                  menuItem.children = menuItems.slice(1);
+                }
+                break;
+              case "ITEM":
+              default:
+                menuItem = void 0;
+                if (menuItems) {
+                  result.push(...menuItems);
+                }
+                break;
+            }
+          }
+        }
+        if (menuItem) {
+          result.push(menuItem);
         }
-        result.push(menuItem);
       });
       return result;
     };
@@ -358,7 +434,14 @@ const TreeControl = /* @__PURE__ */ defineComponent({
       }, null);
     };
     const updateNodeExpand = (data, expanded) => {
-      const nodeData = findNodeData(data._uuid, c);
+      let nodeData;
+      if (props.isSimple) {
+        nodeData = props.data.find((item) => {
+          return item._uuid === data._uuid;
+        });
+      } else {
+        nodeData = findNodeData(data._uuid, c);
+      }
       if (!nodeData) {
         throw new RuntimeError(ibiz.i18n.t("control.common.noFoundNode", {
           id: data._uuid

package/es/control/tree-grid/index.d.ts

@@ -56,7 +56,6 @@ export declare const IBizTreeGridControl: import("@ibiz-template/vue3-util").Typ
     ns: import("@ibiz-template/core").Namespace;
     ns2: import("@ibiz-template/core").Namespace;
     tableRef: import("vue").Ref<IData | undefined>;
-    treeGirdData: import("vue").ComputedRef<IData[]>;
     tableData: import("vue").Ref<IData>;
     renderColumns: import("vue").Ref<import("@ibiz/model-core").IDEGridColumn[]>;
     renderColumn: (model: import("@ibiz/model-core").IDEGridColumn, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {

package/es/control/tree-grid/index.mjs

@@ -1,4 +1,4 @@
-import { ControlType, registerControlProvider } from '@ibiz-template/runtime';
+import { registerControlProvider, ControlType } from '@ibiz-template/runtime';
 import { withInstall } from '@ibiz-template/vue3-util';
 import { TreeGridControl } from './tree-grid.mjs';
 import { TreeGridProvider } from './tree-grid.provider.mjs';

package/es/control/tree-grid/tree-grid.d.ts

@@ -1,6 +1,6 @@
 import { PropType, VNode } from 'vue';
 import { IDEGridColumn } from '@ibiz/model-core';
-import { ControlVO, IControlProvider, TreeGridController } from '@ibiz-template/runtime';
+import { IControlProvider, TreeGridController } from '@ibiz-template/runtime';
 export declare const TreeGridControl: import("vue").DefineComponent<{
     modelData: {
         type: PropType<import("@ibiz/model-core").IDEGrid>;
@@ -67,14 +67,13 @@ export declare const TreeGridControl: import("vue").DefineComponent<{
     ns: import("@ibiz-template/core").Namespace;
     ns2: import("@ibiz-template/core").Namespace;
     tableRef: import("vue").Ref<IData | undefined>;
-    treeGirdData: import("vue").ComputedRef<IData[]>;
     tableData: import("vue").Ref<IData>;
     renderColumns: import("vue").Ref<IDEGridColumn[]>;
     renderColumn: (model: IDEGridColumn, index: number) => VNode | null;
     defaultSort: import("vue").Ref<IData>;
-    onDbRowClick: (data: ControlVO) => void;
-    onRowClick: (data: ControlVO, _column: IData, event: MouseEvent) => Promise<void>;
-    onSelectionChange: (selection: ControlVO[]) => void;
+    onDbRowClick: (data: import("@ibiz-template/runtime").ControlVO) => void;
+    onRowClick: (data: import("@ibiz-template/runtime").ControlVO, _column: IData, event: MouseEvent) => Promise<void>;
+    onSelectionChange: (selection: import("@ibiz-template/runtime").ControlVO[]) => void;
     onSortChange: (opts: {
         _column: IData;
         prop: string;

package/es/control/tree-grid/tree-grid.mjs

@@ -1,4 +1,4 @@
-import { computed, resolveComponent, createVNode, createTextVNode, renderSlot, defineComponent } from 'vue';
+import { defineComponent, createVNode, resolveComponent, createTextVNode, renderSlot } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import { TreeGridController } from '@ibiz-template/runtime';
 import { useRowEditPopover } from '../grid/row-edit-popover/use-row-edit-popover.mjs';
@@ -90,29 +90,6 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
     const {
       headerCssVars
     } = useGridHeaderStyle(tableRef, ns);
-    const getTreeGridDataItem = (data) => {
-      const tempData = data.clone();
-      tempData.hasChildren = c.state.items.some((item) => data[c.treeGridValueField] === item[c.treeGridParentField]);
-      tempData.children = [];
-      return tempData;
-    };
-    const treeGirdData = computed(() => {
-      const treeGirdItems = c.state.rows.map((row) => getTreeGridDataItem(row.data));
-      const rootNodes = [];
-      const ids = [];
-      treeGirdItems.forEach((item) => {
-        const id = item[c.treeGridValueField];
-        if (id) {
-          ids.push(id);
-        }
-      });
-      treeGirdItems.forEach((item) => {
-        if (!ids.includes(item[c.treeGridParentField])) {
-          rootNodes.push(item);
-        }
-      });
-      return rootNodes;
-    });
     const renderNoData = () => {
       var _a;
       const {
@@ -136,8 +113,9 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
       return null;
     };
     const loadData = async (item, _row, callback) => {
-      const treeGirdItems = c.state.rows.map((row) => getTreeGridDataItem(row.data));
+      const treeGirdItems = c.state.items.map((data) => c.getTreeGridDataItem(data));
       const items = treeGirdItems.filter((data) => item[c.treeGridValueField] === data[c.treeGridParentField]);
+      item.children = items;
       callback(items);
     };
     const renderBatchToolBar = () => {
@@ -179,7 +157,6 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
       ns,
       ns2,
       tableRef,
-      treeGirdData,
       tableData,
       renderColumns,
       renderColumn,
@@ -223,7 +200,7 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
         "highlight-current-row": state.singleSelect,
         "row-class-name": this.handleRowClassName,
         "row-key": "srfkey",
-        "data": this.c.state.showTreeGrid ? this.treeGirdData : this.tableData,
+        "data": this.c.state.showTreeGrid ? state.treeGirdData : this.tableData,
         "onRowClick": this.onRowClick,
         "onRowDblclick": this.onDbRowClick,
         "onSelectionChange": this.onSelectionChange,

package/es/control/tree-grid-ex/index.mjs

@@ -1,4 +1,4 @@
-import { ControlType, registerControlProvider } from '@ibiz-template/runtime';
+import { registerControlProvider, ControlType } from '@ibiz-template/runtime';
 import { withInstall } from '@ibiz-template/vue3-util';
 import { TreeGridExControl } from './tree-grid-ex.mjs';
 import { TreeGridExProvider } from './tree-grid-ex.provider.mjs';

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-edit-column/tree-grid-ex-edit-column.mjs

@@ -1,4 +1,4 @@
-import { computed, ref, resolveComponent, h, createVNode, defineComponent } from 'vue';
+import { defineComponent, computed, ref, createVNode, resolveComponent, h } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { RuntimeError } from '@ibiz-template/core';
 import { TreeGridExNodeColumnController, TreeGridExRowState } from '@ibiz-template/runtime';

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-field-column/tree-grid-ex-field-column.mjs

@@ -1,4 +1,4 @@
-import { computed, ref, resolveComponent, createVNode, defineComponent } from 'vue';
+import { defineComponent, computed, ref, createVNode, resolveComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { TreeGridExFieldColumnController, TreeGridExRowState } from '@ibiz-template/runtime';
 import { isNotNil } from 'ramda';

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-ua-column/tree-grid-ex-ua-column.mjs

@@ -1,4 +1,4 @@
-import { resolveComponent, createVNode, defineComponent } from 'vue';
+import { defineComponent, createVNode, resolveComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './tree-grid-ex-ua-column.css';
 import { TreeGridExUAColumnController, TreeGridExRowState } from '@ibiz-template/runtime';

package/es/control/tree-grid-ex/tree-grid-ex.mjs

@@ -1,4 +1,4 @@
-import { resolveComponent, createVNode, computed, ref, watchEffect, renderSlot, mergeProps, h, defineComponent } from 'vue';
+import { defineComponent, createVNode, resolveComponent, computed, ref, watchEffect, renderSlot, mergeProps, h } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import { TreeGridExController } from '@ibiz-template/runtime';
 import './tree-grid-ex.css';

package/es/control/wizard-panel/index.mjs

@@ -1,4 +1,4 @@
-import { ControlType, registerControlProvider } from '@ibiz-template/runtime';
+import { registerControlProvider, ControlType } from '@ibiz-template/runtime';
 import { withInstall } from '@ibiz-template/vue3-util';
 import { WizardPanelControl } from './wizard-panel.mjs';
 import { WizardPanelProvider } from './wizard-panel.provider.mjs';

package/es/control/wizard-panel/wizard-panel.mjs

@@ -1,4 +1,4 @@
-import { isVNode, resolveComponent, h, createVNode, defineComponent } from 'vue';
+import { isVNode, defineComponent, resolveComponent, h, createVNode } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import './wizard-panel.css';
 import { WizardPanelController } from '@ibiz-template/runtime';

package/es/editor/array/ibiz-array/ibiz-array.d.ts

@@ -129,8 +129,8 @@ export declare const IBizArray: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onInfoTextChange?: ((_text: string) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/array/ibiz-array/ibiz-array.mjs

@@ -1,4 +1,4 @@
-import { isVNode, ref, computed, watch, createVNode, resolveComponent, mergeProps, defineComponent } from 'vue';
+import { isVNode, defineComponent, ref, computed, watch, createVNode, resolveComponent, mergeProps } from 'vue';
 import { getArrayProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-array.css';
 import { createUUID } from 'qx-util';

package/es/editor/autocomplete/ibiz-autocomplete/ibiz-autocomplete.d.ts

@@ -74,8 +74,8 @@ export declare const IBizAutoComplete: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onInfoTextChange?: ((_text: string) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/autocomplete/ibiz-autocomplete/ibiz-autocomplete.mjs

@@ -1,4 +1,4 @@
-import { ref, computed, watch, resolveComponent, mergeProps, h, createVNode, defineComponent } from 'vue';
+import { defineComponent, ref, computed, watch, createVNode, resolveComponent, mergeProps, h } from 'vue';
 import { getAutoCompleteProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-autocomplete.css';
 import { debounce } from 'lodash-es';

package/es/editor/carousel/ibiz-carousel/ibiz-carousel.d.ts

@@ -67,8 +67,8 @@ export declare const IBizCarousel: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onInfoTextChange?: ((_text: string) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/carousel/ibiz-carousel/ibiz-carousel.mjs

@@ -1,4 +1,4 @@
-import { ref, watch, resolveComponent, mergeProps, createVNode, defineComponent } from 'vue';
+import { defineComponent, ref, watch, createVNode, resolveComponent, mergeProps } from 'vue';
 import { getDatePickerProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-carousel.css';
 

package/es/editor/cascader/ibiz-cascader/ibiz-cascader.d.ts

@@ -87,8 +87,8 @@ export declare const IBizCascader: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onInfoTextChange?: ((_text: string) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/cascader/ibiz-cascader/ibiz-cascader.mjs

@@ -1,4 +1,4 @@
-import { ref, computed, resolveComponent, mergeProps, createVNode, defineComponent } from 'vue';
+import { defineComponent, ref, computed, createVNode, resolveComponent, mergeProps } from 'vue';
 import { getCascaderProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-cascader.css';
 import { clone } from 'ramda';

package/es/editor/check-box/ibiz-checkbox/ibiz-checkbox.d.ts

@@ -60,8 +60,8 @@ export declare const IBizCheckbox: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onInfoTextChange?: ((_text: string) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/check-box/ibiz-checkbox/ibiz-checkbox.mjs

@@ -1,4 +1,4 @@
-import { computed, resolveComponent, mergeProps, createVNode, defineComponent } from 'vue';
+import { defineComponent, computed, createVNode, resolveComponent, mergeProps } from 'vue';
 import { getCheckboxProps, getEditorEmits, useNamespace, useAutoFocusBlur, useFocusAndBlur } from '@ibiz-template/vue3-util';
 import './ibiz-checkbox.css';
 

package/es/editor/check-box-list/ibiz-checkbox-list/ibiz-checkbox-list.d.ts

@@ -96,8 +96,8 @@ export declare const IBizCheckboxList: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onInfoTextChange?: ((_text: string) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/check-box-list/ibiz-checkbox-list/ibiz-checkbox-list.mjs

@@ -1,4 +1,4 @@
-import { isVNode, computed, ref, watch, resolveComponent, mergeProps, createVNode, defineComponent } from 'vue';
+import { isVNode, defineComponent, computed, ref, watch, createVNode, resolveComponent, mergeProps } from 'vue';
 import { getCheckboxListProps, getEditorEmits, useNamespace, useCodeListListen, useAutoFocusBlur, useFocusAndBlur } from '@ibiz-template/vue3-util';
 import { isNil } from 'ramda';
 import './ibiz-checkbox-list.css';