@pantograph/vue 0.26.0 → 0.27.0

package/dist/Tree.vue_vue_type_script_setup_true_lang-BExNSikU.js

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),c=require("@pantograph/utils"),Ce=require("class-variance-authority"),w=require("es-toolkit"),Re=require("@pantograph/sortable"),Oe=require("reka-ui"),Se=require("./options-CY2uxp5A.js");require("@pantograph/tokens");const X=require("./Icon.vue_vue_type_script_setup_true_lang-CXwAf04H.js");require("@vueuse/core");require("@tanstack/vue-virtual");const Be=require("./IndentLevel.vue_vue_type_script_setup_true_lang-B9koS5pw.js"),qe=require("./Checkbox.vue_vue_type_script_setup_true_lang-Bq7H8Hmk.js"),Fe=require("./ConfigProvider.vue_vue_type_script_setup_true_lang-BAXkTMEt.js"),Ae=require("./ScrollContainer.vue_vue_type_script_setup_true_lang-WN0vUSFg.js"),$e=require("./useInputDataStates-B2KtpFr0.js"),De=require("./useVirtualScroll-3vEZzPrF.js"),Ge=require("@pantograph/style/tree.css?raw"),Ie=["sm","md","lg"],me={none:"gap-none",sm:"gap-sm",md:"gap-md",lg:"gap-lg"},[xe,we]=Oe.createContext("Tree"),Me=["data-key","data-level","data-draggable","tabindex"],ze=e.defineComponent({...Se.getComponentOptions("TreeNode"),__name:"TreeNode",props:{node:{}},setup(P){const d=P;e.useSlots();const l=xe(),t=Ce.cva(l.prefixes.node,{variants:{disabled:c.generateVariantClassList("disabled",l.prefixes.node),active:c.generateVariantClassList("active",l.prefixes.node)}}),f=v=>l.getNodeChildren(v,!0,!1),T=e.computed(()=>f(d.node)),_=e.computed(()=>l.props.draggable?d.node._draggable??!0:!1),k=e.computed(()=>!!(l.disabled.value||d.node._disabled)),R=e.computed(()=>d.node._dragging??!1),b=e.computed(()=>!R.value&&l.expandedKeys.value.includes(d.node._key)),z=e.computed(()=>!R.value&&!l.dragging.value&&l.props.showLine?I.value?"all":"before":!1),C=e.computed(()=>l.getIsSelected(d.node)),B=e.computed(()=>l.getIsChecked(d.node)),Y=v=>l.onCheck(d.node,!!v),O=e.computed(()=>l.getLevel(d.node)),I=e.computed(()=>{var v,r;return!!((v=T.value)!=null&&v.length||(r=l.props)!=null&&r.lazyLoad&&!d.node._leaf)}),x=e.computed(()=>({...d.node,selected:C.value,checked:B.value,disabled:k.value,expanded:b.value,unFocusable:!0})),G=()=>{k.value||l.onSelect(d.node,!C.value)};return(v,r)=>{var i,u,m,h,V,y,M;return e.openBlock(),e.createElementBlock("div",{"data-key":(i=e.unref(l).props)!=null&&i.draggable?v.node._key:void 0,"data-level":(u=e.unref(l).props)!=null&&u.draggable?O.value:void 0,"data-draggable":(m=e.unref(l).props)!=null&&m.draggable?!k.value&&_.value:void 0,class:e.normalizeClass(e.unref(c.normCls)(e.unref(t)({disabled:k.value,active:C.value}),d.node.class??"")),tabindex:e.unref(l).props.focusable?0:void 0,onClick:G},[(h=e.unref(l).props)!=null&&h.draggable?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(l).prefixes.draggable)},[e.unref(l).dragging.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(X._sfc_main$2,{key:0,icon:"tabler:grip-vertical",size:e.unref(l).iconSize.value,class:e.normalizeClass(e.unref(l).prefixes.draggableIcon)},null,8,["size","class"]))],2)):e.createCommentVNode("",!0),e.createVNode(Be._sfc_main,{level:O.value,children:I.value,size:e.unref(l).indentSize.value,expanded:b.value,showLine:z.value,dir:e.unref(l).props.dir,class:e.normalizeClass(e.unref(c.getBemElement)(e.unref(l).prefixes.node,"indent")),loading:v.node._loading,"branch-icon":v.node._switcherIcon??((V=e.unref(l).props)==null?void 0:V.switcherIcon),"no-rotate-branch":v.node._noRotateSwitcherIcon??((y=e.unref(l).props)==null?void 0:y.noRotateSwitcherIcon),onToggleExpand:r[0]||(r[0]=e.withModifiers($=>e.unref(l).onExpandKey(d.node),["stop"]))},{default:e.withCtx(()=>[e.renderSlot(v.$slots,"switcherIcon",e.normalizeProps(e.guardReactiveProps(x.value)))]),_:3},8,["level","children","size","expanded","showLine","dir","class","loading","branch-icon","no-rotate-branch"]),(M=e.unref(l).props)!=null&&M.checkable?(e.openBlock(),e.createBlock(qe._sfc_main,{key:1,size:e.unref(l).iconSize.value,onClick:r[1]||(r[1]=e.withModifiers(()=>{},["stop"])),modelValue:B.value,"onUpdate:modelValue":Y,disabled:k.value},null,8,["size","modelValue","disabled"])):e.createCommentVNode("",!0),e.renderSlot(v.$slots,"default",e.normalizeProps(e.guardReactiveProps(x.value)),()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(c.getBemElement)(e.unref(l).prefixes.node,"title"))},e.toDisplayString(v.node._title),3)])],10,Me)}}}),Q=P=>w.isString(P);function Ve({getValue:P,getDisabled:d,arr:l,getChildren:t,getExtra:f,allowNoValidKey:T}){const _=[],k=(R,b)=>{R.forEach(z=>{const C=t(z,b),B=P(z,b,C);if(Q(B)||T!=null&&T(z,b,C))_.push({...typeof z=="object"?z:{_item:z},_parentKeys:b,_key:B,_disabled:!!d(z),_hasChildren:!!(C!=null&&C.length),...(f==null?void 0:f(z))??{}}),C!=null&&C.length&&k(C,[...b??[],B]);else throw"every node must provide a valid key"})};return k(l),_}const je=({getData:P,getExpandedKeys:d,getValue:l,getDisabled:t,getChildren:f,isFlatten:T,getExtra:_})=>{const k=e.computed(()=>T?e.unref(P()):Ve({arr:e.unref(P()),getChildren:f,getValue:l,getDisabled:t,getExtra:_})),R=e.computed(()=>{const r=e.unref(d());return k.value.filter(i=>{var u,m;return!i._parentKeys||((m=(u=i._parentKeys)==null?void 0:u.every)==null?void 0:m.call(u,h=>r.includes(h)))})}),b=(r,i=!1,u=!0)=>{const m=r==null?void 0:r._key;return!Q(m)||!r?[]:k.value.filter(h=>{var V;if(i){const y=w.last(h._parentKeys??[]);return y&&y===m}return(V=h._parentKeys)==null?void 0:V.includes(m)}).filter(h=>h&&(!u||!(h!=null&&h._disabled)))},z=()=>k.value.filter(r=>!r._parentKeys),C=r=>r?b(r,!0,!1):z(),B=r=>Q(r)?k.value.find(i=>i._key===r):void 0,Y=r=>{const i=B(w.last(r._parentKeys??[]));return C(i).findIndex(u=>u._key===r._key)},O=r=>{const i=e.unref(r);return i&&X.isArray(i)?w.cloneDeep(i):[]},I=(r,i)=>{const u=b(r);if(u!=null&&u.length)return u.some(m=>G(m,i,!1)===!0)},x=(r,i)=>{const u=b(r);return u!=null&&u.length?u.every(m=>G(m,i,!1)===!0):!1},G=(r,i,u=!1)=>{const m=O(i),h=r==null?void 0:r._key;if(!u&&!r._disabled&&!m.includes(h)){const V=b(r);if(V!=null&&V.length)return x(r,i)?!0:I(r,i)?"indeterminate":!1}return m.includes(h)};return{flattenData:k,visibleFlattenData:R,getNodeChildren:b,getNodeByValue:B,getNodeIndexInScope:Y,getChildrenOrRootNodes:C,isSomeChildrenSelected:I,isAllChildrenSelected:x,isSelected:G,getRootNodes:z,selectValue:(r,i,u,m,h,V)=>{let y=O(u);if(Q(r._key)&&!r._disabled)if(h){if(i?y.push(r._key):y=y.filter(M=>r._key!==M),!m){const $=b(r).map(p=>p._key),J=y.map(B).filter(p=>p&&p._parentKeys);i||J.push(r);const Z=w.uniq(w.flattenDeep(J.map(p=>p._parentKeys))).filter(p=>Q(p)&&p!==r._key).filter(Q).map(B).filter(Boolean),K=[],D=[];Z.forEach(p=>{const re=p==null?void 0:p._key;x(p,y)?K.push(re):D.push(re)}),i?K.push(...$):D.push(...$),y.push(...K),y=y.filter(p=>!D.includes(p))}}else V==="replace"?i&&(y=[r._key]):i?y=[r._key]:y=[];return w.uniq(y)}}},Ue=e.defineComponent({__name:"TreePlaceholder",props:{level:{},size:{},indentSize:{},branchIcon:{},children:{type:Boolean}},setup(P){return(d,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(e.unref(Be._sfc_main),{level:d.level,expanded:!1,branchIcon:d.branchIcon,children:d.children,size:d.indentSize},null,8,["level","branchIcon","children","size"]),e.createElementVNode("div",{class:e.normalizeClass(e.unref(X.sortPlaceholderVariantsClass)({size:d.size}))},null,2)],64))}}),ie={"3xsm":14,"2xsm":16,xsm:20,sm:24,md:32,lg:40,xlg:48,"2xlg":56},We=Object.keys(ie),He=e.defineComponent({...Se.getComponentOptions("Tree"),__name:"Tree",props:{selectionBehavior:{default:"toggle"},class:{},size:{default:"md"},gap:{},dir:{},data:{},flattenData:{type:Boolean},modelValue:{},checkedKeys:{},expandedKeys:{},multiple:{type:Boolean},checkable:{type:Boolean},selectable:{type:Boolean},defaultExpandAll:{type:Boolean},showLine:{type:Boolean},inlineNode:{type:Boolean},lazyLoad:{type:Boolean},getLoading:{},getNoRotateSwitcherIcon:{},getTitle:{},getLeaf:{},getDraggable:{},getKey:{},getSwitcherIcon:{},getDisabled:{},getChildren:{},groupName:{},sortableProps:{},focusable:{type:Boolean,default:!0},checkStrictly:{type:Boolean,default:void 0},syncCheckboxAndSelect:{type:Boolean},virtual:{type:[Boolean,Object]},scrollContainerProps:{},outerVirtualScroll:{type:Boolean},switcherIcon:{},noRotateSwitcherIcon:{type:Boolean},draggable:{type:Boolean},disabled:{type:Boolean,default:void 0}},emits:["update:modelValue","update:expandedKeys","update:checkedKeys","change","expand","select","check","dragStart","dragEnd","choose","unchoose"],setup(P,{expose:d,emit:l}){X.useComponentStyle("tree",Ge);const t=P,f=l,T=e.useSlots(),_=c.getBemBlock("tree"),k=c.getBemElement(_,"node"),R=c.getBemElement(k,"group"),b=c.getBemElement(k,"draggable"),z=c.getBemElement(b,"icon"),C=c.getBemElement(R,"list"),B={node:k,group:R,draggable:b,draggableIcon:z,groupList:C},Y=Ce.cva(_,{variants:{size:c.generateVariantClassList(Ie,_),gap:c.generateVariantClassList(me,_),selectable:c.generateVariantClassList("selectable",_),disabled:c.generateVariantClassList("disabled",_),inlineNode:c.generateVariantClassList("inline-node",_),dragging:c.generateVariantClassList("dragging",_)}}),O={getLoading:c.createOptionGetterFunc({key:"loading",getter:t.getLoading,noReturnOption:!0}),getNoRotateSwitcherIcon:c.createOptionGetterFunc({key:"noRotateSwitcherIcon",getter:t.getNoRotateSwitcherIcon,noReturnOption:!0}),getTitle:c.createOptionGetterFunc({key:"title",getter:t.getTitle,noReturnOption:!0}),getLeaf:c.createOptionGetterFunc({key:"leaf",getter:t.getLeaf,noReturnOption:!0}),getDraggable:c.createOptionGetterFunc({key:"draggable",getter:t.getDraggable,noReturnOption:!0}),getKey:c.createOptionGetterFunc({key:"key",getter:t.getKey,noReturnOption:!0}),getSwitcherIcon:c.createOptionGetterFunc({key:"switcherIcon",getter:t.getSwitcherIcon,noReturnOption:!0}),getDisabled:c.createOptionGetterFunc({key:"disabled",getter:t.getDisabled,noReturnOption:!0}),getChildren:c.createOptionGetterFunc({key:"children",getter:t.getChildren,noReturnOption:!0})},I=(n,o)=>{var q;const s=`get${o[0].toUpperCase()+o.slice(1)}`;return(q=O[s])==null?void 0:q.call(O,n)},x=e.ref(t.expandedKeys??[]),{flattenData:G,visibleFlattenData:v,getNodeByValue:r,getChildrenOrRootNodes:i,getNodeIndexInScope:u,isSelected:m,getNodeChildren:h,selectValue:V,getRootNodes:y}=je({isFlatten:t.flattenData,getData:()=>t.data,getExpandedKeys:()=>x,getValue:n=>I(n,"key"),getDisabled:n=>I(n,"disabled"),getChildren:n=>I(n,"children"),getExtra:n=>({_switcherIcon:I(n,"switcherIcon"),_title:I(n,"title"),_draggable:I(n,"draggable"),_leaf:I(n,"leaf"),_loading:I(n,"loading"),_noRotateSwitcherIcon:I(n,"noRotateSwitcherIcon")})}),M=()=>G.value.filter(n=>n==null?void 0:n._hasChildren).map(n=>n._key);let $=!1;e.watch(()=>[t.defaultExpandAll,t.expandedKeys],([n,o],s)=>{$||($=!0,o!==(s==null?void 0:s[1])?x.value=t.expandedKeys??[]:n&&!(s!=null&&s[0])&&(x.value=M()),e.nextTick(()=>$=!1))},{deep:!0,immediate:!0}),e.watch(x,n=>{!$&&n!==t.expandedKeys&&f("update:expandedKeys",n)},{deep:!0});const J=e.ref(t.modelValue??[]);e.watch(()=>t.modelValue,()=>{J.value=t.modelValue??[],t.syncCheckboxAndSelect&&(K.value=t.modelValue??[])},{deep:!0});const E=e.computed({get(){return J.value},set(n){n&&(t.modelValue||(J.value=n),f("update:modelValue",n))}}),Z=e.ref(t.checkedKeys??[]);e.watch(()=>t.checkedKeys,()=>{Z.value=t.checkedKeys??[],t.syncCheckboxAndSelect&&(E.value=t.checkedKeys??[])},{deep:!0});const K=e.computed({get(){return Z.value},set(n){t.checkedKeys||(Z.value=n),f("update:checkedKeys",n)}}),{getDisabled:D,getSize:p}=$e.useFormInput(),re=n=>!!m(n,E,!0),Ke=n=>m(n,K,t.checkStrictly),he=(n,o)=>{if(t.selectable&&!D.value){const s=V(n,o,E,!!(t.syncCheckboxAndSelect?t.checkStrictly:t.checkStrictly!==!1),t.multiple,t.selectionBehavior);w.isEqual(s,E.value)||(E.value=s,f("select",n,o,s),f("change",{modelValue:E.value,checkedKeys:K.value}),t.syncCheckboxAndSelect&&(K.value=s,f("check",n,o,s)))}},ye=(n,o)=>{if(t.checkable&&!D.value){const s=V(n,o,K,!!t.checkStrictly,!0);w.isEqual(s,K.value)||(K.value=s,f("check",n,o,K.value),f("change",{modelValue:E.value,checkedKeys:K.value}),t.syncCheckboxAndSelect&&(E.value=s,f("select",n,o,s)))}},ae=n=>{let o=!0,s=w.cloneDeep(x.value);s.includes(n._key)?(s=s.filter(q=>q!==n._key),o=!1):(s=w.uniq([...s,n._key]),o=!0),x.value=s,f("expand",n,o)},ce=e.computed(()=>{if(t.gap){if(typeof t.gap=="number")return`${t.gap}px`;if(!Object.keys(me).includes(t.gap))return t.gap}}),le=e.ref(!1),{getDir:Te}=Fe.useConfig(),ue=Te(),ve=e.computed(()=>{switch(p.value){case"sm":return"2xsm";case"lg":return"sm";default:return"xsm"}}),Ne=e.computed(()=>p.value==="sm"?"2xsm":"xsm"),_e=n=>{var o;return(((o=n==null?void 0:n._parentKeys)==null?void 0:o.length)??0)+1};we({iconSize:Ne,disabled:D,props:t,expandedKeys:x,model:E,dir:ue,checked:K,onExpandKey:ae,onSelect:he,onCheck:ye,getNodeChildren:h,getNodeField:I,getIsSelected:re,getIsChecked:Ke,getLevel:_e,dragging:le,indentSize:ve,prefixes:B});const de=e.ref();if(t.draggable){let n,o;const s=L=>{const g=L.getAttribute("data-key");if(g)return r(g)},q=c.getBemModifier(c.getBemElement(_,"dragging_item"),p.value),ee=()=>{var L;(L=n==null?void 0:n.destroy)==null||L.call(n),n=void 0},oe=async()=>{let L,g,U,te,F;const fe=a=>({...a,node:g,oldParents:U,newParents:te,oldIndex:L,oldDraggableIndex:L,newIndex:F,newDraggableIndex:F}),be=(a,W)=>{if(a){const N=()=>{const se=_e(g),S=!!(g!=null&&g._hasChildren);return{size:p.value,level:se,children:S,indentSize:ve.value,branchIcon:(g?g._switcherIcon??(t==null?void 0:t.switcherIcon):t==null?void 0:t.switcherIcon)??"tabler:chevron-left"}},A=document.createElement("div"),H=a.getBoundingClientRect();A.style.width=H.width?`${H.width}px`:"100%",A.style.height=H.height?`${H.height}px`:"100%",A.classList.add(c.getBemElement(_,X.sortPlaceholderCls));const ne=N();return W&&(ne.level=W),e.render(e.h(Ue,ne),A),A}};n?ee():de.value&&(n=new Re(de.value,{...w.omit(t.sortableProps||{},["onMove"]),group:w.isFunction(t.groupName)?t.groupName():t.groupName??c.usePCId(_),filter:"[data-draggable=false]",tree:!0,draggable:`.${B.node}`,handle:`.${B.node} .${B.draggable} .${B.draggableIcon}`,dataIdAttr:"data-key",dragClass:q,onChoose(a){var W;if(g=s(a==null?void 0:a.item),U=(W=g==null?void 0:g._parentKeys)==null?void 0:W.map(r).filter(Boolean),g){if(U!=null&&U.length){const N=w.last(U);N&&(L=h(N,!0,!1).findIndex(A=>A._key===g._key))}else L=y().findIndex(N=>N._key===g._key);g._dragging=!0}f("choose",a)},onUnchoose(a){g&&(g._dragging=!1),f("unchoose",a)},onStart(a){g!=null&&g._key&&x.value.includes(g._key)&&(o=g,ae(o)),le.value=!0,f("dragStart",fe(a))},onEnd(a){le.value=!1,o&&(ae(o),o=void 0),f("dragEnd",fe(a)),L=U=F=te=g=void 0},onMove(a,W){var H,ne,se;if(F=te=void 0,a.draggedTreeItemParent){const S=s(a==null?void 0:a.draggedTreeItemParent);S&&(te=[...((H=S==null?void 0:S._parentKeys)==null?void 0:H.map(r).filter(Boolean))??[],S],(ne=h(S,!0,!1))!=null&&ne.length&&!x.value.includes(S._key)&&ae(S))}const N=a.draggedTreeItemLevel??1;if(!a.draggedTreeItemBefore)F=0;else if(a.draggedTreeItemBefore){if(a.draggedTreeItemBefore.level===N){const S=s(a.draggedTreeItemBefore);S&&(F=u(S)+1)}else if(a.draggedTreeItemBefore.level<N)F=0;else if(a.draggedTreeItemBefore.level>N){if(!a.draggedTreeItemAfter||a.draggedTreeItemAfter.level<N){const S=w.last(te??[]);F=i(S).length}else if(a.draggedTreeItemAfter.level===N){const S=s(a.draggedTreeItemAfter);S&&(F=u(S))}}}const A=fe(a);w.isFunction((se=t.sortableProps)==null?void 0:se.onMove)&&t.sortableProps.onMove(A,W)},getPlaceholder(a){return be(a==null?void 0:a.item)},getPlaceholderOnMove(a){return be(a==null?void 0:a.dragged,a.draggedTreeItemLevel||1)}}))};e.onMounted(oe),e.onBeforeUnmount(ee)}const ge=e.ref(),Pe={none:0,sm:4,md:6,lg:8},Ee=e.computed(()=>({get count(){return v.value.length??0},getScrollElement:()=>{var n;return(n=ge.value)==null?void 0:n.container.viewportElement},estimateSize:()=>ie[t.size]??ie.md,overscan:5,get gap(){return Pe[ce.value??p.value]??ce.value??p.value??0}}));let pe,j;if(t.virtual)if(typeof t.virtual=="object")pe=t.virtual;else{const{virtualizer:n,...o}=De.useVirtualScroll(Ee);pe=n,j=o}const ke=e.computed(()=>{var n;return t.virtual?(((n=e.unref(pe))==null?void 0:n.getVirtualItems())??[]).map(o=>v.value[o.index]):v.value}),Le=()=>{var o;const n=()=>{const s=()=>{var ee;const q=(ee=T.default)==null?void 0:ee.call(T,{items:ke.value});return X.isEmptyElement(q)?ke.value.map(oe=>e.h(ze,{key:oe._key,node:oe},{default:T.node,switcherIcon:T.switcherIcon})):q};return e.h("div",{dir:ue.value,role:"tree",class:c.normCls(Y({size:p.value,gap:t.gap??p.value,selectable:t.selectable,disabled:D.value,inlineNode:t.inlineNode,dragging:le.value}),t.class),style:{"--ptc-tree-gap":ce.value,...t.virtual?(j==null?void 0:j.containerStyles.value)??{}:{}},ref:de},s())};return t.virtual&&!t.outerVirtualScroll?e.h(Ae._sfc_main,{...t.scrollContainerProps,ref:ge,dir:ue.value,wrapProps:{...((o=t.scrollContainerProps)==null?void 0:o.wrapProps)??{},style:(j==null?void 0:j.scrollWrapperStyles.value)??{}}},n):n()};return d({scrollContainerRef:ge,onSelect:he,onCheck:ye}),(n,o)=>(e.openBlock(),e.createBlock(Le))}});exports.TreeGaps=me;exports.TreeSizes=Ie;exports._sfc_main=He;exports._sfc_main$1=ze;exports.flattenBy_parentKeys=Ve;exports.injectTreeContext=xe;exports.provideTreeContext=we;exports.systemSizes=We;exports.systemSizesMap=ie;