UNPKG

@nateradebaugh/react-datetime

Version:

A lightweight but complete datetime picker React.js component

3 lines (2 loc) 11.8 kB
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t),r=require("@reach/popover"),a=e(require("use-onclickoutside")),i=e(require("date-fns/format")),s=e(require("date-fns/parse")),o=e(require("date-fns/isDate")),c=e(require("date-fns/toDate")),u=e(require("date-fns/isValid")),l=e(require("date-fns/startOfDay")),d=e(require("clsx")),m=e(require("date-fns/getHours")),f=e(require("date-fns/addHours")),E=e(require("date-fns/addMinutes")),v=e(require("date-fns/addSeconds")),p=e(require("date-fns/addMilliseconds")),y=e(require("date-fns/setHours")),D=e(require("date-fns/addDays")),h=e(require("date-fns/differenceInDays")),O=e(require("date-fns/startOfWeek")),S=e(require("date-fns/startOfMonth")),M=e(require("date-fns/endOfMonth")),w=e(require("date-fns/isSameDay")),N=e(require("date-fns/isBefore")),T=e(require("date-fns/addMonths")),b=e(require("date-fns/getDate")),k=e(require("date-fns/addYears")),C=e(require("date-fns/isSameMonth")),q=e(require("date-fns/setMonth")),H=e(require("date-fns/getDaysInMonth")),L=e(require("date-fns/setDate")),_=e(require("date-fns/getYear")),R=e(require("date-fns/setYear")),g=e(require("date-fns/getDaysInYear")),A=e(require("date-fns/setDayOfYear")),I=e(require("date-fns/isSameYear"));function F(){return(F=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function Y(e,t){if(null==e)return{};var n,r,a={},i=Object.keys(e);for(r=0;r<i.length;r++)t.indexOf(n=i[r])>=0||(a[n]=e[n]);return a}var U,x,V,P=["hours","minutes","seconds","milliseconds"],j={hours:{step:1},minutes:{step:1},seconds:{step:1},milliseconds:{step:1}},B=function(e){var n=e.onUp,r=e.onDown,a=e.value;return null!=a?t.createElement(t.Fragment,null,e.showPrefix&&t.createElement("div",{className:"rdtCounterSeparator"},":"),t.createElement("div",{className:"rdtCounter"},t.createElement("span",{className:"rdtBtn",onMouseDown:n},"▲"),t.createElement("div",{className:"rdtCount"},a),t.createElement("span",{className:"rdtBtn",onMouseDown:r},"▼"))):null},K={hours:f,minutes:E,seconds:v,milliseconds:p};function W(e,t,n,r){var a="sub"===e?-1:1,i=function(e,t){var n=j[e].step,r=t?t[e]:void 0;return r&&r.step&&(n=r.step),n}(t,r)*a;return K[t](n,i)}function z(e,t,n,r){var a=n;function s(e,t){return-1!==e.indexOf(t)}var o=s(a.toLowerCase(),ee.SHORT_HOUR),c=s(a,ee.SHORT_MINUTE),u=s(a,ee.SHORT_SECOND),l=s(a,ee.SHORT_MILLISECOND),d=s(a,ee.AM_PM),m="hours"===e&&o?d?ee.HOUR:ee.MILITARY_HOUR:"minutes"===e&&c?ee.MINUTE:"seconds"===e&&u?ee.SECOND:"milliseconds"===e&&l?ee.MILLISECOND:"daypart"===e&&d?ee.AM_PM:void 0;if(m)return i(t,m,r)}function G(e,t){return function(){var n=m(e);t(y(e,n>=12?n-12:n+12))}}function J(e,t,n){return function(){var r=n.timeConstraints,a=n.setViewTimestamp,i=n.setSelectedDate;if(!n.readonly){var s=W(e,t,n.viewTimestamp,r);a(s),U=setTimeout((function(){x=setInterval((function(){s=W(e,t,s,r),a(s)}),70)}),500),V=function(){clearTimeout(U),clearInterval(x),i(s),document.body.removeEventListener("mouseup",V),document.body.removeEventListener("touchend",V)},document.body.addEventListener("mouseup",V),document.body.addEventListener("touchend",V)}}}var Q=["viewMode","isStatic","id","className","style"],X={time:function(e){var n=e.viewTimestamp,r=e.dateFormat,a=e.setViewMode,s=e.timeFormat,o=e.formatOptions,c=e.setSelectedDate,u=0;return t.createElement("div",{className:"rdtTime","data-testid":"time-picker"},t.createElement("table",null,r?t.createElement("thead",null,t.createElement("tr",null,t.createElement("th",{className:"rdtSwitch","data-testid":"time-mode-switcher",colSpan:4,onClick:function(){return a("days")}},i(n,r)))):null,t.createElement("tbody",null,t.createElement("tr",null,t.createElement("td",null,t.createElement("div",{className:"rdtCounters"},P.map((function(r){var a=z(r,n,s,o);return a&&u++,t.createElement(B,{key:r,showPrefix:u>1,onUp:J("add",r,e),onDown:J("sub",r,e),value:a})})),t.createElement(B,{onUp:G(n,c),onDown:G(n,c),value:z("daypart",n,s,o)})))))))},months:function(e){var n=e.viewDate,r=e.setViewDate,a=e.selectedDate,s=e.setSelectedDate,o=e.formatOptions,c=e.setViewMode,u=e.isValidDate;return t.createElement("div",{className:"rdtMonths","data-testid":"month-picker"},t.createElement("table",null,t.createElement("thead",null,t.createElement("tr",null,t.createElement("th",{className:"rdtPrev",onClick:function(){return r(k(n,-1))}},t.createElement("span",null,"‹")),t.createElement("th",{className:"rdtSwitch","data-testid":"month-mode-switcher",onClick:function(){return c("years")},colSpan:2},i(n,ee.YEAR,o)),t.createElement("th",{className:"rdtNext",onClick:function(){return r(k(n,1))}},t.createElement("span",null,"›"))))),t.createElement("table",null,t.createElement("tbody",null,[0,1,2].map((function(e){var r=4*e;return t.createElement("tr",{key:r},[0,1,2,3].map((function(e){var c=e+r,l=q(n,c),m=Array.from({length:H(l)},(function(e,t){return L(l,t+1)})).every((function(e){return"function"==typeof u&&!u(e)})),f=q(new Date,c),E=a&&C(a,l);return t.createElement("td",{key:c,className:d(["rdtMonth",{rdtDisabled:m,rdtActive:E}]),onClick:function(){m||s(q(n,c))}},i(f,ee.SHORT_MONTH_NAME,o))})))})))))},years:function(e){var n=e.viewDate,r=e.setViewDate,a=e.selectedDate,s=e.setSelectedDate,o=e.formatOptions,c=e.setViewMode,u=e.isValidDate,l=10*Math.floor(_(n)/10);return t.createElement("div",{className:"rdtYears","data-testid":"year-picker"},t.createElement("table",null,t.createElement("thead",null,t.createElement("tr",null,t.createElement("th",{className:"rdtPrev",onClick:function(){return r(k(n,-10))}},t.createElement("span",null,"‹")),t.createElement("th",{className:"rdtSwitch","data-testid":"year-mode-switcher",onClick:function(){return c("years")},colSpan:2},l,"-",l+9),t.createElement("th",{className:"rdtNext",onClick:function(){return r(k(n,10))}},t.createElement("span",null,"›"))))),t.createElement("table",null,t.createElement("tbody",null,[0,1,2].map((function(e){var r=l-1+4*e;return t.createElement("tr",{key:r},[0,1,2,3].map((function(e){var c=e+r,l=R(n,c),m=Array.from({length:g(n)},(function(e,t){return A(l,t+1)})).every((function(e){return"function"==typeof u&&!u(e)})),f=a&&I(a,l);return t.createElement("td",{key:c,className:d(["rdtYear",{rdtDisabled:m,rdtActive:f}]),onClick:function(){m||s(R(n,c))}},i(l,"yyyy",o))})))})))))},days:function(e){var n=e.timeFormat,r=e.viewDate,a=e.setViewDate,s=e.selectedDate,o=e.setSelectedDate,c=e.formatOptions,u=e.setViewMode,l=e.isValidDate,m=O(r,c),f=T(r,-1),E=h(O(M(f),c),r),v=D(r,E);return t.createElement("div",{className:"rdtDays","data-testid":"day-picker"},t.createElement("table",null,t.createElement("thead",null,t.createElement("tr",null,t.createElement("th",{className:"rdtPrev",onClick:function(){return a(T(r,-1))}},t.createElement("span",null,"‹")),t.createElement("th",{className:"rdtSwitch","data-testid":"day-mode-switcher",onClick:function(){return u("months")},colSpan:5},i(r,ee.FULL_MONTH_NAME+" "+ee.YEAR,c)),t.createElement("th",{className:"rdtNext",onClick:function(){return a(T(r,1))}},t.createElement("span",null,"›"))),t.createElement("tr",null,[0,1,2,3,4,5,6].map((function(e){return t.createElement("th",{key:e,className:"dow"},i(D(m,e),ee.SHORT_DAY_OF_WEEK,c))})))),t.createElement("tbody",null,[0,1,2,3,4,5].map((function(e){var n=7*e;return t.createElement("tr",{key:i(D(v,n),ee.FULL_TIMESTAMP)},[0,1,2,3,4,5,6].map((function(e){var a=D(v,e+n),u="function"==typeof l&&!l(a),m=s&&w(a,s);return t.createElement("td",{key:b(a),className:d(["rdtDay",{rdtOld:N(a,S(r)),rdtNew:N(M(r),a),rdtActive:m,rdtToday:w(a,new Date),rdtDisabled:u}]),onClick:function(){u||o(a)}},i(a,ee.SHORT_DAY,c))})))}))),n?t.createElement("tfoot",null,t.createElement("tr",null,t.createElement("td",{onClick:function(){return u("time")},colSpan:7,className:"rdtTimeToggle","data-testid":"day-to-time-mode-switcher"},i(r,n,c)))):null))}},Z=t.forwardRef((function(e,n){var r=e.viewMode,a=e.isStatic,i=e.id,s=e.className,o=e.style,c=Y(e,Q);if(!r)return null;var u=X[r];return t.createElement("div",{ref:n,id:i,"data-testid":"picker-wrapper",className:d(["rdtPicker",s,{rdtStatic:a}]),style:o},u&&t.createElement(u,Object.assign({},c)))})),$=["isValidDate","dateTypeMode","value","onChange","onBlur","onFocus","dateFormat","timeFormat","locale","weekStartsOn","shouldHideInput","timeConstraints"],ee={MONTH:"LL",SHORT_MONTH_NAME:"LLL",FULL_MONTH_NAME:"LLLL",SHORT_DAY:"d",DAY:"dd",SHORT_DAY_OF_WEEK:"iiiiii",YEAR:"yyyy",MILITARY_HOUR:"H",HOUR:"h",SHORT_HOUR:"h",SHORT_MINUTE:"m",MINUTE:"mm",SHORT_SECOND:"s",SECOND:"ss",SHORT_MILLISECOND:"SSS",MILLISECOND:"SSS",AM_PM:"a",FULL_TIMESTAMP:"yyyy-MM-dd'T'HH:mm:ss.SSSxxx"};function te(e){var n=t.useState(void 0),r=n[1],a=n[0]||e,i=e.getTime();return t.useEffect((function(){r(void 0)}),[i]),[a,r]}function ne(e,t,n){if("string"==typeof e){var r=s(e,t,new Date,n);if(u(r)&&e===i(r,t,n))return r}else if(e){var a=c(e);if(u(a))return a}}var re={days:"days",months:"days",years:"months"},ae=function(e){var s=e.isValidDate,u=e.dateTypeMode,d=e.value,m=e.onChange,f=e.onBlur,E=e.onFocus,v=e.dateFormat,p=void 0===v||v,y=e.timeFormat,D=void 0===y||y,h=e.locale,O=e.weekStartsOn,S=e.shouldHideInput,M=void 0!==S&&S,w=e.timeConstraints,N=Y(e,$),T=e.disabled||e.readOnly,b=!0===p?ee.MONTH+"/"+ee.DAY+"/"+ee.YEAR:!1===p?"":p,k=!0===D?ee.HOUR+":"+ee.MINUTE+" "+ee.AM_PM:!1===D?"":D,C=b&&k?b+" "+k:b||k||"",q=t.useMemo((function(){return{locale:h,weekStartsOn:"number"==typeof O?O%7:O}}),[h,O]),H=ne(d,C,q),L=function(e){if("string"==typeof e){var t=e.toLowerCase();switch(t){case"utc-ms-timestamp":case"input-format":return t}}return"Date"}(u),_=t.useCallback((function(e){if("string"==typeof e)return e;if(!e)return e;switch(L){case"utc-ms-timestamp":return e.getTime();case"input-format":return i(e,C,q)}return e}),[L,q,C]),R=t.useCallback((function(e){if("function"==typeof m){var t=_(e);if(d&&t&&o(d)&&o(t)&&i(d,C,q)===i(t,C,q))return;m(t)}}),[q,C,_,m,d]),g=te(H||l(new Date)),A=g[0],I=g[1],U=function(e,t){if(e){if(e.match(/[d]/))return"days";if(-1!==e.indexOf("L"))return"months";if(-1!==e.indexOf("y"))return"years"}if(t)return"time"}(b,k),x=function(e){var n=t.useState(void 0),r=n[1],a=n[0]||e;return t.useEffect((function(){r(void 0)}),[e]),[a,r]}(U),V=x[0],P=x[1],j=te(H||A),B=j[0],K=j[1],W=t.useState(!1),z=W[0],G=W[1];function J(){T||!z&&V&&(G(!0),"function"==typeof E&&E())}function Q(e){if(z&&(G(!1),"function"==typeof f)){var t=_(e);f(t)}}function X(){return Q(H)}function ae(e,t){void 0===t&&(t=!0);var n=c(e);I(n),K(n),"time"===V?R(e):V===U?(R(e),t&&Q(e)):P(V?re[V]:void 0)}t.useEffect((function(){H&&ae(H)}),[L,C]);var ie=t.useRef(null),se=t.useRef(null);a(se,X);var oe=H&&C?i(H,C,q):"string"==typeof d?d:"",ce=F({},N,{ref:ie,type:"text",onClick:J,onFocus:J,onChange:function(e){var t=e.target.value,n=ne(t,C,q);n?ae(n,!1):R(t)},onKeyDown:function(e){if(z)switch(e.code){case"Enter":e.preventDefault(),ie.current&&ie.current.blur(),X();break;case"Escape":ie.current&&ie.current.blur(),X();break;case"Tab":X()}else switch(e.code){case"ArrowDown":J()}},value:oe}),ue={ref:se,dateFormat:b,timeFormat:k,viewDate:A,setViewDate:I,selectedDate:H,setSelectedDate:ae,viewTimestamp:B,setViewTimestamp:K,formatOptions:q,viewMode:V,setViewMode:P,isValidDate:s,isStatic:M,timeConstraints:w};return M?n.createElement(Z,Object.assign({},ce,ue)):n.createElement(n.Fragment,null,n.createElement("input",Object.assign({},ce)),z&&n.createElement(r.Popover,{targetRef:ie},n.createElement(Z,Object.assign({},ue))))};exports.DateTime=ae,exports.FORMATS=ee,exports.default=ae; //# sourceMappingURL=react-datetime.cjs.production.min.js.map