(refactor) by eslint rules

.eslintrc.json

@@ -95,7 +95,8 @@
           "error",
           4,
           {
-            "SwitchCase": 1
+            "SwitchCase": 1,
+            "MemberExpression": 1
           }
         ],
         "max-lines-per-function": [
@@ -247,35 +248,30 @@
               "public-static-field",
               "protected-static-field",
               "private-static-field",
-              "public-decorated-field",
-              "protected-decorated-field",
-              "private-decorated-field",
               "public-instance-field",
               "protected-instance-field",
               "private-instance-field",
               "public-abstract-field",
               "protected-abstract-field",
-              "private-abstract-field",
               "public-constructor",
               "protected-constructor",
-              "private-constructor",
               "public-static-method",
               "protected-static-method",
               "private-static-method",
               "public-instance-method",
               "protected-instance-method",
               "private-instance-method",
               "public-abstract-method",
-              "protected-abstract-method",
-              "private-abstract-method"
+              "protected-abstract-method"
             ]
           }
         ],
         "@typescript-eslint/explicit-module-boundary-types": "off",
         "@typescript-eslint/no-namespace": "off",
         "@typescript-eslint/no-inferrable-types": "off",
         "@typescript-eslint/no-explicit-any": "off",
-        "@angular-eslint/no-host-metadata-property": "off"
+        "@angular-eslint/no-host-metadata-property": "off",
+        "@angular-eslint/no-input-rename": "off"
       }
     },
     {

src/app/library/core/classes/base-components/option.ts

@@ -31,11 +31,11 @@ export abstract class ɵOsBaseOptionComponent<T>
     @HostBinding(`class.${ɵCommonCssClassEnum.Disabled}`)
     public isDisabled: boolean = false;
 
-    /** Fires when the option item selected */
-    @Output()
-    public readonly abstract osSelected: EventEmitter<unknown>;
-
     protected readonly _dataUpdated$ = new Subject<T>();
 
     private _data: T;
+
+    /** Fires when the option item selected */
+    @Output()
+    public readonly abstract osSelected: EventEmitter<unknown>;
 }

src/app/library/modules/email-box/components/email-box/email-box.component.ts

@@ -33,9 +33,9 @@ export class EmailBoxComponent extends ɵOsBaseFieldComponent implements OnInit
     /** Fires when the email-box value change */
     @Output()
     public osChange: Observable<EmailBoxChangeEvent> = this.createEvent('change')
-        .pipe(
-            map((event) => this.transformChangeEvent(event))
-        );
+            .pipe(
+                map((event) => this.transformChangeEvent(event))
+            );
 
     /** @internal */
     public get _inputAutocompleteAttrValue(): string {

src/app/library/modules/number-box/components/number-box/number-box.component.ts

@@ -58,9 +58,9 @@ export class NumberBoxComponent
     /** Fires when the number-box value change */
     @Output()
     public osChange: Observable<NumberBoxChangeEvent> = this.createEvent('change')
-        .pipe(
-            map((event) => this.transformChangeEvent(event))
-        );
+            .pipe(
+                map((event) => this.transformChangeEvent(event))
+            );
 
     /** @internal */
     public get _inputAutocompleteAttrValue(): string {

src/app/library/modules/password-box/components/password-box/password-box.component.ts

@@ -28,9 +28,9 @@ export class PasswordBoxComponent extends ɵOsBaseFieldComponent implements OnIn
     /** Fires when the password-box value change */
     @Output()
     public osChange: Observable<PasswordBoxChangeEvent> = this.createEvent('change')
-        .pipe(
-            map((event) => this.transformChangeEvent(event))
-        );
+            .pipe(
+                map((event) => this.transformChangeEvent(event))
+            );
 
     /** @internal */
     public get _inputAutocompleteAttrValue(): string {

src/app/library/modules/resizer/classes/resizer.factory.ts

@@ -24,6 +24,7 @@ export class ɵResizerFactory {
         return new ResizerType(context, this.injector);
     }
 
+    // eslint-disable-next-line max-lines-per-function
     private getResizerClassById(id: ResizerEnum): typeof ɵTopResizer {
         switch (id) {
             case ResizerEnum.TopLeft:

src/app/library/modules/resizer/directives/resizable.directive.ts

@@ -188,7 +188,7 @@ export class ResizableDirective implements OnChanges, AfterViewInit, OnDestroy {
         this._resizableElement.classList.add(CssClass.Resizing);
         this.document.addEventListener('mousemove', this.onPointerMove);
         this.document.addEventListener('mouseup', this.onPointerUp);
-    }
+    };
 
     private readonly onPointerMove = (event: PointerEvent | TouchEvent): void => {
         const resizeInfo = this.getResizeInfo(event);

src/app/library/modules/text-box/components/text-box/text-box.component.ts

@@ -28,9 +28,9 @@ export class TextBoxComponent extends ɵOsBaseFieldComponent implements OnInit {
     /** Fires when the text-box value change */
     @Output()
     public osChange: Observable<TextBoxChangeEvent> = this.createEvent('change')
-        .pipe(
-            map((event) => this.transformChangeEvent(event))
-        );
+            .pipe(
+                map((event) => this.transformChangeEvent(event))
+            );
 
     /** @internal */
     public get _inputAutocompleteAttrValue(): string {

src/app/library/modules/textarea-box/components/textarea-box/textarea-box.component.ts

@@ -35,9 +35,9 @@ export class TextareaBoxComponent
     /** Fires when the textarea-box value change */
     @Output()
     public osChange: Observable<TextareaBoxChangeEvent> = this.createEvent('change')
-        .pipe(
-            map((event) => this.transformChangeEvent(event))
-        );
+            .pipe(
+                map((event) => this.transformChangeEvent(event))
+            );
 
     protected override targetInternalElementSelector = 'textarea';
 

src/app/library/test.ts

@@ -19,8 +19,8 @@ declare const require: {
 getTestBed().initTestEnvironment(
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting(), {
-    teardown: { destroyAfterEach: false }
-}
+        teardown: { destroyAfterEach: false }
+    }
 );
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);

src/app/showcase/features/documentation/examples/drag-and-drop/dragger-on-absolute-element/dragger-on-absolute-element.component.ts

@@ -15,9 +15,6 @@ import { DraggerConfig, DragStrategyByAxisProperties } from 'ngx-os';
     changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class DraggerOnAbsoluteElementComponent implements AfterViewInit {
-    @ViewChild('containerHideButton', { read: ElementRef })
-    private readonly containerHideButton: ElementRef<HTMLElement>;
-
     public draggerConfig: DraggerConfig;
 
     public isContainerVisible = false;
@@ -34,6 +31,9 @@ export class DraggerOnAbsoluteElementComponent implements AfterViewInit {
         };
     }
 
+    @ViewChild('containerHideButton', { read: ElementRef })
+    private readonly containerHideButton: ElementRef<HTMLElement>;
+
     constructor(
         private readonly changeDetector: ChangeDetectorRef
     ) {}

src/app/showcase/features/documentation/examples/drag-and-drop/dragger-via-handle/dragger-via-handle.component.ts

@@ -15,14 +15,14 @@ import { DraggerConfig } from 'ngx-os';
     changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class DraggerViaHandleComponent implements AfterViewInit {
+    public draggerConfig: DraggerConfig;
+
     @ViewChild('container')
     private readonly containerElement: ElementRef<HTMLDivElement>;
 
     @ViewChild('handle')
     private readonly handleElement: ElementRef<HTMLDivElement>;
 
-    public draggerConfig: DraggerConfig;
-
     constructor(
         private readonly changeDetector: ChangeDetectorRef
     ) {}

src/app/showcase/features/documentation/examples/number-box/number-box-as-form-control/number-box-as-form-control.component.ts

@@ -9,7 +9,10 @@ import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 })
 export class NumberBoxAsFormControlComponent {
     public readonly numberBoxControl = new UntypedFormControl();
-    public readonly numberBoxDisabledControl = new UntypedFormControl({ value: '', disabled: true });
+    public readonly numberBoxDisabledControl = new UntypedFormControl({
+        value: '',
+        disabled: true
+    });
 
     public readonly formGroup = new UntypedFormGroup({
         numberBoxValue: this.numberBoxControl

src/app/showcase/features/documentation/examples/password-box/password-box-as-form-control/password-box-as-form-control.component.ts

@@ -9,7 +9,10 @@ import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 })
 export class PasswordBoxAsFormControlComponent {
     public readonly passwordBoxControl = new UntypedFormControl();
-    public readonly passwordBoxDisabledControl = new UntypedFormControl({ value: '', disabled: true });
+    public readonly passwordBoxDisabledControl = new UntypedFormControl({
+        value: '',
+        disabled: true
+    });
 
     public readonly formGroup = new UntypedFormGroup({
         passwordBoxValue: this.passwordBoxControl

src/app/showcase/features/documentation/examples/radio-button/radio-button-as-form-control/radio-button-as-form-control.component.ts

@@ -19,7 +19,10 @@ export class RadioButtonAsFormControlComponent {
     ];
 
     public readonly selectedValueControl = new UntypedFormControl(this.items[1]);
-    public readonly radioButtonDisabledControl = new UntypedFormControl({ value: true, disabled: true });
+    public readonly radioButtonDisabledControl = new UntypedFormControl({
+        value: true,
+        disabled: true
+    });
 
     public readonly formGroup = new UntypedFormGroup({
         selectedValue: this.selectedValueControl

src/app/showcase/features/documentation/examples/resizer/resizer-on-absolute-element/resizer-on-absolute-element.component.ts

@@ -1,5 +1,6 @@
 import {
-    ChangeDetectionStrategy, Component,
+    ChangeDetectionStrategy,
+    Component,
     ElementRef,
     ViewChild
 } from '@angular/core';
@@ -11,9 +12,6 @@ import {
     changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class ResizerOnAbsoluteElementComponent {
-    @ViewChild('containerHideButton', { read: ElementRef })
-    private readonly containerHideButton: ElementRef<HTMLElement>;
-
     public isContainerVisible = false;
 
     public get labelOfToggleVisibilityButton(): string {
@@ -28,6 +26,9 @@ export class ResizerOnAbsoluteElementComponent {
         };
     }
 
+    @ViewChild('containerHideButton', { read: ElementRef })
+    public readonly containerHideButton: ElementRef<HTMLElement>;
+
     public onToggleContainerVisibilityButtonClick(): void {
         this.isContainerVisible = !this.isContainerVisible;
     }

src/app/showcase/features/documentation/examples/textarea-box/textarea-as-form-control/textarea-as-form-control.component.ts

@@ -9,7 +9,10 @@ import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 })
 export class TextareaAsFormControlComponent {
     public readonly textareaBoxControl = new UntypedFormControl('Hi there!');
-    public readonly textareaBoxDisabledControl = new UntypedFormControl({ value: '', disabled: true });
+    public readonly textareaBoxDisabledControl = new UntypedFormControl({
+        value: '',
+        disabled: true
+    });
 
     public readonly formGroup = new UntypedFormGroup({
         textareaBoxValue: this.textareaBoxControl

src/app/showcase/pages/components/overview/components/side-bar-list/side-bar-list.component.ts

@@ -25,12 +25,12 @@ import { SideBarItemsService } from './side-bar-items.service';
     ]
 })
 export class SideBarListComponent implements OnInit, AfterViewInit {
-    @ViewChild(TreeViewComponent)
-    private readonly treeView: TreeViewComponent<SideBarItem>;
-
     public metaInfo$: Observable<ComponentMetaInfo>;
     public nodes$: Observable<TreeNode<SideBarItem>[]>;
 
+    @ViewChild(TreeViewComponent)
+    private readonly treeView: TreeViewComponent<SideBarItem>;
+
     constructor(
         private readonly componentsSearchService: LibraryComponentsSearchService,
         private readonly overviewService: OverviewService,

src/app/showcase/pages/components/overview/containers/examples/example/example.component.ts

@@ -3,7 +3,8 @@ import {
     ChangeDetectionStrategy,
     ChangeDetectorRef,
     Component,
-    ComponentFactoryResolver, Input, ViewChild,
+    Input,
+    ViewChild,
     ViewContainerRef
 } from '@angular/core';
 import { AppRouteEnum } from '@core/enums';
@@ -39,9 +40,6 @@ export class ExampleComponent implements AfterViewInit {
         return this._demoComponentMetaInfo;
     }
 
-    @ViewChild('exampleTemplate', { read: ViewContainerRef })
-    private readonly exampleContainer: ViewContainerRef;
-
     public get isScssExist(): boolean {
         return !!this.docComponent?.styleUrlsData?.[0]?.data;
     }
@@ -58,22 +56,21 @@ export class ExampleComponent implements AfterViewInit {
     public openedSection = SectionEnum.Demo;
     public docComponent: DocComponent;
 
+    @ViewChild('exampleTemplate', { read: ViewContainerRef })
+    private readonly exampleContainer: ViewContainerRef;
+
     private _demoComponentMetaInfo: DemoComponentMetaInfo;
 
     constructor(
         private readonly overviewService: OverviewService,
         private readonly docService: ExamplesDocumentationService,
-        private readonly componentFactoryResolver: ComponentFactoryResolver,
         private readonly dynamicWindowService: DynamicWindowService,
         private readonly changeDetector: ChangeDetectorRef
     ) {}
 
     public ngAfterViewInit(): void {
-        const componentFactory = this.componentFactoryResolver
-            .resolveComponentFactory(this._demoComponentMetaInfo.component);
-
         this.exampleContainer.clear();
-        this.exampleContainer.createComponent(componentFactory);
+        this.exampleContainer.createComponent(this._demoComponentMetaInfo.component);
         this.changeDetector.detectChanges();
     }
 

src/app/showcase/pages/desktop/apps/notepad/services/editor-history.service.ts

@@ -35,7 +35,7 @@ export class EditorHistoryService {
     }
 
     public undo(): void {
-        const lastItemIndex = (this.pastHistory.data!.length - 1);
+        const lastItemIndex = (this.pastHistory.data.length - 1);
         const removedItem = this.pastHistory.removeItemByIndex(lastItemIndex);
 
         this.futureHistory.pushItem(removedItem);
@@ -46,7 +46,7 @@ export class EditorHistoryService {
     }
 
     public redo(): void {
-        const lastItemIndex = (this.futureHistory.data!.length - 1);
+        const lastItemIndex = (this.futureHistory.data.length - 1);
         const removedItem = this.futureHistory.removeItemByIndex(lastItemIndex);
 
         this.pastHistory.pushItem(removedItem);

src/app/showcase/pages/desktop/apps/settings/containers/background/components/image-selection/image-selection.component.ts

@@ -24,11 +24,11 @@ export class ImageSelectionComponent {
     @Input()
     public currentBackground: BackgroundMetadata;
 
+    public readonly defaultBackgroundUrls = BACKGROUND_URLS;
+
     @ViewChild('fileUploader')
     private readonly fileUploaderRef: ElementRef<HTMLInputElement>;
 
-    public readonly defaultBackgroundUrls = BACKGROUND_URLS;
-
     public get isCurrentBackgroundImage(): boolean {
         return (this.currentBackground.type === BackgroundTypeEnum.Image);
     }

src/app/showcase/pages/example/example.component.ts

@@ -25,12 +25,12 @@ import { RouteParam } from './route-param.enum';
     changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class ExampleComponent implements OnInit, AfterViewInit {
-    @ViewChild('exampleContainer', { read: ViewContainerRef })
-    private readonly exampleContainer: ViewContainerRef;
-
     public componentType: OsComponentEnum;
     public demoMetaInfo: DemoComponentMetaInfo;
 
+    @ViewChild('exampleContainer', { read: ViewContainerRef })
+    private readonly exampleContainer: ViewContainerRef;
+
     private exampleComponentName: string;
 
     constructor(

src/test.ts

@@ -18,8 +18,8 @@ declare const require: {
 getTestBed().initTestEnvironment(
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting(), {
-    teardown: { destroyAfterEach: false }
-}
+        teardown: { destroyAfterEach: false }
+    }
 );
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);