UNPKG

@anarock/nivo-arcs

Version:
3 lines (2 loc) 14.3 kB
import{animated as n,to as t,useTransition as e,useSpring as r}from"@react-spring/web";import{useTheme as i,radiansToDegrees as a,positionFromAngle as o,degreesToRadians as u,midAngle as l,useMotionConfig as s,usePropertyAccessor as d,textPropsByEngine as f,getDistance as c,getAngle as g}from"@anarock/nivo-core";import{jsx as p,jsxs as h}from"react/jsx-runtime";import{useMemo as v,createElement as A,useCallback as x}from"react";import{useInheritedColor as R}from"@anarock/nivo-colors";import{line as m,arc as y}from"d3-shape";function M(){return M=Object.assign?Object.assign.bind():function(n){for(var t=1;t<arguments.length;t++){var e=arguments[t];for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r])}return n},M.apply(this,arguments)}var k={pointerEvents:"none"},b=function(t){var e=t.label,r=t.style,a=i();return p(n.g,{transform:r.transform,opacity:r.progress,style:k,children:p(n.text,{textAnchor:"middle",dominantBaseline:"central",style:M({},a.labels.text,{fill:r.textColor}),children:e})})},C=function(n){var t=n%(2*Math.PI);return t<0&&(t+=2*Math.PI),t},L=function(n,t){return n.filter((function(n){return Math.abs(a(n.arc.endAngle-n.arc.startAngle))>=t}))},O=function(n,t,e,r,i){return["A",n,n,0,t,e,r,i].join(" ")},P=["startAngle","middleAngle","endAngle","innerRadius","centerRadius","outerRadius","pushIn","pushOut"],E={startAngle:{enter:function(n){return M({},n,{endAngle:n.startAngle})},update:function(n){return n},leave:function(n){return M({},n,{startAngle:n.endAngle})}},middleAngle:{enter:function(n){var t=n.startAngle+(n.endAngle-n.startAngle)/2;return M({},n,{startAngle:t,endAngle:t})},update:function(n){return n},leave:function(n){var t=n.startAngle+(n.endAngle-n.startAngle)/2;return M({},n,{startAngle:t,endAngle:t})}},endAngle:{enter:function(n){return M({},n,{startAngle:n.endAngle})},update:function(n){return n},leave:function(n){return M({},n,{endAngle:n.startAngle})}},innerRadius:{enter:function(n){return M({},n,{outerRadius:n.innerRadius})},update:function(n){return n},leave:function(n){return M({},n,{innerRadius:n.outerRadius})}},centerRadius:{enter:function(n){var t=n.innerRadius+(n.outerRadius-n.innerRadius)/2;return M({},n,{innerRadius:t,outerRadius:t})},update:function(n){return n},leave:function(n){var t=n.innerRadius+(n.outerRadius-n.innerRadius)/2;return M({},n,{innerRadius:t,outerRadius:t})}},outerRadius:{enter:function(n){return M({},n,{innerRadius:n.outerRadius})},update:function(n){return n},leave:function(n){return M({},n,{outerRadius:n.innerRadius})}},pushIn:{enter:function(n){return M({},n,{innerRadius:n.innerRadius-n.outerRadius+n.innerRadius,outerRadius:n.innerRadius})},update:function(n){return n},leave:function(n){return M({},n,{innerRadius:n.outerRadius,outerRadius:n.outerRadius+n.outerRadius-n.innerRadius})}},pushOut:{enter:function(n){return M({},n,{innerRadius:n.outerRadius,outerRadius:n.outerRadius+n.outerRadius-n.innerRadius})},update:function(n){return n},leave:function(n){return M({},n,{innerRadius:n.innerRadius-n.outerRadius+n.innerRadius,outerRadius:n.innerRadius})}}},I=function(n,t){return v((function(){var e=E[n];return{enter:function(n){return M({progress:0},e.enter(n.arc),t?t.enter(n):{})},update:function(n){return M({progress:1},e.update(n.arc),t?t.update(n):{})},leave:function(n){return M({progress:0},e.leave(n.arc),t?t.leave(n):{})}}}),[n,t])},T=function(n,t){var e=l(n)-Math.PI/2,r=n.innerRadius+(n.outerRadius-n.innerRadius)*t;return o(e,r)},j=function(n){return function(e,r,i,a){return t([e,r,i,a],(function(t,e,r,i){var a=T({startAngle:t,endAngle:e,innerRadius:r,outerRadius:i},n);return"translate("+a.x+","+a.y+")"}))}},W=function(n,t,r,i){void 0===t&&(t=.5),void 0===r&&(r="innerRadius");var a=s(),o=a.animate,u=a.config,l=I(r,i);return{transition:e(n,{keys:function(n){return n.id},initial:l.update,from:l.enter,enter:l.update,update:l.update,leave:l.leave,config:u,immediate:!o}),interpolate:j(t)}},S=function(n){var t=n.data,e=n.offset,r=void 0===e?.5:e,i=n.skipAngle,a=void 0===i?0:i,o=n.computeExtraProps,u=void 0===o?function(){return{}}:o;return v((function(){return L(t,a).map((function(n){var t=T(n.arc,r);return M({},u(n),{x:t.x,y:t.y,data:n})}))}),[t,r,a,u])},B=function(n){var t=n.center,e=n.data,r=n.transitionMode,o=n.label,u=n.radiusOffset,l=n.skipAngle,s=n.textColor,f=n.component,c=void 0===f?b:f,g=d(o),h=i(),x=R(s,h),m=v((function(){return e.filter((function(n){return Math.abs(a(n.arc.endAngle-n.arc.startAngle))>=l}))}),[e,l]),y=W(m,u,r),k=y.transition,C=y.interpolate,L=c;return p("g",{transform:"translate("+t[0]+","+t[1]+")",children:k((function(n,t){return A(L,{key:t.id,datum:t,label:g(t),style:M({},n,{transform:C(n.startAngle,n.endAngle,n.innerRadius,n.outerRadius),textColor:x(t)})})}))})},w=function(n,t,e){n.textAlign="center",n.textBaseline="middle",n.font=e.labels.text.fontSize+"px "+e.labels.text.fontFamily,t.forEach((function(t){n.fillStyle=t.textColor,n.fillText(""+t.label,t.x,t.y)}))},z=function(n){var t=n.data,e=n.offset,r=n.skipAngle,a=n.label,o=n.textColor,u=d(a),l=i(),s=R(o,l),f=x((function(n){return{label:u(n),textColor:s(n)}}),[u,s]);return S({data:t,offset:e,skipAngle:r,computeExtraProps:f})},F=b,G=function(t){var e=t.label,r=t.style,a=i();return h(n.g,{opacity:r.opacity,children:[p(n.path,{fill:"none",stroke:r.linkColor,strokeWidth:r.thickness,d:r.path}),p(n.text,{transform:r.textPosition,textAnchor:r.textAnchor,dominantBaseline:"central",style:M({},a.labels.text,{fill:r.textColor}),children:e})]})},q=function(n){var t=C(n.startAngle+(n.endAngle-n.startAngle)/2-Math.PI/2);return t<Math.PI/2||t>1.5*Math.PI?"start":"end"},D=function(n,t,e,r){var i,a,u=C(n.startAngle+(n.endAngle-n.startAngle)/2-Math.PI/2),l=o(u,n.outerRadius+t),s=o(u,n.outerRadius+t+e);return u<Math.PI/2||u>1.5*Math.PI?(i="after",a={x:s.x+r,y:s.y}):(i="before",a={x:s.x-r,y:s.y}),{side:i,points:[l,s,a]}},H=m().x((function(n){return n.x})).y((function(n){return n.y})),J=function(n,e,r,i,a,o,u){return t([n,e,r,i,a,o,u],(function(n,t,e,r,i,a,o){var u=D({startAngle:n,endAngle:t,innerRadius:e,outerRadius:r},i,a,o).points;return H(u)}))},K=function(n,e,r,i){return t([n,e,r,i],(function(n,t,e,r){return q({startAngle:n,endAngle:t,innerRadius:e,outerRadius:r})}))},N=function(n,e,r,i,a,o,u,l){return t([n,e,r,i,a,o,u,l],(function(n,t,e,r,i,a,o,u){var l=D({startAngle:n,endAngle:t,innerRadius:e,outerRadius:r},i,a,o),s=l.points,d=l.side,f=s[2];return"before"===d?f.x-=u:f.x+=u,"translate("+f.x+","+f.y+")"}))},Q=function(n){var t=n.data,r=n.offset,a=void 0===r?0:r,o=n.diagonalLength,u=n.straightLength,l=n.skipAngle,d=void 0===l?0:l,f=n.textOffset,c=n.linkColor,g=n.textColor,p=s(),h=p.animate,A=p.config,x=i(),m=R(c,x),y=R(g,x),M=function(n,t){return v((function(){return L(n,t)}),[n,t])}(t,d),k=function(n){var t=n.offset,e=n.diagonalLength,r=n.straightLength,i=n.textOffset,a=n.getLinkColor,o=n.getTextColor;return v((function(){return{enter:function(n){return{startAngle:n.arc.startAngle,endAngle:n.arc.endAngle,innerRadius:n.arc.innerRadius,outerRadius:n.arc.outerRadius,offset:t,diagonalLength:0,straightLength:0,textOffset:i,linkColor:a(n),textColor:o(n),opacity:0}},update:function(n){return{startAngle:n.arc.startAngle,endAngle:n.arc.endAngle,innerRadius:n.arc.innerRadius,outerRadius:n.arc.outerRadius,offset:t,diagonalLength:e,straightLength:r,textOffset:i,linkColor:a(n),textColor:o(n),opacity:1}},leave:function(n){return{startAngle:n.arc.startAngle,endAngle:n.arc.endAngle,innerRadius:n.arc.innerRadius,outerRadius:n.arc.outerRadius,offset:t,diagonalLength:0,straightLength:0,textOffset:i,linkColor:a(n),textColor:o(n),opacity:0}}}}),[e,r,i,a,o,t])}({offset:a,diagonalLength:o,straightLength:u,textOffset:f,getLinkColor:m,getTextColor:y});return{transition:e(M,{keys:function(n){return n.id},initial:k.update,from:k.enter,enter:k.update,update:k.update,leave:k.leave,config:A,immediate:!h}),interpolateLink:J,interpolateTextAnchor:K,interpolateTextPosition:N}},U=function(n){var t=n.center,e=n.data,r=n.label,i=n.skipAngle,a=n.offset,o=n.diagonalLength,u=n.straightLength,l=n.strokeWidth,s=n.textOffset,f=n.textColor,c=n.linkColor,g=n.component,h=void 0===g?G:g,v=d(r),x=Q({data:e,skipAngle:i,offset:a,diagonalLength:o,straightLength:u,textOffset:s,linkColor:c,textColor:f}),R=x.transition,m=x.interpolateLink,y=x.interpolateTextAnchor,k=x.interpolateTextPosition,b=h;return p("g",{transform:"translate("+t[0]+","+t[1]+")",children:R((function(n,t){return A(b,{key:t.id,datum:t,label:v(t),style:M({},n,{thickness:l,path:m(n.startAngle,n.endAngle,n.innerRadius,n.outerRadius,n.offset,n.diagonalLength,n.straightLength),textAnchor:y(n.startAngle,n.endAngle,n.innerRadius,n.outerRadius),textPosition:k(n.startAngle,n.endAngle,n.innerRadius,n.outerRadius,n.offset,n.diagonalLength,n.straightLength,n.textOffset)})})}))})},V=function(n,t,e,r){n.textBaseline="middle",n.font=e.labels.text.fontSize+"px "+e.labels.text.fontFamily,t.forEach((function(t){n.fillStyle=t.textColor,n.textAlign=f.canvas.align[t.textAnchor],n.fillText(""+t.label,t.x,t.y),n.beginPath(),n.strokeStyle=t.linkColor,n.lineWidth=r,t.points.forEach((function(t,e){0===e?n.moveTo(t.x,t.y):n.lineTo(t.x,t.y)})),n.stroke()}))},X=function(n){var t=n.data,e=n.skipAngle,r=void 0===e?0:e,i=n.offset,o=void 0===i?.5:i,u=n.diagonalLength,l=n.straightLength,s=n.computeExtraProps,d=void 0===s?function(){return{}}:s,f=v((function(){return t.filter((function(n){return Math.abs(a(n.arc.endAngle-n.arc.startAngle))>=r})).map((function(n){return M({},D(n.arc,o,u,l),{data:n})}))}),[t,r,o,u,l]);return v((function(){return f.map((function(n){return M({},d(n),n)}))}),[f,d])},Y=function(n){var t=n.data,e=n.skipAngle,r=n.offset,a=n.diagonalLength,o=n.straightLength,u=n.textOffset,l=void 0===u?0:u,s=n.label,f=n.linkColor,c=n.textColor,g=d(s),p=i(),h=R(f,p),v=R(c,p),A=x((function(n){var t,e={x:n.points[2].x,y:n.points[2].y};return"before"===n.side?(e.x-=l,t="end"):(e.x+=l,t="start"),M({},e,{label:g(n.data),linkColor:h(n.data),textAnchor:t,textColor:v(n.data)})}),[g,h,v,l]);return X({data:t,skipAngle:e,offset:r,diagonalLength:a,straightLength:o,computeExtraProps:A})},Z=G,$=["animated"],_=function(e){var r=e.animated,i=function(n,t){if(null==n)return{};var e,r,i={},a=Object.keys(n);for(r=0;r<a.length;r++)e=a[r],t.indexOf(e)>=0||(i[e]=n[e]);return i}(e,$);return p(n.path,M({d:t([r.radius,r.startAngle,r.endAngle],(function(n,t,e){return function(n,t,e){var r=Math.min(t,e),i=Math.max(t,e),a=o(u(i),n),l=o(u(r),n);if(i-r>=360){var s=o(u(r+180),n);return["M "+a.x+" "+a.y,O(n,1,1,s.x,s.y),"M "+a.x+" "+a.y,O(n,1,0,s.x,s.y)].join(" ")}var d=i-r<=180?0:1;return["M "+a.x+" "+a.y,O(n,d,0,l.x,l.y)].join(" ")}(n,t,e)}))},i))},nn=function(t){var e=t.datum,r=t.style,i=t.onClick,a=t.onMouseEnter,o=t.onMouseMove,u=t.onMouseLeave,l=x((function(n){return null==i?void 0:i(e,n)}),[i,e]),s=x((function(n){return null==a?void 0:a(e,n)}),[a,e]),d=x((function(n){return null==o?void 0:o(e,n)}),[o,e]),f=x((function(n){return null==u?void 0:u(e,n)}),[u,e]);return p(n.path,{d:r.path,opacity:r.opacity,fill:e.fill||r.color,stroke:r.borderColor,strokeWidth:r.borderWidth,onClick:i?l:void 0,onMouseEnter:a?s:void 0,onMouseMove:o?d:void 0,onMouseLeave:u?f:void 0})},tn=function(n,e,r,i,a){return t([n,e,r,i],(function(n,t,e,r){return a({startAngle:n,endAngle:t,innerRadius:Math.max(0,e),outerRadius:Math.max(0,r)})}))},en=function(n,t,r){void 0===t&&(t="innerRadius");var i=s(),a=i.animate,o=i.config,u=I(t,r);return{transition:e(n,{keys:function(n){return n.id},initial:u.update,from:u.enter,enter:u.update,update:u.update,leave:u.leave,config:o,immediate:!a}),interpolate:tn}},rn=function(n){var t=n.center,e=n.data,r=n.arcGenerator,a=n.borderWidth,o=n.borderColor,u=n.onClick,l=n.onMouseEnter,s=n.onMouseMove,d=n.onMouseLeave,f=n.transitionMode,c=n.component,g=void 0===c?nn:c,h=i(),v=R(o,h),x=en(e,f,{enter:function(n){return{opacity:0,color:n.color,borderColor:v(n)}},update:function(n){return{opacity:1,color:n.color,borderColor:v(n)}},leave:function(n){return{opacity:0,color:n.color,borderColor:v(n)}}}),m=x.transition,y=x.interpolate,k=g;return p("g",{transform:"translate("+t[0]+","+t[1]+")",children:m((function(n,t){return A(k,{key:t.id,datum:t,style:M({},n,{borderWidth:a,path:y(n.startAngle,n.endAngle,n.innerRadius,n.outerRadius,r)}),onClick:u,onMouseEnter:l,onMouseMove:s,onMouseLeave:d})}))})},an=function(n,t,e,r,i,a){void 0===a&&(a=!0);var l=[],s=o(u(r),e);l.push([s.x,s.y]);var d=o(u(i),e);l.push([d.x,d.y]);for(var f=Math.round(Math.min(r,i));f<=Math.round(Math.max(r,i));f++)if(f%90==0){var c=o(u(f),e);l.push([c.x,c.y])}l=l.map((function(e){var r=e[0],i=e[1];return[n+r,t+i]})),a&&l.push([n,t]);var g=l.map((function(n){return n[0]})),p=l.map((function(n){return n[1]})),h=Math.min.apply(Math,g),v=Math.max.apply(Math,g),A=Math.min.apply(Math,p);return{points:l,x:h,y:A,width:v-h,height:Math.max.apply(Math,p)-A}},on=function(n,t,e,r,i,a){var o=c(i,a,n,t);return o<e&&o>r},un=function(n,t,e,r,i,a,o){if(on(n,t,e,r,a,o)){var u=g(a,o,n,t);return i.find((function(n){var t=n.startAngle,e=n.endAngle;return u>=t&&u<e}))}},ln=function(n,t){var e=s(),i=e.animate,a=e.config,o=r({startAngle:n.arc.startAngle,endAngle:n.arc.endAngle,innerRadius:n.arc.innerRadius,outerRadius:n.arc.outerRadius,config:a,immediate:!i});return M({},o,{path:tn(o.startAngle,o.endAngle,o.innerRadius,o.outerRadius,t)})},sn=function(n){var t=void 0===n?{}:n,e=t.cornerRadius,r=void 0===e?0:e,i=t.padAngle,a=void 0===i?0:i;return v((function(){return y().innerRadius((function(n){return n.innerRadius})).outerRadius((function(n){return n.outerRadius})).cornerRadius(r).padAngle(a)}),[r,a])};export{F as ArcLabelComponent,B as ArcLabelsLayer,_ as ArcLine,Z as ArcLinkLabelComponent,U as ArcLinkLabelsLayer,nn as ArcShape,rn as ArcsLayer,E as arcTransitionModeById,P as arcTransitionModes,an as computeArcBoundingBox,T as computeArcCenter,D as computeArcLink,q as computeArcLinkTextAnchor,w as drawCanvasArcLabels,V as drawCanvasArcLinkLabels,un as findArcUnderCursor,tn as interpolateArc,j as interpolateArcCenter,on as isCursorInRing,ln as useAnimatedArc,S as useArcCenters,W as useArcCentersTransition,sn as useArcGenerator,z as useArcLabels,Y as useArcLinkLabels,Q as useArcLinkLabelsTransition,X as useArcLinks,I as useArcTransitionMode,en as useArcsTransition}; //# sourceMappingURL=nivo-arcs.es.js.map