ecabs-components 1.1.44 → 1.1.46

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 (13) hide show
  1. package/README.md +3 -1
  2. package/esm2022/lib/base/validators/date-range.validator.mjs +17 -0
  3. package/esm2022/lib/ecabs-date-picker/ecabs-date-picker.component.mjs +9 -4
  4. package/esm2022/lib/ecabs-date-range-picker/ecabs-date-range-picker.component.mjs +22 -6
  5. package/esm2022/lib/ecabs-date-range-picker/ecabs-date-range-picker.module.mjs +1 -1
  6. package/esm2022/lib/ecabs-dialog-confirm-deletion/ecabs-dialog-confirm-deletion.component.mjs +4 -4
  7. package/esm2022/lib/ecabs-radio-button-list/ecabs-radio-button-list.component.mjs +11 -6
  8. package/fesm2022/ecabs-components.mjs +53 -12
  9. package/fesm2022/ecabs-components.mjs.map +1 -1
  10. package/lib/base/validators/date-range.validator.d.ts +14 -0
  11. package/lib/ecabs-radio-button-list/ecabs-radio-button-list.component.d.ts +3 -1
  12. package/package.json +1 -1
  13. package/src/assets/styles/tailwind/index.scss +1 -1
package/fesm2022/ecabs-components.mjs CHANGED
@@ -45,7 +45,7 @@ import { MatDividerModule } from '@angular/material/divider';
45
45
  import * as i4$4 from '@angular/router';
46
46
  import { RouterModule, NavigationStart, RouterLink, RouterLinkActive } from '@angular/router';
47
47
  import * as i3$2 from '@angular/material/radio';
48
- import { MatRadioModule } from '@angular/material/radio';
48
+ import { MatRadioGroup, MatRadioModule } from '@angular/material/radio';
49
49
  import * as i3$3 from '@angular/material/expansion';
50
50
  import { MatExpansionPanel, MatExpansionModule } from '@angular/material/expansion';
51
51
  import * as i7$2 from '@angular/material/chips';
@@ -2218,11 +2218,16 @@ class EcabsDatePickerComponent extends EcabsElementBaseComponent {
2218
2218
  if (ngControl) {
2219
2219
  this.control = ngControl.control;
2220
2220
  }
2221
- this.datepicker?.openedStream.asObservable().pipe(takeUntil(this.unsubscribeService.subscription()))
2221
+ this.datepicker?.openedStream
2222
+ .asObservable()
2223
+ .pipe(takeUntil(this.unsubscribeService.subscription()))
2222
2224
  .subscribe(() => {
2223
2225
  setTimeout(() => {
2224
- const calendar = this.datepicker._componentRef?.instance._calendar;
2225
- calendar?._userSelection.asObservable().pipe(takeUntil(this.unsubscribeService.subscription()))
2226
+ const calendar = this.datepicker._componentRef?.instance
2227
+ ._calendar;
2228
+ calendar?._userSelection
2229
+ .asObservable()
2230
+ .pipe(takeUntil(this.unsubscribeService.subscription()))
2226
2231
  .subscribe((lastChosenDate) => {
2227
2232
  this.disabledApplyButton = !lastChosenDate.value;
2228
2233
  });
@@ -2940,6 +2945,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2940
2945
  type: Input
2941
2946
  }] } });
2942
2947
 
2948
+ const dateRangeValidator = (control) => {
2949
+ if (control.value) {
2950
+ const { dateFrom, dateTo } = control.value;
2951
+ control.setErrors(null);
2952
+ if (!dateFrom && dateTo) {
2953
+ return { dateFromRangeRequired: true };
2954
+ }
2955
+ if (dateFrom && !dateTo) {
2956
+ return { dateToRangeRequired: true };
2957
+ }
2958
+ if (dateFrom > dateTo) {
2959
+ return { dateFromMoreThanDateTo: true };
2960
+ }
2961
+ }
2962
+ return null;
2963
+ };
2964
+
2943
2965
  class EcabsDateRangePickerComponent extends EcabsElementBaseComponent {
2944
2966
  injector;
2945
2967
  ecabsDatePickerHeaderService;
@@ -3013,11 +3035,16 @@ class EcabsDateRangePickerComponent extends EcabsElementBaseComponent {
3013
3035
  this.dateTo = this.value.dateTo;
3014
3036
  });
3015
3037
  }
3016
- this.datepicker?.openedStream.asObservable().pipe(takeUntil(this.unsubscribeService.subscription()))
3038
+ this.datepicker?.openedStream
3039
+ .asObservable()
3040
+ .pipe(takeUntil(this.unsubscribeService.subscription()))
3017
3041
  .subscribe(() => {
3018
3042
  setTimeout(() => {
3019
- const calendar = this.datepicker._componentRef?.instance._calendar;
3020
- calendar?._userSelection.asObservable().pipe(takeUntil(this.unsubscribeService.subscription()))
3043
+ const calendar = this.datepicker._componentRef?.instance
3044
+ ._calendar;
3045
+ calendar?._userSelection
3046
+ .asObservable()
3047
+ .pipe(takeUntil(this.unsubscribeService.subscription()))
3021
3048
  .subscribe((lastChosenDate) => {
3022
3049
  let startRange;
3023
3050
  let endRange;
@@ -3031,7 +3058,7 @@ class EcabsDateRangePickerComponent extends EcabsElementBaseComponent {
3031
3058
  if (start > lastChosenDate.value) {
3032
3059
  startRange = lastChosenDate.value;
3033
3060
  }
3034
- else if (lastChosenDate.value && (start && !end)) {
3061
+ else if (lastChosenDate.value && start && !end) {
3035
3062
  endRange = lastChosenDate.value;
3036
3063
  }
3037
3064
  this.disabledApplyButton = !(startRange && endRange);
@@ -3066,6 +3093,11 @@ class EcabsDateRangePickerComponent extends EcabsElementBaseComponent {
3066
3093
  useExisting: EcabsDateRangePickerComponent,
3067
3094
  multi: true,
3068
3095
  },
3096
+ {
3097
+ provide: NG_VALIDATORS,
3098
+ useValue: dateRangeValidator,
3099
+ multi: true,
3100
+ },
3069
3101
  UnsubscribeService,
3070
3102
  ], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["picker"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <mat-date-range-input \r\n [rangePicker]=\"picker\" \r\n [min]=\"minDate\"\r\n [max]=\"maxDate\" \r\n (blur)=\"onTouch()\">\r\n <input matStartDate class=\"form-field__input\" [placeholder]=\"startDatePlaceholder ?? translationConfig?.startDatePlaceholder\" [value]=\"dateFrom\" [(ngModel)]=\"dateFrom\" />\r\n <input matEndDate class=\"form-field__input\" [placeholder]=\"endDatePlaceholder ?? translationConfig?.endDatePlaceholder\" [value]=\"dateTo\" [(ngModel)]=\"dateTo\" />\r\n </mat-date-range-input>\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\r\n <mat-icon matDatepickerToggleIcon class=\"text-gray-500\">calendar_today</mat-icon>\r\n </mat-datepicker-toggle>\r\n <mat-date-range-picker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <ecabs-date-picker-actions [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n [isDateRange]=\"true\"\r\n [disabledApplyButton]=\"disabledApplyButton\"\r\n (apply)=\"onApply()\">\r\n </ecabs-date-picker-actions>\r\n </mat-datepicker-actions>\r\n </mat-date-range-picker>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [".header{display:flex;align-items:center;padding:.5em}.datepicker-ui__toggle.mat-mdc-icon-button.mat-mdc-button-base,.mat-mdc-icon-button.mat-mdc-button-base.mat-datepicker-toggle{padding:0;width:2.5rem;height:2.5rem;line-height:2}.header-label{flex:1;height:1em;font-weight:500;text-align:center}.select-date-label{color:var(--color-brand-dark);padding-top:1.6rem;padding-left:1.6rem}.mat-calendar-table .mat-calendar-body tr:first-child[aria-hidden=true]{display:none}.mat-calendar-body-label{visibility:hidden}.mat-calendar-body-cell-content{border-radius:.25rem!important}.mat-calendar-body-active .mat-calendar-body-today{color:var(--color-brand-light)!important;background-color:var(--color-brand-light2)!important}.mat-calendar{align-self:center}.mat-calendar .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:var(--color-brand-light2);color:var(--color-black)}.mat-calendar .mat-calendar-body-cell.mat-calendar-body-active .mat-calendar-body-cell-content.mat-calendar-body-selected,.mat-calendar .mat-calendar-body-cell.mat-calendar-body-active:hover .mat-calendar-body-cell-content.mat-calendar-body-selected{background-color:var(--color-brand-light)!important;color:var(--color-white)!important}.mat-calendar .mat-calendar-body-selected{background-color:var(--color-brand-light);color:var(--color-white)!important}.mat-calendar .mat-calendar-body-selected .mat-calendar-body-today{color:var(--color-white)!important}.mat-calendar .mat-calendar-table-header,.mat-calendar .mat-calendar-body-label{color:var(--color-gray-500)}.mat-calendar .mat-calendar-body-cell>.mat-calendar-body-today{opacity:1}.mat-calendar .mat-calendar-body-cell-content,.mat-calendar .mat-date-range-input-separator{color:var(--color-black)}.mat-calendar .mat-calendar-content{padding:0 1.6rem}.mat-calendar .mat-calendar-table-header th{font-size:16px;font-size:1rem}.mat-calendar .mat-calendar-table-header-divider:after{display:none}.mat-calendar .mat-calendar-body{font-size:16px;font-size:1rem}.mat-calendar .mat-calendar-body-in-range:before{background-color:var(--color-brand-light2)}.mat-calendar .mat-calendar-body-in-range .mat-calendar-body-cell-content{color:var(--color-black)!important}.mat-calendar .mat-calendar-body-range-start .mat-calendar-body-cell-content,.mat-calendar .mat-calendar-body-range-end .mat-calendar-body-cell-content{color:var(--color-white)!important}.mat-datepicker-popup .mat-datepicker-content{color:var(--color-black);box-shadow:0 0 25px #0003}.mat-datepicker-popup .mat-datepicker-actions{display:unset;margin-top:1rem;padding:0 1.6rem 1.6rem}.mat-datepicker-popup .mat-datepicker-actions .mat-button-base+.mat-button-base{margin-left:unset}.mat-datepicker-popup .mat-datepicker-actions button.mat-button-base{min-width:100%}.mat-datepicker-popup .mat-calendar-body-disabled>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){color:var(--color-gray-300)}.datepicker-ui__toggle,.mat-datepicker-toggle{position:absolute!important;right:0;line-height:1.25;padding:0}.datepicker-ui__toggle mat-icon,.mat-datepicker-toggle mat-icon{color:var(--color-gray-500)}ecabs-date-picker .dateTimeWrapper{position:relative;display:flex;width:100%}ecabs-date-picker .dateTimeWrapper .datePart{flex:2}ecabs-date-picker .dateTimeWrapper .timePart{flex:1;padding-left:10px;vertical-align:top;max-width:10rem}ecabs-date-picker .dateTimeWrapper .timePart ecabs-timepicker .timeInputWrapper{display:block}ecabs-date-picker .dateTimeWrapper .timePart ecabs-timepicker{width:100%}ecabs-date-picker .dateTimeWrapper .timePart ecabs-timepicker .inputWrapper{display:block}ecabs-date-picker .dateTimeWrapper .dateInputWrapper{position:relative}ecabs-date-picker .dateTimeWrapper input{min-height:42px;width:100%;display:block;box-sizing:border-box;font-size:14px;font-weight:500;padding-left:10px;border-radius:4px;border:1px solid rgb(107,109,115);outline:none;transition:all .3s ease-in-out}ecabs-date-picker .dateTimeWrapper input:disabled{border-bottom-width:1px;background-color:var(--color-white-opacity-05)}ecabs-date-picker .dateTimeWrapper input[type=date]::-webkit-calendar-picker-indicator,ecabs-date-picker .dateTimeWrapper input[type=date]::-webkit-inner-spin-button{display:none}ecabs-date-picker .dateTimeWrapper input[type=date]::-webkit-clear-button{display:none}ecabs-date-picker .dateTimeWrapper .calendar-icon{float:right;margin-top:-38px;padding:5px 10px 5px 5px;display:block;font-size:13px;line-height:20px;color:var(--color-gray-500);position:relative;width:40px;height:30px;cursor:pointer;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI1LjQuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0OCA0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDggNDg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojNkI2RDczO30KPC9zdHlsZT4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTksNDRjLTAuOCwwLTEuNS0wLjMtMi4xLTAuOUM2LjMsNDIuNSw2LDQxLjgsNiw0MVYxMGMwLTAuOCwwLjMtMS41LDAuOS0yLjFTOC4yLDcsOSw3aDMuMlY0aDMuMnYzaDE3VjRoMy4ydjMKCUgzOWMwLjgsMCwxLjUsMC4zLDIuMSwwLjlDNDEuNyw4LjUsNDIsOS4yLDQyLDEwdjMxYzAsMC44LTAuMywxLjUtMC45LDIuMUM0MC41LDQzLjcsMzkuOCw0NCwzOSw0NEg5eiBNOSw0MWgzMGwwLDBsMCwwVjE5LjVIOVY0MQoJTDksNDFMOSw0MXogTTksMTYuNWgzMFYxMGwwLDBsMCwwSDlsMCwwbDAsMFYxNi41eiBNOSwxNi41VjEwbDAsMGwwLDBsMCwwbDAsMFYxNi41eiIvPgo8L3N2Zz4K);background-position:center center;background-repeat:no-repeat;background-size:1.375rem}ecabs-date-picker .dateTimeWrapper .calendar-icon.disabled{cursor:not-allowed}ecabs-date-picker .ecabs-element-wrapper.focused label{color:#376bfb}ecabs-date-picker .ecabs-element-wrapper.focused input{border-bottom-width:2px;border-bottom-color:#376bfb}ecabs-date-picker .ecabs-element-wrapper.validationError label{color:#ff4c4c}ecabs-date-picker .ecabs-element-wrapper.validationError input{border-bottom-color:#ff4c4c;border-bottom-width:2px}.ng-mydp .myDpSelector{border:0;padding:0;box-shadow:0 4px 6px #162a4c14,0 2px 16px #162a4c0f,0 8px 12px #162a4c0a;border-radius:0 0 4px 4px;background:#fff}.ng-mydp .myDpSelector:focus{box-shadow:0 4px 6px #162a4c14,0 2px 16px #162a4c0f,0 8px 12px #162a4c0a}.ng-mydp .myDpSelector .myDpWeekDayTitle{background-color:#fff;font-weight:500;font-size:11px;color:#162a4cb3}.ng-mydp .myDpSelector .myDpNextBtn{margin-left:auto;margin-right:16px}.ng-mydp .myDpSelector .myDpNextBtn .myDpIconRightArrow{line-height:26px;height:25px}.ng-mydp .myDpSelector .myDpNextBtn .myDpIconRightArrow:before{color:#376bfb;font-size:13px}.ng-mydp .myDpSelector .myDpPrevBtn{margin-left:16px}.ng-mydp .myDpSelector .myDpPrevBtn .myDpIconLeftArrow{line-height:26px;height:25px}.ng-mydp .myDpSelector .myDpPrevBtn .myDpIconLeftArrow:before{color:#376bfb;font-size:13px}.ng-mydp .myDpSelector .myDpMonthYearSelBar{height:52px;padding-top:10px;border:0}.ng-mydp .myDpSelector .myDpMonthYearText button{font-weight:500;font-size:13px;line-height:20px;color:#376bfb}.ng-mydp .myDpSelector .myDpMonthYearText .myDpMonthBtn{padding-right:7px;position:relative;margin-right:15px}.ng-mydp .myDpSelector .myDpMonthYearText .myDpMonthBtn:after{position:absolute;content:\"\";height:14px;width:1px;right:-7px;top:6px;background:#162a4c80}.ng-mydp .myDpSelector .myDpMonthYearText .myDpYearBtn{padding-left:6px}.ng-mydp .myDpSelector .myDpCalTable{height:calc(100% - 54px);width:calc(100% - 20px);margin:0 10px}.ng-mydp .myDpSelector table.myDpCalTable td .myDpDayValue{border-radius:4px;background:#f0f2f5;display:inline-block;box-sizing:border-box;width:32px;height:28px;font-size:13px;line-height:28px;text-align:center;color:#162a4ce6}.ng-mydp .myDpSelector table.myDpCalTable td .myDpDayValue.myDpMarkCurrDay{border-bottom:0;color:#376bfb}.ng-mydp .myDpSelector table.myDpCalTable td.myDpSelectedDay .myDpDayValue{color:#fff!important;background:#6ab72a!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDisabled{background:unset}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDisabled .myDpDayValue{background:unset!important;color:#162a4c80;cursor:not-allowed}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDisabled .myDpDayValue:hover{background:unset!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpRangeColor{background-color:#fff}.ng-mydp .myDpSelector table.myDpCalTable td.myDpRangeColor .myDpDayValue{background:#bee39d!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpRangeColor.myDpSelectedDay .myDpDayValue{color:#fff!important;background:#6ab72a!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDaycell:focus{box-shadow:unset;outline:unset}.ng-mydp .myDpSelector table.myDpCalTable td.myDpPrevMonth .myDpDayValue,.ng-mydp .myDpSelector table.myDpCalTable td.myDpNextMonth .myDpDayValue{background:#f6f7f9;color:#162a4c80}.ng-mydp .myDpSelector table.myDpCalTable td .myDpDimDay{opacity:1}.ng-mydp .myDpSelector table.myDpCalTable .myDpTableSingleDay:hover{background-color:#fff}.ng-mydp .myDpSelector table.myDpCalTable .myDpTableSingleDay:hover .myDpDayValue{background:#bee39d;color:#162a4ce6}.ng-mydp .myDpSelector table.myDpCalTable .myDpSelectedDay,.ng-mydp .myDpSelector table.myDpCalTable .myDpSelectedMonth,.ng-mydp .myDpSelector table.myDpCalTable .myDpSelectedYear{background-color:#fff;border-radius:0}.ng-mydp .myDpSelector .myDpMonthTable{height:128px;width:calc(100% - 20px);margin:0 10px}.ng-mydp .myDpSelector .myDpMonthTable td .myDpMonthValue{display:inline-block;height:28px;width:80px;background:#f0f2f5;vertical-align:middle;text-align:center;line-height:28px;font-weight:400;font-size:13px;color:#162a4ce6;border-radius:4px}.ng-mydp .myDpSelector .myDpMonthTable td .myDpMonthValue.myDpMarkCurrMonth{border:0;color:#376bfb}.ng-mydp .myDpSelector .myDpMonthTable td .myDpMonthValue:hover{background:#bee39d}.ng-mydp .myDpSelector .myDpMonthTable td.myDpDisabled{background:unset}.ng-mydp .myDpSelector .myDpMonthTable td.myDpDisabled .myDpMonthValue{background:unset!important;color:#162a4c80!important;cursor:not-allowed}.ng-mydp .myDpSelector .myDpMonthTable td.myDpSelectedMonth{background-color:#fff}.ng-mydp .myDpSelector .myDpMonthTable td.myDpSelectedMonth .myDpMonthValue{background:#6ab72a!important;color:#fff!important}.ng-mydp .myDpSelector .myDpMonthTable td.myDpTableSingleMonth:hover{background-color:#fff}.ng-mydp .myDpSelector .myDpYearTable{height:160px;width:calc(100% - 20px);margin:0 10px}.ng-mydp .myDpSelector .myDpYearTable td .myDpYearValue{display:inline-block;height:28px;width:46px;background:#f0f2f5;vertical-align:middle;text-align:center;line-height:28px;font-weight:400;font-size:13px;color:#162a4ce6;border-radius:4px}.ng-mydp .myDpSelector .myDpYearTable td .myDpYearValue.myDpMarkCurrYear{border:0;color:#376bfb}.ng-mydp .myDpSelector .myDpYearTable td .myDpYearValue:hover{background:#bee39d}.ng-mydp .myDpSelector .myDpYearTable td.myDpDisabled{background:unset}.ng-mydp .myDpSelector .myDpYearTable td.myDpDisabled .myDpYearValue{background:unset!important;color:#162a4c80!important;cursor:not-allowed}.ng-mydp .myDpSelector .myDpYearTable td.myDpSelectedYear{background-color:#fff}.ng-mydp .myDpSelector .myDpYearTable td.myDpSelectedYear .myDpYearValue{background:#6ab72a!important;color:#fff!important}.ng-mydp .myDpSelector .myDpYearTable td.myDpTableSingleYear:hover{background-color:#fff}.ng-mydp .myDpSelectorArrow{height:272px!important;width:268px!important;margin-top:-12px}.ng-mydp .myDpSelectorArrow:after{display:none}.ng-mydp .myDpSelectorArrow:before{display:none}:root{--color-black: #07080d;--color-white: #ffffff;--color-white-opacity-05: rgba(0, 0, 0, .05);--color-gray-100: #f5f6f9;--color-gray-200: #f8f9f9;--color-gray-300: #d9d9d9;--color-gray-400: #a6a6a6;--color-gray-500: #6b6d73;--color-brand-dark: #193273;--color-brand-dark-rgb: 25, 50, 115;--color-brand-light: #325FDA;--color-brand-light2: #e7efff;--color-brand-light-rgb: 50, 95, 218;--color-brand-300: #e7efff;--color-brand-300-rgb: 231, 239, 255;--color-error: #df3838;--color-error-opacity: #fbe4e4;--color-error-rgb: 223, 56, 56;--color-notification: #f4d04f;--color-notification-rgb: 244, 208, 79;--color-warn: #f2994a;--color-warn-rgb: 242, 153, 74;--color-info: #325fda;--color-info-rgb: 50, 95, 218;--color-warning: #f2994a;--color-warning-opacity: #fdf0e4;--color-success: #25bd3d;--color-success--opacity: #e8f8e5;--color-success-rgb: 37, 189, 61;--color-allocation-started: #E8F8E5;--color-allocation-scheduled: #FDF0E4;--color-allocation-ended: #FBE4E4;--color-allocation-sick: #E7EFFF;--color-allocation-no-show: #EAE5FF;--color-allocation-unavailable: #F2F2F2;--cropper-outline-color: rgba(0, 0, 0, .5)}.mat-date-range-input{display:block;width:100%;padding:.5rem 1rem;border-radius:.25rem;border:1px solid var(--color-gray-500);color:var(--color-black);line-height:1.5}:host ::ng-deep .mat-mdc-icon-button{max-width:2.5rem;max-height:2.5rem}\n"], dependencies: [{ kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i6$1.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i6$1.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i6$1.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i6$1.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i6$1.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i6$1.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel", "isDateRange", "disabledApplyButton"], outputs: ["apply"] }] });
3071
3103
  }
@@ -3077,6 +3109,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3077
3109
  useExisting: EcabsDateRangePickerComponent,
3078
3110
  multi: true,
3079
3111
  },
3112
+ {
3113
+ provide: NG_VALIDATORS,
3114
+ useValue: dateRangeValidator,
3115
+ multi: true,
3116
+ },
3080
3117
  UnsubscribeService,
3081
3118
  ], template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <mat-date-range-input \r\n [rangePicker]=\"picker\" \r\n [min]=\"minDate\"\r\n [max]=\"maxDate\" \r\n (blur)=\"onTouch()\">\r\n <input matStartDate class=\"form-field__input\" [placeholder]=\"startDatePlaceholder ?? translationConfig?.startDatePlaceholder\" [value]=\"dateFrom\" [(ngModel)]=\"dateFrom\" />\r\n <input matEndDate class=\"form-field__input\" [placeholder]=\"endDatePlaceholder ?? translationConfig?.endDatePlaceholder\" [value]=\"dateTo\" [(ngModel)]=\"dateTo\" />\r\n </mat-date-range-input>\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\r\n <mat-icon matDatepickerToggleIcon class=\"text-gray-500\">calendar_today</mat-icon>\r\n </mat-datepicker-toggle>\r\n <mat-date-range-picker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <ecabs-date-picker-actions [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n [isDateRange]=\"true\"\r\n [disabledApplyButton]=\"disabledApplyButton\"\r\n (apply)=\"onApply()\">\r\n </ecabs-date-picker-actions>\r\n </mat-datepicker-actions>\r\n </mat-date-range-picker>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [".header{display:flex;align-items:center;padding:.5em}.datepicker-ui__toggle.mat-mdc-icon-button.mat-mdc-button-base,.mat-mdc-icon-button.mat-mdc-button-base.mat-datepicker-toggle{padding:0;width:2.5rem;height:2.5rem;line-height:2}.header-label{flex:1;height:1em;font-weight:500;text-align:center}.select-date-label{color:var(--color-brand-dark);padding-top:1.6rem;padding-left:1.6rem}.mat-calendar-table .mat-calendar-body tr:first-child[aria-hidden=true]{display:none}.mat-calendar-body-label{visibility:hidden}.mat-calendar-body-cell-content{border-radius:.25rem!important}.mat-calendar-body-active .mat-calendar-body-today{color:var(--color-brand-light)!important;background-color:var(--color-brand-light2)!important}.mat-calendar{align-self:center}.mat-calendar .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:var(--color-brand-light2);color:var(--color-black)}.mat-calendar .mat-calendar-body-cell.mat-calendar-body-active .mat-calendar-body-cell-content.mat-calendar-body-selected,.mat-calendar .mat-calendar-body-cell.mat-calendar-body-active:hover .mat-calendar-body-cell-content.mat-calendar-body-selected{background-color:var(--color-brand-light)!important;color:var(--color-white)!important}.mat-calendar .mat-calendar-body-selected{background-color:var(--color-brand-light);color:var(--color-white)!important}.mat-calendar .mat-calendar-body-selected .mat-calendar-body-today{color:var(--color-white)!important}.mat-calendar .mat-calendar-table-header,.mat-calendar .mat-calendar-body-label{color:var(--color-gray-500)}.mat-calendar .mat-calendar-body-cell>.mat-calendar-body-today{opacity:1}.mat-calendar .mat-calendar-body-cell-content,.mat-calendar .mat-date-range-input-separator{color:var(--color-black)}.mat-calendar .mat-calendar-content{padding:0 1.6rem}.mat-calendar .mat-calendar-table-header th{font-size:16px;font-size:1rem}.mat-calendar .mat-calendar-table-header-divider:after{display:none}.mat-calendar .mat-calendar-body{font-size:16px;font-size:1rem}.mat-calendar .mat-calendar-body-in-range:before{background-color:var(--color-brand-light2)}.mat-calendar .mat-calendar-body-in-range .mat-calendar-body-cell-content{color:var(--color-black)!important}.mat-calendar .mat-calendar-body-range-start .mat-calendar-body-cell-content,.mat-calendar .mat-calendar-body-range-end .mat-calendar-body-cell-content{color:var(--color-white)!important}.mat-datepicker-popup .mat-datepicker-content{color:var(--color-black);box-shadow:0 0 25px #0003}.mat-datepicker-popup .mat-datepicker-actions{display:unset;margin-top:1rem;padding:0 1.6rem 1.6rem}.mat-datepicker-popup .mat-datepicker-actions .mat-button-base+.mat-button-base{margin-left:unset}.mat-datepicker-popup .mat-datepicker-actions button.mat-button-base{min-width:100%}.mat-datepicker-popup .mat-calendar-body-disabled>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){color:var(--color-gray-300)}.datepicker-ui__toggle,.mat-datepicker-toggle{position:absolute!important;right:0;line-height:1.25;padding:0}.datepicker-ui__toggle mat-icon,.mat-datepicker-toggle mat-icon{color:var(--color-gray-500)}ecabs-date-picker .dateTimeWrapper{position:relative;display:flex;width:100%}ecabs-date-picker .dateTimeWrapper .datePart{flex:2}ecabs-date-picker .dateTimeWrapper .timePart{flex:1;padding-left:10px;vertical-align:top;max-width:10rem}ecabs-date-picker .dateTimeWrapper .timePart ecabs-timepicker .timeInputWrapper{display:block}ecabs-date-picker .dateTimeWrapper .timePart ecabs-timepicker{width:100%}ecabs-date-picker .dateTimeWrapper .timePart ecabs-timepicker .inputWrapper{display:block}ecabs-date-picker .dateTimeWrapper .dateInputWrapper{position:relative}ecabs-date-picker .dateTimeWrapper input{min-height:42px;width:100%;display:block;box-sizing:border-box;font-size:14px;font-weight:500;padding-left:10px;border-radius:4px;border:1px solid rgb(107,109,115);outline:none;transition:all .3s ease-in-out}ecabs-date-picker .dateTimeWrapper input:disabled{border-bottom-width:1px;background-color:var(--color-white-opacity-05)}ecabs-date-picker .dateTimeWrapper input[type=date]::-webkit-calendar-picker-indicator,ecabs-date-picker .dateTimeWrapper input[type=date]::-webkit-inner-spin-button{display:none}ecabs-date-picker .dateTimeWrapper input[type=date]::-webkit-clear-button{display:none}ecabs-date-picker .dateTimeWrapper .calendar-icon{float:right;margin-top:-38px;padding:5px 10px 5px 5px;display:block;font-size:13px;line-height:20px;color:var(--color-gray-500);position:relative;width:40px;height:30px;cursor:pointer;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI1LjQuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0OCA0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDggNDg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojNkI2RDczO30KPC9zdHlsZT4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTksNDRjLTAuOCwwLTEuNS0wLjMtMi4xLTAuOUM2LjMsNDIuNSw2LDQxLjgsNiw0MVYxMGMwLTAuOCwwLjMtMS41LDAuOS0yLjFTOC4yLDcsOSw3aDMuMlY0aDMuMnYzaDE3VjRoMy4ydjMKCUgzOWMwLjgsMCwxLjUsMC4zLDIuMSwwLjlDNDEuNyw4LjUsNDIsOS4yLDQyLDEwdjMxYzAsMC44LTAuMywxLjUtMC45LDIuMUM0MC41LDQzLjcsMzkuOCw0NCwzOSw0NEg5eiBNOSw0MWgzMGwwLDBsMCwwVjE5LjVIOVY0MQoJTDksNDFMOSw0MXogTTksMTYuNWgzMFYxMGwwLDBsMCwwSDlsMCwwbDAsMFYxNi41eiBNOSwxNi41VjEwbDAsMGwwLDBsMCwwbDAsMFYxNi41eiIvPgo8L3N2Zz4K);background-position:center center;background-repeat:no-repeat;background-size:1.375rem}ecabs-date-picker .dateTimeWrapper .calendar-icon.disabled{cursor:not-allowed}ecabs-date-picker .ecabs-element-wrapper.focused label{color:#376bfb}ecabs-date-picker .ecabs-element-wrapper.focused input{border-bottom-width:2px;border-bottom-color:#376bfb}ecabs-date-picker .ecabs-element-wrapper.validationError label{color:#ff4c4c}ecabs-date-picker .ecabs-element-wrapper.validationError input{border-bottom-color:#ff4c4c;border-bottom-width:2px}.ng-mydp .myDpSelector{border:0;padding:0;box-shadow:0 4px 6px #162a4c14,0 2px 16px #162a4c0f,0 8px 12px #162a4c0a;border-radius:0 0 4px 4px;background:#fff}.ng-mydp .myDpSelector:focus{box-shadow:0 4px 6px #162a4c14,0 2px 16px #162a4c0f,0 8px 12px #162a4c0a}.ng-mydp .myDpSelector .myDpWeekDayTitle{background-color:#fff;font-weight:500;font-size:11px;color:#162a4cb3}.ng-mydp .myDpSelector .myDpNextBtn{margin-left:auto;margin-right:16px}.ng-mydp .myDpSelector .myDpNextBtn .myDpIconRightArrow{line-height:26px;height:25px}.ng-mydp .myDpSelector .myDpNextBtn .myDpIconRightArrow:before{color:#376bfb;font-size:13px}.ng-mydp .myDpSelector .myDpPrevBtn{margin-left:16px}.ng-mydp .myDpSelector .myDpPrevBtn .myDpIconLeftArrow{line-height:26px;height:25px}.ng-mydp .myDpSelector .myDpPrevBtn .myDpIconLeftArrow:before{color:#376bfb;font-size:13px}.ng-mydp .myDpSelector .myDpMonthYearSelBar{height:52px;padding-top:10px;border:0}.ng-mydp .myDpSelector .myDpMonthYearText button{font-weight:500;font-size:13px;line-height:20px;color:#376bfb}.ng-mydp .myDpSelector .myDpMonthYearText .myDpMonthBtn{padding-right:7px;position:relative;margin-right:15px}.ng-mydp .myDpSelector .myDpMonthYearText .myDpMonthBtn:after{position:absolute;content:\"\";height:14px;width:1px;right:-7px;top:6px;background:#162a4c80}.ng-mydp .myDpSelector .myDpMonthYearText .myDpYearBtn{padding-left:6px}.ng-mydp .myDpSelector .myDpCalTable{height:calc(100% - 54px);width:calc(100% - 20px);margin:0 10px}.ng-mydp .myDpSelector table.myDpCalTable td .myDpDayValue{border-radius:4px;background:#f0f2f5;display:inline-block;box-sizing:border-box;width:32px;height:28px;font-size:13px;line-height:28px;text-align:center;color:#162a4ce6}.ng-mydp .myDpSelector table.myDpCalTable td .myDpDayValue.myDpMarkCurrDay{border-bottom:0;color:#376bfb}.ng-mydp .myDpSelector table.myDpCalTable td.myDpSelectedDay .myDpDayValue{color:#fff!important;background:#6ab72a!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDisabled{background:unset}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDisabled .myDpDayValue{background:unset!important;color:#162a4c80;cursor:not-allowed}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDisabled .myDpDayValue:hover{background:unset!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpRangeColor{background-color:#fff}.ng-mydp .myDpSelector table.myDpCalTable td.myDpRangeColor .myDpDayValue{background:#bee39d!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpRangeColor.myDpSelectedDay .myDpDayValue{color:#fff!important;background:#6ab72a!important}.ng-mydp .myDpSelector table.myDpCalTable td.myDpDaycell:focus{box-shadow:unset;outline:unset}.ng-mydp .myDpSelector table.myDpCalTable td.myDpPrevMonth .myDpDayValue,.ng-mydp .myDpSelector table.myDpCalTable td.myDpNextMonth .myDpDayValue{background:#f6f7f9;color:#162a4c80}.ng-mydp .myDpSelector table.myDpCalTable td .myDpDimDay{opacity:1}.ng-mydp .myDpSelector table.myDpCalTable .myDpTableSingleDay:hover{background-color:#fff}.ng-mydp .myDpSelector table.myDpCalTable .myDpTableSingleDay:hover .myDpDayValue{background:#bee39d;color:#162a4ce6}.ng-mydp .myDpSelector table.myDpCalTable .myDpSelectedDay,.ng-mydp .myDpSelector table.myDpCalTable .myDpSelectedMonth,.ng-mydp .myDpSelector table.myDpCalTable .myDpSelectedYear{background-color:#fff;border-radius:0}.ng-mydp .myDpSelector .myDpMonthTable{height:128px;width:calc(100% - 20px);margin:0 10px}.ng-mydp .myDpSelector .myDpMonthTable td .myDpMonthValue{display:inline-block;height:28px;width:80px;background:#f0f2f5;vertical-align:middle;text-align:center;line-height:28px;font-weight:400;font-size:13px;color:#162a4ce6;border-radius:4px}.ng-mydp .myDpSelector .myDpMonthTable td .myDpMonthValue.myDpMarkCurrMonth{border:0;color:#376bfb}.ng-mydp .myDpSelector .myDpMonthTable td .myDpMonthValue:hover{background:#bee39d}.ng-mydp .myDpSelector .myDpMonthTable td.myDpDisabled{background:unset}.ng-mydp .myDpSelector .myDpMonthTable td.myDpDisabled .myDpMonthValue{background:unset!important;color:#162a4c80!important;cursor:not-allowed}.ng-mydp .myDpSelector .myDpMonthTable td.myDpSelectedMonth{background-color:#fff}.ng-mydp .myDpSelector .myDpMonthTable td.myDpSelectedMonth .myDpMonthValue{background:#6ab72a!important;color:#fff!important}.ng-mydp .myDpSelector .myDpMonthTable td.myDpTableSingleMonth:hover{background-color:#fff}.ng-mydp .myDpSelector .myDpYearTable{height:160px;width:calc(100% - 20px);margin:0 10px}.ng-mydp .myDpSelector .myDpYearTable td .myDpYearValue{display:inline-block;height:28px;width:46px;background:#f0f2f5;vertical-align:middle;text-align:center;line-height:28px;font-weight:400;font-size:13px;color:#162a4ce6;border-radius:4px}.ng-mydp .myDpSelector .myDpYearTable td .myDpYearValue.myDpMarkCurrYear{border:0;color:#376bfb}.ng-mydp .myDpSelector .myDpYearTable td .myDpYearValue:hover{background:#bee39d}.ng-mydp .myDpSelector .myDpYearTable td.myDpDisabled{background:unset}.ng-mydp .myDpSelector .myDpYearTable td.myDpDisabled .myDpYearValue{background:unset!important;color:#162a4c80!important;cursor:not-allowed}.ng-mydp .myDpSelector .myDpYearTable td.myDpSelectedYear{background-color:#fff}.ng-mydp .myDpSelector .myDpYearTable td.myDpSelectedYear .myDpYearValue{background:#6ab72a!important;color:#fff!important}.ng-mydp .myDpSelector .myDpYearTable td.myDpTableSingleYear:hover{background-color:#fff}.ng-mydp .myDpSelectorArrow{height:272px!important;width:268px!important;margin-top:-12px}.ng-mydp .myDpSelectorArrow:after{display:none}.ng-mydp .myDpSelectorArrow:before{display:none}:root{--color-black: #07080d;--color-white: #ffffff;--color-white-opacity-05: rgba(0, 0, 0, .05);--color-gray-100: #f5f6f9;--color-gray-200: #f8f9f9;--color-gray-300: #d9d9d9;--color-gray-400: #a6a6a6;--color-gray-500: #6b6d73;--color-brand-dark: #193273;--color-brand-dark-rgb: 25, 50, 115;--color-brand-light: #325FDA;--color-brand-light2: #e7efff;--color-brand-light-rgb: 50, 95, 218;--color-brand-300: #e7efff;--color-brand-300-rgb: 231, 239, 255;--color-error: #df3838;--color-error-opacity: #fbe4e4;--color-error-rgb: 223, 56, 56;--color-notification: #f4d04f;--color-notification-rgb: 244, 208, 79;--color-warn: #f2994a;--color-warn-rgb: 242, 153, 74;--color-info: #325fda;--color-info-rgb: 50, 95, 218;--color-warning: #f2994a;--color-warning-opacity: #fdf0e4;--color-success: #25bd3d;--color-success--opacity: #e8f8e5;--color-success-rgb: 37, 189, 61;--color-allocation-started: #E8F8E5;--color-allocation-scheduled: #FDF0E4;--color-allocation-ended: #FBE4E4;--color-allocation-sick: #E7EFFF;--color-allocation-no-show: #EAE5FF;--color-allocation-unavailable: #F2F2F2;--cropper-outline-color: rgba(0, 0, 0, .5)}.mat-date-range-input{display:block;width:100%;padding:.5rem 1rem;border-radius:.25rem;border:1px solid var(--color-gray-500);color:var(--color-black);line-height:1.5}:host ::ng-deep .mat-mdc-icon-button{max-width:2.5rem;max-height:2.5rem}\n"] }]
3082
3119
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: EcabsDatePickerHeaderService }, { type: UnsubscribeService }]; }, propDecorators: { minDate: [{
@@ -4917,6 +4954,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
4917
4954
 
4918
4955
  class EcabsRadioButtonListComponent extends EcabsElementBaseComponent {
4919
4956
  injector;
4957
+ matRadioGroup;
4920
4958
  items;
4921
4959
  direction = 'horizontal';
4922
4960
  changed = new EventEmitter();
@@ -4959,7 +4997,7 @@ class EcabsRadioButtonListComponent extends EcabsElementBaseComponent {
4959
4997
  useExisting: EcabsRadioButtonListComponent,
4960
4998
  multi: true,
4961
4999
  },
4962
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <mat-radio-group\r\n [ngClass]=\"{ 'flex flex-col my-1': direction === 'vertical' }\"\r\n [(ngModel)]=\"value\"\r\n [disabled]=\"disabled\"\r\n [id]=\"name\"\r\n (change)=\"changed.emit($event.value)\"\r\n >\r\n <mat-radio-button\r\n [disabled]=\"item.disabled\"\r\n [ngClass]=\"{ 'my-1': direction === 'vertical' }\"\r\n class=\"mr-4\"\r\n *ngFor=\"let item of items\"\r\n [value]=\"item.value\"\r\n >\r\n {{ item.label }}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n</ecabs-element-wrapper>\r\n", styles: [".mr-4{margin-right:1rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.flex{display:flex}.flex-col{flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i3$2.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$2.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
5000
+ ], viewQueries: [{ propertyName: "matRadioGroup", first: true, predicate: MatRadioGroup, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <mat-radio-group\r\n [ngClass]=\"{ 'flex flex-col my-1': direction === 'vertical' }\"\r\n [(ngModel)]=\"value\"\r\n [disabled]=\"disabled\"\r\n [id]=\"name\"\r\n [name]=\"name\"\r\n (change)=\"changed.emit($event)\"\r\n >\r\n <mat-radio-button\r\n [disabled]=\"item.disabled\"\r\n [ngClass]=\"{ 'my-1': direction === 'vertical' }\"\r\n class=\"mr-4\"\r\n *ngFor=\"let item of items\"\r\n [value]=\"item.value\"\r\n >\r\n {{ item.label }}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n</ecabs-element-wrapper>\r\n", styles: [".mr-4{margin-right:1rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.flex{display:flex}.flex-col{flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i3$2.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$2.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
4963
5001
  }
4964
5002
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsRadioButtonListComponent, decorators: [{
4965
5003
  type: Component,
@@ -4969,8 +5007,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
4969
5007
  useExisting: EcabsRadioButtonListComponent,
4970
5008
  multi: true,
4971
5009
  },
4972
- ], template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <mat-radio-group\r\n [ngClass]=\"{ 'flex flex-col my-1': direction === 'vertical' }\"\r\n [(ngModel)]=\"value\"\r\n [disabled]=\"disabled\"\r\n [id]=\"name\"\r\n (change)=\"changed.emit($event.value)\"\r\n >\r\n <mat-radio-button\r\n [disabled]=\"item.disabled\"\r\n [ngClass]=\"{ 'my-1': direction === 'vertical' }\"\r\n class=\"mr-4\"\r\n *ngFor=\"let item of items\"\r\n [value]=\"item.value\"\r\n >\r\n {{ item.label }}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n</ecabs-element-wrapper>\r\n", styles: [".mr-4{margin-right:1rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.flex{display:flex}.flex-col{flex-direction:column}\n"] }]
4973
- }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { items: [{
5010
+ ], template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <mat-radio-group\r\n [ngClass]=\"{ 'flex flex-col my-1': direction === 'vertical' }\"\r\n [(ngModel)]=\"value\"\r\n [disabled]=\"disabled\"\r\n [id]=\"name\"\r\n [name]=\"name\"\r\n (change)=\"changed.emit($event)\"\r\n >\r\n <mat-radio-button\r\n [disabled]=\"item.disabled\"\r\n [ngClass]=\"{ 'my-1': direction === 'vertical' }\"\r\n class=\"mr-4\"\r\n *ngFor=\"let item of items\"\r\n [value]=\"item.value\"\r\n >\r\n {{ item.label }}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n</ecabs-element-wrapper>\r\n", styles: [".mr-4{margin-right:1rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.flex{display:flex}.flex-col{flex-direction:column}\n"] }]
5011
+ }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { matRadioGroup: [{
5012
+ type: ViewChild,
5013
+ args: [MatRadioGroup, { static: false }]
5014
+ }], items: [{
4974
5015
  type: Input
4975
5016
  }], direction: [{
4976
5017
  type: Input
@@ -7766,7 +7807,7 @@ class EcabsDialogConfirmationDeletionComponent {
7766
7807
  .pipe(takeUntilDestroyed(this.destroyRef))
7767
7808
  .subscribe((config) => {
7768
7809
  const { i18n } = config ?? {};
7769
- const { confirmLabel, cancelLabel, } = this.data ?? {};
7810
+ const { confirmLabel, cancelLabel } = this.data ?? {};
7770
7811
  if (i18n) {
7771
7812
  this.data.confirmLabel = confirmLabel || i18n?.confirmLabel;
7772
7813
  this.data.cancelLabel = cancelLabel || i18n?.cancelLabel;