Adding stricter Typescript types to form components

src/app/dynaform/components/_abstract/custom-input.component.ts

@@ -5,13 +5,13 @@ export abstract class CustomInputComponent extends NativeInputComponent implemen
 
 	propagateChange = (_: any) => {};
 
-	public writeValue(value: any): void {};
+	writeValue(value: any): void {};
 
-	public registerOnChange(fn: any): void {
+	registerOnChange(fn: any): void {
 		this.propagateChange = fn;
 	}
 
-	public registerOnTouched(fn: any): void {
+	registerOnTouched(fn: any): void {
 		// this.propagateChange = fn;
 	}
 

src/app/dynaform/components/_abstract/native-input.component.ts

@@ -19,7 +19,7 @@ export abstract class NativeInputComponent implements OnInit {
 		this.exposeMetaInTemplate.map(p => this[p] = this.meta[p] !== undefined ? this.meta[p] : this[p]);
 	}
 
-	handle(fnId: string, val: any) {
+	handle(fnId: string, val: any): void {
 		this.call.emit(fnId);
 	}
 

src/app/dynaform/components/custom/checkbutton/checkbutton.component.ts

@@ -34,9 +34,9 @@ export class CheckbuttonComponent extends CustomInputComponent implements OnChan
 		this.disabled = this.meta.disabled;
 	}
 
-	toggleChecked(e?): void {
+	toggleChecked(e?: MouseEvent): void {
 		if (e) {
-			e.target.blur();
+			(e.target as HTMLElement).blur();
 			e.preventDefault();
 		}
 		if (this.disabled) { return; }

src/app/dynaform/components/custom/multiline/multiline.component.ts

@@ -20,7 +20,7 @@ export class MultilineComponent extends CustomInputComponent {
 	
 	linesArr: string[];
 	value: string;
-	maxLineLength;
+	maxLineLength: number;
 
 	writeValue(value: any): void {
 		this.value = value;

src/app/dynaform/components/group/checkbutton-group/checkbutton-group.component.ts

@@ -47,13 +47,13 @@ export class CheckbuttonGroupComponent extends GroupInputComponent implements On
 		}
 	}
 
-	selectAll(e: Event): false {
+	selectAll(e: MouseEvent): false {
 		this.controlNames.forEach(c => this.formGroup.get(c).setValue(this.meta.meta[c].value));
 		(e.target as HTMLLinkElement).blur();
 		return false;
 	}
 
-	selectNone(e: Event): false {
+	selectNone(e: MouseEvent): false {
 		this.controlNames.forEach(c => this.formGroup.get(c).setValue(null));
 		(e.target as HTMLLinkElement).blur();
 		return false;

src/app/dynaform/components/kendo/datepicker/datepicker.component.ts

@@ -10,6 +10,6 @@ export class DatepickerComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['placeholder'];
 
-	placeholder;
+	placeholder: string;
 
 }

src/app/dynaform/components/kendo/timepicker/timepicker.component.ts

@@ -10,8 +10,8 @@ export class TimepickerComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['format', 'steps', 'placeholder'];
 
-	format;
-	steps;
-	placeholder;
-	
+	format: string;
+	steps: number;
+	placeholder: string;
+
 }

src/app/dynaform/components/native/password/password.component.ts

@@ -10,6 +10,6 @@ export class PasswordComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['placeholder'];
 
-	placeholder;
+	placeholder: string;
 
 }

src/app/dynaform/components/native/radio/radio.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { NativeInputComponent } from '../../_abstract/native-input.component';
+import { IOption } from '../../../models/field.model';
 
 @Component({
 	selector: 'app-radio',
@@ -10,9 +11,9 @@ export class RadioComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['name', 'options', 'horizontal'];
 
-	name;
-	options;
-	horizontal;
+	name: string;
+	options: IOption[];
+	horizontal: boolean;
 	
 	prefix: string;
 

src/app/dynaform/components/native/select/select.component.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
 import { NativeInputComponent } from '../../_abstract/native-input.component';
 import { Router, ActivatedRoute } from '@angular/router';
+import { IOption, ILink } from '../../../models/field.model';
 
 @Component({
 	selector: 'app-select',
@@ -11,8 +12,8 @@ export class SelectComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['options', 'link'];
 
-	options;
-	link;
+	options: IOption[];
+	link: ILink;
 	
 	constructor(private router: Router, private route: ActivatedRoute) {
 		super();

src/app/dynaform/components/native/text/text.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { NativeInputComponent } from '../../_abstract/native-input.component';
+import { ILink } from '../../../models/field.model';
 
 @Component({
 	selector: 'app-text',
@@ -10,7 +11,7 @@ export class TextComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['placeholder', 'link'];
 
-	placeholder;
-	link;
+	placeholder: string;
+	link: ILink;
 	
 }

src/app/dynaform/components/native/textarea/textarea.component.ts

@@ -10,6 +10,6 @@ export class TextareaComponent extends NativeInputComponent {
 
 	exposeMetaInTemplate: string[] = ['placeholder'];
 
-	placeholder;
+	placeholder: string;
 
 }

src/app/dynaform/components/nocontrol/button-group/button-group.component.ts

@@ -19,7 +19,7 @@ export class ButtonGroupComponent implements OnInit {
 		this.buttons = this.meta.meta;
 	}
 
-	handle(fnId: string, e: Event) {
+	handle(fnId: string, e: Event): void {
 		e.preventDefault();
 		(e.target as HTMLElement).blur();
 		this.call.emit(fnId);

src/app/dynaform/components/nocontrol/display/display.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, OnInit } from '@angular/core';
+import { ILink } from '../../../models/field.model';
 
 @Component({
 	selector: 'app-display',
@@ -11,7 +12,7 @@ export class DisplayComponent implements OnInit {
 	meta: StringMap<any>;
 
 	value: string;
-	link?: StringMap<any>;
+	link?: ILink;
 
 	ngOnInit() {
 		this.value = this.meta.value;

src/app/dynaform/models/field.model.ts

@@ -392,6 +392,12 @@ class DisplayField {
 // ---------------------------------------------------------------------------------------------------------------------
 // Exports
 
+// Interfaces
+export {
+	IOption, ILink
+}
+
+// Classes
 export {
 	SimpleField,
 	TextField, TextareaField, PasswordField, SelectField, RadioField, CheckboxField, HiddenField,
@@ -401,3 +407,4 @@ export {
 	Container, RepeatingContainer,
 	ButtonGroup, Heading, DisplayField
 };
+