infinity-trend/umd/infinity-trend.min.js

A React component designed for effortlessly creating smooth, responsive trend and line graphs.

/*!
 * infinity-trend v0.0.3 - https://infinity-development.github.io/infinity-trend/
 * MIT Licensed
 */
!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("react")):"function"==typeof define&&define.amd?define(["react"],n):"object"==typeof exports?exports.Trend=n(require("react")):e.Trend=n(e.React)}(window,(function(e){return function(e){var n={};function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(t.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var a in e)t.d(r,a,function(n){return e[n]}.bind(null,a));return r},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=2)}([function(e,n,t){e.exports=t(3)()},function(n,t){n.exports=e},function(e,n,t){e.exports=t(5)},function(e,n,t){"use strict";var r=t(4);function a(){}function i(){}i.resetWarningCache=a,e.exports=function(){function e(e,n,t,a,i,o){if(o!==r){var u=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw u.name="Invariant Violation",u}}function n(){return e}e.isRequired=e;var t={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:n,element:e,elementType:e,instanceOf:n,node:e,objectOf:n,oneOf:n,oneOfType:n,shape:n,exact:n,checkPropTypes:i,resetWarningCache:a};return t.PropTypes=t,t}},function(e,n,t){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,n,t){"use strict";t.r(n),t.d(n,"default",(function(){return h}));var r=t(1),a=t.n(r),i=t(0),o=t.n(i);function u(){return(u=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)({}).hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(null,arguments)}var s,d=function(e){var n=e.value,t=e.min,r=e.max,a=e.scaleMin,i=void 0===a?0:a,o=e.scaleMax;return t===r?i:i+(n-t)*((void 0===o?1:o)-i)/(r-t)},c=function(e,n,t){var r=e.x-n.x,a=e.y-n.y,i=Math.sqrt(r*r+a*a),o=r/i,u=a/i;return{x:n.x+o*t,y:n.y+u*t}},f=function(e,n){return Math.sqrt(Math.pow(n.x-e.x,2)+Math.pow(n.y-e.y,2))};function l(){return(l=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)({}).hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(null,arguments)}function p(e,n){return(p=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,n){return e.__proto__=n,e})(e,n)}var y={data:o.a.arrayOf(o.a.oneOfType([o.a.number,o.a.shape({value:o.a.number})]).isRequired).isRequired,smooth:o.a.bool,autoDraw:o.a.bool,autoDrawDuration:o.a.number,autoDrawEasing:o.a.string,width:o.a.number,height:o.a.number,padding:o.a.number,radius:o.a.number,gradient:o.a.arrayOf(o.a.string)},m=function(e){function n(n){var t;return(t=e.call(this,n)||this).trendId=Math.round(Math.random()*Math.pow(10,16)),t.gradientId="infinity-trend-vertical-gradient-"+t.trendId,t}var t,r;r=e,(t=n).prototype=Object.create(r.prototype),t.prototype.constructor=t,p(t,r);var i=n.prototype;return i.componentDidMount=function(){var e,n,t,r,a=this.props,i=a.autoDraw,o=a.autoDrawDuration,u=a.autoDrawEasing;i&&(this.lineLength=this.path.getTotalLength(),function(e){if(null==s&&null==(s=document.querySelector("style[data-infinity-trend]"))){var n=document.head||document.getElementsByTagName("head")[0];(s=document.createElement("style")).type="text/css",s.setAttribute("data-infinity-trend",""),n.appendChild(s)}s.appendChild(document.createTextNode(e))}((e={id:this.trendId,lineLength:this.lineLength,duration:o,easing:u},n=e.id,t=e.lineLength,r=e.duration,"\n    \n    @keyframes infinity-trend-autodraw-"+n+" {\n      0% {\n        stroke-dasharray: "+t+";\n        stroke-dashoffset: "+t+"\n      }\n      100% {\n        stroke-dasharray: "+t+";\n        stroke-dashoffset: 0;\n      }\n      100% {\n        stroke-dashoffset: '';\n        stroke-dasharray: '';\n      }\n    }\n  \n\n    \n    @keyframes infinity-trend-autodraw-cleanup-"+n+" {\n      to {\n        stroke-dasharray: '';\n        stroke-dashoffset: '';\n      }\n    }\n  \n\n    #infinity-trend-"+n+" {\n      animation:\n        infinity-trend-autodraw-"+n+" "+r+"ms "+e.easing+",\n        infinity-trend-autodraw-cleanup-"+n+" 1ms "+r+"ms\n      ;\n    }\n  ")))},i.getDelegatedProps=function(){return e=this.props,n=Object.keys(y),Object.keys(e).reduce((function(t,r){var a;return-1!==n.indexOf(r)?t:u({},t,((a={})[r]=e[r],a))}),{});var e,n},i.renderGradientDefinition=function(){var e=this.props.gradient;return a.a.createElement("defs",null,a.a.createElement("linearGradient",{id:this.gradientId,x1:"0%",y1:"0%",x2:"0%",y2:"100%"},e.slice().reverse().map((function(n,t){return a.a.createElement("stop",{key:t,offset:d({value:t,min:0,max:e.length-1||1}),stopColor:n})}))))},i.render=function(){var e=this,n=this.props,t=n.data,r=n.smooth,i=n.width,o=n.height,u=n.padding,s=n.radius,p=n.gradient;if(!t||t.length<2)return null;var y=i||300,m=o||75,h=i||"100%",x=o||"25%",g=function(e,n){var t=n.minX,r=n.maxX,a=n.minY,i=n.maxY,o={min:0,max:e.length-1},u={min:Math.min.apply(Math,e),max:Math.max.apply(Math,e)},s=e.map((function(e,n){return{x:d({value:n,min:o.min,max:o.max,scaleMin:t,scaleMax:r}),y:d({value:e,min:u.min,max:u.max,scaleMin:a,scaleMax:i})}}));return u.min===u.max&&(s[0].y+=1e-4),s}(t.map((function(e){return"number"==typeof e?e:e.value})),{minX:u,maxX:y-u,minY:m-u,maxY:u}),v=r?function(e,n){var t=n.radius,r=e[0],a=e.slice(1);return a.reduce((function(e,n,i){var o,u,s,d=a[i+1],l=a[i-1]||r,p=d&&(u=n,s=d,((o=l).y-u.y)*(o.x-s.x)==(o.y-s.y)*(o.x-u.x));if(!d||p)return e+"\nL "+n.x+","+n.y;var y=f(l,n),m=f(d,n),h=Math.min(y,m),x=h/2<t?h/2:t,g=c(l,n,x),v=c(d,n,x);return[e,"L "+g.x+","+g.y,"S "+n.x+","+n.y+" "+v.x+","+v.y].join("\n")}),"M "+r.x+","+r.y)}(g,{radius:s}):function(e){return e.reduce((function(e,n,t){return""+e+(0===t?"M":"L")+" "+n.x+","+n.y+"\n"}),"")}(g);return a.a.createElement("svg",l({width:h,height:x,viewBox:"0 0 "+y+" "+m},this.getDelegatedProps()),p&&this.renderGradientDefinition(),a.a.createElement("path",{ref:function(n){e.path=n},id:"infinity-trend-"+this.trendId,d:v,fill:"none",stroke:p?"url(#"+this.gradientId+")":void 0}))},n}(r.Component);m.defaultProps={radius:10,stroke:"black",padding:8,strokeWidth:1,autoDraw:!1,autoDrawDuration:2e3,autoDrawEasing:"ease"};var h=m}]).default}));
//# sourceMappingURL=infinity-trend.min.js.map