vft 0.0.362 → 0.0.363

package/lib/components/tree/model/tree-store.cjs

@@ -1 +1,317 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("@vft/utils"),N=require("./node.cjs"),C=require("./util.cjs");class y{currentNode;currentNodeKey;nodesMap;root;data;lazy;load;filterNodeMethod;key;defaultCheckedKeys;checkStrictly;defaultExpandedKeys;autoExpandParent;defaultExpandAll;checkDescendants;props;constructor(e){this.currentNode=null,this.currentNodeKey=null;for(const t in e)l.hasOwn(e,t)&&(this[t]=e[t]);this.nodesMap={}}initialize(){if(this.root=new N.default({data:this.data,store:this}),this.root.initialize(),this.lazy&&this.load){const e=this.load;e(this.root,t=>{this.root.doCreateChildren(t),this._initDefaultCheckedNodes()})}else this._initDefaultCheckedNodes()}filter(e){const t=this.filterNodeMethod,s=this.lazy,o=function(i){const r=i.root?i.root.childNodes:i.childNodes;if(r.forEach(d=>{d.visible=t.call(d,e,d.data,d),o(d)}),!i.visible&&r.length){let d=!0;d=!r.some(c=>c.visible),i.root?i.root.visible=d===!1:i.visible=d===!1}e&&i.visible&&!i.isLeaf&&!s&&i.expand()};o(this)}setData(e){e!==this.root.data?(this.root.setData(e),this._initDefaultCheckedNodes()):this.root.updateChildren()}getNode(e){if(e instanceof N.default)return e;const t=l.isObject(e)?C.getNodeKey(this.key,e):e;return this.nodesMap[t]||null}insertBefore(e,t){const s=this.getNode(t);s.parent.insertBefore({data:e},s)}insertAfter(e,t){const s=this.getNode(t);s.parent.insertAfter({data:e},s)}updateNode(e,t){const s=this.getNode(t);s&&s.updateNode(e,s)}remove(e){const t=this.getNode(e);t&&t.parent&&(t===this.currentNode&&(this.currentNode=null),t.parent.removeChild(t))}append(e,t){const s=t?this.getNode(t):this.root;s&&s.insertChild({data:e})}updateChildren(e,t){const s=this.nodesMap[e];if(!s)return;const o=s.childNodes;for(let i=o.length-1;i>=0;i--){const r=o[i];this.remove(r.data)}for(let i=0,r=t.length;i<r;i++){const d=t[i];this.append(d,s.data)}}_initDefaultCheckedNodes(){const e=this.defaultCheckedKeys||[],t=this.nodesMap;e.forEach(s=>{const o=t[s];o&&o.setChecked(!0,!this.checkStrictly)})}_initDefaultCheckedNode(e){(this.defaultCheckedKeys||[]).includes(e.key)&&e.setChecked(!0,!this.checkStrictly)}setDefaultCheckedKey(e){e!==this.defaultCheckedKeys&&(this.defaultCheckedKeys=e,this._initDefaultCheckedNodes())}registerNode(e){const t=this.key;!e||!e.data||(t?e.key!==void 0&&(this.nodesMap[e.key]=e):this.nodesMap[e.id]=e)}deregisterNode(e){!this.key||!e||!e.data||(e.childNodes.forEach(s=>{this.deregisterNode(s)}),delete this.nodesMap[e.key])}getCheckedNodes(e=!1,t=!1){const s=[],o=function(i){(i.root?i.root.childNodes:i.childNodes).forEach(d=>{(d.checked||t&&d.indeterminate)&&(!e||e&&d.isLeaf)&&s.push(d.data),o(d)})};return o(this),s}getCheckedKeys(e=!1){return this.getCheckedNodes(e).map(t=>(t||{})[this.key])}getHalfCheckedNodes(){const e=[],t=function(s){(s.root?s.root.childNodes:s.childNodes).forEach(i=>{i.indeterminate&&e.push(i.data),t(i)})};return t(this),e}getHalfCheckedKeys(){return this.getHalfCheckedNodes().map(e=>(e||{})[this.key])}_getAllNodes(){const e=[],t=this.nodesMap;for(const s in t)l.hasOwn(t,s)&&e.push(t[s]);return e}_setCheckedKeys(e,t=!1,s){const o=this._getAllNodes().sort((d,c)=>c.level-d.level),i=Object.create(null),r=Object.keys(s);o.forEach(d=>d.setChecked(!1,!1));for(let d=0,c=o.length;d<c;d++){const n=o[d],u=n.data[e].toString();if(!r.includes(u)){n.checked&&!i[u]&&n.setChecked(!1,!1);continue}let h=n.parent;for(;h&&h.level>0;)i[h.data[e]]=!0,h=h.parent;if(n.isLeaf||this.checkStrictly){n.setChecked(!0,!1);continue}if(n.setChecked(!0,!0),t){n.setChecked(!1,!1);const f=function(k){k.childNodes.forEach(a=>{a.isLeaf||a.setChecked(!1,!1),f(a)})};f(n)}}}setCheckedNodes(e,t=!1){const s=this.key,o={};e.forEach(i=>{o[(i||{})[s]]=!0}),this._setCheckedKeys(s,t,o)}setCheckedKeys(e,t=!1){this.defaultCheckedKeys=e;const s=this.key,o={};e.forEach(i=>{o[i]=!0}),this._setCheckedKeys(s,t,o)}setDefaultExpandedKeys(e){e=e||[],this.defaultExpandedKeys=e,e.forEach(t=>{const s=this.getNode(t);s&&s.expand(null,this.autoExpandParent)})}setChecked(e,t,s){const o=this.getNode(e);o&&o.setChecked(!!t,s)}getCurrentNode(){return this.currentNode}setCurrentNode(e){const t=this.currentNode;t&&(t.isCurrent=!1),this.currentNode=e,this.currentNode.isCurrent=!0}setUserCurrentNode(e,t=!0){const s=e[this.key],o=this.nodesMap[s];this.setCurrentNode(o),t&&this.currentNode.level>1&&this.currentNode.parent.expand(null,!0)}setCurrentNodeKey(e,t=!0){if(e==null){this.currentNode&&(this.currentNode.isCurrent=!1),this.currentNode=null;return}const s=this.getNode(e);s&&(this.setCurrentNode(s),t&&this.currentNode.level>1&&this.currentNode.parent.expand(null,!0))}}exports.default=y;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const utils = require("@vft/utils");
+const node = require("./node.cjs");
+const util = require("./util.cjs");
+class TreeStore {
+  currentNode;
+  currentNodeKey;
+  nodesMap;
+  root;
+  data;
+  lazy;
+  load;
+  filterNodeMethod;
+  key;
+  defaultCheckedKeys;
+  checkStrictly;
+  defaultExpandedKeys;
+  autoExpandParent;
+  defaultExpandAll;
+  checkDescendants;
+  props;
+  constructor(options) {
+    this.currentNode = null;
+    this.currentNodeKey = null;
+    for (const option in options) {
+      if (utils.hasOwn(options, option)) {
+        this[option] = options[option];
+      }
+    }
+    this.nodesMap = {};
+  }
+  initialize() {
+    this.root = new node.default({
+      data: this.data,
+      store: this
+    });
+    this.root.initialize();
+    if (this.lazy && this.load) {
+      const loadFn = this.load;
+      loadFn(this.root, (data) => {
+        this.root.doCreateChildren(data);
+        this._initDefaultCheckedNodes();
+      });
+    } else {
+      this._initDefaultCheckedNodes();
+    }
+  }
+  filter(value) {
+    const filterNodeMethod = this.filterNodeMethod;
+    const lazy = this.lazy;
+    const traverse = function(node2) {
+      const childNodes = node2.root ? node2.root.childNodes : node2.childNodes;
+      childNodes.forEach((child) => {
+        child.visible = filterNodeMethod.call(child, value, child.data, child);
+        traverse(child);
+      });
+      if (!node2.visible && childNodes.length) {
+        let allHidden = true;
+        allHidden = !childNodes.some((child) => child.visible);
+        if (node2.root) {
+          node2.root.visible = allHidden === false;
+        } else {
+          node2.visible = allHidden === false;
+        }
+      }
+      if (!value) return;
+      if (node2.visible && !node2.isLeaf && !lazy)
+        node2.expand();
+    };
+    traverse(this);
+  }
+  setData(newVal) {
+    const instanceChanged = newVal !== this.root.data;
+    if (instanceChanged) {
+      this.root.setData(newVal);
+      this._initDefaultCheckedNodes();
+    } else {
+      this.root.updateChildren();
+    }
+  }
+  getNode(data) {
+    if (data instanceof node.default) return data;
+    const key = utils.isObject(data) ? util.getNodeKey(this.key, data) : data;
+    return this.nodesMap[key] || null;
+  }
+  insertBefore(data, refData) {
+    const refNode = this.getNode(refData);
+    refNode.parent.insertBefore({ data }, refNode);
+  }
+  insertAfter(data, refData) {
+    const refNode = this.getNode(refData);
+    refNode.parent.insertAfter({ data }, refNode);
+  }
+  updateNode(data, refData) {
+    const refNode = this.getNode(refData);
+    if (!refNode) return;
+    refNode.updateNode(data, refNode);
+  }
+  remove(data) {
+    const node2 = this.getNode(data);
+    if (node2 && node2.parent) {
+      if (node2 === this.currentNode) {
+        this.currentNode = null;
+      }
+      node2.parent.removeChild(node2);
+    }
+  }
+  append(data, parentData) {
+    const parentNode = parentData ? this.getNode(parentData) : this.root;
+    if (parentNode) {
+      parentNode.insertChild({ data });
+    }
+  }
+  updateChildren(key, data) {
+    const node2 = this.nodesMap[key];
+    if (!node2) return;
+    const childNodes = node2.childNodes;
+    for (let i = childNodes.length - 1; i >= 0; i--) {
+      const child = childNodes[i];
+      this.remove(child.data);
+    }
+    for (let i = 0, j = data.length; i < j; i++) {
+      const child = data[i];
+      this.append(child, node2.data);
+    }
+  }
+  _initDefaultCheckedNodes() {
+    const defaultCheckedKeys = this.defaultCheckedKeys || [];
+    const nodesMap = this.nodesMap;
+    defaultCheckedKeys.forEach((checkedKey) => {
+      const node2 = nodesMap[checkedKey];
+      if (node2) {
+        node2.setChecked(true, !this.checkStrictly);
+      }
+    });
+  }
+  _initDefaultCheckedNode(node2) {
+    const defaultCheckedKeys = this.defaultCheckedKeys || [];
+    if (defaultCheckedKeys.includes(node2.key)) {
+      node2.setChecked(true, !this.checkStrictly);
+    }
+  }
+  setDefaultCheckedKey(newVal) {
+    if (newVal !== this.defaultCheckedKeys) {
+      this.defaultCheckedKeys = newVal;
+      this._initDefaultCheckedNodes();
+    }
+  }
+  registerNode(node2) {
+    const key = this.key;
+    if (!node2 || !node2.data) return;
+    if (!key) {
+      this.nodesMap[node2.id] = node2;
+    } else {
+      const nodeKey = node2.key;
+      if (nodeKey !== void 0) this.nodesMap[node2.key] = node2;
+    }
+  }
+  deregisterNode(node2) {
+    const key = this.key;
+    if (!key || !node2 || !node2.data) return;
+    node2.childNodes.forEach((child) => {
+      this.deregisterNode(child);
+    });
+    delete this.nodesMap[node2.key];
+  }
+  getCheckedNodes(leafOnly = false, includeHalfChecked = false) {
+    const checkedNodes = [];
+    const traverse = function(node2) {
+      const childNodes = node2.root ? node2.root.childNodes : node2.childNodes;
+      childNodes.forEach((child) => {
+        if ((child.checked || includeHalfChecked && child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
+          checkedNodes.push(child.data);
+        }
+        traverse(child);
+      });
+    };
+    traverse(this);
+    return checkedNodes;
+  }
+  getCheckedKeys(leafOnly = false) {
+    return this.getCheckedNodes(leafOnly).map((data) => (data || {})[this.key]);
+  }
+  getHalfCheckedNodes() {
+    const nodes = [];
+    const traverse = function(node2) {
+      const childNodes = node2.root ? node2.root.childNodes : node2.childNodes;
+      childNodes.forEach((child) => {
+        if (child.indeterminate) {
+          nodes.push(child.data);
+        }
+        traverse(child);
+      });
+    };
+    traverse(this);
+    return nodes;
+  }
+  getHalfCheckedKeys() {
+    return this.getHalfCheckedNodes().map((data) => (data || {})[this.key]);
+  }
+  _getAllNodes() {
+    const allNodes = [];
+    const nodesMap = this.nodesMap;
+    for (const nodeKey in nodesMap) {
+      if (utils.hasOwn(nodesMap, nodeKey)) {
+        allNodes.push(nodesMap[nodeKey]);
+      }
+    }
+    return allNodes;
+  }
+  _setCheckedKeys(key, leafOnly = false, checkedKeys) {
+    const allNodes = this._getAllNodes().sort((a, b) => b.level - a.level);
+    const cache = /* @__PURE__ */ Object.create(null);
+    const keys = Object.keys(checkedKeys);
+    allNodes.forEach((node2) => node2.setChecked(false, false));
+    for (let i = 0, j = allNodes.length; i < j; i++) {
+      const node2 = allNodes[i];
+      const nodeKey = node2.data[key].toString();
+      const checked = keys.includes(nodeKey);
+      if (!checked) {
+        if (node2.checked && !cache[nodeKey]) {
+          node2.setChecked(false, false);
+        }
+        continue;
+      }
+      let parent = node2.parent;
+      while (parent && parent.level > 0) {
+        cache[parent.data[key]] = true;
+        parent = parent.parent;
+      }
+      if (node2.isLeaf || this.checkStrictly) {
+        node2.setChecked(true, false);
+        continue;
+      }
+      node2.setChecked(true, true);
+      if (leafOnly) {
+        node2.setChecked(false, false);
+        const traverse = function(node22) {
+          const childNodes = node22.childNodes;
+          childNodes.forEach((child) => {
+            if (!child.isLeaf) {
+              child.setChecked(false, false);
+            }
+            traverse(child);
+          });
+        };
+        traverse(node2);
+      }
+    }
+  }
+  setCheckedNodes(array, leafOnly = false) {
+    const key = this.key;
+    const checkedKeys = {};
+    array.forEach((item) => {
+      checkedKeys[(item || {})[key]] = true;
+    });
+    this._setCheckedKeys(key, leafOnly, checkedKeys);
+  }
+  setCheckedKeys(keys, leafOnly = false) {
+    this.defaultCheckedKeys = keys;
+    const key = this.key;
+    const checkedKeys = {};
+    keys.forEach((key2) => {
+      checkedKeys[key2] = true;
+    });
+    this._setCheckedKeys(key, leafOnly, checkedKeys);
+  }
+  setDefaultExpandedKeys(keys) {
+    keys = keys || [];
+    this.defaultExpandedKeys = keys;
+    keys.forEach((key) => {
+      const node2 = this.getNode(key);
+      if (node2) node2.expand(null, this.autoExpandParent);
+    });
+  }
+  setChecked(data, checked, deep) {
+    const node2 = this.getNode(data);
+    if (node2) {
+      node2.setChecked(!!checked, deep);
+    }
+  }
+  getCurrentNode() {
+    return this.currentNode;
+  }
+  setCurrentNode(currentNode) {
+    const prevCurrentNode = this.currentNode;
+    if (prevCurrentNode) {
+      prevCurrentNode.isCurrent = false;
+    }
+    this.currentNode = currentNode;
+    this.currentNode.isCurrent = true;
+  }
+  setUserCurrentNode(node2, shouldAutoExpandParent = true) {
+    const key = node2[this.key];
+    const currNode = this.nodesMap[key];
+    this.setCurrentNode(currNode);
+    if (shouldAutoExpandParent && this.currentNode.level > 1) {
+      this.currentNode.parent.expand(null, true);
+    }
+  }
+  setCurrentNodeKey(key, shouldAutoExpandParent = true) {
+    if (key === null || key === void 0) {
+      this.currentNode && (this.currentNode.isCurrent = false);
+      this.currentNode = null;
+      return;
+    }
+    const node2 = this.getNode(key);
+    if (node2) {
+      this.setCurrentNode(node2);
+      if (shouldAutoExpandParent && this.currentNode.level > 1) {
+        this.currentNode.parent.expand(null, true);
+      }
+    }
+  }
+}
+exports.default = TreeStore;

package/lib/components/tree/model/useDragNode.cjs

@@ -1 +1,164 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("@vft/utils");require("@vueuse/core");require("../../config-provider/hooks/use-global-config.cjs");const b=require("vue");require("lodash-es");const B=require("../../../hooks/use-namespace/index.cjs");require("../../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../../hooks/use-z-index/index.cjs");const h=Symbol("dragEvents");function x({props:u,ctx:f,el$:q,dropIndicator$:T,store:C}){const g=B.useNamespace("tree"),d=b.ref({showDropIndicator:!1,draggingNode:null,dropNode:null,allowDrop:!0,dropType:null}),$=({event:r,treeNode:t})=>{if(typeof u.allowDrag=="function"&&!u.allowDrag(t.node))return r.preventDefault(),!1;r.dataTransfer.effectAllowed="move";try{r.dataTransfer.setData("text/plain","")}catch{}d.value.draggingNode=t,f.emit("node-drag-start",t.node,r)},S=({event:r,treeNode:t})=>{const e=t,o=d.value.dropNode;o&&o.node.id!==e.node.id&&p.removeClass(o.$el,g.is("drop-inner"));const n=d.value.draggingNode;if(!n||!e)return;let l=!0,i=!0,s=!0,m=!0;typeof u.allowDrop=="function"&&(l=u.allowDrop(n.node,e.node,"prev"),m=i=u.allowDrop(n.node,e.node,"inner"),s=u.allowDrop(n.node,e.node,"next")),r.dataTransfer.dropEffect=i||l||s?"move":"none",(l||i||s)&&o?.node.id!==e.node.id&&(o&&f.emit("node-drag-leave",n.node,o.node,r),f.emit("node-drag-enter",n.node,e.node,r)),(l||i||s)&&(d.value.dropNode=e),e.node.nextSibling===n.node&&(s=!1),e.node.previousSibling===n.node&&(l=!1),e.node.contains(n.node,!1)&&(i=!1),(n.node===e.node||n.node.contains(e.node))&&(l=!1,i=!1,s=!1);const c=e.$el.getBoundingClientRect(),v=q.value.getBoundingClientRect();let a;const P=l?i?.25:s?.45:1:-1,E=s?i?.75:l?.55:0:1;let D=-9999;const y=r.clientY-c.top;y<c.height*P?a="before":y>c.height*E?a="after":i?a="inner":a="none";const N=e.$el.querySelector(`.${g.be("node","expand-icon")}`).getBoundingClientRect(),w=T.value;a==="before"?D=N.top-v.top:a==="after"&&(D=N.bottom-v.top),w.style.top=`${D}px`,w.style.left=`${N.right-v.left}px`,a==="inner"?p.addClass(e.$el,g.is("drop-inner")):p.removeClass(e.$el,g.is("drop-inner")),d.value.showDropIndicator=a==="before"||a==="after",d.value.allowDrop=d.value.showDropIndicator||m,d.value.dropType=a,f.emit("node-drag-over",n.node,e.node,r)},I=r=>{const{draggingNode:t,dropType:e,dropNode:o}=d.value;if(r.preventDefault(),r.dataTransfer.dropEffect="move",t&&o){const n={data:t.node.data};e!=="none"&&t.node.remove(),e==="before"?o.node.parent.insertBefore(n,o.node):e==="after"?o.node.parent.insertAfter(n,o.node):e==="inner"&&o.node.insertChild(n),e!=="none"&&C.value.registerNode(n),p.removeClass(o.$el,g.is("drop-inner")),f.emit("node-drag-end",t.node,o.node,e,r),e!=="none"&&f.emit("node-drop",t.node,o.node,e,r)}t&&!o&&f.emit("node-drag-end",t.node,null,e,r),d.value.showDropIndicator=!1,d.value.draggingNode=null,d.value.dropNode=null,d.value.allowDrop=!0};return b.provide(h,{treeNodeDragStart:$,treeNodeDragOver:S,treeNodeDragEnd:I}),{dragState:d}}exports.dragEventsKey=h;exports.useDragNodeHandler=x;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils = require("@vft/utils");
+const vue = require("vue");
+const index = require("../../../hooks/use-namespace/index.cjs");
+const dragEventsKey = Symbol("dragEvents");
+function useDragNodeHandler({ props, ctx, el$, dropIndicator$, store }) {
+  const ns = index.useNamespace("tree");
+  const dragState = vue.ref({
+    showDropIndicator: false,
+    draggingNode: null,
+    dropNode: null,
+    allowDrop: true,
+    dropType: null
+  });
+  const treeNodeDragStart = ({ event, treeNode }) => {
+    if (typeof props.allowDrag === "function" && !props.allowDrag(treeNode.node)) {
+      event.preventDefault();
+      return false;
+    }
+    event.dataTransfer.effectAllowed = "move";
+    try {
+      event.dataTransfer.setData("text/plain", "");
+    } catch {
+    }
+    dragState.value.draggingNode = treeNode;
+    ctx.emit("node-drag-start", treeNode.node, event);
+  };
+  const treeNodeDragOver = ({ event, treeNode }) => {
+    const dropNode = treeNode;
+    const oldDropNode = dragState.value.dropNode;
+    if (oldDropNode && oldDropNode.node.id !== dropNode.node.id) {
+      utils.removeClass(oldDropNode.$el, ns.is("drop-inner"));
+    }
+    const draggingNode = dragState.value.draggingNode;
+    if (!draggingNode || !dropNode) return;
+    let dropPrev = true;
+    let dropInner = true;
+    let dropNext = true;
+    let userAllowDropInner = true;
+    if (typeof props.allowDrop === "function") {
+      dropPrev = props.allowDrop(draggingNode.node, dropNode.node, "prev");
+      userAllowDropInner = dropInner = props.allowDrop(
+        draggingNode.node,
+        dropNode.node,
+        "inner"
+      );
+      dropNext = props.allowDrop(draggingNode.node, dropNode.node, "next");
+    }
+    event.dataTransfer.dropEffect = dropInner || dropPrev || dropNext ? "move" : "none";
+    if ((dropPrev || dropInner || dropNext) && oldDropNode?.node.id !== dropNode.node.id) {
+      if (oldDropNode) {
+        ctx.emit("node-drag-leave", draggingNode.node, oldDropNode.node, event);
+      }
+      ctx.emit("node-drag-enter", draggingNode.node, dropNode.node, event);
+    }
+    if (dropPrev || dropInner || dropNext) {
+      dragState.value.dropNode = dropNode;
+    }
+    if (dropNode.node.nextSibling === draggingNode.node) {
+      dropNext = false;
+    }
+    if (dropNode.node.previousSibling === draggingNode.node) {
+      dropPrev = false;
+    }
+    if (dropNode.node.contains(draggingNode.node, false)) {
+      dropInner = false;
+    }
+    if (draggingNode.node === dropNode.node || draggingNode.node.contains(dropNode.node)) {
+      dropPrev = false;
+      dropInner = false;
+      dropNext = false;
+    }
+    const targetPosition = dropNode.$el.getBoundingClientRect();
+    const treePosition = el$.value.getBoundingClientRect();
+    let dropType;
+    const prevPercent = dropPrev ? dropInner ? 0.25 : dropNext ? 0.45 : 1 : -1;
+    const nextPercent = dropNext ? dropInner ? 0.75 : dropPrev ? 0.55 : 0 : 1;
+    let indicatorTop = -9999;
+    const distance = event.clientY - targetPosition.top;
+    if (distance < targetPosition.height * prevPercent) {
+      dropType = "before";
+    } else if (distance > targetPosition.height * nextPercent) {
+      dropType = "after";
+    } else if (dropInner) {
+      dropType = "inner";
+    } else {
+      dropType = "none";
+    }
+    const iconPosition = dropNode.$el.querySelector(`.${ns.be("node", "expand-icon")}`).getBoundingClientRect();
+    const dropIndicator = dropIndicator$.value;
+    if (dropType === "before") {
+      indicatorTop = iconPosition.top - treePosition.top;
+    } else if (dropType === "after") {
+      indicatorTop = iconPosition.bottom - treePosition.top;
+    }
+    dropIndicator.style.top = `${indicatorTop}px`;
+    dropIndicator.style.left = `${iconPosition.right - treePosition.left}px`;
+    if (dropType === "inner") {
+      utils.addClass(dropNode.$el, ns.is("drop-inner"));
+    } else {
+      utils.removeClass(dropNode.$el, ns.is("drop-inner"));
+    }
+    dragState.value.showDropIndicator = dropType === "before" || dropType === "after";
+    dragState.value.allowDrop = dragState.value.showDropIndicator || userAllowDropInner;
+    dragState.value.dropType = dropType;
+    ctx.emit("node-drag-over", draggingNode.node, dropNode.node, event);
+  };
+  const treeNodeDragEnd = (event) => {
+    const { draggingNode, dropType, dropNode } = dragState.value;
+    event.preventDefault();
+    event.dataTransfer.dropEffect = "move";
+    if (draggingNode && dropNode) {
+      const draggingNodeCopy = { data: draggingNode.node.data };
+      if (dropType !== "none") {
+        draggingNode.node.remove();
+      }
+      if (dropType === "before") {
+        dropNode.node.parent.insertBefore(draggingNodeCopy, dropNode.node);
+      } else if (dropType === "after") {
+        dropNode.node.parent.insertAfter(draggingNodeCopy, dropNode.node);
+      } else if (dropType === "inner") {
+        dropNode.node.insertChild(draggingNodeCopy);
+      }
+      if (dropType !== "none") {
+        store.value.registerNode(draggingNodeCopy);
+      }
+      utils.removeClass(dropNode.$el, ns.is("drop-inner"));
+      ctx.emit(
+        "node-drag-end",
+        draggingNode.node,
+        dropNode.node,
+        dropType,
+        event
+      );
+      if (dropType !== "none") {
+        ctx.emit(
+          "node-drop",
+          draggingNode.node,
+          dropNode.node,
+          dropType,
+          event
+        );
+      }
+    }
+    if (draggingNode && !dropNode) {
+      ctx.emit("node-drag-end", draggingNode.node, null, dropType, event);
+    }
+    dragState.value.showDropIndicator = false;
+    dragState.value.draggingNode = null;
+    dragState.value.dropNode = null;
+    dragState.value.allowDrop = true;
+  };
+  vue.provide(dragEventsKey, {
+    treeNodeDragStart,
+    treeNodeDragOver,
+    treeNodeDragEnd
+  });
+  return {
+    dragState
+  };
+}
+exports.dragEventsKey = dragEventsKey;
+exports.useDragNodeHandler = useDragNodeHandler;

package/lib/components/tree/model/useKeydown.cjs

@@ -1 +1,99 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../../../constants/aria.cjs"),b=require("@vueuse/core");require("@vft/utils");require("../../config-provider/hooks/use-global-config.cjs");const c=require("vue");require("lodash-es");const h=require("../../../hooks/use-namespace/index.cjs");require("../../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../../hooks/use-z-index/index.cjs");function q({el$:u},f){const o=h.useNamespace("tree"),t=c.shallowRef([]),s=c.shallowRef([]);c.onMounted(()=>{E()}),c.onUpdated(()=>{t.value=Array.from(u.value.querySelectorAll("[role=treeitem]")),s.value=Array.from(u.value.querySelectorAll("input[type=checkbox]"))}),c.watch(s,r=>{r.forEach(n=>{n.setAttribute("tabindex","-1")})});const y=r=>{const n=r.target;if(!n.className.includes(o.b("node")))return;const i=r.code;t.value=Array.from(u.value.querySelectorAll(`.${o.is("focusable")}[role=treeitem]`));const a=t.value.indexOf(n);let e;if([l.EVENT_CODE.up,l.EVENT_CODE.down].includes(i)){if(r.preventDefault(),i===l.EVENT_CODE.up){e=a===-1?0:a!==0?a-1:t.value.length-1;const d=e;for(;!f.value.getNode(t.value[e].dataset.key).canFocus;){if(e--,e===d){e=-1;break}e<0&&(e=t.value.length-1)}}else{e=a===-1?0:a<t.value.length-1?a+1:0;const d=e;for(;!f.value.getNode(t.value[e].dataset.key).canFocus;){if(e++,e===d){e=-1;break}e>=t.value.length&&(e=0)}}e!==-1&&t.value[e].focus()}[l.EVENT_CODE.left,l.EVENT_CODE.right].includes(i)&&(r.preventDefault(),n.click());const v=n.querySelector('[type="checkbox"]');[l.EVENT_CODE.enter,l.EVENT_CODE.space].includes(i)&&v&&(r.preventDefault(),v.click())};b.useEventListener(u,"keydown",y);const E=()=>{t.value=Array.from(u.value.querySelectorAll(`.${o.is("focusable")}[role=treeitem]`)),s.value=Array.from(u.value.querySelectorAll("input[type=checkbox]"));const r=u.value.querySelectorAll(`.${o.is("checked")}[role=treeitem]`);if(r.length){r[0].setAttribute("tabindex","0");return}t.value[0]?.setAttribute("tabindex","0")}}exports.useKeydown=q;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const core = require("@vueuse/core");
+const vue = require("vue");
+const index = require("../../../hooks/use-namespace/index.cjs");
+const aria = require("../../../constants/aria.cjs");
+function useKeydown({ el$ }, store) {
+  const ns = index.useNamespace("tree");
+  const treeItems = vue.shallowRef([]);
+  const checkboxItems = vue.shallowRef([]);
+  vue.onMounted(() => {
+    initTabIndex();
+  });
+  vue.onUpdated(() => {
+    treeItems.value = Array.from(el$.value.querySelectorAll("[role=treeitem]"));
+    checkboxItems.value = Array.from(
+      el$.value.querySelectorAll("input[type=checkbox]")
+    );
+  });
+  vue.watch(checkboxItems, (val) => {
+    val.forEach((checkbox) => {
+      checkbox.setAttribute("tabindex", "-1");
+    });
+  });
+  const handleKeydown = (ev) => {
+    const currentItem = ev.target;
+    if (!currentItem.className.includes(ns.b("node"))) return;
+    const code = ev.code;
+    treeItems.value = Array.from(
+      el$.value.querySelectorAll(`.${ns.is("focusable")}[role=treeitem]`)
+    );
+    const currentIndex = treeItems.value.indexOf(currentItem);
+    let nextIndex;
+    if ([aria.EVENT_CODE.up, aria.EVENT_CODE.down].includes(code)) {
+      ev.preventDefault();
+      if (code === aria.EVENT_CODE.up) {
+        nextIndex = currentIndex === -1 ? 0 : currentIndex !== 0 ? currentIndex - 1 : treeItems.value.length - 1;
+        const startIndex = nextIndex;
+        while (true) {
+          if (store.value.getNode(treeItems.value[nextIndex].dataset.key).canFocus)
+            break;
+          nextIndex--;
+          if (nextIndex === startIndex) {
+            nextIndex = -1;
+            break;
+          }
+          if (nextIndex < 0) {
+            nextIndex = treeItems.value.length - 1;
+          }
+        }
+      } else {
+        nextIndex = currentIndex === -1 ? 0 : currentIndex < treeItems.value.length - 1 ? currentIndex + 1 : 0;
+        const startIndex = nextIndex;
+        while (true) {
+          if (store.value.getNode(treeItems.value[nextIndex].dataset.key).canFocus)
+            break;
+          nextIndex++;
+          if (nextIndex === startIndex) {
+            nextIndex = -1;
+            break;
+          }
+          if (nextIndex >= treeItems.value.length) {
+            nextIndex = 0;
+          }
+        }
+      }
+      nextIndex !== -1 && treeItems.value[nextIndex].focus();
+    }
+    if ([aria.EVENT_CODE.left, aria.EVENT_CODE.right].includes(code)) {
+      ev.preventDefault();
+      currentItem.click();
+    }
+    const hasInput = currentItem.querySelector(
+      '[type="checkbox"]'
+    );
+    if ([aria.EVENT_CODE.enter, aria.EVENT_CODE.space].includes(code) && hasInput) {
+      ev.preventDefault();
+      hasInput.click();
+    }
+  };
+  core.useEventListener(el$, "keydown", handleKeydown);
+  const initTabIndex = () => {
+    treeItems.value = Array.from(
+      el$.value.querySelectorAll(`.${ns.is("focusable")}[role=treeitem]`)
+    );
+    checkboxItems.value = Array.from(
+      el$.value.querySelectorAll("input[type=checkbox]")
+    );
+    const checkedItem = el$.value.querySelectorAll(
+      `.${ns.is("checked")}[role=treeitem]`
+    );
+    if (checkedItem.length) {
+      checkedItem[0].setAttribute("tabindex", "0");
+      return;
+    }
+    treeItems.value[0]?.setAttribute("tabindex", "0");
+  };
+}
+exports.useKeydown = useKeydown;

package/lib/components/tree/model/useNodeExpandEventBroadcast.cjs

@@ -1 +1,27 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue");function a(e){const o=r.inject("TreeNodeMap",null),d={treeNodeExpand:n=>{e.node!==n&&e.node.collapse()},children:[]};return o&&o.children.push(d),r.provide("TreeNodeMap",d),{broadcastExpanded:n=>{if(e.accordion)for(const t of d.children)t.treeNodeExpand(n)}}}exports.useNodeExpandEventBroadcast=a;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+function useNodeExpandEventBroadcast(props) {
+  const parentNodeMap = vue.inject("TreeNodeMap", null);
+  const currentNodeMap = {
+    treeNodeExpand: (node) => {
+      if (props.node !== node) {
+        props.node.collapse();
+      }
+    },
+    children: []
+  };
+  if (parentNodeMap) {
+    parentNodeMap.children.push(currentNodeMap);
+  }
+  vue.provide("TreeNodeMap", currentNodeMap);
+  return {
+    broadcastExpanded: (node) => {
+      if (!props.accordion) return;
+      for (const childNode of currentNodeMap.children) {
+        childNode.treeNodeExpand(node);
+      }
+    }
+  };
+}
+exports.useNodeExpandEventBroadcast = useNodeExpandEventBroadcast;

package/lib/components/tree/model/util.cjs

@@ -1 +1,27 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t="$treeNodeId",a=function(r,e){!e||e[t]||Object.defineProperty(e,t,{value:r.id,enumerable:!1,configurable:!1,writable:!1})},c=function(r,e){return r?e[r]:e[t]},l=(r,e,o)=>{const u=r.value.currentNode;o();const n=r.value.currentNode;u!==n&&e("current-change",n?n.data:null,n)};exports.NODE_KEY=t;exports.getNodeKey=c;exports.handleCurrentChange=l;exports.markNodeData=a;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const NODE_KEY = "$treeNodeId";
+const markNodeData = function(node, data) {
+  if (!data || data[NODE_KEY]) return;
+  Object.defineProperty(data, NODE_KEY, {
+    value: node.id,
+    enumerable: false,
+    configurable: false,
+    writable: false
+  });
+};
+const getNodeKey = function(key, data) {
+  if (!key) return data[NODE_KEY];
+  return data[key];
+};
+const handleCurrentChange = (store, emit, setCurrent) => {
+  const preCurrentNode = store.value.currentNode;
+  setCurrent();
+  const currentNode = store.value.currentNode;
+  if (preCurrentNode === currentNode) return;
+  emit("current-change", currentNode ? currentNode.data : null, currentNode);
+};
+exports.NODE_KEY = NODE_KEY;
+exports.getNodeKey = getNodeKey;
+exports.handleCurrentChange = handleCurrentChange;
+exports.markNodeData = markNodeData;

package/lib/components/tree/style/css.cjs

@@ -1 +1 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-checkbox.css");require("vft/theme-style/vft-tree.css");
+"use strict";

package/lib/components/tree/style/index.cjs

@@ -1 +1 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/checkbox.scss");require("vft/theme-style/src/tree.scss");
+"use strict";

package/lib/components/tree/tree-node-content.vue.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./tree-node-content.vue2.cjs");exports.default=e.default;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const treeNodeContent_vue_vue_type_script_lang = require("./tree-node-content.vue2.cjs");
+exports.default = treeNodeContent_vue_vue_type_script_lang.default;