Typescript 2.6.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dojo/widget-core",
-  "version": "0.3.1-pre",
+  "version": "0.4.0-pre",
   "description": "A core widget library for Dojo 2",
   "private": true,
   "homepage": "https://dojo.io",
@@ -27,14 +27,14 @@
     "benchmark": "./run-benchmark.sh"
   },
   "peerDependencies": {
-    "@dojo/core": "~0.2.1",
-    "@dojo/has": "~0.1.0",
-    "@dojo/i18n": "~0.2.0",
-    "@dojo/shim": "~0.2.2"
+    "@dojo/core": "~0.3.0",
+    "@dojo/has": "~0.1.1",
+    "@dojo/shim": "~0.2.3",
+    "@dojo/i18n": "~0.3.0"
   },
   "devDependencies": {
-    "@dojo/interfaces": "~0.1.0",
-    "@dojo/loader": "~0.1.0",
+    "@dojo/interfaces": "~0.2.0",
+    "@dojo/loader": "~0.1.1",
     "@types/chai": "3.4.*",
     "@types/glob": "5.0.*",
     "@types/grunt": "0.4.*",
@@ -60,7 +60,7 @@
     "serve": "^6.4.1",
     "sinon": "^1.17.6",
     "tslint": "^5.2.0",
-    "typescript": "~2.5.2"
+    "typescript": "~2.6.1"
   },
   "dependencies": {
     "intersection-observer": "^0.4.2",

src/Injector.ts

@@ -1,11 +1,16 @@
 import { Evented } from '@dojo/core/Evented';
+import { EventObject } from '@dojo/core/interfaces';
 
-export class Injector<T = any> extends Evented {
+export interface InjectorEventMap {
+	invalidate: EventObject<'invalidate'>;
+}
+
+export class Injector<T = any> extends Evented<InjectorEventMap> {
 
 	private _payload: T;
 
 	constructor(payload: T) {
-		super({});
+		super();
 		this._payload = payload;
 	}
 

src/NodeHandler.ts

@@ -1,4 +1,5 @@
 import { Evented } from '@dojo/core/Evented';
+import { EventObject } from '@dojo/core/interfaces';
 import Map from '@dojo/shim/Map';
 import { NodeHandlerInterface } from './interfaces';
 
@@ -12,19 +13,24 @@ export enum NodeEventType {
 	Widget = 'Widget'
 }
 
-export class NodeHandler extends Evented implements NodeHandlerInterface {
+export interface NodeHandlerEventMap {
+	'Projector': EventObject<NodeEventType.Projector>;
+	'Widget': EventObject<NodeEventType.Widget>;
+}
+
+export class NodeHandler extends Evented<NodeHandlerEventMap> implements NodeHandlerInterface {
 
-	private _nodeMap = new Map<string, HTMLElement>();
+	private _nodeMap = new Map<string, Element>();
 
-	public get(key: string): HTMLElement | undefined {
+	public get(key: string): Element | undefined {
 		return this._nodeMap.get(key);
 	}
 
 	public has(key: string): boolean {
 		return this._nodeMap.has(key);
 	}
 
-	public add(element: HTMLElement, key: string): void {
+	public add(element: Element, key: string): void {
 		this._nodeMap.set(key, element);
 		this.emit({ type: key });
 	}

src/Registry.ts

@@ -1,8 +1,8 @@
 import Promise from '@dojo/shim/Promise';
 import Map from '@dojo/shim/Map';
 import Symbol from '@dojo/shim/Symbol';
-import { Handle } from '@dojo/interfaces/core';
-import { BaseEventedEvents, Evented, EventObject } from '@dojo/core/Evented';
+import { EventObject } from '@dojo/core/interfaces';
+import { Evented } from '@dojo/core/Evented';
 import { Constructor, RegistryLabel, WidgetBaseConstructor, WidgetBaseInterface } from './interfaces';
 import { Injector } from './Injector';
 
@@ -15,19 +15,11 @@ export type RegistryItem = WidgetBaseConstructor | Promise<WidgetBaseConstructor
  */
 export const WIDGET_BASE_TYPE = Symbol('Widget Base');
 
-export interface RegistryEventObject extends EventObject {
+export interface RegistryEventObject extends EventObject<RegistryLabel> {
 	action: string;
 	item: WidgetBaseConstructor | Injector;
 }
 
-export interface RegistryListener {
-	(event: RegistryEventObject): void;
-}
-
-export interface RegistryEvents extends BaseEventedEvents {
-	(type: RegistryLabel, listener: RegistryListener | RegistryListener[]): Handle;
-}
-
 /**
  * Widget Registry Interface
  */
@@ -95,9 +87,7 @@ export function isWidgetBaseConstructor<T extends WidgetBaseInterface>(item: any
 /**
  * The Registry implementation
  */
-export class Registry extends Evented implements RegistryInterface {
-
-	public on: RegistryEvents;
+export class Registry extends Evented<{}, RegistryLabel, RegistryEventObject> implements RegistryInterface {
 
 	/**
 	 * internal map of labels and RegistryItem

src/RegistryHandler.ts

@@ -1,10 +1,15 @@
 import { Map } from '@dojo/shim/Map';
 import { Evented } from '@dojo/core/Evented';
+import { EventObject } from '@dojo/core/interfaces';
 import { Constructor, RegistryLabel, WidgetBaseInterface } from './interfaces';
 import { Registry, RegistryEventObject, RegistryItem } from './Registry';
 import { Injector } from './Injector';
 
-export class RegistryHandler extends Evented {
+export interface RegistryHandlerEventMap {
+	invalidate: EventObject<'invalidate'>;
+}
+
+export class RegistryHandler extends Evented<RegistryHandlerEventMap> {
 	private _registry = new Registry();
 	private _baseRegistry: Registry;
 	private _registryWidgetLabelMap: Map<Registry, RegistryLabel[]> = new Map();

src/WidgetBase.ts

@@ -1,4 +1,3 @@
-import { EventTypedObject } from '@dojo/interfaces/core';
 import Map from '@dojo/shim/Map';
 import WeakMap from '@dojo/shim/WeakMap';
 import { v } from './d';
@@ -39,12 +38,6 @@ interface ReactionFunctionConfig {
 	reaction: DiffPropertyReaction;
 }
 
-export interface WidgetAndElementEvent extends EventTypedObject<'properties:changed'> {
-	key: string;
-	element: HTMLElement;
-	target: WidgetBase;
-}
-
 export type BoundFunctionData = { boundFunc: (...args: any[]) => any, scope: any };
 
 const decoratorMap = new Map<Function, Map<string, any[]>>();
@@ -147,7 +140,6 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> implement
 				bind: this
 			});
 			this._metaMap.set(MetaType, cached);
-			cached;
 		}
 
 		return cached as T;
@@ -159,7 +151,7 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> implement
 	 * @param element The dom node represented by the vdom node.
 	 * @param key The vdom node's key.
 	 */
-	protected onElementCreated(element: Element, key: string): void {
+	protected onElementCreated(element: Element, key: string | number): void {
 		// Do nothing by default.
 	}
 
@@ -169,7 +161,7 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> implement
 	 * @param element The dom node represented by the vdom node.
 	 * @param key The vdom node's key.
 	 */
-	protected onElementUpdated(element: Element, key: string): void {
+	protected onElementUpdated(element: Element, key: string | number): void {
 		// Do nothing by default.
 	}
 
@@ -215,7 +207,7 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> implement
 
 		if (this._initialProperties === false || registeredDiffPropertyNames.length !== 0) {
 			const allProperties = [ ...propertyNames, ...Object.keys(this._properties) ];
-			const checkedProperties: string[] = [];
+			const checkedProperties: (string | number)[] = [];
 			const diffPropertyResults: any = {};
 			let runReactions = false;
 

src/customElements.ts

@@ -298,7 +298,7 @@ export function initializeElement(element: CustomElement) {
 
 	return function() {
 		let children: DNode[] = [];
-		let elementChildren = arrayFrom(element.children);
+		let elementChildren = arrayFrom(element.children) as CustomElement[];
 
 		elementChildren.forEach((childNode: CustomElement, index: number) => {
 			const properties = { key: `child-${index}` };
@@ -309,7 +309,7 @@ export function initializeElement(element: CustomElement) {
 				children.push(w(DomWrapper(childNode), properties));
 			}
 		});
-		elementChildren.forEach((childNode: HTMLElement) => {
+		elementChildren.forEach((childNode: Element) => {
 			element.removeChild(childNode);
 		});
 

src/d.ts

@@ -43,9 +43,10 @@ export function isHNode(child: DNode): child is HNode {
  *
  * If no predicate is supplied then the modifier will be executed on all nodes.
  */
-export function decorate(dNodes: DNode, modifier: (dNode: DNode) => void, predicate?: (dNode: DNode) => boolean): DNode;
-export function decorate(dNodes: DNode[], modifier: (dNode: DNode) => void, predicate?: (dNode: DNode) => boolean): DNode[];
-export function decorate(dNodes: DNode | DNode[], modifier: (dNode: DNode) => void, predicate?: (dNode: DNode) => boolean): DNode | DNode[];
+export function decorate<T extends DNode>(dNodes: DNode, modifier: (dNode: T) => void, predicate: (dNode: DNode) => dNode is T): DNode;
+export function decorate<T extends DNode>(dNodes: DNode[], modifier: (dNode: T) => void, predicate: (dNode: DNode) => dNode is T): DNode[];
+export function decorate(dNodes: DNode, modifier: (dNode: DNode) => void): DNode;
+export function decorate(dNodes: DNode[], modifier: (dNode: DNode) => void): DNode[];
 export function decorate(dNodes: DNode | DNode[], modifier: (dNode: DNode) => void, predicate?: (dNode: DNode) => boolean): DNode | DNode[] {
 	let nodes = Array.isArray(dNodes) ? [ ...dNodes ] : [ dNodes ];
 	while (nodes.length) {

src/interfaces.d.ts

@@ -1,6 +1,6 @@
 import { Destroyable } from '@dojo/core/Destroyable';
 import { Evented } from '@dojo/core/Evented';
-import { EventTargettedObject } from '@dojo/interfaces/core';
+import { EventObject, EventType } from '@dojo/core/interfaces';
 import Map from '@dojo/shim/Map';
 import WeakMap from '@dojo/shim/WeakMap';
 
@@ -12,7 +12,7 @@ export type Constructor<T> = new (...args: any[]) => T;
 /**
  * Typed target event
  */
-export interface TypedTargetEvent<T extends EventTarget> extends Event {
+export interface TypedTargetEvent<T extends EventTarget, Y extends EventType = EventType> extends EventObject<Y> {
 	target: T;
 }
 
@@ -173,7 +173,7 @@ export interface VirtualDomProperties {
 	 * A key is required when there are more children with the same selector and these children are added or removed dynamically.
 	 * NOTE: this does not have to be a string or number, a [[Component]] Object for instance is also possible.
 	 */
-	readonly key?: Object;
+	readonly key?: string | number;
 	/**
 	 * An array of supported class names to be added to classList on a DOM node
 	 */
@@ -453,11 +453,11 @@ export interface WidgetMetaConstructor<T extends WidgetMetaBase> {
 }
 
 export interface NodeHandlerInterface extends Evented {
-	get(key: string | number): HTMLElement | undefined;
+	get(key: string | number): Element | undefined;
 	has(key: string | number): boolean;
-	add(element: HTMLElement, key: string): void;
-	addRoot(element: HTMLElement, key: string): void;
-	addProjector(element: HTMLElement, properties: VirtualDomProperties): void;
+	add(element: Element, key: string): void;
+	addRoot(element: Element, key: string): void;
+	addProjector(element: Element, properties: VirtualDomProperties): void;
 	clear(): void;
 }
 

src/meta/Base.ts

@@ -24,7 +24,7 @@ export class Base extends Destroyable implements WidgetMetaBase {
 		return this.nodeHandler.has(key);
 	}
 
-	protected getNode(key: string | number): HTMLElement | undefined {
+	protected getNode(key: string | number): Element | undefined {
 		const stringKey = `${key}`;
 		const node = this.nodeHandler.get(stringKey);
 

src/meta/Dimensions.ts

@@ -51,7 +51,7 @@ const defaultDimensions = {
 export class Dimensions extends Base {
 
 	public get(key: string | number): Readonly<DimensionResults> {
-		const node = this.getNode(key);
+		const node = this.getNode(key) as HTMLElement;
 
 		if (!node) {
 			return deepAssign({}, defaultDimensions);

src/meta/Drag.ts

@@ -255,7 +255,7 @@ export class Drag extends Base {
 	private _boundInvalidate: () => void = this.invalidate.bind(this);
 
 	public get(key: string | number): Readonly<DragResults> {
-		const node = this.getNode(key);
+		const node = this.getNode(key) as HTMLElement;
 
 		// if we don't have a reference to the node yet, return an empty set of results
 		if (!node) {

src/meta/Intersection.ts

@@ -43,7 +43,7 @@ export class Intersection extends Base {
 	public get(key: string | number, options: IntersectionGetOptions = {}): IntersectionResult {
 		let rootNode: HTMLElement | undefined;
 		if (options.root) {
-			rootNode = this.getNode(options.root);
+			rootNode = this.getNode(options.root) as HTMLElement;
 			if (!rootNode) {
 				return defaultIntersection;
 			}

src/meta/WebAnimation.ts

@@ -84,7 +84,7 @@ export class WebAnimations extends Base {
 	}
 
 	animate(key: string, animateProperties: AnimationProperties | AnimationProperties[]) {
-		const node = this.getNode(key);
+		const node = this.getNode(key) as HTMLElement;
 
 		if (node) {
 			if (!Array.isArray(animateProperties)) {

src/mixins/Projector.ts

@@ -1,7 +1,7 @@
 import { assign } from '@dojo/core/lang';
 import global from '@dojo/shim/global';
 import { createHandle } from '@dojo/core/lang';
-import { Handle } from '@dojo/interfaces/core';
+import { Handle } from '@dojo/core/interfaces';
 import 'pepjs';
 import cssTransitions from '../animations/cssTransitions';
 import { Constructor, DNode, Projection, ProjectionOptions } from './../interfaces';
@@ -156,8 +156,6 @@ export function ProjectorMixin<P, T extends Constructor<WidgetBase<P>>>(Base: T)
 		private _boundRender: Function;
 		private _projectorChildren: DNode[] = [];
 		private _projectorProperties: this['properties'] = {} as this['properties'];
-		private _rootTagName: string;
-		private _attachType: AttachType;
 		private _handles: Function[] = [];
 
 		constructor(...args: any[]) {
@@ -340,7 +338,6 @@ export function ProjectorMixin<P, T extends Constructor<WidgetBase<P>>>(Base: T)
 		}
 
 		private _attach({ type, root }: AttachOptions): Handle {
-			this._attachType = type;
 			if (root) {
 				this.root = root;
 			}
@@ -369,7 +366,6 @@ export function ProjectorMixin<P, T extends Constructor<WidgetBase<P>>>(Base: T)
 					this._projection = dom.append(this.root, this._boundRender(), this, this._projectionOptions);
 				break;
 				case AttachType.Merge:
-					this._rootTagName = this._root.tagName.toLowerCase();
 					this._projection = dom.merge(this.root, this._boundRender(), this , this._projectionOptions);
 				break;
 				case AttachType.Replace:

src/util/DomWrapper.ts

@@ -20,7 +20,7 @@ export function DomWrapper(domNode: Element, options: DomWrapperOptions = {}): D
 			return hNode;
 		}
 
-		protected onElementCreated(element: Element, key: string) {
+		protected onElementCreated(element: Element, key: string | number) {
 			options.onAttached && options.onAttached();
 		}