mis-crystal-design-system 2.3.20 → 2.3.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/mis-crystal-design-system-datepicker_v2.umd.js +1 -1
- package/bundles/mis-crystal-design-system-datepicker_v2.umd.min.js +1 -1
- package/datepicker_v2/mis-crystal-design-system-datepicker_v2.metadata.json +1 -1
- package/esm2015/datepicker_v2/tz-dp-container/tz-dp-container.component.js +1 -1
- package/fesm2015/mis-crystal-design-system-datepicker_v2.js +1 -1
- package/package.json +1 -1
|
@@ -499,7 +499,7 @@
|
|
|
499
499
|
{ type: core.Component, args: [{
|
|
500
500
|
selector: "mis-tz-dp",
|
|
501
501
|
template: "<div class=\"datepicker-container\">\n <div class=\"datepicker-container__header\">\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"datepicker-container__body\">\n <div class=\"datepicker-container__weekdays\">\n <div\n class=\"datepicker-container__weekday\"\n *ngFor=\"let weekDay of weekDays\"\n >\n <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class=\"datepicker-container__days\">\n <div\n class=\"datepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay,\n 'is-valid-date': day.date > 0 && !day.isSelectedDay\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay(day)\"\n >\n <span\n *ngIf=\"day.date > 0\"\n [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay\n }\"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n",
|
|
502
|
-
styles: [".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#
|
|
502
|
+
styles: [".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}"]
|
|
503
503
|
},] }
|
|
504
504
|
];
|
|
505
505
|
TzDpContainerComponent.ctorParameters = function () { return [
|
|
@@ -12,5 +12,5 @@
|
|
|
12
12
|
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
13
13
|
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
14
14
|
PERFORMANCE OF THIS SOFTWARE.
|
|
15
|
-
***************************************************************************** */Object.create;function d(e,t){var a="function"==typeof Symbol&&e[Symbol.iterator];if(!a)return e;var n,r,i=a.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=i.next()).done;)o.push(n.value)}catch(e){r={error:e}}finally{try{n&&!n.done&&(a=i.return)&&a.call(i)}finally{if(r)throw r.error}}return o}function p(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(d(arguments[t]));return e}Object.create;var l=new t.InjectionToken("CONTAINER_DATA"),h="DD-MM-YYYY",y=function(e){var t;switch(e){case 0:t="January";break;case 1:t="February";break;case 2:t="March";break;case 3:t="April";break;case 4:t="May";break;case 5:t="June";break;case 6:t="July";break;case 7:t="August";break;case 8:t="September";break;case 9:t="October";break;case 10:t="November";break;case 11:t="December"}return t},u=function(){function e(e,t){var a,r,i,o,s=this;this.toast=t,this.parseZoneInstance=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n.parseZone.apply(void 0,p(e))},this.rawWeekDays=["SUN","MON","TUE","WED","THU","FRI","SAT"],this.weekDays=[],this.currentMonthDates=[],this.isPreviousMonthDisabled=!1,this.isNextMonthDisabled=!1,this.data=e,(null===(r=null===(a=this.data)||void 0===a?void 0:a.dpConfig)||void 0===r?void 0:r.timezone)&&(this.parseZoneInstance=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n.tz(e[0],e[1],s.data.dpConfig.timezone)}),this.currentMonthNumber=this.parseZoneInstance().month(),this.currentMonth=y(this.currentMonthNumber),this.currentYearNumber=this.parseZoneInstance().year(),this.weekDays=this.rawWeekDays.map((function(e,t){return{label:""+e[0]+e.slice(1).toLowerCase(),isCurrentDay:s.parseZoneInstance().day()===t}})),(null===(o=null===(i=this.data)||void 0===i?void 0:i.dpConfig)||void 0===o?void 0:o.format)||(this.data.dpConfig=Object.assign(Object.assign({},this.data.dpConfig),{format:h}))}return e.prototype.ngOnInit=function(){this.currentDateInstance(),this.calculateMinMaxDays()},e.prototype.currentDateInstance=function(){var e=n.parseZone(this.data.date,this.data.dpConfig.format);e.isValid()&&(this.currentYearNumber=e.year(),this.currentMonthNumber=e.month(),this.currentMonth=y(this.currentMonthNumber)),this.currentMonthDates=this.generateDates(this.currentMonthNumber,this.currentYearNumber)},e.prototype.calculateMinMaxDays=function(){var e=this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber),t=this.parseZoneInstance(this.data.dpConfig.minDate,this.data.dpConfig.format);t.isValid()&&(this.isPreviousMonthDisabled=t.isSameOrAfter(e,"month"));var a=this.parseZoneInstance(this.data.dpConfig.maxDate,this.data.dpConfig.format);a.isValid()&&(this.isNextMonthDisabled=a.isSameOrBefore(e,"month"))},e.prototype.navigateMonth=function(e){var t=n.parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);"NEXT"===e?t=t.add(1,"month"):"PREVIOUS"===e&&(t=t.subtract(1,"month")),this.currentMonthNumber=t.month(),this.currentMonth=y(this.currentMonthNumber),this.currentYearNumber=t.year(),this.currentMonthDates=this.generateDates(this.currentMonthNumber,this.currentYearNumber),this.calculateMinMaxDays()},e.prototype.generateDates=function(e,t){for(var a,r=this,i=[],o=n.parseZone().year(t).month(e).daysInMonth(),s=function(n){var o=c.parseZoneInstance().year(t).month(e).date(n),s=o.format(c.data.dpConfig.format),d=c.data.datesDisabled.some((function(e){return e===s})),p=c.parseZoneInstance(c.data.dpConfig.minDate,c.data.dpConfig.format);!d&&p.isValid()&&(d=p.isAfter(o,"day"));var l=c.parseZoneInstance(c.data.dpConfig.maxDate,c.data.dpConfig.format);!d&&l.isValid()&&(d=l.isBefore(o,"day")),i.push({date:n,weekDay:o.day(),isCurrentDay:c.parseZoneInstance().year(t).month(e).date(n).format(c.data.dpConfig.format)===c.parseZoneInstance().format(c.data.dpConfig.format),isSelectedDay:!d&&o.format(c.data.dpConfig.format)===c.data.date,toastMessage:(null===(a=c.data.messages.find((function(e){return o.format(r.data.dpConfig.format)===e.date})))||void 0===a?void 0:a.message)||"",isDisabledDay:d})},c=this,d=1;d<=o;d++)s(d);for(var p=i[0].weekDay;p>0;p--)i.unshift({date:0,weekDay:p-1});return i},e.prototype.selectDay=function(e){e.date<=0||(e.isDisabledDay||this.data.dateChange(n.parseZone().year(this.currentYearNumber).month(this.currentMonthNumber).date(e.date).format(this.data.dpConfig.format)),e.toastMessage&&this.toast.displayMsg(e.toastMessage,4e3))},e}();u.decorators=[{type:t.Component,args:[{selector:"mis-tz-dp",template:'<div class="datepicker-container">\n <div class="datepicker-container__header">\n <div\n class="datepicker-container__arrow__icon"\n (click)="!isPreviousMonthDisabled && navigateMonth(\'PREVIOUS\')"\n [ngClass]="{\n \'disabled-month\': isPreviousMonthDisabled\n }"\n >\n <svg\n width="20"\n height="16"\n viewBox="0 0 20 16"\n fill="none"\n xmlns="http://www.w3.org/2000/svg"\n >\n <path\n d="M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z"\n fill="#181F33"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class="datepicker-container__arrow__icon"\n (click)="!isNextMonthDisabled && navigateMonth(\'NEXT\')"\n [ngClass]="{\n \'disabled-month\': isNextMonthDisabled\n }"\n >\n <svg\n width="20"\n height="16"\n viewBox="0 0 20 16"\n fill="none"\n xmlns="http://www.w3.org/2000/svg"\n >\n <path\n d="M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z"\n fill="#181F33"\n ></path>\n </svg>\n </div>\n </div>\n <div class="datepicker-container__body">\n <div class="datepicker-container__weekdays">\n <div\n class="datepicker-container__weekday"\n *ngFor="let weekDay of weekDays"\n >\n <span [ngClass]="{ \'current-day\': weekDay.isCurrentDay }">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class="datepicker-container__days">\n <div\n class="datepicker-container__day"\n [ngClass]="{\n \'selected-day\': day.isSelectedDay,\n \'disabled-day\': day.isDisabledDay,\n \'is-valid-date\': day.date > 0 && !day.isSelectedDay\n }"\n *ngFor="let day of currentMonthDates"\n (click)="selectDay(day)"\n >\n <span\n *ngIf="day.date > 0"\n [ngClass]="{\n \'current-day\': day.isCurrentDay,\n \'selected-day\': day.isSelectedDay,\n \'disabled-day\': day.isDisabledDay\n }"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n',styles:[".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#6a737d}"]}]}],u.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Inject,args:[l]}]},{type:r.ToastService}]};var f=function(){function e(e,a,n,r){this.control=e,this.element=a,this.overlay=n,this.viewContainerRef=r,this.dpConfig={format:h,minDate:"",maxDate:""},this.dateMessages=[],this.positionX="center",this.positionY="bottom",this.offsetX=0,this.offsetY=0,this.dateChange=new t.EventEmitter(!0),this.isOpen=!1,this.dpDisabledDates=[]}return Object.defineProperty(e.prototype,"selectedDate",{set:function(e){this.date=e},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"datesDisabled",{set:function(e){this.dpDisabledDates=e},enumerable:!1,configurable:!0}),e.prototype.toggleDatePicker=function(){this.isOpen?this.close():this.open()},e.prototype.open=function(){var e,a=this;this.isOpen=!0;var n=this.overlay.position().flexibleConnectedTo(this.element).withPositions(this.genPositionPairs()).withPush(!0),r=new i.OverlayConfig({hasBackdrop:!0,positionStrategy:n,scrollStrategy:this.overlay.scrollStrategies.reposition(),backdropClass:"cdk-overlay-transparent-backdrop"});this.overlayRef=this.overlay.create(r);var s=new o.ComponentPortal(u,this.viewContainerRef,t.Injector.create({providers:[{provide:l,useValue:{messages:this.dateMessages,date:(null===(e=this.control)||void 0===e?void 0:e.control.value)||this.date,dpConfig:this.dpConfig,datesDisabled:this.dpDisabledDates,dateChange:this.applyDate.bind(this)}}]}));this.overlayRef.attach(s),this.overlayRef.backdropClick().pipe(c.take(1)).subscribe((function(){a.close()}))},e.prototype.applyDate=function(e){var t;this.dateChange.emit(e),null===(t=this.control)||void 0===t||t.control.patchValue(e),this.date=e,this.close()},e.prototype.close=function(){this.isOpen=!1,this.overlayRef.detach(),this.overlayRef.dispose()},e.prototype.genPositionPairs=function(){return[new i.ConnectionPositionPair({originX:this.positionX,originY:this.positionY},{overlayX:this.positionX,overlayY:"bottom"===this.positionY?"top":"bottom"},this.offsetX,this.offsetY),new i.ConnectionPositionPair({originX:"center",originY:"bottom"},{overlayX:"center",overlayY:"top"}),new i.ConnectionPositionPair({originX:"center",originY:"top"},{overlayX:"center",overlayY:"bottom"}),new i.ConnectionPositionPair({originX:"start",originY:"bottom"},{overlayX:"start",overlayY:"top"}),new i.ConnectionPositionPair({originX:"start",originY:"top"},{overlayX:"start",overlayY:"bottom"}),new i.ConnectionPositionPair({originX:"end",originY:"bottom"},{overlayX:"end",overlayY:"top"}),new i.ConnectionPositionPair({originX:"end",originY:"top"},{overlayX:"end",overlayY:"bottom"})]},e}();f.decorators=[{type:t.Directive,args:[{selector:"input[misTzDp]"}]}],f.ctorParameters=function(){return[{type:s.NgControl,decorators:[{type:t.Self},{type:t.Optional}]},{type:t.ElementRef},{type:i.Overlay},{type:t.ViewContainerRef}]},f.propDecorators={dpConfig:[{type:t.Input}],selectedDate:[{type:t.Input}],datesDisabled:[{type:t.Input}],dateMessages:[{type:t.Input}],positionX:[{type:t.Input}],positionY:[{type:t.Input}],offsetX:[{type:t.Input}],offsetY:[{type:t.Input}],dateChange:[{type:t.Output}],toggleDatePicker:[{type:t.HostListener,args:["click"]}]};var g=function(){};g.decorators=[{type:t.NgModule,args:[{declarations:[u,f],imports:[a.CommonModule,r.ToastModule.forRoot()],exports:[u,f],entryComponents:[u]}]}],e.DatepickerModuleV2=g,e.TzDatepickerDirective=f,e.ɵb=u,e.ɵc=l,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
15
|
+
***************************************************************************** */Object.create;function d(e,t){var a="function"==typeof Symbol&&e[Symbol.iterator];if(!a)return e;var n,r,i=a.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=i.next()).done;)o.push(n.value)}catch(e){r={error:e}}finally{try{n&&!n.done&&(a=i.return)&&a.call(i)}finally{if(r)throw r.error}}return o}function p(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(d(arguments[t]));return e}Object.create;var l=new t.InjectionToken("CONTAINER_DATA"),h="DD-MM-YYYY",y=function(e){var t;switch(e){case 0:t="January";break;case 1:t="February";break;case 2:t="March";break;case 3:t="April";break;case 4:t="May";break;case 5:t="June";break;case 6:t="July";break;case 7:t="August";break;case 8:t="September";break;case 9:t="October";break;case 10:t="November";break;case 11:t="December"}return t},u=function(){function e(e,t){var a,r,i,o,s=this;this.toast=t,this.parseZoneInstance=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n.parseZone.apply(void 0,p(e))},this.rawWeekDays=["SUN","MON","TUE","WED","THU","FRI","SAT"],this.weekDays=[],this.currentMonthDates=[],this.isPreviousMonthDisabled=!1,this.isNextMonthDisabled=!1,this.data=e,(null===(r=null===(a=this.data)||void 0===a?void 0:a.dpConfig)||void 0===r?void 0:r.timezone)&&(this.parseZoneInstance=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n.tz(e[0],e[1],s.data.dpConfig.timezone)}),this.currentMonthNumber=this.parseZoneInstance().month(),this.currentMonth=y(this.currentMonthNumber),this.currentYearNumber=this.parseZoneInstance().year(),this.weekDays=this.rawWeekDays.map((function(e,t){return{label:""+e[0]+e.slice(1).toLowerCase(),isCurrentDay:s.parseZoneInstance().day()===t}})),(null===(o=null===(i=this.data)||void 0===i?void 0:i.dpConfig)||void 0===o?void 0:o.format)||(this.data.dpConfig=Object.assign(Object.assign({},this.data.dpConfig),{format:h}))}return e.prototype.ngOnInit=function(){this.currentDateInstance(),this.calculateMinMaxDays()},e.prototype.currentDateInstance=function(){var e=n.parseZone(this.data.date,this.data.dpConfig.format);e.isValid()&&(this.currentYearNumber=e.year(),this.currentMonthNumber=e.month(),this.currentMonth=y(this.currentMonthNumber)),this.currentMonthDates=this.generateDates(this.currentMonthNumber,this.currentYearNumber)},e.prototype.calculateMinMaxDays=function(){var e=this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber),t=this.parseZoneInstance(this.data.dpConfig.minDate,this.data.dpConfig.format);t.isValid()&&(this.isPreviousMonthDisabled=t.isSameOrAfter(e,"month"));var a=this.parseZoneInstance(this.data.dpConfig.maxDate,this.data.dpConfig.format);a.isValid()&&(this.isNextMonthDisabled=a.isSameOrBefore(e,"month"))},e.prototype.navigateMonth=function(e){var t=n.parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);"NEXT"===e?t=t.add(1,"month"):"PREVIOUS"===e&&(t=t.subtract(1,"month")),this.currentMonthNumber=t.month(),this.currentMonth=y(this.currentMonthNumber),this.currentYearNumber=t.year(),this.currentMonthDates=this.generateDates(this.currentMonthNumber,this.currentYearNumber),this.calculateMinMaxDays()},e.prototype.generateDates=function(e,t){for(var a,r=this,i=[],o=n.parseZone().year(t).month(e).daysInMonth(),s=function(n){var o=c.parseZoneInstance().year(t).month(e).date(n),s=o.format(c.data.dpConfig.format),d=c.data.datesDisabled.some((function(e){return e===s})),p=c.parseZoneInstance(c.data.dpConfig.minDate,c.data.dpConfig.format);!d&&p.isValid()&&(d=p.isAfter(o,"day"));var l=c.parseZoneInstance(c.data.dpConfig.maxDate,c.data.dpConfig.format);!d&&l.isValid()&&(d=l.isBefore(o,"day")),i.push({date:n,weekDay:o.day(),isCurrentDay:c.parseZoneInstance().year(t).month(e).date(n).format(c.data.dpConfig.format)===c.parseZoneInstance().format(c.data.dpConfig.format),isSelectedDay:!d&&o.format(c.data.dpConfig.format)===c.data.date,toastMessage:(null===(a=c.data.messages.find((function(e){return o.format(r.data.dpConfig.format)===e.date})))||void 0===a?void 0:a.message)||"",isDisabledDay:d})},c=this,d=1;d<=o;d++)s(d);for(var p=i[0].weekDay;p>0;p--)i.unshift({date:0,weekDay:p-1});return i},e.prototype.selectDay=function(e){e.date<=0||(e.isDisabledDay||this.data.dateChange(n.parseZone().year(this.currentYearNumber).month(this.currentMonthNumber).date(e.date).format(this.data.dpConfig.format)),e.toastMessage&&this.toast.displayMsg(e.toastMessage,4e3))},e}();u.decorators=[{type:t.Component,args:[{selector:"mis-tz-dp",template:'<div class="datepicker-container">\n <div class="datepicker-container__header">\n <div\n class="datepicker-container__arrow__icon"\n (click)="!isPreviousMonthDisabled && navigateMonth(\'PREVIOUS\')"\n [ngClass]="{\n \'disabled-month\': isPreviousMonthDisabled\n }"\n >\n <svg\n width="20"\n height="16"\n viewBox="0 0 20 16"\n fill="none"\n xmlns="http://www.w3.org/2000/svg"\n >\n <path\n d="M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z"\n fill="#181F33"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class="datepicker-container__arrow__icon"\n (click)="!isNextMonthDisabled && navigateMonth(\'NEXT\')"\n [ngClass]="{\n \'disabled-month\': isNextMonthDisabled\n }"\n >\n <svg\n width="20"\n height="16"\n viewBox="0 0 20 16"\n fill="none"\n xmlns="http://www.w3.org/2000/svg"\n >\n <path\n d="M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z"\n fill="#181F33"\n ></path>\n </svg>\n </div>\n </div>\n <div class="datepicker-container__body">\n <div class="datepicker-container__weekdays">\n <div\n class="datepicker-container__weekday"\n *ngFor="let weekDay of weekDays"\n >\n <span [ngClass]="{ \'current-day\': weekDay.isCurrentDay }">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class="datepicker-container__days">\n <div\n class="datepicker-container__day"\n [ngClass]="{\n \'selected-day\': day.isSelectedDay,\n \'disabled-day\': day.isDisabledDay,\n \'is-valid-date\': day.date > 0 && !day.isSelectedDay\n }"\n *ngFor="let day of currentMonthDates"\n (click)="selectDay(day)"\n >\n <span\n *ngIf="day.date > 0"\n [ngClass]="{\n \'current-day\': day.isCurrentDay,\n \'selected-day\': day.isSelectedDay,\n \'disabled-day\': day.isDisabledDay\n }"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n',styles:[".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}"]}]}],u.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Inject,args:[l]}]},{type:r.ToastService}]};var f=function(){function e(e,a,n,r){this.control=e,this.element=a,this.overlay=n,this.viewContainerRef=r,this.dpConfig={format:h,minDate:"",maxDate:""},this.dateMessages=[],this.positionX="center",this.positionY="bottom",this.offsetX=0,this.offsetY=0,this.dateChange=new t.EventEmitter(!0),this.isOpen=!1,this.dpDisabledDates=[]}return Object.defineProperty(e.prototype,"selectedDate",{set:function(e){this.date=e},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"datesDisabled",{set:function(e){this.dpDisabledDates=e},enumerable:!1,configurable:!0}),e.prototype.toggleDatePicker=function(){this.isOpen?this.close():this.open()},e.prototype.open=function(){var e,a=this;this.isOpen=!0;var n=this.overlay.position().flexibleConnectedTo(this.element).withPositions(this.genPositionPairs()).withPush(!0),r=new i.OverlayConfig({hasBackdrop:!0,positionStrategy:n,scrollStrategy:this.overlay.scrollStrategies.reposition(),backdropClass:"cdk-overlay-transparent-backdrop"});this.overlayRef=this.overlay.create(r);var s=new o.ComponentPortal(u,this.viewContainerRef,t.Injector.create({providers:[{provide:l,useValue:{messages:this.dateMessages,date:(null===(e=this.control)||void 0===e?void 0:e.control.value)||this.date,dpConfig:this.dpConfig,datesDisabled:this.dpDisabledDates,dateChange:this.applyDate.bind(this)}}]}));this.overlayRef.attach(s),this.overlayRef.backdropClick().pipe(c.take(1)).subscribe((function(){a.close()}))},e.prototype.applyDate=function(e){var t;this.dateChange.emit(e),null===(t=this.control)||void 0===t||t.control.patchValue(e),this.date=e,this.close()},e.prototype.close=function(){this.isOpen=!1,this.overlayRef.detach(),this.overlayRef.dispose()},e.prototype.genPositionPairs=function(){return[new i.ConnectionPositionPair({originX:this.positionX,originY:this.positionY},{overlayX:this.positionX,overlayY:"bottom"===this.positionY?"top":"bottom"},this.offsetX,this.offsetY),new i.ConnectionPositionPair({originX:"center",originY:"bottom"},{overlayX:"center",overlayY:"top"}),new i.ConnectionPositionPair({originX:"center",originY:"top"},{overlayX:"center",overlayY:"bottom"}),new i.ConnectionPositionPair({originX:"start",originY:"bottom"},{overlayX:"start",overlayY:"top"}),new i.ConnectionPositionPair({originX:"start",originY:"top"},{overlayX:"start",overlayY:"bottom"}),new i.ConnectionPositionPair({originX:"end",originY:"bottom"},{overlayX:"end",overlayY:"top"}),new i.ConnectionPositionPair({originX:"end",originY:"top"},{overlayX:"end",overlayY:"bottom"})]},e}();f.decorators=[{type:t.Directive,args:[{selector:"input[misTzDp]"}]}],f.ctorParameters=function(){return[{type:s.NgControl,decorators:[{type:t.Self},{type:t.Optional}]},{type:t.ElementRef},{type:i.Overlay},{type:t.ViewContainerRef}]},f.propDecorators={dpConfig:[{type:t.Input}],selectedDate:[{type:t.Input}],datesDisabled:[{type:t.Input}],dateMessages:[{type:t.Input}],positionX:[{type:t.Input}],positionY:[{type:t.Input}],offsetX:[{type:t.Input}],offsetY:[{type:t.Input}],dateChange:[{type:t.Output}],toggleDatePicker:[{type:t.HostListener,args:["click"]}]};var g=function(){};g.decorators=[{type:t.NgModule,args:[{declarations:[u,f],imports:[a.CommonModule,r.ToastModule.forRoot()],exports:[u,f],entryComponents:[u]}]}],e.DatepickerModuleV2=g,e.TzDatepickerDirective=f,e.ɵb=u,e.ɵc=l,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
16
16
|
//# sourceMappingURL=mis-crystal-design-system-datepicker_v2.umd.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"__symbolic":"module","version":4,"metadata":{"ɵa":{"__symbolic":"interface"},"DatepickerModuleV2":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"TzDatepickerDirective"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":12},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"mis-crystal-design-system/toast","name":"ToastModule","line":7,"character":26},"member":"forRoot"}}],"exports":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"TzDatepickerDirective"}],"entryComponents":[{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{}},"TzDatepickerDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":9,"character":1},"arguments":[{"selector":"input[misTzDp]"}]}],"members":{"dpConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"selectedDate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"datesDisabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"dateMessages":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"positionX":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"positionY":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"offsetX":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"offsetY":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"dateChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self","line":37,"character":15}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":37,"character":23}}],null,null,null],"parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"NgControl","line":37,"character":51},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":37,"character":79},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay","line":37,"character":108},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":37,"character":143}]}],"toggleDatePicker":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":39,"character":3},"arguments":["click"]}]}],"open":[{"__symbolic":"method"}],"applyDate":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"genPositionPairs":[{"__symbolic":"method"}]}},"IDatePickerConfig":{"__symbolic":"interface"},"IDatePickerToastText":{"__symbolic":"interface"},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"mis-tz-dp","template":"<div class=\"datepicker-container\">\n <div class=\"datepicker-container__header\">\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"datepicker-container__body\">\n <div class=\"datepicker-container__weekdays\">\n <div\n class=\"datepicker-container__weekday\"\n *ngFor=\"let weekDay of weekDays\"\n >\n <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class=\"datepicker-container__days\">\n <div\n class=\"datepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay,\n 'is-valid-date': day.date > 0 && !day.isSelectedDay\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay(day)\"\n >\n <span\n *ngIf=\"day.date > 0\"\n [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay\n }\"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n","styles":[".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#6a737d}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":26,"character":15},"arguments":[{"__symbolic":"reference","name":"ɵc"}]}],null],"parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"mis-crystal-design-system/toast","name":"ToastService","line":26,"character":76}]}],"ngOnInit":[{"__symbolic":"method"}],"currentDateInstance":[{"__symbolic":"method"}],"calculateMinMaxDays":[{"__symbolic":"method"}],"navigateMonth":[{"__symbolic":"method"}],"generateDates":[{"__symbolic":"method"}],"selectDay":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":34},"arguments":["CONTAINER_DATA"]}},"origins":{"ɵa":"./models/dp-config.model","DatepickerModuleV2":"./datepicker.module","TzDatepickerDirective":"./tz-datepicker.directive","IDatePickerConfig":"./models/dp-config.model","IDatePickerToastText":"./models/dp-config.model","ɵb":"./tz-dp-container/tz-dp-container.component","ɵc":"./datepicker-constants"},"importAs":"mis-crystal-design-system/datepicker_v2"}
|
|
1
|
+
{"__symbolic":"module","version":4,"metadata":{"ɵa":{"__symbolic":"interface"},"DatepickerModuleV2":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"TzDatepickerDirective"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":12},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"mis-crystal-design-system/toast","name":"ToastModule","line":7,"character":26},"member":"forRoot"}}],"exports":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"TzDatepickerDirective"}],"entryComponents":[{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{}},"TzDatepickerDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":9,"character":1},"arguments":[{"selector":"input[misTzDp]"}]}],"members":{"dpConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"selectedDate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"datesDisabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"dateMessages":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"positionX":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"positionY":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"offsetX":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"offsetY":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"dateChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self","line":37,"character":15}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":37,"character":23}}],null,null,null],"parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"NgControl","line":37,"character":51},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":37,"character":79},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay","line":37,"character":108},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":37,"character":143}]}],"toggleDatePicker":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":39,"character":3},"arguments":["click"]}]}],"open":[{"__symbolic":"method"}],"applyDate":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"genPositionPairs":[{"__symbolic":"method"}]}},"IDatePickerConfig":{"__symbolic":"interface"},"IDatePickerToastText":{"__symbolic":"interface"},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"mis-tz-dp","template":"<div class=\"datepicker-container\">\n <div class=\"datepicker-container__header\">\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"datepicker-container__body\">\n <div class=\"datepicker-container__weekdays\">\n <div\n class=\"datepicker-container__weekday\"\n *ngFor=\"let weekDay of weekDays\"\n >\n <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class=\"datepicker-container__days\">\n <div\n class=\"datepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay,\n 'is-valid-date': day.date > 0 && !day.isSelectedDay\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay(day)\"\n >\n <span\n *ngIf=\"day.date > 0\"\n [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay\n }\"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n","styles":[".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":26,"character":15},"arguments":[{"__symbolic":"reference","name":"ɵc"}]}],null],"parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"mis-crystal-design-system/toast","name":"ToastService","line":26,"character":76}]}],"ngOnInit":[{"__symbolic":"method"}],"currentDateInstance":[{"__symbolic":"method"}],"calculateMinMaxDays":[{"__symbolic":"method"}],"navigateMonth":[{"__symbolic":"method"}],"generateDates":[{"__symbolic":"method"}],"selectDay":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":34},"arguments":["CONTAINER_DATA"]}},"origins":{"ɵa":"./models/dp-config.model","DatepickerModuleV2":"./datepicker.module","TzDatepickerDirective":"./tz-datepicker.directive","IDatePickerConfig":"./models/dp-config.model","IDatePickerToastText":"./models/dp-config.model","ɵb":"./tz-dp-container/tz-dp-container.component","ɵc":"./datepicker-constants"},"importAs":"mis-crystal-design-system/datepicker_v2"}
|
|
@@ -116,7 +116,7 @@ TzDpContainerComponent.decorators = [
|
|
|
116
116
|
{ type: Component, args: [{
|
|
117
117
|
selector: "mis-tz-dp",
|
|
118
118
|
template: "<div class=\"datepicker-container\">\n <div class=\"datepicker-container__header\">\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"datepicker-container__body\">\n <div class=\"datepicker-container__weekdays\">\n <div\n class=\"datepicker-container__weekday\"\n *ngFor=\"let weekDay of weekDays\"\n >\n <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class=\"datepicker-container__days\">\n <div\n class=\"datepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay,\n 'is-valid-date': day.date > 0 && !day.isSelectedDay\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay(day)\"\n >\n <span\n *ngIf=\"day.date > 0\"\n [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay\n }\"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n",
|
|
119
|
-
styles: [".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#
|
|
119
|
+
styles: [".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}"]
|
|
120
120
|
},] }
|
|
121
121
|
];
|
|
122
122
|
TzDpContainerComponent.ctorParameters = () => [
|
|
@@ -169,7 +169,7 @@ TzDpContainerComponent.decorators = [
|
|
|
169
169
|
{ type: Component, args: [{
|
|
170
170
|
selector: "mis-tz-dp",
|
|
171
171
|
template: "<div class=\"datepicker-container\">\n <div class=\"datepicker-container__header\">\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div\n class=\"datepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg\n width=\"20\"\n height=\"16\"\n viewBox=\"0 0 20 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"datepicker-container__body\">\n <div class=\"datepicker-container__weekdays\">\n <div\n class=\"datepicker-container__weekday\"\n *ngFor=\"let weekDay of weekDays\"\n >\n <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{\n weekDay.label\n }}</span>\n </div>\n </div>\n <div class=\"datepicker-container__days\">\n <div\n class=\"datepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay,\n 'is-valid-date': day.date > 0 && !day.isSelectedDay\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay(day)\"\n >\n <span\n *ngIf=\"day.date > 0\"\n [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'selected-day': day.isSelectedDay,\n 'disabled-day': day.isDisabledDay\n }\"\n >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n</div>\n",
|
|
172
|
-
styles: [".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#
|
|
172
|
+
styles: [".datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);border-radius:12px;display:flex;flex-direction:column;padding:16px;font-family:Lato;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-container .datepicker-container__header{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:first-child{transform:rotate(180deg)}.datepicker-container .datepicker-container__body{height:100%;width:252px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}"]
|
|
173
173
|
},] }
|
|
174
174
|
];
|
|
175
175
|
TzDpContainerComponent.ctorParameters = () => [
|