fix typed-changes failing in some AOT configurations (#86)

Author: bengry

libs/fabric/src/lib/components/command-bar/command-bar.component.ts

@@ -100,7 +100,7 @@ export class FabCommandBarComponent extends ReactWrapperComponent<ICommandBarPro
     super(elementRef, changeDetectorRef, renderer, { ngZone, setHostDisplay: true });
   }
 
-  ngOnChanges(changes: TypedChanges<this>) {
+  ngOnChanges(changes: TypedChanges<FabCommandBarComponent>) {
     if (
       changes['items'] &&
       changes['items'].previousValue !== changes['items'].currentValue &&

libs/fabric/src/lib/components/core/shared/changeable-helper.ts

@@ -4,8 +4,7 @@
 import { EventEmitter, QueryList } from '@angular/core';
 import { Subscription } from 'rxjs';
 
-import { TypedChanges } from '../../../declarations/angular/typed-changes';
-import { ItemChangedPayload } from '../../core/declarative/item-changed.payload';
+import { ItemChangedPayload, ItemChanges } from '../../core/declarative/item-changed.payload';
 import { ChangeableItemDirective } from './changeable-item.directive';
 
 /**
@@ -21,7 +20,7 @@ export class ChangeableItemHelper<TItem> {
    * (Typically called in ngOnChanges)
    * @param changes TypedChanges that are to be emitted
    */
-  emitChanges(changes: TypedChanges<TItem>) {
+  emitChanges(changes: ItemChanges<TItem>) {
     this.onItemChanged.emit({ key: this.key, changes });
   }
 }

libs/fabric/src/lib/components/core/shared/changeable-item.directive.ts

@@ -3,8 +3,8 @@
 
 import { EventEmitter, Input, OnInit, Output } from '@angular/core';
 
-import { OnChanges, TypedChanges } from '../../../declarations/angular/typed-changes';
-import { ItemChangedPayload } from '../../core/declarative/item-changed.payload';
+import { OnChanges } from '../../../declarations/angular/typed-changes';
+import { ItemChangedPayload, ItemChanges } from '../../core/declarative/item-changed.payload';
 import { ChangeableItemHelper } from './changeable-helper';
 
 /**
@@ -24,7 +24,7 @@ export abstract class ChangeableItemDirective<TItem> implements OnChanges<Change
     this.changeableItemHelper = new ChangeableItemHelper(this.key);
   }
 
-  ngOnChanges(changes: TypedChanges<TItem>) {
+  ngOnChanges(changes: ItemChanges<TItem>) {
     if (this.changeableItemHelper) {
       this.changeableItemHelper.emitChanges(changes);
     }

libs/fabric/src/lib/components/details-list/details-list.component.ts

@@ -226,7 +226,7 @@ export class FabDetailsListComponent extends ReactWrapperComponent<IDetailsListP
     this.onRenderMissingItem = (index, rowProps) => missingItemRenderer({ index, rowProps });
   }
 
-  ngOnChanges(changes: TypedChanges<this>) {
+  ngOnChanges(changes: TypedChanges<FabDetailsListComponent>) {
     if (
       changes['columns'] &&
       changes['columns'].currentValue &&

libs/fabric/src/lib/declarations/angular/typed-changes.d.ts

@@ -8,9 +8,25 @@ export interface TypedChange<T> extends AngularCore.SimpleChange {
   readonly currentValue: T;
 }
 
-export type TypedChanges<TComponent> = AngularCore.SimpleChanges &
-  { [P in keyof TComponent]: TypedChange<TComponent[P]> };
+/**
+ * Known Angular keys that components often have
+ */
+export type AngularLifeCycleKeys =
+  | keyof AngularCore.AfterContentChecked
+  | keyof AngularCore.AfterContentInit
+  | keyof AngularCore.AfterViewChecked
+  | keyof AngularCore.AfterViewInit
+  | keyof AngularCore.DoCheck
+  | keyof AngularCore.OnChanges
+  | keyof AngularCore.OnDestroy
+  | keyof AngularCore.OnInit;
+
+// Only take string keys from TComponent, since those are the only valid input property types.
+// Exclude any known stuff that can be eliminated as non-Inputs.
+export type InputKeys<TComponent> = Exclude<keyof TComponent & string, AngularLifeCycleKeys>;
+
+export type TypedChanges<TComponent> = Partial<{ [P in InputKeys<TComponent>]: TypedChange<TComponent[P]> }>;
 
 export interface OnChanges<TComponent> extends AngularCore.OnChanges {
-  ngOnChanges(changes: Partial<TypedChanges<TComponent>>): void;
+  ngOnChanges(changes: TypedChanges<TComponent>): void;
 }