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';
@@ -224,7 +219,7 @@ function TzDrpContainerComponent_span_39_Template(rf, ctx) {
224
219
  if (rf & 2) {
225
220
  const ctx_r6 = i0.ɵɵnextContext();
226
221
  i0.ɵɵadvance(2);
227
- 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, " ");
222
+ i0.ɵɵtextInterpolate1("", (ctx_r6.localSelectedDates[0] == null ? null : ctx_r6.localSelectedDates[0].selectedDate) ? ctx_r6.localSelectedDates.length : ctx_r6.localSelectedDates.length - 1 && 0, " ");
228
223
  }
229
224
  }
230
225
  function TzDrpContainerComponent_span_40_Template(rf, ctx) {
@@ -269,18 +264,14 @@ function TzDrpContainerComponent_button_45_Template(rf, ctx) {
269
264
  }
270
265
  const _c6 = function (a0) { return { "display": a0 }; };
271
266
  const _c7 = function (a0) { return { "disabled-month": a0 }; };
272
- dayjs.extend(utc);
273
- dayjs.extend(timezone);
274
- dayjs.extend(customParseFormat);
275
- dayjs.extend(isSameOrAfter);
276
- dayjs.extend(isSameOrBefore);
267
+ const _c8 = function () { return { display: "inline-block", "margin-left": "10px" }; };
277
268
  class TzDrpContainerComponent {
278
269
  constructor(data, toast, cdr) {
279
270
  var _a, _b, _c, _d, _e, _f, _g, _h;
280
271
  this.toast = toast;
281
272
  this.cdr = cdr;
282
- this.dayjsInstance = (...args) => {
283
- return dayjs(...args);
273
+ this.parseZoneInstance = (...args) => {
274
+ return parseZone(...args);
284
275
  };
285
276
  this.rawWeekDays = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
286
277
  this.weekDays = [];
@@ -301,10 +292,10 @@ class TzDrpContainerComponent {
301
292
  this.singleDateSelectedValue = '';
302
293
  this.data = data;
303
294
  this.localSelectedDatesRange = this.data.datesRange;
304
- const startDate = dayjs((_a = this.localSelectedDatesRange) === null || _a === void 0 ? void 0 : _a.startDate, this.data.dpConfig.format);
305
- const endDate = dayjs((_b = this.localSelectedDatesRange) === null || _b === void 0 ? void 0 : _b.endDate, this.data.dpConfig.format);
295
+ const startDate = new Date((_a = this.localSelectedDatesRange) === null || _a === void 0 ? void 0 : _a.startDate);
296
+ const endDate = new Date((_b = this.localSelectedDatesRange) === null || _b === void 0 ? void 0 : _b.endDate);
306
297
  if (startDate && endDate) {
307
- this.dateRangeLength = endDate.diff(startDate, 'day') + 1;
298
+ this.dateRangeLength = (endDate.getTime() - startDate.getTime()) / (1000 * 60 * 60 * 24) + 1;
308
299
  }
309
300
  this.localSelectedDates = this.data.dates;
310
301
  if (!this.data.isSPickerSelected) {
@@ -322,19 +313,19 @@ class TzDrpContainerComponent {
322
313
  }
323
314
  }
324
315
  if ((_f = (_e = this.data) === null || _e === void 0 ? void 0 : _e.dpConfig) === null || _f === void 0 ? void 0 : _f.timezone) {
325
- this.dayjsInstance = (...args) => {
326
- return dayjs(...args).tz(this.data.dpConfig.timezone);
316
+ this.parseZoneInstance = (...args) => {
317
+ return parseZone(...args).tz(this.data.dpConfig.timezone);
327
318
  };
328
319
  }
329
- this.currentMonthNumber = this.dayjsInstance().month();
330
- this.nextMonthNumber = this.dayjsInstance().add(1, "month").month();
320
+ this.currentMonthNumber = this.parseZoneInstance().month();
321
+ this.nextMonthNumber = this.parseZoneInstance().add(1, "month").month();
331
322
  this.currentMonth = getMonth(this.currentMonthNumber);
332
323
  this.nextMonth = getMonth(this.nextMonthNumber);
333
- this.currentYearNumber = this.dayjsInstance().year();
334
- this.nextYearNumber = this.dayjsInstance().add(1, "month").year();
324
+ this.currentYearNumber = this.parseZoneInstance().year();
325
+ this.nextYearNumber = this.parseZoneInstance().add(1, "month").year();
335
326
  this.weekDays = this.rawWeekDays.map((day, index) => ({
336
327
  label: `${day[0]}${day.slice(1).toLowerCase()}`,
337
- isCurrentDay: this.dayjsInstance().day() === index
328
+ isCurrentDay: this.parseZoneInstance().day() === index
338
329
  }));
339
330
  if (!((_h = (_g = this.data) === null || _g === void 0 ? void 0 : _g.dpConfig) === null || _h === void 0 ? void 0 : _h.format)) {
340
331
  this.data.dpConfig = Object.assign(Object.assign({}, this.data.dpConfig), { format: DATE_FORMAT });
@@ -361,16 +352,16 @@ class TzDrpContainerComponent {
361
352
  this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
362
353
  return;
363
354
  }
364
- selectedStartDate = this.dayjsInstance((_b = this.localSelectedDatesRange) === null || _b === void 0 ? void 0 : _b.startDate, this.data.dpConfig.format);
355
+ selectedStartDate = this.parseZoneInstance((_b = this.localSelectedDatesRange) === null || _b === void 0 ? void 0 : _b.startDate, this.data.dpConfig.format);
365
356
  }
366
357
  else {
367
- selectedStartDate = this.dayjsInstance((_c = this.localSelectedDates) === null || _c === void 0 ? void 0 : _c[0].selectedDate, this.data.dpConfig.format);
358
+ selectedStartDate = this.parseZoneInstance((_c = this.localSelectedDates) === null || _c === void 0 ? void 0 : _c[0].selectedDate, this.data.dpConfig.format);
368
359
  }
369
360
  if (selectedStartDate.isValid()) {
370
361
  this.currentYearNumber = selectedStartDate.year();
371
362
  this.nextYearNumber = selectedStartDate.add(1, "month").year();
372
- this.currentMonthNumber = selectedStartDate.get("month");
373
- this.nextMonthNumber = selectedStartDate.add(1, "month").month();
363
+ this.currentMonthNumber = selectedStartDate.get("month") - 1;
364
+ this.nextMonthNumber = selectedStartDate.add(1, "month").month() - 1;
374
365
  if (this.currentMonthNumber === -1) {
375
366
  this.currentMonthNumber = 11;
376
367
  }
@@ -384,18 +375,18 @@ class TzDrpContainerComponent {
384
375
  this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
385
376
  }
386
377
  calculateMinMaxDays() {
387
- const currentInstance = this.dayjsInstance().year(this.currentYearNumber).month(this.currentMonthNumber);
388
- const minDate = !!this.data.dpConfig.minDate ? this.dayjsInstance(this.data.dpConfig.minDate, this.data.dpConfig.format) : dayjs('invalid');
378
+ const currentInstance = this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber);
379
+ const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
389
380
  if (minDate.isValid()) {
390
381
  this.isPreviousMonthDisabled = minDate.isSameOrAfter(currentInstance, "month");
391
382
  }
392
- const maxDate = !!this.data.dpConfig.maxDate ? this.dayjsInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format) : dayjs('invalid');
383
+ const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
393
384
  if (maxDate.isValid()) {
394
385
  this.isNextMonthDisabled = maxDate.isSameOrBefore(currentInstance, "month");
395
386
  }
396
387
  }
397
388
  navigateMonth(direction) {
398
- let thisMonth = dayjs().year(this.currentYearNumber).month(this.currentMonthNumber);
389
+ let thisMonth = parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);
399
390
  if (direction === "NEXT") {
400
391
  thisMonth = thisMonth.add(1, "month");
401
392
  }
@@ -428,23 +419,22 @@ class TzDrpContainerComponent {
428
419
  generateDates(month, currentYearNumber) {
429
420
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
430
421
  let dates = [];
431
- const daysInMonth = dayjs().year(currentYearNumber).month(month).daysInMonth();
422
+ const daysInMonth = parseZone().year(currentYearNumber).month(month).daysInMonth();
432
423
  for (let currentDate = 1; currentDate <= daysInMonth; currentDate++) {
433
- const date = this.dayjsInstance().year(currentYearNumber).month(month).date(currentDate);
424
+ const date = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate);
434
425
  const dateString = date.format(this.data.dpConfig.format);
435
426
  let isDisabledDay = this.data.datesDisabled.some(d => d === dateString);
436
- const minDate = !!this.data.dpConfig.minDate ? this.dayjsInstance(this.data.dpConfig.minDate, this.data.dpConfig.format) : dayjs('invalid');
427
+ const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
437
428
  if (!isDisabledDay && minDate.isValid()) {
438
429
  isDisabledDay = minDate.isAfter(date, "day");
439
430
  }
440
- const maxDate = !!this.data.dpConfig.maxDate ? this.dayjsInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format) : dayjs('invalid');
431
+ const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
441
432
  if (!isDisabledDay && maxDate.isValid()) {
442
433
  isDisabledDay = maxDate.isBefore(date, "day");
443
434
  }
444
- const isCurrentDay = this.dayjsInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===
445
- this.dayjsInstance().format(this.data.dpConfig.format);
435
+ const isCurrentDay = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===
436
+ this.parseZoneInstance().format(this.data.dpConfig.format);
446
437
  let isSelectedDay = false;
447
- console.log('abhay12', this.localSelectedDates);
448
438
  for (const selectedDateConfig of this.localSelectedDates) {
449
439
  if (!isSelectedDay && date.format(this.data.dpConfig.format) === selectedDateConfig.selectedDate) {
450
440
  isSelectedDay = true;
@@ -461,8 +451,8 @@ class TzDrpContainerComponent {
461
451
  const isSelectedStartDay = !isDisabledDay &&
462
452
  ((_b = (_a = this.localSelectedDatesRange) === null || _a === void 0 ? void 0 : _a.startDate) !== null && _b !== void 0 ? _b : false) &&
463
453
  date.format(this.data.dpConfig.format) === ((_c = this.localSelectedDatesRange) === null || _c === void 0 ? void 0 : _c.startDate);
464
- const isAfterSelectedStartDate = this.dayjsInstance(date).isAfter(dayjs((_d = this.localSelectedDatesRange) === null || _d === void 0 ? void 0 : _d.startDate, this.data.dpConfig.format), "day");
465
- const isBeforeSelectedEndDate = this.dayjsInstance(date).isBefore(dayjs((_e = this.localSelectedDatesRange) === null || _e === void 0 ? void 0 : _e.endDate, this.data.dpConfig.format), "day");
454
+ const isAfterSelectedStartDate = this.parseZoneInstance(date).isAfter(parseZone((_d = this.localSelectedDatesRange) === null || _d === void 0 ? void 0 : _d.startDate, this.data.dpConfig.format), "day");
455
+ const isBeforeSelectedEndDate = this.parseZoneInstance(date).isBefore(parseZone((_e = this.localSelectedDatesRange) === null || _e === void 0 ? void 0 : _e.endDate, this.data.dpConfig.format), "day");
466
456
  const inRangeDay = ((_g = (_f = this.localSelectedDatesRange) === null || _f === void 0 ? void 0 : _f.startDate) !== null && _g !== void 0 ? _g : false) &&
467
457
  ((_j = (_h = this.localSelectedDatesRange) === null || _h === void 0 ? void 0 : _h.endDate) !== null && _j !== void 0 ? _j : false) &&
468
458
  isAfterSelectedStartDate &&
@@ -496,13 +486,13 @@ class TzDrpContainerComponent {
496
486
  if (!this.data.isSPickerSelected) {
497
487
  if (!day.isDisabledDay) {
498
488
  if (this.selectionStarted) {
499
- const dayjsDay = dayjs()
489
+ const momentDay = parseZone()
500
490
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
501
491
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
502
492
  .date(day.date);
503
- if (dayjsDay.isBefore(dayjs((_a = this.localSelectedDatesRange) === null || _a === void 0 ? void 0 : _a.startDate, this.data.dpConfig.format), "day")) {
493
+ if (momentDay.isBefore(parseZone((_a = this.localSelectedDatesRange) === null || _a === void 0 ? void 0 : _a.startDate, this.data.dpConfig.format), "day")) {
504
494
  this.localSelectedDatesRange = {
505
- startDate: dayjsDay.format(this.data.dpConfig.format),
495
+ startDate: momentDay.format(this.data.dpConfig.format),
506
496
  endDate: null
507
497
  };
508
498
  this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
@@ -510,12 +500,12 @@ class TzDrpContainerComponent {
510
500
  return;
511
501
  }
512
502
  this.selectionStarted = false;
513
- this.localSelectedDatesRange = Object.assign(Object.assign({}, this.localSelectedDatesRange), { endDate: dayjsDay.format(this.data.dpConfig.format) });
503
+ this.localSelectedDatesRange = Object.assign(Object.assign({}, this.localSelectedDatesRange), { endDate: momentDay.format(this.data.dpConfig.format) });
514
504
  }
515
505
  else {
516
506
  this.selectionStarted = true;
517
507
  this.localSelectedDatesRange = {
518
- startDate: dayjs()
508
+ startDate: parseZone()
519
509
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
520
510
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
521
511
  .date(day.date)
@@ -533,7 +523,7 @@ class TzDrpContainerComponent {
533
523
  this.calculateDateRangeLength();
534
524
  }
535
525
  else {
536
- const currentSelection = dayjs()
526
+ const currentSelection = parseZone()
537
527
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
538
528
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
539
529
  .date(day.date).format(this.data.dpConfig.format);
@@ -587,9 +577,6 @@ class TzDrpContainerComponent {
587
577
  var _a, _b;
588
578
  this.formControl.setValue(event);
589
579
  this.singleDatePickerSelected = false;
590
- this.data.isSPickerSelected = false;
591
- this.data.isSPickerSelected = false;
592
- this.openElement = false;
593
580
  if (event === "Date Range") {
594
581
  this.openElement = false;
595
582
  this.data.isSPickerSelected = false;
@@ -609,10 +596,10 @@ class TzDrpContainerComponent {
609
596
  }
610
597
  calculateDateRangeLength() {
611
598
  if (this.localSelectedDatesRange) {
612
- const startDate = !!this.localSelectedDatesRange.startDate ? this.dayjsInstance(this.localSelectedDatesRange.startDate, this.data.dpConfig.format) : dayjs('invalid');
613
- const endDate = !!this.localSelectedDatesRange.endDate ? this.dayjsInstance(this.localSelectedDatesRange.endDate, this.data.dpConfig.format) : dayjs('invalid');
599
+ const startDate = this.parseZoneInstance(this.localSelectedDatesRange.startDate, this.data.dpConfig.format).toDate();
600
+ const endDate = this.parseZoneInstance(this.localSelectedDatesRange.endDate, this.data.dpConfig.format).toDate();
614
601
  if (startDate && endDate) {
615
- this.dateRangeLength = endDate.diff(startDate, 'day') + 1;
602
+ this.dateRangeLength = (endDate.getTime() - startDate.getTime()) / (1000 * 60 * 60 * 24) + 1;
616
603
  }
617
604
  }
618
605
  }
@@ -631,7 +618,7 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
631
618
  let _t;
632
619
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.singleDatePickerElement = _t.first);
633
620
  }
634
- }, 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) {
621
+ }, 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) {
635
622
  if (rf & 1) {
636
623
  i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
637
624
  i0.ɵɵtemplate(2, TzDrpContainerComponent_div_2_Template, 4, 4, "div", 2);
@@ -699,9 +686,9 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
699
686
  i0.ɵɵadvance(2);
700
687
  i0.ɵɵproperty("ngForOf", ctx.datePickerValue);
701
688
  i0.ɵɵadvance(1);
702
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(25, _c6, ctx.singleDatePickerSelected ? "none" : ""));
689
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(26, _c6, ctx.singleDatePickerSelected ? "none" : ""));
703
690
  i0.ɵɵadvance(4);
704
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(27, _c7, ctx.isPreviousMonthDisabled));
691
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(28, _c7, ctx.isPreviousMonthDisabled));
705
692
  i0.ɵɵadvance(4);
706
693
  i0.ɵɵtextInterpolate2(" ", ctx.currentMonth, " ", ctx.currentYearNumber, " ");
707
694
  i0.ɵɵadvance(4);
@@ -711,14 +698,16 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
711
698
  i0.ɵɵadvance(5);
712
699
  i0.ɵɵtextInterpolate2(" ", ctx.nextMonth, " ", ctx.nextYearNumber, " ");
713
700
  i0.ɵɵadvance(1);
714
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(29, _c7, ctx.isNextMonthDisabled));
701
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(30, _c7, ctx.isNextMonthDisabled));
715
702
  i0.ɵɵadvance(5);
716
703
  i0.ɵɵproperty("ngForOf", ctx.weekDays);
717
704
  i0.ɵɵadvance(2);
718
705
  i0.ɵɵproperty("ngForOf", ctx.nextMonthDates);
719
706
  i0.ɵɵadvance(4);
720
707
  i0.ɵɵproperty("ngForOf", ctx.data.weekOffs);
721
- i0.ɵɵadvance(5);
708
+ i0.ɵɵadvance(3);
709
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(32, _c8));
710
+ i0.ɵɵadvance(2);
722
711
  i0.ɵɵproperty("ngIf", ctx.data.isSPickerSelected);
723
712
  i0.ɵɵadvance(1);
724
713
  i0.ɵɵproperty("ngIf", !ctx.data.isSPickerSelected);
@@ -727,7 +716,7 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
727
716
  i0.ɵɵadvance(1);
728
717
  i0.ɵɵproperty("ngIf", !ctx.data.isSPickerSelected);
729
718
  i0.ɵɵadvance(1);
730
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(31, _c6, !ctx.singleDatePickerSelected ? "none" : "block"));
719
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(33, _c6, !ctx.singleDatePickerSelected ? "none" : "block"));
731
720
  i0.ɵɵadvance(1);
732
721
  i0.ɵɵproperty("dpConfig", ctx.data.dpConfig)("selectedDate", ctx.singleDateSelectedValue)("value", ctx.singleDateSelectedValue)("disableBoxShadow", true)("disableOverLay", true)("openElement", ctx.openElement);
733
722
  }
@@ -735,7 +724,7 @@ TzDrpContainerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzD
735
724
  (function () {
736
725
  (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TzDrpContainerComponent, [{
737
726
  type: Component,
738
- 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"] }]
727
+ 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"] }]
739
728
  }], function () {
740
729
  return [{ type: undefined, decorators: [{
741
730
  type: Inject,