UI: Angular 14 migration

ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.ts

@@ -24,7 +24,7 @@ import { DialogComponent } from '@app/shared/components/dialog.component';
 import { EntityType } from '@shared/models/entity-type.models';
 import { TranslateService } from '@ngx-translate/core';
 import { ActionNotificationShow } from '@core/notification/notification.actions';
-import { MatVerticalStepper } from '@angular/material/stepper';
+import { MatStepper } from '@angular/material/stepper';
 import {
   BulkImportRequest,
   BulkImportResult,
@@ -56,7 +56,7 @@ export interface ImportDialogCsvData {
 export class ImportDialogCsvComponent extends DialogComponent<ImportDialogCsvComponent, boolean>
   implements AfterViewInit, OnDestroy {
 
-  @ViewChild('importStepper', {static: true}) importStepper: MatVerticalStepper;
+  @ViewChild('importStepper', {static: true}) importStepper: MatStepper;
 
   @ViewChild('columnsAssignmentComponent', {static: true})
   columnsAssignmentComponent: TableColumnsAssignmentComponent;

ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.ts

@@ -44,7 +44,7 @@ import {
 } from '@shared/models/device.models';
 import { DeviceProfileService } from '@core/http/device-profile.service';
 import { EntityType } from '@shared/models/entity-type.models';
-import { MatHorizontalStepper } from '@angular/material/stepper';
+import { MatStepper } from '@angular/material/stepper';
 import { RuleChainId } from '@shared/models/id/rule-chain-id';
 import { StepperSelectionEvent } from '@angular/cdk/stepper';
 import { deepTrim } from '@core/utils';
@@ -66,7 +66,7 @@ export interface AddDeviceProfileDialogData {
 export class AddDeviceProfileDialogComponent extends
   DialogComponent<AddDeviceProfileDialogComponent, DeviceProfile> implements AfterViewInit {
 
-  @ViewChild('addDeviceProfileStepper', {static: true}) addDeviceProfileStepper: MatHorizontalStepper;
+  @ViewChild('addDeviceProfileStepper', {static: true}) addDeviceProfileStepper: MatStepper;
 
   selectedIndex = 0;
 

ui-ngx/src/app/modules/home/components/profile/alarm/device-profile-alarm.component.ts

@@ -171,7 +171,7 @@ export class DeviceProfileAlarmComponent implements ControlValueAccessor, OnInit
   }
 
   addRelationType(event: MatChipInputEvent): void {
-    const input = event.input;
+    const input = event.chipInput.inputElement;
     let value = event.value;
     if ((value || '').trim()) {
       value = value.trim();

ui-ngx/src/app/modules/home/components/widget/lib/alarm-filter-panel.component.ts

@@ -87,7 +87,7 @@ export class AlarmFilterPanelComponent {
   }
 
   public addAlarmType(event: MatChipInputEvent): void {
-    const input = event.input;
+    const input = event.chipInput.inputElement;
     const value = event.value;
 
     const types: string[] = this.alarmFilterFormGroup.get('alarmTypeList').value;

ui-ngx/src/app/modules/home/components/widget/lib/settings/gauge/analogue-compass-widget-settings.component.ts

@@ -146,7 +146,7 @@ export class AnalogueCompassWidgetSettingsComponent extends WidgetSettingsCompon
   }
 
   addMajorTickName(event: MatChipInputEvent): void {
-    const input = event.input;
+    const input = event.chipInput.inputElement;
     const value = event.value;
 
     const tickNames: string[] = this.analogueCompassWidgetSettingsForm.get('majorTicks').value;

ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts

@@ -717,7 +717,7 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, Cont
   }
 
   public addAlarmType(event: MatChipInputEvent): void {
-    const input = event.input;
+    const input = event.chipInput.inputElement;
     const value = event.value;
 
     const types: string[] = this.dataSettings.get('alarmTypeList').value;

ui-ngx/src/app/modules/home/components/wizard/device-wizard-dialog.component.ts

@@ -33,7 +33,7 @@ import {
   deviceTransportTypeHintMap,
   deviceTransportTypeTranslationMap
 } from '@shared/models/device.models';
-import { MatHorizontalStepper } from '@angular/material/stepper';
+import { MatStepper } from '@angular/material/stepper';
 import { AddEntityDialogData } from '@home/models/entity/entity-component.models';
 import { BaseData, HasId } from '@shared/models/base-data';
 import { EntityType } from '@shared/models/entity-type.models';
@@ -59,7 +59,7 @@ import { deepTrim } from '@core/utils';
 export class DeviceWizardDialogComponent extends
   DialogComponent<DeviceWizardDialogComponent, boolean> implements OnDestroy, ErrorStateMatcher {
 
-  @ViewChild('addDeviceWizardStepper', {static: true}) addDeviceWizardStepper: MatHorizontalStepper;
+  @ViewChild('addDeviceWizardStepper', {static: true}) addDeviceWizardStepper: MatStepper;
 
   selectedIndex = 0;
 
@@ -87,7 +87,7 @@ export class DeviceWizardDialogComponent extends
 
   customerFormGroup: UntypedFormGroup;
 
-  labelPosition: MatHorizontalStepper['labelPosition'] = 'end';
+  labelPosition: MatStepper['labelPosition'] = 'end';
 
   serviceType = ServiceType.TB_RULE_ENGINE;
 

ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts

@@ -415,7 +415,7 @@ export class OAuth2SettingsComponent extends PageComponent implements OnInit, Ha
   }
 
   addScope(event: MatChipInputEvent, control: AbstractControl): void {
-    const input = event.input;
+    const input = event.chipInput.inputElement;
     const value = event.value;
     const controller = control.get('scope') as UntypedFormArray;
     if ((value.trim() !== '')) {