UNPKG

@nivo/annotations

Version:
3 lines (2 loc) 8.4 kB
import{isValidElement as t,useMemo as n,createElement as i}from"react";import o from"lodash/filter.js";import e from"lodash/isNumber.js";import a from"lodash/omit.js";import{normalizeAngleDegrees as r,radiansToDegrees as s,positionFromAngle as l,degreesToRadians as u,useMotionConfig as h,useAnimatedPath as d}from"@nivo/core";import{useSpring as c,animated as f}from"@react-spring/web";import{useTheme as y}from"@nivo/theming";import{jsxs as x,Fragment as m,jsx as p}from"react/jsx-runtime";function g(){return g=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var i=arguments[n];for(var o in i)({}).hasOwnProperty.call(i,o)&&(t[o]=i[o])}return t},g.apply(null,arguments)}var k={dotSize:4,noteWidth:120,noteTextOffset:8,animate:!0},W=function(n){var i=typeof n;return t(n)||"string"===i||"function"===i||"object"===i},v=function(t){var n=typeof t;return"string"===n||"function"===n},b=function(t){return"circle"===t.type},w=function(t){return"dot"===t.type},z=function(t){return"rect"===t.type},P=function(t){var n=t.data,i=t.annotations,e=t.getPosition,r=t.getDimensions;return i.reduce((function(t,i){var s=i.offset||0;return[].concat(t,o(n,i.match).map((function(t){var n=e(t),o=r(t);return(b(i)||z(i))&&(o.size=o.size+2*s,o.width=o.width+2*s,o.height=o.height+2*s),g({},a(i,["match","offset"]),n,o,{size:i.size||o.size,datum:t})})))}),[])},C=function(t,n,i,o){var e=Math.atan2(o-n,i-t);return r(s(e))},S=function(t){var n,i,o=t.x,a=t.y,r=t.noteX,s=t.noteY,h=t.noteWidth,d=void 0===h?k.noteWidth:h,c=t.noteTextOffset,f=void 0===c?k.noteTextOffset:c;if(e(r))n=o+r;else{if(void 0===r.abs)throw new Error("noteX should be either a number or an object containing an 'abs' property");n=r.abs}if(e(s))i=a+s;else{if(void 0===s.abs)throw new Error("noteY should be either a number or an object containing an 'abs' property");i=s.abs}var y=o,x=a,m=C(o,a,n,i);if(b(t)){var p=l(u(m),t.size/2);y+=p.x,x+=p.y}if(z(t)){var g=Math.round((m+90)/45)%8;0===g&&(x-=t.height/2),1===g&&(y+=t.width/2,x-=t.height/2),2===g&&(y+=t.width/2),3===g&&(y+=t.width/2,x+=t.height/2),4===g&&(x+=t.height/2),5===g&&(y-=t.width/2,x+=t.height/2),6===g&&(y-=t.width/2),7===g&&(y-=t.width/2,x-=t.height/2)}var W=n,v=n;return(m+90)%360>180?(W-=d,v-=d):v+=d,{points:[[y,x],[n,i],[v,i]],text:[W,i-f],angle:m+90}},O=function(t){var i=t.data,o=t.annotations,e=t.getPosition,a=t.getDimensions;return n((function(){return P({data:i,annotations:o,getPosition:e,getDimensions:a})}),[i,o,e,a])},j=function(t){var i=t.annotations;return n((function(){return i.map((function(t){return g({},t,{computed:S(g({},t))})}))}),[i])},M=function(t){return n((function(){return S(t)}),[t])},T=function(t){var n=t.datum,o=t.x,e=t.y,r=t.note,s=y(),l=h(),u=l.animate,d=l.config,k=c({x:o,y:e,config:d,immediate:!u});return"function"==typeof r?i(r,{x:o,y:e,datum:n}):x(m,{children:[s.annotations.text.outlineWidth>0&&p(f.text,{x:k.x,y:k.y,style:g({},s.annotations.text,{strokeLinejoin:"round",strokeWidth:2*s.annotations.text.outlineWidth,stroke:s.annotations.text.outlineColor}),children:r}),p(f.text,{x:k.x,y:k.y,style:a(s.annotations.text,["outlineWidth","outlineColor"]),children:r})]})},E=function(t){var i=t.points,o=t.isOutline,e=void 0!==o&&o,a=y(),r=n((function(){var t=i[0];return i.slice(1).reduce((function(t,n){return t+" L"+n[0]+","+n[1]}),"M"+t[0]+","+t[1])}),[i]),s=d(r);if(e&&a.annotations.link.outlineWidth<=0)return null;var l=g({},a.annotations.link);return e&&(l.strokeLinecap="square",l.strokeWidth=a.annotations.link.strokeWidth+2*a.annotations.link.outlineWidth,l.stroke=a.annotations.link.outlineColor,l.opacity=a.annotations.link.outlineOpacity),p(f.path,{fill:"none",d:s,style:l})},I=function(t){var n=t.x,i=t.y,o=t.size,e=y(),a=h(),r=a.animate,s=a.config,l=c({x:n,y:i,radius:o/2,config:s,immediate:!r});return x(m,{children:[e.annotations.outline.outlineWidth>0&&p(f.circle,{cx:l.x,cy:l.y,r:l.radius,style:g({},e.annotations.outline,{fill:"none",strokeWidth:e.annotations.outline.strokeWidth+2*e.annotations.outline.outlineWidth,stroke:e.annotations.outline.outlineColor,opacity:e.annotations.outline.outlineOpacity})}),p(f.circle,{cx:l.x,cy:l.y,r:l.radius,style:e.annotations.outline})]})},D=function(t){var n=t.x,i=t.y,o=t.size,e=void 0===o?k.dotSize:o,a=y(),r=h(),s=r.animate,l=r.config,u=c({x:n,y:i,radius:e/2,config:l,immediate:!s});return x(m,{children:[a.annotations.outline.outlineWidth>0&&p(f.circle,{cx:u.x,cy:u.y,r:u.radius,style:g({},a.annotations.outline,{fill:"none",strokeWidth:2*a.annotations.outline.outlineWidth,stroke:a.annotations.outline.outlineColor,opacity:a.annotations.outline.outlineOpacity})}),p(f.circle,{cx:u.x,cy:u.y,r:u.radius,style:a.annotations.symbol})]})},L=function(t){var n=t.x,i=t.y,o=t.width,e=t.height,a=t.borderRadius,r=void 0===a?6:a,s=y(),l=h(),u=l.animate,d=l.config,k=c({x:n-o/2,y:i-e/2,width:o,height:e,config:d,immediate:!u});return x(m,{children:[s.annotations.outline.outlineWidth>0&&p(f.rect,{x:k.x,y:k.y,rx:r,ry:r,width:k.width,height:k.height,style:g({},s.annotations.outline,{fill:"none",strokeWidth:s.annotations.outline.strokeWidth+2*s.annotations.outline.outlineWidth,stroke:s.annotations.outline.outlineColor,opacity:s.annotations.outline.outlineOpacity})}),p(f.rect,{x:k.x,y:k.y,rx:r,ry:r,width:k.width,height:k.height,style:s.annotations.outline})]})},R=function(t){var n=t.datum,i=t.x,o=t.y,e=t.note,a=M(t);if(!W(e))throw new Error("note should be a valid react element");return x(m,{children:[p(E,{points:a.points,isOutline:!0}),b(t)&&p(I,{x:i,y:o,size:t.size}),w(t)&&p(D,{x:i,y:o,size:t.size}),z(t)&&p(L,{x:i,y:o,width:t.width,height:t.height,borderRadius:t.borderRadius}),p(E,{points:a.points}),p(T,{datum:n,x:a.text[0],y:a.text[1],note:e})]})},q=function(t,n){n.forEach((function(n,i){var o=n[0],e=n[1];0===i?t.moveTo(o,e):t.lineTo(o,e)}))},J=function(t,n){var i=n.annotations,o=n.theme;0!==i.length&&(t.save(),i.forEach((function(n){if(!v(n.note))throw new Error("note is invalid for canvas implementation");o.annotations.link.outlineWidth>0&&(t.lineCap="square",t.strokeStyle=o.annotations.link.outlineColor,t.lineWidth=o.annotations.link.strokeWidth+2*o.annotations.link.outlineWidth,t.beginPath(),q(t,n.computed.points),t.stroke(),t.lineCap="butt"),b(n)&&o.annotations.outline.outlineWidth>0&&(t.strokeStyle=o.annotations.outline.outlineColor,t.lineWidth=o.annotations.outline.strokeWidth+2*o.annotations.outline.outlineWidth,t.beginPath(),t.arc(n.x,n.y,n.size/2,0,2*Math.PI),t.stroke()),w(n)&&o.annotations.symbol.outlineWidth>0&&(t.strokeStyle=o.annotations.symbol.outlineColor,t.lineWidth=2*o.annotations.symbol.outlineWidth,t.beginPath(),t.arc(n.x,n.y,n.size/2,0,2*Math.PI),t.stroke()),z(n)&&o.annotations.outline.outlineWidth>0&&(t.strokeStyle=o.annotations.outline.outlineColor,t.lineWidth=o.annotations.outline.strokeWidth+2*o.annotations.outline.outlineWidth,t.beginPath(),t.rect(n.x-n.width/2,n.y-n.height/2,n.width,n.height),t.stroke()),t.strokeStyle=o.annotations.link.stroke,t.lineWidth=o.annotations.link.strokeWidth,t.beginPath(),q(t,n.computed.points),t.stroke(),b(n)&&(t.strokeStyle=o.annotations.outline.stroke,t.lineWidth=o.annotations.outline.strokeWidth,t.beginPath(),t.arc(n.x,n.y,n.size/2,0,2*Math.PI),t.stroke()),w(n)&&(t.fillStyle=o.annotations.symbol.fill,t.beginPath(),t.arc(n.x,n.y,n.size/2,0,2*Math.PI),t.fill()),z(n)&&(t.strokeStyle=o.annotations.outline.stroke,t.lineWidth=o.annotations.outline.strokeWidth,t.beginPath(),t.rect(n.x-n.width/2,n.y-n.height/2,n.width,n.height),t.stroke()),"function"==typeof n.note?n.note(t,{datum:n.datum,x:n.computed.text[0],y:n.computed.text[1],theme:o}):(t.font=o.annotations.text.fontSize+"px "+o.annotations.text.fontFamily,t.textAlign="left",t.textBaseline="alphabetic",t.fillStyle=o.annotations.text.fill,t.strokeStyle=o.annotations.text.outlineColor,t.lineWidth=2*o.annotations.text.outlineWidth,o.annotations.text.outlineWidth>0&&(t.lineJoin="round",t.strokeText(n.note,n.computed.text[0],n.computed.text[1]),t.lineJoin="miter"),t.fillText(n.note,n.computed.text[0],n.computed.text[1]))})),t.restore())};export{R as Annotation,P as bindAnnotations,S as computeAnnotation,k as defaultProps,C as getLinkAngle,v as isCanvasNote,b as isCircleAnnotation,w as isDotAnnotation,z as isRectAnnotation,W as isSvgNote,J as renderAnnotationsToCanvas,O as useAnnotations,M as useComputedAnnotation,j as useComputedAnnotations}; //# sourceMappingURL=nivo-annotations.mjs.map