mis-crystal-design-system 14.0.61-dayjs → 14.0.63

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.
Files changed (98) hide show
  1. package/assets/images/close.svg +5 -0
  2. package/daterangepicker_v2/tz-drp-container/tz-drp-container.component.d.ts +1 -1
  3. package/dropdown/dropdown.component.d.ts +2 -1
  4. package/dynamic-form/dynamic-form.component.d.ts +1 -0
  5. package/esm2020/async-search-dropdown/async-dropdown.component.mjs +19 -18
  6. package/esm2020/checkbox/checkbox.component.mjs +3 -3
  7. package/esm2020/datepicker_v2/tz-dp-container/tz-dp-container.component.mjs +14 -24
  8. package/esm2020/daterangepicker_v2/models/drp-config.model.mjs +1 -1
  9. package/esm2020/daterangepicker_v2/tz-drp-container/tz-drp-container.component.mjs +36 -44
  10. package/esm2020/dropdown/dropdown.component.mjs +12 -8
  11. package/esm2020/dynamic-form/dynamic-form.component.mjs +12 -14
  12. package/esm2020/filter/animations/slideFromRight.mjs +12 -0
  13. package/esm2020/filter/filter-panel/filter-panel.component.mjs +403 -0
  14. package/esm2020/filter/filters.module.mjs +66 -0
  15. package/esm2020/filter/has-value.pipe.mjs +31 -0
  16. package/esm2020/filter/index.mjs +2 -0
  17. package/esm2020/filter/mis-crystal-design-system-filter.mjs +5 -0
  18. package/esm2020/filter/public_api.mjs +4 -0
  19. package/esm2020/multi-select-dropdown/multi-select-dropdown.component.mjs +20 -15
  20. package/esm2020/nested-multi-select-dropdown/nested-multi-select-dropdown.component.mjs +22 -15
  21. package/esm2020/radio-button/radio-button.component.mjs +3 -3
  22. package/esm2020/ske-loader/ske-loader.component.mjs +4 -4
  23. package/esm2020/specificdatepicker/public_api.mjs +2 -1
  24. package/esm2020/specificdatepicker/tz-sdp-container/tz-sdp-container.component.mjs +50 -61
  25. package/esm2020/table/filter/filter.component.mjs +12 -4
  26. package/esm2020/table/table.component.mjs +35 -19
  27. package/esm2020/timepicker/timepicker.component.mjs +48 -54
  28. package/esm2020/timerangepicker/timerangepicker.component.mjs +42 -46
  29. package/fesm2015/mis-crystal-design-system-async-search-dropdown.mjs +18 -17
  30. package/fesm2015/mis-crystal-design-system-async-search-dropdown.mjs.map +1 -1
  31. package/fesm2015/mis-crystal-design-system-checkbox.mjs +2 -2
  32. package/fesm2015/mis-crystal-design-system-checkbox.mjs.map +1 -1
  33. package/fesm2015/mis-crystal-design-system-datepicker_v2.mjs +13 -23
  34. package/fesm2015/mis-crystal-design-system-datepicker_v2.mjs.map +1 -1
  35. package/fesm2015/mis-crystal-design-system-daterangepicker_v2.mjs +35 -44
  36. package/fesm2015/mis-crystal-design-system-daterangepicker_v2.mjs.map +1 -1
  37. package/fesm2015/mis-crystal-design-system-dropdown.mjs +11 -7
  38. package/fesm2015/mis-crystal-design-system-dropdown.mjs.map +1 -1
  39. package/fesm2015/mis-crystal-design-system-dynamic-form.mjs +10 -13
  40. package/fesm2015/mis-crystal-design-system-dynamic-form.mjs.map +1 -1
  41. package/fesm2015/mis-crystal-design-system-filter.mjs +560 -0
  42. package/fesm2015/mis-crystal-design-system-filter.mjs.map +1 -0
  43. package/fesm2015/mis-crystal-design-system-multi-select-dropdown.mjs +19 -14
  44. package/fesm2015/mis-crystal-design-system-multi-select-dropdown.mjs.map +1 -1
  45. package/fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.mjs +21 -14
  46. package/fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.mjs.map +1 -1
  47. package/fesm2015/mis-crystal-design-system-radio-button.mjs +2 -2
  48. package/fesm2015/mis-crystal-design-system-radio-button.mjs.map +1 -1
  49. package/fesm2015/mis-crystal-design-system-ske-loader.mjs +3 -3
  50. package/fesm2015/mis-crystal-design-system-ske-loader.mjs.map +1 -1
  51. package/fesm2015/mis-crystal-design-system-specificdatepicker.mjs +49 -60
  52. package/fesm2015/mis-crystal-design-system-specificdatepicker.mjs.map +1 -1
  53. package/fesm2015/mis-crystal-design-system-table.mjs +53 -25
  54. package/fesm2015/mis-crystal-design-system-table.mjs.map +1 -1
  55. package/fesm2015/mis-crystal-design-system-timepicker.mjs +47 -53
  56. package/fesm2015/mis-crystal-design-system-timepicker.mjs.map +1 -1
  57. package/fesm2015/mis-crystal-design-system-timerangepicker.mjs +41 -45
  58. package/fesm2015/mis-crystal-design-system-timerangepicker.mjs.map +1 -1
  59. package/fesm2020/mis-crystal-design-system-async-search-dropdown.mjs +18 -17
  60. package/fesm2020/mis-crystal-design-system-async-search-dropdown.mjs.map +1 -1
  61. package/fesm2020/mis-crystal-design-system-checkbox.mjs +2 -2
  62. package/fesm2020/mis-crystal-design-system-checkbox.mjs.map +1 -1
  63. package/fesm2020/mis-crystal-design-system-datepicker_v2.mjs +13 -23
  64. package/fesm2020/mis-crystal-design-system-datepicker_v2.mjs.map +1 -1
  65. package/fesm2020/mis-crystal-design-system-daterangepicker_v2.mjs +34 -43
  66. package/fesm2020/mis-crystal-design-system-daterangepicker_v2.mjs.map +1 -1
  67. package/fesm2020/mis-crystal-design-system-dropdown.mjs +11 -7
  68. package/fesm2020/mis-crystal-design-system-dropdown.mjs.map +1 -1
  69. package/fesm2020/mis-crystal-design-system-dynamic-form.mjs +10 -13
  70. package/fesm2020/mis-crystal-design-system-dynamic-form.mjs.map +1 -1
  71. package/fesm2020/mis-crystal-design-system-filter.mjs +510 -0
  72. package/fesm2020/mis-crystal-design-system-filter.mjs.map +1 -0
  73. package/fesm2020/mis-crystal-design-system-multi-select-dropdown.mjs +19 -14
  74. package/fesm2020/mis-crystal-design-system-multi-select-dropdown.mjs.map +1 -1
  75. package/fesm2020/mis-crystal-design-system-nested-multi-select-dropdown.mjs +21 -14
  76. package/fesm2020/mis-crystal-design-system-nested-multi-select-dropdown.mjs.map +1 -1
  77. package/fesm2020/mis-crystal-design-system-radio-button.mjs +2 -2
  78. package/fesm2020/mis-crystal-design-system-radio-button.mjs.map +1 -1
  79. package/fesm2020/mis-crystal-design-system-ske-loader.mjs +3 -3
  80. package/fesm2020/mis-crystal-design-system-ske-loader.mjs.map +1 -1
  81. package/fesm2020/mis-crystal-design-system-specificdatepicker.mjs +49 -60
  82. package/fesm2020/mis-crystal-design-system-specificdatepicker.mjs.map +1 -1
  83. package/fesm2020/mis-crystal-design-system-table.mjs +49 -25
  84. package/fesm2020/mis-crystal-design-system-table.mjs.map +1 -1
  85. package/fesm2020/mis-crystal-design-system-timepicker.mjs +47 -53
  86. package/fesm2020/mis-crystal-design-system-timepicker.mjs.map +1 -1
  87. package/fesm2020/mis-crystal-design-system-timerangepicker.mjs +41 -45
  88. package/fesm2020/mis-crystal-design-system-timerangepicker.mjs.map +1 -1
  89. package/filter/animations/slideFromRight.d.ts +1 -0
  90. package/filter/filter-panel/filter-panel.component.d.ts +51 -0
  91. package/filter/filters.module.d.ts +18 -0
  92. package/filter/has-value.pipe.d.ts +12 -0
  93. package/filter/index.d.ts +1 -0
  94. package/filter/public_api.d.ts +4 -0
  95. package/package.json +9 -1
  96. package/specificdatepicker/public_api.d.ts +1 -1
  97. package/specificdatepicker/tz-sdp-container/tz-sdp-container.component.d.ts +1 -1
  98. package/timepicker/timepicker.component.d.ts +2 -2
@@ -1,15 +1,10 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { InjectionToken, Component, Inject, ViewChild, EventEmitter, Injector, Directive, Self, Optional, Input, Output, HostListener, NgModule } from '@angular/core';
3
+ import { parseZone } from 'moment-timezone';
3
4
  import * as i1$1 from '@angular/forms';
4
5
  import { UntypedFormControl } from '@angular/forms';
5
6
  import * as i5 from 'mis-crystal-design-system/datepicker_v2';
6
7
  import { TzDatepickerDirective, DatepickerModuleV2 } from 'mis-crystal-design-system/datepicker_v2';
7
- import dayjs from 'dayjs';
8
- import timezone from 'dayjs/plugin/timezone';
9
- import utc from 'dayjs/plugin/utc';
10
- import isSameOrAfter from 'dayjs/plugin/isSameOrAfter';
11
- import isSameOrBefore from 'dayjs/plugin/isSameOrBefore';
12
- import customParseFormat from 'dayjs/plugin/customParseFormat';
13
8
  import * as i1 from 'mis-crystal-design-system/toast';
14
9
  import { ToastModule } from 'mis-crystal-design-system/toast';
15
10
  import * as i2 from '@angular/common';
@@ -196,7 +191,7 @@ function TzDrpContainerComponent_span_39_Template(rf, ctx) { if (rf & 1) {
196
191
  } if (rf & 2) {
197
192
  const ctx_r6 = i0.ɵɵnextContext();
198
193
  i0.ɵɵadvance(2);
199
- i0.ɵɵtextInterpolate1("", ctx_r6.data.isSPickerSelected && (ctx_r6.localSelectedDates[0] == null ? null : ctx_r6.localSelectedDates[0].selectedDate) ? ctx_r6.localSelectedDates.length : ctx_r6.localSelectedDates.length - 1 && 0, " ");
194
+ i0.ɵɵtextInterpolate1("", (ctx_r6.localSelectedDates[0] == null ? null : ctx_r6.localSelectedDates[0].selectedDate) ? ctx_r6.localSelectedDates.length : ctx_r6.localSelectedDates.length - 1 && 0, " ");
200
195
  } }
201
196
  function TzDrpContainerComponent_span_40_Template(rf, ctx) { if (rf & 1) {
202
197
  i0.ɵɵelementStart(0, "span")(1, "span");
@@ -231,17 +226,13 @@ function TzDrpContainerComponent_button_45_Template(rf, ctx) { if (rf & 1) {
231
226
  } }
232
227
  const _c6 = function (a0) { return { "display": a0 }; };
233
228
  const _c7 = function (a0) { return { "disabled-month": a0 }; };
234
- dayjs.extend(utc);
235
- dayjs.extend(timezone);
236
- dayjs.extend(customParseFormat);
237
- dayjs.extend(isSameOrAfter);
238
- dayjs.extend(isSameOrBefore);
229
+ const _c8 = function () { return { display: "inline-block", "margin-left": "10px" }; };
239
230
  class TzDrpContainerComponent {
240
231
  constructor(data, toast, cdr) {
241
232
  this.toast = toast;
242
233
  this.cdr = cdr;
243
- this.dayjsInstance = (...args) => {
244
- return dayjs(...args);
234
+ this.parseZoneInstance = (...args) => {
235
+ return parseZone(...args);
245
236
  };
246
237
  this.rawWeekDays = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
247
238
  this.weekDays = [];
@@ -262,10 +253,10 @@ class TzDrpContainerComponent {
262
253
  this.singleDateSelectedValue = '';
263
254
  this.data = data;
264
255
  this.localSelectedDatesRange = this.data.datesRange;
265
- const startDate = dayjs(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format);
266
- const endDate = dayjs(this.localSelectedDatesRange?.endDate, this.data.dpConfig.format);
256
+ const startDate = new Date(this.localSelectedDatesRange?.startDate);
257
+ const endDate = new Date(this.localSelectedDatesRange?.endDate);
267
258
  if (startDate && endDate) {
268
- this.dateRangeLength = endDate.diff(startDate, 'day') + 1;
259
+ this.dateRangeLength = (endDate.getTime() - startDate.getTime()) / (1000 * 60 * 60 * 24) + 1;
269
260
  }
270
261
  this.localSelectedDates = this.data.dates;
271
262
  if (!this.data.isSPickerSelected) {
@@ -283,19 +274,19 @@ class TzDrpContainerComponent {
283
274
  }
284
275
  }
285
276
  if (this.data?.dpConfig?.timezone) {
286
- this.dayjsInstance = (...args) => {
287
- return dayjs(...args).tz(this.data.dpConfig.timezone);
277
+ this.parseZoneInstance = (...args) => {
278
+ return parseZone(...args).tz(this.data.dpConfig.timezone);
288
279
  };
289
280
  }
290
- this.currentMonthNumber = this.dayjsInstance().month();
291
- this.nextMonthNumber = this.dayjsInstance().add(1, "month").month();
281
+ this.currentMonthNumber = this.parseZoneInstance().month();
282
+ this.nextMonthNumber = this.parseZoneInstance().add(1, "month").month();
292
283
  this.currentMonth = getMonth(this.currentMonthNumber);
293
284
  this.nextMonth = getMonth(this.nextMonthNumber);
294
- this.currentYearNumber = this.dayjsInstance().year();
295
- this.nextYearNumber = this.dayjsInstance().add(1, "month").year();
285
+ this.currentYearNumber = this.parseZoneInstance().year();
286
+ this.nextYearNumber = this.parseZoneInstance().add(1, "month").year();
296
287
  this.weekDays = this.rawWeekDays.map((day, index) => ({
297
288
  label: `${day[0]}${day.slice(1).toLowerCase()}`,
298
- isCurrentDay: this.dayjsInstance().day() === index
289
+ isCurrentDay: this.parseZoneInstance().day() === index
299
290
  }));
300
291
  if (!this.data?.dpConfig?.format) {
301
292
  this.data.dpConfig = {
@@ -323,16 +314,16 @@ class TzDrpContainerComponent {
323
314
  this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
324
315
  return;
325
316
  }
326
- selectedStartDate = this.dayjsInstance(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format);
317
+ selectedStartDate = this.parseZoneInstance(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format);
327
318
  }
328
319
  else {
329
- selectedStartDate = this.dayjsInstance(this.localSelectedDates?.[0].selectedDate, this.data.dpConfig.format);
320
+ selectedStartDate = this.parseZoneInstance(this.localSelectedDates?.[0].selectedDate, this.data.dpConfig.format);
330
321
  }
331
322
  if (selectedStartDate.isValid()) {
332
323
  this.currentYearNumber = selectedStartDate.year();
333
324
  this.nextYearNumber = selectedStartDate.add(1, "month").year();
334
- this.currentMonthNumber = selectedStartDate.get("month");
335
- this.nextMonthNumber = selectedStartDate.add(1, "month").month();
325
+ this.currentMonthNumber = selectedStartDate.get("month") - 1;
326
+ this.nextMonthNumber = selectedStartDate.add(1, "month").month() - 1;
336
327
  if (this.currentMonthNumber === -1) {
337
328
  this.currentMonthNumber = 11;
338
329
  }
@@ -346,18 +337,18 @@ class TzDrpContainerComponent {
346
337
  this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
347
338
  }
348
339
  calculateMinMaxDays() {
349
- const currentInstance = this.dayjsInstance().year(this.currentYearNumber).month(this.currentMonthNumber);
350
- const minDate = !!this.data.dpConfig.minDate ? this.dayjsInstance(this.data.dpConfig.minDate, this.data.dpConfig.format) : dayjs('invalid');
340
+ const currentInstance = this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber);
341
+ const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
351
342
  if (minDate.isValid()) {
352
343
  this.isPreviousMonthDisabled = minDate.isSameOrAfter(currentInstance, "month");
353
344
  }
354
- const maxDate = !!this.data.dpConfig.maxDate ? this.dayjsInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format) : dayjs('invalid');
345
+ const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
355
346
  if (maxDate.isValid()) {
356
347
  this.isNextMonthDisabled = maxDate.isSameOrBefore(currentInstance, "month");
357
348
  }
358
349
  }
359
350
  navigateMonth(direction) {
360
- let thisMonth = dayjs().year(this.currentYearNumber).month(this.currentMonthNumber);
351
+ let thisMonth = parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);
361
352
  if (direction === "NEXT") {
362
353
  thisMonth = thisMonth.add(1, "month");
363
354
  }
@@ -389,23 +380,22 @@ class TzDrpContainerComponent {
389
380
  }
390
381
  generateDates(month, currentYearNumber) {
391
382
  let dates = [];
392
- const daysInMonth = dayjs().year(currentYearNumber).month(month).daysInMonth();
383
+ const daysInMonth = parseZone().year(currentYearNumber).month(month).daysInMonth();
393
384
  for (let currentDate = 1; currentDate <= daysInMonth; currentDate++) {
394
- const date = this.dayjsInstance().year(currentYearNumber).month(month).date(currentDate);
385
+ const date = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate);
395
386
  const dateString = date.format(this.data.dpConfig.format);
396
387
  let isDisabledDay = this.data.datesDisabled.some(d => d === dateString);
397
- const minDate = !!this.data.dpConfig.minDate ? this.dayjsInstance(this.data.dpConfig.minDate, this.data.dpConfig.format) : dayjs('invalid');
388
+ const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
398
389
  if (!isDisabledDay && minDate.isValid()) {
399
390
  isDisabledDay = minDate.isAfter(date, "day");
400
391
  }
401
- const maxDate = !!this.data.dpConfig.maxDate ? this.dayjsInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format) : dayjs('invalid');
392
+ const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
402
393
  if (!isDisabledDay && maxDate.isValid()) {
403
394
  isDisabledDay = maxDate.isBefore(date, "day");
404
395
  }
405
- const isCurrentDay = this.dayjsInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===
406
- this.dayjsInstance().format(this.data.dpConfig.format);
396
+ const isCurrentDay = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===
397
+ this.parseZoneInstance().format(this.data.dpConfig.format);
407
398
  let isSelectedDay = false;
408
- console.log('abhay12', this.localSelectedDates);
409
399
  for (const selectedDateConfig of this.localSelectedDates) {
410
400
  if (!isSelectedDay && date.format(this.data.dpConfig.format) === selectedDateConfig.selectedDate) {
411
401
  isSelectedDay = true;
@@ -422,8 +412,8 @@ class TzDrpContainerComponent {
422
412
  const isSelectedStartDay = !isDisabledDay &&
423
413
  (this.localSelectedDatesRange?.startDate ?? false) &&
424
414
  date.format(this.data.dpConfig.format) === this.localSelectedDatesRange?.startDate;
425
- const isAfterSelectedStartDate = this.dayjsInstance(date).isAfter(dayjs(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format), "day");
426
- const isBeforeSelectedEndDate = this.dayjsInstance(date).isBefore(dayjs(this.localSelectedDatesRange?.endDate, this.data.dpConfig.format), "day");
415
+ const isAfterSelectedStartDate = this.parseZoneInstance(date).isAfter(parseZone(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format), "day");
416
+ const isBeforeSelectedEndDate = this.parseZoneInstance(date).isBefore(parseZone(this.localSelectedDatesRange?.endDate, this.data.dpConfig.format), "day");
427
417
  const inRangeDay = (this.localSelectedDatesRange?.startDate ?? false) &&
428
418
  (this.localSelectedDatesRange?.endDate ?? false) &&
429
419
  isAfterSelectedStartDate &&
@@ -456,13 +446,13 @@ class TzDrpContainerComponent {
456
446
  if (!this.data.isSPickerSelected) {
457
447
  if (!day.isDisabledDay) {
458
448
  if (this.selectionStarted) {
459
- const dayjsDay = dayjs()
449
+ const momentDay = parseZone()
460
450
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
461
451
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
462
452
  .date(day.date);
463
- if (dayjsDay.isBefore(dayjs(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format), "day")) {
453
+ if (momentDay.isBefore(parseZone(this.localSelectedDatesRange?.startDate, this.data.dpConfig.format), "day")) {
464
454
  this.localSelectedDatesRange = {
465
- startDate: dayjsDay.format(this.data.dpConfig.format),
455
+ startDate: momentDay.format(this.data.dpConfig.format),
466
456
  endDate: null
467
457
  };
468
458
  this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
@@ -472,13 +462,13 @@ class TzDrpContainerComponent {
472
462
  this.selectionStarted = false;
473
463
  this.localSelectedDatesRange = {
474
464
  ...this.localSelectedDatesRange,
475
- endDate: dayjsDay.format(this.data.dpConfig.format)
465
+ endDate: momentDay.format(this.data.dpConfig.format)
476
466
  };
477
467
  }
478
468
  else {
479
469
  this.selectionStarted = true;
480
470
  this.localSelectedDatesRange = {
481
- startDate: dayjs()
471
+ startDate: parseZone()
482
472
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
483
473
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
484
474
  .date(day.date)
@@ -496,7 +486,7 @@ class TzDrpContainerComponent {
496
486
  this.calculateDateRangeLength();
497
487
  }
498
488
  else {
499
- const currentSelection = dayjs()
489
+ const currentSelection = parseZone()
500
490
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
501
491
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
502
492
  .date(day.date).format(this.data.dpConfig.format);
@@ -549,9 +539,6 @@ class TzDrpContainerComponent {
549
539
  changePicker(event) {
550
540
  this.formControl.setValue(event);
551
541
  this.singleDatePickerSelected = false;
552
- this.data.isSPickerSelected = false;
553
- this.data.isSPickerSelected = false;
554
- this.openElement = false;
555
542
  if (event === "Date Range") {
556
543
  this.openElement = false;
557
544
  this.data.isSPickerSelected = false;
@@ -571,10 +558,10 @@ class TzDrpContainerComponent {
571
558
  }
572
559
  calculateDateRangeLength() {
573
560
  if (this.localSelectedDatesRange) {
574
- const startDate = !!this.localSelectedDatesRange.startDate ? this.dayjsInstance(this.localSelectedDatesRange.startDate, this.data.dpConfig.format) : dayjs('invalid');
575
- const endDate = !!this.localSelectedDatesRange.endDate ? this.dayjsInstance(this.localSelectedDatesRange.endDate, this.data.dpConfig.format) : dayjs('invalid');
561
+ const startDate = this.parseZoneInstance(this.localSelectedDatesRange.startDate, this.data.dpConfig.format).toDate();
562
+ const endDate = this.parseZoneInstance(this.localSelectedDatesRange.endDate, this.data.dpConfig.format).toDate();
576
563
  if (startDate && endDate) {
577
- this.dateRangeLength = endDate.diff(startDate, 'day') + 1;
564
+ this.dateRangeLength = (endDate.getTime() - startDate.getTime()) / (1000 * 60 * 60 * 24) + 1;
578
565
  }
579
566
  }
580
567
  }
@@ -590,7 +577,7 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
590
577
  } if (rf & 2) {
591
578
  let _t;
592
579
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.singleDatePickerElement = _t.first);
593
- } }, decls: 49, vars: 33, consts: [[1, "daterangepicker-container", 3, "ngClass"], [1, "radio-container"], ["class", "label", 4, "ngFor", "ngForOf"], [1, "specific-datepicker-container", 3, "ngStyle"], [1, "daterangepicker-container__view"], [1, "datepicker__left"], [1, "daterangepicker-container__header__prabu"], [1, "daterangepicker-container__arrow__icon", 3, "ngClass", "click"], ["width", "20", "height", "16", "viewBox", "0 0 20 16", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["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", "fill", "#181F33"], [1, "daterangepicker-container__body"], [1, "daterangepicker-container__weekdays"], ["class", "daterangepicker-container__weekday", 4, "ngFor", "ngForOf"], [1, "daterangepicker-container__days"], ["class", "daterangepicker-container__day", 3, "ngClass", "ngStyle", "click", 4, "ngFor", "ngForOf"], [1, "datepicker__right"], [1, "weekOffs_holidays_container"], [4, "ngFor", "ngForOf"], [1, "circular-dot", 2, "display", "inline-block", "margin-left", "10px"], [1, "daterangepicker__footer"], [4, "ngIf"], [1, "footer_action_btn"], ["mis-button", "", "size", "md", "type", "none", 3, "click"], ["mis-button", "", "size", "md", "type", "primary", 3, "disabled", "click", 4, "ngIf"], [1, "single-datepicker-container", 3, "ngStyle"], ["misTzDp", "", "misInput", "", "type", "text", "readonly", "", "placeholder", "Select", "positionX", "center", "positionY", "top", "offsetX", "71", "offsetY", "-1", 1, "date-input", 3, "dpConfig", "selectedDate", "value", "disableBoxShadow", "disableOverLay", "openElement", "dateChange"], ["singleDatePickerElement", ""], [1, "label"], ["ngDefaultControl", "", 1, "input", 3, "name", "value", "formControl", "valueChange"], [1, "daterangepicker-container__weekday"], [3, "ngClass"], [1, "daterangepicker-container__day", 3, "ngClass", "ngStyle", "click"], [3, "ngClass", 4, "ngIf"], ["mis-button", "", "size", "md", "type", "primary", 3, "disabled", "click"]], template: function TzDrpContainerComponent_Template(rf, ctx) { if (rf & 1) {
580
+ } }, decls: 49, vars: 35, consts: [[1, "daterangepicker-container", 3, "ngClass"], [1, "radio-container"], ["class", "label", 4, "ngFor", "ngForOf"], [1, "specific-datepicker-container", 3, "ngStyle"], [1, "daterangepicker-container__view"], [1, "datepicker__left"], [1, "daterangepicker-container__header__prabu"], [1, "daterangepicker-container__arrow__icon", 3, "ngClass", "click"], ["width", "20", "height", "16", "viewBox", "0 0 20 16", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["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", "fill", "#181F33"], [1, "daterangepicker-container__body"], [1, "daterangepicker-container__weekdays"], ["class", "daterangepicker-container__weekday", 4, "ngFor", "ngForOf"], [1, "daterangepicker-container__days"], ["class", "daterangepicker-container__day", 3, "ngClass", "ngStyle", "click", 4, "ngFor", "ngForOf"], [1, "datepicker__right"], [1, "weekOffs_holidays_container"], [4, "ngFor", "ngForOf"], [1, "circular-dot", 3, "ngStyle"], [1, "daterangepicker__footer"], [4, "ngIf"], [1, "footer_action_btn"], ["mis-button", "", "size", "md", "type", "none", 3, "click"], ["mis-button", "", "size", "md", "type", "primary", 3, "disabled", "click", 4, "ngIf"], [1, "single-datepicker-container", 3, "ngStyle"], ["misTzDp", "", "misInput", "", "type", "text", "readonly", "", "placeholder", "Select", "positionX", "center", "positionY", "top", "offsetX", "71", "offsetY", "-1", 1, "date-input", 3, "dpConfig", "selectedDate", "value", "disableBoxShadow", "disableOverLay", "openElement", "dateChange"], ["singleDatePickerElement", ""], [1, "label"], ["ngDefaultControl", "", 1, "input", 3, "name", "value", "formControl", "valueChange"], [1, "daterangepicker-container__weekday"], [3, "ngClass"], [1, "daterangepicker-container__day", 3, "ngClass", "ngStyle", "click"], [3, "ngClass", 4, "ngIf"], ["mis-button", "", "size", "md", "type", "primary", 3, "disabled", "click"]], template: function TzDrpContainerComponent_Template(rf, ctx) { if (rf & 1) {
594
581
  i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
595
582
  i0.ɵɵtemplate(2, TzDrpContainerComponent_div_2_Template, 4, 4, "div", 2);
596
583
  i0.ɵɵelementEnd();
@@ -656,9 +643,9 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
656
643
  i0.ɵɵadvance(2);
657
644
  i0.ɵɵproperty("ngForOf", ctx.datePickerValue);
658
645
  i0.ɵɵadvance(1);
659
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(25, _c6, ctx.singleDatePickerSelected ? "none" : ""));
646
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(26, _c6, ctx.singleDatePickerSelected ? "none" : ""));
660
647
  i0.ɵɵadvance(4);
661
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(27, _c7, ctx.isPreviousMonthDisabled));
648
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(28, _c7, ctx.isPreviousMonthDisabled));
662
649
  i0.ɵɵadvance(4);
663
650
  i0.ɵɵtextInterpolate2(" ", ctx.currentMonth, " ", ctx.currentYearNumber, " ");
664
651
  i0.ɵɵadvance(4);
@@ -668,14 +655,16 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
668
655
  i0.ɵɵadvance(5);
669
656
  i0.ɵɵtextInterpolate2(" ", ctx.nextMonth, " ", ctx.nextYearNumber, " ");
670
657
  i0.ɵɵadvance(1);
671
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(29, _c7, ctx.isNextMonthDisabled));
658
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(30, _c7, ctx.isNextMonthDisabled));
672
659
  i0.ɵɵadvance(5);
673
660
  i0.ɵɵproperty("ngForOf", ctx.weekDays);
674
661
  i0.ɵɵadvance(2);
675
662
  i0.ɵɵproperty("ngForOf", ctx.nextMonthDates);
676
663
  i0.ɵɵadvance(4);
677
664
  i0.ɵɵproperty("ngForOf", ctx.data.weekOffs);
678
- i0.ɵɵadvance(5);
665
+ i0.ɵɵadvance(3);
666
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(32, _c8));
667
+ i0.ɵɵadvance(2);
679
668
  i0.ɵɵproperty("ngIf", ctx.data.isSPickerSelected);
680
669
  i0.ɵɵadvance(1);
681
670
  i0.ɵɵproperty("ngIf", !ctx.data.isSPickerSelected);
@@ -684,13 +673,13 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
684
673
  i0.ɵɵadvance(1);
685
674
  i0.ɵɵproperty("ngIf", !ctx.data.isSPickerSelected);
686
675
  i0.ɵɵadvance(1);
687
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(31, _c6, !ctx.singleDatePickerSelected ? "none" : "block"));
676
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(33, _c6, !ctx.singleDatePickerSelected ? "none" : "block"));
688
677
  i0.ɵɵadvance(1);
689
678
  i0.ɵɵproperty("dpConfig", ctx.data.dpConfig)("selectedDate", ctx.singleDateSelectedValue)("value", ctx.singleDateSelectedValue)("disableBoxShadow", true)("disableOverLay", true)("openElement", ctx.openElement);
690
679
  } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i2.NgStyle, i3.ButtonDirective, i4.RadioButtonComponent, i5.TzDatepickerDirective], styles: [".daterangepicker-container[_ngcontent-%COMP%]{background:#ffffff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}.daterangepicker-container.single-date-picker-enabled[_ngcontent-%COMP%]{flex-direction:row}.daterangepicker-container[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%]{display:flex;align-items:center;height:48px;padding:8px 0;justify-content:center;border-radius:12px 12px 0 0;border-bottom:1px solid var(--lt-bg-ntrl-seperators, #e0e0e0);background:var(--lt-text-white, #fff)}.daterangepicker-container[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]{display:flex;align-items:center}.daterangepicker-container[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .input[_ngcontent-%COMP%]{margin-right:8px;width:20px;height:20px}.daterangepicker-container[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]:first-child{padding-right:16px;border-right:1px solid #e0e0e0}.daterangepicker-container[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]:nth-child(2){padding-left:16px}.daterangepicker-container.single-date-picker-enabled[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%]{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:16px;height:288px;padding:20px;border-right:1px solid #e0e0e0!important;border-radius:0}.daterangepicker-container.single-date-picker-enabled[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]:first-child{padding-right:0;border-right:0px}.daterangepicker-container.single-date-picker-enabled[_ngcontent-%COMP%] .radio-container[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]:nth-child(2){padding-left:0}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%]{display:flex;gap:24px;padding:16px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .datepicker__left[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .datepicker__right[_ngcontent-%COMP%]{display:flex;flex-direction:column}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__header__prabu[_ngcontent-%COMP%]{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:16px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__header__prabu[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__header__prabu[_ngcontent-%COMP%] .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__header__prabu[_ngcontent-%COMP%] .daterangepicker-container__arrow__icon.disabled-month[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__header__prabu[_ngcontent-%COMP%] .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__header__prabu[_ngcontent-%COMP%] .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]:nth-child(1){transform:rotate(180deg)}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%]{height:100%;width:252px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__weekdays[_ngcontent-%COMP%]{width:100%;display:flex;padding-bottom:10px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__weekdays[_ngcontent-%COMP%] .daterangepicker-container__weekday[_ngcontent-%COMP%]{width:36px;height:18px;text-align:center}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__weekdays[_ngcontent-%COMP%] .daterangepicker-container__weekday[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__weekdays[_ngcontent-%COMP%] .daterangepicker-container__weekday[_ngcontent-%COMP%] span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-wrap:wrap}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day[_ngcontent-%COMP%]{flex-direction:column;width:35px;height:36px;display:flex;align-items:center;justify-content:center;margin-bottom:1px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day[_ngcontent-%COMP%]:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%]{cursor:default}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%]:hover{background-color:transparent}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#6a737d}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day[_ngcontent-%COMP%] span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px;color:#0937b2}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day[_ngcontent-%COMP%] span.selected-day[_ngcontent-%COMP%]{color:#fff}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .daterangepicker-container__day[_ngcontent-%COMP%] span.disabled-day[_ngcontent-%COMP%]{color:#6a737d}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-start-day[_ngcontent-%COMP%]{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-start-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#fff!important}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-end-day[_ngcontent-%COMP%]{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-end-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#fff!important}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-end-day.selected-start-day[_ngcontent-%COMP%]{border-radius:50%!important}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .in-range-day[_ngcontent-%COMP%]:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-day[_ngcontent-%COMP%]{background-color:#0937b2;border-radius:4px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker-container__view[_ngcontent-%COMP%] .daterangepicker-container__body[_ngcontent-%COMP%] .daterangepicker-container__days[_ngcontent-%COMP%] .selected-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#fff!important}.daterangepicker-container[_ngcontent-%COMP%] .weekOffs_holidays_container[_ngcontent-%COMP%]{font-size:12px;color:var(--lt-text-muted, #6a737d);padding:8px 24px 12px}.daterangepicker-container[_ngcontent-%COMP%] .weekOffs_holidays_container[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{margin-right:16px}.daterangepicker-container[_ngcontent-%COMP%] .weekOffs_holidays_container[_ngcontent-%COMP%] > span[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#181f33}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker__footer[_ngcontent-%COMP%]{display:flex;justify-content:space-between;border-top:1px solid #e0e0e0;padding:16px 24px;word-spacing:4px}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker__footer[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{font-family:Lato;font-size:15px;font-weight:400;align-self:center}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker__footer[_ngcontent-%COMP%] span[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{font-weight:700}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker__footer[_ngcontent-%COMP%] .footer_action_btn[_ngcontent-%COMP%]{display:flex}.daterangepicker-container[_ngcontent-%COMP%] .daterangepicker__footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%]{width:104px;height:44px;border-radius:8px;margin-left:24px;font-weight:700}.circular-dot[_ngcontent-%COMP%]{width:5px;height:5px;background-color:#ed711c;border-radius:50%}.holiday-text[_ngcontent-%COMP%]{color:#6a737d!important}.display-none[_ngcontent-%COMP%]{display:none!important}.single-datepicker-container[_ngcontent-%COMP%]{width:291px}"] });
691
680
  (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TzDrpContainerComponent, [{
692
681
  type: Component,
693
- args: [{ selector: "mis-tz-sdp", template: "<div class=\"daterangepicker-container\" [ngClass]=\"data.isSingleDatePickerEnable?'single-date-picker-enabled':''\">\n <div class=\"radio-container\">\n <!-- <label>\n <input type=\"radio\" (change)=\"changePicker($event)\" name=\"dateSelection\" value=\"SpecificDate\" [checked]=\"data.isSPickerSelected\"> Specific Date(s)\n</label>\n<label>\n <input type=\"radio\" (change)=\"changePicker($event)\" name=\"dateSelection\" value=\"DateRange\" [checked]=\"!data.isSPickerSelected\" >Date Range\n</label> -->\n<div class=\"label\" *ngFor=\"let picker of datePickerValue\">\n <mis-radio class=\"input\" [name]=\"'dateSelection'\" [value]=\"picker\" (valueChange)=\"changePicker($event)\" ngDefaultControl [formControl]=\"formControl\"></mis-radio>\n <span>{{picker}}</span>\n</div>\n</div>\n<div class=\"specific-datepicker-container\" [ngStyle]=\"{'display': singleDatePickerSelected ? 'none' : ''}\">\n <div class=\"daterangepicker-container__view\">\n <div class=\"datepicker__left\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div\n class=\"daterangepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\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></div>\n </div>\n <div class=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n <span [ngClass]=\"{\n 'current-day': weekDay.isCurrentDay && (currentMonthNumber === todayMonthNumber)\n }\">{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay && data.isSPickerSelected,\n 'disabled-day': day.isDisabledDay,\n 'selected-start-day': day.isSelectedStartDay && !data.isSPickerSelected,\n 'selected-end-day': day.isSelectedEndDay && !data.isSPickerSelected,\n 'in-range-day': day.inRangeDay && !data.isSPickerSelected,\n 'is-valid-date': day.date > 0 && !data.isSPickerSelected && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n [ngStyle]=\"{'margin-right': !data.isSPickerSelected ? '0px' : '1px','width': !data.isSPickerSelected ? '36px' : '35px','justify-content': day.isHoliday ? 'flex-start' : 'center','padding-top': day.isHoliday ? '2.8px' : '0px','height': day.isHoliday ? '33px' : '36px'}\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay('LEFT',day)\"\n >\n <div [ngClass]=\"{\n 'circular-dot': day.isHoliday\n }\"></div>\n <span *ngIf=\"day.date > 0\" [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'holiday-text': day.isHoliday || day.isWeekOff\n }\" >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n <div class=\"datepicker__right\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div></div>\n <span> {{ nextMonth }} {{ nextYearNumber }} </span>\n <div\n class=\"daterangepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\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=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\" >\n <span >{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay && data.isSPickerSelected,\n 'disabled-day': day.isDisabledDay,\n 'selected-start-day': day.isSelectedStartDay && !data.isSPickerSelected,\n 'selected-end-day': day.isSelectedEndDay && !data.isSPickerSelected,\n 'in-range-day': day.inRangeDay && !data.isSPickerSelected,\n 'is-valid-date': day.date > 0 && !data.isSPickerSelected && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n [ngStyle]=\"{ 'margin-right': !data.isSPickerSelected ? '0px' : '1px','width': !data.isSPickerSelected ? '36px' : '35px','justify-content': day.isHoliday ? 'flex-start' : 'center','padding-top': day.isHoliday ? '3px' : '0px','height': day.isHoliday ? '33px' : '36px'}\"\n *ngFor=\"let day of nextMonthDates\"\n (click)=\"selectDay('RIGHT',day)\"\n >\n <div [ngClass]=\"{\n 'circular-dot': day.isHoliday\n }\"></div>\n <span *ngIf=\"day.date > 0\" [ngClass]=\"{\n 'current-day': day.isCurrentDay && (currentMonthNumber === todayMonthNumber),\n 'holiday-text': day.isHoliday || day.isWeekOff\n }\" >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"weekOffs_holidays_container\">\n <span>Weekly offs: <span *ngFor=\"let weekOff of data.weekOffs; let last = last\">{{weekOff}} <span *ngIf=\"!last\">,</span></span></span>\n <span >Holidays <span class=\"circular-dot\" style=\"display: inline-block; margin-left: 10px;\"></span></span>\n </div>\n <div class=\"daterangepicker__footer\">\n <span *ngIf=\"data.isSPickerSelected\"><span>{{data.isSPickerSelected && localSelectedDates[0]?.selectedDate ? localSelectedDates.length : (localSelectedDates.length -1 && 0)}} </span>day(s) selected</span>\n <span *ngIf=\"!data.isSPickerSelected\"><span>{{dateRangeLength > 0 ? dateRangeLength : 0 }} </span>day(s) selected</span>\n <div class=\"footer_action_btn\">\n <button mis-button size=\"md\" type=\"none\" (click)=\"cancelDatePicker()\" >Cancel</button>\n <button *ngIf=\"data.isSPickerSelected\" mis-button size=\"md\" type=\"primary\" (click)=\"applyDates()\" [disabled]=\"!isDatesValid\" >Apply</button>\n <button *ngIf=\"!data.isSPickerSelected\" mis-button size=\"md\" type=\"primary\" (click)=\"applyDatesRange()\" [disabled]=\"!isDatesValid || (dateRangeLength === 0)\" >Apply</button>\n </div>\n </div>\n </div>\n <div class=\"single-datepicker-container\" [ngStyle]=\"{'display': !singleDatePickerSelected ? 'none' : 'block'}\">\n <input\n misTzDp\n misInput\n type=\"text\"\n readonly\n class=\"date-input\"\n [dpConfig]=\"data.dpConfig\"\n placeholder=\"Select\"\n (dateChange)=\"onSingleDateChange($event)\"\n [selectedDate]=\"singleDateSelectedValue\"\n positionX=\"center\"\n positionY=\"top\"\n offsetX = 71\n offsetY = -1\n [value]=\"singleDateSelectedValue\"\n [disableBoxShadow]=\"true\"\n [disableOverLay]=\"true\"\n [openElement]=\"openElement\"\n #singleDatePickerElement\n />\n </div>\n\n</div>\n", styles: [".daterangepicker-container{background:#ffffff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}.daterangepicker-container.single-date-picker-enabled{flex-direction:row}.daterangepicker-container .radio-container{display:flex;align-items:center;height:48px;padding:8px 0;justify-content:center;border-radius:12px 12px 0 0;border-bottom:1px solid var(--lt-bg-ntrl-seperators, #e0e0e0);background:var(--lt-text-white, #fff)}.daterangepicker-container .radio-container .label{display:flex;align-items:center}.daterangepicker-container .radio-container .label .input{margin-right:8px;width:20px;height:20px}.daterangepicker-container .radio-container .label:first-child{padding-right:16px;border-right:1px solid #e0e0e0}.daterangepicker-container .radio-container .label:nth-child(2){padding-left:16px}.daterangepicker-container.single-date-picker-enabled .radio-container{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:16px;height:288px;padding:20px;border-right:1px solid #e0e0e0!important;border-radius:0}.daterangepicker-container.single-date-picker-enabled .radio-container .label:first-child{padding-right:0;border-right:0px}.daterangepicker-container.single-date-picker-enabled .radio-container .label:nth-child(2){padding-left:0}.daterangepicker-container .daterangepicker-container__view{display:flex;gap:24px;padding:16px}.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{display:flex;flex-direction:column}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:16px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{height:100%;width:252px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{width:36px;height:18px;text-align:center}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-wrap:wrap}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{flex-direction:column;width:35px;height:36px;display:flex;align-items:center;justify-content:center;margin-bottom:1px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day{cursor:default}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day:hover{background-color:transparent}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day>span{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px;color:#0937b2}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.selected-day{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.disabled-day{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day>span{color:#fff!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day>span{color:#fff!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day.selected-start-day{border-radius:50%!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .in-range-day:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-day{background-color:#0937b2;border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-day>span{color:#fff!important}.daterangepicker-container .weekOffs_holidays_container{font-size:12px;color:var(--lt-text-muted, #6a737d);padding:8px 24px 12px}.daterangepicker-container .weekOffs_holidays_container>span{margin-right:16px}.daterangepicker-container .weekOffs_holidays_container>span>span{color:#181f33}.daterangepicker-container .daterangepicker__footer{display:flex;justify-content:space-between;border-top:1px solid #e0e0e0;padding:16px 24px;word-spacing:4px}.daterangepicker-container .daterangepicker__footer span{font-family:Lato;font-size:15px;font-weight:400;align-self:center}.daterangepicker-container .daterangepicker__footer span span{font-weight:700}.daterangepicker-container .daterangepicker__footer .footer_action_btn{display:flex}.daterangepicker-container .daterangepicker__footer button{width:104px;height:44px;border-radius:8px;margin-left:24px;font-weight:700}.circular-dot{width:5px;height:5px;background-color:#ed711c;border-radius:50%}.holiday-text{color:#6a737d!important}.display-none{display:none!important}.single-datepicker-container{width:291px}\n"] }]
682
+ args: [{ selector: "mis-tz-sdp", template: "<div class=\"daterangepicker-container\" [ngClass]=\"data.isSingleDatePickerEnable?'single-date-picker-enabled':''\">\n <div class=\"radio-container\">\n <!-- <label>\n <input type=\"radio\" (change)=\"changePicker($event)\" name=\"dateSelection\" value=\"SpecificDate\" [checked]=\"data.isSPickerSelected\"> Specific Date(s)\n</label>\n<label>\n <input type=\"radio\" (change)=\"changePicker($event)\" name=\"dateSelection\" value=\"DateRange\" [checked]=\"!data.isSPickerSelected\" >Date Range\n</label> -->\n<div class=\"label\" *ngFor=\"let picker of datePickerValue\">\n <mis-radio class=\"input\" [name]=\"'dateSelection'\" [value]=\"picker\" (valueChange)=\"changePicker($event)\" ngDefaultControl [formControl]=\"formControl\"></mis-radio>\n <span>{{picker}}</span>\n</div>\n</div>\n<div class=\"specific-datepicker-container\" [ngStyle]=\"{'display': singleDatePickerSelected ? 'none' : ''}\">\n <div class=\"daterangepicker-container__view\">\n <div class=\"datepicker__left\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div\n class=\"daterangepicker-container__arrow__icon\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\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></div>\n </div>\n <div class=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n <span [ngClass]=\"{\n 'current-day': weekDay.isCurrentDay && (currentMonthNumber === todayMonthNumber)\n }\">{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay && data.isSPickerSelected,\n 'disabled-day': day.isDisabledDay,\n 'selected-start-day': day.isSelectedStartDay && !data.isSPickerSelected,\n 'selected-end-day': day.isSelectedEndDay && !data.isSPickerSelected,\n 'in-range-day': day.inRangeDay && !data.isSPickerSelected,\n 'is-valid-date': day.date > 0 && !data.isSPickerSelected && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n [ngStyle]=\"{'margin-right': !data.isSPickerSelected ? '0px' : '1px','width': !data.isSPickerSelected ? '36px' : '35px','justify-content': day.isHoliday ? 'flex-start' : 'center','padding-top': day.isHoliday ? '2.8px' : '0px','height': day.isHoliday ? '33px' : '36px'}\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay('LEFT',day)\"\n >\n <div [ngClass]=\"{\n 'circular-dot': day.isHoliday\n }\"></div>\n <span *ngIf=\"day.date > 0\" [ngClass]=\"{\n 'current-day': day.isCurrentDay,\n 'holiday-text': day.isHoliday || day.isWeekOff\n }\" >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n <div class=\"datepicker__right\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div></div>\n <span> {{ nextMonth }} {{ nextYearNumber }} </span>\n <div\n class=\"daterangepicker-container__arrow__icon\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\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=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\" >\n <span >{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\"\n [ngClass]=\"{\n 'selected-day': day.isSelectedDay && data.isSPickerSelected,\n 'disabled-day': day.isDisabledDay,\n 'selected-start-day': day.isSelectedStartDay && !data.isSPickerSelected,\n 'selected-end-day': day.isSelectedEndDay && !data.isSPickerSelected,\n 'in-range-day': day.inRangeDay && !data.isSPickerSelected,\n 'is-valid-date': day.date > 0 && !data.isSPickerSelected && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n [ngStyle]=\"{ 'margin-right': !data.isSPickerSelected ? '0px' : '1px','width': !data.isSPickerSelected ? '36px' : '35px','justify-content': day.isHoliday ? 'flex-start' : 'center','padding-top': day.isHoliday ? '3px' : '0px','height': day.isHoliday ? '33px' : '36px'}\"\n *ngFor=\"let day of nextMonthDates\"\n (click)=\"selectDay('RIGHT',day)\"\n >\n <div [ngClass]=\"{\n 'circular-dot': day.isHoliday\n }\"></div>\n <span *ngIf=\"day.date > 0\" [ngClass]=\"{\n 'current-day': day.isCurrentDay && (currentMonthNumber === todayMonthNumber),\n 'holiday-text': day.isHoliday || day.isWeekOff\n }\" >\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"weekOffs_holidays_container\">\n <span>Weekly offs: <span *ngFor=\"let weekOff of data.weekOffs; let last = last\">{{weekOff}} <span *ngIf=\"!last\">,</span></span></span>\n <span >Holidays <span class=\"circular-dot\" [ngStyle]=\"{ display: 'inline-block', 'margin-left': '10px' }\"></span></span>\n </div>\n <div class=\"daterangepicker__footer\">\n <span *ngIf=\"data.isSPickerSelected\"><span>{{localSelectedDates[0]?.selectedDate ? localSelectedDates.length : (localSelectedDates.length -1 && 0)}} </span>day(s) selected</span>\n <span *ngIf=\"!data.isSPickerSelected\"><span>{{dateRangeLength > 0 ? dateRangeLength : 0 }} </span>day(s) selected</span>\n <div class=\"footer_action_btn\">\n <button mis-button size=\"md\" type=\"none\" (click)=\"cancelDatePicker()\" >Cancel</button>\n <button *ngIf=\"data.isSPickerSelected\" mis-button size=\"md\" type=\"primary\" (click)=\"applyDates()\" [disabled]=\"!isDatesValid\" >Apply</button>\n <button *ngIf=\"!data.isSPickerSelected\" mis-button size=\"md\" type=\"primary\" (click)=\"applyDatesRange()\" [disabled]=\"!isDatesValid || (dateRangeLength === 0)\" >Apply</button>\n </div>\n </div>\n </div>\n <div class=\"single-datepicker-container\" [ngStyle]=\"{'display': !singleDatePickerSelected ? 'none' : 'block'}\">\n <input\n misTzDp\n misInput\n type=\"text\"\n readonly\n class=\"date-input\"\n [dpConfig]=\"data.dpConfig\"\n placeholder=\"Select\"\n (dateChange)=\"onSingleDateChange($event)\"\n [selectedDate]=\"singleDateSelectedValue\"\n positionX=\"center\"\n positionY=\"top\"\n offsetX = 71\n offsetY = -1\n [value]=\"singleDateSelectedValue\"\n [disableBoxShadow]=\"true\"\n [disableOverLay]=\"true\"\n [openElement]=\"openElement\"\n #singleDatePickerElement\n />\n </div>\n\n</div>\n", styles: [".daterangepicker-container{background:#ffffff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}.daterangepicker-container.single-date-picker-enabled{flex-direction:row}.daterangepicker-container .radio-container{display:flex;align-items:center;height:48px;padding:8px 0;justify-content:center;border-radius:12px 12px 0 0;border-bottom:1px solid var(--lt-bg-ntrl-seperators, #e0e0e0);background:var(--lt-text-white, #fff)}.daterangepicker-container .radio-container .label{display:flex;align-items:center}.daterangepicker-container .radio-container .label .input{margin-right:8px;width:20px;height:20px}.daterangepicker-container .radio-container .label:first-child{padding-right:16px;border-right:1px solid #e0e0e0}.daterangepicker-container .radio-container .label:nth-child(2){padding-left:16px}.daterangepicker-container.single-date-picker-enabled .radio-container{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:16px;height:288px;padding:20px;border-right:1px solid #e0e0e0!important;border-radius:0}.daterangepicker-container.single-date-picker-enabled .radio-container .label:first-child{padding-right:0;border-right:0px}.daterangepicker-container.single-date-picker-enabled .radio-container .label:nth-child(2){padding-left:0}.daterangepicker-container .daterangepicker-container__view{display:flex;gap:24px;padding:16px}.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{display:flex;flex-direction:column}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:16px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{height:100%;width:252px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{width:36px;height:18px;text-align:center}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-wrap:wrap}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{flex-direction:column;width:35px;height:36px;display:flex;align-items:center;justify-content:center;margin-bottom:1px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day{cursor:default}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day:hover{background-color:transparent}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day>span{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px;color:#0937b2}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.selected-day{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.disabled-day{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day>span{color:#fff!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day>span{color:#fff!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day.selected-start-day{border-radius:50%!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .in-range-day:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-day{background-color:#0937b2;border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-day>span{color:#fff!important}.daterangepicker-container .weekOffs_holidays_container{font-size:12px;color:var(--lt-text-muted, #6a737d);padding:8px 24px 12px}.daterangepicker-container .weekOffs_holidays_container>span{margin-right:16px}.daterangepicker-container .weekOffs_holidays_container>span>span{color:#181f33}.daterangepicker-container .daterangepicker__footer{display:flex;justify-content:space-between;border-top:1px solid #e0e0e0;padding:16px 24px;word-spacing:4px}.daterangepicker-container .daterangepicker__footer span{font-family:Lato;font-size:15px;font-weight:400;align-self:center}.daterangepicker-container .daterangepicker__footer span span{font-weight:700}.daterangepicker-container .daterangepicker__footer .footer_action_btn{display:flex}.daterangepicker-container .daterangepicker__footer button{width:104px;height:44px;border-radius:8px;margin-left:24px;font-weight:700}.circular-dot{width:5px;height:5px;background-color:#ed711c;border-radius:50%}.holiday-text{color:#6a737d!important}.display-none{display:none!important}.single-datepicker-container{width:291px}\n"] }]
694
683
  }], function () { return [{ type: undefined, decorators: [{
695
684
  type: Inject,
696
685
  args: [CONTAINER_DATA]