UNPKG

@rnwonder/react-date-picker

Version:

A simple and reusable Datepicker component for ReactJS ([Demo](https://stackblitz.com/edit/solidjs-templates-dof6jl?file=src%2FApp.tsx))

2 lines (1 loc) 9.43 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../CalendarArea/index.js"),l=require("../DatePickerTop/index.js"),a=require("../../node_modules/.pnpm/@rnwonder_simple-datejs@1.0.8/node_modules/@rnwonder/simple-datejs/dist/utils.js"),n=require("../../utils/class.js"),o=require("../../node_modules/.pnpm/@rnwonder_simple-datejs@1.0.8/node_modules/@rnwonder/simple-datejs/dist/datePicker.js"),r=require("../SelectorTwo/index.js"),s=require("react"),d=require("../../hooks/useDatePickerRenderJSX.js"),c=require("../Helpers/Show.js"),u=require("../../node_modules/.pnpm/@rnwonder_simple-datejs@1.0.8/node_modules/@rnwonder/simple-datejs/dist/general-D5nVjUqG.js"),i=s.forwardRef(((i,h)=>{const[m,p]=s.useState((new Date).getMonth()),[v,y]=s.useState(),[D,g]=s.useState(),[w,S]=s.useState(void 0),[b,C]=s.useState([]),[j,f]=s.useState(!0),[M,T]=s.useState(!1),[x,Y]=s.useState({}),[k,A]=s.useState([]);s.useEffect((()=>{var e,t,l,n,o,r,s,d,c,h,m,v,D,w,b,j,f,M,x,k,A,O,F,J,X;if(y(u.s),!((null==(e=i.value)?void 0:e.selected)||(null==(t=i.value)?void 0:t.start)||(null==(l=i.value)?void 0:l.end)||(null==(n=i.value)?void 0:n.selectedDateObject)||(null==(o=i.value)?void 0:o.startDateObject)||(null==(r=i.value)?void 0:r.endDateObject)||(null==(s=i.value)?void 0:s.multiple)||(null==(c=null==(d=i.value)?void 0:d.multipleDateObject)?void 0:c.length)))return i.month||null==(h=i.setMonth)||h.call(i,(new Date).getMonth()),i.year||null==(m=i.setYear)||m.call(i,u.s),void R();if(R(),T(!0),i.value.selected||i.value.selectedDateObject){const e=i.value.selected?new Date(i.value.selected):a.convertDateObjectToDate(i.value.selectedDateObject);p(e.getMonth()),null==(v=i.setMonth)||v.call(i,e.getMonth()),y(e.getFullYear()),null==(D=i.setYear)||D.call(i,e.getFullYear()),g({year:e.getFullYear(),month:e.getMonth(),day:e.getDate()})}if(i.value.start||i.value.end||i.value.startDateObject||i.value.endDateObject){const e=i.value.start?new Date(i.value.start):(null==(w=i.value.startDateObject)?void 0:w.day)?a.convertDateObjectToDate(i.value.startDateObject):void 0,t=i.value.end?new Date(i.value.end):(null==(b=i.value.endDateObject)?void 0:b.day)?a.convertDateObjectToDate(i.value.endDateObject):void 0;if(!e&&!t)return;if(!e&&t){p(t.getMonth()),null==(j=i.setMonth)||j.call(i,t.getMonth()),y(t.getFullYear()),null==(f=i.setYear)||f.call(i,t.getFullYear());const e={year:t.getFullYear(),month:t.getMonth(),day:t.getDate()};return g(e),void Y({start:e})}p(e.getMonth()),null==(M=i.setMonth)||M.call(i,e.getMonth()),y(e.getFullYear()),null==(x=i.setYear)||x.call(i,e.getFullYear());const l={year:e.getFullYear(),month:e.getMonth(),day:e.getDate()};if(g(l),Y({start:l}),!t)return;S({year:t.getFullYear(),month:t.getMonth(),day:t.getDate()}),Y({start:void 0}),i.showEndOfRange&&(p(t.getMonth()),null==(k=i.setMonth)||k.call(i,t.getMonth()),y(t.getFullYear()),null==(A=i.setYear)||A.call(i,t.getFullYear()))}if((null==(O=i.value.multipleDateObject)?void 0:O.length)||i.value.multiple){const e=(null==(F=i.value.multipleDateObject)?void 0:F.length)?i.value.multipleDateObject:i.value.multiple?i.value.multiple.map((e=>a.convertDateToDateObject(new Date(e)))):void 0;if(!e)return;C(e);const t=null==e?void 0:e.at(-1);(null==t?void 0:t.month)&&(p(t.month),null==(J=i.setMonth)||J.call(i,t.month)),(null==t?void 0:t.year)&&(y(t.year),null==(X=i.setYear)||X.call(i,t.year))}}),[]);const O=s.useCallback((e=>{var t,l;i.handleOnChange(e),null==(t=null==i?void 0:i.onChange)||t.call(i,e),null==(l=i.onValueChange)||l.call(i,e)}),[i]),R=s.useCallback((()=>{var e,t;i.startingMonth&&p(i.startingMonth),i.startingMonth&&(null==(e=i.setMonth)||e.call(i,i.startingMonth)),i.startingYear&&y(i.startingYear),i.startingYear&&(null==(t=i.setYear)||t.call(i,i.startingYear))}),[i]);s.useEffect((()=>{j||f(!0)}),[j]);const F=s.useCallback(((e,t,l,n=!1)=>{var r,s,d,c,h;M||T(!0);const m=Number(t),v=u.f(m,e.month),j=u.k(l,t,e.month);if("range"===i.type){const{end:a,start:n,initial:s}=o.handleDateRange({day:e,month:t,year:l,endDay:w,startDay:D,disabledDays:i.disabledDays,enabledDays:i.enabledDays,disallowSameDayRange:i.disallowSameDayRange});g(n),S(a),s&&!i.disableRangeHoverEffect&&Y({start:n,end:void 0}),a&&n&&(Y({}),i.shouldCloseOnSelect&&(null==(r=i.close)||r.call(i))),O({startDate:n,endDate:a,type:"range"})}if("single"===i.type){const t=new Date(j,u.f(m,e.month),e.value);t.setFullYear(j);const l=a.convertDateToDateObject(t);g(l),O({selectedDate:l,type:"single"}),i.shouldCloseOnSelect&&(null==(s=i.close)||s.call(i))}if("multiple"===i.type){const t={year:j,month:u.f(m,e.month),day:e.value},l=b.find((e=>u.o(e,t)));if(l){const e=b.filter((e=>!u.o(e,l)));return C(e),void O({multipleDates:e,type:"multiple"})}C((e=>[...e,t])),O({multipleDates:b,type:"multiple"}),i.shouldCloseOnSelect&&(null==(d=i.close)||d.call(i))}n||(p(v),null==(c=i.setMonth)||c.call(i,v),y(j),null==(h=i.setYear)||h.call(i,j))}),[w,M,b,O,i,D]),J=s.useCallback(((e,t)=>{var l,a,n,o,r;p(e),null==(l=i.setMonth)||l.call(i,e),null==(a=i.onMonthChange)||a.call(i,e),t&&(y(t),null==(n=i.setYear)||n.call(i,t),null==(o=i.onYearChange)||o.call(i,t));const s=u.e({startDay:D,month:e,year:t,type:i.type});s&&(null==(r=i.onValueChange)||r.call(i,s))}),[i,D]),X=s.useCallback((()=>{if(11===(i.month||m)){return void J(0,v+1)}const e=(i.month||m)+1;J(e)}),[m,i.month,J,v]),P=s.useCallback((()=>{if(0===(i.month||m)){return void J(11,v-1)}const e=(i.month||m)-1;J(e)}),[m,i.month,J,v]),q=s.useCallback(((e,t,l)=>{if(i.disableRangeHoverEffect)return;if("range"!==i.type)return;if(!(null==x?void 0:x.start))return;const{end:a,start:n}=o.handleDateRange({day:e,month:t,year:l,endDay:null==x?void 0:x.end,startDay:null==x?void 0:x.start,disabledDays:i.disabledDays,hover:!0,enabledDays:i.enabledDays});Y({start:n,end:a})}),[null==x?void 0:x.end,null==x?void 0:x.start,i.disableRangeHoverEffect,i.disabledDays,i.enabledDays,i.type]),E=s.useCallback((()=>{i.disableRangeHoverEffect||"range"===i.type&&(null==x?void 0:x.start)&&(D&&w||Y({start:D,end:void 0}))}),[w,null==x?void 0:x.start,i.disableRangeHoverEffect,i.type,D]),_=s.useMemo((()=>({month:m,setMonth:p,endDay:w,year:v||u.s,setYear:y,startDay:D,handleDayClick:F,multipleObject:b,handleNextMonth:X,handlePrevMonth:P,close:i.close})),[w,F,X,P,m,b,i.close,D,v]),B=d(_,i.monthSelectorJSX,i.setAllowedComponents),H=d(_,i.yearSelectorJSX,i.setAllowedComponents),N=d(_,i.calendarTopAreaJSX,i.setAllowedComponents),I=d(_,i.calendarLeftAreaJSX,i.setAllowedComponents),V=d(_,i.calendarRightAreaJSX,i.setAllowedComponents),L=d(_,i.calendarBottomAreaJSX,i.setAllowedComponents),z=d(_,i.calendarJSX,i.setAllowedComponents),G=d(_,i.afterNextButtonAreaJSX,i.setAllowedComponents),U=d(_,i.beforePrevButtonAreaJSX,i.setAllowedComponents),W=d(_,i.weekDaysJSX,i.setAllowedComponents),K=d(_,i.calendarAboveTopAreaJSX,i.setAllowedComponents);return e.jsxs("div",{className:n.cn("date-picker-wrapper \n rn-relative \n rn-rounded-md \n rn-border-t \n rn-border-solid\n rn-border-gray-300\n rn-bg-white\n rn-pb-[0.5rem] \n rn-pt-[0.625rem] \n dark:rn-border-gray-700\n dark:rn-bg-dreamless-sleep\n ",{"rn-w-max":!I&&!V,"rn-shadow-lg":!i.showSelectorTwo},i.datePickerWrapperClass),"data-type":"date-picker-wrapper",ref:h,style:{...i.backgroundColor&&{backgroundColor:i.backgroundColor}},"data-scope":"date-picker","data-part":"content",role:"application","aria-label":"calendar","aria-roledescription":"date-picker",children:[e.jsx(c,{when:i.showSelectorTwo,children:e.jsx(r.default,{...i.selectorTwoProps,setAllowedComponents:i.setAllowedComponents,setShowSelectorTwo:i.setShowSelectorTwo,setSelectorTwoProps:i.setSelectorTwoProps,monthSelectorTopLabel:i.monthSelectorTopLabel})}),e.jsxs(c,{when:!i.hideTopArea,children:[K,N||e.jsx(l.DatePickerTop,{yearSelectorCount:i.yearSelectorCount,setYear:i.setYear||y,setMonth:i.setMonth||p,month:i.month||m,year:i.year||v,render:j,handleNextMonth:X,handlePrevMonth:P,monthSelectorJSX:B,yearSelectorJSX:H,zIndex:i.zIndex,type:i.type,setAllowedComponents:i.setAllowedComponents,monthSelectorFormat:i.monthSelectorFormat,monthYearSelectorFlexDirection:i.monthYearSelectorFlexDirection,onChange:i.onValueChange,onMonthChange:i.onMonthChange,twoMonthsDisplay:i.twoMonthsDisplay,startDay:D,setStartDay:g,yearRange:i.yearRange,locale:i.locale,nextIcon:i.nextIcon,prevIcon:i.prevIcon,removeNavButtons:i.removeNavButtons,nextButtonAreaJSX:G,prevButtonAreaJSX:U,primaryColor:i.primaryColor,minDate:i.minDate,maxDate:i.maxDate,enabledDays:i.enabledDays,primaryTextColor:i.primaryTextColor,secondaryColor:i.secondaryColor,secondaryTextColor:i.secondaryTextColor,setShowSelectorTwo:i.setShowSelectorTwo,setSelectorTwoProps:i.setSelectorTwoProps,showSelectorTwo:i.showSelectorTwo})]}),e.jsxs("div",{className:n.cn("date-picker-body rn-flex rn-justify-center",i.datePickerBodyAreaClass),children:[e.jsx(c,{when:I&&!i.showSelectorTwo,children:I}),e.jsx(c,{when:!i.hideCalendar,children:z||e.jsx(t.CalendarArea,{...i,year:i.year||v,month:i.month||m,endDay:w,startDay:D,handleDayClick:F,multipleObject:b,weekDaysJSX:W,onHoverDay:q,hoverRangeValue:x,onHoverDayEnd:E,showSelectorTwo:i.showSelectorTwo,setDayRowsArray:A,dayRowsArray:k})}),e.jsx(c,{when:V&&!i.showSelectorTwo,children:V})]}),e.jsx(c,{when:L&&!i.showSelectorTwo,children:L})]})}));exports.DatePicker=i;