@testgorilla/tgo-ui 2.3.0 → 2.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/components/autocomplete/autocomplete.component.d.ts +11 -5
  2. package/components/autocomplete/autocomplete.component.module.d.ts +2 -1
  3. package/components/checkbox/checkbox.component.d.ts +20 -7
  4. package/components/checkbox/checkbox.component.module.d.ts +4 -1
  5. package/components/dropdown/dropdown.component.d.ts +12 -6
  6. package/components/dropdown/dropdown.component.module.d.ts +2 -1
  7. package/components/field/field.component.d.ts +11 -5
  8. package/components/field/field.component.module.d.ts +2 -1
  9. package/components/phone-input/phone-input.component.d.ts +8 -2
  10. package/components/phone-input/phone-input.component.module.d.ts +2 -1
  11. package/components/validation-error/validation-error.component.d.ts +27 -0
  12. package/components/validation-error/validation-error.model.d.ts +1 -0
  13. package/components/validation-error/validation-error.module.d.ts +10 -0
  14. package/esm2022/assets/i18n/en.json +8 -0
  15. package/esm2022/components/autocomplete/autocomplete.component.mjs +39 -30
  16. package/esm2022/components/autocomplete/autocomplete.component.module.mjs +7 -3
  17. package/esm2022/components/checkbox/checkbox.component.mjs +39 -22
  18. package/esm2022/components/checkbox/checkbox.component.module.mjs +7 -4
  19. package/esm2022/components/dropdown/dropdown.component.mjs +34 -27
  20. package/esm2022/components/dropdown/dropdown.component.module.mjs +7 -3
  21. package/esm2022/components/field/field.component.mjs +35 -29
  22. package/esm2022/components/field/field.component.module.mjs +7 -3
  23. package/esm2022/components/navbar/mobile-navbar-side-sheet/mobile-navbar-side-sheet.component.mjs +3 -3
  24. package/esm2022/components/phone-input/phone-input.component.mjs +23 -7
  25. package/esm2022/components/phone-input/phone-input.component.module.mjs +7 -3
  26. package/esm2022/components/scale/scale.component.mjs +2 -2
  27. package/esm2022/components/segmented-button/segmented-button.component.mjs +2 -2
  28. package/esm2022/components/validation-error/validation-error.component.mjs +59 -0
  29. package/esm2022/components/validation-error/validation-error.model.mjs +2 -0
  30. package/esm2022/components/validation-error/validation-error.module.mjs +20 -0
  31. package/fesm2022/testgorilla-tgo-ui.mjs +498 -361
  32. package/fesm2022/testgorilla-tgo-ui.mjs.map +1 -1
  33. package/package.json +1 -1
  34. package/src/assets/i18n/en.json +8 -0
  35. package/src/theme/_font.scss +46 -16
  36. package/src/theme/_lib-styles.scss +2 -1
  37. package/src/theme/_typography.scss +5 -5
  38. package/src/theme/theme.scss +2 -1
@@ -1,15 +1,16 @@
1
- import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnChanges } from '@angular/core';
2
- import { ControlValueAccessor } from '@angular/forms';
1
+ import { AfterViewInit, ChangeDetectorRef, DoCheck, ElementRef, EventEmitter, OnChanges } from '@angular/core';
2
+ import { ControlValueAccessor, NgControl } from '@angular/forms';
3
3
  import { MatAutocomplete, MatAutocompleteSelectedEvent, MatAutocompleteTrigger } from '@angular/material/autocomplete';
4
4
  import { ReplaySubject } from 'rxjs';
5
5
  import { Autocomplete, AutocompleteType, DropdownVariation } from './autocomplete.model';
6
6
  import { ApplicationTheme } from '../../models/application-theme.model';
7
7
  import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
8
8
  import * as i0 from "@angular/core";
9
- export declare class AutocompleteComponent implements ControlValueAccessor, OnChanges, AfterViewInit {
9
+ export declare class AutocompleteComponent implements ControlValueAccessor, OnChanges, AfterViewInit, DoCheck {
10
10
  private readonly defaultAppTheme;
11
11
  private readonly cdr;
12
12
  private readonly domSanitizer;
13
+ ngControl: NgControl;
13
14
  /**
14
15
  * @property itemsList
15
16
  * @description The list of items to display in the autocomplete.
@@ -138,7 +139,12 @@ export declare class AutocompleteComponent implements ControlValueAccessor, OnCh
138
139
  protected filteredSuggestionList$: import("rxjs").Observable<any>;
139
140
  protected searchResult$: import("rxjs").Observable<boolean>;
140
141
  protected translationContext: string;
141
- constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, domSanitizer: DomSanitizer);
142
+ constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, domSanitizer: DomSanitizer, ngControl: NgControl);
143
+ /**
144
+ * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched
145
+ * to display validation errors that might happen (e.g. required)
146
+ */
147
+ ngDoCheck(): void;
142
148
  ngOnChanges(): void;
143
149
  ngAfterViewInit(): void;
144
150
  onChange: (_: any) => void;
@@ -161,6 +167,6 @@ export declare class AutocompleteComponent implements ControlValueAccessor, OnCh
161
167
  protected onChevronClick(autocomplete: MatAutocomplete): void;
162
168
  protected get inputWidth(): number;
163
169
  protected trackByFn: (index: number, value: any) => any;
164
- static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, [{ optional: true; }, null, null]>;
170
+ static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, [{ optional: true; }, null, null, { optional: true; self: true; }]>;
165
171
  static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteComponent, "ui-autocomplete", never, { "itemsList": { "alias": "itemsList"; "required": false; }; "suggestionsList": { "alias": "suggestionsList"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "allowAdd": { "alias": "allowAdd"; "required": false; }; "textField": { "alias": "textField"; "required": false; }; "valueField": { "alias": "valueField"; "required": false; }; "label": { "alias": "label"; "required": false; }; "itemValue": { "alias": "itemValue"; "required": false; }; "type": { "alias": "type"; "required": false; }; "minCharactersSearch": { "alias": "minCharactersSearch"; "required": false; }; "variant": { "alias": "variant"; "required": true; }; "language": { "alias": "language"; "required": false; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "valuePrimitive": { "alias": "valuePrimitive"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; }, { "selectionChange": "selectionChange"; "searchTextChange": "searchTextChange"; }, never, never, false, never>;
166
172
  }
@@ -12,8 +12,9 @@ import * as i10 from "../tag/tag.component.module";
12
12
  import * as i11 from "@angular/material/chips";
13
13
  import * as i12 from "../icon/icon.component.module";
14
14
  import * as i13 from "../../pipes/ui-translate.pipe";
15
+ import * as i14 from "../validation-error/validation-error.module";
15
16
  export declare class AutocompleteComponentModule {
16
17
  static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponentModule, never>;
17
- static ɵmod: i0.ɵɵNgModuleDeclaration<AutocompleteComponentModule, [typeof i1.AutocompleteComponent, typeof i2.TransformItemPipe, typeof i3.IncludesPipe, typeof i4.SelectTextDirective], [typeof i5.CommonModule, typeof i6.MatFormFieldModule, typeof i7.MatAutocompleteModule, typeof i8.MatInputModule, typeof i9.FormsModule, typeof i10.TagComponentModule, typeof i11.MatChipsModule, typeof i12.IconComponentModule, typeof i13.UiTranslatePipe], [typeof i1.AutocompleteComponent]>;
18
+ static ɵmod: i0.ɵɵNgModuleDeclaration<AutocompleteComponentModule, [typeof i1.AutocompleteComponent, typeof i2.TransformItemPipe, typeof i3.IncludesPipe, typeof i4.SelectTextDirective], [typeof i5.CommonModule, typeof i6.MatFormFieldModule, typeof i7.MatAutocompleteModule, typeof i8.MatInputModule, typeof i9.FormsModule, typeof i10.TagComponentModule, typeof i11.MatChipsModule, typeof i12.IconComponentModule, typeof i13.UiTranslatePipe, typeof i14.ValidationErrorModule], [typeof i1.AutocompleteComponent]>;
18
19
  static ɵinj: i0.ɵɵInjectorDeclaration<AutocompleteComponentModule>;
19
20
  }
@@ -1,11 +1,12 @@
1
- import { EventEmitter, OnInit, ChangeDetectorRef } from '@angular/core';
2
- import { ControlValueAccessor } from '@angular/forms';
1
+ import { ChangeDetectorRef, DoCheck, EventEmitter, OnInit } from '@angular/core';
2
+ import { ControlValueAccessor, NgControl } from '@angular/forms';
3
3
  import { MatCheckboxChange } from '@angular/material/checkbox';
4
- import { ApplicationTheme } from "../../models/application-theme.model";
4
+ import { ApplicationTheme } from '../../models/application-theme.model';
5
5
  import * as i0 from "@angular/core";
6
- export declare class CheckboxComponent implements OnInit, ControlValueAccessor {
6
+ export declare class CheckboxComponent implements OnInit, ControlValueAccessor, DoCheck {
7
7
  private readonly defaultAppTheme;
8
8
  private cdr;
9
+ ngControl: NgControl;
9
10
  /**
10
11
  * Determines whether the checkbox is disabled.
11
12
  * Default: false.
@@ -90,6 +91,13 @@ export declare class CheckboxComponent implements OnInit, ControlValueAccessor {
90
91
  * @memberof CheckboxComponent
91
92
  */
92
93
  hasError: boolean;
94
+ /**
95
+ * The language to be used
96
+ * @property language
97
+ * @type {Language}
98
+ * @memberof DropdownComponent
99
+ */
100
+ language: import("@testgorilla/tgo-ui").Language;
93
101
  /**
94
102
  * Event emitted when the checkbox's checked value changes.
95
103
  *
@@ -106,7 +114,12 @@ export declare class CheckboxComponent implements OnInit, ControlValueAccessor {
106
114
  */
107
115
  onTouch: () => void;
108
116
  classMultiple: string;
109
- constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef);
117
+ constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, ngControl: NgControl);
118
+ /**
119
+ * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched
120
+ * to display validation errors that might happen (e.g. required)
121
+ */
122
+ ngDoCheck(): void;
110
123
  emitChange(event: MatCheckboxChange): void;
111
124
  ngOnInit(): void;
112
125
  toggleChecked(event: MatCheckboxChange): void;
@@ -115,6 +128,6 @@ export declare class CheckboxComponent implements OnInit, ControlValueAccessor {
115
128
  registerOnChange(fn: any): void;
116
129
  registerOnTouched(fn: any): void;
117
130
  setDisabledState(isDisabled: boolean): void;
118
- static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, [{ optional: true; }, null]>;
119
- static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "ui-checkbox", never, { "disabled": { "alias": "disabled"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "name": { "alias": "name"; "required": false; }; "label": { "alias": "label"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "hasError": { "alias": "hasError"; "required": false; }; }, { "changed": "changed"; }, never, ["[checkbox-label]"], false, never>;
131
+ static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, [{ optional: true; }, null, { optional: true; self: true; }]>;
132
+ static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "ui-checkbox", never, { "disabled": { "alias": "disabled"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "name": { "alias": "name"; "required": false; }; "label": { "alias": "label"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "hasError": { "alias": "hasError"; "required": false; }; "language": { "alias": "language"; "required": false; }; }, { "changed": "changed"; }, never, ["[checkbox-label]"], false, never>;
120
133
  }
@@ -4,8 +4,11 @@ import * as i2 from "@angular/common";
4
4
  import * as i3 from "@angular/material/checkbox";
5
5
  import * as i4 from "@angular/forms";
6
6
  import * as i5 from "@angular/material/input";
7
+ import * as i6 from "../icon/icon.component.module";
8
+ import * as i7 from "../../pipes/ui-translate.pipe";
9
+ import * as i8 from "../validation-error/validation-error.module";
7
10
  export declare class CheckboxComponentModule {
8
11
  static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponentModule, never>;
9
- static ɵmod: i0.ɵɵNgModuleDeclaration<CheckboxComponentModule, [typeof i1.CheckboxComponent], [typeof i2.CommonModule, typeof i3.MatCheckboxModule, typeof i4.FormsModule, typeof i4.ReactiveFormsModule, typeof i5.MatInputModule], [typeof i1.CheckboxComponent]>;
12
+ static ɵmod: i0.ɵɵNgModuleDeclaration<CheckboxComponentModule, [typeof i1.CheckboxComponent], [typeof i2.CommonModule, typeof i3.MatCheckboxModule, typeof i4.FormsModule, typeof i4.ReactiveFormsModule, typeof i5.MatInputModule, typeof i6.IconComponentModule, typeof i7.UiTranslatePipe, typeof i8.ValidationErrorModule], [typeof i1.CheckboxComponent]>;
10
13
  static ɵinj: i0.ɵɵInjectorDeclaration<CheckboxComponentModule>;
11
14
  }
@@ -1,12 +1,13 @@
1
- import { ChangeDetectorRef, OnInit } from '@angular/core';
2
- import { ControlValueAccessor } from '@angular/forms';
1
+ import { ChangeDetectorRef, DoCheck, OnInit } from '@angular/core';
2
+ import { ControlValueAccessor, NgControl } from '@angular/forms';
3
3
  import { FloatLabelType } from '@angular/material/form-field';
4
4
  import { OptionType } from './dropdown.model';
5
- import { ApplicationTheme } from "../../models/application-theme.model";
5
+ import { ApplicationTheme } from '../../models/application-theme.model';
6
6
  import * as i0 from "@angular/core";
7
- export declare class DropdownComponent implements OnInit, ControlValueAccessor {
7
+ export declare class DropdownComponent implements OnInit, ControlValueAccessor, DoCheck {
8
8
  private readonly defaultAppTheme;
9
9
  private cdr;
10
+ ngControl: NgControl;
10
11
  class: string;
11
12
  /**
12
13
  * Text content will be applied to the input element if present.
@@ -119,11 +120,16 @@ export declare class DropdownComponent implements OnInit, ControlValueAccessor {
119
120
  * @ignore
120
121
  */
121
122
  onTouch: () => void;
122
- constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef);
123
+ constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, ngControl: NgControl);
123
124
  floatLabel: FloatLabelType;
124
125
  classError: string;
125
126
  errorsLength: boolean;
126
127
  showCheck: boolean;
128
+ /**
129
+ * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched
130
+ * to display validation errors that might happen (e.g. required)
131
+ */
132
+ ngDoCheck(): void;
127
133
  ngOnInit(): void;
128
134
  clearValue(event: Event): void;
129
135
  onChangeOption(event: any): void;
@@ -132,6 +138,6 @@ export declare class DropdownComponent implements OnInit, ControlValueAccessor {
132
138
  registerOnChange(fn: any): void;
133
139
  registerOnTouched(fn: any): void;
134
140
  setDisabledState(isDisabled: boolean): void;
135
- static ɵfac: i0.ɵɵFactoryDeclaration<DropdownComponent, [{ optional: true; }, null]>;
141
+ static ɵfac: i0.ɵɵFactoryDeclaration<DropdownComponent, [{ optional: true; }, null, { optional: true; self: true; }]>;
136
142
  static ɵcmp: i0.ɵɵComponentDeclaration<DropdownComponent, "ui-dropdown", never, { "label": { "alias": "label"; "required": false; }; "name": { "alias": "name"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "id": { "alias": "id"; "required": false; }; "value": { "alias": "value"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "valueList": { "alias": "valueList"; "required": false; }; "allowClear": { "alias": "allowClear"; "required": false; }; "allowMultipleSelection": { "alias": "allowMultipleSelection"; "required": false; }; "required": { "alias": "required"; "required": false; }; "language": { "alias": "language"; "required": false; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; }, {}, never, never, false, never>;
137
143
  }
@@ -8,8 +8,9 @@ import * as i6 from "@angular/forms";
8
8
  import * as i7 from "../button/button.component.module";
9
9
  import * as i8 from "@angular/material/select";
10
10
  import * as i9 from "../../pipes/ui-translate.pipe";
11
+ import * as i10 from "../validation-error/validation-error.module";
11
12
  export declare class DropdownComponentModule {
12
13
  static ɵfac: i0.ɵɵFactoryDeclaration<DropdownComponentModule, never>;
13
- static ɵmod: i0.ɵɵNgModuleDeclaration<DropdownComponentModule, [typeof i1.DropdownComponent], [typeof i2.CommonModule, typeof i3.MatFormFieldModule, typeof i4.MatInputModule, typeof i5.IconComponentModule, typeof i6.FormsModule, typeof i6.ReactiveFormsModule, typeof i7.ButtonComponentModule, typeof i8.MatSelectModule, typeof i9.UiTranslatePipe], [typeof i1.DropdownComponent]>;
14
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DropdownComponentModule, [typeof i1.DropdownComponent], [typeof i2.CommonModule, typeof i3.MatFormFieldModule, typeof i4.MatInputModule, typeof i5.IconComponentModule, typeof i6.FormsModule, typeof i6.ReactiveFormsModule, typeof i7.ButtonComponentModule, typeof i8.MatSelectModule, typeof i9.UiTranslatePipe, typeof i10.ValidationErrorModule], [typeof i1.DropdownComponent]>;
14
15
  static ɵinj: i0.ɵɵInjectorDeclaration<DropdownComponentModule>;
15
16
  }
@@ -1,16 +1,17 @@
1
- import { ChangeDetectorRef, EventEmitter, OnInit } from '@angular/core';
2
- import { ControlValueAccessor } from '@angular/forms';
1
+ import { ChangeDetectorRef, DoCheck, EventEmitter, OnInit } from '@angular/core';
2
+ import { ControlValueAccessor, NgControl } from '@angular/forms';
3
3
  import { FieldType } from '../../components/field/field.model';
4
4
  import { MatIconRegistry } from '@angular/material/icon';
5
5
  import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
6
6
  import { ApplicationTheme } from '../../models/application-theme.model';
7
7
  import { IconName } from '../icon/icon.model';
8
8
  import * as i0 from "@angular/core";
9
- export declare class FieldComponent implements OnInit, ControlValueAccessor {
9
+ export declare class FieldComponent implements OnInit, ControlValueAccessor, DoCheck {
10
10
  private readonly defaultAppTheme;
11
11
  private matIconRegistry;
12
12
  private domSanitizer;
13
13
  private cdr;
14
+ ngControl: NgControl;
14
15
  class: string;
15
16
  /**
16
17
  * Form field label
@@ -181,7 +182,12 @@ export declare class FieldComponent implements OnInit, ControlValueAccessor {
181
182
  * @ignore
182
183
  */
183
184
  onTouch: () => void;
184
- constructor(defaultAppTheme: ApplicationTheme, matIconRegistry: MatIconRegistry, domSanitizer: DomSanitizer, cdr: ChangeDetectorRef);
185
+ constructor(defaultAppTheme: ApplicationTheme, matIconRegistry: MatIconRegistry, domSanitizer: DomSanitizer, cdr: ChangeDetectorRef, ngControl: NgControl);
186
+ /**
187
+ * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched
188
+ * to display validation errors that might happen (e.g. required)
189
+ */
190
+ ngDoCheck(): void;
185
191
  showClose: boolean;
186
192
  showPassword: boolean;
187
193
  currentType: string;
@@ -204,6 +210,6 @@ export declare class FieldComponent implements OnInit, ControlValueAccessor {
204
210
  onSubmit(): void;
205
211
  private clearSpace;
206
212
  trackByFn: (index: number, value: any) => any;
207
- static ɵfac: i0.ɵɵFactoryDeclaration<FieldComponent, [{ optional: true; }, null, null, null]>;
213
+ static ɵfac: i0.ɵɵFactoryDeclaration<FieldComponent, [{ optional: true; }, null, null, null, { optional: true; self: true; }]>;
208
214
  static ɵcmp: i0.ɵɵComponentDeclaration<FieldComponent, "ui-field", never, { "label": { "alias": "label"; "required": false; }; "fieldName": { "alias": "fieldName"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "id": { "alias": "id"; "required": false; }; "value": { "alias": "value"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "hintMessage": { "alias": "hintMessage"; "required": false; }; "type": { "alias": "type"; "required": false; }; "updateOnBlur": { "alias": "updateOnBlur"; "required": false; }; "allowOnlyDigits": { "alias": "allowOnlyDigits"; "required": false; }; "language": { "alias": "language"; "required": false; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "isValid": { "alias": "isValid"; "required": false; }; "maxCharacters": { "alias": "maxCharacters"; "required": false; }; "trimOnBlur": { "alias": "trimOnBlur"; "required": false; }; "trimOnSubmit": { "alias": "trimOnSubmit"; "required": false; }; }, { "validateEvent": "validateEvent"; }, never, never, false, never>;
209
215
  }
@@ -9,8 +9,9 @@ import * as i7 from "@angular/forms";
9
9
  import * as i8 from "../button/button.component.module";
10
10
  import * as i9 from "@angular/material/icon";
11
11
  import * as i10 from "../../pipes/ui-translate.pipe";
12
+ import * as i11 from "../validation-error/validation-error.module";
12
13
  export declare class FieldComponentModule {
13
14
  static ɵfac: i0.ɵɵFactoryDeclaration<FieldComponentModule, never>;
14
- static ɵmod: i0.ɵɵNgModuleDeclaration<FieldComponentModule, [typeof i1.FieldComponent, typeof i2.DigitsOnlyDirective], [typeof i3.CommonModule, typeof i4.MatFormFieldModule, typeof i5.MatInputModule, typeof i6.IconComponentModule, typeof i7.FormsModule, typeof i7.ReactiveFormsModule, typeof i8.ButtonComponentModule, typeof i9.MatIconModule, typeof i10.UiTranslatePipe], [typeof i1.FieldComponent]>;
15
+ static ɵmod: i0.ɵɵNgModuleDeclaration<FieldComponentModule, [typeof i1.FieldComponent, typeof i2.DigitsOnlyDirective], [typeof i3.CommonModule, typeof i4.MatFormFieldModule, typeof i5.MatInputModule, typeof i6.IconComponentModule, typeof i7.FormsModule, typeof i7.ReactiveFormsModule, typeof i8.ButtonComponentModule, typeof i9.MatIconModule, typeof i10.UiTranslatePipe, typeof i11.ValidationErrorModule], [typeof i1.FieldComponent]>;
15
16
  static ɵinj: i0.ɵɵInjectorDeclaration<FieldComponentModule>;
16
17
  }
@@ -1,5 +1,5 @@
1
1
  import { FocusMonitor } from '@angular/cdk/a11y';
2
- import { ChangeDetectorRef, ElementRef, OnDestroy, OnInit } from '@angular/core';
2
+ import { ChangeDetectorRef, DoCheck, ElementRef, OnDestroy, OnInit } from '@angular/core';
3
3
  import { ControlValueAccessor, NgControl, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
4
4
  import { ErrorStateMatcher } from '@angular/material/core';
5
5
  import { BehaviorSubject, Observable, Subject } from 'rxjs';
@@ -8,7 +8,7 @@ import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
8
8
  import { ApplicationTheme } from '../../models/application-theme.model';
9
9
  import { UICountry } from './phone-input.model';
10
10
  import * as i0 from "@angular/core";
11
- export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlValueAccessor {
11
+ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlValueAccessor, DoCheck {
12
12
  ngControl: NgControl;
13
13
  private errorMatcher;
14
14
  private fb;
@@ -102,6 +102,11 @@ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlVa
102
102
  protected selectedCountry: UICountry;
103
103
  private unsubscribeAll$;
104
104
  constructor(ngControl: NgControl, errorMatcher: ErrorStateMatcher, fb: UntypedFormBuilder, focusMonitor: FocusMonitor, ref: ChangeDetectorRef, iconRegistry: MatIconRegistry, sanitizer: DomSanitizer, defaultAppTheme: ApplicationTheme);
105
+ /**
106
+ * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched
107
+ * to display validation errors that might happen (e.g. required)
108
+ */
109
+ ngDoCheck(): void;
105
110
  ngOnInit(): void;
106
111
  registerCountryFlag(countryIso: string): void;
107
112
  setErrorsLength(): boolean;
@@ -121,6 +126,7 @@ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlVa
121
126
  private preSelectCountry;
122
127
  private setCountry;
123
128
  private getCountryByAlpha2Code;
129
+ private getCountryByCallingCode;
124
130
  private loadCountries;
125
131
  disableClick(ev: Event): void;
126
132
  trackByFn: (index: number, value: any) => any;
@@ -11,8 +11,9 @@ import * as i9 from "ngx-mat-select-search";
11
11
  import * as i10 from "../icon/icon.component.module";
12
12
  import * as i11 from "../spinner/spinner.module";
13
13
  import * as i12 from "../../pipes/ui-translate.pipe";
14
+ import * as i13 from "../validation-error/validation-error.module";
14
15
  export declare class PhoneInputComponentModule {
15
16
  static ɵfac: i0.ɵɵFactoryDeclaration<PhoneInputComponentModule, never>;
16
- static ɵmod: i0.ɵɵNgModuleDeclaration<PhoneInputComponentModule, [typeof i1.PhoneInputComponent, typeof i2.JoinStringsPipe], [typeof i3.CommonModule, typeof i4.MatProgressSpinnerModule, typeof i5.ReactiveFormsModule, typeof i6.MatSelectModule, typeof i7.MatIconModule, typeof i8.MatInputModule, typeof i9.NgxMatSelectSearchModule, typeof i10.IconComponentModule, typeof i11.SpinnerComponentModule, typeof i12.UiTranslatePipe], [typeof i1.PhoneInputComponent]>;
17
+ static ɵmod: i0.ɵɵNgModuleDeclaration<PhoneInputComponentModule, [typeof i1.PhoneInputComponent, typeof i2.JoinStringsPipe], [typeof i3.CommonModule, typeof i4.MatProgressSpinnerModule, typeof i5.ReactiveFormsModule, typeof i6.MatSelectModule, typeof i7.MatIconModule, typeof i8.MatInputModule, typeof i9.NgxMatSelectSearchModule, typeof i10.IconComponentModule, typeof i11.SpinnerComponentModule, typeof i12.UiTranslatePipe, typeof i13.ValidationErrorModule], [typeof i1.PhoneInputComponent]>;
17
18
  static ɵinj: i0.ɵɵInjectorDeclaration<PhoneInputComponentModule>;
18
19
  }
@@ -0,0 +1,27 @@
1
+ import { errorType } from './validation-error.model';
2
+ import { NgControl } from '@angular/forms';
3
+ import { ApplicationTheme } from '../../models/application-theme.model';
4
+ import * as i0 from "@angular/core";
5
+ export declare class ValidationErrorComponent {
6
+ ngControl: NgControl;
7
+ label: string | undefined;
8
+ /**
9
+ *
10
+ * Defines the application theme
11
+ *
12
+ * @type {ApplicationTheme}
13
+ * @memberof ValidationErrorComponent
14
+ */
15
+ applicationTheme: ApplicationTheme;
16
+ /**
17
+ * The language to be used
18
+ * @property language
19
+ * @type {Language}
20
+ * @memberof ValidationErrorComponent
21
+ */
22
+ language: import("@testgorilla/tgo-ui").Language;
23
+ getErrorValue(type: errorType): number;
24
+ translationContextErrors: string;
25
+ static ɵfac: i0.ɵɵFactoryDeclaration<ValidationErrorComponent, never>;
26
+ static ɵcmp: i0.ɵɵComponentDeclaration<ValidationErrorComponent, "ui-validation-error", never, { "ngControl": { "alias": "ngControl"; "required": false; }; "label": { "alias": "label"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "language": { "alias": "language"; "required": false; }; }, {}, never, never, false, never>;
27
+ }
@@ -0,0 +1 @@
1
+ export type errorType = 'maxlength' | 'minlength' | 'min' | 'max';
@@ -0,0 +1,10 @@
1
+ import * as i0 from "@angular/core";
2
+ import * as i1 from "./validation-error.component";
3
+ import * as i2 from "@angular/common";
4
+ import * as i3 from "../icon/icon.component.module";
5
+ import * as i4 from "../../pipes/ui-translate.pipe";
6
+ export declare class ValidationErrorModule {
7
+ static ɵfac: i0.ɵɵFactoryDeclaration<ValidationErrorModule, never>;
8
+ static ɵmod: i0.ɵɵNgModuleDeclaration<ValidationErrorModule, [typeof i1.ValidationErrorComponent], [typeof i2.CommonModule, typeof i3.IconComponentModule, typeof i4.UiTranslatePipe], [typeof i1.ValidationErrorComponent]>;
9
+ static ɵinj: i0.ɵɵInjectorDeclaration<ValidationErrorModule>;
10
+ }
@@ -83,5 +83,13 @@
83
83
  "SPECIAL_CHARACTER": "Contains at least one special character",
84
84
  "CHARACTERS": "Contains at least 12 characters",
85
85
  "PASSWORD_PLACEHOLDER": "Password"
86
+ },
87
+ "ERRORS": {
88
+ "REQUIRED": "This field is required",
89
+ "REQUIRED_FIELD": "This field is required - ({{label}})",
90
+ "MAX_LENGTH": "Please enter a value with a maximum length of ({{maxlength}}) characters",
91
+ "MIN_LENGTH": "Please enter a value with a minimum length of ({{maxlength}}) characters",
92
+ "MAX": "Please enter a value with a maximum value of ({{max}})",
93
+ "MIN": "Please enter a value with a minimum value of ({{min}})"
86
94
  }
87
95
  }