forked from jcgertig/date-input-polyfill
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdate-input-polyfill.esm.js
1 lines (1 loc) · 17.7 KB
/
date-input-polyfill.esm.js
1
!function(t,e){void 0===e&&(e={});var n=e.insertAt;if(t&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&a.firstChild?a.insertBefore(i,a.firstChild):a.appendChild(i),i.styleSheet?i.styleSheet.cssText=t:i.appendChild(document.createTextNode(t))}}('.date-input-polyfill-reset, date-input-polyfill, date-input-polyfill select, date-input-polyfill table, date-input-polyfill th, date-input-polyfill td {\n background: #fff;\n color: #000;\n text-shadow: none;\n border: 0;\n padding: 0;\n height: auto;\n width: auto;\n line-height: normal;\n font-family: sans-serif;\n font-size: 14px;\n}\n\ndate-input-polyfill {\n position: absolute !important;\n text-align: center;\n box-shadow: 0px 3px 10px 1px rgba(0,0,0,0.22);\n cursor: default;\n z-index: 1;\n border-radius: 5px;\n -moz-border-radius: 5px;\n -webkit-border-radius: 5px;\n overflow: hidden;\n display: block\n}\n\ndate-input-polyfill[data-open="false"] {\n visibility: hidden;\n z-index: -100 !important;\n top: 0;\n }\n\ndate-input-polyfill[data-open="true"] {\n visibility: visible;\n }\n\ndate-input-polyfill select, date-input-polyfill table, date-input-polyfill th, date-input-polyfill td {\n\n box-shadow: none;\n font-family: \'Lato\', Helvetica, Arial, sans-serif;\n }\n\ndate-input-polyfill select, date-input-polyfill button {\n border: 0;\n border-radius: 0;\n border-bottom: 1px solid #DADFE1;\n height: 24px;\n vertical-align: top;\n -webkit-appearance: none;\n -moz-appearance: none;\n }\n\ndate-input-polyfill .monthSelect-wrapper {\n width: 55%;\n display: inline-block;\n }\n\ndate-input-polyfill .yearSelect-wrapper {\n width: 25%;\n display: inline-block;\n }\n\ndate-input-polyfill select {\n width: 100%\n }\n\ndate-input-polyfill select:first-of-type {\n border-right: 1px solid #DADFE1;\n border-radius: 5px 0 0 0;\n -moz-border-radius: 5px 0 0 0;\n -webkit-border-radius: 5px 0 0 0;\n }\n\ndate-input-polyfill button {\n width: 20%;\n background: #DADFE1;\n border-radius: 0 5px 0 0;\n -moz-border-radius: 0 5px 0 0;\n -webkit-border-radius: 0 5px 0 0\n }\n\ndate-input-polyfill button:hover {\n background: #eee;\n }\n\ndate-input-polyfill table {\n border-collapse: separate !important;\n border-radius: 0 0 5px 5px;\n -moz-border-radius: 0 0 5px 5px;\n -webkit-border-radius: 0 0 5px 5px;\n overflow: hidden;\n max-width: 280px;\n width: 280px;\n }\n\ndate-input-polyfill th, date-input-polyfill td {\n width: 32px;\n padding: 4px;\n text-align: center;\n box-sizing: content-box;\n }\n\ndate-input-polyfill td[data-day] {\n cursor: pointer\n }\n\ndate-input-polyfill td[data-day]:hover {\n background: #DADFE1;\n }\n\ndate-input-polyfill [data-selected] {\n font-weight: bold;\n background: #D8EAF6;\n }\n');const t={"en_en-US_en-UK":{days:["Su","Mo","Tu","We","Th","Fr","Sa"],months:["January","February","March","April","May","June","July","August","September","October","November","December"]},"zh_zh-CN":{days:["星期天","星期一","星期二","星期三","星期四","星期五","星期六"],months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"]},"zh-Hans_zh-Hans-CN":{days:["周日","周一","周二","周三","周四","周五","周六"],months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"]},"zh-Hant_zh-Hant-TW":{days:["週日","週一","週二","週三","週四","週五","週六"],months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"]},"de_de-DE":{days:["Sonntag","Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag"],months:["Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember"],today:"Heute",format:"DD.MM.YYYY"},"nl_nl-NL_nl-BE":{days:["Zondag","Maandag","Dinsdag","Woensdag","Donderdag","Vrijdag","Zaterdag"],months:["Januari","Februari","Maart","April","Mei","Juni","Juli","Augustus","September","Oktober","November","December"],today:"Vandaag",format:"D/M/Y"},"pt_pt-BR":{days:["Dom","Seg","Ter","Qua","Qui","Sex","Sáb"],months:["Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho","Agosto","Setembro","Outubro","Novembro","Dezembro"],today:"Hoje"},"fr_fr-FR_fr-BE":{days:["Di","Lu","Ma","Me","Je","Ve","Sa"],months:["Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre"],today:"Aujourd'hui",format:"D/M/Y"},"es_es-VE":{days:["Do","Lu","Ma","Mi","Ju","Vi","Sa"],months:["Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre"],today:"Hoy",format:"D/M/Y"},"da_da-dk":{days:["Søndag","Mandag","Tirsdag","Onsdag","Torsdag","Fredag","Lørdag"],months:["Januar","Februar","Marts","April","Maj","Juni","Juli","August","September","Oktober","November","December"],today:"I dag",format:"dd/MM-YYYY"},"ru_ru-RU_ru-UA_ru-KZ_ru-MD":{days:["Вс","Пн","Вт","Ср","Чт","Пт","Сб"],months:["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Август","Сентябрь","Октябрь","Ноябрь","Декабрь"],today:"Сегодня",format:"D.M.Y"},"uk_uk-UA":{days:["Нд","Пн","Вт","Ср","Чт","Пт","Сб"],months:["Січень","Лютий","Березень","Квітень","Травень","Червень","Липень","Серпень","Вересень","Жовтень","Листопад","Грудень"],today:"Cьогодні",format:"D.M.Y"},"sv_sv-SE":{days:["Söndag","Måndag","Tisdag","Onsdag","Torsdag","Fredag","Lördag"],months:["Januari","Februari","Mars","April","Maj","Juni","Juli","Augusti","September","Oktober","November","December"],today:"Idag",format:"YYYY-MM-dd"},"test_test-TEST":{days:["Foo","Mon","Tue","Wed","Thu","Fri","Sat"],months:["Foo","February","March","April","May","June","July","August","September","October","November","December"]},ja:{days:["日","月","火","水","木","金","土"],months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],today:"今日",format:"YYYY-MM-dd"}};var e,n=(function(t,e){function n(t){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}!function(a){var i,r,o,s=arguments,d=(i=/d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LlopSZWN]|"[^"]*"|'[^']*'/g,r=/\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,o=/[^-+\dA-Z]/g,function(t,e,n,a){if(1!==s.length||"string"!==h(t)||/\d/.test(t)||(e=t,t=void 0),(t=t||0===t?t:new Date)instanceof Date||(t=new Date(t)),isNaN(t))throw TypeError("Invalid date");var m=(e=String(d.masks[e]||e||d.masks.default)).slice(0,4);"UTC:"!==m&&"GMT:"!==m||(e=e.slice(4),n=!0,"GMT:"===m&&(a=!0));var p=function(){return n?"getUTC":"get"},y=function(){return t[p()+"Date"]()},f=function(){return t[p()+"Day"]()},b=function(){return t[p()+"Month"]()},g=function(){return t[p()+"FullYear"]()},D=function(){return t[p()+"Hours"]()},M=function(){return t[p()+"Minutes"]()},v=function(){return t[p()+"Seconds"]()},T=function(){return t[p()+"Milliseconds"]()},A=function(){return n?0:t.getTimezoneOffset()},x={d:function(){return y()},dd:function(){return l(y())},ddd:function(){return d.i18n.dayNames[f()]},dddd:function(){return d.i18n.dayNames[f()+7]},m:function(){return b()+1},mm:function(){return l(b()+1)},mmm:function(){return d.i18n.monthNames[b()]},mmmm:function(){return d.i18n.monthNames[b()+12]},yy:function(){return String(g()).slice(2)},yyyy:function(){return l(g(),4)},h:function(){return D()%12||12},hh:function(){return l(D()%12||12)},H:function(){return D()},HH:function(){return l(D())},M:function(){return M()},MM:function(){return l(M())},s:function(){return v()},ss:function(){return l(v())},l:function(){return l(T(),3)},L:function(){return l(Math.floor(T()/10))},t:function(){return D()<12?d.i18n.timeNames[0]:d.i18n.timeNames[1]},tt:function(){return D()<12?d.i18n.timeNames[2]:d.i18n.timeNames[3]},T:function(){return D()<12?d.i18n.timeNames[4]:d.i18n.timeNames[5]},TT:function(){return D()<12?d.i18n.timeNames[6]:d.i18n.timeNames[7]},Z:function(){return a?"GMT":n?"UTC":(String(t).match(r)||[""]).pop().replace(o,"").replace(/GMT\+0000/g,"UTC")},o:function(){return(A()>0?"-":"+")+l(100*Math.floor(Math.abs(A())/60)+Math.abs(A())%60,4)},p:function(){return(A()>0?"-":"+")+l(Math.floor(Math.abs(A())/60),2)+":"+l(Math.floor(Math.abs(A())%60),2)},S:function(){return["th","st","nd","rd"][y()%10>3?0:(y()%100-y()%10!=10)*y()%10]},W:function(){return u(t)},N:function(){return c(t)}};return e.replace(i,(function(t){return t in x?x[t]():t.slice(1,t.length-1)}))});d.masks={default:"ddd mmm dd yyyy HH:MM:ss",shortDate:"m/d/yy",paddedShortDate:"mm/dd/yyyy",mediumDate:"mmm d, yyyy",longDate:"mmmm d, yyyy",fullDate:"dddd, mmmm d, yyyy",shortTime:"h:MM TT",mediumTime:"h:MM:ss TT",longTime:"h:MM:ss TT Z",isoDate:"yyyy-mm-dd",isoTime:"HH:MM:ss",isoDateTime:"yyyy-mm-dd'T'HH:MM:sso",isoUtcDateTime:"UTC:yyyy-mm-dd'T'HH:MM:ss'Z'",expiresHeaderFormat:"ddd, dd mmm yyyy HH:MM:ss Z"},d.i18n={dayNames:["Sun","Mon","Tue","Wed","Thu","Fri","Sat","Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec","January","February","March","April","May","June","July","August","September","October","November","December"],timeNames:["a","p","am","pm","A","P","AM","PM"]};var l=function(t,e){for(t=String(t),e=e||2;t.length<e;)t="0"+t;return t},u=function(t){var e=new Date(t.getFullYear(),t.getMonth(),t.getDate());e.setDate(e.getDate()-(e.getDay()+6)%7+3);var n=new Date(e.getFullYear(),0,4);n.setDate(n.getDate()-(n.getDay()+6)%7+3);var a=e.getTimezoneOffset()-n.getTimezoneOffset();e.setHours(e.getHours()-a);var i=(e-n)/6048e5;return 1+Math.floor(i)},c=function(t){var e=t.getDay();return 0===e&&(e=7),e},h=function(t){return null===t?"null":void 0===t?"undefined":"object"!==n(t)?n(t):Array.isArray(t)?"array":{}.toString.call(t).slice(8,-1).toLowerCase()};"object"===n(e)?t.exports=d:a.dateFormat=d}(void 0)}(e={exports:{}},e.exports),e.exports);class a{constructor(){this.date=new Date,this.input=null,this.isOpen=!1,this.container=document.createElement("date-input-polyfill"),this.year=document.createElement("select"),a.createRangeSelect(this.year,1890,this.date.getFullYear()+20),this.year.className="yearSelect",this.year.addEventListener("change",(()=>{this.date.setYear(this.year.value),this.refreshDaysMatrix()}));const t=document.createElement("span");t.className="yearSelect-wrapper",t.appendChild(this.year),this.container.appendChild(t),this.month=document.createElement("select"),this.month.className="monthSelect",this.month.addEventListener("change",(()=>{this.date.setMonth(this.month.value),this.refreshDaysMatrix()}));const e=document.createElement("span");e.className="monthSelect-wrapper",e.appendChild(this.month),this.container.appendChild(e),this.today=document.createElement("button"),this.today.textContent="Today",this.today.addEventListener("click",(()=>{const t=new Date;this.date=new Date(`${t.getFullYear()}/${`0${t.getMonth()+1}`.slice(-2)}/${`0${t.getDate()}`.slice(-2)}`),this.setInput()})),this.container.appendChild(this.today);const n=document.createElement("table");this.daysHead=document.createElement("thead"),this.days=document.createElement("tbody"),this.days.addEventListener("click",(t=>{const e=t.target;if(!e.hasAttribute("data-day"))return!1;const n=this.days.querySelector("[data-selected]");n&&n.removeAttribute("data-selected"),e.setAttribute("data-selected",""),this.date.setDate(parseInt(e.textContent)),this.setInput()})),n.appendChild(this.daysHead),n.appendChild(this.days),this.container.appendChild(n),this.hide(),document.body.appendChild(this.container),this.removeClickOut=t=>{if(this.isOpen){let e=t.target,n=e===this.container||e===this.input;for(;!n&&(e=e.parentNode);)n=e===this.container;("date"!==t.target.getAttribute("type")&&!n||!n)&&this.hide()}},this.removeBlur=t=>{this.isOpen&&this.hide()}}hide(){this.container.setAttribute("data-open",this.isOpen=!1),this.input&&this.input.blur(),document.removeEventListener("mousedown",this.removeClickOut),document.removeEventListener("touchstart",this.removeClickOut)}show(){this.container.setAttribute("data-open",this.isOpen=!0),setTimeout((()=>{document.addEventListener("mousedown",this.removeClickOut),document.addEventListener("touchstart",this.removeClickOut)}),500),window.onpopstate=()=>{this.hide()}}goto(t){const e=t.getBoundingClientRect();this.container.style.top=`${e.top+e.height+(document.documentElement.scrollTop||document.body.scrollTop)+3}px`;const n=this.container.getBoundingClientRect(),a=n.width?n.width:280,i=()=>this.container.className.replace("polyfill-left-aligned","").replace("polyfill-right-aligned","").replace(/\s+/g," ").trim();let r=e.right-a;e.right<a?(r=e.left,this.container.className=`${i()} polyfill-left-aligned`):this.container.className=`${i()} polyfill-right-aligned`,this.container.style.left=`${r+(document.documentElement.scrollLeft||document.body.scrollLeft)}px`,this.show()}attachTo(t){return(t!==this.input||!this.isOpen)&&(this.input=t,this.refreshLocale(),this.sync(),this.goto(this.input),!0)}sync(){isNaN(Date.parse(this.input.valueAsDate))?this.date=new Date:this.date=a.absoluteDate(this.input.valueAsDate),this.year.value=this.date.getFullYear(),this.month.value=this.date.getMonth(),this.refreshDaysMatrix()}setInput(){this.input.valueAsDate=this.date,this.input.focus(),setTimeout((()=>{this.hide()}),100),this.pingInput()}refreshLocale(){if(this.locale===this.input.locale)return!1;this.locale=this.input.locale,this.today.textContent=this.locale.today||"Today";const t=["<tr>"];for(let e=0,n=this.locale.days.length;e<n;++e)t.push(`<th scope="col">${this.locale.days[e]}</th>`);this.daysHead.innerHTML=t.join(""),a.createRangeSelect(this.month,0,11,this.locale.months)}refreshDaysMatrix(){this.refreshLocale();const t=this.date.getFullYear(),e=this.date.getMonth(),n=new Date(t,e,1).getDay(),i=new Date(this.date.getFullYear(),e+1,0).getDate(),r=a.absoluteDate(this.input.valueAsDate)||!1,o=r&&t===r.getFullYear()&&e===r.getMonth(),s=[];for(let t=0;t<i+n;++t){if(t%7==0&&s.push(`\n ${0!==t?"</tr>":""}\n <tr>\n `),t+1<=n){s.push("<td></td>");continue}const e=t+1-n,a=o&&r.getDate()===e;s.push(`<td data-day ${a?"data-selected":""}>\n ${e}\n </td>`)}this.days.innerHTML=s.join("")}pingInput(){let t,e;try{t=new Event("input",{bubbles:!0,cancelable:!1}),e=new Event("change",{bubbles:!0,cancelable:!1})}catch(n){t=document.createEvent("KeyboardEvent"),t.initEvent("input",!0,!1),e=document.createEvent("KeyboardEvent"),e.initEvent("change",!0,!1)}this.input.dispatchEvent(t),this.input.dispatchEvent(e)}static createRangeSelect(t,e,n,a){t.innerHTML="";for(let i=e;i<=n;++i){const n=document.createElement("option");t.appendChild(n);const r=a?a[i-e]:i;n.text=r,n.value=i}return t}static absoluteDate(t){return t&&new Date(t.getTime()+60*t.getTimezoneOffset()*1e3)}}let i;class r{constructor(t){i||(i=new a),this.element=t,this.element.setAttribute("data-has-picker",""),this.locale=this.element.getAttribute("lang")||document.body.getAttribute("lang")||"en",this.format=this.element.getAttribute("date-format")||document.body.getAttribute("date-format")||this.element.getAttribute("data-date-format")||document.body.getAttribute("data-date-format")||"yyyy-mm-dd",this.element.setAttribute("placeholder",this.format),this.localeText=this.getLocaleText(),Object.defineProperties(this.element,{valueAsDate:{get:()=>{if(!this.element.value)return null;const t=this.format||"yyyy-mm-dd",e=this.element.value.match(/(\d+)/g);let n=0;const a={};return t.replace(/(yyyy|dd|mm)/g,(t=>{a[t]=n++})),new Date(e[a.yyyy],e[a.mm]-1,e[a.dd])},set:t=>{this.element.value=n(t,this.format,!0)}},valueAsNumber:{get:()=>this.element.value?this.element.valueAsDate.valueOf():NaN,set:t=>{this.element.valueAsDate=new Date(t)}}});const e=t=>{const e=this.element;e.locale=this.localeText;i.attachTo(e)};this.element.addEventListener("focus",e),this.element.addEventListener("mouseup",e),this.element.addEventListener("keydown",(t=>{const e=new Date;switch(t.keyCode){case 9:case 27:i.hide();break;case 38:this.element.valueAsDate&&(e.setDate(this.element.valueAsDate.getDate()+1),this.element.valueAsDate=e,i.pingInput());break;case 40:this.element.valueAsDate&&(e.setDate(this.element.valueAsDate.getDate()-1),this.element.valueAsDate=e,i.pingInput())}i.sync()})),this.element.addEventListener("keyup",(t=>{i.sync()}))}getLocaleText(){const e=this.locale.toLowerCase();for(const n in t){const a=n.split("_");if(a.map((t=>t.toLowerCase())),~a.indexOf(e)||~a.indexOf(e.substr(0,2)))return t[n]}}static supportsDateInput(){const t=document.createElement("input");t.setAttribute("type","date");const e="not-a-date";return t.setAttribute("value",e),!(t.value===e)}static addPickerToDateInputs(){const t=document.querySelectorAll('input[type="date"]:not([data-has-picker])'),e=t.length;if(!e)return!1;for(let n=0;n<e;++n)new r(t[n])}static addPickerToOtherInputs(){const t=document.querySelectorAll('input[type="text"].date-polyfill:not([data-has-picker])'),e=t.length;if(!e)return!1;for(let n=0;n<e;++n)new r(t[n])}}const o=()=>{r.addPickerToOtherInputs(),r.supportsDateInput()||r.addPickerToDateInputs()},s=()=>{o(),document.querySelector("body").addEventListener("mousedown",(()=>{o()}))};"loading"!==document.readyState?s():document.addEventListener("DOMContentLoaded",(()=>{s()}));export{r as Input};//# sourceMappingURL=date-input-polyfill.esm.js.map