UNPKG

@column-resizer/core

Version:

[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/Runjuu/column-resizer/blob/main/LICENSE) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](#contributing) [![code style: prettier](https://i

2 lines 11 kB
var $=Object.defineProperty,j=Object.defineProperties;var J=Object.getOwnPropertyDescriptors;var k=Object.getOwnPropertySymbols;var W=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable;var O=(n,t,e)=>t in n?$(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e,l=(n,t)=>{for(var e in t||(t={}))W.call(t,e)&&O(n,e,t[e]);if(k)for(var e of k(t))X.call(t,e)&&O(n,e,t[e]);return n},d=(n,t)=>j(n,J(t));var o=(n,t,e)=>O(n,typeof t!="symbol"?t+"":t,e);var M=(e=>(e.BAR="BAR",e.SECTION="SECTION",e))(M||{}),Y=(i=>(i.ACTIVATE="activate",i.MOVE="move",i.DEACTIVATE="deactivate",i))(Y||{});var L={x:0,y:0};function H(n,t){return t?{x:n.x-t.x,y:n.y-t.y}:L}function b(){let n=[],t=0,e=0;return{collect(i){n.push(i),i.disableResponsive||(t+=1,e+=i.currentSize)},getResult(){return{sizeInfoArray:n,flexGrowRatio:t/e}}}}function u(n){return Number.isFinite(n)&&n>0}function v(n,t,e,i){let{collect:r,getResult:s}=b(),c=i?1:-1,f=R(n,t,c,e),a=R(n,-t,-c,e),h=t-f.remainingOffset,I=-t-a.remainingOffset;function B(g,U){g.forEach(r),r(e[n]),U.forEach(r)}if(h===-I)B(f.sizeInfoArray,a.sizeInfoArray);else if(Math.abs(h)<Math.abs(I)){let g=R(n,-h,-c,e);B(f.sizeInfoArray,g.sizeInfoArray)}else{let g=R(n,-I,c,e);B(g.sizeInfoArray,a.sizeInfoArray)}return s()}function R(n,t,e,i){let r=[],s=t;for(let a=n+e;f(a);a+=e)if(s){let{sizeInfo:h,remainingOffset:I}=q(s,i[a]);s=I,c(h)}else c(i[a]);function c(a){e===-1?r.unshift(a):r.push(a)}function f(a){return e===-1?a>=0:a<=i.length-1}return{sizeInfoArray:r,remainingOffset:s}}function q(n,t){if(t.isSolid)return{remainingOffset:n,sizeInfo:t};let{nextSize:e,remainingOffset:i}=Q(t.currentSize+n,t);return{sizeInfo:d(l({},t),{currentSize:e}),remainingOffset:i}}function Q(n,{maxSize:t,minSize:e=0}){return n<e?{nextSize:e,remainingOffset:n-e}:u(t)&&n>t?{nextSize:t,remainingOffset:n-t}:{nextSize:n,remainingOffset:0}}var w={barIndex:-1,offset:0,type:"deactivate",originalCoordinate:L,defaultSizeInfoArray:[],sizeInfoArray:[],discard:!0,flexGrowRatio:0};function N(n){let t=w,e=new Set;return{dispatch(i){t=(()=>{let r={barIndex:i.barIndex,type:i.type};switch(i.type){case"activate":let{sizeInfoArray:s,flexGrowRatio:c}=n.getSizeRelatedInfo();return d(l(l({},w),r),{originalCoordinate:i.coordinate,defaultSizeInfoArray:s,sizeInfoArray:s,flexGrowRatio:c});case"move":let f=n.calculateOffset(i.coordinate,t.originalCoordinate);return d(l(l({},r),v(i.barIndex,f,t.defaultSizeInfoArray,n.flipResizeMoveDirection)),{offset:f,originalCoordinate:t.originalCoordinate,defaultSizeInfoArray:t.defaultSizeInfoArray,discard:!1});case"deactivate":return w}})(),e.forEach(r=>r(t))},subscribe(i){return e.add(i),()=>e.delete(i)},unsubscribeAll(){e.clear()}}}function m(n,t,e){n==null||n.dispatchEvent(new CustomEvent(t,{detail:e}))}var E=class{constructor(){o(this,"disposeFnSet",new Set);o(this,"watchResizerEvent",(t,e,i)=>{t==null||t.addEventListener(e,i);let r=()=>t==null?void 0:t.removeEventListener(e,i);return this.disposeFnSet.add(r),r});o(this,"reset",()=>{this.disposeFnSet.forEach(t=>t()),this.disposeFnSet.clear()})}};var A=class{constructor(){o(this,"infoMap",new Map);o(this,"items",[])}update(t){this.infoMap.clear(),this.items.forEach(e=>e.destroy()),this.items=t,t.forEach((e,i)=>{this.infoMap.set(e.elm,{item:e,index:i})})}reset(){this.update([])}getItems(){return this.items}getItem(t){var e,i;return(i=(e=this.infoMap.get(t))==null?void 0:e.item)!=null?i:null}getItemIndex(t){var e,i;return(i=(e=this.infoMap.get(t))==null?void 0:e.index)!=null?i:null}};var y=!0;try{window.addEventListener("test",null,{get passive(){return y={passive:!1},!0}})}catch(n){}function x({size:n}){return u(n)}function K(n){let{disableResponsive:t}=n;return x(n)&&t===void 0?!0:!!t}function _(n){return!!n&&n in M}function V(n){return t=>({"data-item-type":n,"data-item-config":JSON.stringify(t)})}function F(n){return Array.from(n.childNodes).map(t=>{if(!(t instanceof HTMLElement))return null;let e=t.getAttribute("data-item-type");return _(e)?{type:e,elm:t}:null}).filter(t=>!!t)}function T({elm:n}){var t;try{let e=JSON.parse((t=n.getAttribute("data-item-config"))!=null?t:"");return e&&typeof e=="object"?e:{}}catch(e){return{}}}function G(n){return n*2+1}function D(n){return n*2}var C=class{constructor(t){this.resizeResult=t;o(this,"isDiscarded",!1)}resizeSection(t,e){if(this.isDiscarded)return;let i=D(t),r=this.getSize(i);if(r>=0&&e.toSize>=0){let s=e.toSize-r;i===this.resizeResult.sizeInfoArray.length-1||e.preferMoveLeftBar?this.moveBar(t-1,{withOffset:-s}):this.moveBar(t,{withOffset:s})}}moveBar(t,e){this.isDiscarded||(this.resizeResult=v(G(t),e.withOffset,this.resizeResult.sizeInfoArray,void 0))}discard(){this.isDiscarded=!0}isSectionResized(t){let e=D(t);return"defaultSizeInfoArray"in this.resizeResult?this.getSize(e)!==this.resizeResult.defaultSizeInfoArray[e].currentSize:!1}isBarActivated(t){return"barIndex"in this.resizeResult?this.resizeResult.barIndex===G(t):!1}getSectionSize(t){return this.getSize(D(t))}getResult(){return d(l({},this.resizeResult),{discard:this.isDiscarded})}getTotalSize(){return this.resizeResult.sizeInfoArray.filter((t,e)=>t&&e%2===0).reduce((t,{currentSize:e})=>t+e,0)}getSize(t){let e=this.resizeResult.sizeInfoArray[t];return e?e.currentSize:-1}};var S=class{constructor(t,e,i){this.type=t;this.elm=e;this.getConfig=i;o(this,"_config");o(this,"_observer");this._config=this.getConfig(),this._observer=new MutationObserver(()=>this._config=this.getConfig()),this._observer.observe(e,{attributes:!0,attributeFilter:["data-item-config"]})}get config(){return this._config}destroy(){this._observer.disconnect()}};var z=class extends S{constructor(e,i){super("BAR",e.elm,()=>Z(e));this.dispatchBarAction=i;o(this,"isActive",!1);o(this,"isValidClick",!0);let r=[this.attachListener(this.elm,"mousedown","activate"),this.attachListener(document,"mousemove","move"),this.attachListener(document,"mouseup","deactivate"),this.attachListener(this.elm,"touchstart","activate",y),this.attachListener(document,"touchmove","move",y),this.attachListener(document,"touchend","deactivate"),this.attachListener(document,"touchcancel","deactivate")];this.destroy=()=>{super.destroy(),r.forEach(s=>s())}}static getStyle({size:e}){return{flex:`0 0 ${e}px`}}attachListener(e,i,r,s){let c=f=>{this.disableUserSelectIfResizing(f,r);let{clientX:a,clientY:h}=("touches"in f?f.touches[0]:f)||{clientX:0,clientY:0};this.triggerAction(this.elm,r,{x:a,y:h})};return e.addEventListener(i,c,s),()=>e.removeEventListener(i,c,s)}disableUserSelectIfResizing(e,i){(this.isActive||i==="activate")&&e.preventDefault()}triggerAction(e,i,r){(this.isActive||i==="activate")&&this.dispatchBarAction(e,{type:i,coordinate:r}),this.isActive&&this.isValidClick&&i==="deactivate"&&(this.isValidClick=!1,m(e,"bar:click",null)),this.updateStatusIfNeed(e,i),this.updateClickStatus(i)}updateStatusIfNeed(e,i){let r=s=>{this.isActive!==s&&(this.isActive=s,m(e,"bar:status-change",{isActive:s}))};i==="activate"?r(!0):i==="deactivate"&&r(!1)}updateClickStatus(e){this.isActive&&(e==="activate"?this.isValidClick=!0:e==="move"&&(this.isValidClick=!1))}};function Z(n){let{size:t}=T(n);return{size:u(t)?t:10}}var p=class extends S{constructor(e){super("SECTION",e.elm,()=>ee(e));o(this,"sizeInfo",null);o(this,"flexGrowRatio",0);this.updateStyle()}static getStyle({maxSize:e,minSize:i},r){let s=c=>u(c)?`${c}px`:void 0;return{overflow:"hidden",[r?"maxHeight":"maxWidth"]:s(e),[r?"minHeight":"minWidth"]:s(i)}}update({sizeInfo:e,flexGrowRatio:i}){this.sizeInfo=e,this.flexGrowRatio=i,this.updateStyle(),m(this.elm,"section:size-change",{size:e.currentSize})}updateStyle(){let{flexGrow:e,flexShrink:i,flexBasis:r}=this.getStyle();this.elm.style.flexGrow=`${e}`,this.elm.style.flexShrink=`${i}`,this.elm.style.flexBasis=`${r}px`}getStyle(){let e=u(this.config.size)?0:this.config.disableResponsive?1:0;if(this.sizeInfo){let{disableResponsive:i,currentSize:r}=this.sizeInfo;return{flexShrink:e,flexGrow:i?0:this.flexGrowRatio*r,flexBasis:i?r:0}}else{let i=this.config.size||this.config.defaultSize;return u(i)?{flexShrink:e,flexGrow:0,flexBasis:i}:{flexShrink:e,flexGrow:1,flexBasis:0}}}};function ee(n){let{size:t,defaultSize:e,maxSize:i,minSize:r,disableResponsive:s}=T(n);return{size:u(t)?t:void 0,defaultSize:u(e)?e:void 0,maxSize:u(i)?i:void 0,minSize:u(r)?r:void 0,disableResponsive:!!s}}var P=class{constructor(t){this.config=t;o(this,"styles",{container:t=>d(l({},t),{display:"flex",flexDirection:this.direction}),section:(t,e)=>l(l({},e),p.getStyle(t,this.config.vertical)),bar:(t,e)=>l(l({},e),z.getStyle(t))});o(this,"attributes",{bar:V("BAR"),section:V("SECTION")});o(this,"itemsCache",new A);o(this,"eventHub",new E);o(this,"container",null);o(this,"barStore");o(this,"dispatchBarAction",(t,e)=>{let i=this.itemsCache.getItemIndex(t);i&&this.barStore.dispatch(d(l({},e),{barIndex:i}))});this.barStore=N({calculateOffset:(e,i)=>H(e,i)[this.axis],getSizeRelatedInfo:()=>this.makeSizeInfos(),flipResizeMoveDirection:t.rtl&&!t.vertical})}get axis(){return this.config.vertical?"y":"x"}get dimension(){return this.config.vertical?"height":"width"}get direction(){return this.config.vertical?"column":"row"}get on(){return this.eventHub.watchResizerEvent}init(t){this.dispose(),this.container=t,t&&(this.itemsCache.update(F(t).map(e=>{switch(e.type){case"BAR":return new z(e,this.dispatchBarAction);case"SECTION":return new p(e)}})),this.initStyles(t,this.itemsCache.getItems()),this.sizeRelatedInfoChange(this.makeSizeInfos()),this.barStore.subscribe(e=>{this.monitorBarStatusChanges(e),this.sizeRelatedInfoChange(e)}))}dispose(){this.container=null,this.itemsCache.reset(),this.barStore.unsubscribeAll(),this.eventHub.reset()}getResizer(){return new C(this.makeSizeInfos())}applyResizer(t){this.sizeRelatedInfoChange(t.getResult())}sizeRelatedInfoChange(t){t.discard||(t=(()=>{if(typeof this.config.beforeApplyResizer=="function"){let e=new C(t);return this.config.beforeApplyResizer(e),e.getResult()}else return t})(),!t.discard&&t.sizeInfoArray.forEach(e=>{let i=this.itemsCache.getItem(e.elm);i instanceof p&&i.update({sizeInfo:e,flexGrowRatio:t.flexGrowRatio})}))}monitorBarStatusChanges({type:t}){switch(t){case"activate":return m(this.container,"column:activate",null);case"deactivate":return m(this.container,"column:after-resizing",null);default:return}}makeSizeInfos(){let{collect:t,getResult:e}=b();return this.itemsCache.getItems().forEach(i=>{i instanceof z&&t({elm:i.elm,disableResponsive:!0,isSolid:!0,currentSize:i.elm.getBoundingClientRect()[this.dimension]}),i instanceof p&&t({elm:i.elm,maxSize:i.config.maxSize,minSize:i.config.minSize,disableResponsive:K(i.config),isSolid:x(i.config),currentSize:i.elm.getBoundingClientRect()[this.dimension]})}),e()}initStyles(t,e){Object.assign(t.style,this.styles.container()),e.forEach(i=>{i instanceof z&&Object.assign(i.elm.style,this.styles.bar(i.config)),i instanceof p&&Object.assign(i.elm.style,this.styles.section(i.config))})}};export{Y as BarActionType,P as ColumnResizer,M as ItemType,C as Resizer}; //# sourceMappingURL=index.js.map