react-custom-calendarss/dist/index.umd.cjs

A calendar that can be customized to your liking 🧨

(function(d,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("react"),require("react/jsx-runtime")):typeof define=="function"&&define.amd?define(["exports","react","react/jsx-runtime"],l):(d=typeof globalThis<"u"?globalThis:d||self,l(d.index={},d.React,d.jsxRuntime))})(this,function(d,l,w){"use strict";const g=(e,n)=>{const u=e.getUTCFullYear(),a=e.getUTCMonth()+1,s=e.getUTCDate();let t=n;return n.includes("yyyy")&&(t=t.replace("yyyy",u.toString())),n.includes("MM")&&(t=t.replace("MM",a.toString().padStart(2,"0"))),n.includes("dd")&&(t=t.replace("dd",s.toString().padStart(2,"0"))),t},S=(e,n,u,a=!1)=>{const t=new Date(Date.UTC(e,n,1)).getUTCDay(),i=new Date(Date.UTC(e,n+1,0)).getUTCDate(),o=n-1,r=o<0?e-1:e,c=o<0?11:o,D=new Date(Date.UTC(r,c+1,0)).getUTCDate(),f=n+1,b=f>11?e+1:e,v=f>11?0:f,T=Array(6).fill(null).map(()=>Array(7).fill(0)),C={},x={};let P=1,M=1;for(let h=0;h<6;h++)for(let m=0;m<7;m++)if(h===0&&m<t){const U=D-(t-m-1);if(T[h][m]=a?-U:0,a){const j=new Date(Date.UTC(r,c,U));C[U]=g(j,u)}}else if(P<=i)T[h][m]=P++;else{if(T[h][m]=a?-M:0,a){const U=new Date(Date.UTC(b,v,M));x[M]=g(U,u)}M++}return{matrix:T,year:e,month:n,prevMonthDates:C,nextMonthDates:x}},k=(e,n,u,a,s,t,i)=>{let o=e.find(r=>r.includes(a));return!o&&a>28&&(o=e[e.length-1]),o?o.map(r=>{if(r>0)return g(new Date(Date.UTC(n,u,r)),i);if(r<0){const c=Math.abs(r),D=s[c]||t[c];return D?g(new Date(D),i):"0"}return"0"}):[]},p=(e,n,u,a,s=!1,t={},i={})=>e.map(o=>o.map(r=>{if(r>0)return g(new Date(Date.UTC(n,u,r)),a);if(s&&r<0){const c=Math.abs(r),D=t[c]||i[c];return D?g(new Date(D),a):"0"}return"0"})),O=({type:e,initialDate:n})=>{if(!e)throw new Error("Calendar type is required");const[u,a]=l.useState(()=>{if(n)return new Date(Date.UTC(n.getUTCFullYear(),n.getUTCMonth(),1)).toISOString();const c=new Date;return new Date(Date.UTC(c.getUTCFullYear(),c.getUTCMonth(),1)).toISOString()}),[s,t]=u.split("T")[0].split("-").map(Number),i=l.useMemo(()=>S(s,t-1,e),[s,t]),o=l.useMemo(()=>p(i.matrix,s,t-1,e),[i,e,s,t]),r=c=>{const D=new Date(Date.UTC(s,t-1+c,1));a(D.toISOString())};return{currentDate:u,setCurrentDate:a,monthCalendarData:o,moveToNext:()=>r(1),moveToPrev:()=>r(-1),moveToPeriod:r}},Y=({type:e,initialDate:n})=>{if(!e)throw new Error("Calendar type is required");const[u,a]=l.useState(()=>{if(n)return new Date(Date.UTC(n.getUTCFullYear(),n.getUTCMonth(),n.getUTCDate())).toISOString();const C=new Date;return new Date(Date.UTC(C.getUTCFullYear(),C.getUTCMonth(),C.getUTCDate())).toISOString()}),[s,t,i]=u.split("T")[0].split("-").map(Number),{matrix:o,year:r,month:c,prevMonthDates:D,nextMonthDates:f}=l.useMemo(()=>S(s,t-1,e,!0),[s,t]),b=l.useMemo(()=>k(o,s,t-1,i,D,f,e),[o,s,t,i,D,f,e]),v=l.useMemo(()=>p(o,r,c,e,!0,D,f),[o,r,c,e,D,f]),T=C=>{const x=new Date(Date.UTC(s,t-1,i+C*7));a(x.toISOString())};return{currentDate:u,setCurrentDate:a,weekDates:b,monthlyWeekGrid:v,moveToNext:()=>T(1),moveToPrev:()=>T(-1),moveToPeriod:T,matrix:o}},y=l.createContext(void 0),I=()=>l.useContext(y),F={primary:{bg:"bg-[#0058E4] border-[#0054DA] border-2",text:"text-white text-button-active"},secondary:{bg:"bg-white border-[#D4D6DD] border",text:"text-[#222] text-button-choice"},disabled:{bg:"bg-[#D4D6DD] border-transparent",text:"text-[#8F9098] text-button-choice"}};function N({children:e,disabled:n=!1,variant:u="primary",className:a="",...s}){var r;const t=I(),i=n?"disabled":u,o={...F[i],...((r=t==null?void 0:t.button)==null?void 0:r[i])??{}};return w.jsx("button",{...s,className:`${a} ${o.bg} w-full cursor-pointer py-4`,children:w.jsx("p",{className:`${o.text} text-center`,children:e})})}const W=({theme:e,children:n})=>w.jsx(y.Provider,{value:e,children:n});d.ActiveButton=N,d.MonthCalendar=O,d.UIThemeProvider=W,d.WeekCalendar=Y,d.useUITheme=I,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});