@rehookify/datepicker
Version:
The ultimate tool to create a date, range and time picker in your React applications.
3 lines (2 loc) • 10.2 kB
JavaScript
var e=require("react");const t=(e,t,...a)=>e&&null!=t?new Date(e,t,...a):new Date,a=e=>({D:e.getDate(),M:e.getMonth(),Y:e.getFullYear()}),s=e=>t(a(e).Y,a(e).M,a(e).D),o=e=>t(a(e).Y,a(e).M+1,0).getDate(),n=(e,s,n)=>{const{Y:r,M:c,D:l}=a(e),d="date"===n?l+s:"month"===n&&l>o(t(r,c+s,1))?o(t(r,c+s,1)):l;return t(r+("year"===n?s:0),c+("month"===n?s:0),d)},r=(e,t,a)=>n(e,0-t,a),c=(e,t)=>+e-+t,l=(e,t,a)=>e.toLocaleDateString(t,a),d=(e,{locale:t,monthName:a})=>l(e,t,{month:a}),i=(e,a,s,o)=>o&&null!=o.h&&null!=o.m?t(e,a,s,o.h,o.m):void 0,u=(e,{locale:t,hour:a,minute:s,second:o,hour12:n})=>e.toLocaleTimeString(t,{hour:a,minute:s,second:o,hour12:n}),f=e=>`${e<10?0:""}${e}`,m=(e,{hour12:t})=>{const a=e.getHours(),s=e.getMinutes();return t?((e,t)=>{const a=e>=12?"pm":"am";return`${f(e%12||12)}:${f(t)} ${a}`})(a,s):`${f(a)}:${f(s)}`},D=(e,t)=>e.concat(t).sort(c),g=(e,t,a)=>{let[s,o]=[e,t];return e&&t&&([s,o]=[e,t].sort(a)),[s,o]},x=(e,{day:t,date:s}={})=>((e,t)=>!!t&&t.includes(e))(e.getDay(),t)||((e,t=[])=>{const{M:s,D:o}=a(e);return t.some((e=>{const{M:t,D:n}=a(e);return s===t&&o===n}))})(e,s);function p(e,t){return((e=>e.getDay())(e)+7-t)%7}const h=(e,t)=>+e==+t,y=(e,t)=>e<t,C=(e,t)=>e>t,b=(e,t,a)=>C(t,e)&&y(t,a)||y(t,e)&&C(t,a),Y=(e,t)=>!!e&&C(t,e),k=(e,t)=>!!e&&y(t,e),M=(e,t)=>e.some((e=>h(s(e),s(t)))),v=(e,t)=>!!t&&e<a(t).M,P=(e,t)=>!!t&&e<a(t).Y,E=(e,t)=>!!t&&e>a(t).M,T=(e,t)=>!!t&&e>a(t).Y,$=(e,t)=>!!t&&e>=a(t).Y,w=(e,t)=>!!t&&e<=a(t).Y;var O={mode:"static",offsets:[0],startDay:0},G={mode:"decade",numberOfYears:12,step:10},S={mode:"single",toggle:!1,selectSameDate:!1},A={interval:30,useLocales:!1},B={locale:"en-GB",day:"2-digit",year:"numeric",weekday:"short",monthName:"long",hour:"2-digit",minute:"2-digit",hour12:void 0,second:void 0};function _(e){return"range"===e}const I="range-start",F="range-end",L="will-be-range-start",N="will-be-range-end",R=(e,t,a,o)=>{if(!_(o)||0===a.length)return"";const[n,r]=a;return n&&r?h(e,s(n))?h(s(n),s(r))?`${I} ${F}`:I:h(e,s(r))?F:b(s(n),e,s(r))?"in-range":"":!r&&t?b(s(n),e,t)?"will-be-in-range":y(t,s(n))?h(e,t)?L:h(e,s(n))?N:"":h(e,s(n))?L:h(e,t)?N:"":""},q=(e,n,r,{rangeEnd:c},i)=>{const{dates:{mode:u,minDate:f,maxDate:m},locale:D,calendar:g,exclude:y}=i,{locale:C,day:b,year:v}=D,{M:P,Y:E}=a(n),{start:T,length:$}=function(e,a,{mode:s,startDay:n}){const r=t(a,e,1),c=o(r),l=p(r,n);return{start:l,length:"static"===s?42:l+c+6-p(t(a,e,c),n)}}(P,E,g),w=Array($).fill(0).map(((o,n)=>{const d=t(E,P,n+1-T);return{$date:d,active:h(e,d),day:l(d,C,{day:b}),now:h(s(t()),d),range:R(d,c,r,u),disabled:k(f,d)||Y(m,d)||x(d,y),selected:M(r,d),inCurrentMonth:a(d).M===P}}));return{year:l(n,C,{year:v}),month:d(n,D),days:w}};var H=({days:e},{locale:{locale:t,weekday:a}})=>[0,1,2,3,4,5,6].map((s=>l(e[s].$date,t,{weekday:a})));const U=t=>{const a=(({selectedDates:e,state:t,config:a,offsetDate:s})=>a.calendar.offsets.map((o=>q(s,n(s,o,"month"),e,t,a))))(t);return e.useMemo((()=>({calendars:a,weekDays:H(a[0],t.config)})),[a,t.config])},j=(...e)=>(...t)=>e.forEach((e=>null==e?void 0:e(...t))),z=e=>(t,a)=>e(a),J=e=>(...t)=>{e()},K=(e,t,a={},s=!1)=>({role:"button",tabIndex:0,...e?{disabled:!0,"aria-disabled":!0}:{onClick(e){t(e)}},...s?{"aria-selected":!0}:{},...a});var Q="SET_FOCUS_DATE",V="SET_OFFSET_DATE",W="SET_RANGE_END",X="SET_YEAR",Z=(e,t)=>{switch(t.type){case Q:return{...e,focusDate:t.date};case V:return{...e,offsetDate:t.date};case W:return{...e,rangeEnd:t.date};case X:return{...e,offsetYear:t.year};default:return e}},ee=(e,t)=>{e({type:Q,date:t})},te=(e,t)=>{e({type:W,date:t})},ae=(e,t)=>{e({type:X,year:t})};const se=({dispatch:e,config:{onOffsetChange:t,offsetDate:a}})=>s=>{t||a||((e,t)=>{e({type:V,date:t})})(e,s),t&&t(s)},oe=(e,{days:t,months:a,years:s})=>{let o=e;return t&&0!==t&&(o=n(o,t,"date")),a&&0!==a&&(o=n(o,a,"month")),s&&0!==s&&(o=n(o,s,"year")),o},ne=(e,{days:t=0,months:a=0,years:s=0},o)=>o?h(e,o)?e:0!==t?re(e,o,t,"date"):0!==a?re(e,o,a,"month"):0!==s?re(e,o,s,"year"):e:e,re=(e,t,a,s)=>{const o=n(e,a,s);if(a>0){return Y(t,o)?r(t,a,s):e}return k(t,o)?r(t,a,s):e},ce=t=>{const{config:{dates:a}}=t,{minDate:s,maxDate:o}=a,n=e.useCallback(((e,{disabled:a,onClick:s,...n}={})=>{const r=ne(t.offsetDate,e,o),c=oe(r,e),l=!!a||Y(o,c);return K(l,(e=>j(s,z(se(t)))(e,c)),n)}),[o,t]),r=e.useCallback((({days:e=0,months:a=0,years:o=0},{disabled:n,onClick:r,...c}={})=>{const l={days:-e,months:-a,years:-o},d=ne(t.offsetDate,l,s),i=oe(d,l),u=!!n||k(s,i);return K(u,(e=>j(r,z(se(t)))(e,i)),c)}),[s,t]);return{addOffset:n,setOffset:e.useCallback(((e,{disabled:a,onClick:n,...r}={})=>{const c=!!a||k(s,e)||Y(o,e);return K(c,(a=>j(n,z(se(t)))(a,e)),r)}),[t,o,s]),subtractOffset:r}},le=e=>"exact"===e,de=(e,{mode:t,numberOfYears:a})=>le(t)?((e,t)=>e-t+1)(e,a):"decade"===t?(e=>e-e%10-1)(e):((e,t)=>e-(t/2-(t%2==0?1:0)))(e,a),ie=e=>{const{selectedDates:o,offsetDate:n,focusDate:r,dates:{minDate:c,maxDate:l},years:d}=e,i=n||(o.length>0?o[o.length-1]:((e,t,a)=>Y(t,a)?t:k(e,a)?e:a)(c,l,s(t())));return{focusDate:r,rangeEnd:null,offsetDate:i,offsetYear:de(a(i).Y,d)}},ue=t=>{const a=function({selectedDates:e=[],onDatesChange:t,focusDate:a,offsetDate:o,onOffsetChange:n,calendar:r={},dates:l={},locale:d,time:i={},exclude:u={},years:f}){const{minDate:m,maxDate:D,...x}=l,{offsets:p=[],...h}=r,{minTime:y,maxTime:C,...b}=i,[Y,k]=g(m,D,c),[v,P]=g(y,C,((e,t)=>e.h-t.h));return{selectedDates:e,onDatesChange:t,offsetDate:o,onOffsetChange:n,focusDate:a&&M(e,a)?a:void 0,calendar:{...O,...h,offsets:O.offsets.concat(p)},years:{...G,...f},dates:{...S,...x,minDate:Y&&s(Y),maxDate:k&&s(k)},locale:{...B,...d},time:{...A,minTime:v,maxTime:P,...b},exclude:u}}(t),[o,n]=e.useReducer(Z,ie(a));return{dispatch:n,selectedDates:a.selectedDates,offsetDate:a.offsetDate||o.offsetDate,state:o,config:a}},fe=({selectedDates:t,config:{locale:a}})=>e.useMemo((()=>({selectedDates:t,formattedDates:t.map((e=>((e,{locale:t,options:a})=>l(e,t,a))(e,a)))})),[t,a]),me=({config:t,selectedDates:a,dispatch:o})=>{const{onDatesChange:n,dates:{mode:r,toggle:c,selectSameDate:l}}=t;return{dayButton:e.useCallback((({$date:e,selected:d,disabled:i,active:u},{onClick:f,disabled:m,...g}={})=>K(i||!!m,(i=>{(!d||c||(a.forEach((t=>{h(s(t),e)&&ee(o,t)})),_(r)&&l))&&(_(r)&&1===a.length&&te(o,null),j(f,z((e=>{const r=((e,t,{mode:a,toggle:o,limit:n})=>o&&M(e,t)?e.filter((e=>!h(s(e),t))):"multiple"===a?!n||e.length<n?D(e,t):e:_(a)?2===e.length?[t]:D(e,t):[t])(a,e,t.dates);ee(o,M(r,e)?e:void 0),n(r)})))(i,e))}),{...g,..._(r)&&1===a.length&&{onMouseEnter(){te(o,e)}},tabIndex:u?0:-1},d)),[r,c,t.dates,n,a,o,l])}};var De=(e,s,n,{minDate:r,maxDate:c})=>{const{M:l,Y:i,D:u}=a(e),{Y:f,M:m}=a(t());return Array(12).fill(0).map(((e,D)=>{const g=o(t(i,D,1)),x=t(i,D,u>g?g:u);return{$date:x,month:d(x,n),selected:s.some((e=>{const{M:t,Y:s}=a(e);return s===i&&t===D})),active:l===D,now:D===m&&i===f,disabled:v(D,r)&&w(i,r)||E(D,c)&&$(i,c)}}))};const ge=({selectedDates:t,offsetDate:a,config:{locale:s,dates:o}})=>e.useMemo((()=>({months:De(a,t,s,o)})),[o,s,a,t]),xe=t=>({monthButton:e.useCallback((({$date:e,disabled:a,selected:s,active:o},{onClick:n,disabled:r,...c}={})=>K(!!r||a,(a=>j(n,z(se(t)))(a,e)),{...c,tabIndex:o?0:-1},s)),[t])});var pe=(e,{time:s,locale:o})=>{const n=t(),{interval:r,minTime:c,maxTime:l,useLocales:d}=s,{Y:f,M:D,D:g}=a(e||n),x=1440/r,p=i(f,D,g,c),y=i(f,D,g,l);return Array(x).fill(0).map(((a,s)=>{const c=t(f,D,g,0,s*r);return{$date:c,disabled:!e||k(p,c)||Y(y,c),now:h(c,n),selected:!!e&&h(e,c),time:d?u(c,o):m(c,o)}}))};const he=({state:{focusDate:t},config:a})=>e.useMemo((()=>({time:pe(t,a)})),[t,a]),ye=({selectedDates:t,state:{focusDate:a},config:{onDatesChange:s},dispatch:o})=>({timeButton:e.useCallback((({$date:e,selected:n,disabled:r,now:c},{onClick:l,disabled:d,...i}={})=>K(r||!!d,(r=>{n||j(l,z((e=>{const n=t.map((t=>h(a,t)?e:t));ee(o,e),s(n)})))(r,e)}),{...i,tabIndex:n||c?0:-1},n)),[t,s,o,a])}),Ce=(e,s,o,{numberOfYears:n},{minDate:r,maxDate:c})=>{const{Y:l,M:d,D:i}=a(s),{Y:u}=a(t());return Array(n).fill(0).map(((s,n)=>{const f=e+n;return{$date:t(f,d,i),active:l===f,disabled:P(f,r)||T(f,c),now:f===u,selected:o.some((e=>a(e).Y===f)),year:f}}))},be=({selectedDates:t,offsetDate:a,state:{offsetYear:s},config:{years:o,dates:n}})=>e.useMemo((()=>({years:Ce(s,a,t,o,n)})),[a,s,t,o,n]),Ye=s=>{const{offsetDate:o,state:{offsetYear:n},config:{dates:r,years:c},dispatch:l}=s,{minDate:d,maxDate:i}=r,{step:u,numberOfYears:f,mode:m}=c,{D:D,M:g}=a(o);return{yearButton:e.useCallback((({$date:e,disabled:t,selected:a,active:o},{onClick:n,disabled:r,...c}={})=>K(!!r||t,(t=>j(n,z(se(s)))(t,e)),{...c,tabIndex:o?0:-1},a)),[s]),nextYearsButton:e.useCallback((({onClick:e,disabled:a,...s}={})=>{const o=t(n+f-1,g,D),r=!!a||Y(i,o)||le(m)&&!!i&&h(i,o);return K(r,(t=>j(e,J((()=>ae(l,n+u))))(t)),s)}),[i,l,n,u,D,g,f,m]),previousYearsButton:e.useCallback((({onClick:e,disabled:a,...s}={})=>{const o=!!a||k(d,t(n,g,D));return K(o,(t=>j(e,J((()=>ae(l,n-u))))(t)),s)}),[d,l,n,u,g,D])}},ke=e=>{const t=ue(e);return{data:{...U(t),...fe(t),...ge(t),...he(t),...be(t)},propGetters:{...me(t),...xe(t),...ye(t),...Ye(t),...ce(t)}}};var Me=e.createContext({}),ve=e.createContext({}),Pe=()=>e.useContext(ve);exports.DatePickerProvider=({children:t,config:a})=>e.createElement(Me.Provider,{value:ke(a)},t),exports.DatePickerStateProvider=({children:t,config:a})=>e.createElement(ve.Provider,{value:ue(a)},t),exports.useCalendars=U,exports.useContextCalendars=()=>U(Pe()),exports.useContextDatePickerOffsetPropGetters=()=>ce(Pe()),exports.useContextDays=()=>fe(Pe()),exports.useContextDaysPropGetters=()=>me(Pe()),exports.useContextMonths=()=>ge(Pe()),exports.useContextMonthsPropGetters=()=>xe(Pe()),exports.useContextTime=()=>he(Pe()),exports.useContextTimePropGetters=()=>ye(Pe()),exports.useContextYears=()=>be(Pe()),exports.useContextYearsPropGetters=()=>Ye(Pe()),exports.useDatePicker=ke,exports.useDatePickerContext=()=>e.useContext(Me),exports.useDatePickerOffsetPropGetters=ce,exports.useDatePickerState=ue,exports.useDatePickerStateContext=Pe,exports.useDays=fe,exports.useDaysPropGetters=me,exports.useMonths=ge,exports.useMonthsPropGetters=xe,exports.useTime=he,exports.useTimePropGetter=ye,exports.useYears=be,exports.useYearsPropGetters=Ye;
//# sourceMappingURL=index.cjs.js.map
;