regular-layout 0.2.0 → 0.2.2

package/dist/index.js

@@ -1,7 +1,7 @@
-var g={type:"split-panel",orientation:"horizontal",sizes:[],children:[]};var D="regular-layout";var b="overlay";var V="absolute";function U(n,e){return(n.length===0||Math.abs(e-n[n.length-1])>.001)&&n.push(e),n}function W(n){return n.sort((t,o)=>t-o).reduce(U,[])}function x(n,e,t,o){if(n.type==="child-panel")return[t,o];let i=[t,o];if(n.orientation===e){let r=t,s=o-t;for(let a=0;a<n.children.length;a++){let h=n.sizes[a],c=r+h*s;i.push(...x(n.children[a],e,r,c)),r=c}}else for(let r of n.children)i.push(...x(r,e,t,o));return W(i)}function C(n,e){let t=n.findIndex(o=>Math.abs(o-e)<.001);return t===-1?0:t}function A(n,e,t,o,i,r,s){if(n.type==="child-panel"){let d=n.selected??0;return[{child:n.child[d],colStart:C(e,o),colEnd:C(e,i),rowStart:C(t,r),rowEnd:C(t,s)}]}let{children:a,sizes:h,orientation:c}=n,p=c==="horizontal",l=p?o:r,u=p?i-o:s-r,_=[];for(let d=0;d<a.length;d++){let y=l+h[d]*u;p?_.push(...A(a[d],e,t,l,y,r,s)):_.push(...A(a[d],e,t,o,i,l,y)),l=y}return _}var k=(n,e)=>`:host ::slotted(*){display:none}:host{display:grid;grid-template-rows:${n};grid-template-columns:${e}}`,I=(n,e,t)=>`:host ::slotted([name="${n}"]){display:flex;grid-column:${t};grid-row:${e}}`;function v(n,e=!1,t){if(n.type==="child-panel"){let l=n.selected??0;return`${k("100%","100%")}
-${I(n.child[l],"1","1")}`}let o=l=>l.slice(0,-1).map((_,d)=>l[d+1]-_).map(_=>`${e?Math.round(_*100):_*100}fr`).join(" "),i=x(n,"horizontal",0,1),r=o(i),s=x(n,"vertical",0,1),a=o(s),h=(l,u)=>u-l===1?`${l+1}`:`${l+1} / ${u+1}`,c=A(n,i,s,0,1,0,1),p=[k(a,r)];for(let l of c){let u=h(l.colStart,l.colEnd),_=h(l.rowStart,l.rowEnd);p.push(I(l.child,_,u)),l.child===t?.[1]&&(p.push(I(t[0],_,u)),p.push(`:host ::slotted([name=${t[0]}]){z-index:1}`))}return p.join(`
-`)}var j={row_start:0,row_end:1,col_start:0,col_end:1};function L(n,e,t,o=null){return H(n,e,t,o)}function H(n,e,t,o,i=null,r=structuredClone(j),s=[]){if(n<0||e<0||n>1||e>1)return null;if(t.type==="child-panel"){let d=t.selected??0,y=r.col_end-r.col_start,O=r.row_end-r.row_start;return{type:"layout-path",layout:void 0,slot:t.child[d],path:s,view_window:r,is_edge:!1,column:n,row:e,column_offset:(n-r.col_start)/y,row_offset:(e-r.row_start)/O,orientation:i||"horizontal"}}let a=t.orientation==="vertical",h=a?e:n,c=a?"row_start":"col_start",p=a?"row_end":"col_end",l=a?o?.height:o?.width,u=r[c],_=r[p]-r[c];for(let d=0;d<t.children.length;d++){let y=u+_*t.sizes[d];if(o&&l){let O=6/l;if(Math.abs(h-y)<O)return{path:[...s,d],type:t.orientation,view_window:{...r,[c]:u,[p]:y}}}if(h>=u&&h<y)return H(n,e,t.children[d],o,t.orientation,{...r,[c]:u,[p]:y},[...s,d]);u=y}return null}function E(n,e){if(n.type==="child-panel"){if(n.child.includes(e)){let s=n.child.filter(a=>a!==e);return s.length===0?structuredClone(g):{type:"child-panel",child:s}}return structuredClone(n)}let t=structuredClone(n),o=t.children.findIndex(s=>s.type==="child-panel"?s.child.includes(e):!1);if(o!==-1){let s=t.children[o];if(s.child.length===1){let a=t.children.filter((c,p)=>p!==o),h=q(t.sizes,o);if(a.length===1)return a[0];t.children=a,t.sizes=h}else s.child.splice(s.child.indexOf(e),1),s.selected&&s.selected>=s.child.length&&s.selected--;return t}let i=!1,r=t.children.map(s=>{if(s.type==="split-panel"){let a=E(s,e);return a!==s&&(i=!0),a}return s});return i&&(t.children=r),t}function q(n,e){let t=[],o=n[e],i=0;for(let r=0;r<n.length;r++)r!==e&&(i+=n[r]);for(let r=0;r<n.length;r++)if(r!==e){let s=n[r]/i;t.push(n[r]+o*s)}return t}function m(n,e,t,o){let i=l=>({type:"child-panel",child:[l]});if(t.length===0){if(n.type==="child-panel")return{type:"child-panel",child:[e,...n.child]};if(o)return{type:"split-panel",orientation:o,children:[i(e),n],sizes:[.5,.5]};{let l=[...n.children,i(e)],u=[...n.sizes,1/(l.length-1)];return{...n,children:l,sizes:P(u)}}}let[r,...s]=t;if(o&&s.length===0){if(n.type==="split-panel"&&n.orientation===o){let u=[...n.children];u.splice(r,0,i(e));let _=[...n.sizes];return _.splice(r,0,1/(u.length-1)),{...n,children:u,sizes:P(_)}}let l=r===0?[i(e),n]:[n,i(e)];return{type:"split-panel",orientation:o,children:l,sizes:[.5,.5]}}if(n.type==="child-panel"){if(s.length===0&&o===void 0&&r>=0&&r<=n.child.length){let u=[...n.child];return u.splice(r,0,e),{...n,child:u}}return m({type:"split-panel",orientation:o||"horizontal",children:[n],sizes:[1]},e,t,o)}if(s.length===0||r===n.children.length){if(o&&n.children[r]){let _={type:"split-panel",orientation:o,children:[i(e),n.children[r]],sizes:[.5,.5]},d=[...n.children];return d[r]=_,{...n,children:d,sizes:P(n.sizes)}}let l=[...n.children];l.splice(r,0,i(e));let u=[...n.sizes];return u.splice(r,0,1/(l.length-1)),{...n,children:l,sizes:P(u)}}let a=n.children[r],h=a.type==="child-panel"&&s.length>0&&o!==void 0?n.orientation==="horizontal"?"vertical":"horizontal":o,c=m(a,e,s,h),p=[...n.children];return p[r]=c,{...n,children:p}}function P(n){let e=n.reduce((t,o)=>t+o,0);return n.map(t=>t/e)}function N(n,e,t){let o=structuredClone(n),i=o,r={horizontal:t,vertical:t};for(let s=0;s<e.length-1;s++)i.type==="split-panel"&&(r[i.orientation]/=i.sizes[e[s]],i=i.children[e[s]]);if(i.type==="split-panel"){let s=r[i.orientation],a=e[e.length-1];a<i.sizes.length-1&&(i.sizes=Z(i.sizes,a,s))}return o}function Z(n,e,t){let o=[...n],i=0;for(let s=0;s<=e;s++)i+=n[s];let r=0;for(let s=e+1;s<n.length;s++)r+=n[s];t=Math.sign(t)*Math.min(Math.abs(t),(1-.15)*(t>0?i:r));for(let s=0;s<=e;s++){let a=n[s]/i;o[s]=n[s]-t*a}for(let s=e+1;s<n.length;s++){let a=n[s]/r;o[s]=n[s]+t*a}return o}function G(n,e,t,o){if(!o)return`:host ::slotted([name="${n}"]){display:none;}`;let{view_window:{row_start:i,row_end:r,col_start:s,col_end:a}}=o,h=e.height-parseFloat(t.paddingTop)-parseFloat(t.paddingBottom),c=e.width-parseFloat(t.paddingLeft)-parseFloat(t.paddingRight),p=i*h+parseFloat(t.paddingTop),l=s*c+parseFloat(t.paddingLeft),u=(r-i)*h,_=(a-s)*c,d=`display:flex;position:absolute!important;z-index:1;top:${p}px;left:${l}px;height:${u}px;width:${_}px;`;return`::slotted([name="${n}"]){${d}}`}function $(n,e,t,o,i,r){if(n<.01)return T(t,o,i,[0],!0,"horizontal");if(n>1-.01)return T(t,o,i,i.path.length>0?i.path:[],!1,"horizontal");if(e<.01)return T(t,o,i,[0],!0,"vertical");if(e>1-.01)return T(t,o,i,[],!1,"vertical");let s=i.column_offset<.25||i.column_offset>1-.25,a=i.row_offset<.25||i.row_offset>1-.25;if(s&&a){let h=Math.abs(i.column_offset-.5),c=Math.abs(i.row_offset-.5),p=(r?.width||1)*(i.view_window.col_end-i.view_window.col_start),l=(r?.height||1)*(i.view_window.row_end-i.view_window.row_start),u=h*p>c*l;return z(t,o,i,u?i.column_offset<.25:i.row_offset<.25,u?"horizontal":"vertical")}return s?z(t,o,i,i.column_offset<.25,"horizontal"):a?z(t,o,i,i.row_offset<.25,"vertical"):{...i,path:[...i.path,0]}}function T(n,e,t,o,i,r){return z(n,e,{...t,path:o,orientation:r},i,r)}function z(n,e,t,o,i){let r;if(t.orientation===i)if(t.path.length===0)r=[o?0:1];else{let h=t.path[t.path.length-1];r=[...t.path.slice(0,-1),o?h:h+1]}else r=[...t.path,o?0:1];let s=m(n,e,r,i),a=K(s,r);return{...t,path:r,slot:t.slot,is_edge:!0,orientation:i,view_window:a}}function K(n,e){let t={row_start:0,row_end:1,col_start:0,col_end:1},o=n;for(let i of e){if(o.type==="child-panel")break;let r=Math.min(i,o.children.length-1),s=o.orientation==="vertical",a=s?"row_start":"col_start",h=s?"row_end":"col_end",c=t[h]-t[a],p=o.sizes.slice(0,r).reduce((l,u)=>l+u*c,t[a]);t={...t,[a]:p,[h]:p+c*o.sizes[r]},o=o.children[r]}return t}function F(n){if(n.type==="child-panel")return n.selected=n.selected||0,n;let e=[],t=[];for(let o=0;o<n.children.length;o++){let i=n.children[o],r=n.sizes[o],s=F(i);if(s.type==="split-panel"&&s.orientation===n.orientation)for(let a=0;a<s.children.length;a++)e.push(s.children[a]),t.push(s.sizes[a]*r);else e.push(s),t.push(r)}return e.length===1?e[0]:{type:"split-panel",orientation:n.orientation,children:e,sizes:t}}var w=class extends HTMLElement{_shadowRoot;_panel;_stylesheet;_cursor_stylesheet;_drag_target;_cursor_override;_dimensions;constructor(){super(),this._panel=structuredClone(g),this._shadowRoot=this.attachShadow({mode:"open"}),this._shadowRoot.innerHTML="<slot></slot>",this._stylesheet=new CSSStyleSheet,this._cursor_stylesheet=new CSSStyleSheet,this._cursor_override=!1,this._shadowRoot.adoptedStyleSheets=[this._stylesheet,this._cursor_stylesheet]}connectedCallback(){this.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("pointerup",this.onPointerUp),this.addEventListener("pointermove",this.onPointerMove)}disconnectedCallback(){this.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("pointerup",this.onPointerUp),this.removeEventListener("pointermove",this.onPointerMove)}calculateIntersect=(e,t,o=!1)=>{let[i,r,s]=this.relativeCoordinates(e,t,!1),a=L(i,r,this._panel,o?s:null);return a?.type==="layout-path"?{...a,layout:this.save()}:null};setOverlayState=(e,t,{slot:o},i=b,r=V)=>{let s=E(this._panel,o);Array.from(this.children).find(d=>d.getAttribute("name")===o)?.classList.add(i);let[a,h,c,p]=this.relativeCoordinates(e,t,!1),l=L(a,h,s);if(l&&(l=$(a,h,s,o,l,c)),r==="grid"&&l){let d=[o,l?.slot],y=v(s,!1,d);this._stylesheet.replaceSync(y)}else if(r==="absolute"){let d=v(s),y=G(o,c,p,l);this._stylesheet.replaceSync([d,y].join(`
-`))}let u=`${D}-before-update`,_=new CustomEvent(u,{detail:s});this.dispatchEvent(_)};clearOverlayState=(e,t,o,i=b)=>{let r=this._panel;r=E(r,o.slot),Array.from(this.children).find(_=>_.getAttribute("name")===o.slot)?.classList.remove(i);let[s,a,h]=this.relativeCoordinates(e,t,!1),c=L(s,a,r);c&&(c=$(s,a,r,o.slot,c,h));let{path:p,orientation:l}=c||o,u=c?m(r,o.slot,p,c?.is_edge?l:void 0):o.layout;this.restore(u)};insertPanel=(e,t=[],o)=>{let i;typeof o=="boolean"&&o?i="horizontal":typeof o=="string"&&(i=o),this.restore(m(this._panel,e,t,i))};removePanel=e=>{this.restore(E(this._panel,e))};getPanel=(e,t=this._panel)=>{if(t.type==="child-panel")return t.child.includes(e)?t:null;for(let o of t.children){let i=this.getPanel(e,o);if(i)return i}return null};clear=()=>{this.restore(g)};restore=(e,t=!1)=>{this._panel=t?e:F(e);let o=v(this._panel);this._stylesheet.replaceSync(o);let i=`${D}-update`,r=new CustomEvent(i,{detail:this._panel});this.dispatchEvent(r)};save=()=>structuredClone(this._panel);relativeCoordinates=(e,t,o=!0)=>{(o||!this._dimensions)&&(this._dimensions={box:this.getBoundingClientRect(),style:getComputedStyle(this)});let i=this._dimensions.box,r=this._dimensions.style,s=(e-i.left-parseFloat(r.paddingLeft))/(i.width-parseFloat(r.paddingLeft)-parseFloat(r.paddingRight)),a=(t-i.top-parseFloat(r.paddingTop))/(i.height-parseFloat(r.paddingTop)-parseFloat(r.paddingBottom));return[s,a,i,r]};onPointerDown=e=>{if(e.target===this){let[t,o,i]=this.relativeCoordinates(e.clientX,e.clientY),r=L(t,o,this._panel,i);r&&r.type!=="layout-path"&&(this._drag_target=[r,t,o],this.setPointerCapture(e.pointerId),e.preventDefault())}};onPointerMove=e=>{if(this._drag_target){let[t,o]=this.relativeCoordinates(e.clientX,e.clientY,!1),[{path:i,type:r},s,a]=this._drag_target,h=r==="horizontal"?s-t:a-o,c=N(this._panel,i,h);this._stylesheet.replaceSync(v(c))}else if(e.target===this){let[t,o,i]=this.relativeCoordinates(e.clientX,e.clientY,!1),r=L(t,o,this._panel,i);r?.type==="vertical"?(this._cursor_stylesheet.replaceSync(":host{cursor:row-resize"),this._cursor_override=!0):r?.type==="horizontal"&&(this._cursor_stylesheet.replaceSync(":host{cursor:col-resize"),this._cursor_override=!0)}else this._cursor_override&&(this._cursor_override=!1,this._cursor_stylesheet.replaceSync(""))};onPointerUp=e=>{if(this._drag_target){this.releasePointerCapture(e.pointerId);let[t,o]=this.relativeCoordinates(e.clientX,e.clientY,!1),[{path:i,type:r},s,a]=this._drag_target,h=r==="horizontal"?s-t:a-o,c=N(this._panel,i,h);this.restore(c,!0),this._drag_target=void 0}}};var Q=`
+var b={type:"split-panel",orientation:"horizontal",sizes:[],children:[]};var _=Object.freeze({CUSTOM_EVENT_NAME_PREFIX:"regular-layout",CHILD_ATTRIBUTE_NAME:"name",MIN_DRAG_DISTANCE:10,SHOULD_ROUND:!1,OVERLAY_CLASSNAME:"overlay",MINIMUM_REDISTRIBUTION_SIZE_THRESHOLD:.15,SPLIT_EDGE_TOLERANCE:.25,SPLIT_ROOT_EDGE_TOLERANCE:.01,GRID_TRACK_COLLAPSE_TOLERANCE:.001,OVERLAY_DEFAULT:"absolute",GRID_DIVIDER_SIZE:6,GRID_DIVIDER_CHECK_TARGET:!0});function H(r,e,t){return(e.length===0||Math.abs(t-e[e.length-1])>r.GRID_TRACK_COLLAPSE_TOLERANCE)&&e.push(t),e}function V(r,e){return e.sort((n,o)=>n-o).reduce(H.bind(void 0,r),[])}function R(r,e,t,n,o){if(r.type==="child-panel")return[t,n];let i=[t,n];if(r.orientation===e){let s=t,a=n-t;for(let c=0;c<r.children.length;c++){let d=r.sizes[c],h=s+d*a;i.push(...R(r.children[c],e,s,h,o)),s=h}}else for(let s of r.children)i.push(...R(s,e,t,n,o));return V(o,i)}function C(r,e,t){let n=e.findIndex(o=>Math.abs(o-t)<r.GRID_TRACK_COLLAPSE_TOLERANCE);return n===-1?0:n}function M(r,e,t,n,o,i,s,a){if(r.type==="child-panel"){let m=r.selected??0;return[{child:r.tabs[m],colStart:C(a,e,n),colEnd:C(a,e,o),rowStart:C(a,t,i),rowEnd:C(a,t,s)}]}let{children:c,sizes:d,orientation:h}=r,l=h==="horizontal",u=l?n:i,p=l?o-n:s-i,f=[];for(let m=0;m<c.length;m++){let E=u+d[m]*p;l?f.push(...M(c[m],e,t,u,E,i,s,a)):f.push(...M(c[m],e,t,n,o,u,E,a)),u=E}return f}var x=(r,e)=>`:host ::slotted(*){display:none}:host{display:grid;grid-template-rows:${r};grid-template-columns:${e}}`,A=(r,e,t,n)=>`:host ::slotted([${r.CHILD_ATTRIBUTE_NAME}="${e}"]){display:flex;grid-column:${n};grid-row:${t}}`;function v(r,e,t=_){if(r.type==="child-panel"){let l=r.selected??0;return[x("100%","100%"),A(t,r.tabs[l],"1","1")].join(`
+`)}let n=l=>l.slice(0,-1).map((p,f)=>l[f+1]-p).map(p=>`${t.SHOULD_ROUND?Math.round(p*100):p*100}fr`).join(" "),o=R(r,"horizontal",0,1,t),i=n(o),s=R(r,"vertical",0,1,t),a=n(s),c=(l,u)=>u-l===1?`${l+1}`:`${l+1} / ${u+1}`,d=M(r,o,s,0,1,0,1,t),h=[x(a,i)];for(let l of d){let u=c(l.colStart,l.colEnd),p=c(l.rowStart,l.rowEnd);h.push(A(t,l.child,p,u)),l.child===e?.[1]&&(h.push(A(t,e[0],p,u)),h.push(`:host ::slotted([${t.CHILD_ATTRIBUTE_NAME}=${e[0]}]){z-index:1}`))}return h.join(`
+`)}var F={row_start:0,row_end:1,col_start:0,col_end:1};function y(r,e,t,n=null){return U(r,e,t,n)}function U(r,e,t,n,o=null,i=structuredClone(F),s=[]){if(r<0||e<0||r>1||e>1)return null;if(t.type==="child-panel"){let f=t.selected??0,m=i.col_end-i.col_start,E=i.row_end-i.row_start;return{type:"layout-path",layout:t,slot:t.tabs[f],path:s,view_window:i,is_edge:!1,column:r,row:e,column_offset:(r-i.col_start)/m,row_offset:(e-i.row_start)/E,orientation:o||"horizontal"}}let a=t.orientation==="vertical",c=a?e:r,d=a?"row_start":"col_start",h=a?"row_end":"col_end",l=a?n?.rect?.height:n?.rect?.width,u=i[d],p=i[h]-i[d];for(let f=0;f<t.children.length;f++){let m=u+p*t.sizes[f];if(n&&l){let E=n.size/l;if(Math.abs(c-m)<E)return{path:[...s,f],type:t.orientation,view_window:{...i,[d]:u,[h]:m}}}if(c>=u&&c<m)return U(r,e,t.children[f],n,t.orientation,{...i,[d]:u,[h]:m},[...s,f]);u=m}return null}function T(r,e){if(r.type==="child-panel"){if(r.tabs.includes(e)){let s=r.tabs.filter(a=>a!==e);return s.length===0?structuredClone(b):{type:"child-panel",tabs:s}}return structuredClone(r)}let t=structuredClone(r),n=t.children.findIndex(s=>s.type==="child-panel"?s.tabs.includes(e):!1);if(n!==-1){let s=t.children[n];if(s.tabs.length===1){let a=t.children.filter((d,h)=>h!==n),c=$(t.sizes,n);if(a.length===1)return a[0];t.children=a,t.sizes=c}else s.tabs.splice(s.tabs.indexOf(e),1),s.selected&&s.selected>=s.tabs.length&&s.selected--;return t}let o=!1,i=t.children.map(s=>{if(s.type==="split-panel"){let a=T(s,e);return a!==s&&(o=!0),a}return s});return o&&(t.children=i),t}function $(r,e){let t=[],n=r[e],o=0;for(let i=0;i<r.length;i++)i!==e&&(o+=r[i]);for(let i=0;i<r.length;i++)if(i!==e){let s=r[i]/o;t.push(r[i]+n*s)}return t}function L(r,e,t,n){let o=l=>({type:"child-panel",tabs:[l]});if(t.length===0){if(r.type==="child-panel")return{type:"child-panel",tabs:[e,...r.tabs]};if(n)return{type:"split-panel",orientation:n,children:[o(e),r],sizes:[.5,.5]};{let l=[...r.children,o(e)],u=[...r.sizes,1/(l.length-1)];return{...r,children:l,sizes:P(u)}}}let[i,...s]=t;if(n&&s.length===0){if(r.type==="split-panel"&&r.orientation===n){let u=[...r.children];u.splice(i,0,o(e));let p=[...r.sizes];return p.splice(i,0,1/(u.length-1)),{...r,children:u,sizes:P(p)}}let l=i===0?[o(e),r]:[r,o(e)];return{type:"split-panel",orientation:n,children:l,sizes:[.5,.5]}}if(r.type==="child-panel"){if(s.length===0&&n===void 0&&i>=0&&i<=r.tabs.length){let u=[...r.tabs];return u.splice(i,0,e),{...r,tabs:u}}return L({type:"split-panel",orientation:n||"horizontal",children:[r],sizes:[1]},e,t,n)}if(s.length===0||i===r.children.length){if(n&&r.children[i]){let p={type:"split-panel",orientation:n,children:[o(e),r.children[i]],sizes:[.5,.5]},f=[...r.children];return f[i]=p,{...r,children:f,sizes:P(r.sizes)}}let l=[...r.children];l.splice(i,0,o(e));let u=[...r.sizes];return u.splice(i,0,1/(l.length-1)),{...r,children:l,sizes:P(u)}}let a=r.children[i],c=a.type==="child-panel"&&s.length>0&&n!==void 0?r.orientation==="horizontal"?"vertical":"horizontal":n,d=L(a,e,s,c),h=[...r.children];return h[i]=d,{...r,children:h}}function P(r){let e=r.reduce((t,n)=>t+n,0);return r.map(t=>t/e)}function I(r,e,t,n=_){let o=structuredClone(r),i=o,s={horizontal:t||0,vertical:t||0};for(let a=0;a<e.length-1;a++)i.type==="split-panel"&&(s[i.orientation]/=i.sizes[e[a]],i=i.children[e[a]]);if(i.type==="split-panel")if(t===void 0)i.sizes=i.sizes.map(a=>1/i.sizes.length);else{let a=s[i.orientation],c=e[e.length-1];c<i.sizes.length-1&&(i.sizes=Y(n,i.sizes,c,a))}return o}function Y(r,e,t,n){let o=[...e],i=0;for(let a=0;a<=t;a++)i+=e[a];let s=0;for(let a=t+1;a<e.length;a++)s+=e[a];n=Math.sign(n)*Math.min(Math.abs(n),(1-r.MINIMUM_REDISTRIBUTION_SIZE_THRESHOLD)*(n>0?i:s));for(let a=0;a<=t;a++){let c=e[a]/i;o[a]=e[a]-n*c}for(let a=t+1;a<e.length;a++){let c=e[a]/s;o[a]=e[a]+n*c}return o}function G(r,e,t,n,o=_){if(!n)return`:host ::slotted([${o.CHILD_ATTRIBUTE_NAME}="${r}"]){display:none;}`;let{view_window:{row_start:i,row_end:s,col_start:a,col_end:c}}=n,d=e.height-parseFloat(t.paddingTop)-parseFloat(t.paddingBottom),h=e.width-parseFloat(t.paddingLeft)-parseFloat(t.paddingRight),l=i*d+parseFloat(t.paddingTop),u=a*h+parseFloat(t.paddingLeft),p=(s-i)*d,f=(c-a)*h,m=`display:flex;position:absolute!important;z-index:1;top:${l}px;left:${u}px;height:${p}px;width:${f}px;`;return`::slotted([${o.CHILD_ATTRIBUTE_NAME}="${r}"]){${m}}`}function z(r,e,t,n,o,i,s=_){if(r<s.SPLIT_ROOT_EDGE_TOLERANCE)return D(t,n,o,[0],!0,"horizontal");if(r>1-s.SPLIT_ROOT_EDGE_TOLERANCE)return D(t,n,o,o.path.length>0?o.path:[1],!1,"horizontal");if(e<s.SPLIT_ROOT_EDGE_TOLERANCE)return D(t,n,o,[0],!0,"vertical");if(e>1-s.SPLIT_ROOT_EDGE_TOLERANCE)return D(t,n,o,o.path.length>0?o.path:[1],!1,"vertical");let a=o.column_offset<s.SPLIT_EDGE_TOLERANCE||o.column_offset>1-s.SPLIT_EDGE_TOLERANCE,c=o.row_offset<s.SPLIT_EDGE_TOLERANCE||o.row_offset>1-s.SPLIT_EDGE_TOLERANCE;if(a&&c){let d=Math.abs(o.column_offset-.5),h=Math.abs(o.row_offset-.5),l=(i?.width||1)*(o.view_window.col_end-o.view_window.col_start),u=(i?.height||1)*(o.view_window.row_end-o.view_window.row_start),p=l/2-d*l<u/2-h*u;return w(t,n,o,p?o.column_offset<s.SPLIT_EDGE_TOLERANCE:o.row_offset<s.SPLIT_EDGE_TOLERANCE,p?"horizontal":"vertical")}return a?w(t,n,o,o.column_offset<s.SPLIT_EDGE_TOLERANCE,"horizontal"):c?w(t,n,o,o.row_offset<s.SPLIT_EDGE_TOLERANCE,"vertical"):{...o,path:[...o.path,0]}}function D(r,e,t,n,o,i){return w(r,e,{...t,path:n,orientation:i},o,i)}function w(r,e,t,n,o){let i;if(t.orientation===o)if(t.path.length===0)i=[n?0:1];else{let c=t.path[t.path.length-1];i=[...t.path.slice(0,-1),n?c:c+1]}else i=[...t.path,n?0:1];let s=L(r,e,i,o),a=k(s,i);return{...t,path:i,slot:t.slot,is_edge:!0,orientation:o,view_window:a}}function k(r,e){let t={row_start:0,row_end:1,col_start:0,col_end:1},n=r;for(let o of e){if(n.type==="child-panel")break;let i=Math.min(o,n.children.length-1),s=n.orientation==="vertical",a=s?"row_start":"col_start",c=s?"row_end":"col_end",d=t[c]-t[a],h=n.sizes.slice(0,i).reduce((l,u)=>l+u*d,t[a]);t={...t,[a]:h,[c]:h+d*n.sizes[i]},n=n.children[i]}return t}function N(r){if(r.type==="child-panel")return r.selected=r.selected||0,r;let e=[],t=[];for(let n=0;n<r.children.length;n++){let o=r.children[n],i=r.sizes[n],s=N(o);if(s.type==="split-panel"&&s.orientation===r.orientation)for(let a=0;a<s.children.length;a++)e.push(s.children[a]),t.push(s.sizes[a]*i);else e.push(s),t.push(i)}return e.length===1?e[0]:{type:"split-panel",orientation:r.orientation,children:e,sizes:t}}var g=class extends HTMLElement{s;n;c;u;h;a;d;t;constructor(){super(),this.t=_,this.n=structuredClone(b),this.s=this.attachShadow({mode:"open"}),this.s.innerHTML="<slot></slot>",this.c=new CSSStyleSheet,this.u=new CSSStyleSheet,this.a=!1,this.s.adoptedStyleSheets=[this.c,this.u]}connectedCallback(){this.addEventListener("dblclick",this.onDblClick),this.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("pointerup",this.onPointerUp),this.addEventListener("pointermove",this.onPointerMove)}disconnectedCallback(){this.removeEventListener("dblclick",this.onDblClick),this.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("pointerup",this.onPointerUp),this.removeEventListener("pointermove",this.onPointerMove)}calculateIntersect=e=>{let[t,n,o]=this.relativeCoordinates(e,!1);return y(t,n,this.n)};setOverlayState=(e,{slot:t},n=this.t.OVERLAY_CLASSNAME,o=this.t.OVERLAY_DEFAULT)=>{let i=T(this.n,t),s=`:scope > [${this.t.CHILD_ATTRIBUTE_NAME}="${t}"]`,a=this.querySelector(s);a&&a.classList.add(n);let[c,d,h,l]=this.relativeCoordinates(e,!0),u=y(c,d,i);if(u&&(u=z(c,d,i,t,u,h,this.t)),o==="grid"&&u){let m=[t,u?.slot],E=v(i,m,this.t);this.c.replaceSync(E)}else if(o==="absolute"){let m=v(i,void 0,this.t),E=G(t,h,l,u,this.t);this.c.replaceSync([m,E].join(`
+`))}let p=`${this.t.CUSTOM_EVENT_NAME_PREFIX}-before-update`,f=new CustomEvent(p,{detail:i});this.dispatchEvent(f)};clearOverlayState=(e,{slot:t,layout:n},o=this.t.OVERLAY_CLASSNAME)=>{let i=this.n;i=T(i,t);let s=`:scope > [${this.t.CHILD_ATTRIBUTE_NAME}="${t}"]`,a=this.querySelector(s);if(a&&a.classList.remove(o),e===null){this.restore(n);return}let[c,d,h]=this.relativeCoordinates(e,!1),l=y(c,d,i);if(l&&(l=z(c,d,i,t,l,h,this.t)),l){let u=l?.is_edge?l.orientation:void 0,p=L(i,t,l.path,u);this.restore(p)}else this.restore(n)};insertPanel=(e,t=[],n)=>{let o;typeof n=="boolean"&&n?o="horizontal":typeof n=="string"&&(o=n),this.restore(L(this.n,e,t,o))};removePanel=e=>{this.restore(T(this.n,e))};getPanel=(e,t=this.n)=>{if(t.type==="child-panel")return t.tabs.includes(e)?t:null;for(let n of t.children){let o=this.getPanel(e,n);if(o)return o}return null};clear=()=>{this.restore(b)};restore=(e,t=!1)=>{this.n=t?e:N(e);let n=v(this.n,void 0,this.t);this.c.replaceSync(n);let o=`${this.t.CUSTOM_EVENT_NAME_PREFIX}-update`,i=new CustomEvent(o,{detail:this.n});this.dispatchEvent(i)};save=()=>structuredClone(this.n);restorePhysics(e){this.t=Object.freeze({...this.t,...e})}savePhysics(){return this.t}relativeCoordinates=(e,t=!0)=>{(t||!this.d)&&(this.d={box:this.getBoundingClientRect(),style:getComputedStyle(this)});let n=this.d.box,o=this.d.style,i=(e.clientX-n.left-parseFloat(o.paddingLeft))/(n.width-parseFloat(o.paddingLeft)-parseFloat(o.paddingRight)),s=(e.clientY-n.top-parseFloat(o.paddingTop))/(n.height-parseFloat(o.paddingTop)-parseFloat(o.paddingBottom));return[i,s,n,o]};diffCoordinates=(e,t)=>{let[n,o,i]=this.relativeCoordinates(e,!1),s=(n-t.column)*i.width,a=(o-t.row)*i.height;return Math.sqrt(s**2+a**2)};onDblClick=e=>{let[t,n,o]=this.relativeCoordinates(e,!1),i=y(t,n,this.n,{rect:o,size:this.t.GRID_DIVIDER_SIZE});if(i?.type==="horizontal"||i?.type==="vertical"){let s=I(this.n,i.path,void 0);this.restore(s,!0)}};onPointerDown=e=>{if(!this.t.GRID_DIVIDER_CHECK_TARGET||e.target===this){let[t,n,o]=this.relativeCoordinates(e),i=this.t.GRID_DIVIDER_SIZE,s=y(t,n,this.n,{rect:o,size:i});s&&s.type!=="layout-path"&&(this.h=[s,t,n],this.setPointerCapture(e.pointerId),e.preventDefault())}};onPointerMove=e=>{if(this.h){let[s,a]=this.relativeCoordinates(e,!1),[{path:c,type:d},h,l]=this.h,u=d==="horizontal"?h-s:l-a,p=I(this.n,c,u);this.c.replaceSync(v(p,void 0,this.t))}if(this.t.GRID_DIVIDER_CHECK_TARGET&&e.target!==this){this.a&&(this.a=!1,this.u.replaceSync(""));return}let[t,n,o]=this.relativeCoordinates(e,!1),i=y(t,n,this.n,{rect:o,size:this.t.GRID_DIVIDER_SIZE});i?.type==="vertical"?(this.u.replaceSync(":host{cursor:row-resize"),this.a=!0):i?.type==="horizontal"?(this.u.replaceSync(":host{cursor:col-resize"),this.a=!0):this.a&&(this.a=!1,this.u.replaceSync(""))};onPointerUp=e=>{if(this.h){this.releasePointerCapture(e.pointerId);let[t,n]=this.relativeCoordinates(e,!1),[{path:o,type:i},s,a]=this.h,c=i==="horizontal"?s-t:a-n,d=I(this.n,o,c);this.restore(d,!0),this.h=void 0}}};var B=`
 :host{box-sizing:border-box;flex-direction:column}
 :host::part(titlebar){display:flex;height:24px;user-select:none;overflow:hidden}
 :host::part(container){flex:1 1 auto}
@@ -9,8 +9,8 @@ ${I(n.child[l],"1","1")}`}let o=l=>l.slice(0,-1).map((_,d)=>l[d+1]-_).map(_=>`${
 :host::part(close){align-self:stretch}
 :host::slotted{flex:1 1 auto;}
 :host regular-layout-tab{width:0px;}
-`,tt=`
+`,W=`
 	<div part="titlebar"></div>
 	<slot part="container"></slot>
-`,S=class extends HTMLElement{_shadowRoot;_container_sheet;_layout;_header;_drag_state=null;_drag_moved=!1;_tab_to_index_map=new WeakMap;constructor(){super(),this._container_sheet=new CSSStyleSheet,this._container_sheet.replaceSync(Q),this._shadowRoot=this.attachShadow({mode:"open"}),this._shadowRoot.adoptedStyleSheets=[this._container_sheet]}connectedCallback(){this._shadowRoot.innerHTML=tt,this._layout=this.parentElement,this._header=this._shadowRoot.children[0],this._header.addEventListener("pointerdown",this.onPointerDown),this._header.addEventListener("pointermove",this.onPointerMove),this._header.addEventListener("pointerup",this.onPointerUp),this._header.addEventListener("lostpointercapture",this.onPointerLost),this._layout.addEventListener("regular-layout-update",this.drawTabs),this._layout.addEventListener("regular-layout-before-update",this.drawTabs)}disconnectedCallback(){this._header.removeEventListener("pointerdown",this.onPointerDown),this._header.removeEventListener("pointermove",this.onPointerMove),this._header.removeEventListener("pointerup",this.onPointerUp),this._header.removeEventListener("lostpointercapture",this.onPointerLost),this._layout.removeEventListener("regular-layout-update",this.drawTabs),this._layout.removeEventListener("regular-layout-before-update",this.drawTabs)}onPointerDown=e=>{e.target.part.contains("tab")&&(this._drag_state=this._layout.calculateIntersect(e.clientX,e.clientY),this._drag_state&&(this._header.setPointerCapture(e.pointerId),e.preventDefault()))};onPointerMove=e=>{if(this._drag_state){if(!this._drag_moved){let[t,o,i]=this._layout.relativeCoordinates(e.clientX,e.clientY),r=(t-this._drag_state.column)*i.width,s=(o-this._drag_state.row)*i.height;if(Math.sqrt(r*r+s*s)<=10)return}this._drag_moved=!0,this._layout.setOverlayState(e.clientX,e.clientY,this._drag_state,b)}};onPointerUp=e=>{this._drag_state&&this._drag_moved&&this._layout.clearOverlayState(e.clientX,e.clientY,this._drag_state,b),this._header.releasePointerCapture(e.pointerId),this._drag_state=null,this._drag_moved=!1};onPointerLost=e=>{this._drag_state&&this._layout.clearOverlayState(-1,-1,this._drag_state),this._header.releasePointerCapture(e.pointerId),this._drag_state=null,this._drag_moved=!1};drawTabs=e=>{let t=this.getAttribute("name");if(!t)return;let o=e.detail,i=this._layout.getPanel(t,o);i||(i={type:"child-panel",child:[t],selected:0});for(let s=0;s<i.child.length;s++)if(s>=this._header.children.length){let a=document.createElement("regular-layout-tab");a.populate(this._layout,i,s),this._header.appendChild(a),this._tab_to_index_map.set(a,s)}else this._header.children[s].populate(this._layout,i,s);let r=i.child.length;for(let s=this._header.children.length-1;s>=r;s--)this._header.removeChild(this._header.children[s])}};var M=class extends HTMLElement{_layout;_tab_panel;_index;populate=(e,t,o)=>{if(this._tab_panel){if(o===t.selected!=(o===this._tab_panel?.selected)||this._tab_panel?.child[o]!==t.child[o]){let s=t.selected===o,a=t.child[o];this.children[0].textContent=a,s?(this.children[1].part.add("active-close"),this.part.add("active-tab")):(this.children[1].part.remove("active-close"),this.part.remove("active-tab"))}}else{let i=t.child[o],r=t.selected===o,s=r?"active-close close":"close";this.innerHTML=`<div part="title"></div><button part="${s}"></button>`,r?this.part.add("tab","active-tab"):this.part.add("tab"),this.addEventListener("pointerdown",this.onTabClick),this.children[0].textContent=i,this.children[1].addEventListener("pointerdown",this.onTabClose)}this._tab_panel=t,this._layout=e,this._index=o};onTabClose=e=>{this._tab_panel!==void 0&&this._index!==void 0&&this._layout?.removePanel(this._tab_panel.child[this._index])};onTabClick=e=>{if(this._tab_panel!==void 0&&this._index!==void 0&&this._index!==this._tab_panel.selected){let t=this._layout?.save(),o=this._layout?.getPanel(this._tab_panel.child[this._index],t);o&&t&&(o.selected=this._index,this._layout?.restore(t))}}};customElements.define("regular-layout",w);customElements.define("regular-layout-frame",S);customElements.define("regular-layout-tab",M);export{w as RegularLayout,S as RegularLayoutFrame};
+`,S=class extends HTMLElement{s;p;e;o;i=null;f=new WeakMap;connectedCallback(){this.p??=new CSSStyleSheet,this.p.replaceSync(B),this.s??=this.attachShadow({mode:"open"}),this.s.adoptedStyleSheets=[this.p],this.s.innerHTML=W,this.e=this.parentElement,this.o=this.s.children[0],this.o.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("pointermove",this.onPointerMove),this.addEventListener("pointerup",this.onPointerUp),this.addEventListener("pointercancel",this.onPointerCancel),this.addEventListener("lostpointercapture",this.onPointerLost),this.e.addEventListener("regular-layout-update",this.drawTabs),this.e.addEventListener("regular-layout-before-update",this.drawTabs)}disconnectedCallback(){this.o.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("pointermove",this.onPointerMove),this.removeEventListener("pointerup",this.onPointerUp),this.removeEventListener("pointercancel",this.onPointerUp),this.removeEventListener("lostpointercapture",this.onPointerLost),this.e.removeEventListener("regular-layout-update",this.drawTabs),this.e.removeEventListener("regular-layout-before-update",this.drawTabs)}onPointerDown=e=>{if(e.target.part.contains("tab")){let n=this.e.calculateIntersect(e);n?(this.i={path:n},this.setPointerCapture(e.pointerId),e.preventDefault()):this.i=null}};onPointerMove=e=>{if(this.i){let t=this.e.savePhysics();if(!this.i.moved&&this.e.diffCoordinates(e,this.i.path)<=t.MIN_DRAG_DISTANCE)return;this.i.moved=!0,this.e.setOverlayState(e,this.i.path)}};onPointerUp=e=>{this.i?.moved&&this.e.clearOverlayState(e,this.i.path)};onPointerCancel=e=>{this.i?.moved&&this.e.clearOverlayState(null,this.i.path)};onPointerLost=e=>{this.releasePointerCapture(e.pointerId),this.i=null};drawTabs=e=>{let t=this.e.savePhysics().CHILD_ATTRIBUTE_NAME,n=this.getAttribute(t);if(!n)return;let o=e.detail,i=this.e.getPanel(n,o);i||(i={type:"child-panel",tabs:[n],selected:0});for(let a=0;a<i.tabs.length;a++)if(a>=this.o.children.length){let c=document.createElement("regular-layout-tab");c.populate(this.e,i,a),this.o.appendChild(c),this.f.set(c,a)}else this.o.children[a].populate(this.e,i,a);let s=i.tabs.length;for(let a=this.o.children.length-1;a>=s;a--)this.o.removeChild(this.o.children[a])}};var O=class extends HTMLElement{e;r;l;populate=(e,t,n)=>{if(this.r){if(n===t.selected!=(n===this.r?.selected)||this.r?.tabs[n]!==t.tabs[n]){let s=t.selected===n,a=t.tabs[n];this.children[0].textContent=a,s?(this.children[1].part.add("active-close"),this.part.add("active-tab")):(this.children[1].part.remove("active-close"),this.part.remove("active-tab"))}}else{let o=t.tabs[n],i=t.selected===n,s=i?"active-close close":"close";this.innerHTML=`<div part="title"></div><button part="${s}"></button>`,i?this.part.add("tab","active-tab"):this.part.add("tab"),this.addEventListener("pointerdown",this.onTabClick),this.children[0].textContent=o,this.children[1].addEventListener("pointerdown",this.onTabClose)}this.r=t,this.e=e,this.l=n};onTabClose=e=>{this.r!==void 0&&this.l!==void 0&&this.e?.removePanel(this.r.tabs[this.l])};onTabClick=e=>{if(this.r!==void 0&&this.l!==void 0&&this.l!==this.r.selected){let t=this.e?.save(),n=this.e?.getPanel(this.r.tabs[this.l],t);n&&t&&(n.selected=this.l,this.e?.restore(t))}}};customElements.define("regular-layout",g);customElements.define("regular-layout-frame",S);customElements.define("regular-layout-tab",O);export{g as RegularLayout,S as RegularLayoutFrame};
 //# sourceMappingURL=index.js.map