@spotlightjs/spotlight 4.5.0 → 4.6.0

package/dist/ui/assets/index2.js

@@ -0,0 +1 @@
+var dt=Object.defineProperty;var ut=(h,o,t)=>o in h?dt(h,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):h[o]=t;var l=(h,o,t)=>ut(h,typeof o!="symbol"?o+"":o,t);function mt(h,o=1,t=1){const e=(.6+.4*Math.max(0,Math.cos(h)))*o,i=(.5+.2*Math.max(0,Math.cos(h+Math.PI*2/3)))*t;return`hsl(${h*180/Math.PI}deg, ${Math.round(100*e)}%, ${Math.round(100*i)}%)`}let J,tt,et,W,S,y=1,E;function $(h,o,t,e,i){if(!Array.isArray(h))return h;const s=window.devicePixelRatio||1;if(J!==o||tt!==s||et!==i){const n=Math.round(64*s)/64;y=i,y=Math.log2(y),y-=Math.floor(y);const a=y,r=Math.min(1,8*a);y=2**y;const c=8*Math.SQRT2/y;J=o,tt=s,et=i,W||(W=document.createElement("canvas")),S||(S=W.getContext("2d")),W.width=W.height=Math.round(64*n),S.scale(n,n),S.fillStyle=h[0],S.fillRect(0,0,64,64),S.globalAlpha=.25,S.fillStyle=h[1],S.fillRect(0,0,64,64),S.globalAlpha=.67,S.strokeStyle=h[1],S.beginPath();for(let d=0;d<=64;d+=16)S.moveTo(d-32,d+32),S.lineTo(d+32,d-32);if(S.lineWidth=c*(1-(r-a)/2),S.stroke(),r+a>0){S.beginPath();for(let d=8;d<64;d+=16)S.moveTo(d-32,d+32),S.lineTo(d+32,d-32);S.lineWidth=c*(r+a)/2,S.stroke()}E=o.createPattern(W,"repeat"),y/=n}return t/=64*y*s,t-=Math.floor(t),t*=64*y*s,E.setTransform(new DOMMatrix([y,0,0,y,t,e])),E}function Ot(h){return Array.isArray(h)?`url('data:image/svg+xml,<svg width="26" height="26" xmlns="http://www.w3.org/2000/svg"><rect width="26" height="26" fill="${h[0]}"/><rect width="26" height="26" fill="${h[1]}" fill-opacity="25%"/><path d="M22.5 -3.5L-3.5 22.5M35.5 9.5L9.5 35.5" stroke="${h[1]}" stroke-opacity="67%" stroke-width="9.19239"/></svg>')`:h}function ft(h){return o=>o.id&&h[o.id]||o.color}function pt(h,o=1,t=1){const e={};return ot(e,h,0,Math.PI*2,o,t),ft(e)}function ot(h,o,t,e,i=1,s=1){const n=o.size;h[o.id]=mt(t+e/2,i,s);for(const a of o.children){const r=a.size/n*e;ot(h,a,t,r,i,s),t+=r}}const vt="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";function gt(h=16,o=vt){let t="",e=h;const i=o.length;for(;e--;)t+=o[Math.random()*i|0];return t}function wt(h,o,t=(e,i)=>i.size-e.size){if(h.__nanovis)return h;const e={...h};return e.id||(e.id=gt()),e.parent||(e.parent=o),e.children||(e.children=[]),e.sizeSelf==null&&e.size!=null&&e.children.length===0?e.sizeSelf=e.size:e.sizeSelf||(e.sizeSelf=0),e.children=(e.children||[]).map(i=>wt(i,e,t)),e.size||(e.size=e.children.reduce((i,s)=>i+s.size,0)+e.sizeSelf),t&&e.children.sort(t),Object.defineProperty(e,"__nanovis",{enumerable:!1,value:!0}),e}function at(h){return h.children.length===0?1:Math.max(...h.children.map(o=>at(o)))+1}const Nt=/\bFirefox\//.test(navigator.userAgent);let X;function rt(h){return X?X.format(h):`${h}`}function D(){return(window.performance||Date).now()}function L(h){const o=h.toFixed(1).split(".",2);return`${rt(+o[0])}.${o[1]}`}function St(h){return h===1?"1 byte":h<1024?`${rt(h)} bytes`:h<1024*1024?`${L(h/1024)} kb`:h<1024*1024*1024?`${L(h/(1024*1024))} mb`:`${L(h/(1024*1024*1024))} gb`}function lt(h,o,t,e,i,s){if(Nt){const n=h.lineWidth,a=n/2;h.fillStyle=o,h.fillRect(t-a,e-a,i+n,n),h.fillRect(t-a,e+a,n,s-n),h.fillRect(t-a,e+s-a,i+n,n),h.fillRect(t+i-a,e+a,n,s-n);return}h.strokeStyle=o,h.strokeRect(t,e,i,s)}function G(h){return window.addEventListener("wheel",h,{passive:!1}),()=>window.removeEventListener("wheel",h)}function j(h){return window.addEventListener("resize",h),()=>window.removeEventListener("resize",h)}try{X=new Intl.NumberFormat}catch{}let Mt=()=>({emit(h,...o){for(let t=this.events[h]||[],e=0,i=t.length;e<i;e++)t[e](...o)},events:{},on(h,o){var t;return((t=this.events)[h]||(t[h]=[])).push(o),()=>{var e;this.events[h]=(e=this.events[h])==null?void 0:e.filter(i=>o!==i)}}});const _={getText:h=>h.text,getSubtext:h=>h.subtext,animate:!0,animateDuration:350},xt={fallback:"#CCC",stroke:"#0008",text:"#222",hover:"#fff5",shadow:"#0008",fg:"#fff",bg:"#222"},yt=46,V="14px sans-serif",ct=`bold ${V}`;class q{constructor(o,t){l(this,"el");l(this,"canvas");l(this,"c");l(this,"width",0);l(this,"height",0);l(this,"ratio",1);l(this,"root");l(this,"maxDepth");l(this,"events");l(this,"options");l(this,"palette");l(this,"disposables");l(this,"getColor");l(this,"getText");l(this,"getSubtext");l(this,"_animationFrame",null);l(this,"_font","14px sans-serif");l(this,"_fontWidthCache",new Map);l(this,"ellipsisWidth",0);this.options={..._,...t};const{getColor:e=pt(o),getText:i=()=>{},getSubtext:s=()=>{}}=this.options;this.palette={...xt,...t.palette},this.el=document.createElement("div"),this.canvas=document.createElement("canvas"),this.c=this.canvas.getContext("2d"),this.root=o,this.maxDepth=at(o),this.disposables=[],this.events=Mt(),this.getColor=e,this.getText=i,this.getSubtext=s,this.setFont(V),t.onClick&&this.events.on("click",t.onClick),t.onHover&&this.events.on("hover",t.onHover),t.onLeave&&this.events.on("leave",t.onLeave),t.onSelect&&this.events.on("select",t.onSelect),this.el.addEventListener("mouseleave",()=>{this.events.emit("leave")})}invalidate(){this._animationFrame===null&&(this._animationFrame=requestAnimationFrame(()=>{this._animationFrame=null,this.tick()}))}tick(){this.draw()}draw(){}resize(){this.ratio=window.devicePixelRatio||1,this.canvas.style.width=`${this.width}px`,this.canvas.style.height=`${this.height}px`,this.canvas.width=Math.round(this.width*this.ratio),this.canvas.height=Math.round(this.height*this.ratio),this.c.scale(this.ratio,this.ratio),this.draw()}select(o,t){this.events.emit("select",o)}dispose(){this.disposables.forEach(o=>o()),this.disposables.length=0,this.el.remove()}[Symbol.dispose](){this.dispose()}getFontCache(){return this._fontWidthCache.has(this._font)||this._fontWidthCache.set(this._font,{}),this._fontWidthCache.get(this._font)}setFont(o){this._font=o,this.c.font=o,this.c.textBaseline="middle",this.ellipsisWidth=3*this.charCodeWidth(yt)}charCodeWidth(o){const t=this.getFontCache();let e=t[o];return e===void 0&&(e=this.c.measureText(String.fromCharCode(o)).width,t[o]=e),e}textOverflowEllipsis(o,t){if(t<this.ellipsisWidth)return["",0];let e=0;const i=o.length;let s=0;for(;s<i;){const n=this.charCodeWidth(o.charCodeAt(s));if(t<e+this.ellipsisWidth+n)return[`${o.slice(0,s)}...`,e+this.ellipsisWidth];e+=n,s++}return[o,e]}}const b=24,Tt=5,it=.01,st=1e3;class At extends q{constructor(t,e={}){super(t,e);l(this,"mainEl",document.createElement("div"));l(this,"totalBytes");l(this,"viewportMin");l(this,"viewportMax");l(this,"zoomedOutMin",0);l(this,"zoomedOutWidth",0);l(this,"prevWheelTime",0);l(this,"prevWheelWasZoom",!1);l(this,"stripeScaleAdjust",1);l(this,"hoveredNode",null);l(this,"selectedNode",null);l(this,"nodeStartBytes",new Map);l(this,"animationFromMin",0);l(this,"animationFromMax",0);l(this,"animationToMin",0);l(this,"animationToMax",0);l(this,"animationStart",0);this.totalBytes=t.size,this.viewportMin=this.animationFromMin=this.animationToMin=0,this.viewportMax=this.animationFromMax=this.animationToMax=this.totalBytes,Object.assign(this.mainEl.style,{position:"relative"}),Object.assign(this.canvas.style,{position:"absolute",left:"0",top:"0"});let i=!1;this.canvas.onmousedown=s=>{if(i=!1,s.button!==2){let n=s.pageX;const a=c=>{const d=c.pageX-n;!i&&Math.abs(d)<3||(i=!0,this.modifyViewport(-d,0,null),n=c.pageX)},r=()=>{document.removeEventListener("mousemove",a),document.removeEventListener("mouseup",r)};s.preventDefault(),document.addEventListener("mousemove",a),document.addEventListener("mouseup",r)}},this.canvas.onmousemove=s=>{this.updateHover(s)},this.canvas.onmouseout=()=>{this.changeHoveredNode(null)},this.canvas.onclick=s=>{if(i)return;const n=this.hitTestNode(s);this.changeHoveredNode(n),this.changeSelectedNode(n),n&&this.events.emit("click",n,s)},this.disposables.push(G(s=>{const n=s.deltaX,a=s.deltaY,r=D(),c=r-this.prevWheelTime<50?this.prevWheelWasZoom:s.ctrlKey||s.metaKey;this.prevWheelTime=r,this.prevWheelWasZoom=c,(c||Math.abs(n)>=Math.abs(a))&&s.preventDefault(),this.modifyViewport(n,a,c?s.pageX:null),this.updateHover(s)})),this.resize(),Promise.resolve().then(()=>this.resize()),this.disposables.push(j(()=>this.resize())),this.mainEl.append(this.canvas),this.el.append(this.mainEl)}tick(){let t=(D()-this.animationStart)/(this.options.animateDuration??_.animateDuration);t<0||t>1?(t=1,this.viewportMin=this.animationToMin,this.viewportMax=this.animationToMax):(t<.5?t*=4*t*t:(t=1-t,t*=4*t*t,t=1-t),this.viewportMin=this.animationFromMin+(this.animationToMin-this.animationFromMin)*t,this.viewportMax=this.animationFromMax+(this.animationToMax-this.animationFromMax)*t,this.invalidate()),this.draw()}draw(){this.c.clearRect(0,0,this.width,this.height),this.drawNode(this.root,0,0,-1/0,1)}changeSelectedNode(t,e=this.options.animate??_.animate){if(this.selectedNode!==t&&(this.selectedNode=t,this.events.emit("select",t),t&&this.nodeStartBytes.has(t.id))){let i=this.nodeStartBytes.get(t.id),s=i+t.size;i=Math.max(0,i-t.size*it),s=Math.min(this.totalBytes,s+t.size*it),this.setViewport(i,s,e)}}select(t,e=this.options.animate??_.animate){this.changeSelectedNode(t,e)}resize(){this.width=this.el.clientWidth,this.height=this.maxDepth*b+1,this.zoomedOutMin=this.width-st>>1,this.zoomedOutWidth=this.zoomedOutMin+st,this.zoomedOutMin<0&&(this.zoomedOutMin=0),this.zoomedOutWidth>this.width&&(this.zoomedOutWidth=this.width),this.zoomedOutWidth-=this.zoomedOutMin,this.stripeScaleAdjust=this.totalBytes/this.zoomedOutWidth,this.mainEl.style.height=`${this.height}px`,super.resize()}drawNode(t,e,i,s,n){this.nodeStartBytes.set(t.id,i);const a=this.zoomedOutWidth/(this.viewportMax-this.viewportMin),r=this.zoomedOutMin+(i-this.viewportMin)*a,c=t.size*a,d=r+c;if(d<s+1.5)return s;if(r+c<0||r>this.width)return d;const m=c<2?2:c,u=(r>0?r:0)+Tt,p=e+b/2;let v=this.getText(t)||"",g=this.getSubtext(t)||"",w,f=0;const N=c+r-u,M=$(this.getColor(t)||this.palette.fallback,this.c,this.zoomedOutMin-this.viewportMin*a,b,a*this.stripeScaleAdjust);let T=this.palette.text,x=-1/0;n&1?(T=this.palette.fg,this.setFont(ct)):(this.c.fillStyle=M,this.c.fillRect(r,e,m,b),(n&2||this.hoveredNode&&t.id===this.hoveredNode.id)&&(this.c.fillStyle=this.palette.hover,this.c.fillRect(r,e,m,b),n|=2)),this.ellipsisWidth<N&&(w=this.c.measureText(v).width,w<=N?f+=w:(v=this.textOverflowEllipsis(v,N)[0],f=N),this.c.fillStyle=T,this.c.fillText(v,u,p)),n&1&&this.setFont(V),f+this.ellipsisWidth<N&&(g&&v&&(g=` - ${g}`),w=this.c.measureText(g).width,f+w>N&&(g=this.textOverflowEllipsis(g,N-f)[0]),this.c.globalAlpha=.5,this.c.fillText(g,u+f,p),this.c.globalAlpha=1);for(const O of t.children)x=this.drawNode(O,e+b,i,x,n&-2),i+=O.size;return n&1||lt(this.c,this.palette.stroke,r+.5,e+.5,m,b),d}changeHoveredNode(t){this.hoveredNode!==t&&(this.hoveredNode=t,this.canvas.style.cursor=t&&!t.children.length?"pointer":"auto",this.invalidate())}hitTestNode(t){const e=this.canvas.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top,n=this.viewportMin+(this.viewportMax-this.viewportMin)/this.zoomedOutWidth*(i-this.zoomedOutMin),a=(r,c,d)=>{if(n>=d&&n<d+r.size){if(s>=c&&s<c+b&&r.id)return r;if(s>=c+b)for(const m of r.children){const u=a(m,c+b,d);if(u)return u;d+=m.size}}return null};return a(this.root,0,0)}modifyViewport(t,e,i){let s=this.viewportMin,n=this.viewportMax,a=0;if(i!==null){const r=s+(n-s)/this.zoomedOutWidth*(i-this.zoomedOutMin),c=1.01**e;s=r+(s-r)*c,n=r+(n-r)*c}else a=t*(n-s)/this.zoomedOutWidth;s+a<0?a=-s:n+a>this.totalBytes&&(a=this.totalBytes-n),s+=a,n+=a,s<0&&(s=0),n>this.totalBytes&&(n=this.totalBytes),this.setViewport(s,n,!1)}setViewport(t,e,i){this.animationFromMin=this.viewportMin,this.animationFromMax=this.viewportMax,this.animationToMin=t,this.animationToMax=e,i?this.animationStart=D():this.animationStart=0,this.invalidate()}updateHover(t){const e=this.hitTestNode(t);this.changeHoveredNode(e),this.events.emit("hover",e,t)}}function ht(h,o){for(;o;){if(o===h)return!0;o=o.parent}return!1}function I(h,o,t){if(h===o)return;const e=o.parent,i=e.size||1;let s=0;I(h,e,t);for(const n of e.children){if(n===o){t.startAngle_+=t.sweepAngle_*s/i,t.sweepAngle_=n.size/i*t.sweepAngle_;break}s+=n.size}t.depth_+=1}const H={};function nt(h){return H[h]||(H[h]=50*8*Math.log(1+Math.log(1+h/8))),H[h]}const B=-Math.PI/2;class zt extends q{constructor(t,e={}){for(;t.children.length===1;)t=t.children[0];super(t,e);l(this,"currentNode");l(this,"hoveredNode");l(this,"centerX",0);l(this,"centerY",0);l(this,"animationStart",0);l(this,"radiusScale",1);l(this,"sourceDepth",0);l(this,"sourceStartAngle",B);l(this,"sourceSweepAngle",Math.PI*2);l(this,"targetNode");l(this,"targetDepth",this.sourceDepth);l(this,"targetStartAngle",this.sourceStartAngle);l(this,"targetSweepAngle",this.sourceSweepAngle);l(this,"animatedNode");l(this,"animatedDepth",this.sourceDepth);l(this,"animatedStartAngle",this.sourceStartAngle);l(this,"animatedSweepAngle",this.sourceSweepAngle);l(this,"previousHoveredNode");l(this,"historyStack",[]);this.currentNode=t,this.targetNode=this.currentNode,this.animatedNode=this.currentNode,this.canvas.onmousemove=i=>{this.handleMouseMove(i)},this.canvas.onmouseout=i=>{this.changeHoveredNode(void 0),this.events.emit("hover",null,i)},this.canvas.onclick=i=>{let s=this.hitTestNode(i);if(!s)return;this.events.emit("click",s,i);let n=[];s!==this.animatedNode.parent?n=this.historyStack.concat(this.currentNode):this.historyStack.length>0&&(s=this.historyStack.pop(),n=this.historyStack.slice()),this.events.emit("click",s,i),s.children.length>0?(this.select(s),this.historyStack=n):i.preventDefault()},this.el.append(this.canvas),this.resize(),Promise.resolve().then(()=>this.resize()),this.disposables.push(j(()=>this.resize())),this.disposables.push(G(i=>this.handleMouseMove(i)))}select(t,e){(this.currentNode!==t||this.root)&&(this.currentNode=t||this.root,this.updateSunburst(e),this.events.emit("select",t))}resize(){this.width=this.el.clientWidth,this.height=this.width,this.centerX=this.width>>1,this.centerY=this.height>>1;const t=2*Math.ceil(nt(this.maxDepth));this.radiusScale=this.width/t,super.resize()}draw(){this.c.clearRect(0,0,this.width,this.height),this.drawNode(this.animatedNode,this.animatedDepth,this.computeRadius(this.animatedDepth),this.animatedStartAngle,this.animatedSweepAngle,3,-1/0),this.c.strokeStyle=this.palette.stroke,this.c.beginPath(),this.drawNode(this.animatedNode,this.animatedDepth,this.computeRadius(this.animatedDepth),this.animatedStartAngle,this.animatedSweepAngle,1,-1/0),this.c.stroke(),this.animatedDepth===0&&(this.c.fillStyle=this.palette.stroke,this.setFont(ct),this.c.textAlign="center",this.c.fillText(St(this.targetNode.size),this.centerX,this.centerY))}drawNode(t,e,i,s,n,a,r){const c=this.computeRadius(e+1);if(c>this.centerY)return r;t===this.hoveredNode&&(a|=8);const d=(i+c)/2,m=s+n;if(m-r<1.5/d)return r;let u=2/d;if(n>u&&(u=n),a&2)this.c.fillStyle=$(this.getColor(t)||this.palette.fallback,this.c,this.centerX,this.centerY,1),this.c.beginPath(),this.c.arc(this.centerX,this.centerY,i,s,s+u,!1),this.c.arc(this.centerX,this.centerY,c,s+u,s,!0),this.c.fill(),this.hoveredNode&&(a&8||t.parent===this.hoveredNode)&&(this.c.fillStyle=this.palette.hover,this.c.fill());else{const f=u===Math.PI*2,N=a&4||f?c:i;a&1&&i>0&&this.c.arc(this.centerX,this.centerY,i,s+u,s,!0),this.c.moveTo(this.centerX+N*Math.cos(s),this.centerY+N*Math.sin(s)),this.c.arc(this.centerX,this.centerY,c,s,s+u,!1),f||this.c.lineTo(this.centerX+i*Math.cos(s+u),this.centerY+i*Math.sin(s+u))}const p=t.size;let v=a&10,g=0,w=-1/0;for(const f of t.children)w=this.drawNode(f,e+1,c,s+n*g/p,f.size/p*n,v,w),g+=f.size,v|=4;return m}changeHoveredNode(t,e){this.hoveredNode!==t&&(this.hoveredNode=t,this.updateSunburst(e))}hitTestNode(t){const e=this.canvas.getBoundingClientRect(),i=t.clientX-e.left-this.centerX,s=t.clientY-e.top-this.centerY,n=Math.sqrt(i*i+s*s),a=Math.atan2(s,i),r=(c,d,m,u,p)=>{const v=this.computeRadius(d+1);if(v>this.centerY)return;if(n>=m&&n<v){let f=a-u;if(f/=Math.PI*2,f-=Math.floor(f),f*=Math.PI*2,f<p)return c===this.animatedNode?c.parent:c}const g=c.size;let w=0;for(const f of c.children){const N=r(f,d+1,v,u+p*w/g,f.size/g*p);if(N)return N;w+=f.size}};return r(this.animatedNode,this.animatedDepth,this.computeRadius(this.animatedDepth),this.animatedStartAngle,this.animatedSweepAngle)}tick(){let t=(D()-this.animationStart)/(this.options.animateDuration??_.animateDuration);t<0||t>1?(t=1,this.animatedNode=this.targetNode,this.targetDepth=0,this.targetStartAngle=B,this.targetSweepAngle=Math.PI*2):(t<.5?t*=4*t*t:(t=1-t,t*=4*t*t,t=1-t),this.invalidate()),this.animatedDepth=this.sourceDepth+(this.targetDepth-this.sourceDepth)*t,this.animatedStartAngle=this.sourceStartAngle+(this.targetStartAngle-this.sourceStartAngle)*t,this.animatedSweepAngle=this.sourceSweepAngle+(this.targetSweepAngle-this.sourceSweepAngle)*t,this.draw()}handleMouseMove(t){const e=this.hitTestNode(t);this.changeHoveredNode(e),e&&e!==this.animatedNode.parent?(this.events.emit("hover",e,t),this.canvas.style.cursor="pointer"):this.events.emit("hover",null,t)}computeRadius(t){return nt(t)*this.radiusScale}updateSunburst(t=this.options.animate??!0){if(this.previousHoveredNode!==this.hoveredNode&&(this.previousHoveredNode=this.hoveredNode,this.hoveredNode||(this.canvas.style.cursor="auto",this.events.emit("hover",null)),this.invalidate()),this.targetNode!==this.currentNode){if(this.historyStack.length=0,this.invalidate(),t&&(this.animationStart=D()),ht(this.animatedNode,this.currentNode)){const e={depth_:this.animatedDepth,startAngle_:this.animatedStartAngle,sweepAngle_:this.animatedSweepAngle};I(this.animatedNode,this.currentNode,e),this.animatedDepth=e.depth_,this.animatedStartAngle=e.startAngle_,this.animatedSweepAngle=e.sweepAngle_,this.targetDepth=0,this.targetStartAngle=B,this.targetSweepAngle=Math.PI*2,this.animatedNode=this.currentNode}else if(ht(this.currentNode,this.animatedNode)){const e={depth_:0,startAngle_:B,sweepAngle_:Math.PI*2};I(this.currentNode,this.animatedNode,e),this.targetDepth=e.depth_,this.targetStartAngle=e.startAngle_,this.targetSweepAngle=e.sweepAngle_}else this.animationStart=-1/0,this.animatedNode=this.currentNode;this.sourceDepth=this.animatedDepth,this.sourceStartAngle=this.animatedStartAngle,this.sourceSweepAngle=this.animatedSweepAngle,this.targetNode=this.currentNode,this.events.emit("select",this.currentNode)}}}const A=4,z=20,P=2*A,C=z+A;function Y(h,o,t,e,i){const s=[],n=(r,c,d,m,u)=>{const p=h[r].size*u,v=h[c].size*u;return Math.max(d*d*p/(m*m),m*m/(d*d*v))};return((r,c,d,m,u)=>{for(;r<h.length;){let p=0;for(let x=r;x<h.length;x++)p+=h[x].size;const v=Math.min(m,u),g=m*u/p;let w=r,f=0,N=0;for(;w<h.length;){const x=h[w].size*g,O=n(r,w,v,f+x,g);if(w>r&&N<O)break;f+=x,N=O,w++}const M=Math.round(f/v);let T=0;for(let x=r;x<w;x++){const O=h[x],U=O.size*g,k=Math.round(v*T/f),Z=Math.round(v*(T+U)/f),[K,Q,R,F]=m>=u?[c,d+k,M,Z-k]:[c+k,d,Z-k,M];s.push({node:O,box:[K,Q,R,F],children:R>P&&F>C?Y(O.children,K+A,Q+z,R-P,F-C):[]}),T+=U}r=w,m>=u?(c+=M,m-=M):(d+=M,u-=M)}})(0,o,t,e,i),s}class Ct extends q{constructor(t,e={}){super(t,e);l(this,"hoveredNode",null);l(this,"currentNode",null);l(this,"bgOriginX",0);l(this,"bgOriginY",0);l(this,"layers",{base:null});l(this,"baseLayoutCache");l(this,"currentOriginX",0);l(this,"currentOriginY",0);l(this,"animationStart",0);l(this,"animationBlend",1);l(this,"animationSource",null);l(this,"animationTarget",null);this.canvas.addEventListener("mousemove",i=>{this.updateHover(i)}),this.canvas.addEventListener("mouseout",i=>{this.changeHoveredNode(null),this.events.emit("hover",null,i)}),this.el.addEventListener("click",i=>{const s=this.hitTestNode(i);if(s){const n=s.node;this.events.emit("click",n,i),n.children.length?s!==this.layers.current?(this.changeCurrentLayout(s),this.changeHoveredNode(null)):this.updateHover(i):this.updateHover(i)}else this.currentNode&&(this.changeCurrentLayout(null),this.updateHover(i))}),this.el.append(this.canvas),this.resize(),Promise.resolve().then(()=>this.resize()),this.disposables.push(G(i=>this.updateHover(i))),this.disposables.push(j(()=>this.resize()))}select(t,e){let i=null;t===this.root&&(t=null),t?i=this.searchFor([this.layers.current,this.layers.base],t):i=null,this.changeCurrentLayout(i,e)}drawBaseLayout(){!this.width||!this.height||(this.c.clearRect(0,0,this.width,this.height),this.bgOriginX=this.bgOriginY=0,this.baseLayoutCache?this.c.putImageData(this.baseLayoutCache,0,0):(this.drawLayout(this.layers.base,0,[]),this.baseLayoutCache=this.c.getImageData(0,0,this.width*this.ratio,this.height*this.ratio)))}draw(){this.drawBaseLayout(),this.layers.current||this.drawHoverHighlight(this.layers.base);const t=this.layers.current?this.animationSource?this.animationTarget?1:1-this.animationBlend:this.animationBlend:0;if(this.layers.current){const[e,i,s,n]=this.layers.base.box;this.c.globalAlpha=.6*(!this.layers.current||!this.animationSource?1:t),this.c.fillStyle=this.palette.bg,this.c.fillRect(e,i,s,n),this.c.globalAlpha=1}if(this.layers.previous&&this.drawLayout(this.layers.previous,1,[this.layers.current]),this.layers.current){const[e,i,s,n]=this.layers.current.box,a=this.c.getTransform(),r=Math.sqrt(a.a*a.d);this.c.save(),this.c.shadowColor=this.palette.shadow,this.c.shadowBlur=r*(30*t),this.c.shadowOffsetX=r*(2*this.width),this.c.shadowOffsetY=r*(2*this.height+15*t),this.c.fillRect(e-2*this.width,i-2*this.height,s,n),this.c.restore(),this.bgOriginX=this.currentOriginX,this.bgOriginY=this.currentOriginY,this.drawLayout(this.layers.current,0,[]),this.drawHoverHighlight(this.layers.current)}}tick(){const t=this.animationBlend,e=this.currentNode;this.animationBlend=(D()-this.animationStart)/(this.options.animateDuration??_.animateDuration),this.animationBlend<0||this.animationBlend>1?(this.currentNode=this.animationTarget,this.layers.previous=void 0,this.animationBlend=1):(this.animationBlend=1-this.animationBlend,this.animationBlend*=this.animationBlend*this.animationBlend,this.animationBlend=1-this.animationBlend,this.invalidate()),(this.animationBlend!==t||this.currentNode!==e)&&this.updateCurrentLayout(),this.draw()}resize(){this.baseLayoutCache=void 0;const t=this.width,e=this.height;this.width=Math.min(this.el.clientWidth,1600),this.height=Math.max(Math.round(this.width/2),innerHeight-200),(this.width!==t||this.height!==e||!this.layers.base)&&(this.layers.base=Y([this.root],0,0,this.width-1,this.height-1)[0],this.updateCurrentLayout()),super.resize()}*iterateNodeToDraw(t,e,i){const s=t.node,[n,a,r,c]=t.box;let d=(s===this.hoveredNode?1:0)|(t===this.animationTarget?2:0);if(e===1)for(const m of i){if(!m)continue;const[u,p,v,g]=m.box;if(n>=u&&a>=p&&n+r<=u+v&&a+c<=p+g){e=2;break}}for(const m of t.children)d|=yield*this.iterateNodeToDraw(m,e,i);return e!==2&&(yield t),d}drawHoverHighlight(t){const e=this.iterateNodeToDraw(t,0,[]),i=this.c.globalCompositeOperation;for(;;){const s=e.next();if(s.done){this.c.globalCompositeOperation=i;return}const n=s.value.node;if(this.hoveredNode===n){this.c.globalCompositeOperation="overlay";const[a,r,c,d]=s.value.box;this.c.fillStyle=this.palette.hover,this.c.fillRect(a,r,c,d)}}}drawNodeBackground(t,e,i){const s=this.iterateNodeToDraw(t,e,i);for(;;){const n=s.next();if(n.done)return n.value;const[a,r,c,d]=n.value.box;this.c.fillStyle=$(this.getColor(n.value.node)||this.palette.fallback,this.c,this.bgOriginX,this.bgOriginY,1),n.value.children.length?(this.c.fillRect(a,r,c,z),this.c.fillRect(a,r+d-A,c,A),this.c.fillRect(a,r+z,A,d-C),this.c.fillRect(a+c-A,r+z,A,d-C)):this.c.fillRect(a,r,c,d)}}drawLayout(t,e,i){this.drawNodeBackground(t,e,i),this.drawNodeForeground(t,e,i)}drawNodeForeground(t,e,i){const s=this.iterateNodeToDraw(t,e,i);for(;;){const n=s.next();if(n.done)return;const a=n.value.node,[r,c,d,m]=n.value.box;if(lt(this.c,this.palette.stroke,r+.5,c+.5,d,m),m>=z){this.c.fillStyle=this.palette.text;const u=d-P,p=c+Math.round(C/2),[v,g]=this.textOverflowEllipsis(this.getText(a)||"",u);let w=r+Math.round((d-g)/2);const f=this.getText(a),N=this.getSubtext(a);if(v===f&&a.children.length){let M=N||"";M&&f&&(M=` - ${M}`);const[T,x]=this.textOverflowEllipsis(M,u-g);w=r+Math.round((d-g-x)/2),this.c.globalAlpha=.5,this.c.fillText(T,w+g,p),this.c.globalAlpha=1}if(this.c.fillText(v,w,p),m>C+16&&!a.children.length){const[M,T]=this.textOverflowEllipsis(N||"",u);this.c.globalAlpha=.5;const x=f?z:z/2+A;this.c.fillText(M,r+Math.round((d-T)/2),c+x+Math.round(m-C)/2),this.c.globalAlpha=1}}}}updateCurrentLayout(){const t=this.options.selectedPaddingRatio??.2;if(this.currentNode){const[e,i,s,n]=this.currentNode.box,a=e+s,r=i+n,c=Math.round(this.width*t/2),d=Math.round(this.height*t/2),m=this.width-c-1,u=this.height-d-1,p=this.animationTarget?this.animationBlend:1-this.animationBlend,v=Math.round(e+(c-e)*p),g=Math.round(i+(d-i)*p),w=Math.round(a+(m-a)*p),f=Math.round(r+(u-r)*p),N=M=>M-Math.floor(M/64-.5)*64;this.layers.current=Y([this.currentNode.node],v,g,w-v,f-g)[0],this.currentOriginX=N(-(e+a)/2)*(1-p)+(v+w)/2,this.currentOriginY=N(-(i+r)/2)*(1-p)+(g+f)/2}else this.layers.current=void 0,this.currentOriginX=0,this.currentOriginY=0}hitTestNode(t){const e=this.canvas.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top,n=(a,r)=>{for(const c of a){const[d,m,u,p]=c.box;if(i>=d&&s>=m&&i<d+u&&s<m+p)return n(c.children,!1)||(r?null:c)}return null};return this.layers.current?n([this.layers.current],!1):n([this.layers.base],!0)}updateHover(t){const e=this.hitTestNode(t);this.changeHoveredNode(e&&e.node),this.events.emit("hover",(e==null?void 0:e.node)||null,t)}changeHoveredNode(t){this.hoveredNode!==t&&(this.hoveredNode=t,this.canvas.style.cursor=t&&!t.children.length?"pointer":"auto",this.invalidate())}searchFor(t,e){for(const i of t){if(!i)continue;const s=i.node===e?i:this.searchFor(i.children,e);if(s)return s}return null}changeCurrentLayout(t,e=this.options.animate){this.animationTarget!==t&&(this.events.emit("select",(t==null?void 0:t.node)||null),this.layers.previous=t?this.layers.current:void 0,e&&(this.animationBlend=0,this.animationStart=D(),this.animationSource=this.currentNode),this.animationTarget=t,this.currentNode=t||this.searchFor([this.layers.base],this.currentNode.node),this.updateCurrentLayout(),this.invalidate())}}export{ct as CONSTANT_BOLD_FONT,V as CONSTANT_NORMAL_FONT,_ as DEFAULT_GRAPH_OPTIONS,xt as DEFAULT_PALETTE,At as Flamegraph,q as GraphBase,zt as Sunburst,Ct as Treemap,$ as colorToCanvasFill,Ot as colorToCssBackground,ft as createColorGetterFromMap,pt as createColorGetterSpectrum,at as getTreeMaxDepth,mt as hueAngleToColor,wt as normalizeTreeNode};