UNPKG

@uiw/react-heat-map

Version:

React component create calendar heatmap to visualize time series data, a la github contribution graph.

2 lines 8.94 kB
/*! For license information please see heat-map.min.js.LICENSE.txt */ !function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("react")):"function"===typeof define&&define.amd?define(["react"],t):"object"===typeof exports?exports["@uiw/react-heat-map"]=t(require("react")):e["@uiw/react-heat-map"]=t(e.React)}(self,(e=>(()=>{"use strict";var t={298:(e,t,r)=>{var n=r(787),o=Symbol.for("react.element"),a=Symbol.for("react.fragment"),i=Object.prototype.hasOwnProperty,u=n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,l={key:!0,ref:!0,__self:!0,__source:!0};function c(e,t,r){var n,a={},c=null,f=null;for(n in void 0!==r&&(c=""+r),void 0!==t.key&&(c=""+t.key),void 0!==t.ref&&(f=t.ref),t)i.call(t,n)&&!l.hasOwnProperty(n)&&(a[n]=t[n]);if(e&&e.defaultProps)for(n in t=e.defaultProps)void 0===a[n]&&(a[n]=t[n]);return{$$typeof:o,type:e,key:c,ref:f,props:a,_owner:u.current}}t.jsx=c,t.jsxs=c},605:(e,t,r)=>{e.exports=r(298)},787:t=>{t.exports=e}},r={};function n(e){var o=r[e];if(void 0!==o)return o.exports;var a=r[e]={exports:{}};return t[e](a,a.exports,n),a.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var o={};return(()=>{function e(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function t(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function r(r){for(var n=1;n<arguments.length;n++){var o=null!=arguments[n]?arguments[n]:{};n%2?t(Object(o),!0).forEach((function(t){e(r,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(o)):t(Object(o)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(o,e))}))}return r}function a(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}n.r(o),n.d(o,{default:()=>w});var i=n(787),u=n.n(i);function l(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function c(e,t){if(e){if("string"===typeof e)return l(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?l(e,t):void 0}}function f(e){return function(e){if(Array.isArray(e))return l(e)}(e)||function(e){if("undefined"!==typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||c(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function s(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a=[],i=!0,u=!1;try{for(r=r.call(e);!(i=(n=r.next()).done)&&(a.push(n.value),!t||a.length!==t);i=!0);}catch(l){u=!0,o=l}finally{try{i||null==r.return||r.return()}finally{if(u)throw o}}return a}}(e,t)||c(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var d=n(605),p=function(e){var t=e.weekLabels,r=void 0===t?[]:t,n=e.rectSize,o=void 0===n?0:n,a=e.topPad,u=void 0===a?0:a,l=e.space,c=void 0===l?0:l;return(0,i.useMemo)((function(){return(0,d.jsx)(i.Fragment,{children:f(Array(7)).map((function(e,t){return r&&r[t]?(0,d.jsx)("text",{x:15,y:u,dy:(t+1)*(o+c)-5,children:r[t]},t):null}))})}),[o,c,u,r])},y=864e5;function m(e){return e instanceof Date&&!isNaN(e.getTime())}function v(e){return"".concat(e.getFullYear(),"/").concat(e.getMonth()+1,"/").concat(e.getDate())}var b=function(e){var t=e.monthLabels,r=void 0===t?[]:t,n=e.rectSize,o=void 0===n?0:n,a=e.space,u=void 0===a?0:a,l=e.leftPad,c=void 0===l?0:l,s=e.colNum,p=void 0===s?0:s,m=e.startDate,v=(0,i.useMemo)((function(){return!1===r||p<1?[]:f(Array(7*p)).map((function(e,t){if(t/7%1===0){var n=new Date(m.getTime()+t*y),o=n.getMonth();return{col:t/7,index:t,month:o,day:n.getDate(),monthStr:r[o],date:n}}return null})).filter(Boolean).filter((function(e,t,r){return r[t-1]&&r[t-1].month!==e.month}))}),[p,r,m]);return(0,i.useMemo)((function(){return(0,d.jsx)(i.Fragment,{children:f(v).map((function(e,t){return(0,d.jsx)("text",{"data-size":o,x:c+u+u,y:15,dx:e.col*(o+u),textAnchor:"start",children:e.monthStr},t)}))})}),[v,c,o,u])},g=function(e){return(0,d.jsx)("rect",r({},e))},h=["panelColors","leftPad","topPad","space","rectSize","legendCellSize","legendRender"];function j(e){var t=e.panelColors,n=e.leftPad,o=void 0===n?0:n,u=e.topPad,l=void 0===u?0:u,c=(e.space,e.rectSize),f=void 0===c?0:c,s=e.legendCellSize,p=void 0===s?0:s,y=e.legendRender,m=a(e,h),v=p||f;return(0,i.useMemo)((function(){return(0,d.jsx)(i.Fragment,{children:Object.keys(t||{}).map((function(e,n){var a=r(r({},m),{},{key:n,x:(v+1)*n+o,y:l+8*f+6,fill:t[Number(e)],width:v,height:v});return y?y(a):(0,d.jsx)(g,r({},a))}))})}),[t,m,v,o,l,f,y])}var O=["rectSize","legendCellSize","space","startDate","endDate","rectProps","rectRender","legendRender","value","weekLabels","monthLabels","panelColors"];function x(e){var t=e||{},n=t.rectSize,o=void 0===n?11:n,l=t.legendCellSize,c=void 0===l?11:l,h=t.space,x=void 0===h?2:h,S=t.startDate,w=void 0===S?new Date:S,P=t.endDate,D=t.rectProps,E=t.rectRender,_=t.legendRender,A=t.value,k=void 0===A?[]:A,C=t.weekLabels,M=void 0===C?["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]:C,T=t.monthLabels,z=void 0===T?["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]:T,R=t.panelColors,N=void 0===R?{0:"#EBEDF0",8:"#7BC96F",4:"#C6E48B",12:"#239A3B",32:"#196127"}:R,L=a(t,O),F=s((0,i.useState)(0),2),I=F[0],B=F[1],J=s((0,i.useState)(M?28:5),2),U=J[0],W=J[1],$=s((0,i.useState)(z?20:5),2),q=$[0],Y=$[1],V=u().createRef(),G=(0,i.useMemo)((function(){return function(){return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:[]).sort((function(e,t){return e<t?-1:e>t?1:0}))}(Object.keys(N).map((function(e){return parseInt(e,10)})))}),[N]),H=(0,i.useMemo)((function(){return function(){var e={};return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:[]).forEach((function(t){t.date&&m(new Date(t.date))&&(t.date=v(new Date(t.date)),e[t.date]=t)})),e}(k)}),[k]);(0,i.useEffect)((function(){return W(M?28:5)}),[M]),(0,i.useEffect)((function(){if(V.current){var e=V.current.clientWidth-U||0;B(Math.floor(e/(o+x))||0)}}),[o,V,x,U]),(0,i.useEffect)((function(){Y(z?20:5)}),[z]);var K=(0,i.useMemo)((function(){if(m(w))return w.getDay()?new Date(w.getTime()-w.getDay()*y):w;var e=new Date;return new Date(e.getTime()-e.getDay()*y)}),[w]);return(0,d.jsxs)("svg",r(r({ref:V},L),{},{children:[0!==c&&(0,d.jsx)(j,{legendRender:_,panelColors:N,rectSize:o,legendCellSize:c,leftPad:U,topPad:q,space:x}),(0,d.jsx)(p,{weekLabels:M,rectSize:o,space:x,topPad:q}),(0,d.jsx)(b,{monthLabels:z,rectSize:o,space:x,leftPad:U,colNum:I,startDate:K}),(0,d.jsx)("g",{transform:"translate(".concat(U,", ").concat(q,")"),children:I>0&&f(Array(I)).map((function(e,t){return(0,d.jsx)("g",{"data-column":t,children:f(Array(7)).map((function(e,n){var a=r(r({},D),{},{key:n,fill:"#EBEDF0",width:o,height:o,x:t*(o+x),y:(o+x)*n}),i=new Date(K.getTime()+y*(7*t+n)),l=v(i),c=r(r({},H[l]),{},{date:l,row:n,column:t,index:7*t+n});if(P instanceof Date&&i.getTime()>P.getTime())return null;if(l&&H[l]&&N&&Object.keys(N).length>0?a.fill=function(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1?arguments[1]:void 0,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},n="",o=0;o<t.length;o+=1){if(t[o]>e){n=r[t[o]];break}n=r[t[o]]}return n}(H[l].count||0,G,N):N&&N[0]&&(a.fill=N[0]),E&&"function"===typeof E){var f=E(r(r({},a),{},{key:n}),c);if(f&&u().isValidElement(f))return f}return(0,d.jsx)(g,r(r({},a),{},{"data-date":l,"data-index":c.index,"data-row":c.row,"data-column":c.column}))}))},t)}))})]}))}var S=["prefixCls","className"];function w(e){var t=e.prefixCls,n=void 0===t?"w-heatmap":t,o=e.className,i=a(e,S),u=[o,n].filter(Boolean).join(" ");return(0,d.jsx)(x,r({className:u},i))}})(),o})()));