| 1 |
- "use strict";var y=Object.defineProperty,E=Object.defineProperties;var b=Object.getOwnPropertyDescriptors;var c=Object.getOwnPropertySymbols;var z=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var f=(e,t,i)=>t in e?y(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i,S=(e,t)=>{for(var i in t||(t={}))z.call(t,i)&&f(e,i,t[i]);if(c)for(var i of c(t))v.call(t,i)&&f(e,i,t[i]);return e},P=(e,t)=>E(e,b(t));var x=(e,t)=>{var i={};for(var s in e)z.call(e,s)&&t.indexOf(s)<0&&(i[s]=e[s]);if(e!=null&&c)for(var s of c(e))t.indexOf(s)<0&&v.call(e,s)&&(i[s]=e[s]);return i};Object.defineProperty(exports,"__esModule",{value:!0});exports[Symbol.toStringTag]="Module";function g(e,t,i,s,n,a,r,h){var o=typeof e=="function"?e.options:e;t&&(o.render=t,o.staticRenderFns=i,o._compiled=!0),s&&(o.functional=!0),a&&(o._scopeId="data-v-"+a);var l;if(r?(l=function(u){u=u||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,!u&&typeof __VUE_SSR_CONTEXT__!="undefined"&&(u=__VUE_SSR_CONTEXT__),n&&n.call(this,u),u&&u._registeredComponents&&u._registeredComponents.add(r)},o._ssrRegister=l):n&&(l=h?function(){n.call(this,(o.functional?this.parent:this).$root.$options.shadowRoot)}:n),l)if(o.functional){o._injectStyles=l;var p=o.render;o.render=function(C,m){return l.call(m),p(C,m)}}else{var d=o.beforeCreate;o.beforeCreate=d?[].concat(d,l):[l]}return{exports:e,options:o}}const w={name:"splitpanes",props:{horizontal:{type:Boolean},pushOtherPanes:{type:Boolean,default:!0},dblClickSplitter:{type:Boolean,default:!0},rtl:{type:Boolean,default:!1},firstSplitter:{type:Boolean}},provide(){return{requestUpdate:this.requestUpdate,onPaneAdd:this.onPaneAdd,onPaneRemove:this.onPaneRemove,onPaneClick:this.onPaneClick}},data:()=>({container:null,ready:!1,panes:[],touch:{mouseDown:!1,dragging:!1,activeSplitter:null},splitterTaps:{splitter:null,timeoutId:null}}),computed:{panesCount(){return this.panes.length},indexedPanes(){return this.panes.reduce((e,t)=>(e[t.id]=t)&&e,{})}},methods:{updatePaneComponents(){this.panes.forEach(e=>{e.update&&e.update({[this.horizontal?"height":"width"]:`${this.indexedPanes[e.id].size}%`})})},bindEvents(){document.addEventListener("mousemove",this.onMouseMove,{passive:!1}),document.addEventListener("mouseup",this.onMouseUp),"ontouchstart"in window&&(document.addEventListener("touchmove",this.onMouseMove,{passive:!1}),document.addEventListener("touchend",this.onMouseUp))},unbindEvents(){document.removeEventListener("mousemove",this.onMouseMove,{passive:!1}),document.removeEventListener("mouseup",this.onMouseUp),"ontouchstart"in window&&(document.removeEventListener("touchmove",this.onMouseMove,{passive:!1}),document.removeEventListener("touchend",this.onMouseUp))},onMouseDown(e,t){this.bindEvents(),this.touch.mouseDown=!0,this.touch.activeSplitter=t},onMouseMove(e){this.touch.mouseDown&&(e.preventDefault(),this.touch.dragging=!0,this.calculatePanesSize(this.getCurrentMouseDrag(e)),this.$emit("resize",this.panes.map(t=>({min:t.min,max:t.max,size:t.size}))))},onMouseUp(){this.touch.dragging&&this.$emit("resized",this.panes.map(e=>({min:e.min,max:e.max,size:e.size}))),this.touch.mouseDown=!1,setTimeout(()=>{this.touch.dragging=!1,this.unbindEvents()},100)},onSplitterClick(e,t){"ontouchstart"in window&&(e.preventDefault(),this.dblClickSplitter&&(this.splitterTaps.splitter===t?(clearTimeout(this.splitterTaps.timeoutId),this.splitterTaps.timeoutId=null,this.onSplitterDblClick(e,t),this.splitterTaps.splitter=null):(this.splitterTaps.splitter=t,this.splitterTaps.timeoutId=setTimeout(()=>{this.splitterTaps.splitter=null},500)))),this.touch.dragging||this.$emit("splitter-click",this.panes[t])},onSplitterDblClick(e,t){let i=0;this.panes=this.panes.map((s,n)=>(s.size=n===t?s.max:s.min,n!==t&&(i+=s.min),s)),this.panes[t].size-=i,this.$emit("pane-maximize",this.panes[t])},onPaneClick(e,t){this.$emit("pane-click",this.indexedPanes[t])},getCurrentMouseDrag(e){const t=this.container.getBoundingClientRect(),{clientX:i,clientY:s}="ontouchstart"in window&&e.touches?e.touches[0]:e;return{x:i-t.left,y:s-t.top}},getCurrentDragPercentage(e){e=e[this.horizontal?"y":"x"];const t=this.container[this.horizontal?"clientHeight":"clientWidth"];return this.rtl&&!this.horizontal&&(e=t-e),e*100/t},calculatePanesSize(e){const t=this.touch.activeSplitter;let i={prevPanesSize:this.sumPrevPanesSize(t),nextPanesSize:this.sumNextPanesSize(t),prevReachedMinPanes:0,nextReachedMinPanes:0};const s=0+(this.pushOtherPanes?0:i.prevPanesSize),n=100-(this.pushOtherPanes?0:i.nextPanesSize),a=Math.max(Math.min(this.getCurrentDragPercentage(e),n),s);let r=[t,t+1],h=this.panes[r[0]]||null,o=this.panes[r[1]]||null;const l=h.max<100&&a>=h.max+i.prevPanesSize,p=o.max<100&&a<=100-(o.max+this.sumNextPanesSize(t+1));if(l||p){l?(h.size=h.max,o.size=Math.max(100-h.max-i.prevPanesSize-i.nextPanesSize,0)):(h.size=Math.max(100-o.max-i.prevPanesSize-this.sumNextPanesSize(t+1),0),o.size=o.max);return}if(this.pushOtherPanes){const d=this.doPushOtherPanes(i,a);if(!d)return;({sums:i,panesToResize:r}=d),h=this.panes[r[0]]||null,o=this.panes[r[1]]||null}h!==null&&(h.size=Math.min(Math.max(a-i.prevPanesSize-i.prevReachedMinPanes,h.min),h.max)),o!==null&&(o.size=Math.min(Math.max(100-a-i.nextPanesSize-i.nextReachedMinPanes,o.min),o.max))},doPushOtherPanes(e,t){const i=this.touch.activeSplitter,s=[i,i+1];return t<e.prevPanesSize+this.panes[s[0]].min&&(s[0]=this.findPrevExpandedPane(i).index,e.prevReachedMinPanes=0,s[0]<i&&this.panes.forEach((n,a)=>{a>s[0]&&a<=i&&(n.size=n.min,e.prevReachedMinPanes+=n.min)}),e.prevPanesSize=this.sumPrevPanesSize(s[0]),s[0]===void 0)?(e.prevReachedMinPanes=0,this.panes[0].size=this.panes[0].min,this.panes.forEach((n,a)=>{a>0&&a<=i&&(n.size=n.min,e.prevReachedMinPanes+=n.min)}),this.panes[s[1]].size=100-e.prevReachedMinPanes-this.panes[0].min-e.prevPanesSize-e.nextPanesSize,null):t>100-e.nextPanesSize-this.panes[s[1]].min&&(s[1]=this.findNextExpandedPane(i).index,e.nextReachedMinPanes=0,s[1]>i+1&&this.panes.forEach((n,a)=>{a>i&&a<s[1]&&(n.size=n.min,e.nextReachedMinPanes+=n.min)}),e.nextPanesSize=this.sumNextPanesSize(s[1]-1),s[1]===void 0)?(e.nextReachedMinPanes=0,this.panes[this.panesCount-1].size=this.panes[this.panesCount-1].min,this.panes.forEach((n,a)=>{a<this.panesCount-1&&a>=i+1&&(n.size=n.min,e.nextReachedMinPanes+=n.min)}),this.panes[s[0]].size=100-e.prevPanesSize-e.nextReachedMinPanes-this.panes[this.panesCount-1].min-e.nextPanesSize,null):{sums:e,panesToResize:s}},sumPrevPanesSize(e){return this.panes.reduce((t,i,s)=>t+(s<e?i.size:0),0)},sumNextPanesSize(e){return this.panes.reduce((t,i,s)=>t+(s>e+1?i.size:0),0)},findPrevExpandedPane(e){return[...this.panes].reverse().find(i=>i.index<e&&i.size>i.min)||{}},findNextExpandedPane(e){return this.panes.find(i=>i.index>e+1&&i.size>i.min)||{}},checkSplitpanesNodes(){Array.from(this.container.children).forEach(t=>{const i=t.classList.contains("splitpanes__pane"),s=t.classList.contains("splitpanes__splitter");if(!i&&!s){t.parentNode.removeChild(t),console.warn("Splitpanes: Only <pane> elements are allowed at the root of <splitpanes>. One of your DOM nodes was removed.");return}})},addSplitter(e,t,i=!1){const s=e-1,n=document.createElement("div");n.classList.add("splitpanes__splitter"),i||(n.onmousedown=a=>this.onMouseDown(a,s),typeof window!="undefined"&&"ontouchstart"in window&&(n.ontouchstart=a=>this.onMouseDown(a,s)),n.onclick=a=>this.onSplitterClick(a,s+1)),this.dblClickSplitter&&(n.ondblclick=a=>this.onSplitterDblClick(a,s+1)),t.parentNode.insertBefore(n,t)},removeSplitter(e){e.onmousedown=void 0,e.onclick=void 0,e.ondblclick=void 0,e.parentNode.removeChild(e)},redoSplitters(){const e=Array.from(this.container.children);e.forEach(i=>{i.className.includes("splitpanes__splitter")&&this.removeSplitter(i)});let t=0;e.forEach(i=>{i.className.includes("splitpanes__pane")&&(!t&&this.firstSplitter?this.addSplitter(t,i,!0):t&&this.addSplitter(t,i),t++)})},requestUpdate(i){var s=i,{target:e}=s,t=x(s,["target"]);const n=this.indexedPanes[e._uid];Object.entries(t).forEach(([a,r])=>n[a]=r)},onPaneAdd(e){let t=-1;Array.from(e.$el.parentNode.children).some(n=>(n.className.includes("splitpanes__pane")&&t++,n===e.$el));const i=parseFloat(e.minSize),s=parseFloat(e.maxSize);this.panes.splice(t,0,{id:e._uid,index:t,min:isNaN(i)?0:i,max:isNaN(s)?100:s,size:e.size===null?null:parseFloat(e.size),givenSize:e.size,update:e.update}),this.panes.forEach((n,a)=>n.index=a),this.ready&&this.$nextTick(()=>{this.redoSplitters(),this.resetPaneSizes({addedPane:this.panes[t]}),this.$emit("pane-add",{index:t,panes:this.panes.map(n=>({min:n.min,max:n.max,size:n.size}))})})},onPaneRemove(e){const t=this.panes.findIndex(s=>s.id===e._uid),i=this.panes.splice(t,1)[0];this.panes.forEach((s,n)=>s.index=n),this.$nextTick(()=>{this.redoSplitters(),this.resetPaneSizes({removedPane:P(S({},i),{index:t})}),this.$emit("pane-remove",{removed:i,panes:this.panes.map(s=>({min:s.min,max:s.max,size:s.size}))})})},resetPaneSizes(e={}){!e.addedPane&&!e.removedPane?this.initialPanesSizing():this.panes.some(t=>t.givenSize!==null||t.min||t.max<100)?this.equalizeAfterAddOrRemove(e):this.equalize(),this.ready&&this.$emit("resized",this.panes.map(t=>({min:t.min,max:t.max,size:t.size})))},equalize(){const e=100/this.panesCount;let t=0,i=[],s=[];this.panes.forEach(n=>{n.size=Math.max(Math.min(e,n.max),n.min),t-=n.size,n.size>=n.max&&i.push(n.id),n.size<=n.min&&s.push(n.id)}),t>.1&&this.readjustSizes(t,i,s)},initialPanesSizing(){100/this.panesCount;let e=100,t=[],i=[],s=0;this.panes.forEach(a=>{e-=a.size,a.size!==null&&s++,a.size>=a.max&&t.push(a.id),a.size<=a.min&&i.push(a.id)});let n=100;e>.1&&(this.panes.forEach(a=>{a.size===null&&(a.size=Math.max(Math.min(e/(this.panesCount-s),a.max),a.min)),n-=a.size}),n>.1&&this.readjustSizes(e,t,i))},equalizeAfterAddOrRemove({addedPane:e,removedPane:t}={}){let i=100/this.panesCount,s=0,n=[],a=[];e&&e.givenSize!==null&&(i=(100-e.givenSize)/(this.panesCount-1)),this.panes.forEach(r=>{s-=r.size,r.size>=r.max&&n.push(r.id),r.size<=r.min&&a.push(r.id)}),!(Math.abs(s)<.1)&&(this.panes.forEach(r=>{e&&e.givenSize!==null&&e.id===r.id||(r.size=Math.max(Math.min(i,r.max),r.min)),s-=r.size,r.size>=r.max&&n.push(r.id),r.size<=r.min&&a.push(r.id)}),s>.1&&this.readjustSizes(s,n,a))},readjustSizes(e,t,i){let s;e>0?s=e/(this.panesCount-t.length):s=e/(this.panesCount-i.length),this.panes.forEach((n,a)=>{if(e>0&&!t.includes(n.id)){const r=Math.max(Math.min(n.size+s,n.max),n.min);e-=r-n.size,n.size=r}else if(!i.includes(n.id)){const r=Math.max(Math.min(n.size+s,n.max),n.min);e-=r-n.size,n.size=r}n.update({[this.horizontal?"height":"width"]:`${this.indexedPanes[n.id].size}%`})}),Math.abs(e)>.1&&this.$nextTick(()=>{this.ready&&console.warn("Splitpanes: Could not resize panes correctly due to their constraints.")})}},watch:{panes:{deep:!0,immediate:!1,handler(){this.updatePaneComponents()}},horizontal(){this.updatePaneComponents()},firstSplitter(){this.redoSplitters()},dblClickSplitter(e){[...this.container.querySelectorAll(".splitpanes__splitter")].forEach((i,s)=>{i.ondblclick=e?n=>this.onSplitterDblClick(n,s):void 0})}},beforeDestroy(){this.ready=!1},mounted(){this.container=this.$refs.container,this.checkSplitpanesNodes(),this.redoSplitters(),this.resetPaneSizes(),this.$emit("ready"),this.ready=!0},render(e){return e("div",{ref:"container",class:["splitpanes",`splitpanes--${this.horizontal?"horizontal":"vertical"}`,{"splitpanes--dragging":this.touch.dragging}]},this.$slots.default)}};let R,k;const _={};var N=g(w,R,k,!1,$,null,null,null);function $(e){for(let t in _)this[t]=_[t]}var D=function(){return N.exports}(),T=function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{staticClass:"splitpanes__pane",style:e.style,on:{click:function(s){return e.onPaneClick(s,e._uid)}}},[e._t("default")],2)},q=[];const O={name:"pane",inject:["requestUpdate","onPaneAdd","onPaneRemove","onPaneClick"],props:{size:{type:[Number,String],default:null},minSize:{type:[Number,String],default:0},maxSize:{type:[Number,String],default:100}},data:()=>({style:{}}),mounted(){this.onPaneAdd(this)},beforeDestroy(){this.onPaneRemove(this)},methods:{update(e){this.style=e}},computed:{sizeNumber(){return this.size||this.size===0?parseFloat(this.size):null},minSizeNumber(){return parseFloat(this.minSize)},maxSizeNumber(){return parseFloat(this.maxSize)}},watch:{sizeNumber(e){this.requestUpdate({target:this,size:e})},minSizeNumber(e){this.requestUpdate({target:this,min:e})},maxSizeNumber(e){this.requestUpdate({target:this,max:e})}}},M={};var A=g(O,T,q,!1,U,null,null,null);function U(e){for(let t in M)this[t]=M[t]}var L=function(){return A.exports}();exports.Pane=L;exports.Splitpanes=D;
|
