react-calendar-kit/dist/calendar/range-calendar.js

React Calendar Kit is a powerful and flexible library for building accessible and highly customizable calendar and date/time picker components in your React applications. React Calendar Kit provides a solid foundation for creating inclusive user experienc

'use client';
var Qe=Object.create;var z=Object.defineProperty;var Xe=Object.getOwnPropertyDescriptor;var et=Object.getOwnPropertyNames;var tt=Object.getPrototypeOf,rt=Object.prototype.hasOwnProperty;var nt=(e,t)=>{for(var r in t)z(e,r,{get:t[r],enumerable:!0})},fe=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of et(t))!rt.call(e,a)&&a!==r&&z(e,a,{get:()=>t[a],enumerable:!(n=Xe(t,a))||n.enumerable});return e};var b=(e,t,r)=>(r=e!=null?Qe(tt(e)):{},fe(t||!e||!e.__esModule?z(r,"default",{value:e,enumerable:!0}):r,e)),at=e=>fe(z({},"__esModule",{value:!0}),e);var vt={};nt(vt,{default:()=>kt});module.exports=at(vt);var F=b(require("react")),_=require("@internationalized/date"),Ke=require("@react-aria/calendar"),je=require("@react-aria/i18n"),Ye=require("@react-stately/calendar");var U=b(require("react"));var $=b(require("react"));function ne(e){let t=$.useRef(e);return $.useEffect(()=>{t.current=e}),$.useMemo(()=>(...r)=>t.current?.(...r),[])}function he({prop:e,defaultProp:t,onChange:r=()=>{}}){let[n,a]=ot({defaultProp:t,onChange:r}),o=e!==void 0,d=o?e:n,p=ne(r),m=U.useCallback(s=>{if(o){let i=typeof s=="function"?s(e):s;i!==e&&p(i)}else a(s)},[o,e,a,p]);return[d,m]}function ot({defaultProp:e,onChange:t}){let r=U.useState(e),[n]=r,a=U.useRef(n),o=ne(t);return U.useEffect(()=>{a.current!==n&&(o(n),a.current=n)},[n,a,o]),r}var ye=require("react");function st(e,t){typeof e=="function"?e(t):typeof e=="object"&&e!==null&&"current"in e&&(e.current=t)}function it(...e){return t=>{e.forEach(r=>st(r,t))}}function J(...e){return(0,ye.useCallback)(it(...e),e)}var W=b(require("react"));function ge(e){let t=(0,W.createContext)(null);return[({children:a,value:o})=>W.default.createElement(t.Provider,{value:o},a),()=>{let a=(0,W.useContext)(t);if(a===null)throw new Error(e);return a}]}var[Ce,H]=ge("Calendar component was not found in tree");var l=b(require("react")),Ze=require("@react-aria/i18n"),$e=require("@react-aria/utils"),pe=require("@react-aria/visually-hidden");var Q=require("@internationalized/date"),Pe=require("clsx"),x=Pe.clsx,c=e=>e?"true":void 0;function ke(e,t){let r=[];if(!e||!t)return r;let n=(0,Q.startOfYear)(e);for(;n.compare(t)<=0;)r.push(n),n=(0,Q.startOfYear)(n.add({years:1}));return r}function lt(e,t){return e.add({months:t})}function ve(e){let r=[(0,Q.startOfYear)(e)];for(;r.length<12;){let n=r[r.length-1];r.push(lt(n,1))}return r}function N(...e){return e?.reduce((t,r)=>r?{...t,...r}:t,{})??{}}var K=b(require("react")),be=require("@react-aria/button"),xe=require("@react-aria/focus"),Re=require("@react-aria/interactions"),X=require("@react-aria/utils");var Se=(0,K.forwardRef)((e,t)=>{let{children:r,autoFocus:n,isDisabled:a,onKeyDown:o,...d}=e,p=(0,K.useRef)(null),{buttonProps:m,isPressed:s}=(0,be.useButton)({elementType:"button",isDisabled:a,onKeyDown:o,...d},p),P=J(p,t),{isFocusVisible:i,isFocused:h,focusProps:S}=(0,xe.useFocusRing)({autoFocus:n}),{isHovered:f,hoverProps:y}=(0,Re.useHover)({isDisabled:a});return K.default.createElement("button",{ref:P,"data-disabled":c(a),"data-focus":c(h),"data-focus-visible":c(i),"data-hover":c(f),"data-pressed":c(s),className:e.className,...(0,X.mergeProps)(S,y,m,(0,X.filterDOMProps)(d))},r)});Se.displayName="Button";var G=Se;var A=b(require("react")),ee=require("@internationalized/date"),Be=require("@react-aria/calendar"),Le=require("@react-aria/i18n");var j=b(require("react")),I=require("@internationalized/date"),De=require("@react-aria/calendar"),we=require("@react-aria/focus"),Ee=require("@react-aria/i18n"),Ne=require("@react-aria/interactions"),Me=require("@react-aria/utils");function Te({isPickerVisible:e,classNames:t,styles:r,state:n,currentMonth:a,...o}){let{locale:d}=(0,Ee.useLocale)(),p=(0,j.useRef)(null),{cellProps:m,buttonProps:s,isPressed:P,isSelected:i,isDisabled:h,isFocused:S,isInvalid:f,formattedDate:y}=(0,De.useCalendarCell)({...o,date:o.date,isDisabled:!(0,I.isSameMonth)(o.date,a)||e},n,p),C=n.isCellUnavailable(o.date),D=!h&&!f&&n.isCellUnavailable(o.date.add({days:1})),w=!h&&!f&&n.isCellUnavailable(o.date.subtract({days:1})),M="highlightedRange"in n&&n.highlightedRange,L=i&&M&&(0,I.isSameDay)(o.date,M.start),k=i&&M&&(0,I.isSameDay)(o.date,M.end),T=(0,I.getDayOfWeek)(o.date,d),Z=i&&(w||T===0||o.date.day===1),g=i&&(D||T===6||o.date.day===a.calendar.getDaysInMonth(a)),{focusProps:u,isFocusVisible:v}=(0,we.useFocusRing)(),{hoverProps:V,isHovered:E}=(0,Ne.useHover)({isDisabled:h||C||n.isReadOnly});return j.default.createElement("td",{...m,role:"grid-body-cell",className:t.gridBodyCell},j.default.createElement("span",{...(0,Me.mergeProps)(s,V,u),className:t.cellButton,style:r?.cellButton,ref:p,role:"button","data-disabled":c(h&&!f),"data-focus-visible":c(S&&v),"data-hover":c(E),"data-invalid":c(f),"data-outside-month":c(!(0,I.isSameMonth)(o.date,a)),"data-pressed":c(P&&!n.isReadOnly),"data-range-end":c(g),"data-range-selection":c(i&&"highlightedRange"in n),"data-range-start":c(Z),"data-readonly":c(n.isReadOnly),"data-selected":c(i),"data-selection-end":c(k),"data-selection-start":c(L),"data-today":c((0,I.isToday)(o.date,n.timeZone)),"data-unavailable":c(C)},j.default.createElement("span",null,y)))}var dt=e=>{let{startDate:t,currentMonth:r,...n}=e,{state:a,weekdayStyle:o,isPickerExpanded:d,classNames:p,styles:m}=H(),{locale:s}=(0,Le.useLocale)(),P=(0,ee.getWeeksInMonth)(t,s),{gridProps:i,headerProps:h,weekDays:S}=(0,Be.useCalendarGrid)({...n,weekdayStyle:o,endDate:(0,ee.endOfMonth)(t)},a),f=[...new Array(P).keys()].map(y=>A.default.createElement("tr",{role:"grid-body-row",className:p.gridBodyRow,key:y,"data-picker-expanded":c(d)},a.getDatesInWeek(y,t).map((C,D)=>C?A.default.createElement(Te,{key:D,state:a,currentMonth:t,date:C,isPickerVisible:d,classNames:p,styles:m}):A.default.createElement("td",{key:D}))));return A.default.createElement("table",{...i,role:"grid",className:x(p.grid,i.className),"aria-hidden":c(d),tabIndex:-1},A.default.createElement("thead",{...h,className:x(p.gridHead,h.className),style:N(h.style,m?.gridHead),role:"grid-header"},A.default.createElement("tr",{className:p.gridHeadRow,style:m?.gridHeadRow,role:"grid-header-row"},S.map((y,C)=>A.default.createElement("th",{key:C,role:"grid-header-cell",className:p.gridHeadCell,style:m?.gridHeadCell},A.default.createElement("span",null,y))))),A.default.createElement("tbody",{key:r,className:p.gridBody,style:m?.gridBody,role:"grid-body"},f))},ae=dt;var O=b(require("react")),He=require("@react-aria/i18n");var oe=b(require("react")),mt=e=>oe.createElement("svg",{width:20,height:20,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},oe.createElement("path",{d:"m5 7.5 5 5 5-5",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"})),Ve=mt;var ct=e=>{let{date:t,currentMonth:r,...n}=e,{state:a,headerRef:o,withPicker:d,classNames:p,styles:m,isPickerExpanded:s,setPickerExpanded:P}=H(),h=(0,He.useDateFormatter)({month:"long",era:r.calendar.identifier==="gregory"&&r.era==="BC"?"short":void 0,calendar:r.calendar.identifier,timeZone:a.timeZone,year:"numeric"}).format(t.toDate(a.timeZone)),S=(0,O.useCallback)(f=>{f.key==="Escape"&&(f.preventDefault(),f.stopPropagation(),P?.(!1))},[P]);return d?O.default.createElement("div",{className:p.month,style:m?.month,ref:o,...n},O.default.createElement(G,{onPress:()=>P(!s),onKeyDown:S,className:p?.picker?.button,style:m?.picker?.button,ref:o,"data-expanded":c(s)},O.default.createElement("span",{key:r.month,"aria-hidden":!0},h),O.default.createElement(Ve,{role:"chevron-down",className:p?.picker?.buttonIcon,style:m?.picker?.buttonIcon}))):O.default.createElement("div",{className:p.month,style:m?.month,ref:o,...n},O.default.createElement("span",{key:r.month,"aria-hidden":!0},h))},se=ct;var ie=b(require("react")),pt=e=>ie.createElement("svg",{"aria-hidden":"true",role:"presentation",width:20,height:20,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},ie.createElement("path",{d:"m12.5 15-5-5 5-5",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"})),te=pt;var le=b(require("react")),ut=e=>le.createElement("svg",{"aria-hidden":"true",role:"presentation",width:20,height:20,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},le.createElement("path",{d:"m7.5 15 5-5-5-5",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"})),re=ut;var B=b(require("react")),ce=require("@react-aria/i18n");var R=b(require("react")),Oe=b(require("lodash.debounce")),Fe=b(require("scroll-into-view-if-needed"));function Ie(e,t){let r=Math.max(0,Math.min(e.right,t.right)-Math.max(e.left,t.left)),n=Math.max(0,Math.min(e.bottom,t.bottom)-Math.max(e.top,t.top));return r*n}var Ae=require("react"),ft=()=>{let e=(0,Ae.useRef)(new Map);function t(){return e.current||(e.current=new Map),e.current}function r(n,a){n?e.current.set(a,n):e.current.delete(a)}return[r,t]},Ge=ft;var Y=b(require("react")),ht=({className:e,total:t,...r})=>Y.default.createElement(Y.default.Fragment,null,Array.from({length:t},(n,a)=>Y.default.createElement("div",{key:a,"aria-hidden":"true",className:e,role:"picker-item-empty",tabIndex:-1,...r},"\xA0"))),de=(0,Y.memo)(ht);var yt=200,gt=e=>{let{initialDate:t,options:r=[],className:n,style:a,listClassName:o,itemClassName:d,listStyle:p,itemStyle:m,listType:s="month",highlightRef:P,...i}=e,h=(0,R.useRef)(null),[S,f]=Ge(),{state:y,isPickerExpanded:C,headerRef:D,setPickerExpanded:w,pickerEmptyItem:M}=H(),L=(0,R.useCallback)((g,u)=>{if(!(g.target instanceof HTMLElement))return;let v=f(),E=Array.from(v.values()).findLast(ze=>{let Je=ze.getBoundingClientRect(),ue=u?.getBoundingClientRect();return ue?Ie(Je,ue)>50:!1}),q=Number(E?.getAttribute("data-value"));if(!q)return;let qe=y.focusedDate.set({[s]:q});y.setFocusedDate(qe)},[y,t,s,C]);(0,R.useEffect)(()=>{let g=h.current,u=P;if(!u)return;let v=(0,Oe.default)(V=>L(V,u),yt);return g?.addEventListener("scroll",v),()=>{v&&g?.removeEventListener("scroll",v)}},[L]);let k=(0,R.useCallback)((g,u=!0)=>{let V=f().get(g);V&&(0,Fe.default)(V,{scrollMode:"always",behavior:u?"smooth":"instant",boundary:h.current})},[f]),T=(0,R.useCallback)(g=>{let u=g.target,v=Number(u.getAttribute("data-value"));if(v===y.focusedDate[s]){w?.(!1);return}v&&k(v)},[y]),Z=(0,R.useCallback)((g,u)=>{let v=f();if(!v.get(u))return;let E=u;switch(g.key){case"ArrowDown":E=u+1;break;case"ArrowUp":E=u-1;break;case"Home":E=0;break;case"End":E=r.length-1;break;case"PageUp":E=u-3;break;case"PageDown":E=u+3;break;case"Escape":case"Enter":case" ":w?.(!1),D?.current?.focus();return}v.get(E)?.focus()},[f,r.length,w,D]);return(0,R.useEffect)(()=>{C&&k(t,!1)},[C]),R.default.createElement("div",{ref:h,className:x(o,n),style:N({overflowY:"scroll"},a,p),role:`picker-${s}-list`,...i},R.default.createElement(de,{total:M,className:d,style:m}),r.map(g=>R.default.createElement(G,{role:`picker-${s}-item`,key:`picker-${s}-${g.value}`,ref:u=>S(u,g.value),className:d,style:m,"data-value":g.value,tabIndex:!C||y.focusedDate?.[s]!==g.value?-1:0,onKeyDown:u=>Z(u,g.value),onPress:u=>T(u)},g.label)),R.default.createElement(de,{total:M,className:d}))},me=(0,R.memo)(gt);var Ct=e=>{let{date:t,currentMonth:r,className:n,style:a,...o}=e,{state:d,isPickerExpanded:p,classNames:m,styles:s}=H(),[P,i]=(0,B.useState)(null),h=(0,ce.useDateFormatter)({month:"long",era:r.calendar.identifier==="gregory"&&r.era==="BC"?"short":void 0,calendar:r.calendar.identifier,timeZone:d.timeZone}),S=(0,ce.useDateFormatter)({year:"numeric",timeZone:d.timeZone}),f=(0,B.useMemo)(()=>ke(d.minValue,d.maxValue)?.map(C=>({value:C.year,label:S.format(C.toDate(d.timeZone))})),[d.minValue,d.maxValue,S,d.timeZone]),y=(0,B.useMemo)(()=>ve(t).map(C=>({value:C.month,label:h.format(C.toDate(d.timeZone))})),[t,h,d.timeZone]);return B.default.createElement("div",{...o,"data-expanded":c(p),className:x(m?.picker?.root,n),style:N({height:"var(--picker-height)"},a,s?.picker?.root),role:"picker-root",inert:p?void 0:"true"},B.default.createElement("div",{ref:i,className:m?.picker?.highlight,style:s?.picker?.highlight,role:"picker-highlight"}),B.default.createElement(me,{highlightRef:P,options:y,listClassName:x(m?.picker?.list,m?.picker?.monthList),listStyle:N(s?.picker?.list,s?.picker?.monthList),itemClassName:x(m?.picker?.item,m?.picker?.monthItem),itemStyle:N(s?.picker?.item,s?.picker?.monthItem),initialDate:t.month,listType:"month"}),B.default.createElement(me,{highlightRef:P,options:f,listClassName:x(m?.picker?.list,m?.picker?.yearList),listStyle:N(s?.picker?.list,s?.picker?.yearList),itemClassName:x(m?.picker?.item,m?.picker?.yearItem),itemStyle:N(s?.picker?.item,s?.picker?.yearItem),initialDate:t.year,listType:"year"}))},Ue=(0,B.memo)(Ct);var Pt=(0,l.forwardRef)((e,t)=>{let{calendarProps:r,headerLayout:n="apart",className:a,prevButtonProps:o,nextButtonProps:d,header:p,footer:m}=e,{state:s,visibleMonths:P,classNames:i,withPicker:h,pickerHeight:S,isPickerExpanded:f,styles:y}=H(),{direction:C}=(0,Ze.useLocale)(),D=s.visibleRange.start,w=C==="rtl",M=[],L=[];for(let k=0;k<P;k++){let T=D.add({months:k}),Z=l.default.createElement(l.Fragment,{key:`calendar-header-${k}`},k===0&&l.default.createElement(G,{...o,className:x(i.nav,w?i.nextButton:i.previousButton),role:w?"next-button":"previous-button"},w?l.default.createElement(re,null):l.default.createElement(te,null)),l.default.createElement(se,{"data-layout":n,currentMonth:D,date:T}),k===P-1&&l.default.createElement(G,{...d,className:x(i.nav,w?i.previousButton:i.nextButton),role:w?"previous-button":"next-button"},w?l.default.createElement(te,null):l.default.createElement(re,null))),g=l.default.createElement("div",{className:i.navGroup,style:y?.navGroup},l.default.createElement(G,{...o,className:x(i.nav,i.nextButton),role:"next-button"},l.default.createElement(te,null)),l.default.createElement(G,{...d,className:x(i.nav,i.previousButton),role:"previous-button"},l.default.createElement(re,null))),u=l.default.createElement(l.Fragment,{key:`calendar-header-${k}`},n==="left"?g:null,l.default.createElement(se,{"data-layout":n,currentMonth:D,date:T}),n==="right"?g:null);M.push(n==="apart"?Z:u);let v=h?l.default.createElement("div",{key:`calendar-month-${k}`,className:i.gridGroup,role:"calendar-month-group"},l.default.createElement(Ue,{key:`calendar-picker-${k}`,"data-index":k,currentMonth:D,date:T}),l.default.createElement(ae,{...e,key:`calendar-grid-${k}`,currentMonth:D.month,startDate:T})):l.default.createElement("div",{key:`calendar-month-${k}`,className:i.gridGroup,role:"calendar-month-group"},l.default.createElement(ae,{...e,key:`calendar-grid-${k}`,currentMonth:D.month,startDate:T}));L.push(v)}return l.default.createElement("div",{...(0,$e.mergeProps)(r),style:N({"--picker-height":`${S}px`},r?.style,y?.root),"data-picker-expanded":c(f),className:x(a,i.root),ref:t},p,l.default.createElement(pe.VisuallyHidden,null,l.default.createElement("h2",null,r["aria-label"])),l.default.createElement("div",{className:i.container,style:y?.container},l.default.createElement("div",{className:i.header,style:y?.header},M),l.default.createElement("div",{className:i.gridWrapper,style:N(h&&f?{minHeight:"var(--picker-height)",maxHeight:"var(--picker-height)",overflowY:"hidden"}:{},y?.gridWrapper)},L)),l.default.createElement(pe.VisuallyHidden,null,l.default.createElement("button",{"aria-label":d["aria-label"],disabled:d.isDisabled,tabIndex:-1,onClick:()=>s.focusNextPage()})),f?null:m)}),We=(0,l.memo)(Pt);function _e(e,t){let{minValue:r=new _.CalendarDate(1900,1,1),maxValue:n=new _.CalendarDate(2099,12,31),className:a,classNames:o={},styles:d={},visibleMonths:p=1,weekdayStyle:m="short",createCalendar:s,withPicker:P=!1,pickerHeight:i=278,pickerEmptyItem:h=3,pickerOpen:S,defaultPickerOpen:f=!1,onPickerOpenChange:y,...C}=e,{locale:D}=(0,je.useLocale)(),w=P?1:Math.max(1,Math.min(p,3)),M=(0,F.useMemo)(()=>({months:w}),[w]),L=(0,Ye.useRangeCalendarState)({...e,locale:D,minValue:r,maxValue:n,visibleDuration:M,createCalendar:!s||typeof s!="function"?_.createCalendar:s}),k=(0,F.useRef)(null),{calendarProps:T,prevButtonProps:Z,nextButtonProps:g,title:u,errorMessageProps:v}=(0,Ke.useRangeCalendar)(e,L,k),[V,E]=he({prop:S,defaultProp:f,onChange:y}),q=J(k,t);return F.default.createElement(Ce,{value:{state:L,visibleMonths:w,weekdayStyle:m,classNames:o,styles:d,withPicker:P,pickerHeight:i,pickerEmptyItem:h,isPickerExpanded:V,setPickerExpanded:E}},F.default.createElement(We,{ref:q,calendarProps:T,prevButtonProps:Z,nextButtonProps:g,title:u,errorMessageProps:v,className:a,...C}))}_e.displayName="RangeCalendar";var kt=(0,F.forwardRef)(_e);