ecabs-components 1.1.15 → 1.1.16

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.
@@ -1,47 +1,54 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, ChangeDetectionStrategy, Input, NgModule, HostBinding, EventEmitter, Output, Injectable, Directive, HostListener, forwardRef, ViewChild, ContentChild, Inject, Host, Self, Optional, Pipe } from '@angular/core';
2
+ import { Component, ChangeDetectionStrategy, Input, NgModule, HostBinding, EventEmitter, Output, Injectable, Directive, HostListener, forwardRef, ViewChild, Pipe, Optional, Self, ContentChild, Inject, Host } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule, DecimalPipe } from '@angular/common';
5
5
  import * as i6 from '@angular/material/button';
6
6
  import { MatButtonModule } from '@angular/material/button';
7
7
  import * as i5 from '@angular/material/icon';
8
8
  import { MatIconModule } from '@angular/material/icon';
9
- import * as i5$1 from '@angular/forms';
9
+ import * as i3 from '@angular/forms';
10
10
  import { Validators, NG_VALIDATORS, NgControl, NG_VALUE_ACCESSOR, FormsModule, UntypedFormControl, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
11
11
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
12
12
  import { BehaviorSubject, Subscription, combineLatest, map, debounceTime, filter, Subject, takeUntil, first } from 'rxjs';
13
13
  import * as i1$1 from '@angular/material/tooltip';
14
14
  import { MatTooltipModule } from '@angular/material/tooltip';
15
15
  import * as i7 from '@angular/material/form-field';
16
- import { MatFormFieldModule, MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
16
+ import { MatFormFieldModule, MAT_FORM_FIELD_DEFAULT_OPTIONS, MatFormFieldControl } from '@angular/material/form-field';
17
17
  import { Overlay } from '@angular/cdk/overlay';
18
18
  import * as i4 from '@angular/material/select';
19
19
  import { MAT_SELECT_SCROLL_STRATEGY, MatSelectModule } from '@angular/material/select';
20
+ import * as i6$1 from '@angular/material/input';
20
21
  import { MatInputModule } from '@angular/material/input';
21
22
  import * as i8 from 'ngx-mat-select-search';
22
23
  import { MatSelectSearchComponent, NgxMatSelectSearchModule } from 'ngx-mat-select-search';
23
- import * as i2 from '@angular/material/core';
24
- import * as i4$2 from '@ng-select/ng-select';
24
+ import * as i4$1 from '@angular/material/core';
25
+ import { mixinErrorState, ErrorStateMatcher } from '@angular/material/core';
26
+ import * as i4$3 from '@ng-select/ng-select';
25
27
  import { NgSelectComponent, NgSelectModule } from '@ng-select/ng-select';
26
- import * as i3 from '@angular/material/checkbox';
28
+ import * as i3$1 from '@angular/material/checkbox';
27
29
  import { MatCheckboxModule } from '@angular/material/checkbox';
28
- import * as i4$1 from '@angular/material/slide-toggle';
30
+ import * as i4$2 from '@angular/material/slide-toggle';
29
31
  import { MatSlideToggleModule } from '@angular/material/slide-toggle';
30
32
  import { format, isValid, isEqual, parse, setSeconds, setMinutes, setHours } from 'date-fns';
31
33
  import Holidays from 'date-holidays';
32
34
  import enGbLocale from 'date-fns/locale/en-GB';
33
- import * as i5$2 from '@angular/material/datepicker';
35
+ import * as i5$1 from '@angular/material/datepicker';
34
36
  import { MatDatepickerModule } from '@angular/material/datepicker';
35
37
  import * as textMask from 'vanilla-text-mask/dist/vanillaTextMask';
36
- import * as i6$1 from 'ngx-mat-intl-tel-input';
37
- import { NgxMatIntlTelInputComponent } from 'ngx-mat-intl-tel-input';
38
- import * as i3$1 from '@angular/material/radio';
39
- import { MatRadioModule } from '@angular/material/radio';
40
- import * as i4$3 from '@angular/router';
38
+ import { parsePhoneNumber, getExampleNumber, parsePhoneNumberFromString, AsYouType } from 'libphonenumber-js';
39
+ import { coerceBooleanProperty } from '@angular/cdk/coercion';
40
+ import * as i7$1 from '@angular/material/menu';
41
+ import { MatMenu, MatMenuModule } from '@angular/material/menu';
42
+ import * as i2 from '@angular/cdk/a11y';
43
+ import * as i9 from '@angular/material/divider';
44
+ import { MatDividerModule } from '@angular/material/divider';
45
+ import * as i4$4 from '@angular/router';
41
46
  import { RouterModule, NavigationStart, RouterLink, RouterLinkActive } from '@angular/router';
42
- import * as i3$2 from '@angular/material/expansion';
47
+ import * as i3$2 from '@angular/material/radio';
48
+ import { MatRadioModule } from '@angular/material/radio';
49
+ import * as i3$3 from '@angular/material/expansion';
43
50
  import { MatExpansionPanel, MatExpansionModule } from '@angular/material/expansion';
44
- import * as i7$1 from '@angular/material/chips';
51
+ import * as i7$2 from '@angular/material/chips';
45
52
  import { MatChipsModule } from '@angular/material/chips';
46
53
  import { MatTable, MatTableModule } from '@angular/material/table';
47
54
  import * as i2$1 from '@angular/material/progress-bar';
@@ -50,9 +57,9 @@ import * as i1$2 from '@angular/material/dialog';
50
57
  import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
51
58
  import * as i1$3 from '@angular/material/paginator';
52
59
  import { map as map$1 } from 'rxjs/operators';
53
- import * as i3$3 from '@angular-slider/ngx-slider';
60
+ import * as i3$4 from '@angular-slider/ngx-slider';
54
61
  import { NgxSliderModule } from '@angular-slider/ngx-slider';
55
- import * as i3$4 from '@angular/platform-browser';
62
+ import * as i3$5 from '@angular/platform-browser';
56
63
  import { MatSidenavModule } from '@angular/material/sidenav';
57
64
 
58
65
  class EcabsSpinnerComponent {
@@ -903,7 +910,7 @@ class EcabsInputComponent extends EcabsElementBaseComponent {
903
910
  useExisting: EcabsInputComponent,
904
911
  multi: true,
905
912
  },
906
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <input\r\n ecabsDigitsOnly\r\n [digitsOnly]=\"digitsOnly\"\r\n [decimal]=\"allowDecimal\"\r\n [allowHyphen]=\"allowHyphen\"\r\n class=\"form-field__input\"\r\n [type]=\"type\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n [mini]=\"mini\"\r\n [maxi]=\"maxi\"\r\n [disabled]=\"disabled\"\r\n [maxlength]=\"maxLength\"\r\n [max]=\"max\"\r\n [step]=\"step\"\r\n (blur)=\"blurChange($event)\"\r\n />\r\n\r\n <div class=\"form-field__input--suffix\" *ngIf=\"type !== 'number'\">\r\n <ng-content select=\"mat-icon\"></ng-content>\r\n <ng-content select=\".suffix\"></ng-content>\r\n </div>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: EcabsMinDirective, selector: "[mini][formControlName],[mini][formControl],[mini][ngModel]", inputs: ["mini"] }, { kind: "directive", type: EcabsMaxDirective, selector: "[maxi][formControlName],[maxi][formControl],[maxi][ngModel]", inputs: ["maxi"] }] });
913
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <input\r\n ecabsDigitsOnly\r\n [digitsOnly]=\"digitsOnly\"\r\n [decimal]=\"allowDecimal\"\r\n [allowHyphen]=\"allowHyphen\"\r\n class=\"form-field__input\"\r\n [type]=\"type\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n [mini]=\"mini\"\r\n [maxi]=\"maxi\"\r\n [disabled]=\"disabled\"\r\n [maxlength]=\"maxLength\"\r\n [max]=\"max\"\r\n [step]=\"step\"\r\n (blur)=\"blurChange($event)\"\r\n />\r\n\r\n <div class=\"form-field__input--suffix\" *ngIf=\"type !== 'number'\">\r\n <ng-content select=\"mat-icon\"></ng-content>\r\n <ng-content select=\".suffix\"></ng-content>\r\n </div>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { 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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: EcabsMinDirective, selector: "[mini][formControlName],[mini][formControl],[mini][ngModel]", inputs: ["mini"] }, { kind: "directive", type: EcabsMaxDirective, selector: "[maxi][formControlName],[maxi][formControl],[maxi][ngModel]", inputs: ["maxi"] }] });
907
914
  }
908
915
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsInputComponent, decorators: [{
909
916
  type: Component,
@@ -1417,7 +1424,7 @@ class EcabsSelectComponent extends EcabsElementBaseComponent {
1417
1424
  useExisting: EcabsSelectComponent,
1418
1425
  multi: true,
1419
1426
  },
1420
- ], viewQueries: [{ propertyName: "allSelected", first: true, predicate: ["allSelected"], descendants: true }, { propertyName: "matSelectSearchComponent", first: true, predicate: MatSelectSearchComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <mat-form-field [ngClass]=\"{ disabled: useOnlyDisabledClass }\">\r\n <mat-select class=\"form-field__select\"\r\n [(ngModel)]=\"value\"\r\n (closed)=\"onTouch()\"\r\n [id]=\"name\"\r\n [multiple]=\"multiple\"\r\n [disabled]=\"disabled\"\r\n [placeholder]=\"placeholder\"\r\n [disableRipple]=\"true\"\r\n (selectionChange)=\"onSelectionChanged($event)\"\r\n [matTooltip]=\"trigger\"\r\n ecabsTooltipIfTruncated\r\n [classNameTruncatedTooltip]=\"'mat-select-value'\">\r\n <mat-select-trigger>\r\n <span>{{ trigger }}</span>\r\n </mat-select-trigger>\r\n\r\n <mat-option *ngIf=\"useSearchOption\">\r\n <ngx-mat-select-search [formControl]=\"itemFilterCtrl\"\r\n [placeholderLabel]=\"searchFieldPlaceholder\"\r\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\">\r\n </ngx-mat-select-search>\r\n </mat-option>\r\n\r\n <mat-option *ngIf=\"useNoneOption\"\r\n (click)=\"toggleNone()\"\r\n (keydown.enter)=\"toggleNone()\">\r\n {{ noneLabel }}\r\n </mat-option>\r\n\r\n <mat-option #allSelected\r\n *ngIf=\"useSelectAllOption && showFilteredAllOption\"\r\n (click)=\"toggleAllSelection()\"\r\n (keydown.enter)=\"toggleAllSelection()\"\r\n [value]=\"selectAllValue\">\r\n {{ allLabel }}\r\n </mat-option>\r\n\r\n <mat-option *ngFor=\"let item of filteredItems$ | async\"\r\n [value]=\"item.value\"\r\n (click)=\"togglePerOne()\"\r\n (keydown.enter)=\"togglePerOne()\"\r\n [matTooltip]=\"item.label\"\r\n ecabsTooltipIfTruncated\r\n [classNameTruncatedTooltip]=\"'mdc-list-item__primary-text'\">\r\n {{ item.label }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</ecabs-element-wrapper>\r\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i1$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti", "recreateValuesArray"], outputs: ["toggleAll"] }, { kind: "directive", type: i5$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: EcabsTooltipIfTruncatedDirective, selector: "[matTooltip][ecabsTooltipIfTruncated]", inputs: ["classNameTruncatedTooltip"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
1427
+ ], viewQueries: [{ propertyName: "allSelected", first: true, predicate: ["allSelected"], descendants: true }, { propertyName: "matSelectSearchComponent", first: true, predicate: MatSelectSearchComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <mat-form-field [ngClass]=\"{ disabled: useOnlyDisabledClass }\">\r\n <mat-select class=\"form-field__select\"\r\n [(ngModel)]=\"value\"\r\n (closed)=\"onTouch()\"\r\n [id]=\"name\"\r\n [multiple]=\"multiple\"\r\n [disabled]=\"disabled\"\r\n [placeholder]=\"placeholder\"\r\n [disableRipple]=\"true\"\r\n (selectionChange)=\"onSelectionChanged($event)\"\r\n [matTooltip]=\"trigger\"\r\n ecabsTooltipIfTruncated\r\n [classNameTruncatedTooltip]=\"'mat-select-value'\">\r\n <mat-select-trigger>\r\n <span>{{ trigger }}</span>\r\n </mat-select-trigger>\r\n\r\n <mat-option *ngIf=\"useSearchOption\">\r\n <ngx-mat-select-search [formControl]=\"itemFilterCtrl\"\r\n [placeholderLabel]=\"searchFieldPlaceholder\"\r\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\">\r\n </ngx-mat-select-search>\r\n </mat-option>\r\n\r\n <mat-option *ngIf=\"useNoneOption\"\r\n (click)=\"toggleNone()\"\r\n (keydown.enter)=\"toggleNone()\">\r\n {{ noneLabel }}\r\n </mat-option>\r\n\r\n <mat-option #allSelected\r\n *ngIf=\"useSelectAllOption && showFilteredAllOption\"\r\n (click)=\"toggleAllSelection()\"\r\n (keydown.enter)=\"toggleAllSelection()\"\r\n [value]=\"selectAllValue\">\r\n {{ allLabel }}\r\n </mat-option>\r\n\r\n <mat-option *ngFor=\"let item of filteredItems$ | async\"\r\n [value]=\"item.value\"\r\n (click)=\"togglePerOne()\"\r\n (keydown.enter)=\"togglePerOne()\"\r\n [matTooltip]=\"item.label\"\r\n ecabsTooltipIfTruncated\r\n [classNameTruncatedTooltip]=\"'mdc-list-item__primary-text'\">\r\n {{ item.label }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</ecabs-element-wrapper>\r\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i1$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { 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: "component", type: i8.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti", "recreateValuesArray"], outputs: ["toggleAll"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: EcabsTooltipIfTruncatedDirective, selector: "[matTooltip][ecabsTooltipIfTruncated]", inputs: ["classNameTruncatedTooltip"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
1421
1428
  }
1422
1429
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsSelectComponent, decorators: [{
1423
1430
  type: Component,
@@ -1597,7 +1604,7 @@ class EcabsCheckboxToggleComponent extends EcabsElementBaseComponent {
1597
1604
  useExisting: EcabsCheckboxToggleComponent,
1598
1605
  multi: true,
1599
1606
  },
1600
- ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <ng-container [ngSwitch]=\"type\">\r\n <mat-checkbox\r\n (change)=\"change($event)\"\r\n (click)=\"onClick($event)\"\r\n (blur)=\"onBlur()\"\r\n [checked]=\"checked\"\r\n [indeterminate]=\"indeterminate\"\r\n [disabled]=\"disabled\"\r\n [(ngModel)]=\"value\"\r\n [id]=\"name\"\r\n [labelPosition]=\"labelPosition\"\r\n [ngClass]=\"{ 'indeterminate': indeterminate }\"\r\n *ngSwitchCase=\"'checkbox'\"\r\n >\r\n {{ text }}\r\n </mat-checkbox>\r\n\r\n <mat-slide-toggle\r\n (change)=\"change($event)\"\r\n [disabled]=\"disabled\"\r\n [(ngModel)]=\"value\"\r\n [labelPosition]=\"labelPosition\"\r\n *ngSwitchCase=\"'toggle'\"\r\n >{{ text }}</mat-slide-toggle\r\n >\r\n </ng-container>\r\n</ecabs-element-wrapper>\r\n", styles: [":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)}.form-field__subscript--wrapper,form-field__subscript--wrapper,.form-field--required .form-field__label:after,form-field--required .form-field__label:after{position:absolute;content:\"\"}.form-field--required .form-field__label:after,form-field--required .form-field__label:after{content:\"*\"!important;margin-left:.2rem;margin-top:2px;color:var(--color-error)}.form-field,form-field{margin-bottom:1rem;position:relative}.form-field__label,form-field__label{font-size:12px;font-size:.75rem;display:inline-block;margin-bottom:.25rem;color:var(--color-gray-500);cursor:pointer}.form-field__label .icon,form-field__label .icon{font-size:16px;font-size:1rem;display:inline;vertical-align:middle;margin-left:.375rem}.form-field__label-note,form-field__label-note{font-size:14px;font-size:.875rem;display:inline-block;margin-bottom:.25rem;color:var(--color-gray-400);cursor:pointer}.form-field__input,form-field__input{font-size:16px;font-size:1rem;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}.form-field__input:focus,form-field__input:focus{border-color:var(--color-brand-dark)}.form-field__input--wrapper,form-field__input--wrapper{display:flex;position:relative;line-height:1}.form-field__input--suffix,.form-field__textarea--prefix,form-field__textarea--prefix,.form-field__input--prefix,form-field__input--prefix,form-field__input--suffix{position:absolute!important;top:50%;right:1rem;color:var(--color-gray-500);transform:translateY(-50%)}.form-field__input--suffix,.form-field__textarea--prefix,form-field__textarea--prefix,.form-field__input--prefix,form-field__input--prefix,.form-field__input--suffix i,.form-field__textarea--prefix i,form-field__textarea--prefix i,.form-field__input--prefix i,form-field__input--prefix i,.form-field__input--suffix .mat-icon,.form-field__textarea--prefix .mat-icon,form-field__textarea--prefix .mat-icon,.form-field__input--prefix .mat-icon,form-field__input--prefix .mat-icon,form-field__input--suffix,form-field__input--suffix i,form-field__input--suffix .mat-icon{font-size:18px;font-size:1.125rem;width:1.125rem;height:1.125rem}.form-field__input--prefix,form-field__input--prefix{right:unset;left:1rem}.form-field__input--disabled,form-field__input--disabled{background-color:var(--color-gray-100);border-color:transparent}.form-field__input--invalid,form-field__input--invalid{border-color:var(--color-error);color:var(--color-error)}.form-field__textarea,form-field__textarea{font-size:16px;font-size:1rem;display:block;width:100%;padding:1rem;border-radius:.25rem;border:1px solid var(--color-gray-500);color:var(--color-black);line-height:1.5}.form-field__textarea:focus,form-field__textarea:focus{border-color:var(--color-brand-dark)}.form-field__textarea--wrapper,form-field__textarea--wrapper{display:flex;position:relative;line-height:1}.form-field__textarea--suffix,form-field__textarea--suffix{position:absolute!important;top:50%;right:1rem;color:var(--color-gray-500);transform:translateY(-50%)}.form-field__textarea--suffix,.form-field__textarea--suffix i,.form-field__textarea--suffix .mat-icon,form-field__textarea--suffix,form-field__textarea--suffix i,form-field__textarea--suffix .mat-icon{font-size:18px;font-size:1.125rem;width:1.125rem;height:1.125rem}.form-field__textarea--prefix,form-field__textarea--prefix{right:unset;left:1rem}.form-field__textarea--disabled,form-field__textarea--disabled{background-color:var(--color-gray-100);border-color:transparent}.form-field--invalid,.form-field--invalid .form-field__input,.form-field--invalid .form-field__textarea,form-field--invalid,form-field--invalid .form-field__input,form-field--invalid .form-field__textarea{color:var(--color-error);border-color:var(--color-error)}.form-field__validation,form-field__validation{padding-top:.5rem;font-size:12px;font-size:.75rem;color:var(--color-error)}.form-field__validation--item,form-field__validation--item{padding-bottom:.6rem}.form-field__validation--item:last-of-type,form-field__validation--item:last-of-type{padding-bottom:0}.form-field__subscript--wrapper,form-field__subscript--wrapper{margin-top:1.2rem}.form-field.disabled input,.form-field.disabled textarea,form-field.disabled input,form-field.disabled textarea{background-color:var(--color-white-opacity-05);border-color:var(--color-gray-300)}.form-field .spinner,form-field .spinner{position:absolute;right:.25rem;top:1.85rem}.form-field .hint,form-field .hint{font-size:10px;text-align:right;margin-right:1.0625rem;transform:translateY(-1rem);margin-bottom:-1rem}.form .mat-mdc-form-field-appearance-standard .mat-mdc-form-field-flex,form .mat-mdc-form-field-appearance-standard .mat-mdc-form-field-flex{padding-top:0}.form .mat-mdc-form-field-infix,form .mat-mdc-form-field-infix{border-top:0}.form .mat-mdc-form-field .mat-mdc-form-field-flex,form .mat-mdc-form-field .mat-mdc-form-field-flex{padding-top:0}.mat-mdc-form-field-type-mat-date-range-input .mat-mdc-form-field-infix{width:auto}.mat-mdc-text-field-wrapper{padding-bottom:0}:host::ng-deep .form-field{display:flex;margin:0}:host::ng-deep .mat-mdc-slide-toggle{margin-right:.96rem}:host::ng-deep .mat-mdc-slide-toggle .mdc-label{font-size:14px;font-size:.875rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i3.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i4$1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
1607
+ ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <ng-container [ngSwitch]=\"type\">\r\n <mat-checkbox\r\n (change)=\"change($event)\"\r\n (click)=\"onClick($event)\"\r\n (blur)=\"onBlur()\"\r\n [checked]=\"checked\"\r\n [indeterminate]=\"indeterminate\"\r\n [disabled]=\"disabled\"\r\n [(ngModel)]=\"value\"\r\n [id]=\"name\"\r\n [labelPosition]=\"labelPosition\"\r\n [ngClass]=\"{ 'indeterminate': indeterminate }\"\r\n *ngSwitchCase=\"'checkbox'\"\r\n >\r\n {{ text }}\r\n </mat-checkbox>\r\n\r\n <mat-slide-toggle\r\n (change)=\"change($event)\"\r\n [disabled]=\"disabled\"\r\n [(ngModel)]=\"value\"\r\n [labelPosition]=\"labelPosition\"\r\n *ngSwitchCase=\"'toggle'\"\r\n >{{ text }}</mat-slide-toggle\r\n >\r\n </ng-container>\r\n</ecabs-element-wrapper>\r\n", styles: [":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)}.form-field__subscript--wrapper,form-field__subscript--wrapper,.form-field--required .form-field__label:after,form-field--required .form-field__label:after{position:absolute;content:\"\"}.form-field--required .form-field__label:after,form-field--required .form-field__label:after{content:\"*\"!important;margin-left:.2rem;margin-top:2px;color:var(--color-error)}.form-field,form-field{margin-bottom:1rem;position:relative}.form-field__label,form-field__label{font-size:12px;font-size:.75rem;display:inline-block;margin-bottom:.25rem;color:var(--color-gray-500);cursor:pointer}.form-field__label .icon,form-field__label .icon{font-size:16px;font-size:1rem;display:inline;vertical-align:middle;margin-left:.375rem}.form-field__label-note,form-field__label-note{font-size:14px;font-size:.875rem;display:inline-block;margin-bottom:.25rem;color:var(--color-gray-400);cursor:pointer}.form-field__input,form-field__input{font-size:16px;font-size:1rem;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}.form-field__input:focus,form-field__input:focus{border-color:var(--color-brand-dark)}.form-field__input--wrapper,form-field__input--wrapper{display:flex;position:relative;line-height:1}.form-field__input--suffix,.form-field__textarea--prefix,form-field__textarea--prefix,.form-field__input--prefix,form-field__input--prefix,form-field__input--suffix{position:absolute!important;top:50%;right:1rem;color:var(--color-gray-500);transform:translateY(-50%)}.form-field__input--suffix,.form-field__textarea--prefix,form-field__textarea--prefix,.form-field__input--prefix,form-field__input--prefix,.form-field__input--suffix i,.form-field__textarea--prefix i,form-field__textarea--prefix i,.form-field__input--prefix i,form-field__input--prefix i,.form-field__input--suffix .mat-icon,.form-field__textarea--prefix .mat-icon,form-field__textarea--prefix .mat-icon,.form-field__input--prefix .mat-icon,form-field__input--prefix .mat-icon,form-field__input--suffix,form-field__input--suffix i,form-field__input--suffix .mat-icon{font-size:18px;font-size:1.125rem;width:1.125rem;height:1.125rem}.form-field__input--prefix,form-field__input--prefix{right:unset;left:1rem}.form-field__input--disabled,form-field__input--disabled{background-color:var(--color-gray-100);border-color:transparent}.form-field__input--invalid,form-field__input--invalid{border-color:var(--color-error);color:var(--color-error)}.form-field__textarea,form-field__textarea{font-size:16px;font-size:1rem;display:block;width:100%;padding:1rem;border-radius:.25rem;border:1px solid var(--color-gray-500);color:var(--color-black);line-height:1.5}.form-field__textarea:focus,form-field__textarea:focus{border-color:var(--color-brand-dark)}.form-field__textarea--wrapper,form-field__textarea--wrapper{display:flex;position:relative;line-height:1}.form-field__textarea--suffix,form-field__textarea--suffix{position:absolute!important;top:50%;right:1rem;color:var(--color-gray-500);transform:translateY(-50%)}.form-field__textarea--suffix,.form-field__textarea--suffix i,.form-field__textarea--suffix .mat-icon,form-field__textarea--suffix,form-field__textarea--suffix i,form-field__textarea--suffix .mat-icon{font-size:18px;font-size:1.125rem;width:1.125rem;height:1.125rem}.form-field__textarea--prefix,form-field__textarea--prefix{right:unset;left:1rem}.form-field__textarea--disabled,form-field__textarea--disabled{background-color:var(--color-gray-100);border-color:transparent}.form-field--invalid,.form-field--invalid .form-field__input,.form-field--invalid .form-field__textarea,form-field--invalid,form-field--invalid .form-field__input,form-field--invalid .form-field__textarea{color:var(--color-error);border-color:var(--color-error)}.form-field__validation,form-field__validation{padding-top:.5rem;font-size:12px;font-size:.75rem;color:var(--color-error)}.form-field__validation--item,form-field__validation--item{padding-bottom:.6rem}.form-field__validation--item:last-of-type,form-field__validation--item:last-of-type{padding-bottom:0}.form-field__subscript--wrapper,form-field__subscript--wrapper{margin-top:1.2rem}.form-field.disabled input,.form-field.disabled textarea,form-field.disabled input,form-field.disabled textarea{background-color:var(--color-white-opacity-05);border-color:var(--color-gray-300)}.form-field .spinner,form-field .spinner{position:absolute;right:.25rem;top:1.85rem}.form-field .hint,form-field .hint{font-size:10px;text-align:right;margin-right:1.0625rem;transform:translateY(-1rem);margin-bottom:-1rem}.form .mat-mdc-form-field-appearance-standard .mat-mdc-form-field-flex,form .mat-mdc-form-field-appearance-standard .mat-mdc-form-field-flex{padding-top:0}.form .mat-mdc-form-field-infix,form .mat-mdc-form-field-infix{border-top:0}.form .mat-mdc-form-field .mat-mdc-form-field-flex,form .mat-mdc-form-field .mat-mdc-form-field-flex{padding-top:0}.mat-mdc-form-field-type-mat-date-range-input .mat-mdc-form-field-infix{width:auto}.mat-mdc-text-field-wrapper{padding-bottom:0}:host::ng-deep .form-field{display:flex;margin:0}:host::ng-deep .mat-mdc-slide-toggle{margin-right:.96rem}:host::ng-deep .mat-mdc-slide-toggle .mdc-label{font-size:14px;font-size:.875rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i3$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i4$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { 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"] }] });
1601
1608
  }
1602
1609
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsCheckboxToggleComponent, decorators: [{
1603
1610
  type: Component,
@@ -1772,7 +1779,7 @@ class EcabsSelectV2Component extends EcabsElementBaseComponent {
1772
1779
  multi: true,
1773
1780
  useExisting: EcabsSelectV2Component,
1774
1781
  },
1775
- ], viewQueries: [{ propertyName: "ngSelect", first: true, predicate: NgSelectComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <ng-select class=\"form-field__select\"\r\n [appearance]=\"appearance\"\r\n [appendTo]=\"appendTo\"\r\n [labelForId]=\"name\"\r\n [bindLabel]=\"bindLabel || null\"\r\n [bindValue]=\"bindValue || null\"\r\n [searchable]=\"searchable\"\r\n [clearable]=\"clearable\"\r\n [clearSearchOnAdd]=\"clearSearchOnAdd\"\r\n [groupBy]=\"groupByKey\"\r\n [selectableGroup]=\"true\"\r\n [selectableGroupAsModel]=\"false\"\r\n [items]=\"itemsList\"\r\n [multiple]=\"multiple\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onBlur()\"\r\n [hideSelected]=\"hideSelected\"\r\n [trackByFn]=\"trackByFn\"\r\n [minTermLength]=\"minLength\"\r\n [typeToSearchText]=\"searchPlaceholder\"\r\n [typeahead]=\"typeahead\"\r\n [loading]=\"loading\"\r\n [closeOnSelect]=\"closeOnSelect\"\r\n [clearOnBackspace]=\"clearOnBackspace\"\r\n [editableSearchTerm]=\"editableSearchTerm\"\r\n (open)=\"this.isOpen = true\"\r\n (close)=\"this.isOpen = false\"\r\n (change)=\"changed($event)\"\r\n [notFoundText]=\"notFoundText\"\r\n [clearAllText]=\"clearAllText\"\r\n [readonly]=\"this.disabled\">\r\n\r\n <ng-container *ngIf=\"!typeahead\">\r\n <ng-option *ngFor=\"let item of itemsList\" [value]=\"item?.value\">\r\n {{ item?.label }}\r\n </ng-option>\r\n </ng-container>\r\n\r\n <ng-template ng-loadingspinner-tmp>\r\n <ecabs-loading-spinner size=\"tiny\"></ecabs-loading-spinner>\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"!!bindValue && !!bindLabel\">\r\n <ng-template ng-multi-label-tmp let-items=\"items\">\r\n <!--#Custom display of first selected item and (+1 more) pattern -->\r\n <ng-container *ngIf=\"!isOpen\">\r\n <div *ngFor=\"let item of items | slice:0:1\">\r\n {{ item?.['label'] }} <span *ngIf=\"items.length > 1\">\r\n (+{{ items.length - 1 }}\r\n {{ (items?.length === 2 ? otherLabel : othersLabel) }})\r\n </span>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiple\">\r\n <!--#Add selectAll and individual checkboxes for multiple-enabled list -->\r\n <ng-template ng-optgroup-tmp let-item$=\"item$\" let-index=\"index\">\r\n <ecabs-checkbox [ngModel]=\"item$.selected\"\r\n [name]=\"index\"\r\n [text]=\"selectAllLabel\">\r\n </ecabs-checkbox>\r\n </ng-template>\r\n\r\n <ng-template ng-option-tmp let-item$=\"item$\" let-index=\"index\">\r\n <ecabs-checkbox [ngModel]=\"item$.selected\"\r\n [name]=\"index\"\r\n [text]=\"item$?.['label']\">\r\n </ecabs-checkbox>\r\n </ng-template>\r\n </ng-container>\r\n </ng-select>\r\n</ecabs-element-wrapper>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i4$2.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "directive", type: i4$2.NgOptgroupTemplateDirective, selector: "[ng-optgroup-tmp]" }, { kind: "directive", type: i4$2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i4$2.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i4$2.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }, { kind: "component", type: EcabsSpinnerComponent, selector: "ecabs-loading-spinner", inputs: ["size"] }, { kind: "component", type: EcabsCheckboxToggleComponent, selector: "ecabs-checkbox", inputs: ["type", "text", "label", "labelPosition", "indeterminate", "checked"], outputs: ["click", "changed"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] });
1782
+ ], viewQueries: [{ propertyName: "ngSelect", first: true, predicate: NgSelectComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <ng-select class=\"form-field__select\"\r\n [appearance]=\"appearance\"\r\n [appendTo]=\"appendTo\"\r\n [labelForId]=\"name\"\r\n [bindLabel]=\"bindLabel || null\"\r\n [bindValue]=\"bindValue || null\"\r\n [searchable]=\"searchable\"\r\n [clearable]=\"clearable\"\r\n [clearSearchOnAdd]=\"clearSearchOnAdd\"\r\n [groupBy]=\"groupByKey\"\r\n [selectableGroup]=\"true\"\r\n [selectableGroupAsModel]=\"false\"\r\n [items]=\"itemsList\"\r\n [multiple]=\"multiple\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onBlur()\"\r\n [hideSelected]=\"hideSelected\"\r\n [trackByFn]=\"trackByFn\"\r\n [minTermLength]=\"minLength\"\r\n [typeToSearchText]=\"searchPlaceholder\"\r\n [typeahead]=\"typeahead\"\r\n [loading]=\"loading\"\r\n [closeOnSelect]=\"closeOnSelect\"\r\n [clearOnBackspace]=\"clearOnBackspace\"\r\n [editableSearchTerm]=\"editableSearchTerm\"\r\n (open)=\"this.isOpen = true\"\r\n (close)=\"this.isOpen = false\"\r\n (change)=\"changed($event)\"\r\n [notFoundText]=\"notFoundText\"\r\n [clearAllText]=\"clearAllText\"\r\n [readonly]=\"this.disabled\">\r\n\r\n <ng-container *ngIf=\"!typeahead\">\r\n <ng-option *ngFor=\"let item of itemsList\" [value]=\"item?.value\">\r\n {{ item?.label }}\r\n </ng-option>\r\n </ng-container>\r\n\r\n <ng-template ng-loadingspinner-tmp>\r\n <ecabs-loading-spinner size=\"tiny\"></ecabs-loading-spinner>\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"!!bindValue && !!bindLabel\">\r\n <ng-template ng-multi-label-tmp let-items=\"items\">\r\n <!--#Custom display of first selected item and (+1 more) pattern -->\r\n <ng-container *ngIf=\"!isOpen\">\r\n <div *ngFor=\"let item of items | slice:0:1\">\r\n {{ item?.['label'] }} <span *ngIf=\"items.length > 1\">\r\n (+{{ items.length - 1 }}\r\n {{ (items?.length === 2 ? otherLabel : othersLabel) }})\r\n </span>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiple\">\r\n <!--#Add selectAll and individual checkboxes for multiple-enabled list -->\r\n <ng-template ng-optgroup-tmp let-item$=\"item$\" let-index=\"index\">\r\n <ecabs-checkbox [ngModel]=\"item$.selected\"\r\n [name]=\"index\"\r\n [text]=\"selectAllLabel\">\r\n </ecabs-checkbox>\r\n </ng-template>\r\n\r\n <ng-template ng-option-tmp let-item$=\"item$\" let-index=\"index\">\r\n <ecabs-checkbox [ngModel]=\"item$.selected\"\r\n [name]=\"index\"\r\n [text]=\"item$?.['label']\">\r\n </ecabs-checkbox>\r\n </ng-template>\r\n </ng-container>\r\n </ng-select>\r\n</ecabs-element-wrapper>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { 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: "component", type: i4$3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i4$3.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "directive", type: i4$3.NgOptgroupTemplateDirective, selector: "[ng-optgroup-tmp]" }, { kind: "directive", type: i4$3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i4$3.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i4$3.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }, { kind: "component", type: EcabsSpinnerComponent, selector: "ecabs-loading-spinner", inputs: ["size"] }, { kind: "component", type: EcabsCheckboxToggleComponent, selector: "ecabs-checkbox", inputs: ["type", "text", "label", "labelPosition", "indeterminate", "checked"], outputs: ["click", "changed"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] });
1776
1783
  }
1777
1784
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsSelectV2Component, decorators: [{
1778
1785
  type: Component,
@@ -1944,7 +1951,7 @@ class EcabsTextareaComponent extends EcabsElementBaseComponent {
1944
1951
  useExisting: EcabsTextareaComponent,
1945
1952
  multi: true,
1946
1953
  },
1947
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <textarea\r\n class=\"form-field__textarea\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n [disabled]=\"disabled\"\r\n [maxlength]=\"maxLength\"\r\n [rows]=\"rows\"\r\n >\r\n </textarea>\r\n</ecabs-element-wrapper>\r\n", dependencies: [{ kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
1954
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <textarea\r\n class=\"form-field__textarea\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n [disabled]=\"disabled\"\r\n [maxlength]=\"maxLength\"\r\n [rows]=\"rows\"\r\n >\r\n </textarea>\r\n</ecabs-element-wrapper>\r\n", dependencies: [{ kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { 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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
1948
1955
  }
1949
1956
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsTextareaComponent, decorators: [{
1950
1957
  type: Component,
@@ -2085,13 +2092,13 @@ class EcabsPickerHeaderComponent {
2085
2092
  this.calendar.currentView =
2086
2093
  this.calendar.currentView === 'month' ? 'multi-year' : 'month';
2087
2094
  }
2088
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPickerHeaderComponent, deps: [{ token: i5$2.MatCalendar }, { token: i2.DateAdapter }, { token: i0.ChangeDetectorRef }, { token: EcabsDatePickerHeaderService }, { token: UnsubscribeService }], target: i0.ɵɵFactoryTarget.Component });
2095
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPickerHeaderComponent, deps: [{ token: i5$1.MatCalendar }, { token: i4$1.DateAdapter }, { token: i0.ChangeDetectorRef }, { token: EcabsDatePickerHeaderService }, { token: UnsubscribeService }], target: i0.ɵɵFactoryTarget.Component });
2089
2096
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsPickerHeaderComponent, selector: "ecabs-picker-header", providers: [UnsubscribeService], ngImport: i0, template: "<div class=\"header\">\r\n <button mat-icon-button (click)=\"previousClicked()\">\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n </button>\r\n <button mat-flat-button (click)=\"currentPeriodClicked()\">\r\n <span >{{ periodLabel }}</span>\r\n </button>\r\n\r\n <button mat-icon-button (click)=\"nextClicked()\">\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </button>\r\n</div>\r\n", styles: [":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)}.header{display:flex;align-items:center;justify-content:space-between;padding:1rem}.select-date-label{color:var(--color-brand-dark)}button{background-color:inherit}\n"], dependencies: [{ kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2090
2097
  }
2091
2098
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPickerHeaderComponent, decorators: [{
2092
2099
  type: Component,
2093
2100
  args: [{ selector: 'ecabs-picker-header', changeDetection: ChangeDetectionStrategy.OnPush, providers: [UnsubscribeService], template: "<div class=\"header\">\r\n <button mat-icon-button (click)=\"previousClicked()\">\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n </button>\r\n <button mat-flat-button (click)=\"currentPeriodClicked()\">\r\n <span >{{ periodLabel }}</span>\r\n </button>\r\n\r\n <button mat-icon-button (click)=\"nextClicked()\">\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </button>\r\n</div>\r\n", styles: [":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)}.header{display:flex;align-items:center;justify-content:space-between;padding:1rem}.select-date-label{color:var(--color-brand-dark)}button{background-color:inherit}\n"] }]
2094
- }], ctorParameters: function () { return [{ type: i5$2.MatCalendar }, { type: i2.DateAdapter }, { type: i0.ChangeDetectorRef }, { type: EcabsDatePickerHeaderService }, { type: UnsubscribeService }]; } });
2101
+ }], ctorParameters: function () { return [{ type: i5$1.MatCalendar }, { type: i4$1.DateAdapter }, { type: i0.ChangeDetectorRef }, { type: EcabsDatePickerHeaderService }, { type: UnsubscribeService }]; } });
2095
2102
 
2096
2103
  class EcabsDatePickerHeaderComponent {
2097
2104
  ecabsDatePickerHeaderService;
@@ -2114,7 +2121,7 @@ class EcabsDatePickerActionsComponent {
2114
2121
  applyLabel = 'Apply';
2115
2122
  apply = new EventEmitter();
2116
2123
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDatePickerActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2117
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: { cancelLabel: "cancelLabel", applyLabel: "applyLabel" }, outputs: { apply: "apply" }, ngImport: i0, template: "<div class=\"grid grid-cols-2 gap-4\">\r\n <ecabs-buttons color=\"primary\"\r\n [style]=\"'stroked'\"\r\n matDatepickerCancel>\r\n {{ cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"apply.emit()\"\r\n (keydown.enter)=\"apply.emit()\">\r\n {{ applyLabel }}\r\n </ecabs-buttons>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: ButtonsComponent, selector: "ecabs-buttons", inputs: ["disabled", "loading", "size", "type", "style", "full", "color"] }, { kind: "directive", type: i5$2.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i5$2.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }] });
2124
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: { cancelLabel: "cancelLabel", applyLabel: "applyLabel" }, outputs: { apply: "apply" }, ngImport: i0, template: "<div class=\"grid grid-cols-2 gap-4\">\r\n <ecabs-buttons color=\"primary\"\r\n [style]=\"'stroked'\"\r\n matDatepickerCancel>\r\n {{ cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"apply.emit()\"\r\n (keydown.enter)=\"apply.emit()\">\r\n {{ applyLabel }}\r\n </ecabs-buttons>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: ButtonsComponent, selector: "ecabs-buttons", inputs: ["disabled", "loading", "size", "type", "style", "full", "color"] }, { kind: "directive", type: i5$1.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i5$1.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }] });
2118
2125
  }
2119
2126
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDatePickerActionsComponent, decorators: [{
2120
2127
  type: Component,
@@ -2222,7 +2229,7 @@ class EcabsDatePickerComponent extends EcabsElementBaseComponent {
2222
2229
  multi: true,
2223
2230
  },
2224
2231
  UnsubscribeService,
2225
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <input\r\n class=\"form-field__input date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n [matDatepickerFilter]=\"filterDateRange\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker-toggle\r\n matSuffix [for]=\"picker\"\r\n class=\"text-gray-500\"\r\n >\r\n <mat-icon matDatepickerToggleIcon>calendar_today</mat-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #picker\r\n [calendarHeaderComponent]=\"header\"\r\n [touchUi]=\"touchUi\"\r\n >\r\n <mat-datepicker-actions>\r\n <ecabs-date-picker-actions\r\n [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n >\r\n </ecabs-date-picker-actions>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [""], 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: i5$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i5$2.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.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"], outputs: ["apply"] }] });
2232
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <input\r\n class=\"form-field__input date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n [matDatepickerFilter]=\"filterDateRange\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker-toggle\r\n matSuffix [for]=\"picker\"\r\n class=\"text-gray-500\"\r\n >\r\n <mat-icon matDatepickerToggleIcon>calendar_today</mat-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #picker\r\n [calendarHeaderComponent]=\"header\"\r\n [touchUi]=\"touchUi\"\r\n >\r\n <mat-datepicker-actions>\r\n <ecabs-date-picker-actions\r\n [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n >\r\n </ecabs-date-picker-actions>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [""], 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: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$1.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i5$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"], outputs: ["apply"] }] });
2226
2233
  }
2227
2234
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDatePickerComponent, decorators: [{
2228
2235
  type: Component,
@@ -2685,7 +2692,7 @@ class EcabsDateTimePickerComponent extends EcabsElementBaseComponent {
2685
2692
  },
2686
2693
  DecimalPipe,
2687
2694
  UnsubscribeService,
2688
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\" class=\"datepicker-ui\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <ecabs-date-picker-actions [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n (apply)=\"onApply()\">\r\n </ecabs-date-picker-actions>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n ecabsMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button mat-icon-button class=\"datepicker-ui__toggle text-gray-500\"\r\n (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.time--inputs{position:relative;display:flex;gap:.5rem;justify-content:center;align-items:center;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i5$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$2.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: EcabsNumberBorderDirective, selector: "[ecabsNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "directive", type: EcabsMaskDateDirective, selector: "[ecabsMaskDate]", inputs: ["isDateTimeMask", "considerSeconds"] }, { kind: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel"], outputs: ["apply"] }] });
2695
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\" class=\"datepicker-ui\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <ecabs-date-picker-actions [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n (apply)=\"onApply()\">\r\n </ecabs-date-picker-actions>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n ecabsMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button mat-icon-button class=\"datepicker-ui__toggle text-gray-500\"\r\n (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.time--inputs{position:relative;display:flex;gap:.5rem;justify-content:center;align-items:center;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$1.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { 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: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: EcabsNumberBorderDirective, selector: "[ecabsNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "directive", type: EcabsMaskDateDirective, selector: "[ecabsMaskDate]", inputs: ["isDateTimeMask", "considerSeconds"] }, { kind: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel"], outputs: ["apply"] }] });
2689
2696
  }
2690
2697
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDateTimePickerComponent, decorators: [{
2691
2698
  type: Component,
@@ -2956,7 +2963,7 @@ class EcabsDateRangePickerComponent extends EcabsElementBaseComponent {
2956
2963
  multi: true,
2957
2964
  },
2958
2965
  UnsubscribeService,
2959
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <mat-date-range-input [rangePicker]=\"picker\" (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 (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-container:hover .mat-calendar-body-cell.mat-calendar-body-disabled .mat-calendar-body-cell-content{background-color:transparent!important}.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: i5$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i5$2.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i5$2.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i5$2.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i5$2.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i5$2.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.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"], outputs: ["apply"] }] });
2966
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <mat-date-range-input [rangePicker]=\"picker\" (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 (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-container:hover .mat-calendar-body-cell.mat-calendar-body-disabled .mat-calendar-body-cell-content{background-color:transparent!important}.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: i5$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$1.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i5$1.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i5$1.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i5$1.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i5$1.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i5$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"], outputs: ["apply"] }] });
2960
2967
  }
2961
2968
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDateRangePickerComponent, decorators: [{
2962
2969
  type: Component,
@@ -3375,7 +3382,7 @@ class EcabsDateTimeRangePickerComponent extends EcabsElementBaseComponent {
3375
3382
  },
3376
3383
  DecimalPipe,
3377
3384
  UnsubscribeService,
3378
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled || controlDate?.disabled\"\r\n [matDatepicker]=\"picker\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker\r\n (opened)=\"opened()\"\r\n #picker\r\n [calendarHeaderComponent]=\"header\"\r\n [touchUi]=\"touchUi\"\r\n >\r\n <mat-datepicker-actions>\r\n <div class=\"flex flex-col w-full gap-y-4\">\r\n <div class=\"flex gap-2 justify-center items-center\">\r\n <div class=\"flex flex-col justify-center\">\r\n <div class=\"text-center\">{{ from ?? translationConfig?.from }}</div>\r\n <div class=\"flex gap-2 justify-center items-center\">\r\n <input\r\n class=\"block form-field__input time\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hoursFrom\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hoursFrom\"\r\n />\r\n\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutesFrom\"\r\n [(ngModel)]=\"minutesFrom\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"time--inputs\"></div>\r\n <div class=\"flex gap-2 justify-center items-center mb-5\">\r\n <div class=\"flex flex-col justify-center\">\r\n <div class=\"text-center\">{{ to ?? translationConfig?.to }}</div>\r\n <div class=\"flex gap-2 justify-center items-center\">\r\n <input\r\n class=\"form-field__input time\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hoursTo\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hoursTo\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutesTo\"\r\n [(ngModel)]=\"minutesTo\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <ecabs-date-picker-actions [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n (apply)=\"onApply()\">\r\n </ecabs-date-picker-actions>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled || controlDate?.disabled\"\r\n ecabsTime\r\n [all]=\"allLabel\"\r\n [timeRange]=\"true\"\r\n (blur)=\"onTouch()\"\r\n (blur)=\"blurChange($event)\"\r\n (keyup)=\"blurChange($event)\"\r\n (keydown)=\"keydownChange($event)\"\r\n />\r\n <button type=\"button\" class=\"text-gray-500 -translate-x-9\" (click)=\"picker.open()\">\r\n <mat-icon>access_time</mat-icon>\r\n </button>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [".time--inputs:after{position:absolute;content:\"\"}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0}.time--inputs{position:relative;margin-bottom:2.4rem}.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300);bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}\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: i5$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$2.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: EcabsNumberBorderDirective, selector: "[ecabsNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel"], outputs: ["apply"] }, { kind: "directive", type: EcabsMaskTimeDirective, selector: "[ecabsTime]", inputs: ["timeRange", "all"] }] });
3385
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled || controlDate?.disabled\"\r\n [matDatepicker]=\"picker\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker\r\n (opened)=\"opened()\"\r\n #picker\r\n [calendarHeaderComponent]=\"header\"\r\n [touchUi]=\"touchUi\"\r\n >\r\n <mat-datepicker-actions>\r\n <div class=\"flex flex-col w-full gap-y-4\">\r\n <div class=\"flex gap-2 justify-center items-center\">\r\n <div class=\"flex flex-col justify-center\">\r\n <div class=\"text-center\">{{ from ?? translationConfig?.from }}</div>\r\n <div class=\"flex gap-2 justify-center items-center\">\r\n <input\r\n class=\"block form-field__input time\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hoursFrom\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hoursFrom\"\r\n />\r\n\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutesFrom\"\r\n [(ngModel)]=\"minutesFrom\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"time--inputs\"></div>\r\n <div class=\"flex gap-2 justify-center items-center mb-5\">\r\n <div class=\"flex flex-col justify-center\">\r\n <div class=\"text-center\">{{ to ?? translationConfig?.to }}</div>\r\n <div class=\"flex gap-2 justify-center items-center\">\r\n <input\r\n class=\"form-field__input time\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hoursTo\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hoursTo\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutesTo\"\r\n [(ngModel)]=\"minutesTo\"\r\n ecabsDigitsOnly\r\n ecabsNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <ecabs-date-picker-actions [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n (apply)=\"onApply()\">\r\n </ecabs-date-picker-actions>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled || controlDate?.disabled\"\r\n ecabsTime\r\n [all]=\"allLabel\"\r\n [timeRange]=\"true\"\r\n (blur)=\"onTouch()\"\r\n (blur)=\"blurChange($event)\"\r\n (keyup)=\"blurChange($event)\"\r\n (keydown)=\"keydownChange($event)\"\r\n />\r\n <button type=\"button\" class=\"text-gray-500 -translate-x-9\" (click)=\"picker.open()\">\r\n <mat-icon>access_time</mat-icon>\r\n </button>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [".time--inputs:after{position:absolute;content:\"\"}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0}.time--inputs{position:relative;margin-bottom:2.4rem}.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300);bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}\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: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$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: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: EcabsNumberBorderDirective, selector: "[ecabsNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel"], outputs: ["apply"] }, { kind: "directive", type: EcabsMaskTimeDirective, selector: "[ecabsTime]", inputs: ["timeRange", "all"] }] });
3379
3386
  }
3380
3387
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDateTimeRangePickerComponent, decorators: [{
3381
3388
  type: Component,
@@ -3535,7 +3542,7 @@ class EcabsIncrementComponent extends EcabsElementBaseComponent {
3535
3542
  useExisting: EcabsIncrementComponent,
3536
3543
  multi: true,
3537
3544
  },
3538
- ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <input ecabsDigitsOnly [digitsOnly]=\"digitsOnly\" [decimal]=\"allowDecimal\" [allowHyphen]=\"allowHyphen\"\r\n class=\"form-field__input\"\r\n [type]=\"type\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n [disabled]=\"disabled\"\r\n [maxlength]=\"maxLength\"/>\r\n\r\n <div class=\"incrementor\">\r\n <mat-icon (click)=\"increment()\">add</mat-icon>\r\n <mat-icon (click)=\"decrement()\">remove</mat-icon>\r\n </div>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [":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)}:host::ng-deep .incrementor{border-left:1px solid var(--color-gray-300);position:absolute;display:flex;flex-direction:column;top:1px;bottom:1px;right:1px}:host::ng-deep .incrementor .mat-icon{font-size:20px;font-size:1.25rem;margin-right:0;line-height:20px;cursor:pointer;text-align:center;flex:1}:host::ng-deep .incrementor .mat-icon:first-of-type{border-bottom:1px solid var(--color-gray-300)}:host::ng-deep .incrementor .mat-icon:hover{color:var(--color-brand-dark)}:host::ng-deep .form-field>div{line-height:1}\n"], dependencies: [{ kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }] });
3545
+ ], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper\">\r\n <input ecabsDigitsOnly [digitsOnly]=\"digitsOnly\" [decimal]=\"allowDecimal\" [allowHyphen]=\"allowHyphen\"\r\n class=\"form-field__input\"\r\n [type]=\"type\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"value\"\r\n [placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n [disabled]=\"disabled\"\r\n [maxlength]=\"maxLength\"/>\r\n\r\n <div class=\"incrementor\">\r\n <mat-icon (click)=\"increment()\">add</mat-icon>\r\n <mat-icon (click)=\"decrement()\">remove</mat-icon>\r\n </div>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [":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)}:host::ng-deep .incrementor{border-left:1px solid var(--color-gray-300);position:absolute;display:flex;flex-direction:column;top:1px;bottom:1px;right:1px}:host::ng-deep .incrementor .mat-icon{font-size:20px;font-size:1.25rem;margin-right:0;line-height:20px;cursor:pointer;text-align:center;flex:1}:host::ng-deep .incrementor .mat-icon:first-of-type{border-bottom:1px solid var(--color-gray-300)}:host::ng-deep .incrementor .mat-icon:hover{color:var(--color-brand-dark)}:host::ng-deep .form-field>div{line-height:1}\n"], dependencies: [{ kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { 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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: EcabsDigitsOnlyDirective, selector: "[ecabsDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }] });
3539
3546
  }
3540
3547
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsIncrementComponent, decorators: [{
3541
3548
  type: Component,
@@ -3587,6 +3594,999 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3587
3594
  }]
3588
3595
  }] });
3589
3596
 
3597
+ class CountryCode {
3598
+ allCountries = [
3599
+ ['Afghanistan (‫افغانستان‬‎)', 'af', '93'],
3600
+ ['Albania (Shqipëri)', 'al', '355'],
3601
+ ['Algeria (‫الجزائر‬‎)', 'dz', '213'],
3602
+ ['American Samoa', 'as', '1684'],
3603
+ ['Andorra', 'ad', '376'],
3604
+ ['Angola', 'ao', '244'],
3605
+ ['Anguilla', 'ai', '1264'],
3606
+ ['Antigua and Barbuda', 'ag', '1268'],
3607
+ ['Argentina', 'ar', '54'],
3608
+ ['Armenia (Հայաստան)', 'am', '374'],
3609
+ ['Aruba', 'aw', '297'],
3610
+ ['Australia', 'au', '61', 0],
3611
+ ['Austria (Österreich)', 'at', '43'],
3612
+ ['Azerbaijan (Azərbaycan)', 'az', '994'],
3613
+ ['Bahamas', 'bs', '1242'],
3614
+ ['Bahrain (‫البحرين‬‎)', 'bh', '973'],
3615
+ ['Bangladesh (বাংলাদেশ)', 'bd', '880'],
3616
+ ['Barbados', 'bb', '1246'],
3617
+ ['Belarus (Беларусь)', 'by', '375'],
3618
+ ['Belgium (België)', 'be', '32'],
3619
+ ['Belize', 'bz', '501'],
3620
+ ['Benin (Bénin)', 'bj', '229'],
3621
+ ['Bermuda', 'bm', '1441'],
3622
+ ['Bhutan (འབྲུག)', 'bt', '975'],
3623
+ ['Bolivia', 'bo', '591'],
3624
+ ['Bosnia and Herzegovina (Босна и Херцеговина)', 'ba', '387'],
3625
+ ['Botswana', 'bw', '267'],
3626
+ ['Brazil (Brasil)', 'br', '55'],
3627
+ ['British Indian Ocean Territory', 'io', '246'],
3628
+ ['British Virgin Islands', 'vg', '1284'],
3629
+ ['Brunei', 'bn', '673'],
3630
+ ['Bulgaria (България)', 'bg', '359'],
3631
+ ['Burkina Faso', 'bf', '226'],
3632
+ ['Burundi (Uburundi)', 'bi', '257'],
3633
+ ['Cambodia (កម្ពុជា)', 'kh', '855'],
3634
+ ['Cameroon (Cameroun)', 'cm', '237'],
3635
+ [
3636
+ 'Canada',
3637
+ 'ca',
3638
+ '1',
3639
+ 1,
3640
+ [
3641
+ '204',
3642
+ '226',
3643
+ '236',
3644
+ '249',
3645
+ '250',
3646
+ '289',
3647
+ '306',
3648
+ '343',
3649
+ '365',
3650
+ '387',
3651
+ '403',
3652
+ '416',
3653
+ '418',
3654
+ '431',
3655
+ '437',
3656
+ '438',
3657
+ '450',
3658
+ '506',
3659
+ '514',
3660
+ '519',
3661
+ '548',
3662
+ '579',
3663
+ '581',
3664
+ '587',
3665
+ '604',
3666
+ '613',
3667
+ '639',
3668
+ '647',
3669
+ '672',
3670
+ '705',
3671
+ '709',
3672
+ '742',
3673
+ '778',
3674
+ '780',
3675
+ '782',
3676
+ '807',
3677
+ '819',
3678
+ '825',
3679
+ '867',
3680
+ '873',
3681
+ '902',
3682
+ '905',
3683
+ ],
3684
+ ],
3685
+ ['Cape Verde (Kabu Verdi)', 'cv', '238'],
3686
+ ['Caribbean Netherlands', 'bq', '599', 1],
3687
+ ['Cayman Islands', 'ky', '1345'],
3688
+ ['Central African Republic (République centrafricaine)', 'cf', '236'],
3689
+ ['Chad (Tchad)', 'td', '235'],
3690
+ ['Chile', 'cl', '56'],
3691
+ ['China (中国)', 'cn', '86'],
3692
+ ['Christmas Island', 'cx', '61', 2],
3693
+ ['Cocos (Keeling) Islands', 'cc', '61', 1],
3694
+ ['Colombia', 'co', '57'],
3695
+ ['Comoros (‫جزر القمر‬‎)', 'km', '269'],
3696
+ ['Congo (DRC) (Jamhuri ya Kidemokrasia ya Kongo)', 'cd', '243'],
3697
+ ['Congo (Republic) (Congo-Brazzaville)', 'cg', '242'],
3698
+ ['Cook Islands', 'ck', '682'],
3699
+ ['Costa Rica', 'cr', '506'],
3700
+ ['Côte d’Ivoire', 'ci', '225'],
3701
+ ['Croatia (Hrvatska)', 'hr', '385'],
3702
+ ['Cuba', 'cu', '53'],
3703
+ ['Curaçao', 'cw', '599', 0],
3704
+ ['Cyprus (Κύπρος)', 'cy', '357'],
3705
+ ['Czech Republic (Česká republika)', 'cz', '420'],
3706
+ ['Denmark (Danmark)', 'dk', '45'],
3707
+ ['Djibouti', 'dj', '253'],
3708
+ ['Dominica', 'dm', '1767'],
3709
+ [
3710
+ 'Dominican Republic (República Dominicana)',
3711
+ 'do',
3712
+ '1',
3713
+ 2,
3714
+ ['809', '829', '849'],
3715
+ ],
3716
+ ['Ecuador', 'ec', '593'],
3717
+ ['Egypt (‫مصر‬‎)', 'eg', '20'],
3718
+ ['El Salvador', 'sv', '503'],
3719
+ ['Equatorial Guinea (Guinea Ecuatorial)', 'gq', '240'],
3720
+ ['Eritrea', 'er', '291'],
3721
+ ['Estonia (Eesti)', 'ee', '372'],
3722
+ ['Ethiopia', 'et', '251'],
3723
+ ['Falkland Islands (Islas Malvinas)', 'fk', '500'],
3724
+ ['Faroe Islands (Føroyar)', 'fo', '298'],
3725
+ ['Fiji', 'fj', '679'],
3726
+ ['Finland (Suomi)', 'fi', '358', 0],
3727
+ ['France', 'fr', '33'],
3728
+ ['French Guiana (Guyane française)', 'gf', '594'],
3729
+ ['French Polynesia (Polynésie française)', 'pf', '689'],
3730
+ ['Gabon', 'ga', '241'],
3731
+ ['Gambia', 'gm', '220'],
3732
+ ['Georgia (საქართველო)', 'ge', '995'],
3733
+ ['Germany (Deutschland)', 'de', '49'],
3734
+ ['Ghana (Gaana)', 'gh', '233'],
3735
+ ['Gibraltar', 'gi', '350'],
3736
+ ['Greece (Ελλάδα)', 'gr', '30'],
3737
+ ['Greenland (Kalaallit Nunaat)', 'gl', '299'],
3738
+ ['Grenada', 'gd', '1473'],
3739
+ ['Guadeloupe', 'gp', '590', 0],
3740
+ ['Guam', 'gu', '1671'],
3741
+ ['Guatemala', 'gt', '502'],
3742
+ ['Guernsey', 'gg', '44', 1],
3743
+ ['Guinea (Guinée)', 'gn', '224'],
3744
+ ['Guinea-Bissau (Guiné Bissau)', 'gw', '245'],
3745
+ ['Guyana', 'gy', '592'],
3746
+ ['Haiti', 'ht', '509'],
3747
+ ['Honduras', 'hn', '504'],
3748
+ ['Hong Kong (香港)', 'hk', '852'],
3749
+ ['Hungary (Magyarország)', 'hu', '36'],
3750
+ ['Iceland (Ísland)', 'is', '354'],
3751
+ ['India (भारत)', 'in', '91'],
3752
+ ['Indonesia', 'id', '62'],
3753
+ ['Iran (‫ایران‬‎)', 'ir', '98'],
3754
+ ['Iraq (‫العراق‬‎)', 'iq', '964'],
3755
+ ['Ireland', 'ie', '353'],
3756
+ ['Isle of Man', 'im', '44', 2],
3757
+ ['Israel (‫ישראל‬‎)', 'il', '972'],
3758
+ ['Italy (Italia)', 'it', '39', 0],
3759
+ ['Jamaica', 'jm', '1', 4, ['876', '658']],
3760
+ ['Japan (日本)', 'jp', '81'],
3761
+ ['Jersey', 'je', '44', 3],
3762
+ ['Jordan (‫الأردن‬‎)', 'jo', '962'],
3763
+ ['Kazakhstan (Казахстан)', 'kz', '7', 1],
3764
+ ['Kenya', 'ke', '254'],
3765
+ ['Kiribati', 'ki', '686'],
3766
+ ['Kosovo', 'xk', '383'],
3767
+ ['Kuwait (‫الكويت‬‎)', 'kw', '965'],
3768
+ ['Kyrgyzstan (Кыргызстан)', 'kg', '996'],
3769
+ ['Laos (ລາວ)', 'la', '856'],
3770
+ ['Latvia (Latvija)', 'lv', '371'],
3771
+ ['Lebanon (‫لبنان‬‎)', 'lb', '961'],
3772
+ ['Lesotho', 'ls', '266'],
3773
+ ['Liberia', 'lr', '231'],
3774
+ ['Libya (‫ليبيا‬‎)', 'ly', '218'],
3775
+ ['Liechtenstein', 'li', '423'],
3776
+ ['Lithuania (Lietuva)', 'lt', '370'],
3777
+ ['Luxembourg', 'lu', '352'],
3778
+ ['Macau (澳門)', 'mo', '853'],
3779
+ ['Macedonia (FYROM) (Македонија)', 'mk', '389'],
3780
+ ['Madagascar (Madagasikara)', 'mg', '261'],
3781
+ ['Malawi', 'mw', '265'],
3782
+ ['Malaysia', 'my', '60'],
3783
+ ['Maldives', 'mv', '960'],
3784
+ ['Mali', 'ml', '223'],
3785
+ ['Malta', 'mt', '356'],
3786
+ ['Marshall Islands', 'mh', '692'],
3787
+ ['Martinique', 'mq', '596'],
3788
+ ['Mauritania (‫موريتانيا‬‎)', 'mr', '222'],
3789
+ ['Mauritius (Moris)', 'mu', '230'],
3790
+ ['Mayotte', 'yt', '262', 1],
3791
+ ['Mexico (México)', 'mx', '52'],
3792
+ ['Micronesia', 'fm', '691'],
3793
+ ['Moldova (Republica Moldova)', 'md', '373'],
3794
+ ['Monaco', 'mc', '377'],
3795
+ ['Mongolia (Монгол)', 'mn', '976'],
3796
+ ['Montenegro (Crna Gora)', 'me', '382'],
3797
+ ['Montserrat', 'ms', '1664'],
3798
+ ['Morocco (‫المغرب‬‎)', 'ma', '212', 0],
3799
+ ['Mozambique (Moçambique)', 'mz', '258'],
3800
+ ['Myanmar (Burma) (မြန်မာ)', 'mm', '95'],
3801
+ ['Namibia (Namibië)', 'na', '264'],
3802
+ ['Nauru', 'nr', '674'],
3803
+ ['Nepal (नेपाल)', 'np', '977'],
3804
+ ['Netherlands (Nederland)', 'nl', '31'],
3805
+ ['New Caledonia (Nouvelle-Calédonie)', 'nc', '687'],
3806
+ ['New Zealand', 'nz', '64'],
3807
+ ['Nicaragua', 'ni', '505'],
3808
+ ['Niger (Nijar)', 'ne', '227'],
3809
+ ['Nigeria', 'ng', '234'],
3810
+ ['Niue', 'nu', '683'],
3811
+ ['Norfolk Island', 'nf', '672'],
3812
+ ['North Korea (조선 민주주의 인민 공화국)', 'kp', '850'],
3813
+ ['Northern Mariana Islands', 'mp', '1670'],
3814
+ ['Norway (Norge)', 'no', '47', 0],
3815
+ ['Oman (‫عُمان‬‎)', 'om', '968'],
3816
+ ['Pakistan (‫پاکستان‬‎)', 'pk', '92'],
3817
+ ['Palau', 'pw', '680'],
3818
+ ['Palestine (‫فلسطين‬‎)', 'ps', '970'],
3819
+ ['Panama (Panamá)', 'pa', '507'],
3820
+ ['Papua New Guinea', 'pg', '675'],
3821
+ ['Paraguay', 'py', '595'],
3822
+ ['Peru (Perú)', 'pe', '51'],
3823
+ ['Philippines', 'ph', '63'],
3824
+ ['Poland (Polska)', 'pl', '48'],
3825
+ ['Portugal', 'pt', '351'],
3826
+ ['Puerto Rico', 'pr', '1', 3, ['787', '939']],
3827
+ ['Qatar (‫قطر‬‎)', 'qa', '974'],
3828
+ ['Réunion (La Réunion)', 're', '262', 0],
3829
+ ['Romania (România)', 'ro', '40'],
3830
+ ['Russia (Россия)', 'ru', '7', 0],
3831
+ ['Rwanda', 'rw', '250'],
3832
+ ['Saint Barthélemy', 'bl', '590', 1],
3833
+ ['Saint Helena', 'sh', '290'],
3834
+ ['Saint Kitts and Nevis', 'kn', '1869'],
3835
+ ['Saint Lucia', 'lc', '1758'],
3836
+ ['Saint Martin (Saint-Martin (partie française))', 'mf', '590', 2],
3837
+ ['Saint Pierre and Miquelon (Saint-Pierre-et-Miquelon)', 'pm', '508'],
3838
+ ['Saint Vincent and the Grenadines', 'vc', '1784'],
3839
+ ['Samoa', 'ws', '685'],
3840
+ ['San Marino', 'sm', '378'],
3841
+ ['São Tomé and Príncipe (São Tomé e Príncipe)', 'st', '239'],
3842
+ ['Saudi Arabia (‫المملكة العربية السعودية‬‎)', 'sa', '966'],
3843
+ ['Senegal (Sénégal)', 'sn', '221'],
3844
+ ['Serbia (Србија)', 'rs', '381'],
3845
+ ['Seychelles', 'sc', '248'],
3846
+ ['Sierra Leone', 'sl', '232'],
3847
+ ['Singapore', 'sg', '65'],
3848
+ ['Sint Maarten', 'sx', '1721'],
3849
+ ['Slovakia (Slovensko)', 'sk', '421'],
3850
+ ['Slovenia (Slovenija)', 'si', '386'],
3851
+ ['Solomon Islands', 'sb', '677'],
3852
+ ['Somalia (Soomaaliya)', 'so', '252'],
3853
+ ['South Africa', 'za', '27'],
3854
+ ['South Korea (대한민국)', 'kr', '82'],
3855
+ ['South Sudan (‫جنوب السودان‬‎)', 'ss', '211'],
3856
+ ['Spain (España)', 'es', '34'],
3857
+ ['Sri Lanka (ශ්‍රී ලංකාව)', 'lk', '94'],
3858
+ ['Sudan (‫السودان‬‎)', 'sd', '249'],
3859
+ ['Suriname', 'sr', '597'],
3860
+ ['Svalbard and Jan Mayen', 'sj', '47', 1],
3861
+ ['Swaziland', 'sz', '268'],
3862
+ ['Sweden (Sverige)', 'se', '46'],
3863
+ ['Switzerland (Schweiz)', 'ch', '41'],
3864
+ ['Syria (‫سوريا‬‎)', 'sy', '963'],
3865
+ ['Taiwan (台灣)', 'tw', '886'],
3866
+ ['Tajikistan', 'tj', '992'],
3867
+ ['Tanzania', 'tz', '255'],
3868
+ ['Thailand (ไทย)', 'th', '66'],
3869
+ ['Timor-Leste', 'tl', '670'],
3870
+ ['Togo', 'tg', '228'],
3871
+ ['Tokelau', 'tk', '690'],
3872
+ ['Tonga', 'to', '676'],
3873
+ ['Trinidad and Tobago', 'tt', '1868'],
3874
+ ['Tunisia (‫تونس‬‎)', 'tn', '216'],
3875
+ ['Turkey (Türkiye)', 'tr', '90'],
3876
+ ['Turkmenistan', 'tm', '993'],
3877
+ ['Turks and Caicos Islands', 'tc', '1649'],
3878
+ ['Tuvalu', 'tv', '688'],
3879
+ ['U.S. Virgin Islands', 'vi', '1340'],
3880
+ ['Uganda', 'ug', '256'],
3881
+ ['Ukraine (Україна)', 'ua', '380'],
3882
+ ['United Arab Emirates (‫الإمارات العربية المتحدة‬‎)', 'ae', '971'],
3883
+ ['United Kingdom', 'gb', '44', 0],
3884
+ ['United States', 'us', '1', 0],
3885
+ ['Uruguay', 'uy', '598'],
3886
+ ['Uzbekistan (Oʻzbekiston)', 'uz', '998'],
3887
+ ['Vanuatu', 'vu', '678'],
3888
+ ['Vatican City (Città del Vaticano)', 'va', '39', 1],
3889
+ ['Venezuela', 've', '58'],
3890
+ ['Vietnam (Việt Nam)', 'vn', '84'],
3891
+ ['Wallis and Futuna (Wallis-et-Futuna)', 'wf', '681'],
3892
+ ['Western Sahara (‫الصحراء الغربية‬‎)', 'eh', '212', 1],
3893
+ ['Yemen (‫اليمن‬‎)', 'ye', '967'],
3894
+ ['Zambia', 'zm', '260'],
3895
+ ['Zimbabwe', 'zw', '263'],
3896
+ ['Åland Islands', 'ax', '358', 1],
3897
+ ];
3898
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CountryCode, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
3899
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CountryCode });
3900
+ }
3901
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CountryCode, decorators: [{
3902
+ type: Injectable
3903
+ }] });
3904
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
3905
+ const Examples = {
3906
+ '001': '001',
3907
+ AC: '40123',
3908
+ AD: '312345',
3909
+ AE: '501234567',
3910
+ AF: '701234567',
3911
+ AG: '2684641234',
3912
+ AI: '2642351234',
3913
+ AL: '662123456',
3914
+ AM: '77123456',
3915
+ AO: '923123456',
3916
+ AR: '91123456789',
3917
+ AS: '6847331234',
3918
+ AT: '664123456',
3919
+ AU: '412345678',
3920
+ AW: '5601234',
3921
+ AX: '412345678',
3922
+ AZ: '401234567',
3923
+ BA: '61123456',
3924
+ BB: '2462501234',
3925
+ BD: '1812345678',
3926
+ BE: '470123456',
3927
+ BF: '70123456',
3928
+ BG: '48123456',
3929
+ BH: '36001234',
3930
+ BI: '79561234',
3931
+ BJ: '90011234',
3932
+ BL: '690001234',
3933
+ BM: '4413701234',
3934
+ BN: '7123456',
3935
+ BO: '71234567',
3936
+ BQ: '3181234',
3937
+ BR: '11961234567',
3938
+ BS: '2423591234',
3939
+ BT: '17123456',
3940
+ BW: '71123456',
3941
+ BY: '294911911',
3942
+ BZ: '6221234',
3943
+ CA: '5062345678',
3944
+ CC: '412345678',
3945
+ CD: '991234567',
3946
+ CF: '70012345',
3947
+ CG: '061234567',
3948
+ CH: '781234567',
3949
+ CI: '01234567',
3950
+ CK: '71234',
3951
+ CL: '221234567',
3952
+ CM: '671234567',
3953
+ CN: '13123456789',
3954
+ CO: '3211234567',
3955
+ CR: '83123456',
3956
+ CU: '51234567',
3957
+ CV: '9911234',
3958
+ CW: '95181234',
3959
+ CX: '412345678',
3960
+ CY: '96123456',
3961
+ CZ: '601123456',
3962
+ DE: '15123456789',
3963
+ DJ: '77831001',
3964
+ DK: '32123456',
3965
+ DM: '7672251234',
3966
+ DO: '8092345678',
3967
+ DZ: '551234567',
3968
+ EC: '991234567',
3969
+ EE: '51234567',
3970
+ EG: '1001234567',
3971
+ EH: '650123456',
3972
+ ER: '7123456',
3973
+ ES: '612345678',
3974
+ ET: '911234567',
3975
+ FI: '412345678',
3976
+ FJ: '7012345',
3977
+ FK: '51234',
3978
+ FM: '3501234',
3979
+ FO: '211234',
3980
+ FR: '612345678',
3981
+ GA: '06031234',
3982
+ GB: '7400123456',
3983
+ GD: '4734031234',
3984
+ GE: '555123456',
3985
+ GF: '694201234',
3986
+ GG: '7781123456',
3987
+ GH: '231234567',
3988
+ GI: '57123456',
3989
+ GL: '221234',
3990
+ GM: '3012345',
3991
+ GN: '601123456',
3992
+ GP: '690001234',
3993
+ GQ: '222123456',
3994
+ GR: '6912345678',
3995
+ GT: '51234567',
3996
+ GU: '6713001234',
3997
+ GW: '955012345',
3998
+ GY: '6091234',
3999
+ HK: '51234567',
4000
+ HN: '91234567',
4001
+ HR: '921234567',
4002
+ HT: '34101234',
4003
+ HU: '201234567',
4004
+ ID: '812345678',
4005
+ IE: '850123456',
4006
+ IL: '502345678',
4007
+ IM: '7924123456',
4008
+ IN: '8123456789',
4009
+ IO: '3801234',
4010
+ IQ: '7912345678',
4011
+ IR: '9123456789',
4012
+ IS: '6111234',
4013
+ IT: '3123456789',
4014
+ JE: '7797712345',
4015
+ JM: '8762101234',
4016
+ JO: '790123456',
4017
+ JP: '9012345678',
4018
+ KE: '712123456',
4019
+ KG: '700123456',
4020
+ KH: '91234567',
4021
+ KI: '72001234',
4022
+ KM: '3212345',
4023
+ KN: '8697652917',
4024
+ KP: '1921234567',
4025
+ KR: '1000000000',
4026
+ KW: '50012345',
4027
+ KY: '3453231234',
4028
+ KZ: '7710009998',
4029
+ LA: '2023123456',
4030
+ LB: '71123456',
4031
+ LC: '7582845678',
4032
+ LI: '660234567',
4033
+ LK: '712345678',
4034
+ LR: '770123456',
4035
+ LS: '50123456',
4036
+ LT: '61234567',
4037
+ LU: '628123456',
4038
+ LV: '21234567',
4039
+ LY: '912345678',
4040
+ MA: '650123456',
4041
+ MC: '612345678',
4042
+ MD: '62112345',
4043
+ ME: '67622901',
4044
+ MF: '690001234',
4045
+ MG: '321234567',
4046
+ MH: '2351234',
4047
+ MK: '72345678',
4048
+ ML: '65012345',
4049
+ MM: '92123456',
4050
+ MN: '88123456',
4051
+ MO: '66123456',
4052
+ MP: '6702345678',
4053
+ MQ: '696201234',
4054
+ MR: '22123456',
4055
+ MS: '6644923456',
4056
+ MT: '96961234',
4057
+ MU: '52512345',
4058
+ MV: '7712345',
4059
+ MW: '991234567',
4060
+ MX: '12221234567',
4061
+ MY: '123456789',
4062
+ MZ: '821234567',
4063
+ NA: '811234567',
4064
+ NC: '751234',
4065
+ NE: '93123456',
4066
+ NF: '381234',
4067
+ NG: '8021234567',
4068
+ NI: '81234567',
4069
+ NL: '612345678',
4070
+ NO: '40612345',
4071
+ NP: '9841234567',
4072
+ NR: '5551234',
4073
+ NU: '8884012',
4074
+ NZ: '211234567',
4075
+ OM: '92123456',
4076
+ PA: '61234567',
4077
+ PE: '912345678',
4078
+ PF: '87123456',
4079
+ PG: '70123456',
4080
+ PH: '9051234567',
4081
+ PK: '3012345678',
4082
+ PL: '512345678',
4083
+ PM: '551234',
4084
+ PR: '7872345678',
4085
+ PS: '599123456',
4086
+ PT: '912345678',
4087
+ PW: '6201234',
4088
+ PY: '961456789',
4089
+ QA: '33123456',
4090
+ RE: '692123456',
4091
+ RO: '712034567',
4092
+ RS: '601234567',
4093
+ RU: '9123456789',
4094
+ RW: '720123456',
4095
+ SA: '512345678',
4096
+ SB: '7421234',
4097
+ SC: '2510123',
4098
+ SD: '911231234',
4099
+ SE: '701234567',
4100
+ SG: '81234567',
4101
+ SH: '51234',
4102
+ SI: '31234567',
4103
+ SJ: '41234567',
4104
+ SK: '912123456',
4105
+ SL: '25123456',
4106
+ SM: '66661212',
4107
+ SN: '701234567',
4108
+ SO: '71123456',
4109
+ SR: '7412345',
4110
+ SS: '977123456',
4111
+ ST: '9812345',
4112
+ SV: '70123456',
4113
+ SX: '7215205678',
4114
+ SY: '944567890',
4115
+ SZ: '76123456',
4116
+ TA: '8999',
4117
+ TC: '6492311234',
4118
+ TD: '63012345',
4119
+ TG: '90112345',
4120
+ TH: '812345678',
4121
+ TJ: '917123456',
4122
+ TK: '7290',
4123
+ TL: '77212345',
4124
+ TM: '66123456',
4125
+ TN: '20123456',
4126
+ TO: '7715123',
4127
+ TR: '5012345678',
4128
+ TT: '8682911234',
4129
+ TV: '901234',
4130
+ TW: '912345678',
4131
+ TZ: '621234567',
4132
+ UA: '501234567',
4133
+ UG: '712345678',
4134
+ US: '2015550123',
4135
+ UY: '94231234',
4136
+ UZ: '912345678',
4137
+ VA: '3123456789',
4138
+ VC: '7844301234',
4139
+ VE: '4121234567',
4140
+ VG: '2843001234',
4141
+ VI: '3406421234',
4142
+ VN: '912345678',
4143
+ VU: '5912345',
4144
+ WF: '501234',
4145
+ WS: '7212345',
4146
+ XK: '43201234',
4147
+ YE: '712345678',
4148
+ YT: '639012345',
4149
+ ZA: '711234567',
4150
+ ZM: '955123456',
4151
+ ZW: '712345678',
4152
+ };
4153
+
4154
+ const phoneNumberValidator = (control) => {
4155
+ const error = { validatePhoneNumber: true };
4156
+ let numberInstance;
4157
+ if (control.value) {
4158
+ try {
4159
+ numberInstance = parsePhoneNumber(control.value);
4160
+ }
4161
+ catch (e) {
4162
+ control.setValue(null);
4163
+ return error;
4164
+ }
4165
+ if (numberInstance && !numberInstance.isValid()) {
4166
+ control.setValue(null);
4167
+ if (!control.touched) {
4168
+ control.markAsTouched();
4169
+ }
4170
+ return error;
4171
+ }
4172
+ }
4173
+ return null;
4174
+ };
4175
+
4176
+ class SearchPipe {
4177
+ transform(country, searchCriteria) {
4178
+ if (!searchCriteria || searchCriteria === '') {
4179
+ return true;
4180
+ }
4181
+ return `${country.name}+${country.dialCode}`
4182
+ .toLowerCase()
4183
+ .includes(searchCriteria.toLowerCase());
4184
+ }
4185
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
4186
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SearchPipe, isStandalone: true, name: "search" });
4187
+ }
4188
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchPipe, decorators: [{
4189
+ type: Pipe,
4190
+ args: [{
4191
+ name: 'search',
4192
+ standalone: true,
4193
+ }]
4194
+ }] });
4195
+
4196
+ // eslint-disable @typescript-eslint/no-explicit-any
4197
+ class NgxMatIntlTelInputBase {
4198
+ _defaultErrorStateMatcher;
4199
+ _parentForm;
4200
+ _parentFormGroup;
4201
+ ngControl;
4202
+ stateChanges = new Subject();
4203
+ constructor(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl) {
4204
+ this._defaultErrorStateMatcher = _defaultErrorStateMatcher;
4205
+ this._parentForm = _parentForm;
4206
+ this._parentFormGroup = _parentFormGroup;
4207
+ this.ngControl = ngControl;
4208
+ }
4209
+ }
4210
+ const _NgxMatIntlTelInputMixinBase = mixinErrorState(NgxMatIntlTelInputBase);
4211
+ class EcabsBasePhoneComponent extends _NgxMatIntlTelInputMixinBase {
4212
+ changeDetectorRef;
4213
+ countryCodeData;
4214
+ fm;
4215
+ elRef;
4216
+ ngControl;
4217
+ preferredCountries = [];
4218
+ enablePlaceholder = true;
4219
+ inputPlaceholder;
4220
+ cssClass;
4221
+ name;
4222
+ onlyCountries = [];
4223
+ errorStateMatcher = new ErrorStateMatcher();
4224
+ enableSearch = false;
4225
+ searchPlaceholder;
4226
+ describedBy = '';
4227
+ debounceTimeMs = 500;
4228
+ get format() {
4229
+ return this._format;
4230
+ }
4231
+ get placeholder() {
4232
+ return this._placeholder || '';
4233
+ }
4234
+ get required() {
4235
+ return this._required;
4236
+ }
4237
+ get disabled() {
4238
+ return this._disabled;
4239
+ }
4240
+ countryChanged = new EventEmitter();
4241
+ matMenu;
4242
+ searchInput;
4243
+ id = `ecabs-intl-tel-input-${EcabsBasePhoneComponent.nextId++}`;
4244
+ get shouldLabelFloat() {
4245
+ return this.focused || !this.empty;
4246
+ }
4247
+ static nextId = 0;
4248
+ _changeSubject = new Subject();
4249
+ _placeholder;
4250
+ _required = false;
4251
+ _disabled = false;
4252
+ _previousFormattedNumber;
4253
+ _format = 'default';
4254
+ stateChanges = new Subject();
4255
+ focused = false;
4256
+ phoneNumber;
4257
+ allCountries = [];
4258
+ preferredCountriesInDropDown = [];
4259
+ selectedCountry;
4260
+ numberInstance;
4261
+ value;
4262
+ searchCriteria;
4263
+ get empty() {
4264
+ return !this.phoneNumber;
4265
+ }
4266
+ set format(value) {
4267
+ this._format = value;
4268
+ this.phoneNumber = this.formattedPhoneNumber;
4269
+ this.stateChanges.next(undefined);
4270
+ }
4271
+ set placeholder(value) {
4272
+ this._placeholder = value;
4273
+ this.stateChanges.next(undefined);
4274
+ }
4275
+ set required(value) {
4276
+ this._required = coerceBooleanProperty(value);
4277
+ this.stateChanges.next(undefined);
4278
+ }
4279
+ set disabled(value) {
4280
+ this._disabled = coerceBooleanProperty(value);
4281
+ this.stateChanges.next(undefined);
4282
+ }
4283
+ static getPhoneNumberPlaceHolder(countryISOCode) {
4284
+ const result = getExampleNumber(countryISOCode, Examples);
4285
+ // eslint-disable-next-line no-extra-boolean-cast
4286
+ return !!result ? result.number.toString() : undefined;
4287
+ }
4288
+ onTouched = () => { };
4289
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
4290
+ propagateChange = (_) => { };
4291
+ constructor(changeDetectorRef, countryCodeData, fm, elRef, ngControl, parentForm, parentFormGroup, defaultErrorStateMatcher) {
4292
+ super(defaultErrorStateMatcher, parentForm, parentFormGroup, ngControl);
4293
+ this.changeDetectorRef = changeDetectorRef;
4294
+ this.countryCodeData = countryCodeData;
4295
+ this.fm = fm;
4296
+ this.elRef = elRef;
4297
+ this.ngControl = ngControl;
4298
+ fm.monitor(elRef, true).subscribe((origin) => {
4299
+ if (this.focused && !origin) {
4300
+ this.onTouched();
4301
+ }
4302
+ this.focused = !!origin;
4303
+ this.stateChanges.next(undefined);
4304
+ });
4305
+ this.fetchCountryData();
4306
+ if (this.ngControl != null) {
4307
+ this.ngControl.valueAccessor = this;
4308
+ }
4309
+ }
4310
+ ngOnInit() {
4311
+ if (!this.searchPlaceholder) {
4312
+ this.searchPlaceholder = 'Search ...';
4313
+ }
4314
+ if (this.preferredCountries.length) {
4315
+ this.preferredCountries.forEach((iso2) => {
4316
+ const preferredCountry = this.allCountries
4317
+ .filter((c) => c.iso2 === iso2)
4318
+ .shift();
4319
+ if (preferredCountry) {
4320
+ this.preferredCountriesInDropDown.push(preferredCountry);
4321
+ }
4322
+ });
4323
+ }
4324
+ if (this.onlyCountries.length) {
4325
+ this.allCountries = this.allCountries.filter((c) => this.onlyCountries.includes(c.iso2));
4326
+ }
4327
+ if (this.numberInstance && this.numberInstance.country) {
4328
+ // If an existing number is present, we use it to determine selectedCountry
4329
+ this.selectedCountry = this.getCountry(this.numberInstance.country);
4330
+ }
4331
+ else {
4332
+ if (this.preferredCountriesInDropDown.length) {
4333
+ this.selectedCountry = this.preferredCountriesInDropDown[0];
4334
+ }
4335
+ else {
4336
+ this.selectedCountry = this.allCountries[0];
4337
+ }
4338
+ }
4339
+ this._changeSubject
4340
+ .pipe(debounceTime(this.debounceTimeMs))
4341
+ .subscribe(() => {
4342
+ this.onPhoneNumberChange();
4343
+ });
4344
+ this.countryChanged.emit(this.selectedCountry);
4345
+ this.changeDetectorRef.markForCheck();
4346
+ this.stateChanges.next(undefined);
4347
+ }
4348
+ ngDoCheck() {
4349
+ if (this.ngControl) {
4350
+ this.updateErrorState();
4351
+ }
4352
+ }
4353
+ ngOnDestroy() {
4354
+ this.stateChanges.complete();
4355
+ this.fm.stopMonitoring(this.elRef);
4356
+ this._changeSubject.complete();
4357
+ }
4358
+ onPhoneNumberChangeDebounce() {
4359
+ this._changeSubject.next(undefined);
4360
+ }
4361
+ onPhoneNumberChange() {
4362
+ try {
4363
+ this.numberInstance = parsePhoneNumberFromString(this.phoneNumber?.toString() || '', this.selectedCountry?.iso2.toUpperCase());
4364
+ this.formatAsYouTypeIfEnabled();
4365
+ this.value = this.numberInstance?.number;
4366
+ if (this.numberInstance && this.numberInstance.isValid()) {
4367
+ if (this.phoneNumber !== this.formattedPhoneNumber) {
4368
+ this.phoneNumber = this.formattedPhoneNumber;
4369
+ }
4370
+ if (this.selectedCountry?.iso2 !== this.numberInstance.country &&
4371
+ !!this.numberInstance.country) {
4372
+ this.selectedCountry = this.getCountry(this.numberInstance.country);
4373
+ this.countryChanged.emit(this.selectedCountry);
4374
+ }
4375
+ }
4376
+ }
4377
+ catch {
4378
+ // if no possible numbers are there,
4379
+ // then the full number is passed so that validator could be triggered and proper error could be shown
4380
+ this.value = this.phoneNumber?.toString();
4381
+ }
4382
+ this.propagateChange(this.value);
4383
+ this.changeDetectorRef.markForCheck();
4384
+ }
4385
+ onCountrySelect(country) {
4386
+ if (this.phoneNumber) {
4387
+ this.phoneNumber = this.numberInstance?.nationalNumber;
4388
+ }
4389
+ this.selectedCountry = country;
4390
+ this.countryChanged.emit(this.selectedCountry);
4391
+ this.onPhoneNumberChange();
4392
+ }
4393
+ getCountry(code) {
4394
+ return (this.allCountries.find((c) => c.iso2 === code.toLowerCase()) || {
4395
+ name: 'UN',
4396
+ iso2: 'UN',
4397
+ dialCode: '',
4398
+ priority: 0,
4399
+ areaCodes: undefined,
4400
+ flagClass: 'UN',
4401
+ placeHolder: '',
4402
+ });
4403
+ }
4404
+ onInputKeyPress(event) {
4405
+ const pattern = /[0-9+\- ]/;
4406
+ if (!pattern.test(event.key)) {
4407
+ event.preventDefault();
4408
+ }
4409
+ }
4410
+ flagClass(lang) {
4411
+ return `fi fi-${lang?.slice(-2).toLowerCase()}`;
4412
+ }
4413
+ registerOnChange(fn) {
4414
+ this.propagateChange = fn;
4415
+ }
4416
+ registerOnTouched(fn) {
4417
+ this.onTouched = fn;
4418
+ }
4419
+ setDisabledState(isDisabled) {
4420
+ this.disabled = isDisabled;
4421
+ this.changeDetectorRef.markForCheck();
4422
+ this.stateChanges.next(undefined);
4423
+ }
4424
+ writeValue(value) {
4425
+ if (value) {
4426
+ this.numberInstance = parsePhoneNumberFromString(value);
4427
+ if (this.numberInstance) {
4428
+ const countryCode = this.numberInstance.country;
4429
+ this.phoneNumber = this.formattedPhoneNumber;
4430
+ if (!countryCode) {
4431
+ return;
4432
+ }
4433
+ setTimeout(() => {
4434
+ this.selectedCountry = this.getCountry(countryCode);
4435
+ if (this.selectedCountry.dialCode &&
4436
+ !this.preferredCountries.includes(this.selectedCountry.iso2)) {
4437
+ this.preferredCountriesInDropDown.push(this.selectedCountry);
4438
+ }
4439
+ this.countryChanged.emit(this.selectedCountry);
4440
+ // Initial value is set
4441
+ this.changeDetectorRef.markForCheck();
4442
+ this.stateChanges.next(undefined);
4443
+ }, 1);
4444
+ }
4445
+ else {
4446
+ this.phoneNumber = value;
4447
+ }
4448
+ }
4449
+ // Value is set from outside using setValue()
4450
+ this.changeDetectorRef.markForCheck();
4451
+ this.stateChanges.next(undefined);
4452
+ }
4453
+ setDescribedByIds(ids) {
4454
+ this.describedBy = ids.join(' ');
4455
+ }
4456
+ onContainerClick(event) {
4457
+ if (event.target.tagName.toLowerCase() !== 'input') {
4458
+ this.elRef.nativeElement.querySelector('input').focus();
4459
+ }
4460
+ }
4461
+ reset() {
4462
+ this.phoneNumber = '';
4463
+ this.propagateChange(null);
4464
+ this.changeDetectorRef.markForCheck();
4465
+ this.stateChanges.next(undefined);
4466
+ }
4467
+ onSearchInput() {
4468
+ setTimeout(() => {
4469
+ this.searchInput?.nativeElement?.focus();
4470
+ }, 200);
4471
+ }
4472
+ fetchCountryData() {
4473
+ this.countryCodeData.allCountries.forEach((c) => {
4474
+ const country = {
4475
+ name: c[0].toString(),
4476
+ iso2: c[1].toString(),
4477
+ dialCode: c[2].toString(),
4478
+ priority: +c[3] || 0,
4479
+ areaCodes: c[4] || undefined,
4480
+ flagClass: c[1].toString().toUpperCase(),
4481
+ placeHolder: '',
4482
+ };
4483
+ if (this.enablePlaceholder) {
4484
+ country.placeHolder = EcabsBasePhoneComponent.getPhoneNumberPlaceHolder(country.iso2.toUpperCase());
4485
+ }
4486
+ this.allCountries.push(country);
4487
+ });
4488
+ }
4489
+ get formattedPhoneNumber() {
4490
+ if (!this.numberInstance) {
4491
+ return this.phoneNumber?.toString() || '';
4492
+ }
4493
+ switch (this.format) {
4494
+ case 'national':
4495
+ return this.numberInstance.formatNational();
4496
+ case 'international':
4497
+ return this.numberInstance.formatInternational();
4498
+ default:
4499
+ return this.numberInstance.nationalNumber.toString();
4500
+ }
4501
+ }
4502
+ formatAsYouTypeIfEnabled() {
4503
+ if (this.format === 'default') {
4504
+ return;
4505
+ }
4506
+ const asYouType = new AsYouType(this.selectedCountry?.iso2.toUpperCase());
4507
+ // To avoid caret positioning we apply formatting only if the caret is at the end:
4508
+ if (this.phoneNumber
4509
+ ?.toString()
4510
+ .startsWith(this._previousFormattedNumber || '')) {
4511
+ this.phoneNumber = asYouType.input(this.phoneNumber.toString());
4512
+ }
4513
+ this._previousFormattedNumber = this.phoneNumber?.toString();
4514
+ }
4515
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBasePhoneComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: CountryCode }, { token: i2.FocusMonitor }, { token: i0.ElementRef }, { token: i3.NgControl, optional: true, self: true }, { token: i3.NgForm, optional: true }, { token: i3.FormGroupDirective, optional: true }, { token: i4$1.ErrorStateMatcher }], target: i0.ɵɵFactoryTarget.Component });
4516
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsBasePhoneComponent, selector: "ecabs-base-phone", inputs: { preferredCountries: "preferredCountries", enablePlaceholder: "enablePlaceholder", inputPlaceholder: "inputPlaceholder", cssClass: "cssClass", name: "name", onlyCountries: "onlyCountries", errorStateMatcher: "errorStateMatcher", enableSearch: "enableSearch", searchPlaceholder: "searchPlaceholder", describedBy: "describedBy", debounceTimeMs: "debounceTimeMs", format: "format", placeholder: "placeholder", required: "required", disabled: "disabled" }, outputs: { countryChanged: "countryChanged" }, host: { properties: { "id": "this.id", "class.ngx-floating": "this.shouldLabelFloat" } }, providers: [
4517
+ CountryCode,
4518
+ { provide: MatFormFieldControl, useExisting: EcabsBasePhoneComponent },
4519
+ {
4520
+ provide: NG_VALIDATORS,
4521
+ useValue: phoneNumberValidator,
4522
+ multi: true,
4523
+ },
4524
+ ], viewQueries: [{ propertyName: "matMenu", first: true, predicate: MatMenu, descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecabs-tel-input-container\">\r\n <button\r\n type=\"button\"\r\n mat-button\r\n [matMenuTriggerFor]=\"menu\"\r\n class=\"country-selector\"\r\n [disabled]=\"disabled\"\r\n >\r\n <span\r\n class=\"country-selector-flag flag\"\r\n [ngClass]=\"flagClass(selectedCountry?.flagClass)\"\r\n ></span>\r\n <span class=\"country-selector-code\" *ngIf=\"selectedCountry?.dialCode\"\r\n >+{{ selectedCountry.dialCode }}</span\r\n >\r\n </button>\r\n <mat-menu #menu=\"matMenu\"\r\n class=\"ecabs-tel-input-mat-menu-panel\"\r\n backdropClass=\"ecabs-tel-input-overlay-backdrop\"\r\n overlayPanelClass=\"ecabs-tel-input-overlay-pane\">\r\n <input\r\n #searchInput\r\n *ngIf=\"enableSearch\"\r\n class=\"country-search\"\r\n [(ngModel)]=\"searchCriteria\"\r\n (ngModelChange)=\"onSearchInput()\"\r\n type=\"text\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n <ng-container *ngIf=\"!searchCriteria\">\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n class=\"country-list-button\"\r\n *ngFor=\"let country of preferredCountriesInDropDown\"\r\n (click)=\"onCountrySelect(country)\"\r\n >\r\n <div class=\"icon-wrapper\">\r\n <div class=\"flag\" \r\n [ngClass]=\"flagClass(country.flagClass)\"></div>\r\n </div>\r\n <div class=\"label-wrapper\">\r\n {{ country.name }}\r\n <span *ngIf=\"country?.dialCode\">+{{ country.dialCode }}</span>\r\n </div>\r\n </button>\r\n <mat-divider *ngIf=\"preferredCountriesInDropDown?.length\"></mat-divider>\r\n </ng-container>\r\n <ng-container *ngFor=\"let country of allCountries\">\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n class=\"country-list-button\"\r\n *ngIf=\"country | search: searchCriteria\"\r\n (click)=\"onCountrySelect(country)\"\r\n >\r\n <div class=\"icon-wrapper\">\r\n <div class=\"flag\" [ngClass]=\"flagClass(country.flagClass)\"></div>\r\n </div>\r\n <div class=\"label-wrapper\">\r\n {{ country.name }} +{{ country.dialCode }}\r\n </div>\r\n </button>\r\n </ng-container>\r\n </mat-menu>\r\n\r\n <input\r\n matInput\r\n type=\"tel\"\r\n autocomplete=\"tel\"\r\n [ngClass]=\"cssClass\"\r\n (blur)=\"onTouched()\"\r\n (keypress)=\"onInputKeyPress($event)\"\r\n [(ngModel)]=\"phoneNumber\"\r\n (ngModelChange)=\"onPhoneNumberChangeDebounce()\"\r\n [errorStateMatcher]=\"errorStateMatcher\"\r\n [placeholder]=\"inputPlaceholder\"\r\n [disabled]=\"disabled\"\r\n [aria-describedby]=\"describedBy\"\r\n />\r\n</div>", styles: ["input:not(.country-search){border:none;background:none;outline:none;font:inherit;width:100%;box-sizing:border-box;padding:0 6px 0 90px;position:relative;z-index:0;margin-top:0!important;margin-bottom:0!important;margin-right:0;margin-left:0}input.country-search{width:100%;height:34px;border:none;border-bottom:1px solid #ddd;font-size:14px;padding:20px 20px 24px;position:sticky;top:0;background-color:#fff;z-index:9}.icon-wrapper{padding-right:24px}.flag{background-size:100% auto;filter:drop-shadow(1px 1px 1px rgba(0,0,0,.54));height:14px;width:24px}.icon-wrapper,.label-wrapper{display:table-cell;vertical-align:middle}.country-selector{border-radius:0;color:#000000de;flex-shrink:0;height:initial;line-height:unset;width:90px;padding:1px;opacity:0;transition:opacity .2s;position:absolute;z-index:1;inset:0 auto 0 0;font-size:inherit;font-weight:inherit;background-position:right center;background-repeat:no-repeat;background-size:18px auto}.country-selector:disabled{color:#00000061}:host.ngx-floating .country-selector{opacity:1!important}.country-selector-flag{display:inline-block;margin-right:.5ex}.country-list-button{color:#000000de;direction:ltr;font-size:16px;font-weight:400;height:initial;line-height:normal;min-height:48px;padding:14px 24px;text-align:left;text-transform:none;width:100%}\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i6$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i7$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "pipe", type: SearchPipe, name: "search" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
4525
+ }
4526
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBasePhoneComponent, decorators: [{
4527
+ type: Component,
4528
+ args: [{ selector: 'ecabs-base-phone', standalone: false, providers: [
4529
+ CountryCode,
4530
+ { provide: MatFormFieldControl, useExisting: EcabsBasePhoneComponent },
4531
+ {
4532
+ provide: NG_VALIDATORS,
4533
+ useValue: phoneNumberValidator,
4534
+ multi: true,
4535
+ },
4536
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ecabs-tel-input-container\">\r\n <button\r\n type=\"button\"\r\n mat-button\r\n [matMenuTriggerFor]=\"menu\"\r\n class=\"country-selector\"\r\n [disabled]=\"disabled\"\r\n >\r\n <span\r\n class=\"country-selector-flag flag\"\r\n [ngClass]=\"flagClass(selectedCountry?.flagClass)\"\r\n ></span>\r\n <span class=\"country-selector-code\" *ngIf=\"selectedCountry?.dialCode\"\r\n >+{{ selectedCountry.dialCode }}</span\r\n >\r\n </button>\r\n <mat-menu #menu=\"matMenu\"\r\n class=\"ecabs-tel-input-mat-menu-panel\"\r\n backdropClass=\"ecabs-tel-input-overlay-backdrop\"\r\n overlayPanelClass=\"ecabs-tel-input-overlay-pane\">\r\n <input\r\n #searchInput\r\n *ngIf=\"enableSearch\"\r\n class=\"country-search\"\r\n [(ngModel)]=\"searchCriteria\"\r\n (ngModelChange)=\"onSearchInput()\"\r\n type=\"text\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n <ng-container *ngIf=\"!searchCriteria\">\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n class=\"country-list-button\"\r\n *ngFor=\"let country of preferredCountriesInDropDown\"\r\n (click)=\"onCountrySelect(country)\"\r\n >\r\n <div class=\"icon-wrapper\">\r\n <div class=\"flag\" \r\n [ngClass]=\"flagClass(country.flagClass)\"></div>\r\n </div>\r\n <div class=\"label-wrapper\">\r\n {{ country.name }}\r\n <span *ngIf=\"country?.dialCode\">+{{ country.dialCode }}</span>\r\n </div>\r\n </button>\r\n <mat-divider *ngIf=\"preferredCountriesInDropDown?.length\"></mat-divider>\r\n </ng-container>\r\n <ng-container *ngFor=\"let country of allCountries\">\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n class=\"country-list-button\"\r\n *ngIf=\"country | search: searchCriteria\"\r\n (click)=\"onCountrySelect(country)\"\r\n >\r\n <div class=\"icon-wrapper\">\r\n <div class=\"flag\" [ngClass]=\"flagClass(country.flagClass)\"></div>\r\n </div>\r\n <div class=\"label-wrapper\">\r\n {{ country.name }} +{{ country.dialCode }}\r\n </div>\r\n </button>\r\n </ng-container>\r\n </mat-menu>\r\n\r\n <input\r\n matInput\r\n type=\"tel\"\r\n autocomplete=\"tel\"\r\n [ngClass]=\"cssClass\"\r\n (blur)=\"onTouched()\"\r\n (keypress)=\"onInputKeyPress($event)\"\r\n [(ngModel)]=\"phoneNumber\"\r\n (ngModelChange)=\"onPhoneNumberChangeDebounce()\"\r\n [errorStateMatcher]=\"errorStateMatcher\"\r\n [placeholder]=\"inputPlaceholder\"\r\n [disabled]=\"disabled\"\r\n [aria-describedby]=\"describedBy\"\r\n />\r\n</div>", styles: ["input:not(.country-search){border:none;background:none;outline:none;font:inherit;width:100%;box-sizing:border-box;padding:0 6px 0 90px;position:relative;z-index:0;margin-top:0!important;margin-bottom:0!important;margin-right:0;margin-left:0}input.country-search{width:100%;height:34px;border:none;border-bottom:1px solid #ddd;font-size:14px;padding:20px 20px 24px;position:sticky;top:0;background-color:#fff;z-index:9}.icon-wrapper{padding-right:24px}.flag{background-size:100% auto;filter:drop-shadow(1px 1px 1px rgba(0,0,0,.54));height:14px;width:24px}.icon-wrapper,.label-wrapper{display:table-cell;vertical-align:middle}.country-selector{border-radius:0;color:#000000de;flex-shrink:0;height:initial;line-height:unset;width:90px;padding:1px;opacity:0;transition:opacity .2s;position:absolute;z-index:1;inset:0 auto 0 0;font-size:inherit;font-weight:inherit;background-position:right center;background-repeat:no-repeat;background-size:18px auto}.country-selector:disabled{color:#00000061}:host.ngx-floating .country-selector{opacity:1!important}.country-selector-flag{display:inline-block;margin-right:.5ex}.country-list-button{color:#000000de;direction:ltr;font-size:16px;font-weight:400;height:initial;line-height:normal;min-height:48px;padding:14px 24px;text-align:left;text-transform:none;width:100%}\n"] }]
4537
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: CountryCode }, { type: i2.FocusMonitor }, { type: i0.ElementRef }, { type: i3.NgControl, decorators: [{
4538
+ type: Optional
4539
+ }, {
4540
+ type: Self
4541
+ }] }, { type: i3.NgForm, decorators: [{
4542
+ type: Optional
4543
+ }] }, { type: i3.FormGroupDirective, decorators: [{
4544
+ type: Optional
4545
+ }] }, { type: i4$1.ErrorStateMatcher }]; }, propDecorators: { preferredCountries: [{
4546
+ type: Input
4547
+ }], enablePlaceholder: [{
4548
+ type: Input
4549
+ }], inputPlaceholder: [{
4550
+ type: Input
4551
+ }], cssClass: [{
4552
+ type: Input
4553
+ }], name: [{
4554
+ type: Input
4555
+ }], onlyCountries: [{
4556
+ type: Input
4557
+ }], errorStateMatcher: [{
4558
+ type: Input
4559
+ }], enableSearch: [{
4560
+ type: Input
4561
+ }], searchPlaceholder: [{
4562
+ type: Input
4563
+ }], describedBy: [{
4564
+ type: Input
4565
+ }], debounceTimeMs: [{
4566
+ type: Input
4567
+ }], format: [{
4568
+ type: Input
4569
+ }], placeholder: [{
4570
+ type: Input
4571
+ }], required: [{
4572
+ type: Input
4573
+ }], disabled: [{
4574
+ type: Input
4575
+ }], countryChanged: [{
4576
+ type: Output
4577
+ }], matMenu: [{
4578
+ type: ViewChild,
4579
+ args: [MatMenu]
4580
+ }], searchInput: [{
4581
+ type: ViewChild,
4582
+ args: ['searchInput', { static: false }]
4583
+ }], id: [{
4584
+ type: HostBinding
4585
+ }], shouldLabelFloat: [{
4586
+ type: HostBinding,
4587
+ args: ['class.ngx-floating']
4588
+ }] } });
4589
+
3590
4590
  class EcabsPhoneComponent extends EcabsElementBaseComponent {
3591
4591
  injector;
3592
4592
  ecabsComponentsService;
@@ -3692,7 +4692,7 @@ class EcabsPhoneComponent extends EcabsElementBaseComponent {
3692
4692
  useExisting: EcabsPhoneComponent,
3693
4693
  multi: true,
3694
4694
  },
3695
- ], viewQueries: [{ propertyName: "phoneInput", first: true, predicate: ["phoneInput"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <form #f=\"ngForm\" [formGroup]=\"phoneForm\">\r\n <ngx-mat-intl-tel-input\r\n (focusout)=\"onBlur()\"\r\n [ngClass]=\"{ error: phoneForm.invalid && (phoneForm.dirty || phoneForm.touched) }\"\r\n #phoneInput\r\n [preferredCountries]=\"preferredCountries\"\r\n [enablePlaceholder]=\"enablePlaceholder\"\r\n [enableSearch]=\"enableSearch\"\r\n [disabled]=\"disabled\"\r\n [formControlName]=\"'phone'\"\r\n name=\"phone\"\r\n [inputPlaceholder]=\"placeholder\"\r\n >\r\n </ngx-mat-intl-tel-input>\r\n </form>\r\n</ecabs-element-wrapper>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i6$1.NgxMatIntlTelInputComponent, selector: "ngx-mat-intl-tel-input", inputs: ["preferredCountries", "enablePlaceholder", "inputPlaceholder", "cssClass", "name", "onlyCountries", "errorStateMatcher", "enableSearch", "searchPlaceholder", "describedBy", "format", "placeholder", "required", "disabled"], outputs: ["countryChanged"] }, { kind: "directive", type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
4695
+ ], viewQueries: [{ propertyName: "phoneInput", first: true, predicate: ["phoneInput"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <form #f=\"ngForm\" [formGroup]=\"phoneForm\">\r\n <ecabs-base-phone\r\n (focusout)=\"onBlur()\"\r\n [ngClass]=\"{ error: phoneForm.invalid && (phoneForm.dirty || phoneForm.touched) }\"\r\n #phoneInput\r\n [preferredCountries]=\"preferredCountries\"\r\n [enablePlaceholder]=\"enablePlaceholder\"\r\n [enableSearch]=\"enableSearch\"\r\n [disabled]=\"disabled\"\r\n [formControlName]=\"'phone'\"\r\n name=\"phone\"\r\n [inputPlaceholder]=\"placeholder\"\r\n >\r\n </ecabs-base-phone>\r\n </form>\r\n</ecabs-element-wrapper>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: EcabsBasePhoneComponent, selector: "ecabs-base-phone", inputs: ["preferredCountries", "enablePlaceholder", "inputPlaceholder", "cssClass", "name", "onlyCountries", "errorStateMatcher", "enableSearch", "searchPlaceholder", "describedBy", "debounceTimeMs", "format", "placeholder", "required", "disabled"], outputs: ["countryChanged"] }] });
3696
4696
  }
3697
4697
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPhoneComponent, decorators: [{
3698
4698
  type: Component,
@@ -3703,7 +4703,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3703
4703
  useExisting: EcabsPhoneComponent,
3704
4704
  multi: true,
3705
4705
  },
3706
- ], template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <form #f=\"ngForm\" [formGroup]=\"phoneForm\">\r\n <ngx-mat-intl-tel-input\r\n (focusout)=\"onBlur()\"\r\n [ngClass]=\"{ error: phoneForm.invalid && (phoneForm.dirty || phoneForm.touched) }\"\r\n #phoneInput\r\n [preferredCountries]=\"preferredCountries\"\r\n [enablePlaceholder]=\"enablePlaceholder\"\r\n [enableSearch]=\"enableSearch\"\r\n [disabled]=\"disabled\"\r\n [formControlName]=\"'phone'\"\r\n name=\"phone\"\r\n [inputPlaceholder]=\"placeholder\"\r\n >\r\n </ngx-mat-intl-tel-input>\r\n </form>\r\n</ecabs-element-wrapper>\r\n" }]
4706
+ ], template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <form #f=\"ngForm\" [formGroup]=\"phoneForm\">\r\n <ecabs-base-phone\r\n (focusout)=\"onBlur()\"\r\n [ngClass]=\"{ error: phoneForm.invalid && (phoneForm.dirty || phoneForm.touched) }\"\r\n #phoneInput\r\n [preferredCountries]=\"preferredCountries\"\r\n [enablePlaceholder]=\"enablePlaceholder\"\r\n [enableSearch]=\"enableSearch\"\r\n [disabled]=\"disabled\"\r\n [formControlName]=\"'phone'\"\r\n name=\"phone\"\r\n [inputPlaceholder]=\"placeholder\"\r\n >\r\n </ecabs-base-phone>\r\n </form>\r\n</ecabs-element-wrapper>\r\n" }]
3707
4707
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: EcabsComponentsService }, { type: UnsubscribeService }]; }, propDecorators: { preferredCountries: [{
3708
4708
  type: Input
3709
4709
  }], enablePlaceholder: [{
@@ -3724,20 +4724,65 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3724
4724
  args: ['keypress', ['$event']]
3725
4725
  }] } });
3726
4726
 
4727
+ class EcabsBasePhoneModule {
4728
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBasePhoneModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4729
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: EcabsBasePhoneModule, declarations: [EcabsBasePhoneComponent], imports: [CommonModule,
4730
+ MatIconModule,
4731
+ RouterModule,
4732
+ FormsModule,
4733
+ MatInputModule,
4734
+ MatMenuModule,
4735
+ MatButtonModule,
4736
+ MatDividerModule,
4737
+ ReactiveFormsModule,
4738
+ SearchPipe,
4739
+ ElementWrapperModule], exports: [EcabsBasePhoneComponent] });
4740
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBasePhoneModule, imports: [CommonModule,
4741
+ MatIconModule,
4742
+ RouterModule,
4743
+ FormsModule,
4744
+ MatInputModule,
4745
+ MatMenuModule,
4746
+ MatButtonModule,
4747
+ MatDividerModule,
4748
+ ReactiveFormsModule,
4749
+ ElementWrapperModule] });
4750
+ }
4751
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBasePhoneModule, decorators: [{
4752
+ type: NgModule,
4753
+ args: [{
4754
+ declarations: [EcabsBasePhoneComponent],
4755
+ imports: [
4756
+ CommonModule,
4757
+ MatIconModule,
4758
+ RouterModule,
4759
+ FormsModule,
4760
+ MatInputModule,
4761
+ MatMenuModule,
4762
+ MatButtonModule,
4763
+ MatDividerModule,
4764
+ ReactiveFormsModule,
4765
+ SearchPipe,
4766
+ ElementWrapperModule,
4767
+ ],
4768
+ exports: [EcabsBasePhoneComponent],
4769
+ }]
4770
+ }] });
4771
+
3727
4772
  class EcabsPhoneModule {
3728
4773
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPhoneModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3729
4774
  static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: EcabsPhoneModule, declarations: [EcabsPhoneComponent], imports: [CommonModule,
3730
4775
  MatInputModule,
3731
4776
  ElementWrapperModule,
3732
4777
  FormsModule,
3733
- NgxMatIntlTelInputComponent,
3734
- ReactiveFormsModule], exports: [EcabsPhoneComponent] });
4778
+ ReactiveFormsModule,
4779
+ EcabsBasePhoneModule], exports: [EcabsPhoneComponent] });
3735
4780
  static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPhoneModule, imports: [CommonModule,
3736
4781
  MatInputModule,
3737
4782
  ElementWrapperModule,
3738
4783
  FormsModule,
3739
- NgxMatIntlTelInputComponent,
3740
- ReactiveFormsModule] });
4784
+ ReactiveFormsModule,
4785
+ EcabsBasePhoneModule] });
3741
4786
  }
3742
4787
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPhoneModule, decorators: [{
3743
4788
  type: NgModule,
@@ -3748,8 +4793,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3748
4793
  MatInputModule,
3749
4794
  ElementWrapperModule,
3750
4795
  FormsModule,
3751
- NgxMatIntlTelInputComponent,
3752
4796
  ReactiveFormsModule,
4797
+ EcabsBasePhoneModule,
3753
4798
  ],
3754
4799
  exports: [EcabsPhoneComponent],
3755
4800
  }]
@@ -3799,7 +4844,7 @@ class EcabsRadioButtonListComponent extends EcabsElementBaseComponent {
3799
4844
  useExisting: EcabsRadioButtonListComponent,
3800
4845
  multi: true,
3801
4846
  },
3802
- ], 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$1.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$1.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
4847
+ ], 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"] }] });
3803
4848
  }
3804
4849
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsRadioButtonListComponent, decorators: [{
3805
4850
  type: Component,
@@ -4266,7 +5311,7 @@ class EcabsTimepickerComponent extends EcabsElementBaseComponent {
4266
5311
  useExisting: EcabsTimepickerComponent,
4267
5312
  multi: true,
4268
5313
  },
4269
- ], usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{ disabled: disabled }\">\r\n <ecabs-element-wrapper\r\n [data]=\"getData()\"\r\n [showCloseIcon]=\"showCloseIcon\"\r\n [focusedFlag]=\"focusedFlag\"\r\n (clear)=\"clearInput()\"\r\n >\r\n <div class=\"relative inline-block w-full timeInputFieldWrapper\">\r\n <input\r\n type=\"text\"\r\n class=\"form-field__input\"\r\n [value]=\"data\"\r\n [ngModel]=\"data\"\r\n (ngModelChange)=\"updateInputData($event)\"\r\n [disabled]=\"disabled\"\r\n ecabsTime\r\n [all]=\"allLabel\"\r\n (focus)=\"show()\"\r\n (click)=\"show()\"\r\n (keydown)=\"inputKeyDown($event)\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n <div class=\"form-field__input--suffix\" *ngIf=\"type !== 'number'\">\r\n <ng-content select=\"mat-icon\"></ng-content>\r\n </div>\r\n <ecabs-time-list-panel\r\n [typedValue]=\"data\"\r\n *ngIf=\"focusedFlag\"\r\n [showDayStart]=\"showDayStart\"\r\n [dayStartLabel]=\"dayStartLabel\"\r\n [dayEndLabel]=\"dayEndLabel\"\r\n [showDayEnd]=\"showDayEnd\"\r\n [min]=\"min\"\r\n [max]=\"max\"\r\n class=\"form-time-list absolute inline-block\"\r\n [appendTo]=\"appendTo\"\r\n [listPosition]=\"listPosition\"\r\n (closeMe)=\"close($event)\"\r\n ></ecabs-time-list-panel>\r\n </div>\r\n </ecabs-element-wrapper>\r\n</div>\r\n", styles: [":host::ng-deep .timeInputWrapper ecabs-element-wrapper .form-field{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: EcabsMaskTimeDirective, selector: "[ecabsTime]", inputs: ["timeRange", "all"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: EcabsTimeListPanelComponent, selector: "ecabs-time-list-panel", inputs: ["typedValue", "listPlacement", "listPosition", "dayStartLabel", "dayEndLabel", "appendTo", "min", "max", "showDayStart", "showDayEnd", "position"], outputs: ["onscroll", "closeMe"] }] });
5314
+ ], usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{ disabled: disabled }\">\r\n <ecabs-element-wrapper\r\n [data]=\"getData()\"\r\n [showCloseIcon]=\"showCloseIcon\"\r\n [focusedFlag]=\"focusedFlag\"\r\n (clear)=\"clearInput()\"\r\n >\r\n <div class=\"relative inline-block w-full timeInputFieldWrapper\">\r\n <input\r\n type=\"text\"\r\n class=\"form-field__input\"\r\n [value]=\"data\"\r\n [ngModel]=\"data\"\r\n (ngModelChange)=\"updateInputData($event)\"\r\n [disabled]=\"disabled\"\r\n ecabsTime\r\n [all]=\"allLabel\"\r\n (focus)=\"show()\"\r\n (click)=\"show()\"\r\n (keydown)=\"inputKeyDown($event)\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n <div class=\"form-field__input--suffix\" *ngIf=\"type !== 'number'\">\r\n <ng-content select=\"mat-icon\"></ng-content>\r\n </div>\r\n <ecabs-time-list-panel\r\n [typedValue]=\"data\"\r\n *ngIf=\"focusedFlag\"\r\n [showDayStart]=\"showDayStart\"\r\n [dayStartLabel]=\"dayStartLabel\"\r\n [dayEndLabel]=\"dayEndLabel\"\r\n [showDayEnd]=\"showDayEnd\"\r\n [min]=\"min\"\r\n [max]=\"max\"\r\n class=\"form-time-list absolute inline-block\"\r\n [appendTo]=\"appendTo\"\r\n [listPosition]=\"listPosition\"\r\n (closeMe)=\"close($event)\"\r\n ></ecabs-time-list-panel>\r\n </div>\r\n </ecabs-element-wrapper>\r\n</div>\r\n", styles: [":host::ng-deep .timeInputWrapper ecabs-element-wrapper .form-field{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: EcabsMaskTimeDirective, selector: "[ecabsTime]", inputs: ["timeRange", "all"] }, { 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: "component", type: EcabsTimeListPanelComponent, selector: "ecabs-time-list-panel", inputs: ["typedValue", "listPlacement", "listPosition", "dayStartLabel", "dayEndLabel", "appendTo", "min", "max", "showDayStart", "showDayEnd", "position"], outputs: ["onscroll", "closeMe"] }] });
4270
5315
  }
4271
5316
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsTimepickerComponent, decorators: [{
4272
5317
  type: Component,
@@ -4347,7 +5392,7 @@ class EcabsEmptyPlaceholderComponent {
4347
5392
  }
4348
5393
  }
4349
5394
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsEmptyPlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4350
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsEmptyPlaceholderComponent, selector: "ecabs-empty-placeholder", inputs: { isEmptyMessage: "isEmptyMessage", redirectPath: "redirectPath", srcImage: "srcImage" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"w-full flex flex-col items-center justify-items-center\">\r\n <img class=\"mt-10 w-60\" [src]=\"image\" alt=\"\" />\r\n\r\n <span class=\"heading--sm text-gray-400 my-2\">{{ isEmptyMessage }}</span>\r\n\r\n <a *ngIf=\"redirectPath\" [routerLink]=\"redirectPath?.path && [redirectPath.path]\" class=\"text-sm\">\r\n {{ redirectPath.title }}\r\n </a>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
5395
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsEmptyPlaceholderComponent, selector: "ecabs-empty-placeholder", inputs: { isEmptyMessage: "isEmptyMessage", redirectPath: "redirectPath", srcImage: "srcImage" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"w-full flex flex-col items-center justify-items-center\">\r\n <img class=\"mt-10 w-60\" [src]=\"image\" alt=\"\" />\r\n\r\n <span class=\"heading--sm text-gray-400 my-2\">{{ isEmptyMessage }}</span>\r\n\r\n <a *ngIf=\"redirectPath\" [routerLink]=\"redirectPath?.path && [redirectPath.path]\" class=\"text-sm\">\r\n {{ redirectPath.title }}\r\n </a>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
4351
5396
  }
4352
5397
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsEmptyPlaceholderComponent, decorators: [{
4353
5398
  type: Component,
@@ -4411,7 +5456,7 @@ class EcabsExpansionPanelComponent {
4411
5456
  this.checked.emit(this.expanded);
4412
5457
  }
4413
5458
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4414
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsExpansionPanelComponent, selector: "ecabs-expansion-panel", inputs: { title: "title", description: "description", actionTitle: "actionTitle", index: "index", expanded: "expanded", disabled: "disabled", errorMessage: "errorMessage", showErrorMessage: "showErrorMessage", closePanel: "closePanel", showIcon: "showIcon", iconName: "iconName", showCheckbox: "showCheckbox", showStatus: "showStatus", status: "status", hideToggle: "hideToggle" }, outputs: { checked: "checked", opened: "opened" }, viewQueries: [{ propertyName: "expansionPanel", first: true, predicate: MatExpansionPanel, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-accordion class=\"example-headers-align\" multi>\r\n <mat-expansion-panel [expanded]=\"expanded\" [disabled]=\"disabled\" (opened)=\"onOpened()\" [hideToggle]=\"hideToggle\">\r\n <mat-expansion-panel-header *ngIf=\"title\">\r\n <mat-panel-title>\r\n <div>\r\n <div class=\"flex flex-row\">\r\n <div *ngIf=\"index && !showErrorMessage\" class=\"border-current border-2 rounded-full mr-3 index\">\r\n {{ index }}\r\n </div>\r\n <div *ngIf=\"!showErrorMessage && showIcon\" class=\"mr-3 rounded\">\r\n <mat-icon class=\"rounded-icon !text-lg -mt-1\">{{ iconName }}</mat-icon>\r\n </div>\r\n <div *ngIf=\"showErrorMessage\" class=\"mt-1 mr-2\">\r\n <mat-icon color=\"warn\">warning</mat-icon>\r\n </div>\r\n {{ title }}\r\n <div *ngIf=\"showCheckbox\" class=\"ml-2 mt-1\">\r\n <ecabs-checkbox [type]=\"'toggle'\" [(ngModel)]=\"toggle\"\r\n (click)=\"toggleAction($event)\"></ecabs-checkbox>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showErrorMessage\" class=\"error-message\">{{ errorMessage }}</div>\r\n </div>\r\n </mat-panel-title>\r\n <mat-panel-description>{{ description }}\r\n <mat-chip *ngIf=\"showStatus\" class=\"{{ status | lowercase }}\">\r\n {{ status | titlecase }}\r\n </mat-chip>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n\r\n <mat-expansion-panel-header *ngIf=\"actionTitle\">\r\n <ng-container *ngTemplateOutlet=\"actionTitle\"></ng-container>\r\n </mat-expansion-panel-header>\r\n <ng-content></ng-content>\r\n </mat-expansion-panel>\r\n</mat-accordion>\r\n", styles: [".example-action-buttons{padding-bottom:20px}.example-headers-align .mat-expansion-panel-header-title,.example-headers-align .mat-expansion-panel-header-description{flex-basis:0}.example-headers-align .mat-expansion-panel-header-description{justify-content:flex-end;align-items:center}.example-headers-align .mat-mdc-form-field+.mat-mdc-form-field{margin-left:8px}:host ::ng-deep .mat-expansion-indicator:after{border-color:var(--color-gray-500)}.index{height:28px;width:28px;display:flex;align-items:center;justify-content:center;text-align:center;padding-top:3px;font-size:16px}.error-message{font-size:.75rem!important;color:var(--color-error);margin-left:2.125rem;margin-top:-.75rem}.rounded{background-color:var(--color-brand-dark);border-radius:50%;height:28px;width:28px;display:flex;align-items:center;justify-content:center;text-align:center}.rounded-icon{color:var(--color-white)}.inactive{background-color:rgba(var(--color-warn-rgb),.05);color:var(--color-warn)}.draft{background-color:var(--color-gray-200);color:var(--color-gray-500)}.published{background-color:rgba(var(--color-info-rgb),.05);color:var(--color-info)}.active{background-color:rgba(var(--color-success-rgb),.05);color:var(--color-success)}.expired{background-color:rgba(var(--color-error-rgb),.05);color:var(--color-error)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$2.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3$2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3$2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i3$2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3$2.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "role", "id", "aria-label", "aria-description", "value", "removable", "highlighted"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: EcabsCheckboxToggleComponent, selector: "ecabs-checkbox", inputs: ["type", "text", "label", "labelPosition", "indeterminate", "checked"], outputs: ["click", "changed"] }, { kind: "pipe", type: i1.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }] });
5459
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsExpansionPanelComponent, selector: "ecabs-expansion-panel", inputs: { title: "title", description: "description", actionTitle: "actionTitle", index: "index", expanded: "expanded", disabled: "disabled", errorMessage: "errorMessage", showErrorMessage: "showErrorMessage", closePanel: "closePanel", showIcon: "showIcon", iconName: "iconName", showCheckbox: "showCheckbox", showStatus: "showStatus", status: "status", hideToggle: "hideToggle" }, outputs: { checked: "checked", opened: "opened" }, viewQueries: [{ propertyName: "expansionPanel", first: true, predicate: MatExpansionPanel, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-accordion class=\"example-headers-align\" multi>\r\n <mat-expansion-panel [expanded]=\"expanded\" [disabled]=\"disabled\" (opened)=\"onOpened()\" [hideToggle]=\"hideToggle\">\r\n <mat-expansion-panel-header *ngIf=\"title\">\r\n <mat-panel-title>\r\n <div>\r\n <div class=\"flex flex-row\">\r\n <div *ngIf=\"index && !showErrorMessage\" class=\"border-current border-2 rounded-full mr-3 index\">\r\n {{ index }}\r\n </div>\r\n <div *ngIf=\"!showErrorMessage && showIcon\" class=\"mr-3 rounded\">\r\n <mat-icon class=\"rounded-icon !text-lg -mt-1\">{{ iconName }}</mat-icon>\r\n </div>\r\n <div *ngIf=\"showErrorMessage\" class=\"mt-1 mr-2\">\r\n <mat-icon color=\"warn\">warning</mat-icon>\r\n </div>\r\n {{ title }}\r\n <div *ngIf=\"showCheckbox\" class=\"ml-2 mt-1\">\r\n <ecabs-checkbox [type]=\"'toggle'\" [(ngModel)]=\"toggle\"\r\n (click)=\"toggleAction($event)\"></ecabs-checkbox>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showErrorMessage\" class=\"error-message\">{{ errorMessage }}</div>\r\n </div>\r\n </mat-panel-title>\r\n <mat-panel-description>{{ description }}\r\n <mat-chip *ngIf=\"showStatus\" class=\"{{ status | lowercase }}\">\r\n {{ status | titlecase }}\r\n </mat-chip>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n\r\n <mat-expansion-panel-header *ngIf=\"actionTitle\">\r\n <ng-container *ngTemplateOutlet=\"actionTitle\"></ng-container>\r\n </mat-expansion-panel-header>\r\n <ng-content></ng-content>\r\n </mat-expansion-panel>\r\n</mat-accordion>\r\n", styles: [".example-action-buttons{padding-bottom:20px}.example-headers-align .mat-expansion-panel-header-title,.example-headers-align .mat-expansion-panel-header-description{flex-basis:0}.example-headers-align .mat-expansion-panel-header-description{justify-content:flex-end;align-items:center}.example-headers-align .mat-mdc-form-field+.mat-mdc-form-field{margin-left:8px}:host ::ng-deep .mat-expansion-indicator:after{border-color:var(--color-gray-500)}.index{height:28px;width:28px;display:flex;align-items:center;justify-content:center;text-align:center;padding-top:3px;font-size:16px}.error-message{font-size:.75rem!important;color:var(--color-error);margin-left:2.125rem;margin-top:-.75rem}.rounded{background-color:var(--color-brand-dark);border-radius:50%;height:28px;width:28px;display:flex;align-items:center;justify-content:center;text-align:center}.rounded-icon{color:var(--color-white)}.inactive{background-color:rgba(var(--color-warn-rgb),.05);color:var(--color-warn)}.draft{background-color:var(--color-gray-200);color:var(--color-gray-500)}.published{background-color:rgba(var(--color-info-rgb),.05);color:var(--color-info)}.active{background-color:rgba(var(--color-success-rgb),.05);color:var(--color-success)}.expired{background-color:rgba(var(--color-error-rgb),.05);color:var(--color-error)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: i3$3.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3$3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3$3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i3$3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3$3.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "role", "id", "aria-label", "aria-description", "value", "removable", "highlighted"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: EcabsCheckboxToggleComponent, selector: "ecabs-checkbox", inputs: ["type", "text", "label", "labelPosition", "indeterminate", "checked"], outputs: ["click", "changed"] }, { kind: "pipe", type: i1.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }] });
4415
5460
  }
4416
5461
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsExpansionPanelComponent, decorators: [{
4417
5462
  type: Component,
@@ -4769,7 +5814,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
4769
5814
  class EcabsBreadcrumbComponent {
4770
5815
  breadcrumb;
4771
5816
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4772
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsBreadcrumbComponent, selector: "ecabs-breadcrumb", inputs: { breadcrumb: "breadcrumb" }, ngImport: i0, template: "<ul class=\"flex text-gray-500 text-sm\">\r\n <li\r\n *ngFor=\"let item of breadcrumb; let counter = index\"\r\n [routerLink]=\"item.url\"\r\n [ngClass]=\"{ 'cursor-pointer': item.url }\"\r\n class=\"flex\"\r\n >\r\n <mat-icon class=\"!text-sm text-center text-gray-400\" *ngIf=\"counter !== 0\">keyboard_arrow_right</mat-icon>\r\n <span>{{ item.title }}</span>\r\n </li>\r\n</ul>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5817
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsBreadcrumbComponent, selector: "ecabs-breadcrumb", inputs: { breadcrumb: "breadcrumb" }, ngImport: i0, template: "<ul class=\"flex text-gray-500 text-sm\">\r\n <li\r\n *ngFor=\"let item of breadcrumb; let counter = index\"\r\n [routerLink]=\"item.url\"\r\n [ngClass]=\"{ 'cursor-pointer': item.url }\"\r\n class=\"flex\"\r\n >\r\n <mat-icon class=\"!text-sm text-center text-gray-400\" *ngIf=\"counter !== 0\">keyboard_arrow_right</mat-icon>\r\n <span>{{ item.title }}</span>\r\n </li>\r\n</ul>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
4773
5818
  }
4774
5819
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsBreadcrumbComponent, decorators: [{
4775
5820
  type: Component,
@@ -4829,7 +5874,7 @@ class EcabsLanguageSelectorComponent {
4829
5874
  return lang.of(code);
4830
5875
  }
4831
5876
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsLanguageSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4832
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsLanguageSelectorComponent, selector: "ecabs-language-selector", inputs: { languages: "languages", currentLanguage: "currentLanguage", showLabelTitle: "showLabelTitle", flagOnly: "flagOnly", tooltip: "tooltip" }, outputs: { languageChanged: "languageChanged" }, usesOnChanges: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\"\r\n [ngClass]=\"{'flag-only': flagOnly}\">\r\n <mat-label></mat-label>\r\n <mat-select class=\"capitalize\"\r\n [(ngModel)]=\"selectedLang\"\r\n name=\"language\"\r\n (ngModelChange)=\"toggleLang()\"\r\n panelClass=\"wide-select\">\r\n <mat-select-trigger>\r\n <div class=\"flex items-center\" [matTooltip]=\"tooltip\">\r\n <span [ngClass]=\"flagClass(matchSelected())\"></span>\r\n <div *ngIf=\"!flagOnly\" class=\"ml-2\">{{ standardLang(matchSelected()) }}</div>\r\n </div>\r\n </mat-select-trigger>\r\n <mat-option class=\"capitalize\" *ngFor=\"let lang of languages\" [value]=\"lang\">\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(lang)\"></span>\r\n <div class=\"ml-2\">{{ standardLang(lang) }}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n</mat-form-field>\r\n", styles: [":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)}:host::ng-deep .mat-mdc-select{padding:0;border:0}:host::ng-deep .mat-mdc-select .mat-mdc-select-arrow-wrapper{display:none}:host::ng-deep .mat-mdc-select,:host::ng-deep .mat-mdc-select .mdc-list-item{font-size:12px;font-size:.75rem}:host::ng-deep .mat-mdc-select-panel .mat-mdc-option.mdc-list-item{font-size:12px;font-size:.75rem}:host::ng-deep .mat-mdc-form-field{width:auto}:host::ng-deep .flag-only .mat-mdc-select .mat-mdc-select-arrow-wrapper{width:0}:host::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__leading,:host::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__notch,:host::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__trailing{border:0}\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
5877
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsLanguageSelectorComponent, selector: "ecabs-language-selector", inputs: { languages: "languages", currentLanguage: "currentLanguage", showLabelTitle: "showLabelTitle", flagOnly: "flagOnly", tooltip: "tooltip" }, outputs: { languageChanged: "languageChanged" }, usesOnChanges: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\"\r\n [ngClass]=\"{'flag-only': flagOnly}\">\r\n <mat-label></mat-label>\r\n <mat-select class=\"capitalize\"\r\n [(ngModel)]=\"selectedLang\"\r\n name=\"language\"\r\n (ngModelChange)=\"toggleLang()\"\r\n panelClass=\"wide-select\">\r\n <mat-select-trigger>\r\n <div class=\"flex items-center\" [matTooltip]=\"tooltip\">\r\n <span [ngClass]=\"flagClass(matchSelected())\"></span>\r\n <div *ngIf=\"!flagOnly\" class=\"ml-2\">{{ standardLang(matchSelected()) }}</div>\r\n </div>\r\n </mat-select-trigger>\r\n <mat-option class=\"capitalize\" *ngFor=\"let lang of languages\" [value]=\"lang\">\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(lang)\"></span>\r\n <div class=\"ml-2\">{{ standardLang(lang) }}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n</mat-form-field>\r\n", styles: [":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)}:host::ng-deep .mat-mdc-select{padding:0;border:0}:host::ng-deep .mat-mdc-select .mat-mdc-select-arrow-wrapper{display:none}:host::ng-deep .mat-mdc-select,:host::ng-deep .mat-mdc-select .mdc-list-item{font-size:12px;font-size:.75rem}:host::ng-deep .mat-mdc-select-panel .mat-mdc-option.mdc-list-item{font-size:12px;font-size:.75rem}:host::ng-deep .mat-mdc-form-field{width:auto}:host::ng-deep .flag-only .mat-mdc-select .mat-mdc-select-arrow-wrapper{width:0}:host::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__leading,:host::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__notch,:host::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__trailing{border:0}\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { 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: i1$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
4833
5878
  }
4834
5879
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsLanguageSelectorComponent, decorators: [{
4835
5880
  type: Component,
@@ -5322,7 +6367,7 @@ class EcabsUppercaseMaskDirective {
5322
6367
  this.control.control.setValue(input.value.toUpperCase());
5323
6368
  input.setSelectionRange(position, position);
5324
6369
  }
5325
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsUppercaseMaskDirective, deps: [{ token: i5$1.NgControl }], target: i0.ɵɵFactoryTarget.Directive });
6370
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsUppercaseMaskDirective, deps: [{ token: i3.NgControl }], target: i0.ɵɵFactoryTarget.Directive });
5326
6371
  static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: EcabsUppercaseMaskDirective, selector: "[formControlName][ecabsUppercaseInput]", host: { listeners: { "input": "onInput($event.target)" } }, ngImport: i0 });
5327
6372
  }
5328
6373
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsUppercaseMaskDirective, decorators: [{
@@ -5330,7 +6375,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
5330
6375
  args: [{
5331
6376
  selector: '[formControlName][ecabsUppercaseInput]',
5332
6377
  }]
5333
- }], ctorParameters: function () { return [{ type: i5$1.NgControl }]; }, propDecorators: { onInput: [{
6378
+ }], ctorParameters: function () { return [{ type: i3.NgControl }]; }, propDecorators: { onInput: [{
5334
6379
  type: HostListener,
5335
6380
  args: ['input', ['$event.target']]
5336
6381
  }] } });
@@ -5503,7 +6548,7 @@ class EcabsActiveStatusFilterComponent {
5503
6548
  return this.initialStatus === status;
5504
6549
  }
5505
6550
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsActiveStatusFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5506
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsActiveStatusFilterComponent, selector: "ecabs-active-status-filter", inputs: { statuses: "statuses", initialStatus: "initialStatus" }, outputs: { statusChange: "statusChange" }, ngImport: i0, template: "<div class=\"mb-5 mt-10\">\r\n <mat-chip-listbox>\r\n <mat-chip-option *ngFor=\"let status of statuses\"\r\n class=\"!rounded-full\"\r\n [ngClass]=\"checkSelectableStatus(status?.value) ? 'chip--selected' : 'chip--not-selected'\"\r\n [selected]=\"checkSelectableStatus(status?.value)\"\r\n (keydown.enter)=\"onFilter(status?.value)\"\r\n (click)=\"onFilter(status?.value)\">\r\n {{ status.text }}\r\n </mat-chip-option>\r\n </mat-chip-listbox>\r\n</div>\r\n", styles: [""], 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: i7$1.MatChipListbox, selector: "mat-chip-listbox", inputs: ["tabIndex", "multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i7$1.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "selectable", "selected"], outputs: ["selectionChange"] }] });
6551
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsActiveStatusFilterComponent, selector: "ecabs-active-status-filter", inputs: { statuses: "statuses", initialStatus: "initialStatus" }, outputs: { statusChange: "statusChange" }, ngImport: i0, template: "<div class=\"mb-5 mt-10\">\r\n <mat-chip-listbox>\r\n <mat-chip-option *ngFor=\"let status of statuses\"\r\n class=\"!rounded-full\"\r\n [ngClass]=\"checkSelectableStatus(status?.value) ? 'chip--selected' : 'chip--not-selected'\"\r\n [selected]=\"checkSelectableStatus(status?.value)\"\r\n (keydown.enter)=\"onFilter(status?.value)\"\r\n (click)=\"onFilter(status?.value)\">\r\n {{ status.text }}\r\n </mat-chip-option>\r\n </mat-chip-listbox>\r\n</div>\r\n", styles: [""], 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: i7$2.MatChipListbox, selector: "mat-chip-listbox", inputs: ["tabIndex", "multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i7$2.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "selectable", "selected"], outputs: ["selectionChange"] }] });
5507
6552
  }
5508
6553
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsActiveStatusFilterComponent, decorators: [{
5509
6554
  type: Component,
@@ -5760,7 +6805,7 @@ class EcabsSliderComponent extends EcabsElementBaseComponent {
5760
6805
  useExisting: EcabsSliderComponent,
5761
6806
  multi: true,
5762
6807
  },
5763
- ], viewQueries: [{ propertyName: "slider", first: true, predicate: ["slider"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <form #f=\"ngForm\" [formGroup]=\"sliderForm\">\r\n <ngx-slider\r\n #slider\r\n class=\"custom-slider\"\r\n [formControlName]=\"'slider'\"\r\n [value]=\"point\"\r\n name=\"slider\"\r\n (userChangeEnd)=\"onChangeValue($event)\"\r\n [options]=\"options\"\r\n ></ngx-slider>\r\n </form>\r\n</ecabs-element-wrapper>\r\n", styles: [":host ::ng-deep .custom-slider .ngx-slider-bar{height:.25rem}:host ::ng-deep .custom-slider .ngx-slider-selection-bar{visibility:visible!important}:host ::ng-deep .custom-slider .ngx-slider-selection{background:var(--color-brand-light);color:var(--color-brand-light)}:host ::ng-deep .custom-slider .ngx-slider-pointer{width:1rem;height:1rem;top:auto;margin-top:-.375rem;background-color:var(--color-brand-dark)}:host ::ng-deep .custom-slider .ngx-slider-pointer:focus{outline:0}:host ::ng-deep .custom-slider .ngx-slider-pointer:after{display:none}:host ::ng-deep .custom-slider .ngx-slider-tick{width:.5rem;height:.5rem;margin-left:.25rem;border-radius:1rem;top:1px;background:var(--color-brand-dark)}\n"], dependencies: [{ kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$3.SliderComponent, selector: "ngx-slider", inputs: ["value", "highValue", "options", "manualRefresh", "triggerFocus"], outputs: ["valueChange", "highValueChange", "userChangeStart", "userChange", "userChangeEnd"] }] });
6808
+ ], viewQueries: [{ propertyName: "slider", first: true, predicate: ["slider"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <form #f=\"ngForm\" [formGroup]=\"sliderForm\">\r\n <ngx-slider\r\n #slider\r\n class=\"custom-slider\"\r\n [formControlName]=\"'slider'\"\r\n [value]=\"point\"\r\n name=\"slider\"\r\n (userChangeEnd)=\"onChangeValue($event)\"\r\n [options]=\"options\"\r\n ></ngx-slider>\r\n </form>\r\n</ecabs-element-wrapper>\r\n", styles: [":host ::ng-deep .custom-slider .ngx-slider-bar{height:.25rem}:host ::ng-deep .custom-slider .ngx-slider-selection-bar{visibility:visible!important}:host ::ng-deep .custom-slider .ngx-slider-selection{background:var(--color-brand-light);color:var(--color-brand-light)}:host ::ng-deep .custom-slider .ngx-slider-pointer{width:1rem;height:1rem;top:auto;margin-top:-.375rem;background-color:var(--color-brand-dark)}:host ::ng-deep .custom-slider .ngx-slider-pointer:focus{outline:0}:host ::ng-deep .custom-slider .ngx-slider-pointer:after{display:none}:host ::ng-deep .custom-slider .ngx-slider-tick{width:.5rem;height:.5rem;margin-left:.25rem;border-radius:1rem;top:1px;background:var(--color-brand-dark)}\n"], dependencies: [{ kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$4.SliderComponent, selector: "ngx-slider", inputs: ["value", "highValue", "options", "manualRefresh", "triggerFocus"], outputs: ["valueChange", "highValueChange", "userChangeStart", "userChange", "userChangeEnd"] }] });
5764
6809
  }
5765
6810
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsSliderComponent, decorators: [{
5766
6811
  type: Component,
@@ -5967,13 +7012,13 @@ class EcabsMenuItemsComponent {
5967
7012
  });
5968
7013
  }
5969
7014
  }
5970
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsMenuItemsComponent, deps: [{ token: UnsubscribeService }, { token: i5.MatIconRegistry }, { token: i3$4.DomSanitizer }, { token: i4$3.Router }], target: i0.ɵɵFactoryTarget.Component });
5971
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsMenuItemsComponent, selector: "ecabs-menu-items", inputs: { menuItems: "menuItems", minimizeSidebar: "minimizeSidebar", truncateTo: "truncateTo" }, outputs: { toggleSidebar: "toggleSidebar" }, providers: [UnsubscribeService], usesOnChanges: true, ngImport: i0, template: "<ul>\r\n <li\r\n *ngFor=\"let item of menuItems; let i = index\"\r\n class=\"mb-2 hover:text-brand-dark cursor-pointer\"\r\n [ngClass]=\"item.expand ? 'font-bold text-brand-dark' : 'text-gray-500'\"\r\n >\r\n <a (click)=\"toggleItem(item, i)\" [id]=\"i\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n class=\"p-4 flex items-center h-max\"\r\n [ngClass]=\"item.expand ? 'text-brand-dark' : 'text-gray-500'\"\r\n >\r\n <mat-icon [svgIcon]=\"item.iconResource?.name || ''\"\r\n class=\"inline-block align-middle mr-4 text-inherit hover:text-inherit\">\r\n {{ item.icon }}\r\n </mat-icon>\r\n <span *ngIf=\"!minimizeSidebar\"\r\n class=\"inline-block align-middle\">\r\n {{ item.title }}\r\n </span>\r\n </a>\r\n <ng-container *ngIf=\"item.expand && item.subItems?.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"firstChildren; context: item\"></ng-container>\r\n </ng-container>\r\n </li>\r\n</ul>\r\n\r\n<ng-template #firstChildren let-subItems=\"subItems\">\r\n <ng-container *ngIf=\"!minimizeSidebar\">\r\n <ul class=\"ml-12\">\r\n <li *ngFor=\"let item of subItems\" [ngClass]=\"item.expand ? 'font-bold text-brand-dark' : 'text-gray-500'\">\r\n <a #rla=\"routerLinkActive\"\r\n (click)=\"toggleSubItem(item, subItems)\"\r\n class=\"text-sm font-light p-4 h-12 rounded-md hover:text-brand-dark flex items-center\"\r\n [ngClass]=\"item.expand && rla.isActive ? 'text-brand-dark' : 'text-gray-500'\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n [routerLinkActive]=\" item.url ? 'bg-brand-300 text-brand-dark' : ''\"\r\n >\r\n <span [title]=\"item.title\">\r\n {{ item.title | truncate: truncateTo }}\r\n </span>\r\n <div *ngIf=\"item.subItems?.length > 0\" class=\"flex-1 text-right\">\r\n <mat-icon class=\"align-middle hover:text-inherit\" [ngClass]=\"{ 'rotate-90': item.expand }\">\r\n keyboard_arrow_right\r\n </mat-icon>\r\n </div>\r\n </a>\r\n <ng-container *ngIf=\"item.expand && item.subItems?.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"secondChildren; context: item\"></ng-container>\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #secondChildren let-subItems=\"subItems\">\r\n <ul class=\"ml-3\">\r\n <li *ngFor=\"let item of subItems\">\r\n <a #rla=\"routerLinkActive\"\r\n [ngClass]=\"item.expand && rla.isActive ? 'text-brand-dark' : 'text-gray-500'\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n [routerLinkActive]=\" item.url ? 'bg-brand-300 text-brand-dark' : ''\"\r\n class=\"text-xs font-light block p-4 h-12 rounded-md hover:text-brand-dark\">\r\n <span>{{ item.title }}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n</ng-template>\r\n", styles: [":host::ng-deep li.text-brand-dark svg path{fill:currentColor}\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: EcabsTruncatePipe, name: "truncate" }] });
7015
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsMenuItemsComponent, deps: [{ token: UnsubscribeService }, { token: i5.MatIconRegistry }, { token: i3$5.DomSanitizer }, { token: i4$4.Router }], target: i0.ɵɵFactoryTarget.Component });
7016
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsMenuItemsComponent, selector: "ecabs-menu-items", inputs: { menuItems: "menuItems", minimizeSidebar: "minimizeSidebar", truncateTo: "truncateTo" }, outputs: { toggleSidebar: "toggleSidebar" }, providers: [UnsubscribeService], usesOnChanges: true, ngImport: i0, template: "<ul>\r\n <li\r\n *ngFor=\"let item of menuItems; let i = index\"\r\n class=\"mb-2 hover:text-brand-dark cursor-pointer\"\r\n [ngClass]=\"item.expand ? 'font-bold text-brand-dark' : 'text-gray-500'\"\r\n >\r\n <a (click)=\"toggleItem(item, i)\" [id]=\"i\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n class=\"p-4 flex items-center h-max\"\r\n [ngClass]=\"item.expand ? 'text-brand-dark' : 'text-gray-500'\"\r\n >\r\n <mat-icon [svgIcon]=\"item.iconResource?.name || ''\"\r\n class=\"inline-block align-middle mr-4 text-inherit hover:text-inherit\">\r\n {{ item.icon }}\r\n </mat-icon>\r\n <span *ngIf=\"!minimizeSidebar\"\r\n class=\"inline-block align-middle\">\r\n {{ item.title }}\r\n </span>\r\n </a>\r\n <ng-container *ngIf=\"item.expand && item.subItems?.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"firstChildren; context: item\"></ng-container>\r\n </ng-container>\r\n </li>\r\n</ul>\r\n\r\n<ng-template #firstChildren let-subItems=\"subItems\">\r\n <ng-container *ngIf=\"!minimizeSidebar\">\r\n <ul class=\"ml-12\">\r\n <li *ngFor=\"let item of subItems\" [ngClass]=\"item.expand ? 'font-bold text-brand-dark' : 'text-gray-500'\">\r\n <a #rla=\"routerLinkActive\"\r\n (click)=\"toggleSubItem(item, subItems)\"\r\n class=\"text-sm font-light p-4 h-12 rounded-md hover:text-brand-dark flex items-center\"\r\n [ngClass]=\"item.expand && rla.isActive ? 'text-brand-dark' : 'text-gray-500'\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n [routerLinkActive]=\" item.url ? 'bg-brand-300 text-brand-dark' : ''\"\r\n >\r\n <span [title]=\"item.title\">\r\n {{ item.title | truncate: truncateTo }}\r\n </span>\r\n <div *ngIf=\"item.subItems?.length > 0\" class=\"flex-1 text-right\">\r\n <mat-icon class=\"align-middle hover:text-inherit\" [ngClass]=\"{ 'rotate-90': item.expand }\">\r\n keyboard_arrow_right\r\n </mat-icon>\r\n </div>\r\n </a>\r\n <ng-container *ngIf=\"item.expand && item.subItems?.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"secondChildren; context: item\"></ng-container>\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #secondChildren let-subItems=\"subItems\">\r\n <ul class=\"ml-3\">\r\n <li *ngFor=\"let item of subItems\">\r\n <a #rla=\"routerLinkActive\"\r\n [ngClass]=\"item.expand && rla.isActive ? 'text-brand-dark' : 'text-gray-500'\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n [routerLinkActive]=\" item.url ? 'bg-brand-300 text-brand-dark' : ''\"\r\n class=\"text-xs font-light block p-4 h-12 rounded-md hover:text-brand-dark\">\r\n <span>{{ item.title }}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n</ng-template>\r\n", styles: [":host::ng-deep li.text-brand-dark svg path{fill:currentColor}\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4$4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: EcabsTruncatePipe, name: "truncate" }] });
5972
7017
  }
5973
7018
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsMenuItemsComponent, decorators: [{
5974
7019
  type: Component,
5975
7020
  args: [{ selector: 'ecabs-menu-items', providers: [UnsubscribeService], template: "<ul>\r\n <li\r\n *ngFor=\"let item of menuItems; let i = index\"\r\n class=\"mb-2 hover:text-brand-dark cursor-pointer\"\r\n [ngClass]=\"item.expand ? 'font-bold text-brand-dark' : 'text-gray-500'\"\r\n >\r\n <a (click)=\"toggleItem(item, i)\" [id]=\"i\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n class=\"p-4 flex items-center h-max\"\r\n [ngClass]=\"item.expand ? 'text-brand-dark' : 'text-gray-500'\"\r\n >\r\n <mat-icon [svgIcon]=\"item.iconResource?.name || ''\"\r\n class=\"inline-block align-middle mr-4 text-inherit hover:text-inherit\">\r\n {{ item.icon }}\r\n </mat-icon>\r\n <span *ngIf=\"!minimizeSidebar\"\r\n class=\"inline-block align-middle\">\r\n {{ item.title }}\r\n </span>\r\n </a>\r\n <ng-container *ngIf=\"item.expand && item.subItems?.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"firstChildren; context: item\"></ng-container>\r\n </ng-container>\r\n </li>\r\n</ul>\r\n\r\n<ng-template #firstChildren let-subItems=\"subItems\">\r\n <ng-container *ngIf=\"!minimizeSidebar\">\r\n <ul class=\"ml-12\">\r\n <li *ngFor=\"let item of subItems\" [ngClass]=\"item.expand ? 'font-bold text-brand-dark' : 'text-gray-500'\">\r\n <a #rla=\"routerLinkActive\"\r\n (click)=\"toggleSubItem(item, subItems)\"\r\n class=\"text-sm font-light p-4 h-12 rounded-md hover:text-brand-dark flex items-center\"\r\n [ngClass]=\"item.expand && rla.isActive ? 'text-brand-dark' : 'text-gray-500'\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n [routerLinkActive]=\" item.url ? 'bg-brand-300 text-brand-dark' : ''\"\r\n >\r\n <span [title]=\"item.title\">\r\n {{ item.title | truncate: truncateTo }}\r\n </span>\r\n <div *ngIf=\"item.subItems?.length > 0\" class=\"flex-1 text-right\">\r\n <mat-icon class=\"align-middle hover:text-inherit\" [ngClass]=\"{ 'rotate-90': item.expand }\">\r\n keyboard_arrow_right\r\n </mat-icon>\r\n </div>\r\n </a>\r\n <ng-container *ngIf=\"item.expand && item.subItems?.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"secondChildren; context: item\"></ng-container>\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #secondChildren let-subItems=\"subItems\">\r\n <ul class=\"ml-3\">\r\n <li *ngFor=\"let item of subItems\">\r\n <a #rla=\"routerLinkActive\"\r\n [ngClass]=\"item.expand && rla.isActive ? 'text-brand-dark' : 'text-gray-500'\"\r\n [routerLink]=\"item.url ? [item.url] : []\"\r\n [routerLinkActive]=\" item.url ? 'bg-brand-300 text-brand-dark' : ''\"\r\n class=\"text-xs font-light block p-4 h-12 rounded-md hover:text-brand-dark\">\r\n <span>{{ item.title }}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n</ng-template>\r\n", styles: [":host::ng-deep li.text-brand-dark svg path{fill:currentColor}\n"] }]
5976
- }], ctorParameters: function () { return [{ type: UnsubscribeService }, { type: i5.MatIconRegistry }, { type: i3$4.DomSanitizer }, { type: i4$3.Router }]; }, propDecorators: { menuItems: [{
7021
+ }], ctorParameters: function () { return [{ type: UnsubscribeService }, { type: i5.MatIconRegistry }, { type: i3$5.DomSanitizer }, { type: i4$4.Router }]; }, propDecorators: { menuItems: [{
5977
7022
  type: Input
5978
7023
  }], minimizeSidebar: [{
5979
7024
  type: Input
@@ -6212,7 +7257,7 @@ class EcabsPlaceAutocompleteComponent extends EcabsElementBaseComponent {
6212
7257
  useExisting: EcabsPlaceAutocompleteComponent,
6213
7258
  multi: true,
6214
7259
  },
6215
- ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [(ngModel)]=\"value\"\r\n [id]=\"name\"\r\n class=\"form-field__input w-full\"\r\n autocorrect=\"off\"\r\n autocapitalize=\"off\"\r\n spellcheck=\"off\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <div class=\"form-field__input--suffix\" *ngIf=\"showSuffix\">\r\n <mat-icon *ngIf=\"showDeleteItem\"\r\n class=\"suffix cursor-pointer delete-button\"\r\n (click)=\"onDeleteItem()\">\r\n delete\r\n </mat-icon>\r\n <mat-icon class=\"suffix cursor-pointer\" *ngIf=\"!showDeleteItem && value\" (click)=\"onClean()\">close</mat-icon>\r\n </div>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: ["mat-form-field{margin-bottom:0!important}.delete-button{color:var(--color-error)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
7260
+ ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [(ngModel)]=\"value\"\r\n [id]=\"name\"\r\n class=\"form-field__input w-full\"\r\n autocorrect=\"off\"\r\n autocapitalize=\"off\"\r\n spellcheck=\"off\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <div class=\"form-field__input--suffix\" *ngIf=\"showSuffix\">\r\n <mat-icon *ngIf=\"showDeleteItem\"\r\n class=\"suffix cursor-pointer delete-button\"\r\n (click)=\"onDeleteItem()\">\r\n delete\r\n </mat-icon>\r\n <mat-icon class=\"suffix cursor-pointer\" *ngIf=\"!showDeleteItem && value\" (click)=\"onClean()\">close</mat-icon>\r\n </div>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: ["mat-form-field{margin-bottom:0!important}.delete-button{color:var(--color-error)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EcabsElementWrapperComponent, selector: "ecabs-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { 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: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
6216
7261
  }
6217
7262
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsPlaceAutocompleteComponent, decorators: [{
6218
7263
  type: Component,
@@ -6378,7 +7423,7 @@ class EcabsMultipleDatesPickerComponent extends EcabsElementBaseComponent {
6378
7423
  multi: true,
6379
7424
  },
6380
7425
  UnsubscribeService,
6381
- ], viewQueries: [{ propertyName: "_picker", first: true, predicate: ["picker"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <mat-chip-grid\r\n #chipList aria-label=\"Choose a date\"\r\n (click)=\"picker.open()\"\r\n class=\"w-full\"\r\n >\r\n <mat-chip-option\r\n class=\"form-field__input\"\r\n *ngFor=\"let value of model\"\r\n [selectable]=\"false\" [removable]=\"true\"\r\n (removed)=\"remove(value)\"\r\n >\r\n {{ value | date: 'dd/MM/yyyy' }}\r\n <mat-icon matChipRemove *ngIf=\"true\">cancel</mat-icon>\r\n </mat-chip-option>\r\n <input\r\n class=\"form-field__input fake-input\"\r\n [value]=\"resetModel\"\r\n [(ngModel)]=\"value\"\r\n [matDatepicker]=\"picker\"\r\n placeholder=\"Select dates\"\r\n (dateChange)=\"dateChanged($event)\"\r\n [matChipInputFor]=\"chipList\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n [matDatepickerFilter]=\"filterDateRange\"\r\n />\r\n </mat-chip-grid>\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\r\n <mat-icon matDatepickerToggleIcon>calendar_today</mat-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker\r\n #picker\r\n [calendarHeaderComponent]=\"header\"\r\n [touchUi]=\"touchUi\"\r\n [dateClass]=\"dateClass\"\r\n >\r\n <mat-datepicker-actions>\r\n <ecabs-date-picker-actions\r\n [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n >\r\n </ecabs-date-picker-actions>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [":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)}:host ::ng-deep .mat-chip-list-wrapper{padding:5px}:host ::ng-deep .mat-chip-list-wrapper .mat-standard-chip{margin:0 5px 0 0}:host ::ng-deep .fake-input{visibility:hidden;width:0;padding:0;margin:0}:host ::ng-deep .form-field__input--wrapper{border:1px solid var(--color-gray-500);padding:5px;align-items:center;background:#fff;border-radius:.25rem}::ng-deep .mat-calendar-body-cell.selected>.mat-calendar-body-cell-content,::ng-deep .mat-calendar-body-cell.selected:hover>.mat-calendar-body-cell-content,::ng-deep .mat-calendar-body-cell.selected>.mat-calendar-body-cell-content:hover{background-color:#673ab7!important;color:#fff!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i5$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i5$2.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "component", type: i7$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["tabIndex", "disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i7$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "component", type: i7$1.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: i7$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5$1.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: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel"], outputs: ["apply"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
7426
+ ], viewQueries: [{ propertyName: "_picker", first: true, predicate: ["picker"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ecabs-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <mat-chip-grid\r\n #chipList aria-label=\"Choose a date\"\r\n (click)=\"picker.open()\"\r\n class=\"w-full\"\r\n >\r\n <mat-chip-option\r\n class=\"form-field__input\"\r\n *ngFor=\"let value of model\"\r\n [selectable]=\"false\" [removable]=\"true\"\r\n (removed)=\"remove(value)\"\r\n >\r\n {{ value | date: 'dd/MM/yyyy' }}\r\n <mat-icon matChipRemove *ngIf=\"true\">cancel</mat-icon>\r\n </mat-chip-option>\r\n <input\r\n class=\"form-field__input fake-input\"\r\n [value]=\"resetModel\"\r\n [(ngModel)]=\"value\"\r\n [matDatepicker]=\"picker\"\r\n placeholder=\"Select dates\"\r\n (dateChange)=\"dateChanged($event)\"\r\n [matChipInputFor]=\"chipList\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n [matDatepickerFilter]=\"filterDateRange\"\r\n />\r\n </mat-chip-grid>\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\r\n <mat-icon matDatepickerToggleIcon>calendar_today</mat-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker\r\n #picker\r\n [calendarHeaderComponent]=\"header\"\r\n [touchUi]=\"touchUi\"\r\n [dateClass]=\"dateClass\"\r\n >\r\n <mat-datepicker-actions>\r\n <ecabs-date-picker-actions\r\n [applyLabel]=\"applyLabel ?? translationConfig?.applyLabel\"\r\n [cancelLabel]=\"cancelLabel ?? translationConfig?.cancelLabel\"\r\n >\r\n </ecabs-date-picker-actions>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n </div>\r\n</ecabs-element-wrapper>\r\n", styles: [":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)}:host ::ng-deep .mat-chip-list-wrapper{padding:5px}:host ::ng-deep .mat-chip-list-wrapper .mat-standard-chip{margin:0 5px 0 0}:host ::ng-deep .fake-input{visibility:hidden;width:0;padding:0;margin:0}:host ::ng-deep .form-field__input--wrapper{border:1px solid var(--color-gray-500);padding:5px;align-items:center;background:#fff;border-radius:.25rem}::ng-deep .mat-calendar-body-cell.selected>.mat-calendar-body-cell-content,::ng-deep .mat-calendar-body-cell.selected:hover>.mat-calendar-body-cell-content,::ng-deep .mat-calendar-body-cell.selected>.mat-calendar-body-cell-content:hover{background-color:#673ab7!important;color:#fff!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$1.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i5$1.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "component", type: i7$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["tabIndex", "disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i7$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "component", type: i7$2.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: i7$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: "component", type: EcabsDatePickerActionsComponent, selector: "ecabs-date-picker-actions", inputs: ["cancelLabel", "applyLabel"], outputs: ["apply"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
6382
7427
  }
6383
7428
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsMultipleDatesPickerComponent, decorators: [{
6384
7429
  type: Component,
@@ -6522,5 +7567,5 @@ const removeEmpty = (o, exceptProperties = []) => {
6522
7567
  * Generated bundle index. Do not edit.
6523
7568
  */
6524
7569
 
6525
- export { ButtonsComponent, EcabsActiveStatusFilterComponent, EcabsActiveStatusFilterModule, EcabsAttachEmbeddedViewDirective, EcabsAttachEmbeddedViewDirectiveModule, EcabsBreadcrumbComponent, EcabsBreadcrumbModule, EcabsButtonsModule, EcabsCheckPermissionDirectiveModule, EcabsCheckPermissionsDirective, EcabsCheckboxToggleComponent, EcabsCheckboxToggleModule, EcabsComponentsService, EcabsDatePickerComponent, EcabsDatePickerHeaderComponent, EcabsDatePickerHeaderService, EcabsDatePickerModule, EcabsDateRangeModule, EcabsDateRangePickerComponent, EcabsDateRangePickerHeaderComponent, EcabsDateTimePickerComponent, EcabsDateTimePickerHeaderComponent, EcabsDateTimeRangePickerComponent, EcabsDateTimeRangePickerHeaderComponent, EcabsDatetimePickerModule, EcabsDatetimeRangePickerModule, EcabsDialogConfirmComponent, EcabsDialogConfirmModule, EcabsDialogMessageComponent, EcabsDialogMessageModule, EcabsDigitsOnlyDirective, EcabsDigitsOnlyDirectivesModule, EcabsDomObserverDirective, EcabsDomObserverDirectiveModule, EcabsDynamicBgColorDirective, EcabsDynamicBgColorDirectiveModule, EcabsElementMultiplierDirective, EcabsElementMultiplierDirectiveModule, EcabsEmptyPlaceholderComponent, EcabsEmptyPlaceholderModule, EcabsExpansionPanelComponent, EcabsExpansionPanelModule, EcabsFileDropDirective, EcabsFileDropDirectiveModule, EcabsHeaderComponent, EcabsHeaderModule, EcabsHintComponent, EcabsHintModule, EcabsIncrementComponent, EcabsIncrementModule, EcabsInputComponent, EcabsInputModule, EcabsLanguageSelectorComponent, EcabsLanguageSelectorModule, EcabsLoadingComponent, EcabsLoadingModule, EcabsLogoComponent, EcabsLogoModule, EcabsMaskDateDirective, EcabsMaskDateDirectiveModule, EcabsMaskTimeDirective, EcabsMaskTimeDirectiveModule, EcabsMaxDirective, EcabsMenuItemsComponent, EcabsMenuItemsModule, EcabsMinDirective, EcabsMinMaxDirectiveModule, EcabsMultipleDatesPickerComponent, EcabsMultipleDatesPickerModule, EcabsNoteComponent, EcabsNoteModule, EcabsNumberBorderDirective, EcabsNumberBorderDirectiveModule, EcabsPaginatorDirective, EcabsPaginatorDirectiveModule, EcabsPhoneComponent, EcabsPhoneModule, EcabsPipesModule, EcabsPlaceAutocompleteComponent, EcabsPlaceAutocompleteModule, EcabsProfileComponent, EcabsProfileModule, EcabsRadioButtonListComponent, EcabsRadioButtonListModule, EcabsSelectComponent, EcabsSelectModule, EcabsSelectV2Component, EcabsSelectV2Module, EcabsShowOnTruncatedDirective, EcabsShowOnTruncatedDirectiveModule, EcabsSidebarComponent, EcabsSidebarModule, EcabsSliderComponent, EcabsSliderModule, EcabsSpinnerComponent, EcabsTableFilterWrapperComponent, EcabsTableFilterWrapperModule, EcabsTableModule, EcabsTextAreaModule, EcabsTextareaComponent, EcabsTimeListPanelComponent, EcabsTimeRangeDirective, EcabsTimeRangeDirectiveModule, EcabsTimepickerComponent, EcabsTimepickerModule, EcabsTooltipIfTruncatedDirective, EcabsTooltipIfTruncatedDirectiveModule, EcabsTruncatePipe, EcabsUppercaseMaskDirective, EcabsUppercaseMaskDirectiveModule, EcabsValidationComponent, EcabsValidationModule, EcabsValidationViewModule, FormTimePickerService, GenericComponentConfig, HeaderService, MATERIAL_DATETIMEPICKER_FORMATS, TableComponent, UnsubscribeService, ValidationComponent, removeEmpty, removeNullUndefineds, scrollFactory, sortGeneric };
7570
+ export { ButtonsComponent, EcabsActiveStatusFilterComponent, EcabsActiveStatusFilterModule, EcabsAttachEmbeddedViewDirective, EcabsAttachEmbeddedViewDirectiveModule, EcabsBasePhoneComponent, EcabsBasePhoneModule, EcabsBreadcrumbComponent, EcabsBreadcrumbModule, EcabsButtonsModule, EcabsCheckPermissionDirectiveModule, EcabsCheckPermissionsDirective, EcabsCheckboxToggleComponent, EcabsCheckboxToggleModule, EcabsComponentsService, EcabsDatePickerComponent, EcabsDatePickerHeaderComponent, EcabsDatePickerHeaderService, EcabsDatePickerModule, EcabsDateRangeModule, EcabsDateRangePickerComponent, EcabsDateRangePickerHeaderComponent, EcabsDateTimePickerComponent, EcabsDateTimePickerHeaderComponent, EcabsDateTimeRangePickerComponent, EcabsDateTimeRangePickerHeaderComponent, EcabsDatetimePickerModule, EcabsDatetimeRangePickerModule, EcabsDialogConfirmComponent, EcabsDialogConfirmModule, EcabsDialogMessageComponent, EcabsDialogMessageModule, EcabsDigitsOnlyDirective, EcabsDigitsOnlyDirectivesModule, EcabsDomObserverDirective, EcabsDomObserverDirectiveModule, EcabsDynamicBgColorDirective, EcabsDynamicBgColorDirectiveModule, EcabsElementMultiplierDirective, EcabsElementMultiplierDirectiveModule, EcabsEmptyPlaceholderComponent, EcabsEmptyPlaceholderModule, EcabsExpansionPanelComponent, EcabsExpansionPanelModule, EcabsFileDropDirective, EcabsFileDropDirectiveModule, EcabsHeaderComponent, EcabsHeaderModule, EcabsHintComponent, EcabsHintModule, EcabsIncrementComponent, EcabsIncrementModule, EcabsInputComponent, EcabsInputModule, EcabsLanguageSelectorComponent, EcabsLanguageSelectorModule, EcabsLoadingComponent, EcabsLoadingModule, EcabsLogoComponent, EcabsLogoModule, EcabsMaskDateDirective, EcabsMaskDateDirectiveModule, EcabsMaskTimeDirective, EcabsMaskTimeDirectiveModule, EcabsMaxDirective, EcabsMenuItemsComponent, EcabsMenuItemsModule, EcabsMinDirective, EcabsMinMaxDirectiveModule, EcabsMultipleDatesPickerComponent, EcabsMultipleDatesPickerModule, EcabsNoteComponent, EcabsNoteModule, EcabsNumberBorderDirective, EcabsNumberBorderDirectiveModule, EcabsPaginatorDirective, EcabsPaginatorDirectiveModule, EcabsPhoneComponent, EcabsPhoneModule, EcabsPipesModule, EcabsPlaceAutocompleteComponent, EcabsPlaceAutocompleteModule, EcabsProfileComponent, EcabsProfileModule, EcabsRadioButtonListComponent, EcabsRadioButtonListModule, EcabsSelectComponent, EcabsSelectModule, EcabsSelectV2Component, EcabsSelectV2Module, EcabsShowOnTruncatedDirective, EcabsShowOnTruncatedDirectiveModule, EcabsSidebarComponent, EcabsSidebarModule, EcabsSliderComponent, EcabsSliderModule, EcabsSpinnerComponent, EcabsTableFilterWrapperComponent, EcabsTableFilterWrapperModule, EcabsTableModule, EcabsTextAreaModule, EcabsTextareaComponent, EcabsTimeListPanelComponent, EcabsTimeRangeDirective, EcabsTimeRangeDirectiveModule, EcabsTimepickerComponent, EcabsTimepickerModule, EcabsTooltipIfTruncatedDirective, EcabsTooltipIfTruncatedDirectiveModule, EcabsTruncatePipe, EcabsUppercaseMaskDirective, EcabsUppercaseMaskDirectiveModule, EcabsValidationComponent, EcabsValidationModule, EcabsValidationViewModule, FormTimePickerService, GenericComponentConfig, HeaderService, MATERIAL_DATETIMEPICKER_FORMATS, TableComponent, UnsubscribeService, ValidationComponent, removeEmpty, removeNullUndefineds, scrollFactory, sortGeneric };
6526
7571
  //# sourceMappingURL=ecabs-components.mjs.map