react-contribution-calendar
Version:
A GitHub-like contribution calendar component for React
3 lines (2 loc) • 15.3 kB
JavaScript
(function(u,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("react/jsx-runtime"),require("react"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","react-dom"],c):(u=typeof globalThis<"u"?globalThis:u||self,c(u.ContributionCalendar={},u.jsxRuntime,u.React,u.ReactDOM))})(this,function(u,c,D,oe){"use strict";const Z={calendarLabel:"_calendarLabel_1itwh_1",calendarLabelText:"_calendarLabelText_1itwh_7"};function J({children:e,textColor:l,style:r,colSpan:t,hide:v,...o}){return c.jsx("td",{className:Z.calendarLabel,style:r,colSpan:t,...o,children:v?void 0:c.jsx("span",{className:Z.calendarLabelText,"aria-hidden":"true",style:{color:l},children:e})})}const fe={empty:{level0:"#ffffff",level1:"#ffffff",level2:"#ffffff",level3:"#ffffff",level4:"#ffffff"},grass:{level0:"#ebedf0",level1:"#9be9a8",level2:"#40c463",level3:"#30a14e",level4:"#216e39"},cherry:{level0:"#fff0f6",level1:"#ffdeeb",level2:"#faa2c1",level3:"#f06595",level4:"#a61e4d"},cherry_blossom:{level0:"#dedad2",level1:"#e4bcad",level2:"#df979e",level3:"#d7658b",level4:"#c80064"},pink:{level0:"#ffeffc",level1:"#ffc2f6",level2:"#ffa4f1",level3:"#ff86ed",level4:"#ff68e9"},ocean:{level0:"#ccf6ff",level1:"#80d0ff",level2:"#00d1ff",level3:"#00ffff",level4:"#0040ff"},sky:{level0:"#ffffff",level1:"#badbdb",level2:"#98d1d1",level3:"#76c8c8",level4:"#54bebe"},halloween:{level0:"#ebedf0",level1:"#ffee4a",level2:"#ffc501",level3:"#fe9600",level4:"#03001c"},winter:{level0:"#ebedf0",level1:"#b6e3ff",level2:"#54aeff",level3:"#0969da",level4:"#0a3069"},purquoise:{level0:"#dee6ee",level1:"#bdcddc",level2:"#9db4cb",level3:"#7c9bb9",level4:"#5b82a8"},mustard:{level0:"#cc7b00",level1:"#f5b40d",level2:"#f9d26e",level3:"#fbe19e",level4:"#fdf0cf"},gray:{level0:"#FFFFFF",level1:"#D4D4D4",level2:"#B4B4B4",level3:"#909090",level4:"#494848"},vomit:{level0:"#badbdb",level1:"#669999",level2:"#666699",level3:"#663399",level4:"#660099"},neonpunk:{level0:"#FFFFFF",level1:"#B6FFFE",level2:"#48FDFE",level3:"#F20BF8",level4:"#EE018F"},citypop:{level0:"#c2b3ff",level1:"#5B33FE",level2:"#b84dff",level3:"#d52dff",level4:"#FA43F9"},coral:{level0:"#fef3e7",level1:"#f7b267",level2:"#f79d65",level3:"#f4845f",level4:"#f25c54"},emoji_positive:{level0:"🫥",level1:"😢",level2:"😞",level3:"🙂",level4:"😃"},emoji_negative:{level0:"🫥",level1:"😃",level2:"🙂",level3:"😕",level4:"😢"},dark_empty:{level0:"#000000",level1:"#000000",level2:"#000000",level3:"#000000",level4:"#000000"},dark_grass:{level0:"#161b22",level1:"#0e4429",level2:"#006d32",level3:"#26a641",level4:"#39d353"},dark_cherry:{level0:"#1b1819",level2:"#250e16",level3:"#2e0513",level1:"#5d0926",level4:"#a21043"},dark_cherry_blossom:{level0:"#1b1819",level1:"#5d0926",level2:"#a22a52",level3:"#c80064",level4:"#ffb094"},dark_pink:{level0:"#000000",level1:"#33142e",level2:"#7f3474",level3:"#cc53ba",level4:"#ff68e9"},dark_ocean:{level0:"#00004d",level1:"#0000b3",level2:"#0040ff",level3:"#00bfff",level4:"#00ffff"},dark_sky:{level0:"#303636",level1:"#616b6b",level2:"#99a3a3",level3:"#86b6b6",level4:"#54bebe"},dark_halloween:{level0:"#161b22",level1:"#631c03",level2:"#bd561d",level3:"#fa7a18",level4:"#fddf68"},dark_winter:{level0:"#161b22",level1:"#0a3069",level2:"#0969da",level3:"#54aeff",level4:"#b6e3ff"},dark_purquoise:{level0:"#303636",level1:"#7c8288",level2:"#8d9caa",level3:"#7c9bb9",level4:"#5b82a8"},dark_mustard:{level0:"#2a2722",level1:"#4d2e00",level2:"#cc7b00",level3:"#dca009",level4:"#ffc905"},dark_gray:{level0:"#333333",level1:"#555555",level2:"#777777",level3:"#999999",level4:"#D4D4D4"},dark_vomit:{level0:"#261339",level1:"#663399",level2:"#666699",level3:"#669999",level4:"#66cc99"},dark_neonpunk:{level0:"#3E1340",level1:"#EE018F",level2:"#FF00FE",level3:"#41FEFF",level4:"#BFFFFC"},dark_citypop:{level0:"#514c67",level1:"#5B33FE",level2:"#B74FFB",level3:"#D52DE5",level4:"#FA43F9"},dark_coral:{level0:"#504949",level2:"#df6d68",level3:"#f25c54",level1:"#f79d65",level4:"#f7b267"}},de=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],R=(e=new Date)=>{const l={Sun:"Sunday",Mon:"Monday",Tue:"Tuesday",Wed:"Wednesday",Thu:"Thursday",Fri:"Friday",Sat:"Saturday"},r={Jan:"January",Feb:"February",Mar:"March",Apr:"April",May:"May",Jun:"June",Jul:"July",Aug:"August",Sep:"September",Oct:"October",Nov:"November",Dec:"December"},t=e.toString().split(" ");return{year:t[3],month:r[t[1]],day:parseInt(t[2],10),date:l[t[0]]}},se=e=>e.reduce((l,r)=>l+r,0),O=e=>{const l=R(new Date(e+"T00:00"));return`${l.date}, ${l.month} ${l.day}, ${l.year}`},q=(e,l,r)=>`${e}-${String(l+1).padStart(2,"0")}-${String(r).padStart(2,"0")}`,ve=(e,l,r)=>`${e}-${String(l).padStart(2,"0")}-${String(r).padStart(2,"0")}`,I=e=>({year:+e.slice(0,4),month:+e.slice(5,7),day:+e.slice(8,10)}),$=e=>+e.slice(0,4),P=e=>+e.slice(5,7),ue=e=>+e.slice(8,10),ee=(e=A())=>e%4===0&&e%100!==0||e%400===0,V=(e=A())=>[31,ee(e)?29:28,31,30,31,30,31,31,30,31,30,31],le=e=>new Date(e).getDay(),N=(e=A())=>new Date(e,0,1).getDay(),he=e=>new Date(e).getDay(),A=()=>new Date().getFullYear(),ie=(e=A(),l,r)=>{const t=V(e),v=N(e),o=[];let f=v;for(let a=0;a<12;a++){const n=t[a];let d=0;for(let h=0;h<n;h++)f===0&&d++,f=(f+1)%7;a===0&&v!==0&&d++,o.push(d)}return e!==l&&v!==0&&l!==r&&(o[0]-=1),o},re=e=>{const l=new Map;return e.forEach(r=>{Object.keys(r).forEach(t=>{l.set(t,r[t])})}),l},H=e=>typeof e=="string"?fe[e]:e,ge=(e,l)=>{let r=0;for(let t=e;t<=l;++t)r+=te(e,t===e);return new Array(7).fill(0).map(()=>new Array(r).fill(0))},be=(e,l)=>{let r=0;for(let t=e;t<=l;++t)r+=te(e,t===e);return new Array(7).fill("").map(()=>new Array(r).fill(""))},te=(e,l)=>{const r=N(e);return l||r===0?53:52},me=(e,l,r)=>{const t=$(e),v=$(l),o=ge(t,v);let f=0,a=1;for(let n=t;n<=v;++n){const d=r?N(n):(N(n)+6)%7,h=V(n);let s=0,i=1,m=d;for(;s<12;){for(let g=0;g<h[s];++g)o[m%7][~~(m/7)+f]=a,m++,i++,a++;i>h[s]&&(i=1,s++)}f+=~~(m/7)}return o},U=(e,l,r)=>{const t=$(e),v=$(l),o=be(t,v);let f=0;for(let a=t;a<=v;++a){const n=r?N(a):(N(a)+6)%7,d=V(a);let h=0,s=1,i=n;for(;h<12;){for(let m=0;m<d[h];++m){const g=ve(a,h+1,s);o[i%7][~~(i/7)+f]=g,i++,s++}s>d[h]&&(s=1,h++)}f+=~~(i/7)}return o},j=(e,l,r)=>{const t=`${e}-01-01`,v=ne(t,l),o=me(t,l,r);for(let f=0;f<o.length;++f)for(let a=0;a<o[f].length;++a)if(v===o[f][a])return{row:f,col:a};return{row:0,col:0}},ne=(e,l)=>Math.abs(new Date(e).getTime()-new Date(l).getTime())/(1e3*60*60*24)+1,X=(e,l,r,t)=>{const{row:v,col:o}=j($(e),e,t),{col:f}=j($(e),l,t),a=[],n=[];let d=-1,h=0;for(let s=o;s<=f;++s)s===o?h=P(r[v][s])-1:h=P(r[0][s])-1,h!==d&&(a.push(de[h]),d=h,n.push(0)),n[n.length-1]++;return{months:a,colSpans:n}},G={thead:"_thead_1cftj_1",tr:"_tr_1cftj_9",dayOfTheWeek:"_dayOfTheWeek_1cftj_16"};function De({start:e,end:l,textColor:r,startsOnSunday:t,cy:v}){const o=U(e,l,t),{day:f}=I(e),{year:a,month:n,day:d}=I(l),h=le(`${a}-${n}-01`),{months:s,colSpans:i}=X(e,l,o,t);return c.jsx("thead",{className:G.thead,children:c.jsxs("tr",{className:G.tr,children:[c.jsx(J,{className:G.dayOfTheWeek,textColor:r,style:{fontSize:v},colSpan:1,children:" "}),s.map((m,g)=>{let _=i[g];i.length===1&&i[0]===1?_++:s.length>1&&d<14&&h!==0&&g===s.length-2?_--:(s.length>1&&d<14&&h!==0&&g===s.length-1||s.length>1&&d<14&&g===s.length-1)&&_++;const k=g===0&&s.length>1&&_<=1&&f>=21;return c.jsx(J,{textColor:r,style:{fontSize:v},colSpan:_,hide:k,children:m},g)})]})})}const ye={calendarCell:"_calendarCell_1hhsm_1",top:"_top_1hhsm_11"},_e=({content:e,offsetX:l,targetRect:r,fontSize:t=12})=>{if(!r)return null;const v={position:"fixed",zIndex:999,backgroundColor:"#25292E",color:"#ecf0f1",padding:"4px 8px",borderRadius:"5px",fontFamily:`-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji'`,fontWeight:400,whiteSpace:"nowrap",pointerEvents:"none",fontSize:`${t}px`,left:`${r.left+l}px`,top:`${r.top-16-t-~~(t/10)}px`},o={position:"fixed",zIndex:999,width:0,height:0,borderLeft:"6px solid transparent",borderRight:"6px solid transparent",borderTop:"6px solid #25292E",pointerEvents:"none",left:`${r.left+r.width/2-6}px`,top:`${r.top-8}px`};return oe.createPortal(c.jsxs(c.Fragment,{children:[c.jsx("div",{style:v,children:e}),c.jsx("div",{style:o})]}),document.body)};function Se({cx:e,theme:l,themeProps:r,dataLevel:t,style:v,dataTooltip:o,tooltipSize:f,...a}){const n=D.useRef(null),[d,h]=D.useState(-10),[s,i]=D.useState(!1),[m,g]=D.useState(null),_=b=>{if(!b)return 0;let y=0;return b.childNodes.forEach(T=>{T.nodeType===Node.ELEMENT_NODE&&window.getComputedStyle(T).display!=="none"&&y++}),y},k=b=>{if(!b||!b.parentNode)return-1;const y=Array.from(b.parentNode.childNodes);let T=0;for(let F=0;F<b.cellIndex;F++)y[F].style.display!=="none"&&T++;return T};D.useEffect(()=>{const b=()=>{var T;if(n.current){const F=_((T=n.current)==null?void 0:T.parentNode),p=k(n.current);if(F){let W=-10;p/F>.33?W=Math.max(~~(n.current.cellIndex*-9*e)/F,-9*e):W=Math.max(~~n.current.cellIndex*-30*e/F,-10),h(W)}g(n.current.getBoundingClientRect()),i(!0)}},y=()=>{i(!1)};return n.current&&(n.current.addEventListener("mouseover",b),n.current.addEventListener("mouseout",y)),()=>{n.current&&(n.current.removeEventListener("mouseover",b),n.current.removeEventListener("mouseout",y))}},[e]);const w=b=>{const y=typeof b=="string"?!1:b.isTextTheme||!1;return b==="emoji_positive"||b==="emoji_negative"||y};return c.jsxs(c.Fragment,{children:[c.jsx("td",{ref:n,className:ye.calendarCell,style:{...v,"--tooltip-offset":`${d}px`,outline:w(l)?"transparent":"1px solid rgba(27, 31, 35, 0.06)",backgroundColor:w(l)?"transparent":r[`level${t}`]},"data-level":t,...a,children:w(l)?r[`level${t}`]:void 0}),s&&c.jsx(_e,{content:o,offsetX:d,targetRect:m,fontSize:f})]})}const L={tbody:"_tbody_108ph_1",tr:"_tr_108ph_6",td:"_td_108ph_13"};function Fe({data:e,start:l,end:r,daysOfTheWeek:t,textColor:v,startsOnSunday:o,includeBoundary:f,cx:a,cy:n,cr:d,theme:h,onClick:s,hideDayLabels:i=!1}){const{year:m,day:g}=I(l),{day:_}=I(r),{row:k,col:w}=j(m,l,o),{row:b,col:y}=j(m,r,o),T=U(l,r,o),{colSpans:F}=X(l,r,T,o),p=H(h),W=re(e),ce=(M,S)=>S==y+1&&F[F.length-1]===1,ke=(M,S)=>S<w||S>y,Ee=(M,S)=>S===w&&M<k||S===y&&M>b,z=()=>w===y||_-g<=7,$e=o?t:(()=>{const M=[...t];return M.push(M.shift()||""),M})();return c.jsx("tbody",{className:L.tbody,children:$e.map((M,S)=>c.jsxs("tr",{className:L.tr,children:[i===!1&&c.jsx(J,{tabIndex:0,textColor:v,style:{textAlign:"left",fontSize:n,lineHeight:0},children:M}),T[S].map((Q,C)=>{if(y===0&&C===1)return c.jsx("td",{className:L.td,style:{padding:0,width:z()?a:0,height:z()?n:0,outline:"none",borderRadius:d,outlineOffset:"-1px",shapeRendering:"geometricPrecision"}},C);if(ce(S,C))return c.jsx("td",{className:L.td,style:{padding:"0",display:"block"}},C);if(Ee(S,C))return c.jsx("td",{className:L.td,style:{padding:0,width:z()?a:0,height:z()?n:0,outline:f?`1px solid ${p.level0}`:"none",borderRadius:d,outlineOffset:"-1px",shapeRendering:"geometricPrecision"}},C);if(ke(S,C))return c.jsx("td",{className:L.td,style:{padding:"0",display:"none"}},C);const E=W.get(Q),Ne=O(Q),Ae=Le=>{const Ie={date:Q,data:E==null?void 0:E.data};s&&s(Le,Ie)};return c.jsx(Se,{cx:a,tabIndex:-1,style:{width:a,height:n,borderRadius:d},dataLevel:E!==void 0?E.level:0,"data-content":JSON.stringify(E==null?void 0:E.data),dataTooltip:Ne,tooltipSize:n,theme:h,themeProps:p,onClick:Ae},C)})]},`${M}-${S}`))})}const K={description:"_description_lo6s8_1",themes:"_themes_lo6s8_8",cell:"_cell_lo6s8_16"};function Te({textColor:e,cx:l,cy:r,cr:t,theme:v}){const o=H(v),f=n=>{const d=typeof n=="string"?!1:n.isTextTheme||!1;return n==="emoji_positive"||n==="emoji_negative"||d},a=(n,d)=>f(n)?{width:l,height:r,fontSize:l}:{width:l,height:r,borderRadius:t,backgroundColor:o[`level${d}`],outline:"1px solid #1b1f230f"};return c.jsx("div",{className:K.description,children:c.jsxs("div",{className:K.themes,children:[c.jsx("span",{style:{color:e,fontSize:l},children:"Less"}),Array.from({length:5},(n,d)=>d).map(n=>c.jsx("div",{className:K.cell,style:{...a(v,n)},children:f(v)?o[`level${n}`]:void 0},`description-level-${n}`)),c.jsx("span",{style:{color:e,fontSize:l},children:"More"})]})})}const x={base:"_base_1hm3v_1",container:"_container_1hm3v_15",calendar:"_calendar_1hm3v_20",table:"_table_1hm3v_28"},Y=(e,l)=>{const r=new Error(l);return r.name=e,r};var B=(e=>(e.Number="Number Error",e.String="String Error",e.Date="Date Error",e))(B||{});const ae=e=>{if(!/^\d{4}-\d{2}-\d{2}$/.test(e))throw Y(B.Date,`Invalid date string ${e}. The date string should be 'YYYY-MM-DD' format.`);try{return new Date(e).toISOString().slice(0,10)===e}catch{throw Y(B.Date,`Invalid date string ${e}. Please check the date.`)}},Me=(e,l)=>{if(e>l)throw Y(B.Date,"The starting date should be earlier than the ending date.")},we=e=>{if(e.length!==7)throw Y(B.Number,"The length of the `daysOfTheWeek` should be exact 7.")};function Ce({data:e,dateOptions:l,styleOptions:r,visibilityOptions:t,onCellClick:v=(f,a)=>console.log(a),scroll:o=!1}){const f=D.useMemo(()=>(l==null?void 0:l.start)||q(A(),0,1),[l==null?void 0:l.start]),a=D.useMemo(()=>(l==null?void 0:l.end)||q(A(),11,31),[l==null?void 0:l.end]),n=D.useMemo(()=>(l==null?void 0:l.startsOnSunday)??!0,[l==null?void 0:l.startsOnSunday]),d=D.useMemo(()=>(l==null?void 0:l.daysOfTheWeek)||["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],[l==null?void 0:l.daysOfTheWeek]),h=D.useMemo(()=>(r==null?void 0:r.textColor)||"#1f2328",[r==null?void 0:r.textColor]),s=D.useMemo(()=>(l==null?void 0:l.includeBoundary)??!0,[l==null?void 0:l.includeBoundary]),i=D.useRef(null),[m,g]=D.useState(0);return D.useEffect(()=>{ae(f),ae(a),Me(f,a),we(d)},[d,f,a]),D.useEffect(()=>{if(i.current){const _=()=>{var w;g(((w=i.current)==null?void 0:w.offsetWidth)||0)};_();const k=new ResizeObserver(_);return k.observe(i.current),()=>{i.current&&k.unobserve(i.current)}}},[]),c.jsx("div",{className:`${x.base} ${x.container}`,style:r==null?void 0:r.style,children:c.jsxs("div",{className:x.calendar,style:{overflowX:o?"scroll":"clip",display:"block"},children:[c.jsxs("table",{ref:i,className:x.table,children:[!(t!=null&&t.hideMonthLabels)&&c.jsx(De,{start:f,end:a,textColor:h,startsOnSunday:n,cy:(r==null?void 0:r.cy)||10}),c.jsx(Fe,{data:e||[],start:f,end:a,daysOfTheWeek:d,textColor:h,startsOnSunday:n,includeBoundary:s,cx:(r==null?void 0:r.cx)||10,cy:(r==null?void 0:r.cy)||10,cr:(r==null?void 0:r.cr)||2,theme:(r==null?void 0:r.theme)||"grass",onClick:v,hideDayLabels:(t==null?void 0:t.hideDayLabels)??!1})]}),!(t!=null&&t.hideDescription)&&c.jsx("div",{style:{width:m},children:c.jsx(Te,{textColor:h,cx:(r==null?void 0:r.cx)||10,cy:(r==null?void 0:r.cy)||10,cr:(r==null?void 0:r.cr)||2,theme:(r==null?void 0:r.theme)||"grass"})})]})})}u.ContributionCalendar=Ce,u.createTheme=H,u.getArraySum=se,u.getColumnSpansForYears=ie,u.getCurrentYear=A,u.getDateDetails=R,u.getDateString=q,u.getDateTooltip=O,u.getDayArray=U,u.getDayIndexFromDateString=le,u.getDayIndexOfMonth=he,u.getDaysBetween=ne,u.getFirstDayIndexOfYear=N,u.getMonthsAndColSpans=X,u.getRowAndColumnIndexFromDate=j,u.isLeapYear=ee,u.parseDateFromDateString=I,u.parseDayFromDateString=ue,u.parseInputData=re,u.parseMonthFromDateString=P,u.parseYearFromDateString=$,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});