jb-calendar
Version:
jalali calendar interface web component
2 lines • 38.3 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("jb-core"),require("jb-core/theme"),require("jb-core/i18n")):"function"==typeof define&&define.amd?define(["exports","jb-core","jb-core/theme","jb-core/i18n"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).JBCalendar={},e.JBCore,e.JBCoreTheme,e.JBCoreI18N)}(this,(function(e,t,a,n){var r=Object.create,s=Object.defineProperty,o=Object.getOwnPropertyDescriptor,i=Object.getOwnPropertyNames,l=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,d=(e,t,a)=>(a=null!=e?r(l(e)):{},((e,t,a,n)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var r,l=i(t),d=0,h=l.length;d<h;d++)r=l[d],c.call(e,r)||r===a||s(e,r,{get:(e=>t[e]).bind(null,r),enumerable:!(n=o(t,r))||n.enumerable});return e})(!t&&e&&e.__esModule?a:s(a,"default",{value:e,enumerable:!0}),e));function h(e,t,a,n){if("a"===a&&!n)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!n:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===a?n:"a"===a?n.call(e):n?n.value:t.get(e)}function p(e,t,a,n,r){if("m"===n)throw new TypeError("Private method is not writable");if("a"===n&&!r)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!r:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?r.call(e,a):r?r.value=a:t.set(e,a),a}t=d(t),a=d(a),n=d(n);Math.pow(10,8);const y=Symbol.for("constructDateFrom");function m(e,t){return"function"==typeof e?e(t):e&&"object"==typeof e&&y in e?e[y](t):e instanceof Date?new e.constructor(t):new Date(t)}function u(e,t){return m(t||e,e)}function b(e,t){return u(e,t?.in).getDay()}function v(e,t){return u(e,t?.in).getMonth()}function w(e,t){return u(e,t?.in).getFullYear()}function f(e,t){return+u(e)===+u(t)}Math.pow(10,8);const g=Symbol.for("constructDateFrom"),j=1948320,x=[0,31,62,93,124,155,186,216,246,276,306,336];function D(e,t,a){return function(e){if(isNaN(e))return{jy:NaN,jm:NaN,jd:NaN};let t,a;const n=e-j;let r=1+L(33*n+3,12053);a=n-(365*(r-1)+L(8*r+21,33)),a<0&&(r--,a=n-(365*(r-1)+L(8*r+21,33)));t=a<216?L(a,31):L(a-6,30);const s=a-x[t]+1;a++;return{jy:r,jm:t+1,jd:s}}(function(e,t,a){const[n,r]=W(e,t);return e=n,t=r,L(1461*(e+4800+L(t-14,12)),4)+L(367*(t-2-12*L(t-14,12)),12)-L(3*L(e+4900+L(t-14,12),100),4)+a-32075}(e,t,a))}function S(e,t,a){return function(e){if(isNaN(e))return{gy:NaN,gm:NaN,gd:NaN};let t=e+68569;const a=L(4*t,146097);t-=L(146097*a+3,4);const n=L(4e3*(t+1),1461001);t=t-L(1461*n,4)+31;const r=L(80*t,2447),s=t-L(2447*r,80);t=L(r,11);return{gy:100*(a-49)+n+t,gm:r+2-12*t,gd:s}}(function(e,t,a){const[n,r]=W(e,t);e=n,t=r;const s=t-1,o=e,i=a;let l=1948319+365*(o-1)+L(8*o+21,33);0!=s&&(l+=x[s]);return l+i}(e,t,a))}function W(e,t){if((t-=1)<0){const n=t;e-=L((t=M(M(t,a=12)+a,a))-n,12)}var a;return t>11&&(e+=L(t,12),t=M(t,12)),[e,t+1]}function L(e,t){return~~(e/t)}function M(e,t){return e-~~(e/t)*t}function T(...e){if(e.length>1){const[t,a,n=1,...r]=e,s=S(t,a+1,n);return new Date(...[s.gy,s.gm-1,s.gd,...r])}return new Date(...e)}function Y(e,t){return"function"==typeof e?e(t):e&&"object"==typeof e&&g in e?e[g](t):e instanceof Date?new e.constructor(t):T(t)}function C(e,t){return Y(t||e,e)}function k(e){const t=e.getDate(),a=e.getMonth()+1;return D(e.getFullYear(),a,t).jd}function E(e){const t=e.getDate(),a=e.getMonth()+1;return D(e.getFullYear(),a,t).jm-1}function X(e){const t=e.getDate(),a=e.getMonth()+1;return D(e.getFullYear(),a,t).jy}function R(e,t){return C(e,t?.in).getDay()}function N(e,t){const a=C(e,t?.in),n=X(a),r=E(a),s=Y(a,0);return function(e,...t){const a=e.getDate(),n=e.getMonth()+1,r=D(e.getFullYear(),n,a),[s,o=r.jm-1,i=r.jd]=t,l=S(s,o+1,i);e.setFullYear(l.gy,l.gm-1,l.gd)}(s,n,r+1,0),s.setHours(0,0,0,0),k(s)}function O(e,t){return E(C(e,t?.in))}function B(e,t){return X(C(e,t?.in))}const A=new n.JBDictionary({fa:{jalaliMonthList:["فروردین","اردیبهشت","خرداد","تیر","مرداد","شهریور","مهر","آبان","آذر","دی","بهمن","اسفند"],gregorianMonthList:["ژانویه","فوریه","مارس","آپریل","می","ژوئن","ژوئیه","اوت","سپتامبر","اکتبر","نوامبر","دسامبر"],jalaliDayOfWeek:["ش","ی","د","س","چ","پ","ج"],gregorianDayOfWeek:["ی","د","س","چ","پ","ج","ش"],next:"بعدی",prev:"قبلی",showAllYear:"نمایش همه سالها"},en:{jalaliMonthList:["Farvardin","Ordibehesht","Khordad","Tir","Mordad","Shahrivar","Mehr","Aban","Azar","Dey","Bahman","Esfand"],gregorianMonthList:["January","February","March","April","May","June","July","August","September","October","November","December"],jalaliDayOfWeek:["Sa","Su","Mo","Tu","We","Th","Fr"],gregorianDayOfWeek:["Su","Mo","Tu","We","Th","Fr","Sa"],next:"next",prev:"previous",showAllYear:"Show all years"}});var P,H,q,F,$,z,I,J,_,G,V,K,Z,Q,U,ee,te,ae;const ne="JALALI",re="GREGORIAN";var se,oe;(oe=se||(se={})).day="DAY",oe.month="MONTH",oe.year="YEAR";const ie=new Date;null==HTMLElement&&console.error("you cant render web component on a server side");var le=class extends HTMLElement{setMonthList(e,t){if(Array.isArray(t)&&12==t.length){switch(e){case"JALALI":p(this,I,t.map((e=>e)),"f");break;case"GREGORIAN":p(this,J,t,"f")}h(this,P,"m",Z).call(this),h(this,P,"m",V).call(this,this.data.selectedMonth)}else console.error("Invalid Month List",t)}get defaultCalendarData(){return h(this,z,"f")}set defaultCalendarData(e){p(this,z,e,"f")}get value(){return h(this,q,"f")}set value(e){const{year:t,month:a,day:n}=e;if(t&&a&&n){h(this,q,"f").year=t,h(this,q,"f").month=a,h(this,q,"f").day=n,this.data.selectedYear=t,this.data.selectedMonth=a;const e=this.shadowRoot.querySelector(".--selected");if(null!==e&&e.classList.remove("--selected"),this.data.selectedYear==t&&this.data.selectedMonth==a){const e=this.shadowRoot.querySelector(`.day-wrapper[day-number="${n}"]`);e&&e.classList.add("--selected")}}else console.error("Invalid value. please make sure you have year,month and day")}get activeSection(){return h(this,F,"f")||se.day}set activeSection(e){if(e!=h(this,F,"f")){if(h(this,F,"f")){const e=h(this,F,"f").toLocaleLowerCase();this.elements.selectionSections[e].classList.remove("--show")}"DAY"==e&&(this.elements.selectionSections.day.classList.add("--show"),this.elements.navigatorTitle.month.classList.add("--show"),this.elements.navigatorTitle.year.classList.add("--show"),this.elements.navigatorTitle.yearRange.classList.remove("--show")),"MONTH"==e&&(this.elements.selectionSections.month.classList.add("--show"),this.elements.navigatorTitle.month.classList.remove("--show"),this.elements.navigatorTitle.year.classList.add("--show"),this.elements.navigatorTitle.yearRange.classList.remove("--show")),"YEAR"==e&&(this.elements.selectionSections.year.classList.add("--show"),this.elements.navigatorTitle.month.classList.remove("--show"),this.elements.navigatorTitle.year.classList.remove("--show"),this.elements.navigatorTitle.yearRange.classList.add("--show")),p(this,F,e,"f")}}get inputType(){return h(this,$,"f")}set inputType(e){p(this,$,e,"f"),this.onInputTypeChange()}get showPersianNumber(){return h(this,_,"f")}set showPersianNumber(e){"boolean"==typeof e?(p(this,_,e,"f"),this.setCalendarData()):console.error("showPersianNumber must be boolean")}get cssDirection(){return getComputedStyle(this).direction}get direction(){return h(this,G,"f")?h(this,G,"f"):this.cssDirection}set direction(e){!e||"ltr"!=e&&"rtl"!=e||(p(this,G,e,"f"),this.style.direction=e),this.setupStyleBaseOnCssDirection()}constructor(){super(),P.add(this),H.set(this,{daysWrapper:{startX:null,startY:null},yearsWrapper:{startX:null}}),q.set(this,{year:null,month:null,day:null}),F.set(this,null),$.set(this,"persian"==n.i18n.locale.calendar?ne:re),z.set(this,{jalali:{year:B(ie),month:O(ie)+1},gregorian:{year:w(ie),month:v(ie)+1}}),I.set(this,A.get(n.i18n,"jalaliMonthList")),J.set(this,A.get(n.i18n,"gregorianMonthList")),this.dateRestrictions=new Proxy({min:null,max:null},this.createDateRestrictionHandler()),this.data=new Proxy({selectedYear:0,selectedMonth:0,yearSelectionRange:[0,0]},this.createDataHandler()),_.set(this,"arabext"==n.i18n.locale.numberingSystem),G.set(this,null),this.initWebComponent(),this.initProps(),this.initCalendar()}connectedCallback(){this.callOnLoadEvent(),this.setupStyleBaseOnCssDirection(),this.initCalendarLayout()}initCalendarLayout(){h(this,P,"m",Z).call(this),this.fillDayOfWeek(),this.setCalendarData()}setupStyleBaseOnCssDirection(e=this.direction){"ltr"==e?(this.elements.navigatorTitle.nextButton.classList.add("--css-ltr"),this.elements.navigatorTitle.prevButton.classList.add("--css-ltr"),this.elements.monthDayWrapper.next.classList.add("--css-ltr"),this.elements.monthDayWrapper.prev.classList.add("--css-ltr"),this.elements.yearsWrapper.next.classList.add("--css-ltr"),this.elements.yearsWrapper.prev.classList.add("--css-ltr")):"rtl"==e&&(this.elements.navigatorTitle.nextButton.classList.remove("--css-ltr"),this.elements.navigatorTitle.prevButton.classList.remove("--css-ltr"),this.elements.monthDayWrapper.next.classList.remove("--css-ltr"),this.elements.monthDayWrapper.prev.classList.remove("--css-ltr"),this.elements.yearsWrapper.next.classList.remove("--css-ltr"),this.elements.yearsWrapper.prev.classList.remove("--css-ltr"))}fillDayOfWeek(){const e=A.get(n.i18n,"gregorianDayOfWeek"),t=A.get(n.i18n,"jalaliDayOfWeek"),a=this.inputType==ne?t:e;this.elements.dayOfWeekWrapper.innerHTML="";for(let e=0;e<=6;e++){const t=document.createElement("div");t.classList.add("week-day"),t.innerHTML=a[e],this.elements.dayOfWeekWrapper.appendChild(t)}}setCalendarData(){this.inputType==ne?(this.data.selectedYear=this.value.year||this.data.selectedYear||h(this,z,"f").jalali.year,this.data.selectedMonth=this.value.month||this.data.selectedMonth||h(this,z,"f").jalali.month,this.data.yearSelectionRange=[this.data.selectedYear-4,this.data.selectedYear+7],this.shadowRoot.querySelector(".swipe-up-text").innerHTML="نمایش سالها"):(this.data.selectedYear=this.value.year||this.data.selectedYear||h(this,z,"f").gregorian.year,this.data.selectedMonth=this.value.month||this.data.selectedMonth||h(this,z,"f").gregorian.month,this.data.yearSelectionRange=[this.data.selectedYear-4,this.data.selectedYear+7],this.shadowRoot.querySelector(".swipe-up-text").innerHTML="show years")}callOnLoadEvent(){const e=new CustomEvent("load",{bubbles:!0,composed:!0});this.dispatchEvent(e)}callOnInitEvent(){const e=new CustomEvent("init",{bubbles:!0,composed:!0});this.dispatchEvent(e)}initWebComponent(){const e=this.attachShadow({mode:"open"});(0,a.registerDefaultVariables)();const t=`<style>:host{width:max-content;height:max-content;display:block}.jb-calendar-web-component{width:272px;height:auto;color:var(--color);font-size:16px}.jb-calendar-web-component .navigator-section{cursor:pointer;justify-content:space-between;align-items:center;width:100%;height:32px;margin-bottom:24px;display:flex}.jb-calendar-web-component .navigator-section .arrow-btn{background-color:var(--arrow-button-bgcolor);border-radius:var(--arrow-button-border-radius);cursor:pointer;user-select:none;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.jb-calendar-web-component .navigator-section .arrow-btn.--css-ltr svg{transform:scaleX(-1)}.jb-calendar-web-component .navigator-section .arrow-btn svg{fill:var(--arrow-fill-color)}.jb-calendar-web-component .navigator-section .navigator-title{user-select:none}.jb-calendar-web-component .navigator-section .navigator-title .month{display:none}.jb-calendar-web-component .navigator-section .navigator-title .month.--show{display:inline}.jb-calendar-web-component .navigator-section .navigator-title .month.--show:hover{font-weight:600}.jb-calendar-web-component .navigator-section .navigator-title .year{display:none}.jb-calendar-web-component .navigator-section .navigator-title .year.--show{display:inline}.jb-calendar-web-component .navigator-section .navigator-title .year.--show:hover{font-weight:600}.jb-calendar-web-component .navigator-section .navigator-title .year-range{display:none}.jb-calendar-web-component .navigator-section .navigator-title .year-range.--show{display:inline}.jb-calendar-web-component .calendar-section{width:100%;height:auto;position:relative}.jb-calendar-web-component .calendar-section .day-selection-section{display:none}.jb-calendar-web-component .calendar-section .day-selection-section.--show{display:block}.jb-calendar-web-component .calendar-section .day-selection-section .week-day-wrapper{grid-template-rows:1fr;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr;gap:4px;width:100%;height:32px;margin-bottom:16px;display:grid}.jb-calendar-web-component .calendar-section .day-selection-section .week-day-wrapper .week-day{text-align:center;font-variation-settings:"wght" 800;user-select:none;height:32px;font-size:1em;font-weight:800}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container{width:100%;height:auto;position:relative;overflow-x:hidden}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper{user-select:none;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr;grid-auto-rows:1fr;gap:4px;width:100%;height:auto;display:grid}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper.current-month-day-wrapper{position:static}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper.prev-month-day-wrapper{width:100%;height:100%;position:absolute;top:0;left:100%;overflow:hidden}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper.prev-month-day-wrapper.--css-ltr{left:-100%}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper.next-month-day-wrapper{width:100%;height:100%;position:absolute;top:0;left:-100%;overflow:hidden}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper.next-month-day-wrapper.--css-ltr{left:100%}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper{user-select:none;cursor:pointer;width:32px;height:37px;position:relative}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper.--disable{cursor:not-allowed}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper.--disable .day-number-wrapper{color:var(--day-text-color-disabled)}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper.--today .day-number-wrapper{color:var(--day-text-color-today)}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper.--today .status-point{display:block}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper.--selected .day-number-wrapper{color:var(--day-color-selected);background-color:var(--day-bgcolor-selected)}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper.--selected:hover .day-number-wrapper{color:var(--day-color-selected-hover);background-color:var(--day-bgcolor-selected-hover)}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper:hover .day-number-wrapper{background-color:var(--day-bgcolor-hover);color:var(--day-color-hover)}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper .day-number-wrapper{border-radius:var(--day-button-border-radius);width:32px;height:32px;color:var(--day-text-color);justify-content:center;align-items:center;display:flex}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper .day-number-wrapper .day-number{justify-content:center;align-items:center;display:flex}.jb-calendar-web-component .calendar-section .day-selection-section .month-day-container .month-day-wrapper .day-wrapper .status-point{background-color:var(--status-point-bgcolor-today);z-index:1;border:1px solid var(--status-point-border-color);box-sizing:border-box;border-radius:6px;width:10px;height:10px;display:none;position:absolute;bottom:0;left:calc(50% - 5px)}.jb-calendar-web-component .calendar-section .month-selection-section{grid-template-rows:1fr 1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr;gap:12px 8px;display:none}.jb-calendar-web-component .calendar-section .month-selection-section.--show{display:grid}.jb-calendar-web-component .calendar-section .month-selection-section .month-wrapper{cursor:pointer;border-radius:var(--month-button-border-radius);user-select:none;width:100%;height:32px}.jb-calendar-web-component .calendar-section .month-selection-section .month-wrapper:hover{background-color:var(--month-bgcolor-hover)}.jb-calendar-web-component .calendar-section .month-selection-section .month-wrapper .month-name{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.jb-calendar-web-component .calendar-section .month-selection-section .month-wrapper .month-name:hover{color:var(--month-color-hover)}.jb-calendar-web-component .calendar-section .year-selection-section{width:100%;height:100%;display:none;position:relative;overflow-x:hidden}.jb-calendar-web-component .calendar-section .year-selection-section.--show{display:block}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper{user-select:none;grid-template-rows:1fr 1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr;gap:12px 8px;width:100%;height:100%;display:grid}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper.prev-years-wrapper{width:100%;height:100%;position:absolute;top:0;left:100%;overflow:hidden}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper.prev-years-wrapper.--css-ltr{left:-100%}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper.current-years-wrapper{position:static}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper.next-years-wrapper{width:100%;height:100%;position:absolute;top:0;left:-100%;overflow:hidden}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper.next-years-wrapper.--css-ltr{left:100%}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper .year-wrapper{cursor:pointer;border-radius:var(--year-button-border-radius);user-select:none;width:100%;height:32px}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper .year-wrapper:hover{background-color:var(--year-bgcolor-hover)}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper .year-wrapper .year-number{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.jb-calendar-web-component .calendar-section .year-selection-section .years-wrapper .year-wrapper .year-number:hover{color:var(--year-color-hover)}.jb-calendar-web-component .calendar-section .swipe-up-symbol{opacity:0;flex-direction:column;justify-content:center;align-items:center;width:100%;transition:all .1s;display:none;position:absolute;bottom:0}.jb-calendar-web-component .calendar-section .swipe-up-symbol.--show{display:flex}.jb-calendar-web-component .calendar-section .swipe-up-symbol .swipe-up-text{font-size:.8rem}.jb-calendar-web-component .calendar-section .swipe-up-symbol .swipe-up-icon{fill:var(--swipe-up-icon-color)} :host{--arrow-button-border-radius:var(--jb-calendar-arrow-button-border-radius,var(--jb-radius-sm));--day-button-border-radius:var(--jb-calendar-day-button-border-radius,var(--jb-radius-sm));--month-button-border-radius:var(--jb-calendar-month-button-border-radius,var(--jb-radius-sm));--year-button-border-radius:var(--jb-calendar-year-button-border-radius,var(--jb-radius-sm));--color:var(--jb-calendar-color,var(--jb-text-primary));--arrow-button-bgcolor:var(--jb-calendar-arrow-button-bgcolor,var(--jb-neutral-10));--arrow-fill-color:var(--jb-calendar-arrow-fill-color,var(--jb-neutral-6));--day-text-color-disabled:var(--jb-calendar-day-text-color-disabled,var(--jb-neutral-8));--day-text-color-today:var(--jb-calendar-day-text-color-today,var(--jb-green));--day-bgcolor-selected:var(--jb-calendar-day-bgcolor-selected,var(--jb-neutral));--day-color-selected:var(--jb-calendar-day-color-selected,var(--jb-text-contrast));--day-bgcolor-selected-hover:var(--jb-calendar-day-bgcolor-selected-hover,var(--jb-neutral-2));--day-color-selected-hover:var(--jb-calendar-day-color-selected-hover,var(--jb-text-contrast));--day-bgcolor-hover:var(--jb-calendar-day-bgcolor-hover,var(--jb-neutral-10));--day-color-hover:var(--jb-calendar-day-color-hover,var(--jb-text-primary));--day-text-color:var(--jb-calendar-day-text-color,var(--jb-neutral-4));--status-point-bgcolor-today:var(--jb-calendar-status-point-bgcolor-today,var(--jb-green));--status-point-border-color:var(--jb-calendar-status-point-border-color,var(--jb-white));--month-bgcolor-hover:var(--jb-calendar-month-bgcolor-hover,var(--jb-neutral-10));--month-color-hover:var(--jb-calendar-month-color-hover,var(--jb-text-primary));--year-bgcolor-hover:var(--jb-calendar-year-bgcolor-hover,var(--jb-neutral-10));--year-color-hover:var(--jb-calendar-year-color-hover,var(--jb-text-primary));--swipe-up-icon-color:var(--jb-calendar-arrow-fill-color,var(--arrow-fill-color))}</style>\n\n <div class="jb-calendar-web-component">\n <section class="navigator-section">\n <div class="prev-btn arrow-btn" title="${A.get(n.i18n,"prev")}">\n <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" fit=""\n preserveAspectRatio="xMidYMid meet">\n <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path>\n </svg>\n </div>\n <div class="navigator-title">\n <span class="month"></span>\n <span class="year"></span>\n <span class="year-range"></span>\n </div>\n <div class="next-btn arrow-btn" title="${A.get(n.i18n,"next")}">\n <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" fit=""\n preserveAspectRatio="xMidYMid meet">\n <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></path>\n </svg>\n </div>\n\n </section>\n <section class="calendar-section">\n <div class="day-selection-section">\n <div class="week-day-wrapper">\n </div>\n <div class="month-day-container">\n <div class="prev-month-day-wrapper month-day-wrapper"></div>\n <div class="current-month-day-wrapper month-day-wrapper"></div>\n <div class="next-month-day-wrapper month-day-wrapper"></div>\n </div>\n </div>\n <div class="month-selection-section">\n\n </div>\n <div class="year-selection-section">\n <div class="prev-years-wrapper years-wrapper"></div>\n <div class="current-years-wrapper years-wrapper"></div>\n <div class="next-years-wrapper years-wrapper"></div>\n </div>\n <div class="swipe-up-symbol">\n <svg class="swipe-up-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n <g clip-path="url(#clip0_403_3281)">\n <path\n d="M23.7101 16.2899L15.5401 8.11994C15.0756 7.65431 14.5239 7.28488 13.9164 7.03281C13.309 6.78075 12.6578 6.651 12.0001 6.651C11.3424 6.651 10.6912 6.78075 10.0838 7.03281C9.47631 7.28488 8.92455 7.65431 8.46009 8.11994L0.290094 16.2899C0.10179 16.4782 -0.0039978 16.7336 -0.0039978 16.9999C-0.0039978 17.2662 0.10179 17.5216 0.290094 17.7099C0.478398 17.8982 0.733792 18.004 1.00009 18.004C1.2664 18.004 1.52179 17.8982 1.71009 17.7099L9.88009 9.53994C10.4426 8.97814 11.2051 8.66258 12.0001 8.66258C12.7951 8.66258 13.5576 8.97814 14.1201 9.53994L22.2901 17.7099C22.3831 17.8037 22.4937 17.8781 22.6155 17.9288C22.7374 17.9796 22.8681 18.0057 23.0001 18.0057C23.1321 18.0057 23.2628 17.9796 23.3847 17.9288C23.5065 17.8781 23.6171 17.8037 23.7101 17.7099C23.8038 17.617 23.8782 17.5064 23.929 17.3845C23.9798 17.2627 24.0059 17.132 24.0059 16.9999C24.0059 16.8679 23.9798 16.7372 23.929 16.6154C23.8782 16.4935 23.8038 16.3829 23.7101 16.2899Z"\n />\n </g>\n <defs>\n <clipPath id="clip0_403_3281">\n <rect width="24" height="24" fill="white" />\n </clipPath>\n </defs>\n </svg>\n <div class="swipe-up-text">${A.get(n.i18n,"showAllYear")}</div>\n </div>\n </section>\n </div>\n `,r=document.createElement("template");r.innerHTML=t,e.appendChild(r.content.cloneNode(!0)),this.elements={selectionSections:{day:e.querySelector(".day-selection-section"),month:e.querySelector(".month-selection-section"),year:e.querySelector(".year-selection-section")},monthDayWrapper:{current:e.querySelector(".current-month-day-wrapper"),prev:e.querySelector(".prev-month-day-wrapper"),next:e.querySelector(".next-month-day-wrapper")},yearsWrapper:{current:e.querySelector(".current-years-wrapper"),prev:e.querySelector(".prev-years-wrapper"),next:e.querySelector(".next-years-wrapper")},dayOfWeekWrapper:e.querySelector(".week-day-wrapper"),navigatorTitle:{month:e.querySelector(".navigator-title .month"),year:e.querySelector(".navigator-title .year"),yearRange:e.querySelector(".navigator-title .year-range"),nextButton:e.querySelector(".next-btn"),prevButton:e.querySelector(".prev-btn"),wrapper:e.querySelector(".navigator-title")},swipeupSymbol:e.querySelector(".swipe-up-symbol")},this.registerEventHandlers(),window.matchMedia}registerEventHandlers(){this.elements.navigatorTitle.nextButton.addEventListener("click",this.onNextButtonClicked.bind(this)),this.elements.navigatorTitle.prevButton.addEventListener("click",this.onPrevButtonClicked.bind(this)),this.elements.navigatorTitle.year.addEventListener("click",this.onNavigatorTitleYearClicked.bind(this)),this.elements.navigatorTitle.month.addEventListener("click",this.onNavigatorTitleMonthClicked.bind(this)),this.elements.selectionSections.day.addEventListener("touchstart",this.onDayWrapperTouchStart.bind(this)),this.elements.selectionSections.day.addEventListener("touchmove",this.onDayWrapperTouchMove.bind(this)),this.elements.selectionSections.day.addEventListener("touchend",this.onDayWrapperTouchEnd.bind(this)),this.elements.selectionSections.year.addEventListener("touchstart",this.onYearWrapperTouchStart.bind(this)),this.elements.selectionSections.year.addEventListener("touchmove",this.onYearWrapperTouchMove.bind(this)),this.elements.selectionSections.year.addEventListener("touchend",this.onYearWrapperTouchEnd.bind(this))}onDayWrapperTouchStart(e){h(this,H,"f").daysWrapper.startX=e.touches[0].clientX,h(this,H,"f").daysWrapper.startY=e.touches[0].clientY}onDayWrapperTouchMove(e){if(null!==h(this,H,"f").daysWrapper.startX&&null!==h(this,H,"f").daysWrapper.startY){e.preventDefault();const t=e.touches[0].clientX-h(this,H,"f").daysWrapper.startX,a=e.touches[0].clientY-h(this,H,"f").daysWrapper.startY;if(Math.abs(t)>Math.abs(a))this.elements.swipeupSymbol.classList.remove("--show"),this.elements.swipeupSymbol.style.transform="translateY(0px)",this.elements.swipeupSymbol.style.opacity="0",this.elements.monthDayWrapper.current.style.transform=`translateX(${t}px)`,this.elements.monthDayWrapper.prev.style.transform=`translateX(${t}px)`,this.elements.monthDayWrapper.next.style.transform=`translateX(${t}px)`;else if(this.elements.monthDayWrapper.current.style.transform="translateX(0px)",this.elements.monthDayWrapper.prev.style.transform="translateX(0px)",this.elements.monthDayWrapper.next.style.transform="translateX(0px)",this.elements.monthDayWrapper.current.style.transform=`translateY(${a}px)`,a<0){this.elements.swipeupSymbol.classList.add("--show");const e=Math.abs(a)/70;Math.abs(a)>32?this.elements.swipeupSymbol.style.transform="translateY(0px)":this.elements.swipeupSymbol.style.transform=`translateY(${a+32}px)`,this.elements.swipeupSymbol.style.opacity=`${e}`}}}onDayWrapperTouchEnd(e){if(null!==h(this,H,"f").daysWrapper.startX){const t=e.changedTouches[0].clientX-h(this,H,"f").daysWrapper.startX;if(h(this,H,"f").daysWrapper.startX=null,Math.abs(t)>100){let e=t>0?"next":"prev";"ltr"==this.direction&&(e=t>0?"prev":"next"),"prev"==e?(this.elements.monthDayWrapper.current.style.transform="translateX(0px)",this.elements.monthDayWrapper.prev.style.transform="translateX(0px)",this.elements.monthDayWrapper.next.style.transform="translateX(0px)",this.onPrevButtonClicked()):(this.elements.monthDayWrapper.current.style.transform="translateX(0px)",this.elements.monthDayWrapper.prev.style.transform="translateX(0px)",this.elements.monthDayWrapper.next.style.transform="translateX(0px)",this.onNextButtonClicked())}else this.moveBackToPos(this.elements.monthDayWrapper.current),this.moveBackToPos(this.elements.monthDayWrapper.prev),this.moveBackToPos(this.elements.monthDayWrapper.next)}if(null!==h(this,H,"f").daysWrapper.startY){const t=e.changedTouches[0].clientY-h(this,H,"f").daysWrapper.startY;h(this,H,"f").daysWrapper.startY=null,this.elements.swipeupSymbol.classList.remove("--show"),this.elements.swipeupSymbol.style.transform="translateY(0px)",this.elements.swipeupSymbol.style.opacity="0",Math.abs(t)>70&&(this.activeSection=t>0?se.month:se.year)}}onYearWrapperTouchStart(e){h(this,H,"f").yearsWrapper.startX=e.touches[0].clientX}onYearWrapperTouchMove(e){null!==h(this,H,"f").yearsWrapper.startX&&(this.elements.yearsWrapper.current.style.transform=`translateX(${e.touches[0].clientX-h(this,H,"f").yearsWrapper.startX}px)`,this.elements.yearsWrapper.prev.style.transform=`translateX(${e.touches[0].clientX-h(this,H,"f").yearsWrapper.startX}px)`,this.elements.yearsWrapper.next.style.transform=`translateX(${e.touches[0].clientX-h(this,H,"f").yearsWrapper.startX}px)`)}onYearWrapperTouchEnd(e){if(null!==h(this,H,"f").yearsWrapper.startX){const t=e.changedTouches[0].clientX-h(this,H,"f").yearsWrapper.startX;h(this,H,"f").yearsWrapper.startX=null;let a=t>0?"next":"prev";"ltr"==this.direction&&(a=t>0?"prev":"next"),Math.abs(t)>100?"prev"==a?(this.elements.yearsWrapper.current.style.transform="translateX(0px)",this.elements.yearsWrapper.prev.style.transform="translateX(0px)",this.elements.yearsWrapper.next.style.transform="translateX(0px)",this.onPrevButtonClicked()):(this.elements.yearsWrapper.current.style.transform="translateX(0px)",this.elements.yearsWrapper.prev.style.transform="translateX(0px)",this.elements.yearsWrapper.next.style.transform="translateX(0px)",this.onNextButtonClicked()):(this.moveBackToPos(this.elements.yearsWrapper.current),this.moveBackToPos(this.elements.yearsWrapper.prev),this.moveBackToPos(this.elements.yearsWrapper.next))}}moveBackToPos(e){e&&(e.style.transition="transform 0.3s 0s ease",setTimeout((()=>{e.style.transition=""}),300),e.style.transform="")}createDataHandler(){const e=(e,t)=>{this.elements.navigatorTitle.year.innerHTML=this.localizeString(e.toString())},t=(e,t)=>{h(this,P,"m",V).call(this,e),this.fillMonthDays()},a=e=>{this.elements.navigatorTitle.yearRange.innerHTML=this.localizeString(`${e[0]} - ${e[1]}`),this.fillYearList()};return{set:(n,r,s)=>("selectedYear"==r&&(e(s,n.selectedYear),n[r]=s),"selectedMonth"==r&&(n[r]=s,t(s,n.selectedMonth)),"yearSelectionRange"==r&&Array.isArray(s)&&(n[r]=s,a(s)),!0)}}createDateRestrictionHandler(){return{set:(e,t,a)=>{switch(e[t]=a,t){case"min":case"max":"DAY"==this.activeSection&&this.fillMonthDays()}return!0}}}initProps(){this.callOnInitEvent()}selectToday(){const e=new Date;this.inputType==ne?this.select(B(e),O(e)+1,R(e)):this.select(w(e),v(e)+1,b(e))}select(e,t,a){this.value={year:e,month:t,day:a}}initCalendar(){h(this,F,"f")||(this.activeSection=se.day)}fillYearList(){this.fillYearListDom(this.data.yearSelectionRange[0],this.data.yearSelectionRange[1],"current"),this.fillYearListDom(this.data.yearSelectionRange[0]-12,this.data.yearSelectionRange[1]-12,"prev"),this.fillYearListDom(this.data.yearSelectionRange[0]+12,this.data.yearSelectionRange[1]+12,"next")}fillYearListDom(e,t,a){this.elements.yearsWrapper[a].innerHTML="";for(let n=e;n<=t;n++){const e=this.createYearDom(n);this.elements.yearsWrapper[a].appendChild(e)}}createYearDom(e){const t=document.createElement("div");t.classList.add("year-wrapper");const a=document.createElement("div");return a.classList.add("year-number"),a.innerHTML=this.localizeString(e.toString()),t.appendChild(a),t.addEventListener("click",(()=>{this.data.selectedYear=e,this.activeSection=se.month})),t}fillMonthDaysDom(e,t,a){const n=h(this,P,"m",U).call(this,e,t,1),r=h(this,P,"m",ee).call(this,n);this.elements.monthDayWrapper[a].innerHTML="";for(let e=1;e<r;e++){const e=this.createEmptyDayDom();this.elements.monthDayWrapper[a].appendChild(e)}const s=h(this,P,"m",te).call(this,n);for(let e=1;e<=s;e++){const t=h(this,P,"m",U).call(this,this.data.selectedYear,this.data.selectedMonth,e),n=h(this,P,"m",ae).call(this,e,this.data.selectedMonth,this.data.selectedYear),r=this.value.year==this.data.selectedYear&&this.value.month==this.data.selectedMonth&&this.value.day==e,s=!this.checkIsDayDisable(t).isAllValid,o=this.createDayDom(e,this.data.selectedYear,this.data.selectedMonth,n,r,s);this.elements.monthDayWrapper[a].appendChild(o)}}fillMonthDays(){const e=this.data.selectedMonth,t=this.data.selectedYear;let a,n,r,s;e>1?(a=e-1,n=this.data.selectedYear):(n=this.data.selectedYear-1,a=12),this.fillMonthDaysDom(n,a,"prev"),this.fillMonthDaysDom(t,e,"current"),e<12?(r=e+1,s=this.data.selectedYear):(s=this.data.selectedYear+1,r=1),this.fillMonthDaysDom(s,r,"next")}checkIsDayDisable(e){const t={min:!0,max:!0,get isAllValid(){return this.min&&this.max}};var a,n;return this.dateRestrictions.min&&(t.min=(a=e,n=this.dateRestrictions.min,+C(a)>+C(n)||f(e,this.dateRestrictions.min))),this.dateRestrictions.max&&(t.max=function(e,t){return+C(e)<+C(t)}(e,this.dateRestrictions.max)||f(e,this.dateRestrictions.max)),t}createEmptyDayDom(){const e=document.createElement("div");return e.classList.add("empty-day"),e}createDayDom(e,t,a,n,r,s){const o=document.createElement("div");o.classList.add("day-wrapper"),o.setAttribute("day-number",e.toString()),n&&o.classList.add("--today"),r&&o.classList.add("--selected");const i=document.createElement("div");i.classList.add("day-number-wrapper");const l=document.createElement("div");l.classList.add("day-number"),l.innerHTML=this.localizeString(e.toString());const c=document.createElement("div");return c.classList.add("status-point"),i.appendChild(l),o.appendChild(c),o.appendChild(i),s?o.classList.add("--disable"):o.addEventListener("click",(()=>{this.onDayClicked(t,a,e)})),o}onDayClicked(e,t,a){this.select(e,t,a);const n=new CustomEvent("select");this.dispatchEvent(n)}onNextButtonClicked(){if("DAY"==this.activeSection){const e=this.data.selectedMonth;e<12?this.data.selectedMonth=e+1:(this.data.selectedYear=this.data.selectedYear+1,this.data.selectedMonth=1)}if("MONTH"==this.activeSection&&(this.data.selectedYear=this.data.selectedYear+1),"YEAR"==this.activeSection){const e=this.data.yearSelectionRange[0]+12,t=this.data.yearSelectionRange[1]+12;this.data.yearSelectionRange=[e,t]}}onPrevButtonClicked(){if("DAY"==this.activeSection){const e=this.data.selectedMonth;e>1?this.data.selectedMonth=e-1:(this.data.selectedYear=this.data.selectedYear-1,this.data.selectedMonth=12)}if("MONTH"==this.activeSection&&(this.data.selectedYear=this.data.selectedYear-1),"YEAR"==this.activeSection){const e=this.data.yearSelectionRange[0]-12,t=this.data.yearSelectionRange[1]-12;e>0&&(this.data.yearSelectionRange=[e,t])}}onNavigatorTitleYearClicked(){this.activeSection!=se.day&&this.activeSection!=se.month||(this.activeSection=se.year)}onNavigatorTitleMonthClicked(){this.activeSection==se.day&&(this.activeSection=se.month)}onInputTypeChange(){this.setCalendarData(),this.fillDayOfWeek(),h(this,P,"m",Z).call(this)}localizeString(e){return this.showPersianNumber?(0,t.enToFaDigits)(e):e}};H=new WeakMap,q=new WeakMap,F=new WeakMap,$=new WeakMap,z=new WeakMap,I=new WeakMap,J=new WeakMap,_=new WeakMap,G=new WeakMap,P=new WeakSet,V=function(e){const t=this.inputType==ne?h(this,I,"f")[e-1]:h(this,J,"f")[e-1];this.elements.navigatorTitle.month.innerHTML=t},K=function(e){return[2,3,4,5,6,7,1][e]},Z=function(){this.elements.selectionSections.month.innerHTML="";for(let e=1;e<13;e++){const t=h(this,P,"m",Q).call(this,e);this.elements.selectionSections.month.appendChild(t)}},Q=function(e){const t=document.createElement("div");t.classList.add("month-wrapper");const a=document.createElement("div");a.classList.add("month-name");const n=this.inputType==ne?h(this,I,"f")[e-1]:h(this,J,"f")[e-1];return a.innerHTML=n,t.appendChild(a),t.addEventListener("click",(()=>{this.data.selectedMonth=e,this.activeSection=se.day})),t},U=function(e,t,a){return this.inputType==ne?function(e,t,a,n=0,r=0,s=0,o=0){return T(e,t,a,n,r,s,o)}(e,t-1,a):new Date(e,t-1,a)},ee=function(e){return this.inputType==ne?h(this,P,"m",K).call(this,R(e)):b(e)},te=function(e){return this.inputType==ne?N(e):function(e,t){const a=u(e,t?.in),n=a.getFullYear(),r=a.getMonth(),s=m(a,0);return s.setFullYear(n,r+1,0),s.setHours(0,0,0,0),s.getDate()}(e)},ae=function(e,t,a){const n=new Date;return this.inputType==ne?B(n)==a&&O(n)==t-1&&k(C(n,r?.in))==e:w(n)==a&&v(n)==t-1&&function(e,t){return u(e,t?.in).getDate()}(n)==e;var r};!customElements.get("jb-calendar")&&window.customElements.define("jb-calendar",le),Object.defineProperty(e,"JBCalendarSections",{enumerable:!0,get:function(){return se}}),e.JBCalendarWebComponent=le}));
//# sourceMappingURL=jb-calendar.umd.js.map