amazing-tree 1.0.0 → 1.2.0

package/README.md

@@ -25,7 +25,7 @@
 ```vue
 <script setup lang="ts">
 import { ref } from 'vue'
-import { VirtualTree } from 'amazing-tree'
+import { AmazingTree } from 'amazing-tree'
 
 type NodeItem = { uuid: string; name: string; children?: NodeItem[]; [k: string]: unknown }
 const data = ref<NodeItem[]>([])
@@ -36,7 +36,7 @@ function onDrop(drag: NodeItem, target: NodeItem, type: 'prev' | 'next' | 'inner
 </script>
 
 <template>
-  <VirtualTree
+  <AmazingTree
     :data="data"
     :props="{ value: 'uuid', label: 'name', children: 'children' }"
     :show-checkbox="true"
@@ -74,6 +74,7 @@ function onDrop(drag: NodeItem, target: NodeItem, type: 'prev' | 'next' | 'inner
 - `node-contextmenu(node: T, ev: MouseEvent)` 右键菜单
 - `node-drop(drag: T, target: T, type: 'prev'|'next'|'inner')` 拖拽放置
 - `current-change(node: T)` 当前行变化（配合 `currentNodeKey`）
+- `check-change(node: T, checked: boolean)` 勾选框点击时触发；禁用状态不触发
 
 **Slots**
 

package/dist/amazing-tree.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),Me=["onMousedown","onClick","onContextmenu"],Ae=["onClick"],Ke=["checked","indeterminate","disabled","onClick"],ze={class:"vtree-label"},Ve={key:1,class:"vtree-empty"},Ie={class:"vtree-empty-inner"},H=28,Le=t.defineComponent({__name:"VirtualTree",props:{data:{},props:{default:()=>({value:"value",label:"label",children:"children"})},allowDrag:{},allowDrop:{},height:{default:void 0},highlightColor:{default:"#1e71ff"},backgroundColor:{default:"#1d1d24"},textColor:{default:"#c8d3de"},hoverColor:{default:"#5d90e5"},currentNodeKey:{},defaultExpandedKeys:{},defaultExpandAll:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},emptyText:{default:"暂无数据"},showCheckbox:{type:Boolean,default:!1},checkStrictly:{type:Boolean,default:!1},defaultCheckedKeys:{default:()=>[]},disabledChecked:{}},emits:["node-click","node-contextmenu","node-drop","current-change"],setup(p,{expose:j,emit:Y}){const a=p,I=Y,se=t.computed(()=>a.props.value||"value"),de=t.computed(()=>a.props.label||"label"),_=t.computed(()=>a.props.children||"children"),ve=t.computed(()=>Array.isArray(a.data)?a.data.length===0:!0),y=t.ref(new Set),h=t.ref(new Set),m=t.ref(new Set);function ee(e){return y.value.has(e)}function fe(e){y.value.has(e)?y.value.delete(e):y.value.add(e),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()})}function w(e){return e[se.value]}function E(e){const l=e[_.value];return Array.isArray(l)?l:[]}function he(e){return h.value.has(e)}function pe(e){return m.value.has(e)}function G(e,l){if(l?h.value.add(e):h.value.delete(e),m.value.delete(e),!a.checkStrictly){const n=Z(e,a.data||[]);if(n){const o=[n];for(;o.length;){const r=o.pop(),u=w(r);l?h.value.add(u):h.value.delete(u),m.value.delete(u);const f=E(r);for(const s of f)o.push(s)}const c=q(e,a.data||[])||[];for(const r of c){const u=w(r),f=E(r);let s=!0,d=!1;for(const x of f){const $=w(x),re=h.value.has($),ie=m.value.has($);(re||ie)&&(d=!0),(!re||ie)&&(s=!1)}f.length===0?(h.value.has(u),m.value.delete(u)):s?(h.value.add(u),m.value.delete(u)):d?(h.value.delete(u),m.value.add(u)):(h.value.delete(u),m.value.delete(u))}}}}function te(e){h.value=new Set,m.value=new Set;for(const l of e||[])G(l,!0)}function me(e,l){const n=l.target;a.disabledChecked&&a.disabledChecked(e.node)||G(e.id,!!n.checked)}function C(e){const l=[];function n(o,c,r){for(let u=0;u<o.length;u++){const f=o[u],s=w(f),d=E(f),x=d.length===0;l.push({id:s,node:f,parent:c,level:r,index:u,isLeaf:x}),!x&&y.value.has(s)&&n(d,f,r+1)}}return n(e,null,0),l}const v=t.ref(null),B=t.ref(0),N=t.ref(0),i=t.ref([]),A=t.reactive(new Map),g=t.computed(()=>{let e=0;const l=[];for(const n of i.value){const o=A.get(n.id)||H;e+=o,l.push(e)}return l}),le=t.computed(()=>{const e=g.value;return e.length?e[e.length-1]:0});function ne(e){let l=0,n=g.value.length-1,o=0;for(;l<=n;){const c=l+n>>1;g.value[c]!==void 0&&g.value[c]>=e?(o=c,n=c-1):l=c+1}return o}const K=t.ref(0),b=t.ref(0),z=t.ref(0),J=t.ref(0);function k(){if(N.value=v.value?.clientHeight||0,g.value.length===0||i.value.length===0){K.value=0,b.value=0,z.value=0,J.value=0;return}const e=ne(B.value);K.value=Math.max(0,e-3);const l=i.value[K.value],n=l?A.get(l.id)||H:0,c=(g.value[K.value]??0)-n;z.value=Math.max(0,c);let r=K.value;const u=B.value+N.value+3*H;for(;r<i.value.length&&(g.value[r]??0)<u;)r++;b.value=Math.min(i.value.length,r+1);const s=(g.value[b.value-1]??0)-z.value;if(s<N.value&&b.value<i.value.length){let d=b.value,x=s;for(;x<N.value&&d<i.value.length;)d++,x=(g.value[d-1]??0)-z.value;b.value=d}J.value=Math.max(0,le.value-z.value-((g.value[b.value-1]??0)-z.value))}t.watch([B,()=>a.data,y],()=>{i.value=C(a.data||[]),t.nextTick(M),k()}),t.onMounted(()=>{i.value=C(a.data||[]),t.nextTick(M),k(),a.defaultCheckedKeys&&a.defaultCheckedKeys.length&&te(a.defaultCheckedKeys),v.value&&(R=new ResizeObserver(()=>{N.value=v.value?.clientHeight||0,k()}),R.observe(v.value))});let R=null;t.onUnmounted(()=>{R&&(R.disconnect(),R=null)});const O=t.reactive(new Map);function ge(e,l){l?O.set(e,l):O.delete(e)}function M(){let e=!1;for(const l of i.value.slice(K.value,b.value)){const n=O.get(l.id);if(n){const o=n.offsetHeight;(!A.has(l.id)||A.get(l.id)!==o)&&(A.set(l.id,o),e=!0)}}e&&k()}function ke(){B.value=v.value?.scrollTop||0,k()}const S=t.ref(!1),Q=t.ref(null),D=t.ref(null),T=t.ref(null),X=t.ref(0),V=t.ref(null),F=t.ref(0);let L=null;function P(){L!=null&&(cancelAnimationFrame(L),L=null)}function ae(){if(!S.value||F.value===0){P();return}const e=v.value;if(!e){P();return}const l=e.scrollHeight-e.clientHeight,n=12;e.scrollTop=Math.max(0,Math.min(l,e.scrollTop+F.value*n)),B.value=e.scrollTop,k(),L=requestAnimationFrame(ae)}function xe(){F.value!==0&&L==null&&(L=requestAnimationFrame(ae)),F.value===0&&P()}function W(e){if(e==null)return null;for(const l of i.value)if(l.id===e)return l;return null}function ye(e){const l=v.value.getBoundingClientRect(),n=e-l.top+B.value;return ne(n)}function we(e,l){!a.draggable||l.button!==0||!(!a.allowDrag||a.allowDrag(e.node))||(S.value=!0,Q.value=e.id,X.value=l.clientY,l.preventDefault(),window.addEventListener("mousemove",oe),window.addEventListener("mouseup",ue))}function oe(e){if(!S.value)return;X.value=e.clientY;const l=ye(e.clientY),n=i.value[Math.min(Math.max(l,0),i.value.length-1)];if(D.value=n?.id??null,!n){T.value=null;return}const o=g.value[l]??0,c=A.get(n.id)??H,r=o-c,u=v.value.getBoundingClientRect(),s=(e.clientY-u.top+B.value-r)/c;let d="inner";s<.25?d="prev":s>.75&&(d="next");const x=W(Q.value),$=a.allowDrop?!!(x&&a.allowDrop(x.node,n.node,d)):!0;T.value=$?d:null,F.value=e.clientY>u.bottom?1:e.clientY<u.top?-1:0,xe()}function q(e,l,n=[]){for(const o of l){if(w(o)===e)return n;const c=E(o);if(c.length){const r=q(e,c,[...n,o]);if(r)return r}}return null}function Z(e,l){if(e==null)return null;for(const n of l){if(w(n)===e)return n;const o=E(n),c=Z(e,o);if(c)return c}return null}function U(e){const l=[];for(const n of e){l.push(w(n));const o=E(n);o.length&&l.push(...U(o))}return l}function Ce(e){const l=e.parent;if(l)E(l).splice(e.index,1);else{const n=a.data.findIndex(o=>w(o)===e.id);n>=0&&a.data.splice(n,1)}}function be(e,l,n){if(n==="inner"){Array.isArray(l.node[_.value])||(l.node[_.value]=[]),l.node[_.value].push(e),y.value.add(l.id);return}const o=l.parent;if(o){const c=E(o),r=l.index+(n==="next"?1:0);c.splice(r,0,e)}else{const c=l.index+(n==="next"?1:0);a.data.splice(c,0,e)}}function ue(){if(window.removeEventListener("mousemove",oe),window.removeEventListener("mouseup",ue),P(),!S.value)return;const e=W(Q.value),l=W(D.value),n=T.value;if(S.value=!1,T.value=null,D.value=null,!e||!l||!n||a.allowDrop&&!a.allowDrop(e.node,l.node,n)||e.id===l.id)return;const o=n==="inner"?l.node:l.parent||null;if(o){const f=q(w(o),a.data||[])||[];for(const s of f)if(w(s)===e.id)return}const c=e.node;Ce(e);const r=C(a.data||[]);i.value=r;const u=W(l.id)||l;be(c,u,n),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()}),I("node-drop",c,u.node,n)}function Se(e,l){V.value=e.id,I("node-click",e.node,l)}function Te(e,l){I("node-contextmenu",e.node,l)}t.watchEffect(()=>{t.nextTick(M)}),t.watch(()=>a.currentNodeKey,e=>{V.value=e??null},{immediate:!0}),t.watch(()=>a.defaultExpandedKeys,e=>{y.value=new Set(e||[]),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()})},{immediate:!0}),t.watch(()=>a.defaultExpandAll,e=>{e&&(y.value=new Set(U(a.data||[])),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()}))},{immediate:!0}),t.watch(()=>a.data,()=>{a.defaultExpandAll&&(y.value=new Set(U(a.data||[])),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()}));const e=new Set(U(a.data||[]));h.value=new Set([...h.value].filter(l=>e.has(l))),m.value=new Set([...m.value].filter(l=>e.has(l)))});function Ee(e){const l=q(e,a.data||[])||[];for(const n of l)y.value.add(w(n));i.value=C(a.data||[])}function ce(e){e!=null&&(Ee(e),t.nextTick(()=>{const l=i.value.findIndex(u=>u.id===e);if(l<0||!v.value)return;const n=A.get(e)||H,o=(g.value[l]??0)-n,c=v.value.clientHeight,r=Math.max(0,o-Math.max(0,(c-n)/2));v.value.scrollTop=r,B.value=r,k(),t.nextTick(()=>{const u=O.get(e);if(!u||!v.value)return;const f=u.offsetLeft,s=u.offsetWidth,d=v.value.clientWidth,x=Math.max(0,f+Math.max(0,s/2)-Math.max(0,d/2));v.value.scrollLeft=x})}))}function Be(e){V.value=e??null,ce(V.value)}return j({getCurrentKey:()=>V.value,setCurrentKey:Be,scrollTo:ce,getCheckedKeys:()=>Array.from(h.value),setCheckedKeys:te,setChecked:(e,l)=>G(e,l)}),t.watch(V,e=>{const l=Z(e,a.data||[]);l&&I("current-change",l)}),(e,l)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"containerRef",ref:v,class:t.normalizeClass(["vtree",{"is-dragging":S.value}]),style:t.normalizeStyle({height:typeof p.height=="number"?p.height+"px":p.height||"100%","--vtree-bg":p.backgroundColor,"--vtree-text":p.textColor,"--vtree-hover":p.hoverColor}),onScroll:ke},[ve.value?(t.openBlock(),t.createElementBlock("div",Ve,[t.renderSlot(e.$slots,"empty",{},()=>[t.createElementVNode("div",Ie,t.toDisplayString(p.emptyText),1)],!0)])):(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createElementVNode("div",{style:t.normalizeStyle({height:le.value+"px",position:"relative",minWidth:"100%",width:"max-content"})},[t.createElementVNode("div",{style:t.normalizeStyle({height:z.value+"px"})},null,4),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(i.value.slice(K.value,b.value),n=>(t.openBlock(),t.createElementBlock("div",{key:n.id,class:"vtree-row-wrapper"},[t.createElementVNode("div",{class:t.normalizeClass(["vtree-row",{"is-target-inner":S.value&&D.value===n.id&&T.value==="inner","is-active":V.value===n.id}]),style:t.normalizeStyle({paddingLeft:n.level*16+"px","--active-color":p.highlightColor}),onMousedown:o=>we(n,o),onClick:o=>Se(n,o),onContextmenu:t.withModifiers(o=>Te(n,o),["prevent"]),ref_for:!0,ref:o=>ge(n.id,o)},[t.createElementVNode("span",{class:t.normalizeClass(["vtree-caret-box",{"is-leaf":n.isLeaf}]),onClick:t.withModifiers(o=>!n.isLeaf&&fe(n.id),["stop"])},[n.isLeaf?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["vtree-caret",{expanded:ee(n.id)}])},null,2))],10,Ae),p.showCheckbox?(t.openBlock(),t.createElementBlock("input",{key:0,class:"vtree-checkbox",type:"checkbox",checked:he(n.id),indeterminate:pe(n.id),disabled:a.disabledChecked?a.disabledChecked(n.node):!1,onClick:t.withModifiers(o=>me(n,o),["stop"])},null,8,Ke)):t.createCommentVNode("",!0),t.renderSlot(e.$slots,"default",{node:n.node,data:n.node,level:n.level,expanded:ee(n.id),isLeaf:n.isLeaf},()=>[t.createElementVNode("span",ze,t.toDisplayString(n.node[de.value]),1)],!0)],46,Me),S.value&&D.value===n.id&&(T.value==="prev"||T.value==="next")?(t.openBlock(),t.createElementBlock("div",{key:0,class:t.normalizeClass(["vtree-drop-line",{"is-prev":T.value==="prev","is-next":T.value==="next"}])},null,2)):t.createCommentVNode("",!0)]))),128)),t.createElementVNode("div",{style:t.normalizeStyle({height:J.value+"px"})},null,4)],4),S.value?(t.openBlock(),t.createElementBlock("div",{key:0,class:"vtree-ghost",style:t.normalizeStyle({top:X.value+"px"})},null,4)):t.createCommentVNode("",!0)],64))],38))}}),Ne=(p,j)=>{const Y=p.__vccOpts||p;for(const[a,I]of j)Y[a]=I;return Y},Re=Ne(Le,[["__scopeId","data-v-cfceef5a"]]);exports.VirtualTree=Re;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),Me=["onMousedown","onClick","onContextmenu"],Ae=["onClick"],ze=["checked","indeterminate","disabled","onClick"],Ke={class:"vtree-label"},Ie={key:1,class:"vtree-empty"},Le={class:"vtree-empty-inner"},H=28,Ne=t.defineComponent({__name:"AmazingTree",props:{data:{},props:{default:()=>({value:"value",label:"label",children:"children"})},allowDrag:{},allowDrop:{},height:{default:void 0},highlightColor:{default:"#1e71ff"},backgroundColor:{default:"#1d1d24"},textColor:{default:"#c8d3de"},hoverColor:{default:"#5d90e5"},currentNodeKey:{},defaultExpandedKeys:{},defaultExpandAll:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},emptyText:{default:"暂无数据"},showCheckbox:{type:Boolean,default:!1},checkStrictly:{type:Boolean,default:!1},defaultCheckedKeys:{default:()=>[]},disabledChecked:{}},emits:["node-click","node-contextmenu","node-drop","current-change","check-change"],setup(m,{expose:j,emit:Y}){const a=m,A=Y,se=t.computed(()=>a.props.value||"value"),de=t.computed(()=>a.props.label||"label"),_=t.computed(()=>a.props.children||"children"),ve=t.computed(()=>Array.isArray(a.data)?a.data.length===0:!0),y=t.ref(new Set),h=t.ref(new Set),p=t.ref(new Set);function ee(e){return y.value.has(e)}function fe(e){y.value.has(e)?y.value.delete(e):y.value.add(e),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()})}function w(e){return e[se.value]}function E(e){const l=e[_.value];return Array.isArray(l)?l:[]}function he(e){return h.value.has(e)}function me(e){return p.value.has(e)}function G(e,l){if(l?h.value.add(e):h.value.delete(e),p.value.delete(e),!a.checkStrictly){const n=Z(e,a.data||[]);if(n){const o=[n];for(;o.length;){const r=o.pop(),c=w(r);l?h.value.add(c):h.value.delete(c),p.value.delete(c);const f=E(r);for(const s of f)o.push(s)}const u=q(e,a.data||[])||[];for(const r of u){const c=w(r),f=E(r);let s=!0,d=!1;for(const x of f){const $=w(x),re=h.value.has($),ie=p.value.has($);(re||ie)&&(d=!0),(!re||ie)&&(s=!1)}f.length===0?(h.value.has(c),p.value.delete(c)):s?(h.value.add(c),p.value.delete(c)):d?(h.value.delete(c),p.value.add(c)):(h.value.delete(c),p.value.delete(c))}}}}function te(e){h.value=new Set,p.value=new Set;for(const l of e||[])G(l,!0)}function pe(e,l){const n=l.target;a.disabledChecked&&a.disabledChecked(e.node)||(A("check-change",e.node,!!n.checked),G(e.id,!!n.checked))}function C(e){const l=[];function n(o,u,r){for(let c=0;c<o.length;c++){const f=o[c],s=w(f),d=E(f),x=d.length===0;l.push({id:s,node:f,parent:u,level:r,index:c,isLeaf:x}),!x&&y.value.has(s)&&n(d,f,r+1)}}return n(e,null,0),l}const v=t.ref(null),B=t.ref(0),R=t.ref(0),i=t.ref([]),z=t.reactive(new Map),g=t.computed(()=>{let e=0;const l=[];for(const n of i.value){const o=z.get(n.id)||H;e+=o,l.push(e)}return l}),le=t.computed(()=>{const e=g.value;return e.length?e[e.length-1]:0});function ne(e){let l=0,n=g.value.length-1,o=0;for(;l<=n;){const u=l+n>>1;g.value[u]!==void 0&&g.value[u]>=e?(o=u,n=u-1):l=u+1}return o}const K=t.ref(0),b=t.ref(0),I=t.ref(0),J=t.ref(0);function k(){if(R.value=v.value?.clientHeight||0,g.value.length===0||i.value.length===0){K.value=0,b.value=0,I.value=0,J.value=0;return}const e=ne(B.value);K.value=Math.max(0,e-3);const l=i.value[K.value],n=l?z.get(l.id)||H:0,u=(g.value[K.value]??0)-n;I.value=Math.max(0,u);let r=K.value;const c=B.value+R.value+3*H;for(;r<i.value.length&&(g.value[r]??0)<c;)r++;b.value=Math.min(i.value.length,r+1);const s=(g.value[b.value-1]??0)-I.value;if(s<R.value&&b.value<i.value.length){let d=b.value,x=s;for(;x<R.value&&d<i.value.length;)d++,x=(g.value[d-1]??0)-I.value;b.value=d}J.value=Math.max(0,le.value-I.value-((g.value[b.value-1]??0)-I.value))}t.watch([B,()=>a.data,y],()=>{i.value=C(a.data||[]),t.nextTick(M),k()}),t.onMounted(()=>{i.value=C(a.data||[]),t.nextTick(M),k(),a.defaultCheckedKeys&&a.defaultCheckedKeys.length&&te(a.defaultCheckedKeys),v.value&&(V=new ResizeObserver(()=>{R.value=v.value?.clientHeight||0,k()}),V.observe(v.value))});let V=null;t.onUnmounted(()=>{V&&(V.disconnect(),V=null)});const O=t.reactive(new Map);function ge(e,l){l?O.set(e,l):O.delete(e)}function M(){let e=!1;for(const l of i.value.slice(K.value,b.value)){const n=O.get(l.id);if(n){const o=n.offsetHeight;(!z.has(l.id)||z.get(l.id)!==o)&&(z.set(l.id,o),e=!0)}}e&&k()}function ke(){B.value=v.value?.scrollTop||0,k()}const S=t.ref(!1),Q=t.ref(null),D=t.ref(null),T=t.ref(null),X=t.ref(0),L=t.ref(null),F=t.ref(0);let N=null;function P(){N!=null&&(cancelAnimationFrame(N),N=null)}function ae(){if(!S.value||F.value===0){P();return}const e=v.value;if(!e){P();return}const l=e.scrollHeight-e.clientHeight,n=12;e.scrollTop=Math.max(0,Math.min(l,e.scrollTop+F.value*n)),B.value=e.scrollTop,k(),N=requestAnimationFrame(ae)}function xe(){F.value!==0&&N==null&&(N=requestAnimationFrame(ae)),F.value===0&&P()}function W(e){if(e==null)return null;for(const l of i.value)if(l.id===e)return l;return null}function ye(e){const l=v.value.getBoundingClientRect(),n=e-l.top+B.value;return ne(n)}function we(e,l){!a.draggable||l.button!==0||!(!a.allowDrag||a.allowDrag(e.node))||(S.value=!0,Q.value=e.id,X.value=l.clientY,l.preventDefault(),window.addEventListener("mousemove",oe),window.addEventListener("mouseup",ce))}function oe(e){if(!S.value)return;X.value=e.clientY;const l=ye(e.clientY),n=i.value[Math.min(Math.max(l,0),i.value.length-1)];if(D.value=n?.id??null,!n){T.value=null;return}const o=g.value[l]??0,u=z.get(n.id)??H,r=o-u,c=v.value.getBoundingClientRect(),s=(e.clientY-c.top+B.value-r)/u;let d="inner";s<.25?d="prev":s>.75&&(d="next");const x=W(Q.value),$=a.allowDrop?!!(x&&a.allowDrop(x.node,n.node,d)):!0;T.value=$?d:null,F.value=e.clientY>c.bottom?1:e.clientY<c.top?-1:0,xe()}function q(e,l,n=[]){for(const o of l){if(w(o)===e)return n;const u=E(o);if(u.length){const r=q(e,u,[...n,o]);if(r)return r}}return null}function Z(e,l){if(e==null)return null;for(const n of l){if(w(n)===e)return n;const o=E(n),u=Z(e,o);if(u)return u}return null}function U(e){const l=[];for(const n of e){l.push(w(n));const o=E(n);o.length&&l.push(...U(o))}return l}function Ce(e){const l=e.parent;if(l)E(l).splice(e.index,1);else{const n=a.data.findIndex(o=>w(o)===e.id);n>=0&&a.data.splice(n,1)}}function be(e,l,n){if(n==="inner"){Array.isArray(l.node[_.value])||(l.node[_.value]=[]),l.node[_.value].push(e),y.value.add(l.id);return}const o=l.parent;if(o){const u=E(o),r=l.index+(n==="next"?1:0);u.splice(r,0,e)}else{const u=l.index+(n==="next"?1:0);a.data.splice(u,0,e)}}function ce(){if(window.removeEventListener("mousemove",oe),window.removeEventListener("mouseup",ce),P(),!S.value)return;const e=W(Q.value),l=W(D.value),n=T.value;if(S.value=!1,T.value=null,D.value=null,!e||!l||!n||a.allowDrop&&!a.allowDrop(e.node,l.node,n)||e.id===l.id)return;const o=n==="inner"?l.node:l.parent||null;if(o){const f=q(w(o),a.data||[])||[];for(const s of f)if(w(s)===e.id)return}const u=e.node;Ce(e);const r=C(a.data||[]);i.value=r;const c=W(l.id)||l;be(u,c,n),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()}),A("node-drop",u,c.node,n)}function Se(e,l){L.value=e.id,A("node-click",e.node,l)}function Te(e,l){A("node-contextmenu",e.node,l)}t.watchEffect(()=>{t.nextTick(M)}),t.watch(()=>a.currentNodeKey,e=>{L.value=e??null},{immediate:!0}),t.watch(()=>a.defaultExpandedKeys,e=>{y.value=new Set(e||[]),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()})},{immediate:!0}),t.watch(()=>a.defaultExpandAll,e=>{e&&(y.value=new Set(U(a.data||[])),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()}))},{immediate:!0}),t.watch(()=>a.data,()=>{a.defaultExpandAll&&(y.value=new Set(U(a.data||[])),i.value=C(a.data||[]),t.nextTick(()=>{M(),k()}));const e=new Set(U(a.data||[]));h.value=new Set([...h.value].filter(l=>e.has(l))),p.value=new Set([...p.value].filter(l=>e.has(l)))});function Ee(e){const l=q(e,a.data||[])||[];for(const n of l)y.value.add(w(n));i.value=C(a.data||[])}function ue(e){e!=null&&(Ee(e),t.nextTick(()=>{const l=i.value.findIndex(c=>c.id===e);if(l<0||!v.value)return;const n=z.get(e)||H,o=(g.value[l]??0)-n,u=v.value.clientHeight,r=Math.max(0,o-Math.max(0,(u-n)/2));v.value.scrollTop=r,B.value=r,k(),t.nextTick(()=>{const c=O.get(e);if(!c||!v.value)return;const f=c.offsetLeft,s=c.offsetWidth,d=v.value.clientWidth,x=Math.max(0,f+Math.max(0,s/2)-Math.max(0,d/2));v.value.scrollLeft=x})}))}function Be(e){L.value=e??null,ue(L.value)}return j({getCurrentKey:()=>L.value,setCurrentKey:Be,scrollTo:ue,getCheckedKeys:()=>Array.from(h.value),setCheckedKeys:te,setChecked:(e,l)=>G(e,l)}),t.watch(L,e=>{const l=Z(e,a.data||[]);l&&A("current-change",l)}),(e,l)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"containerRef",ref:v,class:t.normalizeClass(["vtree",{"is-dragging":S.value}]),style:t.normalizeStyle({height:typeof m.height=="number"?m.height+"px":m.height||"100%","--vtree-bg":m.backgroundColor,"--vtree-text":m.textColor,"--vtree-hover":m.hoverColor}),onScroll:ke},[ve.value?(t.openBlock(),t.createElementBlock("div",Ie,[t.renderSlot(e.$slots,"empty",{},()=>[t.createElementVNode("div",Le,t.toDisplayString(m.emptyText),1)],!0)])):(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createElementVNode("div",{style:t.normalizeStyle({height:le.value+"px",position:"relative",minWidth:"100%",width:"max-content"})},[t.createElementVNode("div",{style:t.normalizeStyle({height:I.value+"px"})},null,4),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(i.value.slice(K.value,b.value),n=>(t.openBlock(),t.createElementBlock("div",{key:n.id,class:"vtree-row-wrapper"},[t.createElementVNode("div",{class:t.normalizeClass(["vtree-row",{"is-target-inner":S.value&&D.value===n.id&&T.value==="inner","is-active":L.value===n.id}]),style:t.normalizeStyle({paddingLeft:n.level*16+"px","--active-color":m.highlightColor}),onMousedown:o=>we(n,o),onClick:o=>Se(n,o),onContextmenu:t.withModifiers(o=>Te(n,o),["prevent"]),ref_for:!0,ref:o=>ge(n.id,o)},[t.createElementVNode("span",{class:t.normalizeClass(["vtree-caret-box",{"is-leaf":n.isLeaf}]),onClick:t.withModifiers(o=>!n.isLeaf&&fe(n.id),["stop"])},[n.isLeaf?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["vtree-caret",{expanded:ee(n.id)}])},null,2))],10,Ae),m.showCheckbox?(t.openBlock(),t.createElementBlock("input",{key:0,class:"vtree-checkbox",type:"checkbox",checked:he(n.id),indeterminate:me(n.id),disabled:a.disabledChecked?a.disabledChecked(n.node):!1,onClick:t.withModifiers(o=>pe(n,o),["stop"])},null,8,ze)):t.createCommentVNode("",!0),t.renderSlot(e.$slots,"default",{node:n.node,data:n.node,level:n.level,expanded:ee(n.id),isLeaf:n.isLeaf},()=>[t.createElementVNode("span",Ke,t.toDisplayString(n.node[de.value]),1)],!0)],46,Me),S.value&&D.value===n.id&&(T.value==="prev"||T.value==="next")?(t.openBlock(),t.createElementBlock("div",{key:0,class:t.normalizeClass(["vtree-drop-line",{"is-prev":T.value==="prev","is-next":T.value==="next"}])},null,2)):t.createCommentVNode("",!0)]))),128)),t.createElementVNode("div",{style:t.normalizeStyle({height:J.value+"px"})},null,4)],4),S.value?(t.openBlock(),t.createElementBlock("div",{key:0,class:"vtree-ghost",style:t.normalizeStyle({top:X.value+"px"})},null,4)):t.createCommentVNode("",!0)],64))],38))}}),Re=(m,j)=>{const Y=m.__vccOpts||m;for(const[a,A]of j)Y[a]=A;return Y},Ve=Re(Ne,[["__scopeId","data-v-7d4b1960"]]);exports.AmazingTree=Ve;

package/dist/amazing-tree.css

@@ -1 +1 @@
-.vtree[data-v-cfceef5a]{width:100%;overflow:auto;position:relative;background:var(--vtree-bg);color:var(--vtree-text);scrollbar-width:thin;scrollbar-color:rgba(144,147,153,.3) transparent;cursor:pointer;--vtree-primary: #409eff;--vtree-checkbox-bg: #1d1d24;--vtree-checkbox-border: #4c4d4f;--vtree-checkbox-hover-border: #8d8e91;--vtree-checkbox-disabled-bg: #2c2f33;--vtree-checkbox-disabled-border: #5c5f63;--vtree-checkbox-check: #ffffff;--vtree-checkbox-check-disabled: #cfd3dc}.vtree.is-dragging[data-v-cfceef5a],.vtree.is-dragging[data-v-cfceef5a] *{-webkit-user-select:none;user-select:none}.vtree[data-v-cfceef5a] *{cursor:pointer}.vtree input[type=checkbox][data-v-cfceef5a]:disabled{cursor:not-allowed}.vtree .vtree-checkbox[data-v-cfceef5a]{-webkit-appearance:none;appearance:none;position:relative;width:14px;height:14px;border:1px solid var(--vtree-checkbox-border);background:var(--vtree-checkbox-bg);border-radius:2px;outline:none;transition:border-color .12s ease,background-color .12s ease,box-shadow .12s ease;vertical-align:middle;margin-right:6px}.vtree .vtree-checkbox[data-v-cfceef5a]:not(:disabled):hover{border-color:var(--vtree-checkbox-hover-border)}.vtree .vtree-checkbox[data-v-cfceef5a]:focus-visible{box-shadow:0 0 0 2px #409eff33}.vtree .vtree-checkbox[data-v-cfceef5a]:checked{background:var(--vtree-primary);border-color:var(--vtree-primary)}.vtree .vtree-checkbox[data-v-cfceef5a]:checked:after{content:"";position:absolute;left:3px;top:0;width:4px;height:8px;border:2px solid var(--vtree-checkbox-check);border-top:0;border-left:0;transform:rotate(45deg)}.vtree .vtree-checkbox[data-v-cfceef5a]:indeterminate{background:var(--vtree-primary);border-color:var(--vtree-primary)}.vtree .vtree-checkbox[data-v-cfceef5a]:indeterminate:after{content:"";position:absolute;left:2px;top:5px;width:10px;height:2px;background:var(--vtree-checkbox-check);border-radius:1px}.vtree .vtree-checkbox[data-v-cfceef5a]:disabled{background:var(--vtree-checkbox-disabled-bg);border-color:var(--vtree-checkbox-disabled-border)}.vtree .vtree-checkbox[data-v-cfceef5a]:disabled:checked:after{border-color:var(--vtree-checkbox-check-disabled)}.vtree .vtree-checkbox[data-v-cfceef5a]:disabled:indeterminate:after{background:var(--vtree-checkbox-check-disabled)}.vtree .vtree-row-wrapper[data-v-cfceef5a]{position:relative}.vtree .vtree-row-wrapper .vtree-drop-line[data-v-cfceef5a]{position:absolute;left:0;right:0;height:0;border-top:2px solid #409eff}.vtree .vtree-row-wrapper .vtree-drop-line.is-prev[data-v-cfceef5a]{top:0}.vtree .vtree-row-wrapper .vtree-drop-line.is-next[data-v-cfceef5a]{bottom:0}.vtree .vtree-row[data-v-cfceef5a]{display:flex;align-items:center;gap:4px;box-sizing:border-box;min-height:24px;padding:2px 8px;white-space:nowrap}.vtree .vtree-row[data-v-cfceef5a]:hover{background:var(--vtree-hover)}.vtree .vtree-row.is-active[data-v-cfceef5a],.vtree .vtree-row.is-active[data-v-cfceef5a]:hover{background:var(--active-color)}.vtree .vtree-row.is-target-inner[data-v-cfceef5a]{outline:2px dashed #409eff}.vtree .vtree-row .vtree-caret-box[data-v-cfceef5a]{display:inline-flex;align-items:center;justify-content:center;height:100%;aspect-ratio:1/1;min-width:16px;margin-right:4px;cursor:pointer}.vtree .vtree-row .vtree-caret-box.is-leaf[data-v-cfceef5a]{pointer-events:none}.vtree .vtree-row .vtree-caret[data-v-cfceef5a]{display:block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #909399;transform:rotate(-90deg);transition:transform .1s linear}.vtree .vtree-row .vtree-caret.expanded[data-v-cfceef5a]{transform:rotate(0)}.vtree .vtree-row .vtree-label[data-v-cfceef5a]{color:inherit}.vtree .vtree-ghost[data-v-cfceef5a]{position:fixed;left:16px;width:120px;height:24px;background:#409eff33;border:1px solid #409eff;pointer-events:none}.vtree .vtree-empty[data-v-cfceef5a]{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.vtree .vtree-empty[data-v-cfceef5a]>*{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.vtree .vtree-empty .vtree-empty-inner[data-v-cfceef5a]{color:var(--vtree-text)}[data-v-cfceef5a] .vtree::-webkit-scrollbar{width:8px;height:8px}[data-v-cfceef5a] .vtree::-webkit-scrollbar-track{background:transparent}[data-v-cfceef5a] .vtree::-webkit-scrollbar-thumb{background-color:#9093994d;border-radius:4px}[data-v-cfceef5a] .vtree::-webkit-scrollbar-thumb:hover{background-color:#90939980}
+.vtree[data-v-7d4b1960]{width:100%;overflow:auto;position:relative;background:var(--vtree-bg);color:var(--vtree-text);scrollbar-width:thin;scrollbar-color:rgba(144,147,153,.3) transparent;cursor:pointer;--vtree-primary: #409eff;--vtree-checkbox-bg: #1d1d24;--vtree-checkbox-border: #4c4d4f;--vtree-checkbox-hover-border: #8d8e91;--vtree-checkbox-disabled-bg: #2c2f33;--vtree-checkbox-disabled-border: #5c5f63;--vtree-checkbox-check: #ffffff;--vtree-checkbox-check-disabled: #cfd3dc}.vtree.is-dragging[data-v-7d4b1960],.vtree.is-dragging[data-v-7d4b1960] *{-webkit-user-select:none;user-select:none}.vtree[data-v-7d4b1960] *{cursor:pointer}.vtree input[type=checkbox][data-v-7d4b1960]:disabled{cursor:not-allowed}.vtree .vtree-checkbox[data-v-7d4b1960]{-webkit-appearance:none;appearance:none;position:relative;width:14px;height:14px;border:1px solid var(--vtree-checkbox-border);background:var(--vtree-checkbox-bg);border-radius:2px;outline:none;transition:border-color .12s ease,background-color .12s ease,box-shadow .12s ease;vertical-align:middle;margin-right:6px}.vtree .vtree-checkbox[data-v-7d4b1960]:not(:disabled):hover{border-color:var(--vtree-checkbox-hover-border)}.vtree .vtree-checkbox[data-v-7d4b1960]:focus-visible{box-shadow:0 0 0 2px #409eff33}.vtree .vtree-checkbox[data-v-7d4b1960]:checked{background:var(--vtree-primary);border-color:var(--vtree-primary)}.vtree .vtree-checkbox[data-v-7d4b1960]:checked:after{content:"";position:absolute;left:3px;top:0;width:4px;height:8px;border:2px solid var(--vtree-checkbox-check);border-top:0;border-left:0;transform:rotate(45deg)}.vtree .vtree-checkbox[data-v-7d4b1960]:indeterminate{background:var(--vtree-primary);border-color:var(--vtree-primary)}.vtree .vtree-checkbox[data-v-7d4b1960]:indeterminate:after{content:"";position:absolute;left:2px;top:5px;width:10px;height:2px;background:var(--vtree-checkbox-check);border-radius:1px}.vtree .vtree-checkbox[data-v-7d4b1960]:disabled{background:var(--vtree-checkbox-disabled-bg);border-color:var(--vtree-checkbox-disabled-border)}.vtree .vtree-checkbox[data-v-7d4b1960]:disabled:checked:after{border-color:var(--vtree-checkbox-check-disabled)}.vtree .vtree-checkbox[data-v-7d4b1960]:disabled:indeterminate:after{background:var(--vtree-checkbox-check-disabled)}.vtree .vtree-row-wrapper[data-v-7d4b1960]{position:relative}.vtree .vtree-row-wrapper .vtree-drop-line[data-v-7d4b1960]{position:absolute;left:0;right:0;height:0;border-top:2px solid #409eff}.vtree .vtree-row-wrapper .vtree-drop-line.is-prev[data-v-7d4b1960]{top:0}.vtree .vtree-row-wrapper .vtree-drop-line.is-next[data-v-7d4b1960]{bottom:0}.vtree .vtree-row[data-v-7d4b1960]{display:flex;align-items:center;gap:4px;box-sizing:border-box;min-height:24px;padding:0 8px;white-space:nowrap}.vtree .vtree-row[data-v-7d4b1960]:hover{background:var(--vtree-hover)}.vtree .vtree-row.is-active[data-v-7d4b1960],.vtree .vtree-row.is-active[data-v-7d4b1960]:hover{background:var(--active-color)}.vtree .vtree-row.is-target-inner[data-v-7d4b1960]{outline:2px dashed #409eff}.vtree .vtree-row .vtree-caret-box[data-v-7d4b1960]{display:inline-flex;align-items:center;justify-content:center;height:100%;aspect-ratio:1/1;min-width:16px;margin-right:4px;cursor:pointer}.vtree .vtree-row .vtree-caret-box.is-leaf[data-v-7d4b1960]{pointer-events:none}.vtree .vtree-row .vtree-caret[data-v-7d4b1960]{display:block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #909399;transform:rotate(-90deg);transition:transform .1s linear}.vtree .vtree-row .vtree-caret.expanded[data-v-7d4b1960]{transform:rotate(0)}.vtree .vtree-row .vtree-label[data-v-7d4b1960]{color:inherit}.vtree .vtree-ghost[data-v-7d4b1960]{position:fixed;left:16px;width:120px;height:24px;background:#409eff33;border:1px solid #409eff;pointer-events:none}.vtree .vtree-empty[data-v-7d4b1960]{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.vtree .vtree-empty[data-v-7d4b1960]>*{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.vtree .vtree-empty .vtree-empty-inner[data-v-7d4b1960]{color:var(--vtree-text)}[data-v-7d4b1960] .vtree::-webkit-scrollbar{width:8px;height:8px}[data-v-7d4b1960] .vtree::-webkit-scrollbar-track{background:transparent}[data-v-7d4b1960] .vtree::-webkit-scrollbar-thumb{background-color:#9093994d;border-radius:4px}[data-v-7d4b1960] .vtree::-webkit-scrollbar-thumb:hover{background-color:#90939980}

package/dist/amazing-tree.es.js

@@ -1,9 +1,9 @@
-import { defineComponent as We, computed as N, ref as i, reactive as we, watch as V, nextTick as C, onMounted as Oe, onUnmounted as Pe, watchEffect as Ue, createElementBlock as T, openBlock as K, normalizeStyle as _, normalizeClass as $, Fragment as ke, createElementVNode as Y, createCommentVNode as le, renderList as $e, withModifiers as ie, renderSlot as Ce, toDisplayString as be } from "vue";
+import { defineComponent as Oe, computed as N, ref as i, reactive as we, watch as _, nextTick as C, onMounted as Pe, onUnmounted as Ve, watchEffect as Ue, createElementBlock as T, openBlock as K, normalizeStyle as W, normalizeClass as $, Fragment as ke, createElementVNode as z, createCommentVNode as le, renderList as $e, withModifiers as ie, renderSlot as Ce, toDisplayString as be } from "vue";
 const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = ["checked", "indeterminate", "disabled", "onClick"], Je = { class: "vtree-label" }, Qe = {
   key: 1,
   class: "vtree-empty"
-}, Xe = { class: "vtree-empty-inner" }, q = 28, Ze = /* @__PURE__ */ We({
-  __name: "VirtualTree",
+}, Xe = { class: "vtree-empty-inner" }, q = 28, Ze = /* @__PURE__ */ Oe({
+  __name: "AmazingTree",
   props: {
     data: {},
     props: { default: () => ({ value: "value", label: "label", children: "children" }) },
@@ -24,9 +24,9 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
     defaultCheckedKeys: { default: () => [] },
     disabledChecked: {}
   },
-  emits: ["node-click", "node-contextmenu", "node-drop", "current-change"],
+  emits: ["node-click", "node-contextmenu", "node-drop", "current-change", "check-change"],
   setup(p, { expose: ne, emit: j }) {
-    const n = p, F = j, Se = N(() => n.props.value || "value"), Me = N(() => n.props.label || "label"), G = N(() => n.props.children || "children"), Ae = N(() => Array.isArray(n.data) ? n.data.length === 0 : !0), w = i(/* @__PURE__ */ new Set()), h = i(/* @__PURE__ */ new Set()), g = i(/* @__PURE__ */ new Set());
+    const n = p, R = j, Se = N(() => n.props.value || "value"), Me = N(() => n.props.label || "label"), G = N(() => n.props.children || "children"), Ae = N(() => Array.isArray(n.data) ? n.data.length === 0 : !0), w = i(/* @__PURE__ */ new Set()), h = i(/* @__PURE__ */ new Set()), g = i(/* @__PURE__ */ new Set());
     function re(e) {
       return w.value.has(e);
     }
@@ -78,7 +78,7 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
     }
     function Ie(e, t) {
       const l = t.target;
-      n.disabledChecked && n.disabledChecked(e.node) || ae(e.id, !!l.checked);
+      n.disabledChecked && n.disabledChecked(e.node) || (R("check-change", e.node, !!l.checked), ae(e.id, !!l.checked));
     }
     function b(e) {
       const t = [];
@@ -90,11 +90,11 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
       }
       return l(e, null, 0), t;
     }
-    const v = i(null), I = i(0), W = i(0), s = i([]), R = we(/* @__PURE__ */ new Map()), m = N(() => {
+    const v = i(null), I = i(0), O = i(0), s = i([]), B = we(/* @__PURE__ */ new Map()), m = N(() => {
       let e = 0;
       const t = [];
       for (const l of s.value) {
-        const a = R.get(l.id) || q;
+        const a = B.get(l.id) || q;
         e += a, t.push(e);
       }
       return t;
@@ -110,39 +110,39 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
       }
       return a;
     }
-    const B = i(0), S = i(0), D = i(0), oe = i(0);
+    const D = i(0), S = i(0), H = i(0), oe = i(0);
     function x() {
-      if (W.value = v.value?.clientHeight || 0, m.value.length === 0 || s.value.length === 0) {
-        B.value = 0, S.value = 0, D.value = 0, oe.value = 0;
+      if (O.value = v.value?.clientHeight || 0, m.value.length === 0 || s.value.length === 0) {
+        D.value = 0, S.value = 0, H.value = 0, oe.value = 0;
         return;
       }
       const e = fe(I.value);
-      B.value = Math.max(0, e - 3);
-      const t = s.value[B.value], l = t ? R.get(t.id) || q : 0, u = (m.value[B.value] ?? 0) - l;
-      D.value = Math.max(0, u);
-      let c = B.value;
-      const o = I.value + W.value + 3 * q;
+      D.value = Math.max(0, e - 3);
+      const t = s.value[D.value], l = t ? B.get(t.id) || q : 0, u = (m.value[D.value] ?? 0) - l;
+      H.value = Math.max(0, u);
+      let c = D.value;
+      const o = I.value + O.value + 3 * q;
       for (; c < s.value.length && (m.value[c] ?? 0) < o; ) c++;
       S.value = Math.min(s.value.length, c + 1);
-      const r = (m.value[S.value - 1] ?? 0) - D.value;
-      if (r < W.value && S.value < s.value.length) {
+      const r = (m.value[S.value - 1] ?? 0) - H.value;
+      if (r < O.value && S.value < s.value.length) {
         let d = S.value, y = r;
-        for (; y < W.value && d < s.value.length; )
-          d++, y = (m.value[d - 1] ?? 0) - D.value;
+        for (; y < O.value && d < s.value.length; )
+          d++, y = (m.value[d - 1] ?? 0) - H.value;
         S.value = d;
       }
-      oe.value = Math.max(0, ve.value - D.value - ((m.value[S.value - 1] ?? 0) - D.value));
+      oe.value = Math.max(0, ve.value - H.value - ((m.value[S.value - 1] ?? 0) - H.value));
     }
-    V([I, () => n.data, w], () => {
+    _([I, () => n.data, w], () => {
       s.value = b(n.data || []), C(L), x();
-    }), Oe(() => {
-      s.value = b(n.data || []), C(L), x(), n.defaultCheckedKeys && n.defaultCheckedKeys.length && de(n.defaultCheckedKeys), v.value && (O = new ResizeObserver(() => {
-        W.value = v.value?.clientHeight || 0, x();
-      }), O.observe(v.value));
+    }), Pe(() => {
+      s.value = b(n.data || []), C(L), x(), n.defaultCheckedKeys && n.defaultCheckedKeys.length && de(n.defaultCheckedKeys), v.value && (P = new ResizeObserver(() => {
+        O.value = v.value?.clientHeight || 0, x();
+      }), P.observe(v.value));
     });
-    let O = null;
-    Pe(() => {
-      O && (O.disconnect(), O = null);
+    let P = null;
+    Ve(() => {
+      P && (P.disconnect(), P = null);
     });
     const J = we(/* @__PURE__ */ new Map());
     function Le(e, t) {
@@ -150,11 +150,11 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
     }
     function L() {
       let e = !1;
-      for (const t of s.value.slice(B.value, S.value)) {
+      for (const t of s.value.slice(D.value, S.value)) {
         const l = J.get(t.id);
         if (l) {
           const a = l.offsetHeight;
-          (!R.has(t.id) || R.get(t.id) !== a) && (R.set(t.id, a), e = !0);
+          (!B.has(t.id) || B.get(t.id) !== a) && (B.set(t.id, a), e = !0);
         }
       }
       e && x();
@@ -162,10 +162,10 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
     function Re() {
       I.value = v.value?.scrollTop || 0, x();
     }
-    const M = i(!1), ue = i(null), P = i(null), A = i(null), ce = i(0), H = i(null), U = i(0);
-    let z = null;
+    const M = i(!1), ue = i(null), V = i(null), A = i(null), ce = i(0), Y = i(null), U = i(0);
+    let F = null;
     function Q() {
-      z != null && (cancelAnimationFrame(z), z = null);
+      F != null && (cancelAnimationFrame(F), F = null);
     }
     function he() {
       if (!M.value || U.value === 0) {
@@ -178,10 +178,10 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
         return;
       }
       const t = e.scrollHeight - e.clientHeight, l = 12;
-      e.scrollTop = Math.max(0, Math.min(t, e.scrollTop + U.value * l)), I.value = e.scrollTop, x(), z = requestAnimationFrame(he);
+      e.scrollTop = Math.max(0, Math.min(t, e.scrollTop + U.value * l)), I.value = e.scrollTop, x(), F = requestAnimationFrame(he);
     }
     function Be() {
-      U.value !== 0 && z == null && (z = requestAnimationFrame(he)), U.value === 0 && Q();
+      U.value !== 0 && F == null && (F = requestAnimationFrame(he)), U.value === 0 && Q();
     }
     function X(e) {
       if (e == null) return null;
@@ -199,11 +199,11 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
       if (!M.value) return;
       ce.value = e.clientY;
       const t = De(e.clientY), l = s.value[Math.min(Math.max(t, 0), s.value.length - 1)];
-      if (P.value = l?.id ?? null, !l) {
+      if (V.value = l?.id ?? null, !l) {
         A.value = null;
         return;
       }
-      const a = m.value[t] ?? 0, u = R.get(l.id) ?? q, c = a - u, o = v.value.getBoundingClientRect(), r = (e.clientY - o.top + I.value - c) / u;
+      const a = m.value[t] ?? 0, u = B.get(l.id) ?? q, c = a - u, o = v.value.getBoundingClientRect(), r = (e.clientY - o.top + I.value - c) / u;
       let d = "inner";
       r < 0.25 ? d = "prev" : r > 0.75 && (d = "next");
       const y = X(ue.value), te = n.allowDrop ? !!(y && n.allowDrop(y.node, l.node, d)) : !0;
@@ -247,7 +247,7 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
         l >= 0 && n.data.splice(l, 1);
       }
     }
-    function Fe(e, t, l) {
+    function ze(e, t, l) {
       if (l === "inner") {
         Array.isArray(t.node[G.value]) || (t.node[G.value] = []), t.node[G.value].push(e), w.value.add(t.id);
         return;
@@ -263,8 +263,8 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
     }
     function ge() {
       if (window.removeEventListener("mousemove", pe), window.removeEventListener("mouseup", ge), Q(), !M.value) return;
-      const e = X(ue.value), t = X(P.value), l = A.value;
-      if (M.value = !1, A.value = null, P.value = null, !e || !t || !l || n.allowDrop && !n.allowDrop(e.node, t.node, l) || e.id === t.id) return;
+      const e = X(ue.value), t = X(V.value), l = A.value;
+      if (M.value = !1, A.value = null, V.value = null, !e || !t || !l || n.allowDrop && !n.allowDrop(e.node, t.node, l) || e.id === t.id) return;
       const a = l === "inner" ? t.node : t.parent || null;
       if (a) {
         const f = Z(k(a), n.data || []) || [];
@@ -275,25 +275,25 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
       const c = b(n.data || []);
       s.value = c;
       const o = X(t.id) || t;
-      Fe(u, o, l), s.value = b(n.data || []), C(() => {
+      ze(u, o, l), s.value = b(n.data || []), C(() => {
         L(), x();
-      }), F("node-drop", u, o.node, l);
+      }), R("node-drop", u, o.node, l);
     }
-    function ze(e, t) {
-      H.value = e.id, F("node-click", e.node, t);
+    function Fe(e, t) {
+      Y.value = e.id, R("node-click", e.node, t);
     }
     function Ne(e, t) {
-      F("node-contextmenu", e.node, t);
+      R("node-contextmenu", e.node, t);
     }
     Ue(() => {
       C(L);
-    }), V(
+    }), _(
       () => n.currentNodeKey,
       (e) => {
-        H.value = e ?? null;
+        Y.value = e ?? null;
       },
       { immediate: !0 }
-    ), V(
+    ), _(
       () => n.defaultExpandedKeys,
       (e) => {
         w.value = new Set(e || []), s.value = b(n.data || []), C(() => {
@@ -301,7 +301,7 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
         });
       },
       { immediate: !0 }
-    ), V(
+    ), _(
       () => n.defaultExpandAll,
       (e) => {
         e && (w.value = new Set(ee(n.data || [])), s.value = b(n.data || []), C(() => {
@@ -309,7 +309,7 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
         }));
       },
       { immediate: !0 }
-    ), V(
+    ), _(
       () => n.data,
       () => {
         n.defaultExpandAll && (w.value = new Set(ee(n.data || [])), s.value = b(n.data || []), C(() => {
@@ -319,16 +319,16 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
         h.value = new Set([...h.value].filter((t) => e.has(t))), g.value = new Set([...g.value].filter((t) => e.has(t)));
       }
     );
-    function Ve(e) {
+    function _e(e) {
       const t = Z(e, n.data || []) || [];
       for (const l of t) w.value.add(k(l));
       s.value = b(n.data || []);
     }
     function me(e) {
-      e != null && (Ve(e), C(() => {
+      e != null && (_e(e), C(() => {
         const t = s.value.findIndex((o) => o.id === e);
         if (t < 0 || !v.value) return;
-        const l = R.get(e) || q, a = (m.value[t] ?? 0) - l, u = v.value.clientHeight, c = Math.max(0, a - Math.max(0, (u - l) / 2));
+        const l = B.get(e) || q, a = (m.value[t] ?? 0) - l, u = v.value.clientHeight, c = Math.max(0, a - Math.max(0, (u - l) / 2));
         v.value.scrollTop = c, I.value = c, x(), C(() => {
           const o = J.get(e);
           if (!o || !v.value) return;
@@ -337,51 +337,51 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
         });
       }));
     }
-    function _e(e) {
-      H.value = e ?? null, me(H.value);
+    function We(e) {
+      Y.value = e ?? null, me(Y.value);
     }
     return ne({
-      getCurrentKey: () => H.value,
-      setCurrentKey: _e,
+      getCurrentKey: () => Y.value,
+      setCurrentKey: We,
       scrollTo: me,
       getCheckedKeys: () => Array.from(h.value),
       setCheckedKeys: de,
       setChecked: (e, t) => ae(e, t)
-    }), V(H, (e) => {
+    }), _(Y, (e) => {
       const t = se(e, n.data || []);
-      t && F("current-change", t);
+      t && R("current-change", t);
     }), (e, t) => (K(), T("div", {
       ref_key: "containerRef",
       ref: v,
       class: $(["vtree", { "is-dragging": M.value }]),
-      style: _({ height: typeof p.height == "number" ? p.height + "px" : p.height || "100%", "--vtree-bg": p.backgroundColor, "--vtree-text": p.textColor, "--vtree-hover": p.hoverColor }),
+      style: W({ height: typeof p.height == "number" ? p.height + "px" : p.height || "100%", "--vtree-bg": p.backgroundColor, "--vtree-text": p.textColor, "--vtree-hover": p.hoverColor }),
       onScroll: Re
     }, [
       Ae.value ? (K(), T("div", Qe, [
         Ce(e.$slots, "empty", {}, () => [
-          Y("div", Xe, be(p.emptyText), 1)
+          z("div", Xe, be(p.emptyText), 1)
         ], !0)
       ])) : (K(), T(ke, { key: 0 }, [
-        Y("div", {
-          style: _({ height: ve.value + "px", position: "relative", minWidth: "100%", width: "max-content" })
+        z("div", {
+          style: W({ height: ve.value + "px", position: "relative", minWidth: "100%", width: "max-content" })
         }, [
-          Y("div", {
-            style: _({ height: D.value + "px" })
+          z("div", {
+            style: W({ height: H.value + "px" })
           }, null, 4),
-          (K(!0), T(ke, null, $e(s.value.slice(B.value, S.value), (l) => (K(), T("div", {
+          (K(!0), T(ke, null, $e(s.value.slice(D.value, S.value), (l) => (K(), T("div", {
             key: l.id,
             class: "vtree-row-wrapper"
           }, [
-            Y("div", {
-              class: $(["vtree-row", { "is-target-inner": M.value && P.value === l.id && A.value === "inner", "is-active": H.value === l.id }]),
-              style: _({ paddingLeft: l.level * 16 + "px", "--active-color": p.highlightColor }),
+            z("div", {
+              class: $(["vtree-row", { "is-target-inner": M.value && V.value === l.id && A.value === "inner", "is-active": Y.value === l.id }]),
+              style: W({ paddingLeft: l.level * 16 + "px", "--active-color": p.highlightColor }),
               onMousedown: (a) => He(l, a),
-              onClick: (a) => ze(l, a),
+              onClick: (a) => Fe(l, a),
               onContextmenu: ie((a) => Ne(l, a), ["prevent"]),
               ref_for: !0,
               ref: (a) => Le(l.id, a)
             }, [
-              Y("span", {
+              z("span", {
                 class: $(["vtree-caret-box", { "is-leaf": l.isLeaf }]),
                 onClick: ie((a) => !l.isLeaf && Te(l.id), ["stop"])
               }, [
@@ -406,32 +406,32 @@ const qe = ["onMousedown", "onClick", "onContextmenu"], je = ["onClick"], Ge = [
                 expanded: re(l.id),
                 isLeaf: l.isLeaf
               }, () => [
-                Y("span", Je, be(l.node[Me.value]), 1)
+                z("span", Je, be(l.node[Me.value]), 1)
               ], !0)
             ], 46, qe),
-            M.value && P.value === l.id && (A.value === "prev" || A.value === "next") ? (K(), T("div", {
+            M.value && V.value === l.id && (A.value === "prev" || A.value === "next") ? (K(), T("div", {
               key: 0,
               class: $(["vtree-drop-line", { "is-prev": A.value === "prev", "is-next": A.value === "next" }])
             }, null, 2)) : le("", !0)
           ]))), 128)),
-          Y("div", {
-            style: _({ height: oe.value + "px" })
+          z("div", {
+            style: W({ height: oe.value + "px" })
           }, null, 4)
         ], 4),
         M.value ? (K(), T("div", {
           key: 0,
           class: "vtree-ghost",
-          style: _({ top: ce.value + "px" })
+          style: W({ top: ce.value + "px" })
         }, null, 4)) : le("", !0)
       ], 64))
     ], 38));
   }
 }), et = (p, ne) => {
   const j = p.__vccOpts || p;
-  for (const [n, F] of ne)
-    j[n] = F;
+  for (const [n, R] of ne)
+    j[n] = R;
   return j;
-}, lt = /* @__PURE__ */ et(Ze, [["__scopeId", "data-v-cfceef5a"]]);
+}, lt = /* @__PURE__ */ et(Ze, [["__scopeId", "data-v-7d4b1960"]]);
 export {
-  lt as VirtualTree
+  lt as AmazingTree
 };

package/dist/amazing-tree.umd.js

@@ -1 +1 @@
-(function(A,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(A=typeof globalThis<"u"?globalThis:A||self,t(A.AmazingTree={},A.Vue))})(this,(function(A,t){"use strict";const ue=["onMousedown","onClick","onContextmenu"],fe=["onClick"],he=["checked","indeterminate","disabled","onClick"],ve={class:"vtree-label"},pe={key:1,class:"vtree-empty"},me={class:"vtree-empty-inner"},R=28,ge=((p,G)=>{const _=p.__vccOpts||p;for(const[a,L]of G)_[a]=L;return _})(t.defineComponent({__name:"VirtualTree",props:{data:{},props:{default:()=>({value:"value",label:"label",children:"children"})},allowDrag:{},allowDrop:{},height:{default:void 0},highlightColor:{default:"#1e71ff"},backgroundColor:{default:"#1d1d24"},textColor:{default:"#c8d3de"},hoverColor:{default:"#5d90e5"},currentNodeKey:{},defaultExpandedKeys:{},defaultExpandAll:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},emptyText:{default:"暂无数据"},showCheckbox:{type:Boolean,default:!1},checkStrictly:{type:Boolean,default:!1},defaultCheckedKeys:{default:()=>[]},disabledChecked:{}},emits:["node-click","node-contextmenu","node-drop","current-change"],setup(p,{expose:G,emit:_}){const a=p,L=_,xe=t.computed(()=>a.props.value||"value"),ke=t.computed(()=>a.props.label||"label"),O=t.computed(()=>a.props.children||"children"),ye=t.computed(()=>Array.isArray(a.data)?a.data.length===0:!0),y=t.ref(new Set),v=t.ref(new Set),m=t.ref(new Set);function te(e){return y.value.has(e)}function we(e){y.value.has(e)?y.value.delete(e):y.value.add(e),s.value=C(a.data||[]),t.nextTick(()=>{M(),x()})}function w(e){return e[xe.value]}function E(e){const l=e[O.value];return Array.isArray(l)?l:[]}function Ce(e){return v.value.has(e)}function be(e){return m.value.has(e)}function J(e,l){if(l?v.value.add(e):v.value.delete(e),m.value.delete(e),!a.checkStrictly){const n=ee(e,a.data||[]);if(n){const o=[n];for(;o.length;){const i=o.pop(),c=w(i);l?v.value.add(c):v.value.delete(c),m.value.delete(c);const h=E(i);for(const d of h)o.push(d)}const r=U(e,a.data||[])||[];for(const i of r){const c=w(i),h=E(i);let d=!0,u=!1;for(const k of h){const j=w(k),se=v.value.has(j),de=m.value.has(j);(se||de)&&(u=!0),(!se||de)&&(d=!1)}h.length===0?(v.value.has(c),m.value.delete(c)):d?(v.value.add(c),m.value.delete(c)):u?(v.value.delete(c),m.value.add(c)):(v.value.delete(c),m.value.delete(c))}}}}function le(e){v.value=new Set,m.value=new Set;for(const l of e||[])J(l,!0)}function Se(e,l){const n=l.target;a.disabledChecked&&a.disabledChecked(e.node)||J(e.id,!!n.checked)}function C(e){const l=[];function n(o,r,i){for(let c=0;c<o.length;c++){const h=o[c],d=w(h),u=E(h),k=u.length===0;l.push({id:d,node:h,parent:r,level:i,index:c,isLeaf:k}),!k&&y.value.has(d)&&n(u,h,i+1)}}return n(e,null,0),l}const f=t.ref(null),B=t.ref(0),D=t.ref(0),s=t.ref([]),K=t.reactive(new Map),g=t.computed(()=>{let e=0;const l=[];for(const n of s.value){const o=K.get(n.id)||R;e+=o,l.push(e)}return l}),ne=t.computed(()=>{const e=g.value;return e.length?e[e.length-1]:0});function ae(e){let l=0,n=g.value.length-1,o=0;for(;l<=n;){const r=l+n>>1;g.value[r]!==void 0&&g.value[r]>=e?(o=r,n=r-1):l=r+1}return o}const z=t.ref(0),b=t.ref(0),V=t.ref(0),Q=t.ref(0);function x(){if(D.value=f.value?.clientHeight||0,g.value.length===0||s.value.length===0){z.value=0,b.value=0,V.value=0,Q.value=0;return}const e=ae(B.value);z.value=Math.max(0,e-3);const l=s.value[z.value],n=l?K.get(l.id)||R:0,r=(g.value[z.value]??0)-n;V.value=Math.max(0,r);let i=z.value;const c=B.value+D.value+3*R;for(;i<s.value.length&&(g.value[i]??0)<c;)i++;b.value=Math.min(s.value.length,i+1);const d=(g.value[b.value-1]??0)-V.value;if(d<D.value&&b.value<s.value.length){let u=b.value,k=d;for(;k<D.value&&u<s.value.length;)u++,k=(g.value[u-1]??0)-V.value;b.value=u}Q.value=Math.max(0,ne.value-V.value-((g.value[b.value-1]??0)-V.value))}t.watch([B,()=>a.data,y],()=>{s.value=C(a.data||[]),t.nextTick(M),x()}),t.onMounted(()=>{s.value=C(a.data||[]),t.nextTick(M),x(),a.defaultCheckedKeys&&a.defaultCheckedKeys.length&&le(a.defaultCheckedKeys),f.value&&(F=new ResizeObserver(()=>{D.value=f.value?.clientHeight||0,x()}),F.observe(f.value))});let F=null;t.onUnmounted(()=>{F&&(F.disconnect(),F=null)});const P=t.reactive(new Map);function Te(e,l){l?P.set(e,l):P.delete(e)}function M(){let e=!1;for(const l of s.value.slice(z.value,b.value)){const n=P.get(l.id);if(n){const o=n.offsetHeight;(!K.has(l.id)||K.get(l.id)!==o)&&(K.set(l.id,o),e=!0)}}e&&x()}function Ee(){B.value=f.value?.scrollTop||0,x()}const S=t.ref(!1),X=t.ref(null),H=t.ref(null),T=t.ref(null),Z=t.ref(0),I=t.ref(null),Y=t.ref(0);let N=null;function W(){N!=null&&(cancelAnimationFrame(N),N=null)}function oe(){if(!S.value||Y.value===0){W();return}const e=f.value;if(!e){W();return}const l=e.scrollHeight-e.clientHeight,n=12;e.scrollTop=Math.max(0,Math.min(l,e.scrollTop+Y.value*n)),B.value=e.scrollTop,x(),N=requestAnimationFrame(oe)}function Be(){Y.value!==0&&N==null&&(N=requestAnimationFrame(oe)),Y.value===0&&W()}function q(e){if(e==null)return null;for(const l of s.value)if(l.id===e)return l;return null}function Me(e){const l=f.value.getBoundingClientRect(),n=e-l.top+B.value;return ae(n)}function Ae(e,l){!a.draggable||l.button!==0||!(!a.allowDrag||a.allowDrag(e.node))||(S.value=!0,X.value=e.id,Z.value=l.clientY,l.preventDefault(),window.addEventListener("mousemove",ce),window.addEventListener("mouseup",re))}function ce(e){if(!S.value)return;Z.value=e.clientY;const l=Me(e.clientY),n=s.value[Math.min(Math.max(l,0),s.value.length-1)];if(H.value=n?.id??null,!n){T.value=null;return}const o=g.value[l]??0,r=K.get(n.id)??R,i=o-r,c=f.value.getBoundingClientRect(),d=(e.clientY-c.top+B.value-i)/r;let u="inner";d<.25?u="prev":d>.75&&(u="next");const k=q(X.value),j=a.allowDrop?!!(k&&a.allowDrop(k.node,n.node,u)):!0;T.value=j?u:null,Y.value=e.clientY>c.bottom?1:e.clientY<c.top?-1:0,Be()}function U(e,l,n=[]){for(const o of l){if(w(o)===e)return n;const r=E(o);if(r.length){const i=U(e,r,[...n,o]);if(i)return i}}return null}function ee(e,l){if(e==null)return null;for(const n of l){if(w(n)===e)return n;const o=E(n),r=ee(e,o);if(r)return r}return null}function $(e){const l=[];for(const n of e){l.push(w(n));const o=E(n);o.length&&l.push(...$(o))}return l}function Ke(e){const l=e.parent;if(l)E(l).splice(e.index,1);else{const n=a.data.findIndex(o=>w(o)===e.id);n>=0&&a.data.splice(n,1)}}function ze(e,l,n){if(n==="inner"){Array.isArray(l.node[O.value])||(l.node[O.value]=[]),l.node[O.value].push(e),y.value.add(l.id);return}const o=l.parent;if(o){const r=E(o),i=l.index+(n==="next"?1:0);r.splice(i,0,e)}else{const r=l.index+(n==="next"?1:0);a.data.splice(r,0,e)}}function re(){if(window.removeEventListener("mousemove",ce),window.removeEventListener("mouseup",re),W(),!S.value)return;const e=q(X.value),l=q(H.value),n=T.value;if(S.value=!1,T.value=null,H.value=null,!e||!l||!n||a.allowDrop&&!a.allowDrop(e.node,l.node,n)||e.id===l.id)return;const o=n==="inner"?l.node:l.parent||null;if(o){const h=U(w(o),a.data||[])||[];for(const d of h)if(w(d)===e.id)return}const r=e.node;Ke(e);const i=C(a.data||[]);s.value=i;const c=q(l.id)||l;ze(r,c,n),s.value=C(a.data||[]),t.nextTick(()=>{M(),x()}),L("node-drop",r,c.node,n)}function Ve(e,l){I.value=e.id,L("node-click",e.node,l)}function Ie(e,l){L("node-contextmenu",e.node,l)}t.watchEffect(()=>{t.nextTick(M)}),t.watch(()=>a.currentNodeKey,e=>{I.value=e??null},{immediate:!0}),t.watch(()=>a.defaultExpandedKeys,e=>{y.value=new Set(e||[]),s.value=C(a.data||[]),t.nextTick(()=>{M(),x()})},{immediate:!0}),t.watch(()=>a.defaultExpandAll,e=>{e&&(y.value=new Set($(a.data||[])),s.value=C(a.data||[]),t.nextTick(()=>{M(),x()}))},{immediate:!0}),t.watch(()=>a.data,()=>{a.defaultExpandAll&&(y.value=new Set($(a.data||[])),s.value=C(a.data||[]),t.nextTick(()=>{M(),x()}));const e=new Set($(a.data||[]));v.value=new Set([...v.value].filter(l=>e.has(l))),m.value=new Set([...m.value].filter(l=>e.has(l)))});function Le(e){const l=U(e,a.data||[])||[];for(const n of l)y.value.add(w(n));s.value=C(a.data||[])}function ie(e){e!=null&&(Le(e),t.nextTick(()=>{const l=s.value.findIndex(c=>c.id===e);if(l<0||!f.value)return;const n=K.get(e)||R,o=(g.value[l]??0)-n,r=f.value.clientHeight,i=Math.max(0,o-Math.max(0,(r-n)/2));f.value.scrollTop=i,B.value=i,x(),t.nextTick(()=>{const c=P.get(e);if(!c||!f.value)return;const h=c.offsetLeft,d=c.offsetWidth,u=f.value.clientWidth,k=Math.max(0,h+Math.max(0,d/2)-Math.max(0,u/2));f.value.scrollLeft=k})}))}function Ne(e){I.value=e??null,ie(I.value)}return G({getCurrentKey:()=>I.value,setCurrentKey:Ne,scrollTo:ie,getCheckedKeys:()=>Array.from(v.value),setCheckedKeys:le,setChecked:(e,l)=>J(e,l)}),t.watch(I,e=>{const l=ee(e,a.data||[]);l&&L("current-change",l)}),(e,l)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"containerRef",ref:f,class:t.normalizeClass(["vtree",{"is-dragging":S.value}]),style:t.normalizeStyle({height:typeof p.height=="number"?p.height+"px":p.height||"100%","--vtree-bg":p.backgroundColor,"--vtree-text":p.textColor,"--vtree-hover":p.hoverColor}),onScroll:Ee},[ye.value?(t.openBlock(),t.createElementBlock("div",pe,[t.renderSlot(e.$slots,"empty",{},()=>[t.createElementVNode("div",me,t.toDisplayString(p.emptyText),1)],!0)])):(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createElementVNode("div",{style:t.normalizeStyle({height:ne.value+"px",position:"relative",minWidth:"100%",width:"max-content"})},[t.createElementVNode("div",{style:t.normalizeStyle({height:V.value+"px"})},null,4),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(s.value.slice(z.value,b.value),n=>(t.openBlock(),t.createElementBlock("div",{key:n.id,class:"vtree-row-wrapper"},[t.createElementVNode("div",{class:t.normalizeClass(["vtree-row",{"is-target-inner":S.value&&H.value===n.id&&T.value==="inner","is-active":I.value===n.id}]),style:t.normalizeStyle({paddingLeft:n.level*16+"px","--active-color":p.highlightColor}),onMousedown:o=>Ae(n,o),onClick:o=>Ve(n,o),onContextmenu:t.withModifiers(o=>Ie(n,o),["prevent"]),ref_for:!0,ref:o=>Te(n.id,o)},[t.createElementVNode("span",{class:t.normalizeClass(["vtree-caret-box",{"is-leaf":n.isLeaf}]),onClick:t.withModifiers(o=>!n.isLeaf&&we(n.id),["stop"])},[n.isLeaf?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["vtree-caret",{expanded:te(n.id)}])},null,2))],10,fe),p.showCheckbox?(t.openBlock(),t.createElementBlock("input",{key:0,class:"vtree-checkbox",type:"checkbox",checked:Ce(n.id),indeterminate:be(n.id),disabled:a.disabledChecked?a.disabledChecked(n.node):!1,onClick:t.withModifiers(o=>Se(n,o),["stop"])},null,8,he)):t.createCommentVNode("",!0),t.renderSlot(e.$slots,"default",{node:n.node,data:n.node,level:n.level,expanded:te(n.id),isLeaf:n.isLeaf},()=>[t.createElementVNode("span",ve,t.toDisplayString(n.node[ke.value]),1)],!0)],46,ue),S.value&&H.value===n.id&&(T.value==="prev"||T.value==="next")?(t.openBlock(),t.createElementBlock("div",{key:0,class:t.normalizeClass(["vtree-drop-line",{"is-prev":T.value==="prev","is-next":T.value==="next"}])},null,2)):t.createCommentVNode("",!0)]))),128)),t.createElementVNode("div",{style:t.normalizeStyle({height:Q.value+"px"})},null,4)],4),S.value?(t.openBlock(),t.createElementBlock("div",{key:0,class:"vtree-ghost",style:t.normalizeStyle({top:Z.value+"px"})},null,4)):t.createCommentVNode("",!0)],64))],38))}}),[["__scopeId","data-v-cfceef5a"]]);A.VirtualTree=ge,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})}));
+(function(A,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(A=typeof globalThis<"u"?globalThis:A||self,t(A.AmazingTree={},A.Vue))})(this,(function(A,t){"use strict";const ue=["onMousedown","onClick","onContextmenu"],fe=["onClick"],he=["checked","indeterminate","disabled","onClick"],ve={class:"vtree-label"},pe={key:1,class:"vtree-empty"},me={class:"vtree-empty-inner"},V=28,ge=((p,G)=>{const _=p.__vccOpts||p;for(const[a,z]of G)_[a]=z;return _})(t.defineComponent({__name:"AmazingTree",props:{data:{},props:{default:()=>({value:"value",label:"label",children:"children"})},allowDrag:{},allowDrop:{},height:{default:void 0},highlightColor:{default:"#1e71ff"},backgroundColor:{default:"#1d1d24"},textColor:{default:"#c8d3de"},hoverColor:{default:"#5d90e5"},currentNodeKey:{},defaultExpandedKeys:{},defaultExpandAll:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},emptyText:{default:"暂无数据"},showCheckbox:{type:Boolean,default:!1},checkStrictly:{type:Boolean,default:!1},defaultCheckedKeys:{default:()=>[]},disabledChecked:{}},emits:["node-click","node-contextmenu","node-drop","current-change","check-change"],setup(p,{expose:G,emit:_}){const a=p,z=_,ke=t.computed(()=>a.props.value||"value"),xe=t.computed(()=>a.props.label||"label"),O=t.computed(()=>a.props.children||"children"),ye=t.computed(()=>Array.isArray(a.data)?a.data.length===0:!0),y=t.ref(new Set),v=t.ref(new Set),m=t.ref(new Set);function te(e){return y.value.has(e)}function we(e){y.value.has(e)?y.value.delete(e):y.value.add(e),s.value=C(a.data||[]),t.nextTick(()=>{M(),k()})}function w(e){return e[ke.value]}function E(e){const n=e[O.value];return Array.isArray(n)?n:[]}function Ce(e){return v.value.has(e)}function be(e){return m.value.has(e)}function J(e,n){if(n?v.value.add(e):v.value.delete(e),m.value.delete(e),!a.checkStrictly){const l=ee(e,a.data||[]);if(l){const o=[l];for(;o.length;){const i=o.pop(),c=w(i);n?v.value.add(c):v.value.delete(c),m.value.delete(c);const h=E(i);for(const d of h)o.push(d)}const r=U(e,a.data||[])||[];for(const i of r){const c=w(i),h=E(i);let d=!0,u=!1;for(const x of h){const j=w(x),se=v.value.has(j),de=m.value.has(j);(se||de)&&(u=!0),(!se||de)&&(d=!1)}h.length===0?(v.value.has(c),m.value.delete(c)):d?(v.value.add(c),m.value.delete(c)):u?(v.value.delete(c),m.value.add(c)):(v.value.delete(c),m.value.delete(c))}}}}function ne(e){v.value=new Set,m.value=new Set;for(const n of e||[])J(n,!0)}function Se(e,n){const l=n.target;a.disabledChecked&&a.disabledChecked(e.node)||(z("check-change",e.node,!!l.checked),J(e.id,!!l.checked))}function C(e){const n=[];function l(o,r,i){for(let c=0;c<o.length;c++){const h=o[c],d=w(h),u=E(h),x=u.length===0;n.push({id:d,node:h,parent:r,level:i,index:c,isLeaf:x}),!x&&y.value.has(d)&&l(u,h,i+1)}}return l(e,null,0),n}const f=t.ref(null),B=t.ref(0),D=t.ref(0),s=t.ref([]),K=t.reactive(new Map),g=t.computed(()=>{let e=0;const n=[];for(const l of s.value){const o=K.get(l.id)||V;e+=o,n.push(e)}return n}),le=t.computed(()=>{const e=g.value;return e.length?e[e.length-1]:0});function ae(e){let n=0,l=g.value.length-1,o=0;for(;n<=l;){const r=n+l>>1;g.value[r]!==void 0&&g.value[r]>=e?(o=r,l=r-1):n=r+1}return o}const I=t.ref(0),b=t.ref(0),L=t.ref(0),Q=t.ref(0);function k(){if(D.value=f.value?.clientHeight||0,g.value.length===0||s.value.length===0){I.value=0,b.value=0,L.value=0,Q.value=0;return}const e=ae(B.value);I.value=Math.max(0,e-3);const n=s.value[I.value],l=n?K.get(n.id)||V:0,r=(g.value[I.value]??0)-l;L.value=Math.max(0,r);let i=I.value;const c=B.value+D.value+3*V;for(;i<s.value.length&&(g.value[i]??0)<c;)i++;b.value=Math.min(s.value.length,i+1);const d=(g.value[b.value-1]??0)-L.value;if(d<D.value&&b.value<s.value.length){let u=b.value,x=d;for(;x<D.value&&u<s.value.length;)u++,x=(g.value[u-1]??0)-L.value;b.value=u}Q.value=Math.max(0,le.value-L.value-((g.value[b.value-1]??0)-L.value))}t.watch([B,()=>a.data,y],()=>{s.value=C(a.data||[]),t.nextTick(M),k()}),t.onMounted(()=>{s.value=C(a.data||[]),t.nextTick(M),k(),a.defaultCheckedKeys&&a.defaultCheckedKeys.length&&ne(a.defaultCheckedKeys),f.value&&(F=new ResizeObserver(()=>{D.value=f.value?.clientHeight||0,k()}),F.observe(f.value))});let F=null;t.onUnmounted(()=>{F&&(F.disconnect(),F=null)});const P=t.reactive(new Map);function Te(e,n){n?P.set(e,n):P.delete(e)}function M(){let e=!1;for(const n of s.value.slice(I.value,b.value)){const l=P.get(n.id);if(l){const o=l.offsetHeight;(!K.has(n.id)||K.get(n.id)!==o)&&(K.set(n.id,o),e=!0)}}e&&k()}function Ee(){B.value=f.value?.scrollTop||0,k()}const S=t.ref(!1),X=t.ref(null),H=t.ref(null),T=t.ref(null),Z=t.ref(0),N=t.ref(null),Y=t.ref(0);let R=null;function W(){R!=null&&(cancelAnimationFrame(R),R=null)}function oe(){if(!S.value||Y.value===0){W();return}const e=f.value;if(!e){W();return}const n=e.scrollHeight-e.clientHeight,l=12;e.scrollTop=Math.max(0,Math.min(n,e.scrollTop+Y.value*l)),B.value=e.scrollTop,k(),R=requestAnimationFrame(oe)}function Be(){Y.value!==0&&R==null&&(R=requestAnimationFrame(oe)),Y.value===0&&W()}function q(e){if(e==null)return null;for(const n of s.value)if(n.id===e)return n;return null}function Me(e){const n=f.value.getBoundingClientRect(),l=e-n.top+B.value;return ae(l)}function Ae(e,n){!a.draggable||n.button!==0||!(!a.allowDrag||a.allowDrag(e.node))||(S.value=!0,X.value=e.id,Z.value=n.clientY,n.preventDefault(),window.addEventListener("mousemove",ce),window.addEventListener("mouseup",re))}function ce(e){if(!S.value)return;Z.value=e.clientY;const n=Me(e.clientY),l=s.value[Math.min(Math.max(n,0),s.value.length-1)];if(H.value=l?.id??null,!l){T.value=null;return}const o=g.value[n]??0,r=K.get(l.id)??V,i=o-r,c=f.value.getBoundingClientRect(),d=(e.clientY-c.top+B.value-i)/r;let u="inner";d<.25?u="prev":d>.75&&(u="next");const x=q(X.value),j=a.allowDrop?!!(x&&a.allowDrop(x.node,l.node,u)):!0;T.value=j?u:null,Y.value=e.clientY>c.bottom?1:e.clientY<c.top?-1:0,Be()}function U(e,n,l=[]){for(const o of n){if(w(o)===e)return l;const r=E(o);if(r.length){const i=U(e,r,[...l,o]);if(i)return i}}return null}function ee(e,n){if(e==null)return null;for(const l of n){if(w(l)===e)return l;const o=E(l),r=ee(e,o);if(r)return r}return null}function $(e){const n=[];for(const l of e){n.push(w(l));const o=E(l);o.length&&n.push(...$(o))}return n}function ze(e){const n=e.parent;if(n)E(n).splice(e.index,1);else{const l=a.data.findIndex(o=>w(o)===e.id);l>=0&&a.data.splice(l,1)}}function Ke(e,n,l){if(l==="inner"){Array.isArray(n.node[O.value])||(n.node[O.value]=[]),n.node[O.value].push(e),y.value.add(n.id);return}const o=n.parent;if(o){const r=E(o),i=n.index+(l==="next"?1:0);r.splice(i,0,e)}else{const r=n.index+(l==="next"?1:0);a.data.splice(r,0,e)}}function re(){if(window.removeEventListener("mousemove",ce),window.removeEventListener("mouseup",re),W(),!S.value)return;const e=q(X.value),n=q(H.value),l=T.value;if(S.value=!1,T.value=null,H.value=null,!e||!n||!l||a.allowDrop&&!a.allowDrop(e.node,n.node,l)||e.id===n.id)return;const o=l==="inner"?n.node:n.parent||null;if(o){const h=U(w(o),a.data||[])||[];for(const d of h)if(w(d)===e.id)return}const r=e.node;ze(e);const i=C(a.data||[]);s.value=i;const c=q(n.id)||n;Ke(r,c,l),s.value=C(a.data||[]),t.nextTick(()=>{M(),k()}),z("node-drop",r,c.node,l)}function Ie(e,n){N.value=e.id,z("node-click",e.node,n)}function Le(e,n){z("node-contextmenu",e.node,n)}t.watchEffect(()=>{t.nextTick(M)}),t.watch(()=>a.currentNodeKey,e=>{N.value=e??null},{immediate:!0}),t.watch(()=>a.defaultExpandedKeys,e=>{y.value=new Set(e||[]),s.value=C(a.data||[]),t.nextTick(()=>{M(),k()})},{immediate:!0}),t.watch(()=>a.defaultExpandAll,e=>{e&&(y.value=new Set($(a.data||[])),s.value=C(a.data||[]),t.nextTick(()=>{M(),k()}))},{immediate:!0}),t.watch(()=>a.data,()=>{a.defaultExpandAll&&(y.value=new Set($(a.data||[])),s.value=C(a.data||[]),t.nextTick(()=>{M(),k()}));const e=new Set($(a.data||[]));v.value=new Set([...v.value].filter(n=>e.has(n))),m.value=new Set([...m.value].filter(n=>e.has(n)))});function Ne(e){const n=U(e,a.data||[])||[];for(const l of n)y.value.add(w(l));s.value=C(a.data||[])}function ie(e){e!=null&&(Ne(e),t.nextTick(()=>{const n=s.value.findIndex(c=>c.id===e);if(n<0||!f.value)return;const l=K.get(e)||V,o=(g.value[n]??0)-l,r=f.value.clientHeight,i=Math.max(0,o-Math.max(0,(r-l)/2));f.value.scrollTop=i,B.value=i,k(),t.nextTick(()=>{const c=P.get(e);if(!c||!f.value)return;const h=c.offsetLeft,d=c.offsetWidth,u=f.value.clientWidth,x=Math.max(0,h+Math.max(0,d/2)-Math.max(0,u/2));f.value.scrollLeft=x})}))}function Re(e){N.value=e??null,ie(N.value)}return G({getCurrentKey:()=>N.value,setCurrentKey:Re,scrollTo:ie,getCheckedKeys:()=>Array.from(v.value),setCheckedKeys:ne,setChecked:(e,n)=>J(e,n)}),t.watch(N,e=>{const n=ee(e,a.data||[]);n&&z("current-change",n)}),(e,n)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"containerRef",ref:f,class:t.normalizeClass(["vtree",{"is-dragging":S.value}]),style:t.normalizeStyle({height:typeof p.height=="number"?p.height+"px":p.height||"100%","--vtree-bg":p.backgroundColor,"--vtree-text":p.textColor,"--vtree-hover":p.hoverColor}),onScroll:Ee},[ye.value?(t.openBlock(),t.createElementBlock("div",pe,[t.renderSlot(e.$slots,"empty",{},()=>[t.createElementVNode("div",me,t.toDisplayString(p.emptyText),1)],!0)])):(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createElementVNode("div",{style:t.normalizeStyle({height:le.value+"px",position:"relative",minWidth:"100%",width:"max-content"})},[t.createElementVNode("div",{style:t.normalizeStyle({height:L.value+"px"})},null,4),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(s.value.slice(I.value,b.value),l=>(t.openBlock(),t.createElementBlock("div",{key:l.id,class:"vtree-row-wrapper"},[t.createElementVNode("div",{class:t.normalizeClass(["vtree-row",{"is-target-inner":S.value&&H.value===l.id&&T.value==="inner","is-active":N.value===l.id}]),style:t.normalizeStyle({paddingLeft:l.level*16+"px","--active-color":p.highlightColor}),onMousedown:o=>Ae(l,o),onClick:o=>Ie(l,o),onContextmenu:t.withModifiers(o=>Le(l,o),["prevent"]),ref_for:!0,ref:o=>Te(l.id,o)},[t.createElementVNode("span",{class:t.normalizeClass(["vtree-caret-box",{"is-leaf":l.isLeaf}]),onClick:t.withModifiers(o=>!l.isLeaf&&we(l.id),["stop"])},[l.isLeaf?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["vtree-caret",{expanded:te(l.id)}])},null,2))],10,fe),p.showCheckbox?(t.openBlock(),t.createElementBlock("input",{key:0,class:"vtree-checkbox",type:"checkbox",checked:Ce(l.id),indeterminate:be(l.id),disabled:a.disabledChecked?a.disabledChecked(l.node):!1,onClick:t.withModifiers(o=>Se(l,o),["stop"])},null,8,he)):t.createCommentVNode("",!0),t.renderSlot(e.$slots,"default",{node:l.node,data:l.node,level:l.level,expanded:te(l.id),isLeaf:l.isLeaf},()=>[t.createElementVNode("span",ve,t.toDisplayString(l.node[xe.value]),1)],!0)],46,ue),S.value&&H.value===l.id&&(T.value==="prev"||T.value==="next")?(t.openBlock(),t.createElementBlock("div",{key:0,class:t.normalizeClass(["vtree-drop-line",{"is-prev":T.value==="prev","is-next":T.value==="next"}])},null,2)):t.createCommentVNode("",!0)]))),128)),t.createElementVNode("div",{style:t.normalizeStyle({height:Q.value+"px"})},null,4)],4),S.value?(t.openBlock(),t.createElementBlock("div",{key:0,class:"vtree-ghost",style:t.normalizeStyle({top:Z.value+"px"})},null,4)):t.createCommentVNode("",!0)],64))],38))}}),[["__scopeId","data-v-7d4b1960"]]);A.AmazingTree=ge,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amazing-tree",
-  "version": "1.0.0",
+  "version": "1.2.0",
   "private": false,
   "type": "module",
   "engines": {
@@ -49,5 +49,6 @@
       "require": "./dist/amazing-tree.cjs.js"
     }
   },
-  "author": "maxkang"
+  "author": "maxkang",
+  "style": "dist/amazing-tree.css"
 }