@spotlightjs/spotlight 3.0.1 → 3.0.2

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