feature/ts-strict/qgrid-ngx

packages/qgrid-core/src/format/format.service.d.ts

@@ -1,5 +1,5 @@
 export declare class FormatService {
-  static number(x: number, format: string): string;
-  static date(x: Date, format: string): string;
-  static currency(x: number, format: string): string;
+  static number(x: number, format: string): string | null;
+  static date(x: Date, format: string): string | null;
+  static currency(x: number, format: string): string | null;
 }

packages/qgrid-core/src/plugin/grid.plugin.d.ts

@@ -1,16 +1,16 @@
-import { Model } from '../model/model';
 import { Table } from '../dom/table';
-import { GridLet } from '../grid/grid.let';
-import { ObservableLike } from '../rx/rx';
 import { Event } from '../event/event';
+import { GridLet } from '../grid/grid.let';
 import { GridService } from '../grid/grid.service';
+import { Model } from '../model/model';
+import { ObservableEvent, ObservableReplyEvent } from '../rx/rx';
 
 export interface GridPlugin {
     readonly model: Model;
     readonly table: Table;
     readonly view: GridLet;
     readonly service: GridService;
 
-    observe<TState>(event: Event<TState>): ObservableLike<TState>;
-    observeReply<TState>(event: Event<TState>): ObservableLike<TState>;
+    observe<TState>(event: Event<TState>): ObservableEvent<TState>;
+    observeReply<TState>(event: Event<TState>): ObservableReplyEvent<TState>;
 }

packages/qgrid-core/src/scene/render/render.d.ts

@@ -5,7 +5,7 @@ import { RenderStrategy } from './render.strategy';
 
 export declare class Renderer {
   defaultStrategy: RenderStrategy;
-  readonly rows: { left: any[]; right: any[]; mid: any[] };
+  readonly rows: Record<string, any>;
 
   constructor(plugin: GridPlugin);
 

packages/qgrid-ngx/src/lib/body/body-core.component.ts

@@ -65,12 +65,12 @@ export class BodyCoreComponent implements OnInit {
           scrollSettings,
         ));
 
-      disposable.add(listener.on('wheel', e => host.wheel(e)));
-      disposable.add(listener.on('mouseleave', e => host.mouseLeave(e)));
+      disposable.add(listener.on('wheel', (e: WheelEvent) => host.wheel(e)));
+      disposable.add(listener.on('mouseleave', (e: WheelEvent) => host.mouseLeave(e)));
     });
 
     observeReply(model.sceneChanged)
-      .subscribe(e => {
+      .subscribe((e: any) => {
         if (model.grid().interactionMode === 'detached') {
           if (e.hasChanges('status')) {
             switch (e.state.status) {
@@ -86,22 +86,22 @@ export class BodyCoreComponent implements OnInit {
       });
 
     observe(model.sceneChanged)
-      .subscribe(e => {
+      .subscribe((e: any) => {
         if (e.hasChanges('status') && e.state.status === 'push') {
           this.cd.markForCheck();
         }
       });
   }
 
-  columnId(index: number, item: ColumnView) {
+  columnId(index: number, item: ColumnView): string | undefined {
     return item.model.key;
   }
 
-  rowId(index: number) {
+  rowId(index: number): number {
     return index;
   }
 
-  mapToDataIndex(viewIndex: number) {
+  mapToDataIndex(viewIndex: number): number {
     return this.$view.scroll.y.container.position + viewIndex;
   }
 }

packages/qgrid-ngx/src/lib/body/body.module.ts

@@ -17,9 +17,7 @@ import { RowModule } from '../row/row.module';
     VscrollModule,
     RowModule,
   ],
-  exports: [
-    BodyCoreComponent,
-  ],
+  exports: [BodyCoreComponent],
 })
 export class BodyModule {
 }

packages/qgrid-ngx/src/lib/body/td-core.directive.ts

@@ -28,8 +28,8 @@ import { TrCoreDirective } from '../row/tr-core.directive';
   selector: '[q-grid-core-td]',
 })
 export class TdCoreDirective implements DomTd, OnInit, OnDestroy, OnChanges {
-  @Input('q-grid-core-value') actualValue: any;
-  @Input('q-grid-core-label') actualLabel: any;
+  @Input('q-grid-core-value') actualValue: unknown;
+  @Input('q-grid-core-label') actualLabel: unknown;
 
   @Input('q-grid-core-td') columnView: ColumnView;
 

packages/qgrid-ngx/src/lib/cell-handler/cell-handler.component.ts

@@ -57,7 +57,6 @@ export class CellHandlerComponent implements OnInit, AfterViewInit {
         if (e.hasChanges('status')) {
           if (e.state.status === 'endBatch' && this.endBatchEdit) {
             this.endBatchEdit();
-            this.endBatchEdit = null;
           }
         }
       });

packages/qgrid-ngx/src/lib/cell/cell-template.service.ts

@@ -2,18 +2,18 @@ import { Injectable, ViewContainerRef } from '@angular/core';
 import { ColumnModel, GridError, noop } from '@qgrid/core';
 import { TemplateService } from '../template/template.service';
 
-function canBuild(column) {
+function canBuild(column: ColumnModel) {
   return column.type !== 'pad';
 }
 
 function buildId(source: string, column: ColumnModel, mode = 'view') {
-  const { key, type, itemType } = column as any;
+  const { key, type, itemType } = column;
   return `${source}-${mode}-cell-${type}-of-${itemType}-the-${key}.tpl.html`;
 }
 
 function buildKeys(source: string, column: ColumnModel, mode = 'view') {
-  const { key, itemType } = column as any;
-  let { type } = column as any;
+  const { key, itemType } = column;
+  let { type } = column;
 
   switch (mode) {
     case 'view': {

packages/qgrid-ngx/src/lib/column-list/column-list.service.ts

@@ -11,7 +11,7 @@ import { GridPlugin } from '../plugin/grid-plugin';
 @Injectable()
 export class ColumnListService {
   private host = new Lazy(() => {
-    const canCopy = (key: string, source, target) =>
+    const canCopy = (key: string, source: any, target: any) =>
       Object.prototype.hasOwnProperty.call(target, key) && !isUndefined(source[key]);
 
     return new ColumnListHost(this.plugin.model, canCopy, parseFactory);
@@ -20,27 +20,27 @@ export class ColumnListService {
   constructor(private plugin: GridPlugin) {
   }
 
-  add(column: ColumnModel) {
+  add(column: ColumnModel): void {
     this.host.instance.add(column);
   }
 
-  copy(target, source) {
+  copy(target: any, source: any): void {
     this.host.instance.copy(target, source);
   }
 
-  generateKey(source) {
+  generateKey(source: any): string {
     return this.host.instance.generateKey(source);
   }
 
-  extract(key, type): ColumnModel {
+  extract(key: string, type: string): ColumnModel {
     return this.host.instance.extract(key, type);
   }
 
-  register(column: ColumnModel) {
+  register(column: ColumnModel): void {
     this.host.instance.register(column);
   }
 
-  delete(key: string) {
+  delete(key: string): void {
     this.host.instance.delete(key);
   }
 }

packages/qgrid-ngx/src/lib/column/column.component.ts

@@ -109,7 +109,7 @@ export class ColumnComponent implements OnInit, OnDestroy, OnChanges {
     // We want to update model when ngOntInit is triggered and not in afterViewInit
     // so we apply dirty hack to understand if column is cohort or not.
     const element = this.elementRef.nativeElement as HTMLElement;
-    if (element.children.length && element.children.item(0).tagName === 'Q-GRID-COLUMN') {
+    if (element.children.length && element.children.item(0)?.tagName === 'Q-GRID-COLUMN') {
       this.type = 'cohort';
       if (!withKey) {
         this.key = `$cohort-${this.title || guid()}`;
@@ -142,7 +142,9 @@ export class ColumnComponent implements OnInit, OnDestroy, OnChanges {
 
     if (withKey) {
       if (this.parentHost) {
-        this.parentHost.column.children.push(column);
+        if (this.parentHost.column.children) {
+          this.parentHost.column.children.push(column);
+        }
       } else {
         this.columnList.add(column);
       }
@@ -152,9 +154,9 @@ export class ColumnComponent implements OnInit, OnDestroy, OnChanges {
       const settings =
         Object
           .keys(this)
-          .filter(key => !isUndefined(this[key]) && Object.prototype.hasOwnProperty.call(column, key))
-          .reduce((memo, key) => {
-            memo[key] = column[key];
+          .filter(key => !isUndefined(this.key) && Object.prototype.hasOwnProperty.call(column, key))
+          .reduce((memo: any, key: string) => {
+            memo[key] = column[key as keyof ColumnModel];
             return memo;
           }, {}) as ColumnModel;
 
@@ -180,8 +182,12 @@ export class ColumnComponent implements OnInit, OnDestroy, OnChanges {
 
   ngOnDestroy() {
     const { column } = this.selfHost;
-    if (column && column.source === 'template') {
-      this.columnList.delete(column.key);
+    if (!(column && column.source === 'template')) {
+      return;
     }
+    if(!column.key) {
+      return;
+    }
+    this.columnList.delete(column.key);
   }
 }

packages/qgrid-ngx/src/lib/dnd/drag.directive.ts

@@ -38,7 +38,9 @@ export class DragDirective {
 
     if (this.drag.canExecute(eventArg) === false) {
       e.preventDefault();
-      transfer.effectAllowed = 'none';
+      if (transfer) {
+        transfer.effectAllowed = 'none';
+      }
       return false;
     }
 
@@ -50,8 +52,10 @@ export class DragDirective {
 
     this.elementRef.nativeElement.classList.add(`${GRID_PREFIX}-drag`);
 
-    transfer.setData(DragService.mimeType, DragService.encode(data));
-    transfer.effectAllowed = this.effect || 'move';
+    if(transfer) {
+      transfer.setData(DragService.mimeType, DragService.encode(data));
+      transfer.effectAllowed = this.effect || 'move';
+    }
 
     DragService.data = data;
     DragService.area = this.area;
@@ -78,8 +82,5 @@ export class DragDirective {
     this.elementRef.nativeElement.classList.remove(`${GRID_PREFIX}-drag`);
 
     DragService.data = null;
-    DragService.area = null;
-    DragService.element = null;
-    DragService.startPosition = null;
   }
 }

packages/qgrid-ngx/src/lib/dnd/drop.directive.ts

@@ -105,7 +105,9 @@ export class DropDirective implements OnInit {
     e.preventDefault();
 
     this.elementRef.nativeElement.classList.add(`${GRID_PREFIX}-dragover`);
-    e.dataTransfer.dropEffect = 'move';
+    if (e.dataTransfer) {
+      e.dataTransfer.dropEffect = 'move';
+    }
     return false;
   }
 
@@ -117,7 +119,9 @@ export class DropDirective implements OnInit {
     }
 
     if (this.area !== DragService.area) {
-      e.dataTransfer.dropEffect = 'none';
+      if (e.dataTransfer) {
+        e.dataTransfer.dropEffect = 'none';
+      }
       return false;
     }
 
@@ -142,7 +146,9 @@ export class DropDirective implements OnInit {
         DragService.data = eventArg.dragData;
       }
 
-      e.dataTransfer.dropEffect = 'move';
+      if(e.dataTransfer) {
+        e.dataTransfer.dropEffect = 'move';
+      }
     }
 
     return false;

packages/qgrid-ngx/src/lib/foot/tf-core.directive.ts

@@ -21,15 +21,15 @@ export class TfCoreDirective implements DomTd, OnInit, OnDestroy {
   @Input('q-grid-core-tf') columnView: ColumnView;
 
   $implicit = this;
-  element: HTMLElement = null;
+  element: HTMLElement;
 
   get value() {
     const column = this.column;
     return this.$view.foot.value(column);
   }
 
   get label() {
-    return this.label;
+    return this.value;
   }
 
   get column(): ColumnModel {

packages/qgrid-ngx/src/lib/grid/grid.component.ts

@@ -154,7 +154,7 @@ export class GridComponent implements OnInit, OnChanges {
     private cd: ChangeDetectorRef,
     private stateAccessor: StateAccessor,
     private modelBuilder: GridModelBuilder,
-    @Inject(DOCUMENT) private document: any,
+    @Inject(DOCUMENT) private document: Document,
     theme: ThemeService,
   ) {
     if (!theme.component) {

packages/qgrid-ngx/src/lib/grid/grid.module.ts

@@ -22,7 +22,6 @@ import { GridComponent } from './grid.component';
   ],
   imports: [
     CommonModule,
-
     BoxModule,
     LayerModule,
     MarkupModule,
@@ -47,7 +46,7 @@ export class GridModule {
     numberPipe: DecimalPipe,
     currencyPipe: CurrencyPipe,
   ) {
-    FormatService.date = (x, format) => datePipe.transform(x, format);
+    FormatService.date = (x: Date, format: string) => datePipe.transform(x, format);
     FormatService.number = (x, format) => numberPipe.transform(x, format);
     FormatService.currency = (x, format) => currencyPipe.transform(x, format);
 

packages/qgrid-ngx/src/lib/head/th-core.directive.ts

@@ -23,7 +23,7 @@ export class ThCoreDirective implements DomTd, OnInit, OnDestroy {
   $implicit = this;
   element: HTMLElement;
   value: any;
-  label: any;
+  label: string;
 
   get column(): ColumnModel {
     return this.columnView.model;

packages/qgrid-ngx/src/lib/layer/layer.service.ts

@@ -18,7 +18,7 @@ export class LayerService {
     this.container = container;
   }
 
-  create(name) {
+  create(name: string) {
     if (this.layers.has(name)) {
       return this.layers.get(name);
     }

packages/qgrid-ngx/src/lib/plugin/grid-plugin.ts

@@ -4,18 +4,18 @@ import {
   GridLet,
   Lazy,
   ObservableEvent,
-  ObservableLike,
   ObservableReplyEvent,
 } from '@qgrid/core';
 import { DomTable } from '../dom/dom';
 import { Grid, GridService } from '../grid/grid';
 import { GridLet as NgxGridLet } from '../grid/grid-let';
 import { GridModel } from '../grid/grid-model';
 import { GridRoot } from '../grid/grid-root';
+import { GridPlugin as GridPluginInterface } from '@qgrid/core';
 import { Disposable } from '../infrastructure/disposable';
 
 @Injectable()
-export class GridPlugin implements OnDestroy {
+export class GridPlugin implements OnDestroy, GridPluginInterface {
   private serviceLazy = new Lazy(() => this.qgrid.service(this.$root.model));
 
   readonly disposable = new Disposable();
@@ -45,9 +45,9 @@ export class GridPlugin implements OnDestroy {
   ) {
   }
 
-  readonly observe = <TState>(event: Event<TState>): ObservableLike<TState> => new ObservableEvent(event, this.disposable);
+  readonly observe = <TState>(event: Event<TState>): ObservableEvent<TState> => new ObservableEvent(event, this.disposable);
 
-  readonly observeReply = <TState>(event: Event<TState>): ObservableLike<TState> => new ObservableReplyEvent(event, this.disposable);
+  readonly observeReply = <TState>(event: Event<TState>): ObservableReplyEvent<TState> => new ObservableReplyEvent(event, this.disposable);
 
   ngOnDestroy() {
     this.disposable.finalize();