flex-splitter-directive/index.js

Dead simple pane-splitter control based on flexbox.

"use strict";(()=>{var p=(t,n)=>{let i=t.previousElementSibling,r=t.nextElementSibling,o=getComputedStyle(t.parentElement);(o.flexDirection.indexOf("reverse")!==-1?-1:1)*(n&&o.direction==="rtl"?-1:1)===-1&&([i,r]=[r,i]);let s=getComputedStyle(i),a=getComputedStyle(r);if(n){let l=i.offsetWidth,e=l+r.offsetWidth,c=Math.max(parseInt(s.minWidth,10)||0,e-(parseInt(a.maxWidth,10)||e)),d=Math.min(parseInt(s.maxWidth,10)||e,e-(parseInt(a.minWidth,10)||0));return h=>{let m=Math.round(Math.min(Math.max(l+h,c),d));i.style.width=m+"px",r.style.width=e-m+"px",i.style.flexShrink=r.style.flexShrink=1}}else{let l=i.offsetHeight,e=l+r.offsetHeight,c=Math.max(parseInt(s.minHeight,10)||0,e-(parseInt(a.maxHeight,10)||e)),d=Math.min(parseInt(s.maxHeight,10)||e,e-(parseInt(a.minHeight,10)||0));return h=>{let m=Math.round(Math.min(Math.max(l+h,c),d));i.style.height=m+"px",r.style.height=e-m+"px",i.style.flexShrink=r.style.flexShrink=1}}};var u=t=>+t.replace(/\s+/g,"").match(/^keyboard-movement:([+-]?\d*(?:\.\d*)?)$/)?.[1]||2;addEventListener("keydown",t=>{let n=t.keyCode,i=t.target,r=i.parentElement;if(!r||t.ctrlKey||t.metaKey||t.altKey||n<37||n>40||i.getAttribute("role")!=="separator")return;let o=r.getAttribute("data-flex-splitter-vertical");if(o!==null){let a=n===38?-1:n===40?1:0;a&&p(i,!1)(a*u(o)),t.preventDefault();return}let s=r.getAttribute("data-flex-splitter-horizontal");if(s!==null){let a=n===37?-1:n===39?1:0;a&&p(i,!0)(a*u(s)),t.preventDefault()}});addEventListener("pointerdown",t=>{let n=t.target,i=n.parentElement;if(!i||!t.isPrimary||t.button!==0||n.getAttribute("role")!=="separator")return;let r=i.hasAttribute("data-flex-splitter-horizontal");if(!r&&!i.hasAttribute("data-flex-splitter-vertical"))return;let o=t.pointerId,s=p(n,r),a=r?e=>e.pointerId===o&&s(e.clientX-t.clientX):e=>e.pointerId===o&&s(e.clientY-t.clientY),l=e=>{e.pointerId===o&&(n.removeEventListener("pointermove",a),n.removeEventListener("lostpointercapture",l))};a(t),n.addEventListener("lostpointercapture",l),n.addEventListener("pointermove",a),n.setPointerCapture(o),t.preventDefault()});})();