bkui-vue 0.0.1-beta.63 → 0.0.1-beta.66

package/dist/index.esm.js

@@ -2674,18 +2674,18 @@ folder.inheritAttrs = false;
 JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M860.8 128H163.2a32 32 0 0 0-27.36 52l295.2 336 0.96 0V896l160-82.72V516.8l0.96 0 295.2-336A32 32 0 0 0 860.8 128Z"}}]}');
 JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64C264 64 64 264 64 512c0 57.6 11.2 113.6 32 166.4V896c0 17.6 14.4 32 32 32h217.6C576 1019.2 836.8 908.8 928 678.4S908.8 187.2 678.4 96C625.6 75.2 569.6 64 512 64zM500.8 721.6c-27.2 0-48-20.8-48-48s20.8-48 48-48c27.2 0 48 20.8 48 48S528 721.6 500.8 721.6zM587.2 507.2c-36.8 20.8-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8c1.6-70.4 49.6-118.4 136-118.4 80 0 132.8 44.8 132.8 110.4C648 454.4 627.2 484.8 587.2 507.2z"}}]}');
 JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zM500.8 721.6c-27.2 0-48-20.8-48-48s20.8-48 48-48c27.2 0 48 20.8 48 48S528 721.6 500.8 721.6zM587.2 507.2c-36.8 20.8-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8c1.6-70.4 49.6-118.4 136-118.4 80 0 132.8 44.8 132.8 110.4C648 454.4 627.2 484.8 587.2 507.2z"}}]}');
-const data$c = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 128c212.8 0 384 171.2 384 384S724.8 896 512 896 128 724.8 128 512 299.2 128 512 128M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64z"}},{"type":"element","name":"path","attributes":{"d":"M548.8 673.6A48 48 0 0 1 500.8 721.6 48 48 0 0 1 452.8 673.6 48 48 0 0 1 548.8 673.6z"}},{"type":"element","name":"path","attributes":{"d":"M513.6 302.4c80 0 132.8 44.8 132.8 110.4 0 41.6-20.8 72-60.8 96-40 24-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8C377.6 352 427.2 302.4 513.6 302.4z"}}]}');
-const help = (props, context) => {
+JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 128c212.8 0 384 171.2 384 384S724.8 896 512 896 128 724.8 128 512 299.2 128 512 128M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64z"}},{"type":"element","name":"path","attributes":{"d":"M548.8 673.6A48 48 0 0 1 500.8 721.6 48 48 0 0 1 452.8 673.6 48 48 0 0 1 548.8 673.6z"}},{"type":"element","name":"path","attributes":{"d":"M513.6 302.4c80 0 132.8 44.8 132.8 110.4 0 41.6-20.8 72-60.8 96-40 24-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8C377.6 352 427.2 302.4 513.6 302.4z"}}]}');
+JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1303.273","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M664.4363636363637 0C676.8000000000001 0 688.5818181818182 4.945454545454545 697.3090909090909 13.672727272727274L697.3090909090909 13.672727272727274 1010.3272727272728 326.6909090909091C1019.0545454545455 335.41818181818184 1024 347.3454545454546 1024 359.70909090909095L1024 359.70909090909095 1024 1256.7272727272727C1024 1282.4727272727273 1003.2 1303.2727272727273 977.4545454545455 1303.2727272727273L977.4545454545455 1303.2727272727273 46.54545454545455 1303.2727272727273C20.8 1303.2727272727273 0 1282.4727272727273 0 1256.7272727272727L0 1256.7272727272727 0 46.54545454545455C0 20.8 20.8 0 46.54545454545455 0L46.54545454545455 0ZM637.6727272727272 744.7272727272727L474.76363636363635 954.1818181818182 358.40000000000003 814.5454545454546 195.4909090909091 1024 847.1272727272727 1024 637.6727272727272 744.7272727272727ZM465.4545454545455 558.5454545454545C414.041856 558.5454545454545 372.3636363636364 600.2236741818182 372.3636363636364 651.6363636363636 372.3636363636364 703.0490530909091 414.041856 744.7272727272727 465.4545454545455 744.7272727272727 516.8672349090909 744.7272727272727 558.5454545454545 703.0490530909091 558.5454545454545 651.6363636363636 558.5454545454545 600.2236741818182 516.8672349090909 558.5454545454545 465.4545454545455 558.5454545454545ZM642.9090909090909 107.34545454545454L642.9090909090909 381.0909090909091 916.6545454545455 381.0909090909091 642.9090909090909 107.34545454545454Z"}}]}');
+const data$c = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zM512 896C299.2 896 128 724.8 128 512S299.2 128 512 128s384 171.2 384 384S724.8 896 512 896z"}},{"type":"element","name":"path","attributes":{"d":"M494.4 403.2c-28.8 6.4-56 20.8-76.8 41.6-24 22.4 1.6 44.8 16 27.2 9.6-12.8 24-22.4 40-28.8 11.2-1.6 17.6 1.6 19.2 9.6 1.6 14.4 0 27.2-4.8 41.6-4.8 19.2-14.4 51.2-25.6 94.4-22.4 76.8-33.6 124.8-30.4 140.8 3.2 17.6 12.8 32 28.8 41.6 17.6 8 38.4 9.6 57.6 4.8 30.4-6.4 57.6-22.4 80-44.8 25.6-25.6-3.2-43.2-17.6-28.8-9.6 12.8-24 22.4-40 25.6-14.4 3.2-22.4-3.2-25.6-16-1.6-14.4 1.6-28.8 6.4-41.6 40-136 57.6-212.8 52.8-232-3.2-14.4-12.8-27.2-25.6-33.6C532.8 398.4 512 398.4 494.4 403.2z"}},{"type":"element","name":"path","attributes":{"d":"M608 304A48 48 0 0 1 560 352 48 48 0 0 1 512 304 48 48 0 0 1 608 304z"}}]}');
+const infoLine = (props, context) => {
   const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
   return createVNode(bkIcon, mergeProps(p2, {
     "data": data$c,
-    "name": "help"
+    "name": "infoLine"
   }), null);
 };
-help.displayName = "help";
-help.inheritAttrs = false;
-JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1303.273","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M664.4363636363637 0C676.8000000000001 0 688.5818181818182 4.945454545454545 697.3090909090909 13.672727272727274L697.3090909090909 13.672727272727274 1010.3272727272728 326.6909090909091C1019.0545454545455 335.41818181818184 1024 347.3454545454546 1024 359.70909090909095L1024 359.70909090909095 1024 1256.7272727272727C1024 1282.4727272727273 1003.2 1303.2727272727273 977.4545454545455 1303.2727272727273L977.4545454545455 1303.2727272727273 46.54545454545455 1303.2727272727273C20.8 1303.2727272727273 0 1282.4727272727273 0 1256.7272727272727L0 1256.7272727272727 0 46.54545454545455C0 20.8 20.8 0 46.54545454545455 0L46.54545454545455 0ZM637.6727272727272 744.7272727272727L474.76363636363635 954.1818181818182 358.40000000000003 814.5454545454546 195.4909090909091 1024 847.1272727272727 1024 637.6727272727272 744.7272727272727ZM465.4545454545455 558.5454545454545C414.041856 558.5454545454545 372.3636363636364 600.2236741818182 372.3636363636364 651.6363636363636 372.3636363636364 703.0490530909091 414.041856 744.7272727272727 465.4545454545455 744.7272727272727 516.8672349090909 744.7272727272727 558.5454545454545 703.0490530909091 558.5454545454545 651.6363636363636 558.5454545454545 600.2236741818182 516.8672349090909 558.5454545454545 465.4545454545455 558.5454545454545ZM642.9090909090909 107.34545454545454L642.9090909090909 381.0909090909091 916.6545454545455 381.0909090909091 642.9090909090909 107.34545454545454Z"}}]}');
-JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zM512 896C299.2 896 128 724.8 128 512S299.2 128 512 128s384 171.2 384 384S724.8 896 512 896z"}},{"type":"element","name":"path","attributes":{"d":"M494.4 403.2c-28.8 6.4-56 20.8-76.8 41.6-24 22.4 1.6 44.8 16 27.2 9.6-12.8 24-22.4 40-28.8 11.2-1.6 17.6 1.6 19.2 9.6 1.6 14.4 0 27.2-4.8 41.6-4.8 19.2-14.4 51.2-25.6 94.4-22.4 76.8-33.6 124.8-30.4 140.8 3.2 17.6 12.8 32 28.8 41.6 17.6 8 38.4 9.6 57.6 4.8 30.4-6.4 57.6-22.4 80-44.8 25.6-25.6-3.2-43.2-17.6-28.8-9.6 12.8-24 22.4-40 25.6-14.4 3.2-22.4-3.2-25.6-16-1.6-14.4 1.6-28.8 6.4-41.6 40-136 57.6-212.8 52.8-232-3.2-14.4-12.8-27.2-25.6-33.6C532.8 398.4 512 398.4 494.4 403.2z"}},{"type":"element","name":"path","attributes":{"d":"M608 304A48 48 0 0 1 560 352 48 48 0 0 1 512 304 48 48 0 0 1 608 304z"}}]}');
+infoLine.displayName = "infoLine";
+infoLine.inheritAttrs = false;
 const data$b = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64A448 448 0 1 1 64 512 448 448 0 0 1 512 64ZM493.92 402.56a156 156 0 0 0-77.12 42.24c-24.32 22.88 1.44 44 16 27.52a82.56 82.56 0 0 1 40.48-28.16c11.04-2.24 17.6 1.28 19.36 10.4A118.88 118.88 0 0 1 488.16 496q-7.2 29.76-26.4 93.92-34.72 116.32-30.08 140.8a54.72 54.72 0 0 0 28.8 40.96 88 88 0 0 0 58.4 5.12 161.76 161.76 0 0 0 80-45.44c25.76-24.96-3.52-43.04-17.28-28a76.32 76.32 0 0 1-39.36 26.08c-14.24 2.88-22.72-2.4-25.28-16A104.96 104.96 0 0 1 522.88 672Q582.24 469.12 576 439.84a46.24 46.24 0 0 0-25.6-33.6A89.6 89.6 0 0 0 493.92 402.56Zm67.84-39.84A49.92 49.92 0 1 0 512 312.96 49.76 49.76 0 0 0 561.76 362.72Z"}}]}');
 const info = (props, context) => {
   const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
@@ -2858,7 +2858,7 @@ var Component$A = defineComponent({
       "class": typeClass
     }, [createVNode("div", {
       "class": "bk-alert-wraper"
-    }, [this.showIcon && createVNode(help, {
+    }, [this.showIcon && createVNode(infoLine, {
       "class": "bk-alert-icon-info"
     }, null), createVNode("div", {
       "class": "bk-alert-content"
@@ -15450,6 +15450,7 @@ const tabNavProps = __spreadValues({
     type: Array,
     default: () => []
   },
+  tabPosition: PropTypes.commonType(["left", "right", "top"], "position").def("top"),
   closable: Boolean,
   addable: Boolean,
   sortable: Boolean,
@@ -15531,51 +15532,49 @@ var TabNav = defineComponent({
     const dragenterIndex = ref(-1);
     const dragStartIndex = ref(-1);
     const draggingEle = ref("");
-    return {
+    const distinctRoots = (el1, el2) => el1 === el2;
+    const methods = {
+      handleTabAdd(e) {
+        props.tabAdd(e);
+      },
+      dragstart(index, $event) {
+        dragStartIndex.value = index;
+        draggingEle.value = props.guid;
+        Object.assign($event.dataTransfer, {
+          effectAllowed: "move"
+        });
+        props.tabDrag(index, $event);
+      },
+      dragenter(index) {
+        if (distinctRoots(draggingEle.value, props.guid)) {
+          dragenterIndex.value = index;
+        }
+      },
+      dragend() {
+        dragenterIndex.value = -1;
+        dragStartIndex.value = -1;
+        draggingEle.value = null;
+      },
+      drop(index, sortType) {
+        if (!distinctRoots(draggingEle.value, props.guid)) {
+          return false;
+        }
+        props.tabSort(dragStartIndex.value, index, sortType);
+      },
+      handleTabChange(name2) {
+        props.tabChange(name2);
+      },
+      handleTabRemove(index, panel) {
+        props.tabRemove(index, panel);
+      }
+    };
+    return __spreadProps(__spreadValues({}, methods), {
       navs,
       dragenterIndex,
       dragStartIndex,
       draggingEle,
       guid: Math.random().toString(16).substr(4) + Math.random().toString(16).substr(4)
-    };
-  },
-  methods: {
-    distinctRoots(el1, el2) {
-      return el1 === el2;
-    },
-    handleTabAdd(e) {
-      this.tabAdd(e);
-    },
-    dragstart(index, $event) {
-      this.dragStartIndex = index;
-      this.draggingEle = this.guid;
-      Object.assign($event.dataTransfer, {
-        effectAllowed: "move"
-      });
-      this.tabDrag(index, $event);
-    },
-    dragenter(index) {
-      if (this.distinctRoots(this.draggingEle, this.guid)) {
-        this.dragenterIndex = index;
-      }
-    },
-    dragend() {
-      this.dragenterIndex = -1;
-      this.dragStartIndex = -1;
-      this.draggingEle = null;
-    },
-    drop(index, sortType) {
-      if (!this.distinctRoots(this.draggingEle, this.guid)) {
-        return false;
-      }
-      this.tabSort(this.dragStartIndex, index, sortType);
-    },
-    handleTabChange(name2) {
-      this.tabChange(name2);
-    },
-    handleTabRemove(index, panel) {
-      this.tabRemove(index, panel);
-    }
+    });
   },
   render() {
     const {
@@ -15695,17 +15694,12 @@ var Tab = defineComponent({
     "drag"
   ],
   setup(_props, {
-    slots
+    slots,
+    emit
   }) {
     const isMounted = ref(false);
     const panels = ref([]);
     const instance = getCurrentInstance();
-    if (typeof slots.panel === "function") {
-      panels.value = slots.panel();
-    }
-    if (typeof slots.default === "function") {
-      panels.value = slots.default();
-    }
     const getPaneInstanceFromSlot = (vnode, panelInstanceList = []) => {
       const {
         children
@@ -15732,7 +15726,7 @@ var Tab = defineComponent({
           return;
         const content = children[0];
         const panelInstanceList = getPaneInstanceFromSlot(content);
-        const isChanged = !(panelInstanceList.length === panels.value.length && panelInstanceList.every((panel, index) => panel.uid === panels.value[index].uid));
+        const isChanged = panelInstanceList.length !== panels.value.length;
         if (isChanged) {
           panels.value = panelInstanceList;
         }
@@ -15745,52 +15739,54 @@ var Tab = defineComponent({
     onUpdated(() => {
       setPanelInstances();
     });
-    return {
-      isMounted,
-      panels
-    };
-  },
-  methods: {
-    tabAdd(e) {
-      this.$emit("add", {
-        e
-      });
-      this.$emit("add-panel", {
-        e
-      });
-    },
-    tabChange(name2) {
-      this.$emit("change", name2);
-      this.$emit("tab-change", name2);
-      this.$emit("update:active", name2);
-    },
-    tabRemove(index, panel) {
-      this.$emit("remove", index, panel);
-      this.$emit("remove-panel", index, panel);
-    },
-    tabSort(dragTabIndex, dropTabIndex, sortType) {
-      if (sortType === "insert") {
-        if (dragTabIndex < dropTabIndex) {
-          this.panels.splice(dropTabIndex + 1, 0, this.panels[dragTabIndex]);
-          this.panels.splice(dragTabIndex, 1);
-        } else if (dragTabIndex > dropTabIndex) {
-          this.panels.splice(dropTabIndex, 0, this.panels[dragTabIndex]);
-          this.panels.splice(dragTabIndex + 1, 1);
+    const methods = {
+      tabAdd(e) {
+        emit("add", {
+          e
+        });
+        emit("add-panel", {
+          e
+        });
+      },
+      tabChange(name2) {
+        emit("change", name2);
+        emit("tab-change", name2);
+        emit("update:active", name2);
+      },
+      tabRemove(index, panel) {
+        emit("remove", index, panel);
+        emit("remove-panel", index, panel);
+      },
+      tabSort(dragTabIndex, dropTabIndex, sortType) {
+        const list = panels.value;
+        if (sortType === "insert") {
+          if (dragTabIndex < dropTabIndex) {
+            list.splice(dropTabIndex + 1, 0, panels[dragTabIndex]);
+            list.splice(dragTabIndex, 1);
+          } else if (dragTabIndex > dropTabIndex) {
+            list.splice(dropTabIndex, 0, panels[dragTabIndex]);
+            list.splice(dragTabIndex + 1, 1);
+          } else {
+            return false;
+          }
         } else {
-          return false;
+          const swap = list[dropTabIndex];
+          list[dropTabIndex] = list[dragTabIndex];
+          list[dragTabIndex] = swap;
         }
-      } else {
-        const swap = this.panels[dropTabIndex];
-        this.panels[dropTabIndex] = this.panels[dragTabIndex];
-        this.panels[dragTabIndex] = swap;
+        panels.value = [...list];
+        emit("sort", dragTabIndex, dropTabIndex, sortType);
+        emit("sort-change", dragTabIndex, dropTabIndex, sortType);
+      },
+      tabDrag(dragTabIndex, dragEvent) {
+        emit("drag", dragTabIndex, dragEvent);
+        emit("on-drag-tab", dragTabIndex, dragEvent);
       }
-      this.$emit("sort", dragTabIndex, dropTabIndex, sortType);
-      this.$emit("sort-change", dragTabIndex, dropTabIndex, sortType);
-    },
-    tabDrag(dragTabIndex, dragEvent) {
-      this.$emit("drag", dragTabIndex, dragEvent);
-      this.$emit("on-drag-tab", dragTabIndex, dragEvent);
-    }
+    };
+    return __spreadProps(__spreadValues({}, methods), {
+      isMounted,
+      panels
+    });
   },
   render() {
     var _a, _b;
@@ -15814,6 +15810,7 @@ var Tab = defineComponent({
         validateActive,
         changeOnHover,
         changeOnHoverDelay,
+        tabPosition,
         tabAdd,
         tabChange,
         tabRemove,
@@ -15833,6 +15830,7 @@ var Tab = defineComponent({
         validateActive,
         changeOnHover,
         changeOnHoverDelay,
+        tabPosition,
         tabAdd,
         tabChange,
         tabRemove,
@@ -20989,15 +20987,17 @@ var NODE_ATTRIBUTES = /* @__PURE__ */ ((NODE_ATTRIBUTES2) => {
   NODE_ATTRIBUTES2["DEPTH"] = "__depth";
   NODE_ATTRIBUTES2["INDEX"] = "__index";
   NODE_ATTRIBUTES2["UUID"] = "__uuid";
-  NODE_ATTRIBUTES2["PARENT_ID"] = "__parentId";
-  NODE_ATTRIBUTES2["HAS_CHILD"] = "__hasChild";
+  NODE_ATTRIBUTES2["PARENT_ID"] = "__parent_id";
+  NODE_ATTRIBUTES2["HAS_CHILD"] = "__has_child";
   NODE_ATTRIBUTES2["PATH"] = "__path";
-  NODE_ATTRIBUTES2["IS_ROOT"] = "__isRoot";
+  NODE_ATTRIBUTES2["IS_ROOT"] = "__is_root";
   NODE_ATTRIBUTES2["ORDER"] = "__order";
-  NODE_ATTRIBUTES2["IS_OPEN"] = "__isOpen";
-  NODE_ATTRIBUTES2["CHECKED"] = "__checked";
-  NODE_ATTRIBUTES2["IS_ASYNC_INIT"] = "__isAsyncInit";
-  NODE_ATTRIBUTES2["IS_MATCH"] = "__isMatch";
+  NODE_ATTRIBUTES2["IS_OPENED"] = "__is_open";
+  NODE_ATTRIBUTES2["IS_CHECKED"] = "__is_checked";
+  NODE_ATTRIBUTES2["IS_SELECTED"] = "__is_selected";
+  NODE_ATTRIBUTES2["IS_ASYNC_INIT"] = "__is_async_init";
+  NODE_ATTRIBUTES2["IS_MATCH"] = "__is_match";
+  NODE_ATTRIBUTES2["IS_NULL"] = "__IS_NULL";
   return NODE_ATTRIBUTES2;
 })(NODE_ATTRIBUTES || {});
 const treeProps = {
@@ -21042,7 +21042,11 @@ const treeProps = {
     PropTypes.number,
     PropTypes.bool
   ]).def(void 0),
-  emptyText: PropTypes.string.def("\u6CA1\u6709\u6570\u636E")
+  emptyText: PropTypes.string.def("\u6CA1\u6709\u6570\u636E"),
+  draggable: PropTypes.bool.def(false),
+  dragSort: PropTypes.bool.def(false),
+  selectable: PropTypes.bool.def(true),
+  selected: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.any]).def(null)
 };
 var useEmpty = (props, {
   slots
@@ -21057,8 +21061,7 @@ var useEmpty = (props, {
     }
   })
 });
-var useNodeAttribute = (flatData) => {
-  const schemaValues = computed(() => Array.from(flatData.schema.values()));
+var useNodeAttribute = (flatData, props) => {
   const getSchemaVal2 = (key) => flatData.schema.get(key);
   const getNodeAttr2 = (node, attr) => {
     var _a;
@@ -21068,26 +21071,55 @@ var useNodeAttribute = (flatData) => {
     [attr]: val
   }));
   const getNodePath = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.PATH);
+  const getNodeId = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.UUID);
   const isRootNode = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.IS_ROOT);
-  const isNodeOpened = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.IS_OPEN);
+  const isNodeOpened = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.IS_OPENED);
   const hasChildNode = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.HAS_CHILD);
   const isNodeMatched = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.IS_MATCH);
-  const isNodeChecked = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.CHECKED);
+  const isNodeChecked = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.IS_CHECKED);
+  const getNodeParentId = (node) => getNodeAttr2(node, NODE_ATTRIBUTES.PARENT_ID);
+  const getNodeParentIdById = (id) => getNodeAttr2({
+    [NODE_ATTRIBUTES.UUID]: id
+  }, NODE_ATTRIBUTES.PARENT_ID);
+  const deleteNodeSchema = (id) => flatData.schema.delete(id);
   const isItemOpen = (item) => {
     var _a;
     if (typeof item === "object") {
       return isNodeOpened(item);
     }
     if (typeof item === "string") {
-      return (_a = getSchemaVal2(item)) == null ? void 0 : _a[NODE_ATTRIBUTES.IS_OPEN];
+      return (_a = getSchemaVal2(item)) == null ? void 0 : _a[NODE_ATTRIBUTES.IS_OPENED];
     }
     return false;
   };
   const checkNodeIsOpen = (node) => isRootNode(node) || isItemOpen(node) || isItemOpen(getNodeAttr2(node, NODE_ATTRIBUTES.PARENT_ID));
+  const getSourceNodeByPath = (path) => {
+    const paths = path.split("-");
+    return paths.reduce((pre, nodeIndex) => {
+      const index = Number(nodeIndex);
+      return Array.isArray(pre) ? pre[index] : pre[props.children][index];
+    }, props.data);
+  };
+  const getSourceNodeByUID = (uid) => getSourceNodeByPath(getNodePath({
+    [NODE_ATTRIBUTES.UUID]: uid
+  }));
+  const getParentNodeData = (uid) => {
+    if (isRootNode({
+      [NODE_ATTRIBUTES.UUID]: uid
+    })) {
+      return {
+        [props.children]: props.data
+      };
+    }
+    return getSourceNodeByUID(getNodeParentIdById(uid));
+  };
   return {
-    schemaValues,
     getSchemaVal: getSchemaVal2,
     getNodeAttr: getNodeAttr2,
+    getNodeId,
+    getNodeParentId,
+    getNodeParentIdById,
+    getParentNodeData,
     setNodeAttr,
     getNodePath,
     isRootNode,
@@ -21096,223 +21128,13 @@ var useNodeAttribute = (flatData) => {
     isItemOpen,
     isNodeChecked,
     isNodeMatched,
-    checkNodeIsOpen
+    checkNodeIsOpen,
+    getSourceNodeByPath,
+    getSourceNodeByUID,
+    deleteNodeSchema
   };
 };
-var rngBrowser = { exports: {} };
-var getRandomValues = typeof crypto != "undefined" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto != "undefined" && typeof window.msCrypto.getRandomValues == "function" && msCrypto.getRandomValues.bind(msCrypto);
-if (getRandomValues) {
-  var rnds8 = new Uint8Array(16);
-  rngBrowser.exports = function whatwgRNG() {
-    getRandomValues(rnds8);
-    return rnds8;
-  };
-} else {
-  var rnds = new Array(16);
-  rngBrowser.exports = function mathRNG() {
-    for (var i = 0, r2; i < 16; i++) {
-      if ((i & 3) === 0)
-        r2 = Math.random() * 4294967296;
-      rnds[i] = r2 >>> ((i & 3) << 3) & 255;
-    }
-    return rnds;
-  };
-}
-var byteToHex = [];
-for (var i = 0; i < 256; ++i) {
-  byteToHex[i] = (i + 256).toString(16).substr(1);
-}
-function bytesToUuid$2(buf, offset2) {
-  var i = offset2 || 0;
-  var bth = byteToHex;
-  return [
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]]
-  ].join("");
-}
-var bytesToUuid_1 = bytesToUuid$2;
-var rng$1 = rngBrowser.exports;
-var bytesToUuid$1 = bytesToUuid_1;
-var _nodeId;
-var _clockseq;
-var _lastMSecs = 0;
-var _lastNSecs = 0;
-function v1$1(options, buf, offset2) {
-  var i = buf && offset2 || 0;
-  var b2 = buf || [];
-  options = options || {};
-  var node = options.node || _nodeId;
-  var clockseq = options.clockseq !== void 0 ? options.clockseq : _clockseq;
-  if (node == null || clockseq == null) {
-    var seedBytes = rng$1();
-    if (node == null) {
-      node = _nodeId = [
-        seedBytes[0] | 1,
-        seedBytes[1],
-        seedBytes[2],
-        seedBytes[3],
-        seedBytes[4],
-        seedBytes[5]
-      ];
-    }
-    if (clockseq == null) {
-      clockseq = _clockseq = (seedBytes[6] << 8 | seedBytes[7]) & 16383;
-    }
-  }
-  var msecs = options.msecs !== void 0 ? options.msecs : new Date().getTime();
-  var nsecs = options.nsecs !== void 0 ? options.nsecs : _lastNSecs + 1;
-  var dt = msecs - _lastMSecs + (nsecs - _lastNSecs) / 1e4;
-  if (dt < 0 && options.clockseq === void 0) {
-    clockseq = clockseq + 1 & 16383;
-  }
-  if ((dt < 0 || msecs > _lastMSecs) && options.nsecs === void 0) {
-    nsecs = 0;
-  }
-  if (nsecs >= 1e4) {
-    throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");
-  }
-  _lastMSecs = msecs;
-  _lastNSecs = nsecs;
-  _clockseq = clockseq;
-  msecs += 122192928e5;
-  var tl = ((msecs & 268435455) * 1e4 + nsecs) % 4294967296;
-  b2[i++] = tl >>> 24 & 255;
-  b2[i++] = tl >>> 16 & 255;
-  b2[i++] = tl >>> 8 & 255;
-  b2[i++] = tl & 255;
-  var tmh = msecs / 4294967296 * 1e4 & 268435455;
-  b2[i++] = tmh >>> 8 & 255;
-  b2[i++] = tmh & 255;
-  b2[i++] = tmh >>> 24 & 15 | 16;
-  b2[i++] = tmh >>> 16 & 255;
-  b2[i++] = clockseq >>> 8 | 128;
-  b2[i++] = clockseq & 255;
-  for (var n2 = 0; n2 < 6; ++n2) {
-    b2[i + n2] = node[n2];
-  }
-  return buf ? buf : bytesToUuid$1(b2);
-}
-var v1_1 = v1$1;
-var rng = rngBrowser.exports;
-var bytesToUuid = bytesToUuid_1;
-function v4$1(options, buf, offset2) {
-  var i = buf && offset2 || 0;
-  if (typeof options == "string") {
-    buf = options === "binary" ? new Array(16) : null;
-    options = null;
-  }
-  options = options || {};
-  var rnds = options.random || (options.rng || rng)();
-  rnds[6] = rnds[6] & 15 | 64;
-  rnds[8] = rnds[8] & 63 | 128;
-  if (buf) {
-    for (var ii = 0; ii < 16; ++ii) {
-      buf[i + ii] = rnds[ii];
-    }
-  }
-  return buf || bytesToUuid(rnds);
-}
-var v4_1 = v4$1;
-var v1 = v1_1;
-var v4 = v4_1;
-var uuid = v4;
-uuid.v1 = v1;
-uuid.v4 = v4;
-var uuid_1 = uuid;
 const DEFAULT_LEVLE_LINE = "1px dashed #c3cdd7";
-const getFlatdata = (props, treeData = void 0, cachedSchema = []) => {
-  const { data: data2, children } = props;
-  const outputData = [];
-  let order2 = 0;
-  const schema = /* @__PURE__ */ new Map();
-  function getUid(item) {
-    let uid = null;
-    if (typeof props.nodeKey === "string") {
-      uid = item[props.nodeKey];
-    }
-    return uid || item[NODE_ATTRIBUTES.UUID] || uuid_1.v4();
-  }
-  function getCachedTreeNodeAttr(uuid2, node, attr, cachedAttr, defaultValue = void 0) {
-    const cached = (cachedSchema || []).find((item) => item[NODE_ATTRIBUTES.UUID] === uuid2);
-    let result = void 0;
-    if (cached) {
-      result = cached[cachedAttr];
-    } else {
-      result = node[attr];
-    }
-    if (result === void 0) {
-      result = defaultValue;
-    }
-    return result;
-  }
-  function isCachedTreeNodeOpened(uuid2, node) {
-    return getCachedTreeNodeAttr(uuid2, node, "isOpen", NODE_ATTRIBUTES.IS_OPEN, false);
-  }
-  function isCachedTreeNodeChecked(uuid2, node) {
-    return getCachedTreeNodeAttr(uuid2, node, "checked", NODE_ATTRIBUTES.CHECKED, false);
-  }
-  function isCachedTreeNodeMatch(uuid2, node) {
-    return getCachedTreeNodeAttr(uuid2, node, "isMatch", NODE_ATTRIBUTES.IS_MATCH, true);
-  }
-  function flatten(array, depth = 0, parent = null, path = null) {
-    const arrLength = array.length;
-    for (let i = 0; i < arrLength; i++) {
-      const item = array[i];
-      if (Array.isArray(item)) {
-        flatten(item, depth, parent, path);
-      } else {
-        if (typeof item === "object" && item !== null) {
-          const uuid2 = getUid(item);
-          const currentPath = path !== null ? `${path}-${i}` : `${i}`;
-          const hasChildren = !!(item[children] || []).length;
-          const attrs = {
-            [NODE_ATTRIBUTES.DEPTH]: depth,
-            [NODE_ATTRIBUTES.INDEX]: i,
-            [NODE_ATTRIBUTES.UUID]: uuid2,
-            [NODE_ATTRIBUTES.PARENT_ID]: parent,
-            [NODE_ATTRIBUTES.HAS_CHILD]: hasChildren,
-            [NODE_ATTRIBUTES.PATH]: currentPath,
-            [NODE_ATTRIBUTES.IS_ROOT]: parent === null,
-            [NODE_ATTRIBUTES.ORDER]: order2,
-            [NODE_ATTRIBUTES.IS_MATCH]: isCachedTreeNodeMatch(uuid2, item),
-            [NODE_ATTRIBUTES.IS_OPEN]: isCachedTreeNodeOpened(uuid2, item),
-            [NODE_ATTRIBUTES.CHECKED]: isCachedTreeNodeChecked(uuid2, item),
-            [children]: null
-          };
-          Object.assign(item, { [NODE_ATTRIBUTES.UUID]: uuid2 });
-          schema.set(uuid2, attrs);
-          order2 += 1;
-          outputData.push(__spreadProps(__spreadValues({}, item), {
-            [children]: null
-          }));
-          if (Object.prototype.hasOwnProperty.call(item, children)) {
-            flatten(item[children] || [], depth + 1, uuid2, currentPath);
-          }
-        }
-      }
-    }
-  }
-  flatten(treeData ? treeData : data2);
-  return [outputData, schema];
-};
 const getPropsOneOfBoolValueWithDefault = (props, key, item = null, defaultTrueValue = null, defaultFalseValue = null, args = []) => {
   const prop = props[key];
   if (typeof prop === "boolean") {
@@ -21368,19 +21190,20 @@ const getNodeItemStyle = (item, props, flatData = {}) => {
   } : {});
 };
 const getNodeItemClass = (item, schema, props) => {
-  const { __isRoot, __isOpen } = getSchemaVal(schema, item[NODE_ATTRIBUTES.UUID]) || {};
+  const { __is_root, __is_open } = getSchemaVal(schema, item[NODE_ATTRIBUTES.UUID]) || {};
   return {
-    "is-root": __isRoot,
+    "is-root": __is_root,
     "bk-tree-node": true,
-    "is-open": __isOpen,
+    "is-open": __is_open,
     "is-virtual-render": props.virtualRender,
     "level-line": props.levelLine
   };
 };
 const getNodeRowClass = (item, schema) => {
-  const { __checked } = getSchemaVal(schema, item[NODE_ATTRIBUTES.UUID]) || {};
+  const { __is_checked, __is_selected } = getSchemaVal(schema, item[NODE_ATTRIBUTES.UUID]) || {};
   return {
-    "is-checked": __checked,
+    "is-checked": __is_checked,
+    "is-selected": __is_selected,
     [resolveClassName("node-row")]: true
   };
 };
@@ -21395,7 +21218,20 @@ const assignTreeNode = (path, treeData, childKey, assignVal) => {
   }, treeData);
   Object.assign(targetNode, assignVal || {});
 };
-var useAsync = (props, flatData) => {
+const resolveNodeItem = (node) => {
+  if (node === void 0 || node === null) {
+    return { __IS_NULL: true };
+  }
+  if (typeof node === "string") {
+    return { [NODE_ATTRIBUTES.UUID]: node };
+  }
+  if (Object.prototype.hasOwnProperty.call(node, NODE_ATTRIBUTES.UUID)) {
+    return node;
+  }
+  console.error("setNodeAction Error: node id cannot found");
+  return node;
+};
+var useNodeAsync = (props, flatData) => {
   const {
     setNodeAttr,
     getNodePath,
@@ -21403,7 +21239,7 @@ var useAsync = (props, flatData) => {
   } = useNodeAttribute(flatData);
   const setNodeRemoteLoad = (resp, item) => {
     if (typeof resp === "object" && resp !== null) {
-      setNodeAttr(item, NODE_ATTRIBUTES.IS_OPEN, true);
+      setNodeAttr(item, NODE_ATTRIBUTES.IS_OPENED, true);
       const nodeValue = Array.isArray(resp) ? resp : [resp];
       updateTreeNode(getNodePath(item), props.data, props.children, props.children, nodeValue);
     }
@@ -21448,25 +21284,25 @@ var useAsync = (props, flatData) => {
     deepAutoOpen
   };
 };
-var useNodeAction = (props, ctx, flatData, renderData) => {
-  const checkedNodes = [];
+var useNodeAction = (props, ctx, flatData, renderData, schemaValues) => {
+  let selectedNodeId = null;
   const {
     setNodeAttr,
     getNodePath,
     getSchemaVal: getSchemaVal2,
     getNodeAttr: getNodeAttr2,
+    getNodeId,
     isRootNode,
     hasChildNode,
     isItemOpen,
     isNodeOpened,
     isNodeChecked,
-    isNodeMatched,
-    schemaValues
+    isNodeMatched
   } = useNodeAttribute(flatData);
   const {
     asyncNodeClick,
     deepAutoOpen
-  } = useAsync(props, flatData);
+  } = useNodeAsync(props, flatData);
   const getRootIcon = (item) => isItemOpen(item) ? createVNode(folderShapeOpen, {
     "class": resolveClassName("tree-icon")
   }, null) : createVNode(folder, {
@@ -21535,7 +21371,7 @@ var useNodeAction = (props, ctx, flatData, renderData) => {
   };
   const setNodeOpened = (item, isOpen = null, e = null, fireEmit = true) => {
     const newVal = isOpen === null ? !isItemOpen(item) : !!isOpen;
-    setNodeAttr(item, NODE_ATTRIBUTES.IS_OPEN, newVal);
+    setNodeAttr(item, NODE_ATTRIBUTES.IS_OPENED, newVal);
     if (fireEmit) {
       const emitEvent = isItemOpen(item) ? EVENTS.NODE_EXPAND : EVENTS.NODE_COLLAPSE;
       ctx.emit(emitEvent, resolveScopedSlotParam(item), getSchemaVal2(item[NODE_ATTRIBUTES.UUID]), e);
@@ -21543,7 +21379,33 @@ var useNodeAction = (props, ctx, flatData, renderData) => {
     if (newVal) {
       return;
     }
-    renderData.value.filter((node) => String.prototype.startsWith.call(getNodePath(node), getNodePath(item))).forEach((filterNode) => setNodeAttr(filterNode, NODE_ATTRIBUTES.IS_OPEN, newVal));
+    renderData.value.filter((node) => String.prototype.startsWith.call(getNodePath(node), getNodePath(item))).forEach((filterNode) => setNodeAttr(filterNode, NODE_ATTRIBUTES.IS_OPENED, newVal));
+  };
+  const setNodeAction = (args, action, value) => {
+    if (Array.isArray(args)) {
+      args.forEach((node) => setNodeAttr(resolveNodeItem(node), action, value));
+      return;
+    }
+    setNodeAttr(resolveNodeItem(args), action, value);
+  };
+  const setOpen = (item, isOpen = true, autoOpenParents = false) => {
+    const resolvedItem = resolveNodeItem(item);
+    if (resolvedItem[NODE_ATTRIBUTES.IS_NULL]) {
+      return;
+    }
+    if (autoOpenParents) {
+      if (isOpen) {
+        setNodeAction(resolvedItem, NODE_ATTRIBUTES.IS_OPENED, isOpen);
+        if (!isRootNode(resolvedItem)) {
+          const parentId = getNodeAttr2(resolvedItem, NODE_ATTRIBUTES.PARENT_ID);
+          setOpen(parentId, true, true);
+        }
+      } else {
+        setNodeOpened(resolvedItem, false, null, false);
+      }
+    } else {
+      setNodeAction(resolvedItem, NODE_ATTRIBUTES.IS_OPENED, isOpen);
+    }
   };
   const hanldeTreeNodeClick = (item, e) => {
     asyncNodeClick(item);
@@ -21555,17 +21417,28 @@ var useNodeAction = (props, ctx, flatData, renderData) => {
     e.preventDefault();
     hanldeTreeNodeClick(node, e);
   };
-  const handleNodeContentClick = (item, e) => {
-    if (!checkedNodes.includes(item[NODE_ATTRIBUTES.UUID])) {
-      checkedNodes.forEach((__uuid) => setNodeAttr({
-        __uuid
-      }, NODE_ATTRIBUTES.CHECKED, false));
-      checkedNodes.length = 0;
-      setNodeAttr(item, NODE_ATTRIBUTES.CHECKED, true);
-      checkedNodes.push(item[NODE_ATTRIBUTES.UUID]);
-      if (!isNodeOpened(item)) {
-        hanldeTreeNodeClick(item, e);
+  const setSelect = (uuid2, selected = true, autoOpen = true) => {
+    const resolvedItem = resolveNodeItem(uuid2);
+    if (resolvedItem[NODE_ATTRIBUTES.IS_NULL]) {
+      return;
+    }
+    if (props.selectable) {
+      if (selectedNodeId !== null) {
+        setNodeAttr({
+          [NODE_ATTRIBUTES.UUID]: selectedNodeId
+        }, NODE_ATTRIBUTES.IS_SELECTED, !selected);
       }
+      setNodeAttr(resolvedItem, NODE_ATTRIBUTES.IS_SELECTED, selected);
+      selectedNodeId = getNodeId(resolvedItem);
+    }
+    if (autoOpen) {
+      setOpen(uuid2, true, true);
+    }
+  };
+  const handleNodeContentClick = (item, e) => {
+    setSelect(item);
+    if (!isNodeOpened(item)) {
+      hanldeTreeNodeClick(item, e);
     }
     ctx.emit(EVENTS.NODE_CLICK, resolveScopedSlotParam(item), getSchemaVal2(item[NODE_ATTRIBUTES.UUID]), e);
   };
@@ -21608,6 +21481,7 @@ var useNodeAction = (props, ctx, flatData, renderData) => {
   const renderTreeNode = (item) => {
     var _a, _b, _c, _d, _e;
     return createVNode("div", {
+      "data-tree-node": getNodeId(item),
       "class": getNodeRowClass(item, flatData.schema)
     }, [createVNode("div", {
       "class": getNodeItemClass(item, flatData.schema, props),
@@ -21626,8 +21500,130 @@ var useNodeAction = (props, ctx, flatData, renderData) => {
     renderTreeNode,
     hanldeTreeNodeClick,
     deepAutoOpen,
-    setNodeOpened
+    setNodeAction,
+    setNodeOpened,
+    setSelect,
+    setOpen
+  };
+};
+var useNodeDrag = (props, root, flatData) => {
+  const {
+    getSourceNodeByUID,
+    getNodeParentIdById,
+    getParentNodeData,
+    getNodeAttr: getNodeAttr2,
+    getNodePath,
+    isRootNode
+  } = useNodeAttribute(flatData, props);
+  const getTargetTreeNode = (e) => {
+    const target = e.target;
+    return target.closest("[data-tree-node]");
+  };
+  const handleTreeNodeMouseup = (e) => {
+    const targetNode = getTargetTreeNode(e);
+    targetNode.removeEventListener("mouseup", handleTreeNodeMouseup);
+  };
+  const handleTreeNodeMousedown = (e) => {
+    const targetNode = getTargetTreeNode(e);
+    targetNode.setAttribute("draggable", "true");
+    targetNode.addEventListener("mouseup", handleTreeNodeMouseup);
+  };
+  const handleTreeNodeDragover = (e) => {
+    e.preventDefault();
+    const targetNode = getTargetTreeNode(e);
+    const sourceNodeId = e.dataTransfer.getData("node-id");
+    const targetNodeId = targetNode.getAttribute("data-tree-node");
+    const transferEffect = isNodeSortable(sourceNodeId, targetNodeId) ? "move" : "none";
+    e.dataTransfer.effectAllowed = transferEffect;
+    e.dataTransfer.dropEffect = transferEffect;
+  };
+  const handleTreeNodeDragStart = (e) => {
+    e.dataTransfer.effectAllowed = "move";
+    e.dataTransfer.dropEffect = "move";
+    const targetNode = getTargetTreeNode(e);
+    e.dataTransfer.setData("text/plain", "");
+    e.dataTransfer.setData("node-id", targetNode.getAttribute("data-tree-node"));
+  };
+  const handleTreeNodeDrop = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const targetNode = getTargetTreeNode(e);
+    const sourceNodeId = e.dataTransfer.getData("node-id");
+    const targetNodeId = targetNode.getAttribute("data-tree-node");
+    Reflect.apply(props.dragSort ? dragSortData : dragAsChildNode, globalThis, [sourceNodeId, targetNodeId]);
+  };
+  const isNodeSortable = (sourceId, tartgetId) => {
+    const sourcePath = getNodePath({
+      [NODE_ATTRIBUTES.UUID]: sourceId
+    });
+    const targetPath = getNodePath({
+      [NODE_ATTRIBUTES.UUID]: tartgetId
+    });
+    const sourceParentNodeId = getNodeParentIdById(sourceId);
+    const targetParentNode = getNodeParentIdById(tartgetId);
+    if (sourceParentNodeId === targetParentNode) {
+      return true;
+    }
+    return sourcePath.indexOf(targetPath) === -1 && targetPath.indexOf(sourcePath) === -1;
+  };
+  const dragSortData = (sourceId, tartgetId) => {
+    if (!isNodeSortable(sourceId, tartgetId)) {
+      return;
+    }
+    const sourceNodeData = JSON.parse(JSON.stringify(getSourceNodeByUID(sourceId)));
+    const targetNodeData = JSON.parse(JSON.stringify(getSourceNodeByUID(tartgetId)));
+    const sourceNodeParent = getParentNodeData(sourceId);
+    const targetNodeParent = getParentNodeData(tartgetId);
+    const sourceNodeIndex = getNodeAttr2({
+      [NODE_ATTRIBUTES.UUID]: sourceId
+    }, NODE_ATTRIBUTES.INDEX);
+    const targetNodeIndex = getNodeAttr2({
+      [NODE_ATTRIBUTES.UUID]: tartgetId
+    }, NODE_ATTRIBUTES.INDEX);
+    sourceNodeParent == null ? void 0 : sourceNodeParent[props.children].splice(sourceNodeIndex, 1, targetNodeData);
+    targetNodeParent == null ? void 0 : targetNodeParent[props.children].splice(targetNodeIndex, 1, sourceNodeData);
+  };
+  const dragAsChildNode = (sourceNodeId, targetNodeId) => {
+    const sourceNodeData = getSourceNodeByUID(sourceNodeId);
+    const targetNodeData = getSourceNodeByUID(targetNodeId);
+    let parentNode = null;
+    if (isRootNode({
+      [NODE_ATTRIBUTES.UUID]: sourceNodeId
+    })) {
+      parentNode = props.data;
+    } else {
+      const sourceNodeParentId = getNodeParentIdById(sourceNodeId);
+      if (sourceNodeParentId !== void 0 && sourceNodeParentId !== null) {
+        parentNode = getSourceNodeByUID(sourceNodeParentId);
+        const sourceNodeIndex = getNodeAttr2({
+          [NODE_ATTRIBUTES.UUID]: sourceNodeId
+        }, NODE_ATTRIBUTES.INDEX);
+        parentNode == null ? void 0 : parentNode[props.children].splice(sourceNodeIndex, 1);
+      }
+    }
+    if (!targetNodeData[props.children]) {
+      targetNodeData[props.children] = [];
+    }
+    targetNodeData[props.children].unshift(sourceNodeData);
   };
+  onMounted(() => {
+    if (props.draggable && root.value) {
+      const rootTree = root.value.$el;
+      rootTree.addEventListener("mousedown", handleTreeNodeMousedown);
+      rootTree.addEventListener("dragstart", handleTreeNodeDragStart);
+      rootTree.addEventListener("dragover", handleTreeNodeDragover);
+      rootTree.addEventListener("drop", handleTreeNodeDrop);
+    }
+  });
+  onUnmounted(() => {
+    if (props.draggable && root.value) {
+      const rootTree = root.value.$el;
+      rootTree.removeEventListener("mousedown", handleTreeNodeMousedown);
+      rootTree.removeEventListener("dragstart", handleTreeNodeDragStart);
+      rootTree.removeEventListener("dragover", handleTreeNodeDragover);
+      rootTree.removeEventListener("drop", handleTreeNodeDrop);
+    }
+  });
 };
 var useSearch = (props) => {
   var _a;
@@ -21671,20 +21667,272 @@ var useSearch = (props) => {
     isTreeUI
   };
 };
+var rngBrowser = { exports: {} };
+var getRandomValues = typeof crypto != "undefined" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto != "undefined" && typeof window.msCrypto.getRandomValues == "function" && msCrypto.getRandomValues.bind(msCrypto);
+if (getRandomValues) {
+  var rnds8 = new Uint8Array(16);
+  rngBrowser.exports = function whatwgRNG() {
+    getRandomValues(rnds8);
+    return rnds8;
+  };
+} else {
+  var rnds = new Array(16);
+  rngBrowser.exports = function mathRNG() {
+    for (var i = 0, r2; i < 16; i++) {
+      if ((i & 3) === 0)
+        r2 = Math.random() * 4294967296;
+      rnds[i] = r2 >>> ((i & 3) << 3) & 255;
+    }
+    return rnds;
+  };
+}
+var byteToHex = [];
+for (var i = 0; i < 256; ++i) {
+  byteToHex[i] = (i + 256).toString(16).substr(1);
+}
+function bytesToUuid$2(buf, offset2) {
+  var i = offset2 || 0;
+  var bth = byteToHex;
+  return [
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]]
+  ].join("");
+}
+var bytesToUuid_1 = bytesToUuid$2;
+var rng$1 = rngBrowser.exports;
+var bytesToUuid$1 = bytesToUuid_1;
+var _nodeId;
+var _clockseq;
+var _lastMSecs = 0;
+var _lastNSecs = 0;
+function v1$1(options, buf, offset2) {
+  var i = buf && offset2 || 0;
+  var b2 = buf || [];
+  options = options || {};
+  var node = options.node || _nodeId;
+  var clockseq = options.clockseq !== void 0 ? options.clockseq : _clockseq;
+  if (node == null || clockseq == null) {
+    var seedBytes = rng$1();
+    if (node == null) {
+      node = _nodeId = [
+        seedBytes[0] | 1,
+        seedBytes[1],
+        seedBytes[2],
+        seedBytes[3],
+        seedBytes[4],
+        seedBytes[5]
+      ];
+    }
+    if (clockseq == null) {
+      clockseq = _clockseq = (seedBytes[6] << 8 | seedBytes[7]) & 16383;
+    }
+  }
+  var msecs = options.msecs !== void 0 ? options.msecs : new Date().getTime();
+  var nsecs = options.nsecs !== void 0 ? options.nsecs : _lastNSecs + 1;
+  var dt = msecs - _lastMSecs + (nsecs - _lastNSecs) / 1e4;
+  if (dt < 0 && options.clockseq === void 0) {
+    clockseq = clockseq + 1 & 16383;
+  }
+  if ((dt < 0 || msecs > _lastMSecs) && options.nsecs === void 0) {
+    nsecs = 0;
+  }
+  if (nsecs >= 1e4) {
+    throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");
+  }
+  _lastMSecs = msecs;
+  _lastNSecs = nsecs;
+  _clockseq = clockseq;
+  msecs += 122192928e5;
+  var tl = ((msecs & 268435455) * 1e4 + nsecs) % 4294967296;
+  b2[i++] = tl >>> 24 & 255;
+  b2[i++] = tl >>> 16 & 255;
+  b2[i++] = tl >>> 8 & 255;
+  b2[i++] = tl & 255;
+  var tmh = msecs / 4294967296 * 1e4 & 268435455;
+  b2[i++] = tmh >>> 8 & 255;
+  b2[i++] = tmh & 255;
+  b2[i++] = tmh >>> 24 & 15 | 16;
+  b2[i++] = tmh >>> 16 & 255;
+  b2[i++] = clockseq >>> 8 | 128;
+  b2[i++] = clockseq & 255;
+  for (var n2 = 0; n2 < 6; ++n2) {
+    b2[i + n2] = node[n2];
+  }
+  return buf ? buf : bytesToUuid$1(b2);
+}
+var v1_1 = v1$1;
+var rng = rngBrowser.exports;
+var bytesToUuid = bytesToUuid_1;
+function v4$1(options, buf, offset2) {
+  var i = buf && offset2 || 0;
+  if (typeof options == "string") {
+    buf = options === "binary" ? new Array(16) : null;
+    options = null;
+  }
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)();
+  rnds[6] = rnds[6] & 15 | 64;
+  rnds[8] = rnds[8] & 63 | 128;
+  if (buf) {
+    for (var ii = 0; ii < 16; ++ii) {
+      buf[i + ii] = rnds[ii];
+    }
+  }
+  return buf || bytesToUuid(rnds);
+}
+var v4_1 = v4$1;
+var v1 = v1_1;
+var v4 = v4_1;
+var uuid = v4;
+uuid.v1 = v1;
+uuid.v4 = v4;
+var uuid_1 = uuid;
+var useTreeInit = (props) => {
+  var _a;
+  const getFlatdata = (props2, treeData = void 0, cachedSchema = []) => {
+    const {
+      data: data2,
+      children
+    } = props2;
+    const outputData = [];
+    let order2 = 0;
+    const schema = /* @__PURE__ */ new Map();
+    function getUid(item) {
+      let uid = null;
+      if (typeof props2.nodeKey === "string") {
+        uid = item[props2.nodeKey];
+      }
+      return uid || item[NODE_ATTRIBUTES.UUID] || uuid_1.v4();
+    }
+    function getCachedTreeNodeAttr(uuid2, node, attr, cachedAttr, defVal = void 0) {
+      const cached = (cachedSchema || []).find((item) => item[NODE_ATTRIBUTES.UUID] === uuid2);
+      let result = void 0;
+      if (cached) {
+        result = cached[cachedAttr];
+      } else {
+        result = node[attr];
+      }
+      if (result === void 0) {
+        result = defVal;
+      }
+      return result;
+    }
+    function isCachedTreeNodeOpened(uuid2, node) {
+      return getCachedTreeNodeAttr(uuid2, node, "isOpen", NODE_ATTRIBUTES.IS_OPENED, false);
+    }
+    function isCachedTreeNodeChecked(uuid2, node) {
+      return getCachedTreeNodeAttr(uuid2, node, "checked", NODE_ATTRIBUTES.IS_CHECKED, false);
+    }
+    function isCachedTreeNodeMatch(uuid2, node) {
+      return getCachedTreeNodeAttr(uuid2, node, "isMatch", NODE_ATTRIBUTES.IS_MATCH, true);
+    }
+    function isCachedTreeNodeSelected(uuid2, node) {
+      return getCachedTreeNodeAttr(uuid2, node, "isSelected", NODE_ATTRIBUTES.IS_SELECTED, false);
+    }
+    function flatten(array, depth = 0, parent = null, path = null) {
+      const arrLength = array.length;
+      for (let i = 0; i < arrLength; i++) {
+        const item = array[i];
+        if (Array.isArray(item)) {
+          flatten(item, depth, parent, path);
+        } else {
+          if (typeof item === "object" && item !== null) {
+            const uuid2 = getUid(item);
+            const currentPath = path !== null ? `${path}-${i}` : `${i}`;
+            const hasChildren = !!(item[children] || []).length;
+            const attrs = {
+              [NODE_ATTRIBUTES.DEPTH]: depth,
+              [NODE_ATTRIBUTES.INDEX]: i,
+              [NODE_ATTRIBUTES.UUID]: uuid2,
+              [NODE_ATTRIBUTES.PARENT_ID]: parent,
+              [NODE_ATTRIBUTES.HAS_CHILD]: hasChildren,
+              [NODE_ATTRIBUTES.PATH]: currentPath,
+              [NODE_ATTRIBUTES.IS_ROOT]: parent === null,
+              [NODE_ATTRIBUTES.ORDER]: order2,
+              [NODE_ATTRIBUTES.IS_SELECTED]: props2.selectable ? isCachedTreeNodeSelected(uuid2, item) : false,
+              [NODE_ATTRIBUTES.IS_MATCH]: isCachedTreeNodeMatch(uuid2, item),
+              [NODE_ATTRIBUTES.IS_OPENED]: isCachedTreeNodeOpened(uuid2, item),
+              [NODE_ATTRIBUTES.IS_CHECKED]: isCachedTreeNodeChecked(uuid2, item),
+              [children]: null
+            };
+            Object.assign(item, {
+              [NODE_ATTRIBUTES.UUID]: uuid2
+            });
+            schema.set(uuid2, attrs);
+            order2 += 1;
+            outputData.push(__spreadProps(__spreadValues({}, item), {
+              [children]: null
+            }));
+            if (Object.prototype.hasOwnProperty.call(item, children)) {
+              flatten(item[children] || [], depth + 1, uuid2, currentPath);
+            }
+          }
+        }
+      }
+    }
+    flatten(treeData ? treeData : data2);
+    return [outputData, schema];
+  };
+  const formatData = getFlatdata(props);
+  const flatData = reactive({
+    data: formatData[0],
+    schema: formatData[1],
+    levelLineSchema: {}
+  });
+  const schemaValues = computed(() => Array.from(flatData.schema.values()));
+  const {
+    asyncNodeClick,
+    deepAutoOpen
+  } = useNodeAsync(props, flatData);
+  watch(() => [props.data], (newData) => {
+    var _a2, _b;
+    const formatData2 = getFlatdata(props, newData, schemaValues.value);
+    flatData.data = formatData2[0];
+    flatData.schema = formatData2[1];
+    if (((_a2 = props.async) == null ? void 0 : _a2.callback) && ((_b = props.async) == null ? void 0 : _b.deepAutoOpen) === "every") {
+      deepAutoOpen();
+    }
+  }, {
+    deep: true
+  });
+  if ((_a = props.async) == null ? void 0 : _a.callback) {
+    deepAutoOpen();
+  }
+  return {
+    flatData,
+    schemaValues,
+    asyncNodeClick,
+    deepAutoOpen
+  };
+};
 var Component$1 = defineComponent({
   name: "Tree",
   props: treeProps,
   emits: [EVENTS.NODE_CLICK, EVENTS.NODE_COLLAPSE, EVENTS.NODE_EXPAND],
   setup(props, ctx) {
-    var _a;
-    const formatData = getFlatdata(props);
-    const flatData = reactive({
-      data: formatData[0],
-      schema: formatData[1],
-      levelLineSchema: {}
-    });
     const {
-      schemaValues,
+      flatData,
+      schemaValues
+    } = useTreeInit(props);
+    const {
       setNodeAttr,
       checkNodeIsOpen,
       getNodeAttr: getNodeAttr2,
@@ -21725,68 +21973,22 @@ var Component$1 = defineComponent({
     const {
       renderTreeNode,
       hanldeTreeNodeClick,
-      deepAutoOpen,
-      setNodeOpened
-    } = useNodeAction(props, ctx, flatData, renderData);
-    if ((_a = props.async) == null ? void 0 : _a.callback) {
-      deepAutoOpen();
-    }
-    watch(() => [props.data], (newData) => {
-      var _a2, _b;
-      const formatData2 = getFlatdata(props, newData, schemaValues.value);
-      flatData.data = formatData2[0];
-      flatData.schema = formatData2[1];
-      if (((_a2 = props.async) == null ? void 0 : _a2.callback) && ((_b = props.async) == null ? void 0 : _b.deepAutoOpen) === "every") {
-        deepAutoOpen();
-      }
-    }, {
-      deep: true
-    });
-    const resolveNodeItem = (node) => {
-      if (typeof node === "string") {
-        return {
-          [NODE_ATTRIBUTES.UUID]: node
-        };
-      }
-      if (Object.prototype.hasOwnProperty.call(node, NODE_ATTRIBUTES.UUID)) {
-        return node;
-      }
-      console.error("setNodeAction Error: node id cannot found");
-      return node;
-    };
-    const setNodeAction = (args, action, value) => {
-      if (Array.isArray(args)) {
-        args.forEach((node) => setNodeAttr(resolveNodeItem(node), action, value));
-        return;
-      }
-      setNodeAttr(resolveNodeItem(args), action, value);
-    };
-    const setOpen = (item, isOpen = true, autoOpenParents = false) => {
-      const resolvedItem = resolveNodeItem(item);
-      if (autoOpenParents) {
-        if (isOpen) {
-          setNodeAction(resolvedItem, NODE_ATTRIBUTES.IS_OPEN, isOpen);
-          if (!isRootNode(resolvedItem)) {
-            const parentId = getNodeAttr2(resolvedItem, NODE_ATTRIBUTES.PARENT_ID);
-            setOpen(parentId, true, true);
-          }
-        } else {
-          setNodeOpened(resolvedItem, false, null, false);
-        }
-      } else {
-        setNodeAction(resolvedItem, NODE_ATTRIBUTES.IS_OPEN, isOpen);
-      }
-    };
+      setNodeOpened,
+      setOpen,
+      setNodeAction,
+      setSelect
+    } = useNodeAction(props, ctx, flatData, renderData, schemaValues);
     const setChecked = (item, checked = true) => {
-      setNodeAction(resolveNodeItem(item), NODE_ATTRIBUTES.CHECKED, checked);
-    };
-    const setSelect = (item, fireOther = true) => {
-      var _a2;
-      if (fireOther) {
-        setChecked((_a2 = schemaValues.value.filter((item2) => isNodeChecked(item2))) != null ? _a2 : [], false);
-      }
-      setChecked(item, true);
+      setNodeAction(resolveNodeItem(item), NODE_ATTRIBUTES.IS_CHECKED, checked);
     };
+    if (props.selectable) {
+      watch(() => props.selected, (newData) => {
+        setSelect(newData, true, true);
+      }, {
+        immediate: true
+      });
+    }
+    const getData = () => flatData;
     ctx.expose({
       hanldeTreeNodeClick,
       isNodeChecked,
@@ -21798,12 +22000,14 @@ var Component$1 = defineComponent({
       setChecked,
       setNodeAction,
       setNodeOpened,
-      setSelect
+      setSelect,
+      getData
     });
     const root = ref();
     const {
       renderEmpty
     } = useEmpty(props, ctx);
+    useNodeDrag(props, root, flatData);
     const renderTreeContent = (scopedData) => {
       if (scopedData.length) {
         return scopedData.map(renderTreeNode);