@telsho/react-google-flight-datepicker 1.1.3 → 1.1.5

package/dist/index.js

@@ -1,2 +1,1394 @@
-"use strict";var Mt=Object.create;var Ge=Object.defineProperty,zt=Object.defineProperties,Lt=Object.getOwnPropertyDescriptor,Et=Object.getOwnPropertyDescriptors,St=Object.getOwnPropertyNames,Be=Object.getOwnPropertySymbols,Pt=Object.getPrototypeOf,je=Object.prototype.hasOwnProperty,ct=Object.prototype.propertyIsEnumerable;var ot=(e,t,o)=>t in e?Ge(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,v=(e,t)=>{for(var o in t||(t={}))je.call(t,o)&&ot(e,o,t[o]);if(Be)for(var o of Be(t))ct.call(t,o)&&ot(e,o,t[o]);return e},w=(e,t)=>zt(e,Et(t));var He=(e,t)=>{var o={};for(var a in e)je.call(e,a)&&t.indexOf(a)<0&&(o[a]=e[a]);if(e!=null&&Be)for(var a of Be(e))t.indexOf(a)<0&&ct.call(e,a)&&(o[a]=e[a]);return o};var Kt=(e,t)=>{for(var o in t)Ge(e,o,{get:t[o],enumerable:!0})},at=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of St(t))!je.call(e,i)&&i!==o&&Ge(e,i,{get:()=>t[i],enumerable:!(a=Lt(t,i))||a.enumerable});return e};var F=(e,t,o)=>(o=e!=null?Mt(Pt(e)):{},at(t||!e||!e.__esModule?Ge(o,"default",{value:e,enumerable:!0}):o,e)),$t=e=>at(Ge({},"__esModule",{value:!0}),e);var lo={};Kt(lo,{RangeDatePicker:()=>Ot,SingleDatePicker:()=>Ut});module.exports=$t(lo);var b=require("react"),M=F(require("dayjs")),Zt=F(require("classnames")),Rt=F(require("dayjs/plugin/localeData"));var gt=F(require("dayjs"));function Fe(e,t,o){let a=[],i=new Date(e,t,1),d=new Date(e,t+1,0).getDate(),A=1,g=i.getDay()===0?1:7-i.getDay()+1;for(o==="sunday"&&(g=7-i.getDay());A<=d;)a.push({start:A,days:g-A+1}),A=g+1,g+=7,g=A===1&&g===8?1:g,g>d&&(g=d);return{totalWeek:a,totalDay:d}}function Qe(e,t){let o=[...Array(7)].map((a,i)=>(0,gt.default)().day(i).format(t==="dd"?"dd":t==="ddd"?"ddd":"dddd"));if(e==="sunday"){let a=o.pop();a&&o.unshift(a)}return o}function it(e,t){let o;return function(...i){let r=()=>{o=null,e.apply(this,i)};o&&clearTimeout(o),o=setTimeout(r,t)}}var k=require("react"),Ze=F(require("dayjs"));var pe=require("react/jsx-runtime"),lt=(0,k.createContext)(null),rt=(0,k.createContext)(null),nt=(0,k.createContext)(null),dt=(0,k.createContext)(null),_t=(0,k.createContext)(null),T=()=>{let e=(0,k.useContext)(lt);if(!e)throw new Error("useDateState must be used within DatePickerProvider");return e},N=()=>{let e=(0,k.useContext)(rt);if(!e)throw new Error("useDatePickerConfig must be used within DatePickerProvider");return e},xe=()=>{let e=(0,k.useContext)(nt);if(!e)throw new Error("useUIState must be used within DatePickerProvider");return e},Y=()=>{let e=(0,k.useContext)(dt);if(!e)throw new Error("useDisplayCustomization must be used within DatePickerProvider");return e};var qt=async e=>{if(e==="en")return!0;try{return await import(`dayjs/locale/${e}.js`),!0}catch(t){return console.error(`Failed to load locale ${e}:`,t),!1}},It=({children:e,dateState:t,config:o,uiState:a,display:i,locale:r="en"})=>{let[d,A]=(0,k.useState)({currentLocale:"en",isLocaleReady:r==="en"});return(0,k.useEffect)(()=>{r!=="en"?(A(g=>w(v({},g),{isLocaleReady:!1})),qt(r).then(g=>{g?(Ze.default.locale(r),A({currentLocale:r,isLocaleReady:!0})):(Ze.default.locale("en"),A({currentLocale:"en",isLocaleReady:!0}))})):(Ze.default.locale("en"),A({currentLocale:"en",isLocaleReady:!0}))},[r]),d.isLocaleReady?(0,pe.jsx)(_t.Provider,{value:d,children:(0,pe.jsx)(lt.Provider,{value:t,children:(0,pe.jsx)(rt.Provider,{value:o,children:(0,pe.jsx)(nt.Provider,{value:a,children:(0,pe.jsx)(dt.Provider,{value:i,children:e})})})})}):null};var mo=require("react");var Me=require("react/jsx-runtime"),eo=e=>(0,Me.jsx)("svg",w(v({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},e),{children:(0,Me.jsx)("path",{d:"M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20a2 2 0 002 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z"})})),Re=eo;var me=require("react"),st=F(require("classnames")),ke=F(require("dayjs"));var Xo=require("react");var ze=require("react/jsx-runtime"),to=e=>(0,ze.jsx)("svg",w(v({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},e),{children:(0,ze.jsx)("path",{d:"M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z"})})),Oe=to;var Ho=require("react");var Le=require("react/jsx-runtime"),oo=e=>(0,Le.jsx)("svg",w(v({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},e),{children:(0,Le.jsx)("path",{d:"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"})})),Ue=oo;var L=require("react/jsx-runtime"),Ee=({type:e,showIcon:t=!1,tabIndex:o=0,nonFocusable:a=!1})=>{let[i,r]=(0,me.useState)(null),[d,A]=(0,me.useState)(!1),[g,s]=(0,me.useState)(!1),{fromDate:n,toDate:m,inputFocus:D,handleClickDateInput:Q,handleChangeDate:f}=T(),{isSingle:B,minDate:X,maxDate:h,dateFormat:c}=N(),{startDatePlaceholder:y,endDatePlaceholder:C}=Y(),G=e==="from"?n:m,P=e==="from"?y:C;(0,me.useEffect)(()=>{if(G){let U=G.clone().locale(ke.default.locale()).format("ddd, DD MMM");c&&(U=G.format(c)),r(U);let O=X?(0,ke.default)(X):null,Z=h?(0,ke.default)(h):null;O!=null&&O.add(1,"day").isAfter(G,"date")||e==="to"&&n&&G.isBefore(n.add(1,"day"),"date")?A(!0):A(!1),Z!=null&&Z.subtract(1,"day").isBefore(G,"date")?s(!0):s(!1)}else r(null)},[G,n,X,h,c,e]);let z=V=>{V.stopPropagation(),G&&f(G.subtract(1,"day"),e)},oe=V=>{V.stopPropagation(),G&&f(G.add(1,"day"),e)},p=()=>{Q(e)};return(0,L.jsxs)("div",{className:(0,st.default)("date",{"is-focus":D===e&&!B,"is-single":B}),role:"button",tabIndex:a?-1:o,onClick:p,id:`${e}-date-input-button`,children:[t&&(0,L.jsx)(Re,{className:"icon-calendar",viewBox:"0 0 24 24"}),(0,L.jsx)("div",{className:"selected-date",children:i!=null?i:(0,L.jsx)("div",{className:"date-placeholder",children:P})}),i&&(0,L.jsxs)("div",{className:"change-date-group",children:[(0,L.jsx)("button",{type:"button",className:"btn-outline change-date-button",onClick:z,tabIndex:a?-1:0,disabled:d,children:(0,L.jsx)(Oe,{viewBox:"0 0 24 24",className:"icon-arrow"})}),(0,L.jsx)("button",{type:"button",className:"btn-outline change-date-button",onClick:oe,tabIndex:a?-1:0,disabled:g,children:(0,L.jsx)(Ue,{viewBox:"0 0 24 24",className:"icon-arrow"})})]})]})};var ie=require("react/jsx-runtime"),Je=({showIcon:e=!1,nonFocusable:t=!1})=>{let{isSingle:o}=N(),{dateInputSeperator:a}=Y();return(0,ie.jsxs)("div",{className:"date-picker-input",children:[e&&(0,ie.jsx)(Re,{className:"icon-calendar mobile",viewBox:"0 0 24 24"}),(0,ie.jsxs)("div",{className:"date-picker-date-group",children:[(0,ie.jsx)(Ee,{type:"from",tabIndex:t?-1:0,showIcon:!0,nonFocusable:t}),!o&&a&&(0,ie.jsx)("div",{className:"date-input-separator",children:a}),!o&&(0,ie.jsx)(Ee,{type:"to",tabIndex:t?-1:0,showIcon:!1,nonFocusable:t})]})]})};var At=require("react-dom");var ve=require("react"),Ct=()=>{let[e,t]=(0,ve.useState)(!1);return(0,ve.useEffect)(()=>{t(!0)},[]),e};var bt=require("react/jsx-runtime"),co=({children:e=null,isMobile:t=!1})=>Ct()?t?(0,At.createPortal)((0,bt.jsx)("div",{children:e}),document.body):e:null,ut=co;var Ae=require("react"),Ft=F(require("classnames"));var So=require("react");var Se=require("react/jsx-runtime"),ao=e=>(0,Se.jsx)("svg",w(v({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 492 492"},e),{children:(0,Se.jsx)("path",{d:"M464.3 207.4l.8.2H136l103.5-103.7c5-5.1 7.8-12 7.8-19.2 0-7.2-2.7-14-7.8-19l-16.1-16.2c-5-5-11.8-7.8-19-7.8-7.2 0-14 2.8-19 7.8L7.8 227C2.8 232 0 238.8 0 246c0 7.3 2.8 14 7.8 19.2l177.5 177.4c5 5 11.8 7.8 19 7.8 7.2 0 14-2.8 19-7.8l16-16.1a26.6 26.6 0 000-37.7L134.8 284.4h330a27.9 27.9 0 0027.3-27.6V234a27.3 27.3 0 00-27.7-26.6z"})})),pt=ao;var te=F(require("react")),E=F(require("dayjs")),Dt=require("react-window"),ht=F(require("react-virtualized-auto-sizer"));var yt=require("react"),Gt=F(require("classnames")),Xt=F(require("dayjs"));var xt=require("react"),mt=F(require("classnames")),ft=F(require("dayjs"));var ee=require("react"),Pe=F(require("classnames"));var Ce=require("react/jsx-runtime"),Ke=(0,ee.forwardRef)(({dateIndex:e,dateValue:t,isEndDay:o,selected:a,hovered:i,disabled:r,totalDay:d,highlight:A,handleHoverDay:g,subText:s},n)=>{let m=(0,ee.useRef)(null),{onSelectDate:D,onHoverDate:Q}=T(),f=c=>{c.stopPropagation(),c.preventDefault(),!r&&D(t)},B=()=>{r||(Q(t),g(t))},X=(0,ee.useCallback)(()=>{if(!n||typeof n=="function")return;let c=n.current;c&&m.current&&(c.style.left=`${m.current.offsetLeft-c.offsetWidth+135}px`,c.style.top=`${m.current.offsetTop-c.offsetHeight-15}px`,c.style.visibility="visible")},[n]),h=(0,ee.useCallback)(()=>{if(!n||typeof n=="function")return;let c=n.current;c&&(c.style.visibility="hidden")},[n]);return(0,ee.useEffect)(()=>{let c=m.current;return c&&(c.addEventListener("mouseover",X),c.addEventListener("mouseleave",h)),()=>{c&&(c.removeEventListener("mouseover",X),c.removeEventListener("mouseleave",h))}},[X,h]),(0,Ce.jsxs)("div",{className:(0,Pe.default)("day",{selected:a,hovered:i,disabled:r,highlight:A,end:o,"has-subtext":!!s}),onClick:f,onMouseEnter:B,role:"button",tabIndex:-1,"data-day-index":e,"data-date-value":t.valueOf(),ref:m,children:[i&&!(o&&e===d)&&!(e===1&&a&&!o)&&(0,Ce.jsx)("div",{className:(0,Pe.default)("background-day",{"first-day":e===1,"last-day":e===d})}),(0,Ce.jsxs)("div",{className:"day-content",children:[(0,Ce.jsx)("div",{className:"text-day",children:e}),s&&(0,Ce.jsx)("div",{className:"sub-text",style:{position:"relative",zIndex:3,color:a&&!i?"#fff":"#666"},children:s})]})]})});Ke.displayName="Day";var $e=require("react/jsx-runtime"),_e=(0,xt.forwardRef)(({isFirst:e,week:t,month:o,year:a,totalDay:i,weekIndex:r,handleHoverDay:d},A)=>{let{fromDate:g,toDate:s,hoverDate:n}=T(),{minDate:m,maxDate:D,isSingle:Q,highlightToday:f}=N(),{subTextDict:B}=Y(),X=()=>Array.from({length:t.days},(h,c)=>{var U;let y=c+t.start,C=(0,ft.default)(`${a}-${o+1}-${y}`),G=m&&C.isBefore(m,"date")||D&&C.isAfter(D,"date"),P=g&&C.isSame(g,"date")||s&&C.isSame(s,"date"),z=!1,oe=f&&C.isSame(new Date,"date");g&&!g.isSame(s,"date")&&!Q&&(s&&!g.isAfter(C,"date")&&!s.isBefore(C,"date")&&(z=!0),!s&&!C.isBefore(g,"date")&&!(n&&n.isBefore(C,"date"))&&g.isBefore(n,"date")&&(z=!0));let p=s&&C.isSame(s,"date")||!s&&n&&C.isSame(n,"date"),V=B?(U=B[C.format("YYYY-MM-DD")])!=null?U:"\xA0":"";return(0,$e.jsx)(Ke,{dateIndex:y,dateValue:C,selected:P,hovered:z,highlight:oe,disabled:G,isEndDay:p,totalDay:i,handleHoverDay:d,subText:V,ref:A},c)});return(0,$e.jsx)("div",{className:(0,mt.default)("week",{first:e}),children:X()})});_e.displayName="Week";var le=require("react/jsx-runtime"),Xe=(0,yt.forwardRef)(({month:e,year:t,hidden:o=!1,isAnimating:a=!1,handleHoverDay:i,className:r},d)=>{let{startWeekDay:A,weekDayFormat:g,monthFormat:s,singleCalendar:n}=N(),m=()=>{let{totalWeek:f,totalDay:B}=Fe(t,e,A);return f.map(X=>{let h=`${t}-${e}-${X.start}`;return(0,le.jsx)(_e,{week:X,month:e,year:t,isFirst:X===f[0],totalDay:B,weekIndex:f.indexOf(X),handleHoverDay:i,ref:d},h)})},D=()=>Qe(A,g).map(B=>(0,le.jsx)("div",{className:"weekday",children:B},`weekday-${B.toLowerCase()}`)),Q=()=>{let f=(0,Xt.default)(`${t}-${e+1}-1`);return s?f.format(s):f.format("MMMM - YYYY")};return(0,le.jsxs)("div",{className:(0,Gt.default)("month-calendar",{isAnimating:a,hidden:o,single:n},r),"data-month-index":e+1,children:[(0,le.jsx)("div",{className:"month-name",children:Q()}),(0,le.jsx)("div",{className:"weekdays",children:D()}),(0,le.jsx)("div",{className:"week-container",children:m()})]})});Xe.displayName="MonthCalendar";var S=require("react/jsx-runtime"),Bt=()=>{let[e,t]=(0,te.useState)(2400),o=(0,te.useRef)(null),{fromDate:a}=T(),{startWeekDay:i,minDate:r,maxDate:d,weekDayFormat:A}=N(),{complsOpen:g}=xe(),{tooltip:s,subTextDict:n}=Y(),m=r?(0,E.default)(r).year():1900,D=r?(0,E.default)(r).month():0;(0,te.useEffect)(()=>{if(d){let c=r?(0,E.default)(r):(0,E.default)("1900-01-01");t((0,E.default)(d).diff(c,"month")+1)}},[d,r]),(0,te.useEffect)(()=>{if(o.current&&g){let c=a?(0,E.default)(a):(0,E.default)(),y=c.diff((0,E.default)("1900-01-01"),"month");r&&(y=c.diff((0,E.default)(r),"month")),o.current.scrollToItem(y+1,"smart")}},[g,a,r]);let Q=c=>{let y=c+D,C=m+Math.floor(y/12),G=y%12;return{year:C,month:G}},f=te.default.memo(({index:c,style:y})=>{let{year:C,month:G}=Q(c);return(0,S.jsx)("div",{style:y,children:(0,S.jsx)(Xe,{month:G,year:C,hidden:!1,isAnimating:!1,handleHoverDay:()=>{}})})});f.displayName="CalendarRow";let B=c=>{let{year:y,month:C}=Q(c),{totalWeek:G}=Fe(y,C,i||"monday");return G.length*48+34},X=()=>(0,S.jsx)(ht.default,{children:({height:c,width:y})=>(0,S.jsx)(Dt.VariableSizeList,{ref:o,width:y,height:c-36,itemCount:e,itemSize:B,children:f})});return(0,S.jsx)("div",{className:"calendar-wrapper",children:(0,S.jsxs)("div",{className:"calendar-content",children:[(0,S.jsx)("div",{className:"weekdays mobile",children:Qe(i||"monday",A).map((y,C)=>(0,S.jsx)("div",{className:"weekday",children:y},C))}),X()]})})};var u=require("react"),fe=F(require("classnames")),De=F(require("dayjs"));var j=require("react/jsx-runtime"),go=()=>{let[e,t]=(0,u.useState)(!1);return(0,u.useEffect)(()=>{t(!0)},[]),e},Ht=({dateChanged:e=null})=>{let t=go(),o=(0,u.useRef)(null),a=(0,u.useRef)(null),[i,r]=(0,u.useState)(0),[d,A]=(0,u.useState)([]),[g,s]=(0,u.useState)(null),[n,m]=(0,u.useState)(!1),[D,Q]=(0,u.useState)(!1),[f,B]=(0,u.useState)(0),[X,h]=(0,u.useState)(null),[c,y]=(0,u.useState)(!1),{fromDate:C}=T(),{minDate:G,maxDate:P,singleCalendar:z}=N(),{complsOpen:oe}=xe(),{tooltip:p}=Y(),V=(0,u.useCallback)(I=>[I.subtract(1,"month"),I,I.add(1,"month"),I.add(2,"month")],[]);(0,u.useEffect)(()=>{if(!t||!o.current)return;let I=()=>{let J=o.current.offsetWidth,R=window.getComputedStyle(o.current),$=z?J+parseInt(R.marginLeft)-8:J/2;B($)};I();let x=new ResizeObserver(I);return x.observe(o.current),()=>x.disconnect()},[t,z]),(0,u.useEffect)(()=>{s(C!=null?C:(0,De.default)())},[oe,C]),(0,u.useEffect)(()=>{if(!g)return;let I=G?(0,De.default)(G):null,x=P?(0,De.default)(P):null;m(!!(I&&g.isBefore(I.add(1,"month"),"month"))),Q(!!(x&&g.isAfter(x.subtract(2,"month"),"month"))),A(V(g))},[g,G,P,V]),(0,u.useEffect)(()=>{if(!e||!g)return;let I=e.diff(g,"month");I<-1&&Z(),I>1&&O()},[e,g]);let U=(0,u.useCallback)(I=>()=>{if(I==="next"&&D||I==="prev"&&n||c)return;y(!0),r(I==="next"?-f:f);let x=setTimeout(()=>{s(J=>{let R=I==="next"?J.add(1,"month"):J.subtract(1,"month");return A(V(R)),R}),r(0),y(!1)},200);return()=>clearTimeout(x)},[D,n,c,f,V]),[O,Z]=(0,u.useMemo)(()=>[U("next"),U("prev")],[U]),ce=(0,u.useCallback)(()=>{if(!t||!o.current)return;let x=o.current.querySelector(".day.selected, .month-calendar:not(.hidden) .day:not(.disabled)");x==null||x.focus()},[t]),ne=(0,u.useCallback)(I=>{var Ie,ue;let x=I.target,J=x.getAttribute("data-day-index");if(!J)return;I.preventDefault();let R=x.closest(".calendar-wrapper"),$=parseInt((Ie=x.dataset.dateValue)!=null?Ie:"0"),de=(0,De.default)($),Ye=de.endOf("month").date(),_=parseInt(J);switch(I.key){case"ArrowLeft":_--;break;case"ArrowUp":_-=7;break;case"ArrowRight":_++;break;case"ArrowDown":_+=7;break;case" ":x.click();return;default:return}if(_>0&&_<=Ye)(ue=R==null?void 0:R.querySelector(`[data-day-index="${_}"]`))==null||ue.focus();else{let q=de.add(_-parseInt(J),"day"),ae=q.diff(g,"month");ae>1&&!D&&O(),ae<0&&!n&&Z(),setTimeout(()=>{var se;(se=R==null?void 0:R.querySelector(`[data-month-index="${q.month()+1}"] [data-day-index="${q.date()}"]`))==null||se.focus()},200)}},[g,D,n,O,Z]),Te=(0,u.useMemo)(()=>{var x;if(!p||!t)return null;let I=typeof p=="function"?p((x=X==null?void 0:X.toDate())!=null?x:new Date):p;return(0,j.jsx)("div",{id:"day-tooltip",className:"tooltip-text",ref:a,children:I})},[p,X,t]),K=(0,u.useMemo)(()=>d.map((I,x)=>{let J=x===1||x===2,R=c&&i<0&&x===3,$=c&&i>0&&x===0;return(0,j.jsx)(Xe,{hidden:!J&&!R&&!$,isAnimating:R||$,month:I.month(),year:I.year(),handleHoverDay:h,ref:a,className:(0,fe.default)({"slide-next":R,"slide-prev":$})},`${I.year()}-${I.month()}`)}),[d,c,i]);return(0,j.jsxs)("div",{className:"relative",children:[Te,(0,j.jsxs)("div",{className:(0,fe.default)("calendar-wrapper",{single:z}),ref:o,onKeyDown:ne,role:"grid","aria-label":"Calendar",children:[(0,j.jsx)("div",{className:(0,fe.default)("calendar-content",{isAnimating:c}),style:{transform:`translateX(${i}px)`},children:K}),(0,j.jsxs)("div",{className:"calendar-flippers",children:[(0,j.jsx)("button",{className:(0,fe.default)("flipper-button",{disabled:n}),onClick:Z,onKeyDown:I=>I.key===" "&&Z(),disabled:n,"aria-label":"Previous month",children:(0,j.jsx)(Oe,{viewBox:"0 0 24 24"})}),(0,j.jsx)("button",{className:(0,fe.default)("flipper-button",{disabled:D}),onClick:O,onKeyDown:I=>I.key===" "&&O(),disabled:D,"aria-label":"Next month",onBlur:ce,children:(0,j.jsx)(Ue,{viewBox:"0 0 24 24"})})]})]})]})};var W=require("react/jsx-runtime"),Qt=({containerRef:e})=>{let[t,o]=(0,Ae.useState)(!1),[a,i]=(0,Ae.useState)(null),r=(0,Ae.useRef)(null),d=e||r,{handleChangeDate:A,handleReset:g}=T(),{singleCalendar:s,expandDirection:n}=N(),{complsOpen:m,isMobile:D,toggleDialog:Q}=xe(),{hideDialogHeader:f,hideDialogFooter:B}=Y(),X=(h,c)=>{i(h),A(h,c)};return(0,Ae.useEffect)(()=>{m&&!t&&o(!0),m&&setTimeout(()=>{var c;let h=(c=d.current)==null?void 0:c.querySelector("#start-date-input-button");h&&h.focus()},50)},[m,d,t]),(0,W.jsxs)("div",{className:(0,Ft.default)("dialog-date-picker",{open:m,hide:!m&&t,single:s&&!D,"expand-left":n==="left","expand-right":n==="right"}),ref:d,children:[!f&&(0,W.jsxs)("div",{className:"dialog-header",children:[(0,W.jsx)("button",{type:"button",className:"btn-outline back-button",onClick:Q,children:(0,W.jsx)(pt,{viewBox:"0 0 492 492"})}),(0,W.jsx)(Je,{showIcon:!0,nonFocusable:!m}),(0,W.jsx)("button",{type:"button",className:"btn-outline reset-button",onClick:g,children:"Reset"})]}),(0,W.jsx)("div",{className:"dialog-content",children:D?(0,W.jsx)(Bt,{}):(0,W.jsx)(Ht,{dateChanged:a})}),!B&&(0,W.jsxs)("div",{className:"dialog-footer",children:[(0,W.jsx)("button",{type:"button",className:"submit-button",onClick:Q,tabIndex:0,children:"Done"}),(0,W.jsx)("button",{type:"button",className:"btn-outline reset-button mobile",onClick:g,children:"Reset"})]})]})};var re=require("react/jsx-runtime");M.default.extend(Rt.default);var io=({startDate:e=null,endDate:t=null,className:o="",disabled:a=!1,startDatePlaceholder:i,endDatePlaceholder:r,onChange:d,onFocus:A=()=>{},startWeekDay:g="monday",minDate:s=null,maxDate:n=null,weekDayFormat:m="dd",dateFormat:D="",monthFormat:Q="",highlightToday:f=!1,dateInputSeperator:B=null,hideDialogHeader:X=!1,hideDialogFooter:h=!1,hideDialogAfterSelectEndDate:c=!1,isOpen:y=!1,onCloseCalendar:C,tooltip:G="",subTextDict:P=null,expandDirection:z="right",locale:oe="en",isSingle:p=!1,singleCalendar:V=!1})=>{let[U,O]=(0,b.useState)(y),[Z,ce]=(0,b.useState)(p?"from":null),[ne,Te]=(0,b.useState)(e?(0,M.default)(e):void 0),[K,I]=(0,b.useState)(t?(0,M.default)(t):void 0),[x,J]=(0,b.useState)(),[R,$]=(0,b.useState)(!1),[de,Ye]=(0,b.useState)(!1),Ie=(()=>{let[l,H]=(0,b.useState)(!1);return(0,b.useEffect)(()=>{H(!0)},[]),l})(),ue=(0,b.useRef)(null),q=(0,b.useRef)(null),ae=(0,b.useRef)(null),se=(0,b.useCallback)(()=>{Ie&&$(window.innerWidth<768)},[Ie]),tt=it(()=>{let l=q.current?q.current.toDate():null,H=!p&&ae.current?ae.current.toDate():null;p?d(l,null):d(l,H)},20),ye=(l,H=!1)=>{Te(l||void 0),q.current=l||null,H&&tt()},be=(l,H=!1)=>{p||(I(l||void 0),ae.current=l||null,H&&tt())};(0,b.useLayoutEffect)(()=>{if(Ie)return se(),window.addEventListener("resize",se),()=>window.removeEventListener("resize",se)},[Ie,se]),(0,b.useEffect)(()=>{Ye(!0);let l=H=>{ue.current&&H.target instanceof Node&&!ue.current.contains(H.target)&&window.innerWidth>=768&&O(!1)};return document.addEventListener("click",l),()=>document.removeEventListener("click",l)},[]),(0,b.useEffect)(()=>{let l=e?(0,M.default)(e):null;q.current=l,ye(l,!1)},[e]),(0,b.useEffect)(()=>{if(!p){let l=t?(0,M.default)(t):null;ae.current=l,be(l,!1)}},[t,p]),(0,b.useEffect)(()=>{var l,H;if(!U&&de){let ge=((l=q.current)==null?void 0:l.toDate())||null,he=((H=ae.current)==null?void 0:H.toDate())||null;p?C(ge,null):C(ge,he)}},[U,de,p,C]),(0,b.useEffect)(()=>{O(y)},[y]),(0,b.useEffect)(()=>{de&&A(Z==="from"?"Start Date":Z==="to"?"End Date":"")},[Z,de,A]);let kt=()=>{O(!U)},Jt=l=>{a||!p&&l==="to"&&!ne||(U||O(!0),ce(l))},vt=(0,b.useCallback)(l=>{let H=s?(0,M.default)(s):null,ge=n?(0,M.default)(n):null;H&&H.isAfter(l,"date")||ge&&ge.isBefore(l,"date")||(p?(ye(l,!0),c&&setTimeout(()=>O(!1),50)):Z==="from"||ne&&l.isBefore(ne,"date")?(ye(l,!0),K&&l.isAfter(K,"date")&&be(null,!0),ce("to")):(be(l,!0),ce(null),c&&setTimeout(()=>O(!1),50)))},[s,n,p,c,Z,ne,K]),wt=l=>{J(l)},Nt=()=>{J(void 0),ye(null,!0),p||be(null,!0),ce("from")},Wt=(0,b.useCallback)((l,H)=>{let ge=s?(0,M.default)(s):null,he=n?(0,M.default)(n):null;ge&&ge.isAfter(l,"date")||he&&he.isBefore(l,"date")||(H==="from"||p?(ce("from"),ye(l,!0),!p&&K&&l.isAfter(K,"date")&&be(null,!0)):(ce("to"),be(l,!0)))},[s,n,p,K,Z]),Vt={fromDate:ne,toDate:K,hoverDate:x,inputFocus:Z,onSelectDate:vt,onHoverDate:wt,handleChangeDate:Wt,handleReset:Nt,handleClickDateInput:Jt},Tt={isSingle:p,startWeekDay:g,minDate:s?(0,M.default)(s).toDate():null,maxDate:n?(0,M.default)(n).toDate():null,weekDayFormat:m,dateFormat:D,monthFormat:Q,highlightToday:f,singleCalendar:V,expandDirection:z,locale:oe},Yt={complsOpen:U,isMobile:R,disabled:a,toggleDialog:kt},jt={startDatePlaceholder:i,endDatePlaceholder:r,dateInputSeperator:B,hideDialogHeader:X,hideDialogFooter:h,hideDialogAfterSelectEndDate:c,tooltip:G,subTextDict:P};return(0,re.jsx)("div",{className:"react-google-flight-datepicker",children:(0,re.jsx)("div",{className:(0,Zt.default)("date-picker",o,{disabled:a}),ref:ue,children:(0,re.jsxs)(It,{dateState:Vt,config:Tt,uiState:Yt,display:jt,locale:oe,children:[(0,re.jsx)(Je,{}),(0,re.jsx)(ut,{children:(0,re.jsx)(Qt,{})})]})})})},we=io;var Ne=require("react"),Ve=require("react/jsx-runtime"),We=({children:e})=>{let[t,o]=(0,Ne.useState)(!1);return(0,Ne.useEffect)(()=>{o(!0)},[]),t?(0,Ve.jsx)(Ve.Fragment,{children:e}):null};var qe=require("react/jsx-runtime"),Ot=r=>{var d=r,{onChange:e=()=>{},onCloseCalendar:t=()=>{},startDatePlaceholder:o="Start date",endDatePlaceholder:a="End date"}=d,i=He(d,["onChange","onCloseCalendar","startDatePlaceholder","endDatePlaceholder"]);return(0,qe.jsx)(We,{children:(0,qe.jsx)(we,w(v({},i),{isSingle:!1,startDate:i.startDate,endDate:i.endDate,startDatePlaceholder:o,endDatePlaceholder:a,onChange:e,onCloseCalendar:t}))})};var et=require("react/jsx-runtime"),Ut=i=>{var r=i,{onChange:e=()=>{},onCloseCalendar:t=()=>{},startDatePlaceholder:o="Date"}=r,a=He(r,["onChange","onCloseCalendar","startDatePlaceholder"]);return(0,et.jsx)(We,{children:(0,et.jsx)(we,w(v({},a),{endDate:null,isSingle:!0,startDate:a.startDate,startDatePlaceholder:o,onChange:d=>e(d),onCloseCalendar:d=>t(d)}))})};
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/lib/index.ts
+var index_exports = {};
+__export(index_exports, {
+  RangeDatePicker: () => RangeDatePicker,
+  SingleDatePicker: () => SingleDatePicker
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/lib/components/DatePicker/BaseDatePicker.tsx
+var import_react10 = require("react");
+var import_dayjs8 = __toESM(require("dayjs"));
+var import_classnames7 = __toESM(require("classnames"));
+var import_localeData = __toESM(require("dayjs/plugin/localeData"));
+
+// src/lib/helpers/index.ts
+var import_dayjs = __toESM(require("dayjs"));
+function getMonthInfo(year, month, startDay) {
+  const weeks = [];
+  const firstDate = new Date(year, month, 1);
+  const lastDate = new Date(year, month + 1, 0);
+  const numDays = lastDate.getDate();
+  let start = 1;
+  let end = firstDate.getDay() === 0 ? 1 : 7 - firstDate.getDay() + 1;
+  if (startDay === "sunday") {
+    end = 7 - firstDate.getDay();
+  }
+  while (start <= numDays) {
+    weeks.push({ start, days: end - start + 1 });
+    start = end + 1;
+    end += 7;
+    end = start === 1 && end === 8 ? 1 : end;
+    if (end > numDays) {
+      end = numDays;
+    }
+  }
+  return { totalWeek: weeks, totalDay: numDays };
+}
+function getWeekDay(startWeekDay, weekDayFormat) {
+  const days = [...Array(7)].map(
+    (_, i) => (0, import_dayjs.default)().day(i).format(weekDayFormat === "dd" ? "dd" : weekDayFormat === "ddd" ? "ddd" : "dddd")
+  );
+  if (startWeekDay === "sunday") {
+    const last = days.pop();
+    if (last) {
+      days.unshift(last);
+    }
+  }
+  return days;
+}
+function debounce(func, wait) {
+  let timeout;
+  return function executedFunction(...args) {
+    const later = () => {
+      timeout = null;
+      func.apply(this, args);
+    };
+    if (timeout) {
+      clearTimeout(timeout);
+    }
+    timeout = setTimeout(later, wait);
+  };
+}
+
+// src/lib/components/DatePicker/DatePickerProvider.tsx
+var import_react = require("react");
+var import_dayjs2 = __toESM(require("dayjs"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var DateStateContext = (0, import_react.createContext)(null);
+var DatePickerConfigContext = (0, import_react.createContext)(null);
+var UIStateContext = (0, import_react.createContext)(null);
+var DisplayContext = (0, import_react.createContext)(null);
+var LocaleContext = (0, import_react.createContext)(null);
+var useDateState = () => {
+  const context = (0, import_react.useContext)(DateStateContext);
+  if (!context) throw new Error("useDateState must be used within DatePickerProvider");
+  return context;
+};
+var useDatePickerConfig = () => {
+  const context = (0, import_react.useContext)(DatePickerConfigContext);
+  if (!context) throw new Error("useDatePickerConfig must be used within DatePickerProvider");
+  return context;
+};
+var useUIState = () => {
+  const context = (0, import_react.useContext)(UIStateContext);
+  if (!context) throw new Error("useUIState must be used within DatePickerProvider");
+  return context;
+};
+var useDisplayCustomization = () => {
+  const context = (0, import_react.useContext)(DisplayContext);
+  if (!context) throw new Error("useDisplayCustomization must be used within DatePickerProvider");
+  return context;
+};
+var loadLocale = async (locale) => {
+  if (locale === "en") return true;
+  try {
+    await import(`dayjs/locale/${locale}.js`);
+    return true;
+  } catch (error) {
+    console.error(`Failed to load locale ${locale}:`, error);
+    return false;
+  }
+};
+var DatePickerProvider = ({
+  children,
+  dateState,
+  config,
+  uiState,
+  display,
+  locale = "en"
+}) => {
+  const [localeState, setLocaleState] = (0, import_react.useState)({
+    currentLocale: "en",
+    isLocaleReady: locale === "en"
+  });
+  (0, import_react.useEffect)(() => {
+    if (locale !== "en") {
+      setLocaleState((prev) => ({ ...prev, isLocaleReady: false }));
+      loadLocale(locale).then((success) => {
+        if (success) {
+          import_dayjs2.default.locale(locale);
+          setLocaleState({
+            currentLocale: locale,
+            isLocaleReady: true
+          });
+        } else {
+          import_dayjs2.default.locale("en");
+          setLocaleState({
+            currentLocale: "en",
+            isLocaleReady: true
+          });
+        }
+      });
+    } else {
+      import_dayjs2.default.locale("en");
+      setLocaleState({
+        currentLocale: "en",
+        isLocaleReady: true
+      });
+    }
+  }, [locale]);
+  if (!localeState.isLocaleReady) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LocaleContext.Provider, { value: localeState, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DateStateContext.Provider, { value: dateState, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DatePickerConfigContext.Provider, { value: config, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(UIStateContext.Provider, { value: uiState, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DisplayContext.Provider, { value: display, children }) }) }) }) });
+};
+
+// src/lib/assets/svg/calendar.svg
+var React2 = __toESM(require("react"));
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var SvgCalendar = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20a2 2 0 002 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z" }) });
+var calendar_default = SvgCalendar;
+
+// src/lib/components/DatePicker/DateInput.tsx
+var import_react2 = require("react");
+var import_classnames = __toESM(require("classnames"));
+var import_dayjs3 = __toESM(require("dayjs"));
+
+// src/lib/assets/svg/prev.svg
+var React3 = __toESM(require("react"));
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var SvgPrev = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z" }) });
+var prev_default = SvgPrev;
+
+// src/lib/assets/svg/next.svg
+var React4 = __toESM(require("react"));
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SvgNext = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" }) });
+var next_default = SvgNext;
+
+// src/lib/components/DatePicker/DateInput.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var DateInput = ({
+  type,
+  showIcon = false,
+  tabIndex = 0,
+  nonFocusable = false
+}) => {
+  const [formattedDate, setFormattedDate] = (0, import_react2.useState)(null);
+  const [disablePrev, setDisablePrev] = (0, import_react2.useState)(false);
+  const [disableNext, setDisableNext] = (0, import_react2.useState)(false);
+  const {
+    fromDate,
+    toDate,
+    inputFocus,
+    handleClickDateInput,
+    handleChangeDate
+  } = useDateState();
+  const {
+    isSingle,
+    minDate,
+    maxDate,
+    dateFormat
+  } = useDatePickerConfig();
+  const {
+    startDatePlaceholder,
+    endDatePlaceholder
+  } = useDisplayCustomization();
+  const value = type === "from" ? fromDate : toDate;
+  const placeholder = type === "from" ? startDatePlaceholder : endDatePlaceholder;
+  (0, import_react2.useEffect)(() => {
+    if (value) {
+      let formattedValue = value.clone().locale(import_dayjs3.default.locale());
+      let text = formattedValue.format("ddd, DD MMM");
+      if (dateFormat) {
+        text = value.format(dateFormat);
+      }
+      setFormattedDate(text);
+      const minDateDayjs = minDate ? (0, import_dayjs3.default)(minDate) : null;
+      const maxDateDayjs = maxDate ? (0, import_dayjs3.default)(maxDate) : null;
+      if (minDateDayjs?.add(1, "day").isAfter(value, "date") || type === "to" && fromDate && value.isBefore(fromDate.add(1, "day"), "date")) {
+        setDisablePrev(true);
+      } else {
+        setDisablePrev(false);
+      }
+      if (maxDateDayjs?.subtract(1, "day").isBefore(value, "date")) {
+        setDisableNext(true);
+      } else {
+        setDisableNext(false);
+      }
+    } else {
+      setFormattedDate(null);
+    }
+  }, [value, fromDate, minDate, maxDate, dateFormat, type]);
+  const prevDate = (e) => {
+    e.stopPropagation();
+    if (value) {
+      handleChangeDate(value.subtract(1, "day"), type);
+    }
+  };
+  const nextDate = (e) => {
+    e.stopPropagation();
+    if (value) {
+      handleChangeDate(value.add(1, "day"), type);
+    }
+  };
+  const handleClick = () => {
+    handleClickDateInput(type);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "div",
+    {
+      className: (0, import_classnames.default)("date", {
+        "is-focus": inputFocus === type && !isSingle,
+        "is-single": isSingle
+      }),
+      role: "button",
+      tabIndex: nonFocusable ? -1 : tabIndex,
+      onClick: handleClick,
+      id: `${type}-date-input-button`,
+      children: [
+        showIcon && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(calendar_default, { className: "icon-calendar", viewBox: "0 0 24 24" }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "selected-date", children: formattedDate ?? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "date-placeholder", children: placeholder }) }),
+        formattedDate && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "change-date-group", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "btn-outline change-date-button",
+              onClick: prevDate,
+              tabIndex: nonFocusable ? -1 : 0,
+              disabled: disablePrev,
+              children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(prev_default, { viewBox: "0 0 24 24", className: "icon-arrow" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "btn-outline change-date-button",
+              onClick: nextDate,
+              tabIndex: nonFocusable ? -1 : 0,
+              disabled: disableNext,
+              children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(next_default, { viewBox: "0 0 24 24", className: "icon-arrow" })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+
+// src/lib/components/DatePicker/DateInputGroup.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var DateInputGroup = ({
+  showIcon = false,
+  nonFocusable = false
+}) => {
+  const { isSingle } = useDatePickerConfig();
+  const { dateInputSeperator } = useDisplayCustomization();
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "date-picker-input", children: [
+    showIcon && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(calendar_default, { className: "icon-calendar mobile", viewBox: "0 0 24 24" }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "date-picker-date-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        DateInput,
+        {
+          type: "from",
+          tabIndex: nonFocusable ? -1 : 0,
+          showIcon: true,
+          nonFocusable
+        }
+      ),
+      !isSingle && dateInputSeperator && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "date-input-separator", children: dateInputSeperator }),
+      !isSingle && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        DateInput,
+        {
+          type: "to",
+          tabIndex: nonFocusable ? -1 : 0,
+          showIcon: false,
+          nonFocusable
+        }
+      )
+    ] })
+  ] });
+};
+
+// src/lib/components/DatePicker/DialogWrapper.tsx
+var import_react_dom = require("react-dom");
+
+// src/lib/hooks/useClientSide.ts
+var import_react3 = require("react");
+var useClientSide = () => {
+  const [isClient, setIsClient] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
+    if (typeof window !== "undefined" && typeof document !== "undefined") {
+      setIsClient(true);
+    } else {
+      console.warn("Client-side context not available");
+    }
+  }, []);
+  return isClient;
+};
+
+// src/lib/components/DatePicker/DialogWrapper.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var DialogWrapper = ({
+  children = null,
+  isMobile = false
+}) => {
+  const isClient = useClientSide();
+  if (!isClient) return null;
+  return isMobile ? (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { children }), document.body) : children;
+};
+var DialogWrapper_default = DialogWrapper;
+
+// src/lib/components/DatePicker/Dialog.tsx
+var import_react9 = require("react");
+var import_classnames6 = __toESM(require("classnames"));
+
+// src/lib/assets/svg/back.svg
+var React6 = __toESM(require("react"));
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var SvgBack = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 492 492", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M464.3 207.4l.8.2H136l103.5-103.7c5-5.1 7.8-12 7.8-19.2 0-7.2-2.7-14-7.8-19l-16.1-16.2c-5-5-11.8-7.8-19-7.8-7.2 0-14 2.8-19 7.8L7.8 227C2.8 232 0 238.8 0 246c0 7.3 2.8 14 7.8 19.2l177.5 177.4c5 5 11.8 7.8 19 7.8 7.2 0 14-2.8 19-7.8l16-16.1a26.6 26.6 0 000-37.7L134.8 284.4h330a27.9 27.9 0 0027.3-27.6V234a27.3 27.3 0 00-27.7-26.6z" }) });
+var back_default = SvgBack;
+
+// src/lib/components/DatePicker/DialogContentMobile.tsx
+var import_react7 = __toESM(require("react"));
+var import_dayjs6 = __toESM(require("dayjs"));
+var import_react_window = require("react-window");
+var import_react_virtualized_auto_sizer = __toESM(require("react-virtualized-auto-sizer"));
+
+// src/lib/components/DatePicker/MonthCalendar.tsx
+var import_react6 = require("react");
+var import_classnames4 = __toESM(require("classnames"));
+var import_dayjs5 = __toESM(require("dayjs"));
+
+// src/lib/components/DatePicker/Week.tsx
+var import_react5 = require("react");
+var import_classnames3 = __toESM(require("classnames"));
+var import_dayjs4 = __toESM(require("dayjs"));
+
+// src/lib/components/DatePicker/Day.tsx
+var import_react4 = require("react");
+var import_classnames2 = __toESM(require("classnames"));
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var Day = (0, import_react4.forwardRef)(({
+  dateIndex,
+  dateValue,
+  isEndDay,
+  selected,
+  hovered,
+  disabled,
+  totalDay,
+  highlight,
+  handleHoverDay,
+  subText
+}, ref) => {
+  const dayRef = (0, import_react4.useRef)(null);
+  const { onSelectDate, onHoverDate } = useDateState();
+  const selectDate = (e) => {
+    e.stopPropagation();
+    e.preventDefault();
+    if (disabled) return;
+    onSelectDate(dateValue);
+  };
+  const handleHoverDate = () => {
+    if (disabled) return;
+    onHoverDate(dateValue);
+    handleHoverDay(dateValue);
+  };
+  const handleTooltipPosition = (0, import_react4.useCallback)(() => {
+    if (!ref || typeof ref === "function") return;
+    const element = ref.current;
+    if (element && dayRef.current) {
+      element.style.left = `${dayRef.current.offsetLeft - element.offsetWidth + 135}px`;
+      element.style.top = `${dayRef.current.offsetTop - element.offsetHeight - 15}px`;
+      element.style.visibility = "visible";
+    }
+  }, [ref]);
+  const handleTooltipHidden = (0, import_react4.useCallback)(() => {
+    if (!ref || typeof ref === "function") return;
+    const element = ref.current;
+    if (element) {
+      element.style.visibility = "hidden";
+    }
+  }, [ref]);
+  (0, import_react4.useEffect)(() => {
+    const currentRef = dayRef.current;
+    if (currentRef) {
+      currentRef.addEventListener("mouseover", handleTooltipPosition);
+      currentRef.addEventListener("mouseleave", handleTooltipHidden);
+    }
+    return () => {
+      if (currentRef) {
+        currentRef.removeEventListener("mouseover", handleTooltipPosition);
+        currentRef.removeEventListener("mouseleave", handleTooltipHidden);
+      }
+    };
+  }, [handleTooltipPosition, handleTooltipHidden]);
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    "div",
+    {
+      className: (0, import_classnames2.default)("day", {
+        selected,
+        hovered,
+        disabled,
+        highlight,
+        end: isEndDay,
+        "has-subtext": !!subText
+      }),
+      onClick: selectDate,
+      onMouseEnter: handleHoverDate,
+      role: "button",
+      tabIndex: -1,
+      "data-day-index": dateIndex,
+      "data-date-value": dateValue.valueOf(),
+      ref: dayRef,
+      children: [
+        hovered && !(isEndDay && dateIndex === totalDay) && !(dateIndex === 1 && selected && !isEndDay) && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          "div",
+          {
+            className: (0, import_classnames2.default)("background-day", {
+              "first-day": dateIndex === 1,
+              "last-day": dateIndex === totalDay
+            })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "day-content", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "text-day", children: dateIndex }),
+          subText && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            "div",
+            {
+              className: "sub-text",
+              style: {
+                position: "relative",
+                zIndex: 3,
+                color: selected && !hovered ? "#fff" : "#666"
+              },
+              children: subText
+            }
+          )
+        ] })
+      ]
+    }
+  );
+});
+Day.displayName = "Day";
+
+// src/lib/components/DatePicker/Week.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var Week = (0, import_react5.forwardRef)(({
+  isFirst,
+  week,
+  month,
+  year,
+  totalDay,
+  weekIndex,
+  handleHoverDay
+}, ref) => {
+  const {
+    fromDate,
+    toDate,
+    hoverDate
+  } = useDateState();
+  const {
+    minDate,
+    maxDate,
+    isSingle,
+    highlightToday
+  } = useDatePickerConfig();
+  const { subTextDict } = useDisplayCustomization();
+  const generateDay = () => {
+    return Array.from({ length: week.days }, (_, index) => {
+      const dateIndex = index + week.start;
+      const dateValue = (0, import_dayjs4.default)(`${year}-${month + 1}-${dateIndex}`);
+      const disabled = minDate && dateValue.isBefore(minDate, "date") || maxDate && dateValue.isAfter(maxDate, "date");
+      const selected = fromDate && dateValue.isSame(fromDate, "date") || toDate && dateValue.isSame(toDate, "date");
+      let hovered = false;
+      const highlight = highlightToday && dateValue.isSame(/* @__PURE__ */ new Date(), "date");
+      if (fromDate && !fromDate.isSame(toDate, "date") && !isSingle) {
+        if (toDate && !fromDate.isAfter(dateValue, "date") && !toDate.isBefore(dateValue, "date")) {
+          hovered = true;
+        }
+        if (!toDate && !dateValue.isBefore(fromDate, "date") && !(hoverDate && hoverDate.isBefore(dateValue, "date")) && fromDate.isBefore(hoverDate, "date")) {
+          hovered = true;
+        }
+      }
+      const isEndDate = toDate && dateValue.isSame(toDate, "date") || !toDate && hoverDate && dateValue.isSame(hoverDate, "date");
+      const subText = !subTextDict ? "" : subTextDict[dateValue.format("YYYY-MM-DD")] ?? "\xA0";
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        Day,
+        {
+          dateIndex,
+          dateValue,
+          selected,
+          hovered,
+          highlight,
+          disabled,
+          isEndDay: isEndDate,
+          totalDay,
+          handleHoverDay,
+          subText,
+          ref
+        },
+        index
+      );
+    });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: (0, import_classnames3.default)("week", { first: isFirst }), children: generateDay() });
+});
+Week.displayName = "Week";
+
+// src/lib/components/DatePicker/MonthCalendar.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var MonthCalendar = (0, import_react6.forwardRef)(({
+  month,
+  year,
+  hidden = false,
+  isAnimating = false,
+  handleHoverDay,
+  className
+}, ref) => {
+  const {
+    startWeekDay,
+    weekDayFormat,
+    monthFormat,
+    singleCalendar
+  } = useDatePickerConfig();
+  const generateWeek = () => {
+    const { totalWeek, totalDay } = getMonthInfo(year, month, startWeekDay);
+    return totalWeek.map((week) => {
+      const weekKey = `${year}-${month}-${week.start}`;
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        Week,
+        {
+          week,
+          month,
+          year,
+          isFirst: week === totalWeek[0],
+          totalDay,
+          weekIndex: totalWeek.indexOf(week),
+          handleHoverDay,
+          ref
+        },
+        weekKey
+      );
+    });
+  };
+  const generateWeekDay = () => {
+    const arrWeekDay = getWeekDay(startWeekDay, weekDayFormat);
+    return arrWeekDay.map((day) => {
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "weekday", children: day }, `weekday-${day.toLowerCase()}`);
+    });
+  };
+  const getMonthDisplay = () => {
+    const date = (0, import_dayjs5.default)(`${year}-${month + 1}-1`);
+    return monthFormat ? date.format(monthFormat) : date.format("MMMM - YYYY");
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+    "div",
+    {
+      className: (0, import_classnames4.default)("month-calendar", {
+        isAnimating,
+        hidden,
+        single: singleCalendar
+      }, className),
+      "data-month-index": month + 1,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "month-name", children: getMonthDisplay() }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "weekdays", children: generateWeekDay() }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "week-container", children: generateWeek() })
+      ]
+    }
+  );
+});
+MonthCalendar.displayName = "MonthCalendar";
+
+// src/lib/components/DatePicker/DialogContentMobile.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var DialogContentMobile = () => {
+  const [rowCount, setRowCount] = (0, import_react7.useState)(2400);
+  const listRef = (0, import_react7.useRef)(null);
+  const {
+    fromDate
+  } = useDateState();
+  const {
+    startWeekDay,
+    minDate,
+    maxDate,
+    weekDayFormat
+  } = useDatePickerConfig();
+  const {
+    complsOpen
+  } = useUIState();
+  const {
+    tooltip,
+    subTextDict
+  } = useDisplayCustomization();
+  const minYear = minDate ? (0, import_dayjs6.default)(minDate).year() : 1900;
+  const minMonth = minDate ? (0, import_dayjs6.default)(minDate).month() : 0;
+  (0, import_react7.useEffect)(() => {
+    if (maxDate) {
+      const _minDate = minDate ? (0, import_dayjs6.default)(minDate) : (0, import_dayjs6.default)("1900-01-01");
+      setRowCount((0, import_dayjs6.default)(maxDate).diff(_minDate, "month") + 1);
+    }
+  }, [maxDate, minDate]);
+  (0, import_react7.useEffect)(() => {
+    if (listRef.current && complsOpen) {
+      const date = fromDate ? (0, import_dayjs6.default)(fromDate) : (0, import_dayjs6.default)();
+      let monthDiff = date.diff((0, import_dayjs6.default)("1900-01-01"), "month");
+      if (minDate) {
+        monthDiff = date.diff((0, import_dayjs6.default)(minDate), "month");
+      }
+      listRef.current.scrollToItem(monthDiff + 1, "smart");
+    }
+  }, [complsOpen, fromDate, minDate]);
+  const getMonthYearFromIndex = (index) => {
+    const _index = index + minMonth;
+    const year = minYear + Math.floor(_index / 12);
+    const month = _index % 12;
+    return { year, month };
+  };
+  const Row = import_react7.default.memo(({ index, style }) => {
+    const { year, month } = getMonthYearFromIndex(index);
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { style, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      MonthCalendar,
+      {
+        month,
+        year,
+        hidden: false,
+        isAnimating: false,
+        handleHoverDay: () => {
+        }
+      }
+    ) });
+  });
+  Row.displayName = "CalendarRow";
+  const getItemSize = (index) => {
+    const { year, month } = getMonthYearFromIndex(index);
+    const { totalWeek } = getMonthInfo(year, month, startWeekDay || "monday");
+    return totalWeek.length * 48 + 34;
+  };
+  const renderMonthCalendars = () => {
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_virtualized_auto_sizer.default, { children: ({ height, width }) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      import_react_window.VariableSizeList,
+      {
+        ref: listRef,
+        width,
+        height: height - 36,
+        itemCount: rowCount,
+        itemSize: getItemSize,
+        children: Row
+      }
+    ) });
+  };
+  const generateWeekDay = () => {
+    const arrWeekDay = getWeekDay(startWeekDay || "monday", weekDayFormat);
+    return arrWeekDay.map((day, index) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "weekday", children: day }, index));
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "calendar-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "calendar-content", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "weekdays mobile", children: generateWeekDay() }),
+    renderMonthCalendars()
+  ] }) });
+};
+
+// src/lib/components/DatePicker/DialogContentDesktop.tsx
+var import_react8 = require("react");
+var import_classnames5 = __toESM(require("classnames"));
+var import_dayjs7 = __toESM(require("dayjs"));
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var useClientSide2 = () => {
+  const [isClient, setIsClient] = (0, import_react8.useState)(false);
+  (0, import_react8.useEffect)(() => {
+    setIsClient(true);
+  }, []);
+  return isClient;
+};
+var DialogContentDesktop = ({
+  dateChanged = null
+}) => {
+  const isClient = useClientSide2();
+  const containerRef = (0, import_react8.useRef)(null);
+  const tooltipRef = (0, import_react8.useRef)(null);
+  const [translateAmount, setTranslateAmount] = (0, import_react8.useState)(0);
+  const [monthArray, setMonthArray] = (0, import_react8.useState)([]);
+  const [focusDate, setFocusDate] = (0, import_react8.useState)(null);
+  const [disablePrev, setDisablePrev] = (0, import_react8.useState)(false);
+  const [disableNext, setDisableNext] = (0, import_react8.useState)(false);
+  const [wrapperWidth, setWrapperWidth] = (0, import_react8.useState)(0);
+  const [dayValue, setDayValue] = (0, import_react8.useState)(null);
+  const [isAnimating, setIsAnimating] = (0, import_react8.useState)(false);
+  const { fromDate } = useDateState();
+  const { minDate, maxDate, singleCalendar } = useDatePickerConfig();
+  const { complsOpen } = useUIState();
+  const { tooltip } = useDisplayCustomization();
+  const getArrayMonth = (0, import_react8.useCallback)((date) => [
+    date.subtract(1, "month"),
+    date,
+    date.add(1, "month"),
+    date.add(2, "month")
+  ], []);
+  (0, import_react8.useEffect)(() => {
+    if (!isClient || !containerRef.current) return;
+    const updateDimensions = () => {
+      const width = containerRef.current.offsetWidth;
+      const style = window.getComputedStyle(containerRef.current);
+      const translateValue = singleCalendar ? width + parseInt(style.marginLeft) - 8 : width / 2;
+      setWrapperWidth(translateValue);
+    };
+    updateDimensions();
+    const resizeObserver = new ResizeObserver(updateDimensions);
+    resizeObserver.observe(containerRef.current);
+    return () => resizeObserver.disconnect();
+  }, [isClient, singleCalendar]);
+  (0, import_react8.useEffect)(() => {
+    setFocusDate(fromDate ?? (0, import_dayjs7.default)());
+  }, [complsOpen, fromDate]);
+  (0, import_react8.useEffect)(() => {
+    if (!focusDate) return;
+    const minDayjs = minDate ? (0, import_dayjs7.default)(minDate) : null;
+    const maxDayjs = maxDate ? (0, import_dayjs7.default)(maxDate) : null;
+    setDisablePrev(
+      Boolean(
+        minDayjs && focusDate.isBefore(minDayjs.add(1, "month"), "month")
+      )
+    );
+    setDisableNext(
+      Boolean(
+        maxDayjs && focusDate.isAfter(maxDayjs.subtract(2, "month"), "month")
+      )
+    );
+    setMonthArray(getArrayMonth(focusDate));
+  }, [focusDate, minDate, maxDate, getArrayMonth]);
+  (0, import_react8.useEffect)(() => {
+    if (!dateChanged || !focusDate) return;
+    const monthDiff = dateChanged.diff(focusDate, "month");
+    if (monthDiff < -1) decreaseCurrentMonth();
+    if (monthDiff > 1) increaseCurrentMonth();
+  }, [dateChanged, focusDate]);
+  const handleMonthChange = (0, import_react8.useCallback)((direction) => () => {
+    if (direction === "next" && disableNext || direction === "prev" && disablePrev || isAnimating) return;
+    setIsAnimating(true);
+    setTranslateAmount(direction === "next" ? -wrapperWidth : wrapperWidth);
+    const timer = setTimeout(() => {
+      setFocusDate((prev) => {
+        const newDate = direction === "next" ? prev.add(1, "month") : prev.subtract(1, "month");
+        setMonthArray(getArrayMonth(newDate));
+        return newDate;
+      });
+      setTranslateAmount(0);
+      setIsAnimating(false);
+    }, 200);
+    return () => clearTimeout(timer);
+  }, [disableNext, disablePrev, isAnimating, wrapperWidth, getArrayMonth]);
+  const [increaseCurrentMonth, decreaseCurrentMonth] = (0, import_react8.useMemo)(
+    () => [handleMonthChange("next"), handleMonthChange("prev")],
+    [handleMonthChange]
+  );
+  const focusOnCalendar = (0, import_react8.useCallback)(() => {
+    if (!isClient || !containerRef.current) return;
+    const selector = ".day.selected, .month-calendar:not(.hidden) .day:not(.disabled)";
+    const focusTarget = containerRef.current.querySelector(selector);
+    focusTarget?.focus();
+  }, [isClient]);
+  const handleKeyDown = (0, import_react8.useCallback)((e) => {
+    const target = e.target;
+    const dayIndex = target.getAttribute("data-day-index");
+    if (!dayIndex) return;
+    e.preventDefault();
+    const calendarContainer = target.closest(".calendar-wrapper");
+    const dateValue = parseInt(target.dataset.dateValue ?? "0");
+    const date = (0, import_dayjs7.default)(dateValue);
+    const lastDate = date.endOf("month").date();
+    let newIndex = parseInt(dayIndex);
+    switch (e.key) {
+      case "ArrowLeft":
+        newIndex--;
+        break;
+      case "ArrowUp":
+        newIndex -= 7;
+        break;
+      case "ArrowRight":
+        newIndex++;
+        break;
+      case "ArrowDown":
+        newIndex += 7;
+        break;
+      case " ":
+        target.click();
+        return;
+      default:
+        return;
+    }
+    if (newIndex > 0 && newIndex <= lastDate) {
+      calendarContainer?.querySelector(`[data-day-index="${newIndex}"]`)?.focus();
+    } else {
+      const newDate = date.add(newIndex - parseInt(dayIndex), "day");
+      const monthDiff = newDate.diff(focusDate, "month");
+      if (monthDiff > 1 && !disableNext) increaseCurrentMonth();
+      if (monthDiff < 0 && !disablePrev) decreaseCurrentMonth();
+      setTimeout(() => {
+        calendarContainer?.querySelector(
+          `[data-month-index="${newDate.month() + 1}"] [data-day-index="${newDate.date()}"]`
+        )?.focus();
+      }, 200);
+    }
+  }, [focusDate, disableNext, disablePrev, increaseCurrentMonth, decreaseCurrentMonth]);
+  const renderTooltip = (0, import_react8.useMemo)(() => {
+    if (!tooltip || !isClient) return null;
+    const content = typeof tooltip === "function" ? tooltip(dayValue?.toDate() ?? /* @__PURE__ */ new Date()) : tooltip;
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { id: "day-tooltip", className: "tooltip-text", ref: tooltipRef, children: content });
+  }, [tooltip, dayValue, isClient]);
+  const calendarMonths = (0, import_react8.useMemo)(
+    () => monthArray.map((date, index) => {
+      const isVisible = index === 1 || index === 2;
+      const isSlidingNext = isAnimating && translateAmount < 0 && index === 3;
+      const isSlidingPrev = isAnimating && translateAmount > 0 && index === 0;
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        MonthCalendar,
+        {
+          hidden: !isVisible && !isSlidingNext && !isSlidingPrev,
+          isAnimating: isSlidingNext || isSlidingPrev,
+          month: date.month(),
+          year: date.year(),
+          handleHoverDay: setDayValue,
+          ref: tooltipRef,
+          className: (0, import_classnames5.default)({ "slide-next": isSlidingNext, "slide-prev": isSlidingPrev })
+        },
+        `${date.year()}-${date.month()}`
+      );
+    }),
+    [monthArray, isAnimating, translateAmount]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "relative", children: [
+    renderTooltip,
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+      "div",
+      {
+        className: (0, import_classnames5.default)("calendar-wrapper", { single: singleCalendar }),
+        ref: containerRef,
+        onKeyDown: handleKeyDown,
+        role: "grid",
+        "aria-label": "Calendar",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            "div",
+            {
+              className: (0, import_classnames5.default)("calendar-content", { isAnimating }),
+              style: { transform: `translateX(${translateAmount}px)` },
+              children: calendarMonths
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "calendar-flippers", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              "button",
+              {
+                className: (0, import_classnames5.default)("flipper-button", { disabled: disablePrev }),
+                onClick: decreaseCurrentMonth,
+                onKeyDown: (e) => e.key === " " && decreaseCurrentMonth(),
+                disabled: disablePrev,
+                "aria-label": "Previous month",
+                children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(prev_default, { viewBox: "0 0 24 24" })
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              "button",
+              {
+                className: (0, import_classnames5.default)("flipper-button", { disabled: disableNext }),
+                onClick: increaseCurrentMonth,
+                onKeyDown: (e) => e.key === " " && increaseCurrentMonth(),
+                disabled: disableNext,
+                "aria-label": "Next month",
+                onBlur: focusOnCalendar,
+                children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(next_default, { viewBox: "0 0 24 24" })
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+
+// src/lib/components/DatePicker/Dialog.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var Dialog = ({
+  containerRef: externalRef
+}) => {
+  const [hideAnimation, setHideAnimation] = (0, import_react9.useState)(false);
+  const [dateChanged, setDateChanged] = (0, import_react9.useState)(null);
+  const defaultRef = (0, import_react9.useRef)(null);
+  const containerRef = externalRef || defaultRef;
+  const {
+    handleChangeDate,
+    handleReset
+  } = useDateState();
+  const {
+    singleCalendar,
+    expandDirection
+  } = useDatePickerConfig();
+  const {
+    complsOpen,
+    isMobile,
+    toggleDialog
+  } = useUIState();
+  const {
+    hideDialogHeader,
+    hideDialogFooter
+  } = useDisplayCustomization();
+  const onChangeDate = (date, type) => {
+    setDateChanged(date);
+    handleChangeDate(date, type);
+  };
+  (0, import_react9.useEffect)(() => {
+    if (complsOpen && !hideAnimation) {
+      setHideAnimation(true);
+    }
+    if (complsOpen) {
+      setTimeout(() => {
+        const startDateInput = containerRef.current?.querySelector(
+          "#start-date-input-button"
+        );
+        if (startDateInput) {
+          startDateInput.focus();
+        }
+      }, 50);
+    }
+  }, [complsOpen, containerRef, hideAnimation]);
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+    "div",
+    {
+      className: (0, import_classnames6.default)("dialog-date-picker", {
+        "open": complsOpen,
+        "hide": !complsOpen && hideAnimation,
+        "single": singleCalendar && !isMobile,
+        "expand-left": expandDirection === "left",
+        "expand-right": expandDirection === "right"
+      }),
+      ref: containerRef,
+      children: [
+        !hideDialogHeader && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "dialog-header", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "btn-outline back-button",
+              onClick: toggleDialog,
+              children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(back_default, { viewBox: "0 0 492 492" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            DateInputGroup,
+            {
+              showIcon: true,
+              nonFocusable: !complsOpen
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "btn-outline reset-button",
+              onClick: handleReset,
+              children: "Reset"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "dialog-content", children: isMobile ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogContentMobile, {}) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          DialogContentDesktop,
+          {
+            dateChanged
+          }
+        ) }),
+        !hideDialogFooter && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "dialog-footer", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "submit-button",
+              onClick: toggleDialog,
+              tabIndex: 0,
+              children: "Done"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            "button",
+            {
+              type: "button",
+              className: "btn-outline reset-button mobile",
+              onClick: handleReset,
+              children: "Reset"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+
+// src/lib/components/DatePicker/BaseDatePicker.tsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
+import_dayjs8.default.extend(import_localeData.default);
+var BaseDatePicker = ({
+  startDate = null,
+  endDate = null,
+  className = "",
+  disabled = false,
+  startDatePlaceholder,
+  endDatePlaceholder,
+  onChange,
+  onFocus = () => {
+  },
+  startWeekDay = "monday",
+  minDate = null,
+  maxDate = null,
+  weekDayFormat = "dd",
+  dateFormat = "",
+  monthFormat = "",
+  highlightToday = false,
+  dateInputSeperator = null,
+  hideDialogHeader = false,
+  hideDialogFooter = false,
+  hideDialogAfterSelectEndDate = false,
+  isOpen = false,
+  onCloseCalendar,
+  tooltip = "",
+  subTextDict = null,
+  expandDirection = "right",
+  locale = "en",
+  isSingle = false,
+  singleCalendar = false
+}) => {
+  const [complsOpen, setComplsOpen] = (0, import_react10.useState)(isOpen);
+  const [inputFocus, setInputFocus] = (0, import_react10.useState)(
+    isSingle ? "from" : null
+  );
+  const [fromDate, setFromDate] = (0, import_react10.useState)(
+    startDate ? (0, import_dayjs8.default)(startDate) : void 0
+  );
+  const [toDate, setToDate] = (0, import_react10.useState)(
+    endDate ? (0, import_dayjs8.default)(endDate) : void 0
+  );
+  const [hoverDate, setHoverDate] = (0, import_react10.useState)();
+  const [isMobile, setIsMobile] = (0, import_react10.useState)(false);
+  const [isFirstTime, setIsFirstTime] = (0, import_react10.useState)(false);
+  const isClient = useClientSide();
+  const containerRef = (0, import_react10.useRef)(null);
+  const fromDateRef = (0, import_react10.useRef)(null);
+  const toDateRef = (0, import_react10.useRef)(null);
+  const handleResize = (0, import_react10.useCallback)(() => {
+    if (!isClient) return;
+    setIsMobile(window.innerWidth < 768);
+  }, [isClient]);
+  const notifyChange = () => {
+    const _startDate = fromDateRef.current ? fromDateRef.current.toDate() : null;
+    const _endDate = !isSingle && toDateRef.current ? toDateRef.current.toDate() : null;
+    if (isSingle) {
+      onChange(_startDate, null);
+    } else {
+      onChange(_startDate, _endDate);
+    }
+  };
+  const debounceNotifyChange = debounce(notifyChange, 20);
+  const updateFromDate = (dateValue, shouldNotifyChange = false) => {
+    setFromDate(dateValue || void 0);
+    fromDateRef.current = dateValue || null;
+    if (shouldNotifyChange) {
+      debounceNotifyChange();
+    }
+  };
+  const updateToDate = (dateValue, shouldNotifyChange = false) => {
+    if (!isSingle) {
+      setToDate(dateValue || void 0);
+      toDateRef.current = dateValue || null;
+      if (shouldNotifyChange) {
+        debounceNotifyChange();
+      }
+    }
+  };
+  (0, import_react10.useLayoutEffect)(() => {
+    if (!isClient) return;
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [isClient, handleResize]);
+  (0, import_react10.useEffect)(() => {
+    if (!isClient) return;
+    setIsFirstTime(true);
+    const handleDocumentClick = (e) => {
+      if (containerRef.current && e.target instanceof Node && !containerRef.current.contains(e.target) && window.innerWidth >= 768) {
+        setComplsOpen(false);
+      }
+    };
+    document.addEventListener("click", handleDocumentClick);
+    return () => document.removeEventListener("click", handleDocumentClick);
+  }, [isClient]);
+  (0, import_react10.useEffect)(() => {
+    const _startDateJs = startDate ? (0, import_dayjs8.default)(startDate) : null;
+    fromDateRef.current = _startDateJs;
+    updateFromDate(_startDateJs, false);
+  }, [startDate]);
+  (0, import_react10.useEffect)(() => {
+    if (!isSingle) {
+      const _endDateJs = endDate ? (0, import_dayjs8.default)(endDate) : null;
+      toDateRef.current = _endDateJs;
+      updateToDate(_endDateJs, false);
+    }
+  }, [endDate, isSingle]);
+  (0, import_react10.useEffect)(() => {
+    if (!complsOpen && isFirstTime) {
+      const _startDate = fromDateRef.current?.toDate() || null;
+      const _endDate = toDateRef.current?.toDate() || null;
+      if (isSingle) {
+        onCloseCalendar(_startDate, null);
+      } else {
+        onCloseCalendar(_startDate, _endDate);
+      }
+    }
+  }, [complsOpen, isFirstTime, isSingle, onCloseCalendar]);
+  (0, import_react10.useEffect)(() => {
+    setComplsOpen(isOpen);
+  }, [isOpen]);
+  (0, import_react10.useEffect)(() => {
+    if (isFirstTime) {
+      const input = inputFocus === "from" ? "Start Date" : inputFocus === "to" ? "End Date" : "";
+      onFocus(input);
+    }
+  }, [inputFocus, isFirstTime, onFocus]);
+  const toggleDialog = () => {
+    setComplsOpen(!complsOpen);
+  };
+  const handleClickDateInput = (focusInput) => {
+    if (disabled || !isSingle && focusInput === "to" && !fromDate) {
+      return;
+    }
+    if (!complsOpen) {
+      setComplsOpen(true);
+    }
+    setInputFocus(focusInput);
+  };
+  const onSelectDate = (0, import_react10.useCallback)(
+    (date) => {
+      const minDayjs = minDate ? (0, import_dayjs8.default)(minDate) : null;
+      const maxDayjs = maxDate ? (0, import_dayjs8.default)(maxDate) : null;
+      if (minDayjs && minDayjs.isAfter(date, "date") || maxDayjs && maxDayjs.isBefore(date, "date")) {
+        return;
+      }
+      if (isSingle) {
+        updateFromDate(date, true);
+        if (hideDialogAfterSelectEndDate) {
+          setTimeout(() => setComplsOpen(false), 50);
+        }
+      } else if (inputFocus === "from" || fromDate && date.isBefore(fromDate, "date")) {
+        updateFromDate(date, true);
+        if (toDate && date.isAfter(toDate, "date")) {
+          updateToDate(null, true);
+        }
+        setInputFocus("to");
+      } else {
+        updateToDate(date, true);
+        setInputFocus(null);
+        if (hideDialogAfterSelectEndDate) {
+          setTimeout(() => setComplsOpen(false), 50);
+        }
+      }
+    },
+    [
+      minDate,
+      maxDate,
+      isSingle,
+      hideDialogAfterSelectEndDate,
+      inputFocus,
+      fromDate,
+      toDate
+    ]
+  );
+  const onHoverDate = (date) => {
+    setHoverDate(date);
+  };
+  const handleReset = () => {
+    setHoverDate(void 0);
+    updateFromDate(null, true);
+    if (!isSingle) {
+      updateToDate(null, true);
+    }
+    setInputFocus("from");
+  };
+  const handleChangeDate = (0, import_react10.useCallback)(
+    (date, type) => {
+      const minDayjs = minDate ? (0, import_dayjs8.default)(minDate) : null;
+      const maxDayjs = maxDate ? (0, import_dayjs8.default)(maxDate) : null;
+      if (minDayjs && minDayjs.isAfter(date, "date") || maxDayjs && maxDayjs.isBefore(date, "date")) {
+        return;
+      }
+      if (type === "from" || isSingle) {
+        setInputFocus("from");
+        updateFromDate(date, true);
+        if (!isSingle && toDate && date.isAfter(toDate, "date")) {
+          updateToDate(null, true);
+        }
+      } else {
+        setInputFocus("to");
+        updateToDate(date, true);
+      }
+    },
+    [minDate, maxDate, isSingle, toDate, inputFocus]
+  );
+  const dateState = {
+    fromDate,
+    toDate,
+    hoverDate,
+    inputFocus,
+    onSelectDate,
+    onHoverDate,
+    handleChangeDate,
+    handleReset,
+    handleClickDateInput
+  };
+  const config = {
+    isSingle,
+    startWeekDay,
+    minDate: minDate ? (0, import_dayjs8.default)(minDate).toDate() : null,
+    maxDate: maxDate ? (0, import_dayjs8.default)(maxDate).toDate() : null,
+    weekDayFormat,
+    dateFormat,
+    monthFormat,
+    highlightToday,
+    singleCalendar,
+    expandDirection,
+    locale
+  };
+  const uiState = {
+    complsOpen,
+    isMobile,
+    disabled,
+    toggleDialog
+  };
+  const display = {
+    startDatePlaceholder,
+    endDatePlaceholder,
+    dateInputSeperator,
+    hideDialogHeader,
+    hideDialogFooter,
+    hideDialogAfterSelectEndDate,
+    tooltip,
+    subTextDict
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "react-google-flight-datepicker", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    "div",
+    {
+      className: (0, import_classnames7.default)("date-picker", className, {
+        disabled
+      }),
+      ref: containerRef,
+      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+        DatePickerProvider,
+        {
+          dateState,
+          config,
+          uiState,
+          display,
+          locale,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DateInputGroup, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DialogWrapper_default, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Dialog, {}) })
+          ]
+        }
+      )
+    }
+  ) });
+};
+var BaseDatePicker_default = BaseDatePicker;
+
+// src/lib/components/DatePicker/ClientOnly.tsx
+var import_react11 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var ClientOnly = ({ children }) => {
+  const [hasMounted, setHasMounted] = (0, import_react11.useState)(false);
+  (0, import_react11.useEffect)(() => {
+    setHasMounted(true);
+  }, []);
+  if (!hasMounted) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
+};
+
+// src/lib/components/DatePicker/RangeDatePicker.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var RangeDatePicker = ({
+  onChange = () => {
+  },
+  onCloseCalendar = () => {
+  },
+  startDatePlaceholder = "Start date",
+  endDatePlaceholder = "End date",
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ClientOnly, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  BaseDatePicker_default,
+  {
+    ...props,
+    isSingle: false,
+    startDate: props.startDate,
+    endDate: props.endDate,
+    startDatePlaceholder,
+    endDatePlaceholder,
+    onChange,
+    onCloseCalendar
+  }
+) });
+
+// src/lib/components/DatePicker/SingleDatePicker.tsx
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var SingleDatePicker = ({
+  onChange = () => {
+  },
+  onCloseCalendar = () => {
+  },
+  startDatePlaceholder = "Date",
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ClientOnly, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  BaseDatePicker_default,
+  {
+    ...props,
+    endDate: null,
+    isSingle: true,
+    startDate: props.startDate,
+    startDatePlaceholder,
+    onChange: (date) => onChange(date),
+    onCloseCalendar: (date) => onCloseCalendar(date)
+  }
+) });
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RangeDatePicker,
+  SingleDatePicker
+});
 //# sourceMappingURL=index.js.map