chartformers 1.0.47 → 1.0.49
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.
- package/dist/chartformers.es.js +2 -2
- package/dist/chartformers.umd.js +1 -1
- package/dist/src/charts/circle-pack.d.ts +1 -1
- package/dist/src/charts/sankey.d.ts +1 -1
- package/dist/src/hooks/useD3.d.ts +0 -1
- package/dist/src/index.d.ts +2 -2
- package/dist/src/types.d.ts +0 -1
- package/package.json +1 -1
package/dist/chartformers.es.js
CHANGED
|
@@ -5255,10 +5255,10 @@ function Mf({ data: t, tooltipFormat: e }) {
|
|
|
5255
5255
|
}
|
|
5256
5256
|
export {
|
|
5257
5257
|
wf as BarChart,
|
|
5258
|
-
Mf as
|
|
5258
|
+
Mf as CirclePacks,
|
|
5259
5259
|
Af as GroupedBarChart,
|
|
5260
5260
|
Nf as PercentageBarChart,
|
|
5261
5261
|
kf as PieChart,
|
|
5262
|
-
Sf as
|
|
5262
|
+
Sf as Sankey,
|
|
5263
5263
|
$f as StackedBarChart
|
|
5264
5264
|
};
|
package/dist/chartformers.umd.js
CHANGED
|
@@ -33,4 +33,4 @@ React keys must be passed directly to JSX without using spread:
|
|
|
33
33
|
${q===W.barKey?it.rectLegendHovered:it.rectLegendNotHovered}`:`rect ${it.rect}`;let Se=_.selectAll(".serie").data(En,function(W){return W.key}).join(W=>W.append("g").attr("class","serie").attr("fill",function(ot){const I=$.current.findIndex(st=>st===ot.key)+e;return xt(I)}).style("opacity",ot=>A==="all"||ot.key===A?1:0).style("pointer-events",ot=>A==="all"||ot.key===A?"auto":"none"),W=>W.transition().duration(w).attr("fill",function(ot){const I=$.current.findIndex(st=>st===ot.key)+e;return xt(I)}).style("opacity",ot=>A==="all"||ot.key===A?1:0).style("pointer-events",ot=>A==="all"||ot.key===A?"auto":"none"),W=>W.transition().duration(w).style("opacity",0).attr("fill","grey").selectAll("rect").attr("y",H).attr("height",0).remove());const he=W=>{const at=ut(W.data.label+"")??0;if(A==="all"){const ot=T.indexOf(W.barKey)||0;return at+ot*(ut.bandwidth()/T.length)}return at},Gt=()=>A==="all"?ut.bandwidth()/T.length:ut.bandwidth(),Jt=W=>n==="vertical"?H-(ct(W[0])-ct(W[1])):ct(0),qt=W=>{const at=n==="vertical"?ct(W[0])-ct(W[1]):ct(W[1])-ct(W[0]);return isNaN(at)||at<0?0:at},Bt=W=>n==="vertical"?he(W):Jt(W),zt=W=>n==="vertical"?Gt():qt(W),Ct=W=>n==="vertical"?Jt(W):he(W),St=W=>n==="vertical"?qt(W):Gt();Se.selectAll("rect").data(W=>W,W=>W.data.label).join(W=>{let at;return at=W.append("rect").attr("class",Ae).attr("x",function(ot){return n==="vertical"?Bt(ot):0}).attr("width",function(ot){return n==="vertical"?A==="all"?ut.bandwidth()/T.length:ut.bandwidth():0}).attr("y",function(ot){return n==="vertical"?H:Ct(ot)}).attr("height",function(ot){return n==="vertical"?0:A==="all"?ut.bandwidth()/T.length:ut.bandwidth()}).transition().duration(w).attr("x",Bt).attr("width",zt).attr("height",St).attr("y",Ct),at},void 0,W=>W.attr("fill",Wt).transition().duration(w).attr("opacity",0).attr("height",0).attr("y",H+j.bottom).remove()).attr("class",Ae).transition().duration(w).attr("x",Bt).attr("width",zt).attr("height",St).attr("y",Ct),Se.selectAll("rect").on("mouseover",function(W,at){ht(n==="vertical"?".x-axis":".y-axis").selectAll("text").filter(k=>k===at.data.label).attr("class",(n==="vertical"?et:"")+" "+it.hoveredAxisText),b.style("opacity",1).select("p.title").text(at.data.label);const ot=at.data[at.barKey],{total:I}=at.data,st=ot/I*100;ae(".1f")(st)+"",b.select("p.top-label").text(at.barKey+" : "+$t(ot,r)),b.select("p.bottom-label").text(A==="all"?`Total : ${$t(I,r)}`:"~")}).on("touch",function(W,at){ht(".x-axis").selectAll("text").filter(ot=>ot===at.data.label).attr("class",et)}).on("mousemove",(W,at)=>{Sn(b,{e:W,svg:g,yScale:ct})}).on("mouseout",function(W,at){ht(n==="vertical"?".x-axis":".y-axis").selectAll("text").filter(ot=>ot===at.data.label).attr("class",n==="vertical"?et:""),b.style("opacity",0)})},[...R,B,d,T,q,O,n,E,r]);return z.jsxs("div",{ref:i,style:{width:s,height:o,display:"flex",flexDirection:"column"},children:[C?Be.createPortal(M,C):M,z.jsx("div",{ref:h,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:m,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${p} ${v}`,children:p>0&&z.jsxs("g",{className:"plot-area",children:[z.jsx("g",{className:"plot-rects"}),z.jsx("g",{className:`${n==="vertical"?it["value-axis"]:""} y-axis`}),z.jsx("g",{className:`${n==="horizontal"?it["value-axis"]:""} x-axis`})]})}),z.jsx(We,{pCount:3})]})})]})}function Nu({data:t,colorIdx:e=0,orientation:n="vertical",tooltipFormat:r}){const[i,a]=le(),{width:s,height:o}=a,[c,l]=ce(),{height:u}=l,[h,f]=ce(),{width:p,height:v}=f,[P,K]=G.useState(""),[E,F]=G.useState(!0),[A,S]=G.useState(!1),[O,V]=G.useState("all"),q=An(),Z=t;G.useEffect(()=>{V("all"),F(!0),S(!0)},[Z]);const B=750;G.useEffect(()=>{let N;return A&&(N=setTimeout(()=>{S(!1)},B+500)),()=>{clearTimeout(N)}},[A]);const X=[p,v,O,e],C=Mt(Z),L=C.length===0?[]:Object.keys(C[0]).filter(N=>N!=="label"&&N!=="total"),w=ke(L),R=p>576,d=Rt(N=>{if(A)return;const x=R?80:50,M=function(D){const j=it[R?"legend-container":"legend-container-sm"],Y=it[R?"legend-container-active":"legend-container-active-sm"],Q=it[R?"legend-container-inactive":"legend-container-inactive-sm"];return`
|
|
34
34
|
${O.includes(D)?O===D?Y:Q:j}
|
|
35
35
|
legend-item
|
|
36
|
-
`};N.selectAll(".legend-item").data([...L],D=>D).join(D=>{const j=D.append("div").attr("class",M).style("left",(Y,Q)=>`${Q*x}px`).style("top","-53px").style("opacity",0);return j.append("div").attr("class",it["legend-rect"]).style("background",Y=>{const Q=w.current.findIndex(tt=>tt===Y)+e;return xt(Q)}),j.append("span").attr("class",it["legend-label"]).text(Y=>Y),j.transition().duration(B).style("top","0px").style("opacity",1),j},D=>(D.attr("class",M).transition().duration(B).style("top","0px").style("left",(j,Y)=>`${Y*x}px`).style("opacity",1).select(`.${it["legend-rect"]}`).style("background",j=>{const Y=w.current.findIndex(Q=>Q===j)+e;return xt(Y)}),D.select(`.${it["legend-label"]}`).text(j=>j),D),D=>D.transition().duration(B).style("opacity",0).style("top","53px").remove().remove().remove()).on("mouseover",(D,j)=>{K(j)}).on("mouseout",function(D){K("")})},[...X,L,A]),T=z.jsxs("div",{ref:c,className:`${rt["controls-container"]} ${q?rt["fill-container"]:""}`,children:[z.jsxs("label",{className:rt["controls-label"],style:{paddingRight:"12px"},children:[z.jsx("input",{type:"checkbox",className:rt["controls-checkbox"],checked:E,onChange:N=>F(N.target.checked)}),"Percentage"]}),z.jsx("div",{ref:d,id:"stacked-barchart-legends",className:`${it["legends-container"]}`})]}),$=Rt(N=>{if(p===0||v===0||P!==""&&A)return;const x={top:20,right:30,bottom:30,left:40};C.forEach(function(I){I.total=L.reduce((st,k)=>{k in I||(I[k]=0);const nt=I[k];return st+(typeof nt=="number"?nt:Number(nt))},0)});const m=C.filter(I=>I?.total&&I.total>0),D=p-x.left-x.right,j=v-x.top-x.bottom,Y=N.select("svg"),Q=Y.node(),tt=Y.select(".plot-area").attr("transform","translate("+x.left+","+x.top+")"),H=Ye(N).style("opacity",0),y=!R&&n==="vertical"?it.rotatedAxisText:it.axisText,g=m.map(function(I){return I.label}),_=xe().domain(g).rangeRound(n==="vertical"?[0,D]:[j,0]).paddingInner(R?.4:.25).paddingOuter(.2).align(.2),b=Ht(C,I=>I.total),J=se().domain([0,E?1:b||0]).nice().range(n==="vertical"?[j,0]:[0,D]),et=xe().rangeRound([0,D]).paddingInner(.1).align(.2),lt=m.map(function(I){return I.label});et.domain(lt);const ut=[],dt=n==="vertical"?Xt(_).tickValues(_.domain()).tickSizeOuter(0):Xt(J).ticks(4,E?".0%":"s").tickSizeOuter(0).tickSize(-j);tt.select(".x-axis").attr("transform",`translate(0,${j})`).transition().duration(B).call(dt).selectAll("text").style("cursor","pointer").attr("dy",R?"1em":".20em").attr("dx",R?"0em":"-.8em").attr("class",y).selectAll(".tick").filter(I=>I===0).select("line").remove();const ct=Ht(C,I=>I.total),ft=se().domain([0,E?1:ct||0]).nice().range([j,0]),vt=n==="vertical"?Ut(J).ticks(4,E?".0%":"s").tickSize(-D):Ut(_).tickSizeOuter(0);tt.select(".y-axis").attr("transform","translate(0,0)").transition().duration(B).call(vt).selectAll(".tick").filter(I=>I===0).select("line").remove();const Yt=kn().order(cr).offset(_u),Ae=(E?Yt.keys(L)(m):kn().keys(L)(m)).map(I=>{const st=I.key,k=I.map(nt=>{const U=nt.data.label;return{...nt,key:`${st} - ${U}`,barKey:st}});return k.key=st,k});let Se=tt.selectAll(".serie").data(Ae,function(I){return I.key}).join(I=>I.append("g").attr("class","serie").attr("fill",function(k){const nt=w.current.findIndex(U=>U===k.key)+e;return xt(nt)}).style("opacity",1).style("pointer-events","auto"),I=>I.transition().duration(B).attr("fill",function(k){const nt=w.current.findIndex(U=>U===k.key)+e;return xt(nt)}).style("opacity",1).style("pointer-events","auto"),I=>I.transition().duration(B).style("opacity",0).attr("fill",Wt).selectAll("rect").attr("y",j).attr("height",0).remove());const he=I=>_(I.data.label+"")??0,Gt=_.bandwidth(),Jt=I=>J(n==="vertical"?I[1]:I[0]),qt=I=>{const st=n==="vertical"?J(I[0])-J(I[1]):J(I[1])-J(I[0]);return isNaN(st)||st<0?0:st},Bt=I=>n==="vertical"?he(I):Jt(I),zt=I=>n==="vertical"?Gt:qt(I),Ct=I=>n==="vertical"?Jt(I):he(I),St=I=>n==="vertical"?qt(I):Gt;function W(I){if(I.barKey===P)return"none";const st=zt(I),k=St(I);return L.indexOf(I.barKey)===L.length-1||I.barKey===O[0]?n==="vertical"?`${st+k} ${st} ${k}`:`${st+k+st}`:n==="vertical"?`${k} ${st}`:`${st} ${k}`}function at(I){const st=zt(I),k=L.indexOf(I.barKey)===L.length-1;return n==="vertical"?k?0:st*-1:0}const ot=I=>P!==""&&P===I.barKey?`rect ${it.rectLegendHovered}`:`rect ${it.rect}`;Se.selectAll("rect").data(I=>I,I=>I.data.label).join(I=>{let st;return st=I.append("rect").attr("class",ot).attr("x",function(k){return n==="vertical"?et(k.data.label+"")??0:J(0)}).attr("width",function(k){return n==="vertical"?_.bandwidth():0}).attr("y",function(k){if(n==="vertical"){if(!ut.includes(k.data.label+""))return j;const nt=J(k[1]),U=J(k[0])-J(k[1]),gt=isNaN(U)||U<0?0:U;return nt+gt}else return Ct(k)}).attr("height",function(k){return n==="vertical"?0:St(k)}).attr("stroke-dasharray",W).attr("stroke-dashoffset",at).transition().duration(B).attr("x",Bt).attr("width",zt).attr("height",St).attr("y",Ct),st},void 0,I=>I.transition().duration(B).attr("opacity",0).attr("height",0).attr("y",j).remove()).attr("class",ot).attr("stroke-dasharray",W).attr("stroke-dashoffset",at).transition().duration(B).attr("x",Bt).attr("width",zt).attr("height",St).attr("y",Ct),Se.selectAll("rect").on("mouseover",function(I,st){ht(".x-axis").selectAll("text").filter(_t=>_t===st.data.name).attr("class",y+" "+rt.hoveredAxisText),H.style("opacity",1).select("p.title").text(st.data.label);const k=st.data[st.barKey]||0,nt=st.data.total||0,U=k/nt*100,gt=ae(".1f")(U)+"%";H.select("p.top-label").text(st.barKey+" : "+(E?gt:$t(k,r))),H.select("p.bottom-label").text(E?`(${$t(k,r)} of ${$t(nt,r)})`:`Total : ${$t(nt,r)}`)}).on("touch",function(I,st){ht(".x-axis").selectAll("text").filter(k=>k===st.data.label).attr("class",y)}).on("mousemove",(I,st)=>{Sn(H,{e:I,svg:Q,yScale:ft})}).on("mouseout",function(I,st){ht(".x-axis").selectAll("text").filter(k=>k===st.data.name).attr("class",y),H.style("opacity",0)})},[...X,C,L,E,P,n,A,r]);return z.jsxs("div",{ref:i,style:{width:s,height:o,display:"flex",flexDirection:"column"},children:[q?Be.createPortal(T,q):T,z.jsx("div",{ref:h,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:$,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${p} ${v}`,children:z.jsxs("g",{className:"plot-area",children:[z.jsx("g",{className:"plot-rects"}),z.jsx("g",{className:`${n==="vertical"?it["value-axis"]:""} y-axis`}),z.jsx("g",{className:`${n==="horizontal"?it["value-axis"]:""} x-axis`})]})}),z.jsx(We,{pCount:3})]})})]})}function Ki(t,e){let n;if(e===void 0)for(const r of t)r!=null&&(n<r||n===void 0&&r>=r)&&(n=r);else{let r=-1;for(let i of t)(i=e(i,++r,t))!=null&&(n<i||n===void 0&&i>=i)&&(n=i)}return n}function Mu(t,e){let n;if(e===void 0)for(const r of t)r!=null&&(n>r||n===void 0&&r>=r)&&(n=r);else{let r=-1;for(let i of t)(i=e(i,++r,t))!=null&&(n>i||n===void 0&&i>=i)&&(n=i)}return n}function ur(t,e){let n=0;if(e===void 0)for(let r of t)(r=+r)&&(n+=r);else{let r=-1;for(let i of t)(i=+e(i,++r,t))&&(n+=i)}return n}function $u(t,e){return t.sourceLinks.length?t.depth:e-1}function Mn(t){return function(){return t}}function Gi(t,e){return $n(t.source,e.source)||t.index-e.index}function Ji(t,e){return $n(t.target,e.target)||t.index-e.index}function $n(t,e){return t.y0-e.y0}function fr(t){return t.value}function Eu(t){return t.index}function Tu(t){return t.nodes}function Ru(t){return t.links}function qi(t,e){const n=t.get(e);if(!n)throw new Error("missing: "+e);return n}function Zi({nodes:t}){for(const e of t){let n=e.y0,r=n;for(const i of e.sourceLinks)i.y0=n+i.width/2,n+=i.width;for(const i of e.targetLinks)i.y1=r+i.width/2,r+=i.width}}function Cu(){let t=0,e=0,n=1,r=1,i=24,a=8,s,o=Eu,c=$u,l,u,h=Tu,f=Ru,p=6;function v(){const d={nodes:h.apply(null,arguments),links:f.apply(null,arguments)};return P(d),K(d),E(d),F(d),O(d),Zi(d),d}v.update=function(d){return Zi(d),d},v.nodeId=function(d){return arguments.length?(o=typeof d=="function"?d:Mn(d),v):o},v.nodeAlign=function(d){return arguments.length?(c=typeof d=="function"?d:Mn(d),v):c},v.nodeSort=function(d){return arguments.length?(l=d,v):l},v.nodeWidth=function(d){return arguments.length?(i=+d,v):i},v.nodePadding=function(d){return arguments.length?(a=s=+d,v):a},v.nodes=function(d){return arguments.length?(h=typeof d=="function"?d:Mn(d),v):h},v.links=function(d){return arguments.length?(f=typeof d=="function"?d:Mn(d),v):f},v.linkSort=function(d){return arguments.length?(u=d,v):u},v.size=function(d){return arguments.length?(t=e=0,n=+d[0],r=+d[1],v):[n-t,r-e]},v.extent=function(d){return arguments.length?(t=+d[0][0],n=+d[1][0],e=+d[0][1],r=+d[1][1],v):[[t,e],[n,r]]},v.iterations=function(d){return arguments.length?(p=+d,v):p};function P({nodes:d,links:T}){for(const[N,x]of d.entries())x.index=N,x.sourceLinks=[],x.targetLinks=[];const $=new Map(d.map((N,x)=>[o(N,x,d),N]));for(const[N,x]of T.entries()){x.index=N;let{source:M,target:m}=x;typeof M!="object"&&(M=x.source=qi($,M)),typeof m!="object"&&(m=x.target=qi($,m)),M.sourceLinks.push(x),m.targetLinks.push(x)}if(u!=null)for(const{sourceLinks:N,targetLinks:x}of d)N.sort(u),x.sort(u)}function K({nodes:d}){for(const T of d)T.value=T.fixedValue===void 0?Math.max(ur(T.sourceLinks,fr),ur(T.targetLinks,fr)):T.fixedValue}function E({nodes:d}){const T=d.length;let $=new Set(d),N=new Set,x=0;for(;$.size;){for(const M of $){M.depth=x;for(const{target:m}of M.sourceLinks)N.add(m)}if(++x>T)throw new Error("circular link");$=N,N=new Set}}function F({nodes:d}){const T=d.length;let $=new Set(d),N=new Set,x=0;for(;$.size;){for(const M of $){M.height=x;for(const{source:m}of M.targetLinks)N.add(m)}if(++x>T)throw new Error("circular link");$=N,N=new Set}}function A({nodes:d}){const T=Ki(d,x=>x.depth)+1,$=(n-t-i)/(T-1),N=new Array(T);for(const x of d){const M=Math.max(0,Math.min(T-1,Math.floor(c.call(null,x,T))));x.layer=M,x.x0=t+M*$,x.x1=x.x0+i,N[M]?N[M].push(x):N[M]=[x]}if(l)for(const x of N)x.sort(l);return N}function S(d){const T=Mu(d,$=>(r-e-($.length-1)*s)/ur($,fr));for(const $ of d){let N=e;for(const x of $){x.y0=N,x.y1=N+x.value*T,N=x.y1+s;for(const M of x.sourceLinks)M.width=M.value*T}N=(r-N+s)/($.length+1);for(let x=0;x<$.length;++x){const M=$[x];M.y0+=N*(x+1),M.y1+=N*(x+1)}L($)}}function O(d){const T=A(d);s=Math.min(a,(r-e)/(Ki(T,$=>$.length)-1)),S(T);for(let $=0;$<p;++$){const N=Math.pow(.99,$),x=Math.max(1-N,($+1)/p);q(T,N,x),V(T,N,x)}}function V(d,T,$){for(let N=1,x=d.length;N<x;++N){const M=d[N];for(const m of M){let D=0,j=0;for(const{source:Q,value:tt}of m.targetLinks){let H=tt*(m.layer-Q.layer);D+=w(Q,m)*H,j+=H}if(!(j>0))continue;let Y=(D/j-m.y0)*T;m.y0+=Y,m.y1+=Y,C(m)}l===void 0&&M.sort($n),Z(M,$)}}function q(d,T,$){for(let N=d.length,x=N-2;x>=0;--x){const M=d[x];for(const m of M){let D=0,j=0;for(const{target:Q,value:tt}of m.sourceLinks){let H=tt*(Q.layer-m.layer);D+=R(m,Q)*H,j+=H}if(!(j>0))continue;let Y=(D/j-m.y0)*T;m.y0+=Y,m.y1+=Y,C(m)}l===void 0&&M.sort($n),Z(M,$)}}function Z(d,T){const $=d.length>>1,N=d[$];X(d,N.y0-s,$-1,T),B(d,N.y1+s,$+1,T),X(d,r,d.length-1,T),B(d,e,0,T)}function B(d,T,$,N){for(;$<d.length;++$){const x=d[$],M=(T-x.y0)*N;M>1e-6&&(x.y0+=M,x.y1+=M),T=x.y1+s}}function X(d,T,$,N){for(;$>=0;--$){const x=d[$],M=(x.y1-T)*N;M>1e-6&&(x.y0-=M,x.y1-=M),T=x.y0-s}}function C({sourceLinks:d,targetLinks:T}){if(u===void 0){for(const{source:{sourceLinks:$}}of T)$.sort(Ji);for(const{target:{targetLinks:$}}of d)$.sort(Gi)}}function L(d){if(u===void 0)for(const{sourceLinks:T,targetLinks:$}of d)T.sort(Ji),$.sort(Gi)}function w(d,T){let $=d.y0-(d.sourceLinks.length-1)*s/2;for(const{target:N,width:x}of d.sourceLinks){if(N===T)break;$+=x+s}for(const{source:N,width:x}of T.targetLinks){if(N===d)break;$-=x}return $}function R(d,T){let $=T.y0-(T.targetLinks.length-1)*s/2;for(const{source:N,width:x}of T.targetLinks){if(N===d)break;$+=x+s}for(const{target:N,width:x}of d.sourceLinks){if(N===T)break;$-=x}return $}return v}var hr=Math.PI,dr=2*hr,ue=1e-6,Lu=dr-ue;function pr(){this._x0=this._y0=this._x1=this._y1=null,this._=""}function Qi(){return new pr}pr.prototype=Qi.prototype={constructor:pr,moveTo:function(t,e){this._+="M"+(this._x0=this._x1=+t)+","+(this._y0=this._y1=+e)},closePath:function(){this._x1!==null&&(this._x1=this._x0,this._y1=this._y0,this._+="Z")},lineTo:function(t,e){this._+="L"+(this._x1=+t)+","+(this._y1=+e)},quadraticCurveTo:function(t,e,n,r){this._+="Q"+ +t+","+ +e+","+(this._x1=+n)+","+(this._y1=+r)},bezierCurveTo:function(t,e,n,r,i,a){this._+="C"+ +t+","+ +e+","+ +n+","+ +r+","+(this._x1=+i)+","+(this._y1=+a)},arcTo:function(t,e,n,r,i){t=+t,e=+e,n=+n,r=+r,i=+i;var a=this._x1,s=this._y1,o=n-t,c=r-e,l=a-t,u=s-e,h=l*l+u*u;if(i<0)throw new Error("negative radius: "+i);if(this._x1===null)this._+="M"+(this._x1=t)+","+(this._y1=e);else if(h>ue)if(!(Math.abs(u*o-c*l)>ue)||!i)this._+="L"+(this._x1=t)+","+(this._y1=e);else{var f=n-a,p=r-s,v=o*o+c*c,P=f*f+p*p,K=Math.sqrt(v),E=Math.sqrt(h),F=i*Math.tan((hr-Math.acos((v+h-P)/(2*K*E)))/2),A=F/E,S=F/K;Math.abs(A-1)>ue&&(this._+="L"+(t+A*l)+","+(e+A*u)),this._+="A"+i+","+i+",0,0,"+ +(u*f>l*p)+","+(this._x1=t+S*o)+","+(this._y1=e+S*c)}},arc:function(t,e,n,r,i,a){t=+t,e=+e,n=+n,a=!!a;var s=n*Math.cos(r),o=n*Math.sin(r),c=t+s,l=e+o,u=1^a,h=a?r-i:i-r;if(n<0)throw new Error("negative radius: "+n);this._x1===null?this._+="M"+c+","+l:(Math.abs(this._x1-c)>ue||Math.abs(this._y1-l)>ue)&&(this._+="L"+c+","+l),n&&(h<0&&(h=h%dr+dr),h>Lu?this._+="A"+n+","+n+",0,1,"+u+","+(t-s)+","+(e-o)+"A"+n+","+n+",0,1,"+u+","+(this._x1=c)+","+(this._y1=l):h>ue&&(this._+="A"+n+","+n+",0,"+ +(h>=hr)+","+u+","+(this._x1=t+n*Math.cos(i))+","+(this._y1=e+n*Math.sin(i))))},rect:function(t,e,n,r){this._+="M"+(this._x0=this._x1=+t)+","+(this._y0=this._y1=+e)+"h"+ +n+"v"+ +r+"h"+-n+"Z"},toString:function(){return this._}};function ta(t){return function(){return t}}function Du(t){return t[0]}function Pu(t){return t[1]}var ju=Array.prototype.slice;function Iu(t){return t.source}function zu(t){return t.target}function Hu(t){var e=Iu,n=zu,r=Du,i=Pu,a=null;function s(){var o,c=ju.call(arguments),l=e.apply(this,c),u=n.apply(this,c);if(a||(a=o=Qi()),t(a,+r.apply(this,(c[0]=l,c)),+i.apply(this,c),+r.apply(this,(c[0]=u,c)),+i.apply(this,c)),o)return a=null,o+""||null}return s.source=function(o){return arguments.length?(e=o,s):e},s.target=function(o){return arguments.length?(n=o,s):n},s.x=function(o){return arguments.length?(r=typeof o=="function"?o:ta(+o),s):r},s.y=function(o){return arguments.length?(i=typeof o=="function"?o:ta(+o),s):i},s.context=function(o){return arguments.length?(a=o??null,s):a},s}function Ou(t,e,n,r,i){t.moveTo(e,n),t.bezierCurveTo(e=(e+r)/2,n,e,i,r,i)}function Fu(){return Hu(Ou)}function Vu(t){return[t.source.x1,t.y0]}function Wu(t){return[t.target.x0,t.y1]}function ea(){return Fu().source(Vu).target(Wu)}const na={sankeyEnergyLink:"_sankeyEnergyLink_10fud_285",sankeyLabel:"_sankeyLabel_10fud_323"};function Yu({data:t,tooltipFormat:e}){const[n,r]=G.useState(null),[i,a]=G.useState(!1),[s,o]=G.useState(!1),c=G.useRef(!0),l=G.useRef(!0),u=G.useRef("data"),[h,f]=le(),{width:p,height:v}=f,P=ke(n?n.nodes.map(A=>A.name):[]);G.useEffect(()=>{r(A=>{const S=A===null?[]:A.nodes.map(V=>V.name),O=t.nodes.map(V=>V.name);return c.current=O.every(V=>!S.includes(V)),A!==null&&(l.current=!1),u.current="data",t}),s&&o(!1),i&&a(!1)},[t]),G.useEffect(()=>{p!==0&&v!==0&&(u.current="dimension")},[p,v]);const K=p<=768,E=1e3,F=Rt(A=>{if(!n)return;const S=p,O=v;if(S===0||O===0)return;const V={top:30,right:20,bottom:20,left:20},q=O-(V.top+V.bottom),Z=S-(V.left+V.right),B=q,X=Z,C=n.links.map(y=>({...y})),L=n.nodes.map(y=>({...y}));C.forEach(function(y){const g=n.nodes[y.source].name,_=n.nodes[y.target].name,b=g+" → "+_;y.sourceName=g,y.targetName=_,y.id=b});const w=A.select("svg");w.node();const R=w.select(".plot-area").attr("transform","translate("+V.left+","+V.top+")"),d=Ye(A).style("opacity",0),T=y=>{const g=y.targetLinks?.reduce((b,J)=>b+J.value,0)??0,_=y.sourceLinks?.reduce((b,J)=>b+J.value,0)??0;return{enteringValue:g,exitingValue:_}},N=Cu().nodeSort(s?(y,g)=>{const{enteringValue:_,exitingValue:b}=T(y),{enteringValue:J,exitingValue:et}=T(g);return Math.max(_,b)-Math.max(J,et)}:null).linkSort(i?(y,g)=>y.value-g.value:null).nodeWidth(X<=540?8:X>540&&X<=768?12:15).nodePadding(X<=540?5:8).extent([[0,0],[X,B]])({nodes:L.map(y=>Object.assign({},y)),links:C.map(y=>Object.assign({},y))}),{nodes:x,links:M}=N;R.selectAll("linearGradient").remove();const m=R.selectAll("linearGradient").data(M).join("linearGradient").attr("id",(y,g)=>g.toString()).attr("gradientUnits","userSpaceOnUse").attr("x1",y=>y.source.x0).attr("x2",y=>y.target.x0);m.append("stop").attr("offset","0%").attr("stop-color",y=>{const g=P.current.findIndex(_=>_===y.sourceName);return xt(g,!1)}),m.append("stop").attr("offset","100%").attr("stop-color",y=>{const g=P.current.findIndex(_=>_===y.targetName);return xt(g,!1)});const D=y=>{const g=y.source,_=y.target,b=Math.abs(_.depth-g.depth);return X*1.5*b},j=y=>D(y)+" "+D(y),Y=y=>!c.current||u.current!=="data"&&!l.current?0:y.target.depth*E;R.selectAll(".link").data(M,y=>y.id).join(y=>y.append("path").attr("class",`link ${na.sankeyEnergyLink}`).attr("d",ea()).style("stroke",function(g){return`url(#${m.filter(J=>J.sourceName===g.sourceName&&J.targetName===g.targetName).node()?.id})`}).attr("stroke-dasharray",j).attr("stroke-dashoffset",D).attr("stroke-width",g=>Math.max(1,g.width)).transition().duration(E).delay(function(g){return c.current?Y(g):E}).attr("stroke-dashoffset",0).on("end",function(){ht(this).attr("stroke-dasharray","none")}),y=>(y.attr("stroke-width",g=>Math.max(1,g.width||0)).transition().duration(E).delay(Y).attr("d",ea()).attr("stroke-dashoffset",0).on("end",function(){ht(this).attr("stroke-dasharray","none")}),y),y=>c.current?y.remove():y.transition().duration(E/4).style("opacity",0).remove()).on("mouseover",(y,g)=>{R.selectAll("path.link").filter(_=>_.id!==g.id).style("stroke","#1f2937").style("stroke-opacity",.05),R.selectAll("text.label").filter(_=>{const b=_;return b.name!==g.sourceName&&b.name!==g.targetName}).style("opacity",0),d.style("opacity",1),d.select("p.title").text(g.id+$t(g.value,e)),d.select("p.top-label").style("display","none"),d.select("p.bottom-label").style("display","none")}).on("mousemove",(y,g)=>{Ui(y,d)}).on("mouseout",(y,g)=>{d.style("opacity",0),R.selectAll("path.link").style("stroke",function(_){const b=_;return`url(#${m.filter(lt=>lt.sourceName===b.sourceName&<.targetName===b.targetName).node()?.id})`}).style("stroke-opacity",.5).style("fill","none").attr("class",`link ${rt.sankeyEnergyLink}`),R.selectAll("text.label").style("opacity",1)});const Q=y=>!c.current||y.depth===0||u.current!=="data"&&!l.current?0:y.depth*E+E/4,tt=y=>{const{enteringValue:g,exitingValue:_}=T(y);return{nodeState:y.sourceLinks?.length===0&&y.targetLinks?.length===0?"stray node":y.sourceLinks?.length===0?"leaf node":y.targetLinks?.length===0?"source node":g>_?"surplus":g<_?"minus":"balanced",enteringValue:g,exitingValue:_}},H=y=>{const{nodeState:g,enteringValue:_,exitingValue:b}=tt(y);return{enteringValue:_,exitingValue:b,nodeState:g,stateColor:g==="surplus"?"#4ade80":g==="minus"?"#f87171":"#e7e7e7"}};R.selectAll("rect.node").data(x,(y=>y.name)).join(y=>y.append("rect").attr("class",`node ${rt.baseNode}`).attr("x",g=>g.x0).attr("y",g=>g.y0).attr("height",g=>c.current?Math.abs(g.y1-g.y0):0).attr("width",g=>c.current?0:g.x1-g.x0).attr("opacity",0).attr("stroke-width",2.5).transition().duration(E).delay(Q).attr("fill",g=>{const _=P.current.findIndex(b=>b===g.name);return xt(_,!1)}).attr("opacity",1).attr("width",function(g){return g.x1-g.x0}),void 0,y=>c.current?y.remove():y.transition().duration(E/4).style("opacity",0).remove()).on("mouseover",(y,g)=>{R.selectAll("path.link").filter(ct=>{const ft=ct;return!(ft.sourceName===g.name||ft.targetName===g.name)}).style("stroke","#1f2937").style("stroke-opacity",.05);const _=g.sourceLinks?.map(ct=>ct.targetName)??[],J=[...g.targetLinks?.map(ct=>ct.sourceName)??[],..._,g.name];R.selectAll("text.label").filter(ct=>!J.includes(ct.name)).style("opacity",.0625);const{enteringValue:et,exitingValue:lt,nodeState:ut,stateColor:dt}=H(g);d.style("opacity",1),d.select("p.title").text(g.name+" :"),d.select("p.top-label").style("display","block").text("in "+$t(et,e)),d.select("p.bottom-label").style("display","block").text("out "+$t(lt,e)),d.select("p.small-text").style("display","block").text(`${ut}`).style("color",`${dt}`)}).on("mousemove",(y,g)=>{Ui(y,d)}).on("mouseout",(y,g)=>{d.style("opacity",0),d.select("p.small-text").style("display","none"),R.selectAll("path.link").style("stroke",function(et){const lt=et;return`url(#${m.filter(ct=>ct.sourceName===lt.sourceName&&ct.targetName===lt.targetName).node()?.id})`}).style("stroke-opacity",.5).style("fill","none").attr("class",`link ${rt.sankeyEnergyLink}`);const _=g.sourceLinks?.map(et=>et.targetName)??[],J=[...g.targetLinks?.map(et=>et.sourceName)??[],..._,g.name];R.selectAll("text.label").filter(et=>!J.includes(et.name)).style("opacity",1)}).transition().duration(E).delay(Q).attr("stroke-width",K?2:2.5).style("stroke",function(y){const{stateColor:g,nodeState:_}=H(y);return _==="surplus"||_==="minus"?g:"#52525b"}).attr("opacity",1).attr("x",y=>y.x0).attr("y",y=>y.y0).attr("height",y=>Math.abs(y.y1-y.y0)).attr("width",y=>y.x1-y.x0).attr("fill",y=>{const g=P.current.findIndex(_=>_===y.name);return xt(g,!1)}),R.selectAll("text.label").data(x,y=>y.name).join(y=>y.append("text").attr("class",`label ${na.sankeyLabel}`).attr("x",g=>g.x0<X/2?g.x1+6:g.x0-6).attr("y",g=>(g.y1+g.y0)/2).attr("dy","0.35em").attr("text-anchor",g=>g.x0<X/2?"start":"end").style("font-size",X<648?"12px":"16px").style("font-weight",X<648?"normal":"bold").style("stroke-width",X<648?"0px":"0.25px").style("stroke","#eff1f4").text(g=>g.name).attr("opacity",0),void 0,y=>y.remove()).style("font-size",X<648?"12px":"16px").style("font-weight",X<648?"normal":"bold").style("stroke-width",X<648?"0px":"0.25px").transition().duration(E).delay(Q).attr("x",y=>y.x0<X/2?y.x1+6:y.x0-6).attr("y",y=>(y.y1+y.y0)/2).attr("dy","0.35em").attr("text-anchor",y=>y.x0<X/2?"start":"end").attr("opacity",1)},[n,i,s,p,v,e]);return z.jsx("div",{ref:h,style:{width:p,height:v,display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:F,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column",position:"relative"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${p} ${v}`,children:z.jsx("g",{className:"plot-area"})}),z.jsxs("div",{style:{position:"absolute",right:"12px",top:"6px",display:"flex",alignItems:"center"},children:[z.jsxs("label",{className:rt["controls-label"],children:[z.jsx("input",{type:"checkbox",className:rt["controls-checkbox"],checked:i,onChange:A=>{const S=A.target.checked;S&&(u.current="sort link"),a(S)}}),"Sort link"]}),z.jsxs("label",{className:rt["controls-label"],children:[z.jsx("input",{type:"checkbox",className:rt["controls-checkbox"],checked:s,onChange:A=>{const S=A.target.checked;S&&(u.current="sort node"),o(S)}}),"Sort node"]})]}),z.jsx(We,{pCount:4})]})})}const fe={};function Bu({data:t,tooltipFormat:e}){const[n,r]=G.useState(null),[i,a]=G.useState({name:"",value:0}),[s,o]=G.useState({name:"",value:0}),c=G.useRef(!0),[l,u]=le(),{width:h,height:f}=u,p=G.useRef(null),v=G.useRef(null);G.useEffect(()=>{if(!v.current||!p.current)return;const E=p.current;function F(S,O){const V=Math.max(S.length,O.length);return function(q){let Z="";for(let B=0;B<V;B++)Z+=q<.5?S[B]??"":O[B]??"";return Z}}ht(E).transition().duration(250).tween("text",function(){const S=F(s.name,i.name);return function(O){E.textContent=S(O)}});const A=v.current;ht(A).transition().duration(250).ease(Jl).tween("text",function(){const S=Nt(s.value,i.value);return function(O){A.textContent=$t(Math.round(S(O)),e).toLocaleString()}})},[i,s]),G.useEffect(()=>{r(E=>(E!==null&&(c.current=!1),t))},[t]);const P=1e3,K=Rt(E=>{if(!n)return;const F=h,A=f,S=12,O=1.5;if(F===0||A===0)return;const V=25,q=A-V*2,Z=F-V*2,B=q,X=Z,C={name:"branches",children:n},L=Math.min(X,B),w=nr(C).sum(function(g){return g.value}).sort(function(g,_){return g.value-_.value}),R=Gc().size([L-20,L-20]).padding(2);let d=w,T=1,$=1;const N=R(w),x=N.descendants(),M=[N.x,N.y,N.r*2+V],m=ht("#tooltip").style("opacity",0),D=E.select("svg");D.node();const j=D.select(".plot-area").attr("transform","translate("+F/2+","+A/2+")"),Y=se().domain([-1,2]).range(["hsl(152,80%,80%)","hsl(228,30%,40%)"]).interpolate(Fo),Q=j.selectAll("circle").data(x,g=>g.data.name).join(g=>g.append("circle").attr("class",function(_){return _.parent?_.children?fe.node:`${fe.node} ${fe["node--leaf"]}`:`${fe.node} ${fe["node--root"]}`}).style("fill",function(_){return _.children?Y(_.depth):"#f0fdfa"}).style("cursor","pointer").transition().duration(P).attr("r",function(_){const b=L/M[2];return _.r*b}).attr("cx",function(_){const b=L/M[2];return(_.x-M[0])*b}).attr("cy",function(_){const b=L/M[2];return(_.y-M[1])*b}).style("stroke","#737373").style("stroke-width",O*$).style("fill",function(_){return _.children?Y(_.depth):"#f0fdfa"}),g=>g.transition().duration(P).attr("cx",function(_){const b=L/M[2];return(_.x-M[0])*b}).attr("cy",function(_){const b=L/M[2];return(_.y-M[1])*b}).attr("r",function(_){const b=L/M[2];return _.r*b}).style("stroke",function(_){return"#737373"}).style("stroke-width",O*$).style("fill",function(_){return _.children?Y(_.depth):"#f0fdfa"}),g=>g.transition().duration(P).style("opacity",0).remove()).on("mouseover",function(g,_){d.parent===_?tt.filter(function(b){return b.parent===d||this.style.display==="inline"}).style("font-size",S*$).style("fill-opacity",function(b){return b.parent===d?1:0}).style("display",function(b){return b.parent===d?"inline":"none"}):_===d?tt.filter(function(b){return b.parent===d||this.style.display==="inline"}).style("font-size",S*$).style("fill-opacity",function(b){return b.parent===d?1:0}).style("display",function(b){return b.parent===d?"inline":"none"}):(tt.filter(function(b){return b.data.name!=_.data.name}).style("fill-opacity",0).style("display","none"),tt.filter(function(b){return b.data.name===_.data.name}).style("fill-opacity",1).style("display","inline")),ht(this).style("stroke"),_!=w&&ht(this).style("stroke-width",O*$*2.5).style("stroke","#e4e4e7"),m.transition().duration(250).style("opacity",1),a(b=>(o(b),{name:_.data.name==="branches"?"Total":_.data.name,value:_.value?_.value:0}))}).on("mouseout",function(g,_){tt.filter(function(b){return b.parent===d||this.style.display==="inline"}).style("fill-opacity",function(b){return b.parent===d?1:0}).style("display",function(b){return b.parent===d?"inline":"none"}),ht(this).style("stroke-width",O*$).style("stroke",function(b){return"#737373"}),m.transition().duration(250).style("opacity",0)}).on("click",function(g,_){if(_===w){y();return}d!=_?H(_):y(),Q.style("stroke-width",O*$),g.stopPropagation()}),tt=j.selectAll("text").data(x,function(g){return g.data.name}).join(g=>g.append("text").attr("class",fe.circle_pack_label).text(function(_){return _.data.name}).style("font-size",12).style("text-anchor","middle").style("fill-opacity",0).style("stroke-opacity",0).style("display","none").style("pointer-events","none").style("text-shadow","0 1px 0 lightblue, 1px 0 0 lightblue, -1px 0 0 lightblue, 0 -1px 0 lightblue").transition().duration(P).attr("transform",function(_){const b=L/M[2];return"translate("+(_.x-M[0])*b+","+(_.y-M[1])*b+")"}).style("fill-opacity",function(_){return _.parent===w?1:0}).style("display",function(_){return _.parent===w?"inline":"none"}),g=>g.attr("class",fe.circle_pack_label).transition().duration(P).attr("transform",function(_){const b=L/M[2];return"translate("+(_.x-M[0])*b+","+(_.y-M[1])*b+")"}).style("fill-opacity",function(_){return _.parent===w?1:0}).style("display",function(_){return _.parent===w?"inline":"none"}),g=>g.transition().duration(P).style("opacity",0).remove());tt.raise();function H(g){d=g;const _=L/2-V,b=F/2,J=A/2,et=L/M[2],lt=g.r*et;$=lt/_,T=_/lt;const ut=(g.x-M[0])*et,dt=b-ut*T,ct=(g.y-M[0])*et,ft=J-ct*T;j.transition().duration(1e3).attr("transform","translate("+dt+","+ft+")scale("+T+")"),tt.style("font-size",S*$+"px").filter(function(vt){return vt.parent===d||this.style.display==="inline"}).style("fill-opacity",function(vt){return vt.parent===d?1:0}).style("display",function(vt){return vt.parent===d?"inline":"none"})}function y(){j.transition().duration(1e3).attr("transform","translate("+F/2+", "+A/2+")scale(1)"),d=w,T=1,$=1,tt.style("font-size",S*$+"px").filter(function(g){return g.parent===d||this.style.display==="inline"}).style("fill-opacity",function(g){return g.parent===d?1:0}).style("display",function(g){return g.parent===d?"inline":"none"})}},[n,h,f]);return z.jsx("div",{ref:l,style:{width:h,height:f,display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:K,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column",position:"relative"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${h} ${f}`,children:z.jsx("g",{className:"plot-area"})}),z.jsxs("div",{id:"tooltip",style:{position:"absolute",left:2,top:2,fontSize:12,fontWeight:600,display:"flex",alignItems:"center",gap:2},children:[z.jsx("p",{ref:p,id:"name",children:"Test tooltip"}),z.jsx("p",{ref:v,id:"value",children:"Test tooltip"})]})]})})}bt.BarChart=wu,bt.CirclePack=Bu,bt.GroupedBarChart=Su,bt.PercentageBarChart=Nu,bt.PieChart=ku,bt.SankeyChart=Yu,bt.StackedBarChart=Au,Object.defineProperty(bt,Symbol.toStringTag,{value:"Module"})}));
|
|
36
|
+
`};N.selectAll(".legend-item").data([...L],D=>D).join(D=>{const j=D.append("div").attr("class",M).style("left",(Y,Q)=>`${Q*x}px`).style("top","-53px").style("opacity",0);return j.append("div").attr("class",it["legend-rect"]).style("background",Y=>{const Q=w.current.findIndex(tt=>tt===Y)+e;return xt(Q)}),j.append("span").attr("class",it["legend-label"]).text(Y=>Y),j.transition().duration(B).style("top","0px").style("opacity",1),j},D=>(D.attr("class",M).transition().duration(B).style("top","0px").style("left",(j,Y)=>`${Y*x}px`).style("opacity",1).select(`.${it["legend-rect"]}`).style("background",j=>{const Y=w.current.findIndex(Q=>Q===j)+e;return xt(Y)}),D.select(`.${it["legend-label"]}`).text(j=>j),D),D=>D.transition().duration(B).style("opacity",0).style("top","53px").remove().remove().remove()).on("mouseover",(D,j)=>{K(j)}).on("mouseout",function(D){K("")})},[...X,L,A]),T=z.jsxs("div",{ref:c,className:`${rt["controls-container"]} ${q?rt["fill-container"]:""}`,children:[z.jsxs("label",{className:rt["controls-label"],style:{paddingRight:"12px"},children:[z.jsx("input",{type:"checkbox",className:rt["controls-checkbox"],checked:E,onChange:N=>F(N.target.checked)}),"Percentage"]}),z.jsx("div",{ref:d,id:"stacked-barchart-legends",className:`${it["legends-container"]}`})]}),$=Rt(N=>{if(p===0||v===0||P!==""&&A)return;const x={top:20,right:30,bottom:30,left:40};C.forEach(function(I){I.total=L.reduce((st,k)=>{k in I||(I[k]=0);const nt=I[k];return st+(typeof nt=="number"?nt:Number(nt))},0)});const m=C.filter(I=>I?.total&&I.total>0),D=p-x.left-x.right,j=v-x.top-x.bottom,Y=N.select("svg"),Q=Y.node(),tt=Y.select(".plot-area").attr("transform","translate("+x.left+","+x.top+")"),H=Ye(N).style("opacity",0),y=!R&&n==="vertical"?it.rotatedAxisText:it.axisText,g=m.map(function(I){return I.label}),_=xe().domain(g).rangeRound(n==="vertical"?[0,D]:[j,0]).paddingInner(R?.4:.25).paddingOuter(.2).align(.2),b=Ht(C,I=>I.total),J=se().domain([0,E?1:b||0]).nice().range(n==="vertical"?[j,0]:[0,D]),et=xe().rangeRound([0,D]).paddingInner(.1).align(.2),lt=m.map(function(I){return I.label});et.domain(lt);const ut=[],dt=n==="vertical"?Xt(_).tickValues(_.domain()).tickSizeOuter(0):Xt(J).ticks(4,E?".0%":"s").tickSizeOuter(0).tickSize(-j);tt.select(".x-axis").attr("transform",`translate(0,${j})`).transition().duration(B).call(dt).selectAll("text").style("cursor","pointer").attr("dy",R?"1em":".20em").attr("dx",R?"0em":"-.8em").attr("class",y).selectAll(".tick").filter(I=>I===0).select("line").remove();const ct=Ht(C,I=>I.total),ft=se().domain([0,E?1:ct||0]).nice().range([j,0]),vt=n==="vertical"?Ut(J).ticks(4,E?".0%":"s").tickSize(-D):Ut(_).tickSizeOuter(0);tt.select(".y-axis").attr("transform","translate(0,0)").transition().duration(B).call(vt).selectAll(".tick").filter(I=>I===0).select("line").remove();const Yt=kn().order(cr).offset(_u),Ae=(E?Yt.keys(L)(m):kn().keys(L)(m)).map(I=>{const st=I.key,k=I.map(nt=>{const U=nt.data.label;return{...nt,key:`${st} - ${U}`,barKey:st}});return k.key=st,k});let Se=tt.selectAll(".serie").data(Ae,function(I){return I.key}).join(I=>I.append("g").attr("class","serie").attr("fill",function(k){const nt=w.current.findIndex(U=>U===k.key)+e;return xt(nt)}).style("opacity",1).style("pointer-events","auto"),I=>I.transition().duration(B).attr("fill",function(k){const nt=w.current.findIndex(U=>U===k.key)+e;return xt(nt)}).style("opacity",1).style("pointer-events","auto"),I=>I.transition().duration(B).style("opacity",0).attr("fill",Wt).selectAll("rect").attr("y",j).attr("height",0).remove());const he=I=>_(I.data.label+"")??0,Gt=_.bandwidth(),Jt=I=>J(n==="vertical"?I[1]:I[0]),qt=I=>{const st=n==="vertical"?J(I[0])-J(I[1]):J(I[1])-J(I[0]);return isNaN(st)||st<0?0:st},Bt=I=>n==="vertical"?he(I):Jt(I),zt=I=>n==="vertical"?Gt:qt(I),Ct=I=>n==="vertical"?Jt(I):he(I),St=I=>n==="vertical"?qt(I):Gt;function W(I){if(I.barKey===P)return"none";const st=zt(I),k=St(I);return L.indexOf(I.barKey)===L.length-1||I.barKey===O[0]?n==="vertical"?`${st+k} ${st} ${k}`:`${st+k+st}`:n==="vertical"?`${k} ${st}`:`${st} ${k}`}function at(I){const st=zt(I),k=L.indexOf(I.barKey)===L.length-1;return n==="vertical"?k?0:st*-1:0}const ot=I=>P!==""&&P===I.barKey?`rect ${it.rectLegendHovered}`:`rect ${it.rect}`;Se.selectAll("rect").data(I=>I,I=>I.data.label).join(I=>{let st;return st=I.append("rect").attr("class",ot).attr("x",function(k){return n==="vertical"?et(k.data.label+"")??0:J(0)}).attr("width",function(k){return n==="vertical"?_.bandwidth():0}).attr("y",function(k){if(n==="vertical"){if(!ut.includes(k.data.label+""))return j;const nt=J(k[1]),U=J(k[0])-J(k[1]),gt=isNaN(U)||U<0?0:U;return nt+gt}else return Ct(k)}).attr("height",function(k){return n==="vertical"?0:St(k)}).attr("stroke-dasharray",W).attr("stroke-dashoffset",at).transition().duration(B).attr("x",Bt).attr("width",zt).attr("height",St).attr("y",Ct),st},void 0,I=>I.transition().duration(B).attr("opacity",0).attr("height",0).attr("y",j).remove()).attr("class",ot).attr("stroke-dasharray",W).attr("stroke-dashoffset",at).transition().duration(B).attr("x",Bt).attr("width",zt).attr("height",St).attr("y",Ct),Se.selectAll("rect").on("mouseover",function(I,st){ht(".x-axis").selectAll("text").filter(_t=>_t===st.data.name).attr("class",y+" "+rt.hoveredAxisText),H.style("opacity",1).select("p.title").text(st.data.label);const k=st.data[st.barKey]||0,nt=st.data.total||0,U=k/nt*100,gt=ae(".1f")(U)+"%";H.select("p.top-label").text(st.barKey+" : "+(E?gt:$t(k,r))),H.select("p.bottom-label").text(E?`(${$t(k,r)} of ${$t(nt,r)})`:`Total : ${$t(nt,r)}`)}).on("touch",function(I,st){ht(".x-axis").selectAll("text").filter(k=>k===st.data.label).attr("class",y)}).on("mousemove",(I,st)=>{Sn(H,{e:I,svg:Q,yScale:ft})}).on("mouseout",function(I,st){ht(".x-axis").selectAll("text").filter(k=>k===st.data.name).attr("class",y),H.style("opacity",0)})},[...X,C,L,E,P,n,A,r]);return z.jsxs("div",{ref:i,style:{width:s,height:o,display:"flex",flexDirection:"column"},children:[q?Be.createPortal(T,q):T,z.jsx("div",{ref:h,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:$,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${p} ${v}`,children:z.jsxs("g",{className:"plot-area",children:[z.jsx("g",{className:"plot-rects"}),z.jsx("g",{className:`${n==="vertical"?it["value-axis"]:""} y-axis`}),z.jsx("g",{className:`${n==="horizontal"?it["value-axis"]:""} x-axis`})]})}),z.jsx(We,{pCount:3})]})})]})}function Ki(t,e){let n;if(e===void 0)for(const r of t)r!=null&&(n<r||n===void 0&&r>=r)&&(n=r);else{let r=-1;for(let i of t)(i=e(i,++r,t))!=null&&(n<i||n===void 0&&i>=i)&&(n=i)}return n}function Mu(t,e){let n;if(e===void 0)for(const r of t)r!=null&&(n>r||n===void 0&&r>=r)&&(n=r);else{let r=-1;for(let i of t)(i=e(i,++r,t))!=null&&(n>i||n===void 0&&i>=i)&&(n=i)}return n}function ur(t,e){let n=0;if(e===void 0)for(let r of t)(r=+r)&&(n+=r);else{let r=-1;for(let i of t)(i=+e(i,++r,t))&&(n+=i)}return n}function $u(t,e){return t.sourceLinks.length?t.depth:e-1}function Mn(t){return function(){return t}}function Gi(t,e){return $n(t.source,e.source)||t.index-e.index}function Ji(t,e){return $n(t.target,e.target)||t.index-e.index}function $n(t,e){return t.y0-e.y0}function fr(t){return t.value}function Eu(t){return t.index}function Tu(t){return t.nodes}function Ru(t){return t.links}function qi(t,e){const n=t.get(e);if(!n)throw new Error("missing: "+e);return n}function Zi({nodes:t}){for(const e of t){let n=e.y0,r=n;for(const i of e.sourceLinks)i.y0=n+i.width/2,n+=i.width;for(const i of e.targetLinks)i.y1=r+i.width/2,r+=i.width}}function Cu(){let t=0,e=0,n=1,r=1,i=24,a=8,s,o=Eu,c=$u,l,u,h=Tu,f=Ru,p=6;function v(){const d={nodes:h.apply(null,arguments),links:f.apply(null,arguments)};return P(d),K(d),E(d),F(d),O(d),Zi(d),d}v.update=function(d){return Zi(d),d},v.nodeId=function(d){return arguments.length?(o=typeof d=="function"?d:Mn(d),v):o},v.nodeAlign=function(d){return arguments.length?(c=typeof d=="function"?d:Mn(d),v):c},v.nodeSort=function(d){return arguments.length?(l=d,v):l},v.nodeWidth=function(d){return arguments.length?(i=+d,v):i},v.nodePadding=function(d){return arguments.length?(a=s=+d,v):a},v.nodes=function(d){return arguments.length?(h=typeof d=="function"?d:Mn(d),v):h},v.links=function(d){return arguments.length?(f=typeof d=="function"?d:Mn(d),v):f},v.linkSort=function(d){return arguments.length?(u=d,v):u},v.size=function(d){return arguments.length?(t=e=0,n=+d[0],r=+d[1],v):[n-t,r-e]},v.extent=function(d){return arguments.length?(t=+d[0][0],n=+d[1][0],e=+d[0][1],r=+d[1][1],v):[[t,e],[n,r]]},v.iterations=function(d){return arguments.length?(p=+d,v):p};function P({nodes:d,links:T}){for(const[N,x]of d.entries())x.index=N,x.sourceLinks=[],x.targetLinks=[];const $=new Map(d.map((N,x)=>[o(N,x,d),N]));for(const[N,x]of T.entries()){x.index=N;let{source:M,target:m}=x;typeof M!="object"&&(M=x.source=qi($,M)),typeof m!="object"&&(m=x.target=qi($,m)),M.sourceLinks.push(x),m.targetLinks.push(x)}if(u!=null)for(const{sourceLinks:N,targetLinks:x}of d)N.sort(u),x.sort(u)}function K({nodes:d}){for(const T of d)T.value=T.fixedValue===void 0?Math.max(ur(T.sourceLinks,fr),ur(T.targetLinks,fr)):T.fixedValue}function E({nodes:d}){const T=d.length;let $=new Set(d),N=new Set,x=0;for(;$.size;){for(const M of $){M.depth=x;for(const{target:m}of M.sourceLinks)N.add(m)}if(++x>T)throw new Error("circular link");$=N,N=new Set}}function F({nodes:d}){const T=d.length;let $=new Set(d),N=new Set,x=0;for(;$.size;){for(const M of $){M.height=x;for(const{source:m}of M.targetLinks)N.add(m)}if(++x>T)throw new Error("circular link");$=N,N=new Set}}function A({nodes:d}){const T=Ki(d,x=>x.depth)+1,$=(n-t-i)/(T-1),N=new Array(T);for(const x of d){const M=Math.max(0,Math.min(T-1,Math.floor(c.call(null,x,T))));x.layer=M,x.x0=t+M*$,x.x1=x.x0+i,N[M]?N[M].push(x):N[M]=[x]}if(l)for(const x of N)x.sort(l);return N}function S(d){const T=Mu(d,$=>(r-e-($.length-1)*s)/ur($,fr));for(const $ of d){let N=e;for(const x of $){x.y0=N,x.y1=N+x.value*T,N=x.y1+s;for(const M of x.sourceLinks)M.width=M.value*T}N=(r-N+s)/($.length+1);for(let x=0;x<$.length;++x){const M=$[x];M.y0+=N*(x+1),M.y1+=N*(x+1)}L($)}}function O(d){const T=A(d);s=Math.min(a,(r-e)/(Ki(T,$=>$.length)-1)),S(T);for(let $=0;$<p;++$){const N=Math.pow(.99,$),x=Math.max(1-N,($+1)/p);q(T,N,x),V(T,N,x)}}function V(d,T,$){for(let N=1,x=d.length;N<x;++N){const M=d[N];for(const m of M){let D=0,j=0;for(const{source:Q,value:tt}of m.targetLinks){let H=tt*(m.layer-Q.layer);D+=w(Q,m)*H,j+=H}if(!(j>0))continue;let Y=(D/j-m.y0)*T;m.y0+=Y,m.y1+=Y,C(m)}l===void 0&&M.sort($n),Z(M,$)}}function q(d,T,$){for(let N=d.length,x=N-2;x>=0;--x){const M=d[x];for(const m of M){let D=0,j=0;for(const{target:Q,value:tt}of m.sourceLinks){let H=tt*(Q.layer-m.layer);D+=R(m,Q)*H,j+=H}if(!(j>0))continue;let Y=(D/j-m.y0)*T;m.y0+=Y,m.y1+=Y,C(m)}l===void 0&&M.sort($n),Z(M,$)}}function Z(d,T){const $=d.length>>1,N=d[$];X(d,N.y0-s,$-1,T),B(d,N.y1+s,$+1,T),X(d,r,d.length-1,T),B(d,e,0,T)}function B(d,T,$,N){for(;$<d.length;++$){const x=d[$],M=(T-x.y0)*N;M>1e-6&&(x.y0+=M,x.y1+=M),T=x.y1+s}}function X(d,T,$,N){for(;$>=0;--$){const x=d[$],M=(x.y1-T)*N;M>1e-6&&(x.y0-=M,x.y1-=M),T=x.y0-s}}function C({sourceLinks:d,targetLinks:T}){if(u===void 0){for(const{source:{sourceLinks:$}}of T)$.sort(Ji);for(const{target:{targetLinks:$}}of d)$.sort(Gi)}}function L(d){if(u===void 0)for(const{sourceLinks:T,targetLinks:$}of d)T.sort(Ji),$.sort(Gi)}function w(d,T){let $=d.y0-(d.sourceLinks.length-1)*s/2;for(const{target:N,width:x}of d.sourceLinks){if(N===T)break;$+=x+s}for(const{source:N,width:x}of T.targetLinks){if(N===d)break;$-=x}return $}function R(d,T){let $=T.y0-(T.targetLinks.length-1)*s/2;for(const{source:N,width:x}of T.targetLinks){if(N===d)break;$+=x+s}for(const{target:N,width:x}of d.sourceLinks){if(N===T)break;$-=x}return $}return v}var hr=Math.PI,dr=2*hr,ue=1e-6,Lu=dr-ue;function pr(){this._x0=this._y0=this._x1=this._y1=null,this._=""}function Qi(){return new pr}pr.prototype=Qi.prototype={constructor:pr,moveTo:function(t,e){this._+="M"+(this._x0=this._x1=+t)+","+(this._y0=this._y1=+e)},closePath:function(){this._x1!==null&&(this._x1=this._x0,this._y1=this._y0,this._+="Z")},lineTo:function(t,e){this._+="L"+(this._x1=+t)+","+(this._y1=+e)},quadraticCurveTo:function(t,e,n,r){this._+="Q"+ +t+","+ +e+","+(this._x1=+n)+","+(this._y1=+r)},bezierCurveTo:function(t,e,n,r,i,a){this._+="C"+ +t+","+ +e+","+ +n+","+ +r+","+(this._x1=+i)+","+(this._y1=+a)},arcTo:function(t,e,n,r,i){t=+t,e=+e,n=+n,r=+r,i=+i;var a=this._x1,s=this._y1,o=n-t,c=r-e,l=a-t,u=s-e,h=l*l+u*u;if(i<0)throw new Error("negative radius: "+i);if(this._x1===null)this._+="M"+(this._x1=t)+","+(this._y1=e);else if(h>ue)if(!(Math.abs(u*o-c*l)>ue)||!i)this._+="L"+(this._x1=t)+","+(this._y1=e);else{var f=n-a,p=r-s,v=o*o+c*c,P=f*f+p*p,K=Math.sqrt(v),E=Math.sqrt(h),F=i*Math.tan((hr-Math.acos((v+h-P)/(2*K*E)))/2),A=F/E,S=F/K;Math.abs(A-1)>ue&&(this._+="L"+(t+A*l)+","+(e+A*u)),this._+="A"+i+","+i+",0,0,"+ +(u*f>l*p)+","+(this._x1=t+S*o)+","+(this._y1=e+S*c)}},arc:function(t,e,n,r,i,a){t=+t,e=+e,n=+n,a=!!a;var s=n*Math.cos(r),o=n*Math.sin(r),c=t+s,l=e+o,u=1^a,h=a?r-i:i-r;if(n<0)throw new Error("negative radius: "+n);this._x1===null?this._+="M"+c+","+l:(Math.abs(this._x1-c)>ue||Math.abs(this._y1-l)>ue)&&(this._+="L"+c+","+l),n&&(h<0&&(h=h%dr+dr),h>Lu?this._+="A"+n+","+n+",0,1,"+u+","+(t-s)+","+(e-o)+"A"+n+","+n+",0,1,"+u+","+(this._x1=c)+","+(this._y1=l):h>ue&&(this._+="A"+n+","+n+",0,"+ +(h>=hr)+","+u+","+(this._x1=t+n*Math.cos(i))+","+(this._y1=e+n*Math.sin(i))))},rect:function(t,e,n,r){this._+="M"+(this._x0=this._x1=+t)+","+(this._y0=this._y1=+e)+"h"+ +n+"v"+ +r+"h"+-n+"Z"},toString:function(){return this._}};function ta(t){return function(){return t}}function Du(t){return t[0]}function Pu(t){return t[1]}var ju=Array.prototype.slice;function Iu(t){return t.source}function zu(t){return t.target}function Hu(t){var e=Iu,n=zu,r=Du,i=Pu,a=null;function s(){var o,c=ju.call(arguments),l=e.apply(this,c),u=n.apply(this,c);if(a||(a=o=Qi()),t(a,+r.apply(this,(c[0]=l,c)),+i.apply(this,c),+r.apply(this,(c[0]=u,c)),+i.apply(this,c)),o)return a=null,o+""||null}return s.source=function(o){return arguments.length?(e=o,s):e},s.target=function(o){return arguments.length?(n=o,s):n},s.x=function(o){return arguments.length?(r=typeof o=="function"?o:ta(+o),s):r},s.y=function(o){return arguments.length?(i=typeof o=="function"?o:ta(+o),s):i},s.context=function(o){return arguments.length?(a=o??null,s):a},s}function Ou(t,e,n,r,i){t.moveTo(e,n),t.bezierCurveTo(e=(e+r)/2,n,e,i,r,i)}function Fu(){return Hu(Ou)}function Vu(t){return[t.source.x1,t.y0]}function Wu(t){return[t.target.x0,t.y1]}function ea(){return Fu().source(Vu).target(Wu)}const na={sankeyEnergyLink:"_sankeyEnergyLink_10fud_285",sankeyLabel:"_sankeyLabel_10fud_323"};function Yu({data:t,tooltipFormat:e}){const[n,r]=G.useState(null),[i,a]=G.useState(!1),[s,o]=G.useState(!1),c=G.useRef(!0),l=G.useRef(!0),u=G.useRef("data"),[h,f]=le(),{width:p,height:v}=f,P=ke(n?n.nodes.map(A=>A.name):[]);G.useEffect(()=>{r(A=>{const S=A===null?[]:A.nodes.map(V=>V.name),O=t.nodes.map(V=>V.name);return c.current=O.every(V=>!S.includes(V)),A!==null&&(l.current=!1),u.current="data",t}),s&&o(!1),i&&a(!1)},[t]),G.useEffect(()=>{p!==0&&v!==0&&(u.current="dimension")},[p,v]);const K=p<=768,E=1e3,F=Rt(A=>{if(!n)return;const S=p,O=v;if(S===0||O===0)return;const V={top:30,right:20,bottom:20,left:20},q=O-(V.top+V.bottom),Z=S-(V.left+V.right),B=q,X=Z,C=n.links.map(y=>({...y})),L=n.nodes.map(y=>({...y}));C.forEach(function(y){const g=n.nodes[y.source].name,_=n.nodes[y.target].name,b=g+" → "+_;y.sourceName=g,y.targetName=_,y.id=b});const w=A.select("svg");w.node();const R=w.select(".plot-area").attr("transform","translate("+V.left+","+V.top+")"),d=Ye(A).style("opacity",0),T=y=>{const g=y.targetLinks?.reduce((b,J)=>b+J.value,0)??0,_=y.sourceLinks?.reduce((b,J)=>b+J.value,0)??0;return{enteringValue:g,exitingValue:_}},N=Cu().nodeSort(s?(y,g)=>{const{enteringValue:_,exitingValue:b}=T(y),{enteringValue:J,exitingValue:et}=T(g);return Math.max(_,b)-Math.max(J,et)}:null).linkSort(i?(y,g)=>y.value-g.value:null).nodeWidth(X<=540?8:X>540&&X<=768?12:15).nodePadding(X<=540?5:8).extent([[0,0],[X,B]])({nodes:L.map(y=>Object.assign({},y)),links:C.map(y=>Object.assign({},y))}),{nodes:x,links:M}=N;R.selectAll("linearGradient").remove();const m=R.selectAll("linearGradient").data(M).join("linearGradient").attr("id",(y,g)=>g.toString()).attr("gradientUnits","userSpaceOnUse").attr("x1",y=>y.source.x0).attr("x2",y=>y.target.x0);m.append("stop").attr("offset","0%").attr("stop-color",y=>{const g=P.current.findIndex(_=>_===y.sourceName);return xt(g,!1)}),m.append("stop").attr("offset","100%").attr("stop-color",y=>{const g=P.current.findIndex(_=>_===y.targetName);return xt(g,!1)});const D=y=>{const g=y.source,_=y.target,b=Math.abs(_.depth-g.depth);return X*1.5*b},j=y=>D(y)+" "+D(y),Y=y=>!c.current||u.current!=="data"&&!l.current?0:y.target.depth*E;R.selectAll(".link").data(M,y=>y.id).join(y=>y.append("path").attr("class",`link ${na.sankeyEnergyLink}`).attr("d",ea()).style("stroke",function(g){return`url(#${m.filter(J=>J.sourceName===g.sourceName&&J.targetName===g.targetName).node()?.id})`}).attr("stroke-dasharray",j).attr("stroke-dashoffset",D).attr("stroke-width",g=>Math.max(1,g.width)).transition().duration(E).delay(function(g){return c.current?Y(g):E}).attr("stroke-dashoffset",0).on("end",function(){ht(this).attr("stroke-dasharray","none")}),y=>(y.attr("stroke-width",g=>Math.max(1,g.width||0)).transition().duration(E).delay(Y).attr("d",ea()).attr("stroke-dashoffset",0).on("end",function(){ht(this).attr("stroke-dasharray","none")}),y),y=>c.current?y.remove():y.transition().duration(E/4).style("opacity",0).remove()).on("mouseover",(y,g)=>{R.selectAll("path.link").filter(_=>_.id!==g.id).style("stroke","#1f2937").style("stroke-opacity",.05),R.selectAll("text.label").filter(_=>{const b=_;return b.name!==g.sourceName&&b.name!==g.targetName}).style("opacity",0),d.style("opacity",1),d.select("p.title").text(g.id+$t(g.value,e)),d.select("p.top-label").style("display","none"),d.select("p.bottom-label").style("display","none")}).on("mousemove",(y,g)=>{Ui(y,d)}).on("mouseout",(y,g)=>{d.style("opacity",0),R.selectAll("path.link").style("stroke",function(_){const b=_;return`url(#${m.filter(lt=>lt.sourceName===b.sourceName&<.targetName===b.targetName).node()?.id})`}).style("stroke-opacity",.5).style("fill","none").attr("class",`link ${rt.sankeyEnergyLink}`),R.selectAll("text.label").style("opacity",1)});const Q=y=>!c.current||y.depth===0||u.current!=="data"&&!l.current?0:y.depth*E+E/4,tt=y=>{const{enteringValue:g,exitingValue:_}=T(y);return{nodeState:y.sourceLinks?.length===0&&y.targetLinks?.length===0?"stray node":y.sourceLinks?.length===0?"leaf node":y.targetLinks?.length===0?"source node":g>_?"surplus":g<_?"minus":"balanced",enteringValue:g,exitingValue:_}},H=y=>{const{nodeState:g,enteringValue:_,exitingValue:b}=tt(y);return{enteringValue:_,exitingValue:b,nodeState:g,stateColor:g==="surplus"?"#4ade80":g==="minus"?"#f87171":"#e7e7e7"}};R.selectAll("rect.node").data(x,(y=>y.name)).join(y=>y.append("rect").attr("class",`node ${rt.baseNode}`).attr("x",g=>g.x0).attr("y",g=>g.y0).attr("height",g=>c.current?Math.abs(g.y1-g.y0):0).attr("width",g=>c.current?0:g.x1-g.x0).attr("opacity",0).attr("stroke-width",2.5).transition().duration(E).delay(Q).attr("fill",g=>{const _=P.current.findIndex(b=>b===g.name);return xt(_,!1)}).attr("opacity",1).attr("width",function(g){return g.x1-g.x0}),void 0,y=>c.current?y.remove():y.transition().duration(E/4).style("opacity",0).remove()).on("mouseover",(y,g)=>{R.selectAll("path.link").filter(ct=>{const ft=ct;return!(ft.sourceName===g.name||ft.targetName===g.name)}).style("stroke","#1f2937").style("stroke-opacity",.05);const _=g.sourceLinks?.map(ct=>ct.targetName)??[],J=[...g.targetLinks?.map(ct=>ct.sourceName)??[],..._,g.name];R.selectAll("text.label").filter(ct=>!J.includes(ct.name)).style("opacity",.0625);const{enteringValue:et,exitingValue:lt,nodeState:ut,stateColor:dt}=H(g);d.style("opacity",1),d.select("p.title").text(g.name+" :"),d.select("p.top-label").style("display","block").text("in "+$t(et,e)),d.select("p.bottom-label").style("display","block").text("out "+$t(lt,e)),d.select("p.small-text").style("display","block").text(`${ut}`).style("color",`${dt}`)}).on("mousemove",(y,g)=>{Ui(y,d)}).on("mouseout",(y,g)=>{d.style("opacity",0),d.select("p.small-text").style("display","none"),R.selectAll("path.link").style("stroke",function(et){const lt=et;return`url(#${m.filter(ct=>ct.sourceName===lt.sourceName&&ct.targetName===lt.targetName).node()?.id})`}).style("stroke-opacity",.5).style("fill","none").attr("class",`link ${rt.sankeyEnergyLink}`);const _=g.sourceLinks?.map(et=>et.targetName)??[],J=[...g.targetLinks?.map(et=>et.sourceName)??[],..._,g.name];R.selectAll("text.label").filter(et=>!J.includes(et.name)).style("opacity",1)}).transition().duration(E).delay(Q).attr("stroke-width",K?2:2.5).style("stroke",function(y){const{stateColor:g,nodeState:_}=H(y);return _==="surplus"||_==="minus"?g:"#52525b"}).attr("opacity",1).attr("x",y=>y.x0).attr("y",y=>y.y0).attr("height",y=>Math.abs(y.y1-y.y0)).attr("width",y=>y.x1-y.x0).attr("fill",y=>{const g=P.current.findIndex(_=>_===y.name);return xt(g,!1)}),R.selectAll("text.label").data(x,y=>y.name).join(y=>y.append("text").attr("class",`label ${na.sankeyLabel}`).attr("x",g=>g.x0<X/2?g.x1+6:g.x0-6).attr("y",g=>(g.y1+g.y0)/2).attr("dy","0.35em").attr("text-anchor",g=>g.x0<X/2?"start":"end").style("font-size",X<648?"12px":"16px").style("font-weight",X<648?"normal":"bold").style("stroke-width",X<648?"0px":"0.25px").style("stroke","#eff1f4").text(g=>g.name).attr("opacity",0),void 0,y=>y.remove()).style("font-size",X<648?"12px":"16px").style("font-weight",X<648?"normal":"bold").style("stroke-width",X<648?"0px":"0.25px").transition().duration(E).delay(Q).attr("x",y=>y.x0<X/2?y.x1+6:y.x0-6).attr("y",y=>(y.y1+y.y0)/2).attr("dy","0.35em").attr("text-anchor",y=>y.x0<X/2?"start":"end").attr("opacity",1)},[n,i,s,p,v,e]);return z.jsx("div",{ref:h,style:{width:p,height:v,display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:F,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column",position:"relative"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${p} ${v}`,children:z.jsx("g",{className:"plot-area"})}),z.jsxs("div",{style:{position:"absolute",right:"12px",top:"6px",display:"flex",alignItems:"center"},children:[z.jsxs("label",{className:rt["controls-label"],children:[z.jsx("input",{type:"checkbox",className:rt["controls-checkbox"],checked:i,onChange:A=>{const S=A.target.checked;S&&(u.current="sort link"),a(S)}}),"Sort link"]}),z.jsxs("label",{className:rt["controls-label"],children:[z.jsx("input",{type:"checkbox",className:rt["controls-checkbox"],checked:s,onChange:A=>{const S=A.target.checked;S&&(u.current="sort node"),o(S)}}),"Sort node"]})]}),z.jsx(We,{pCount:4})]})})}const fe={};function Bu({data:t,tooltipFormat:e}){const[n,r]=G.useState(null),[i,a]=G.useState({name:"",value:0}),[s,o]=G.useState({name:"",value:0}),c=G.useRef(!0),[l,u]=le(),{width:h,height:f}=u,p=G.useRef(null),v=G.useRef(null);G.useEffect(()=>{if(!v.current||!p.current)return;const E=p.current;function F(S,O){const V=Math.max(S.length,O.length);return function(q){let Z="";for(let B=0;B<V;B++)Z+=q<.5?S[B]??"":O[B]??"";return Z}}ht(E).transition().duration(250).tween("text",function(){const S=F(s.name,i.name);return function(O){E.textContent=S(O)}});const A=v.current;ht(A).transition().duration(250).ease(Jl).tween("text",function(){const S=Nt(s.value,i.value);return function(O){A.textContent=$t(Math.round(S(O)),e).toLocaleString()}})},[i,s]),G.useEffect(()=>{r(E=>(E!==null&&(c.current=!1),t))},[t]);const P=1e3,K=Rt(E=>{if(!n)return;const F=h,A=f,S=12,O=1.5;if(F===0||A===0)return;const V=25,q=A-V*2,Z=F-V*2,B=q,X=Z,C={name:"branches",children:n},L=Math.min(X,B),w=nr(C).sum(function(g){return g.value}).sort(function(g,_){return g.value-_.value}),R=Gc().size([L-20,L-20]).padding(2);let d=w,T=1,$=1;const N=R(w),x=N.descendants(),M=[N.x,N.y,N.r*2+V],m=ht("#tooltip").style("opacity",0),D=E.select("svg");D.node();const j=D.select(".plot-area").attr("transform","translate("+F/2+","+A/2+")"),Y=se().domain([-1,2]).range(["hsl(152,80%,80%)","hsl(228,30%,40%)"]).interpolate(Fo),Q=j.selectAll("circle").data(x,g=>g.data.name).join(g=>g.append("circle").attr("class",function(_){return _.parent?_.children?fe.node:`${fe.node} ${fe["node--leaf"]}`:`${fe.node} ${fe["node--root"]}`}).style("fill",function(_){return _.children?Y(_.depth):"#f0fdfa"}).style("cursor","pointer").transition().duration(P).attr("r",function(_){const b=L/M[2];return _.r*b}).attr("cx",function(_){const b=L/M[2];return(_.x-M[0])*b}).attr("cy",function(_){const b=L/M[2];return(_.y-M[1])*b}).style("stroke","#737373").style("stroke-width",O*$).style("fill",function(_){return _.children?Y(_.depth):"#f0fdfa"}),g=>g.transition().duration(P).attr("cx",function(_){const b=L/M[2];return(_.x-M[0])*b}).attr("cy",function(_){const b=L/M[2];return(_.y-M[1])*b}).attr("r",function(_){const b=L/M[2];return _.r*b}).style("stroke",function(_){return"#737373"}).style("stroke-width",O*$).style("fill",function(_){return _.children?Y(_.depth):"#f0fdfa"}),g=>g.transition().duration(P).style("opacity",0).remove()).on("mouseover",function(g,_){d.parent===_?tt.filter(function(b){return b.parent===d||this.style.display==="inline"}).style("font-size",S*$).style("fill-opacity",function(b){return b.parent===d?1:0}).style("display",function(b){return b.parent===d?"inline":"none"}):_===d?tt.filter(function(b){return b.parent===d||this.style.display==="inline"}).style("font-size",S*$).style("fill-opacity",function(b){return b.parent===d?1:0}).style("display",function(b){return b.parent===d?"inline":"none"}):(tt.filter(function(b){return b.data.name!=_.data.name}).style("fill-opacity",0).style("display","none"),tt.filter(function(b){return b.data.name===_.data.name}).style("fill-opacity",1).style("display","inline")),ht(this).style("stroke"),_!=w&&ht(this).style("stroke-width",O*$*2.5).style("stroke","#e4e4e7"),m.transition().duration(250).style("opacity",1),a(b=>(o(b),{name:_.data.name==="branches"?"Total":_.data.name,value:_.value?_.value:0}))}).on("mouseout",function(g,_){tt.filter(function(b){return b.parent===d||this.style.display==="inline"}).style("fill-opacity",function(b){return b.parent===d?1:0}).style("display",function(b){return b.parent===d?"inline":"none"}),ht(this).style("stroke-width",O*$).style("stroke",function(b){return"#737373"}),m.transition().duration(250).style("opacity",0)}).on("click",function(g,_){if(_===w){y();return}d!=_?H(_):y(),Q.style("stroke-width",O*$),g.stopPropagation()}),tt=j.selectAll("text").data(x,function(g){return g.data.name}).join(g=>g.append("text").attr("class",fe.circle_pack_label).text(function(_){return _.data.name}).style("font-size",12).style("text-anchor","middle").style("fill-opacity",0).style("stroke-opacity",0).style("display","none").style("pointer-events","none").style("text-shadow","0 1px 0 lightblue, 1px 0 0 lightblue, -1px 0 0 lightblue, 0 -1px 0 lightblue").transition().duration(P).attr("transform",function(_){const b=L/M[2];return"translate("+(_.x-M[0])*b+","+(_.y-M[1])*b+")"}).style("fill-opacity",function(_){return _.parent===w?1:0}).style("display",function(_){return _.parent===w?"inline":"none"}),g=>g.attr("class",fe.circle_pack_label).transition().duration(P).attr("transform",function(_){const b=L/M[2];return"translate("+(_.x-M[0])*b+","+(_.y-M[1])*b+")"}).style("fill-opacity",function(_){return _.parent===w?1:0}).style("display",function(_){return _.parent===w?"inline":"none"}),g=>g.transition().duration(P).style("opacity",0).remove());tt.raise();function H(g){d=g;const _=L/2-V,b=F/2,J=A/2,et=L/M[2],lt=g.r*et;$=lt/_,T=_/lt;const ut=(g.x-M[0])*et,dt=b-ut*T,ct=(g.y-M[0])*et,ft=J-ct*T;j.transition().duration(1e3).attr("transform","translate("+dt+","+ft+")scale("+T+")"),tt.style("font-size",S*$+"px").filter(function(vt){return vt.parent===d||this.style.display==="inline"}).style("fill-opacity",function(vt){return vt.parent===d?1:0}).style("display",function(vt){return vt.parent===d?"inline":"none"})}function y(){j.transition().duration(1e3).attr("transform","translate("+F/2+", "+A/2+")scale(1)"),d=w,T=1,$=1,tt.style("font-size",S*$+"px").filter(function(g){return g.parent===d||this.style.display==="inline"}).style("fill-opacity",function(g){return g.parent===d?1:0}).style("display",function(g){return g.parent===d?"inline":"none"})}},[n,h,f]);return z.jsx("div",{ref:l,style:{width:h,height:f,display:"flex",flexDirection:"column"},children:z.jsxs("div",{ref:K,className:`${rt["fill-container"]}`,style:{display:"flex",flexDirection:"column",position:"relative"},children:[z.jsx("svg",{className:`${rt["chart-svg"]} ${rt["fill-container"]}`,viewBox:`0 0 ${h} ${f}`,children:z.jsx("g",{className:"plot-area"})}),z.jsxs("div",{id:"tooltip",style:{position:"absolute",left:2,top:2,fontSize:12,fontWeight:600,display:"flex",alignItems:"center",gap:2},children:[z.jsx("p",{ref:p,id:"name",children:"Test tooltip"}),z.jsx("p",{ref:v,id:"value",children:"Test tooltip"})]})]})})}bt.BarChart=wu,bt.CirclePacks=Bu,bt.GroupedBarChart=Su,bt.PercentageBarChart=Nu,bt.PieChart=ku,bt.Sankey=Yu,bt.StackedBarChart=Au,Object.defineProperty(bt,Symbol.toStringTag,{value:"Module"})}));
|
|
@@ -4,5 +4,5 @@ type PackProps = {
|
|
|
4
4
|
data: circlePackData[];
|
|
5
5
|
tooltipFormat?: tooltipFormat;
|
|
6
6
|
};
|
|
7
|
-
export declare function
|
|
7
|
+
export declare function CirclePacks({ data, tooltipFormat }: PackProps): React.JSX.Element;
|
|
8
8
|
export {};
|
|
@@ -8,5 +8,5 @@ type SankeyProps = {
|
|
|
8
8
|
data: sankeyData;
|
|
9
9
|
tooltipFormat?: tooltipFormat;
|
|
10
10
|
};
|
|
11
|
-
export declare function
|
|
11
|
+
export declare function Sankey({ data, tooltipFormat }: SankeyProps): React.JSX.Element;
|
|
12
12
|
export {};
|
|
@@ -1,3 +1,2 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import * as d3 from "d3";
|
|
3
2
|
export declare const useD3: <T extends HTMLElement | SVGSVGElement>(renderChartFn: (selection: d3.Selection<T, unknown, null, undefined>) => void, dependencies: React.DependencyList | null) => React.RefObject<T | null>;
|
package/dist/src/index.d.ts
CHANGED
|
@@ -3,5 +3,5 @@ export { PieChart } from './charts/piechart';
|
|
|
3
3
|
export { StackedBarChart } from './charts/stacked-barchart-variants/stacked-barchart';
|
|
4
4
|
export { GroupedBarChart } from './charts/stacked-barchart-variants/grouped-barchart';
|
|
5
5
|
export { PercentageBarChart } from './charts/stacked-barchart-variants/percentage-barchart';
|
|
6
|
-
export {
|
|
7
|
-
export {
|
|
6
|
+
export { Sankey } from './charts/sankey';
|
|
7
|
+
export { CirclePacks } from './charts/circle-pack';
|
package/dist/src/types.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "chartformers",
|
|
3
3
|
"license": "SEE LICENSE IN LICENSE",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.49",
|
|
5
5
|
"description": "Animated React charting library powered by D3 with smooth data transitions and interactive features",
|
|
6
6
|
"author": {
|
|
7
7
|
"name": "Petrando Richard",
|