Simplifying module structure

dynaform.code-workspace

@@ -0,0 +1,11 @@
+{
+	"folders": [
+		{
+			"path": "."
+		},
+		{
+			"path": "src/app/dynaform"
+		}
+	],
+	"settings": {}
+}

src/app/app.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit, ViewChild, TemplateRef } from '@angular/core';
 import { FormBuilder, FormGroup, FormArray, FormControl, Validators } from '@angular/forms';
 
-import { ValueTransformer } from './dynaform/components/fields//dropdown-modified-input/dropdown-modified-input.component';
+import { ValueTransformer } from './dynaform/interfaces';
 
 // ---------------------------------------------------------------------------------------------------------------------
 // For Dynaform

src/app/directives/json-formatter.directive.ts

@@ -2,6 +2,7 @@ import { Directive, Input, OnChanges, ElementRef } from '@angular/core';
 import JSONFormatter from 'json-formatter-js';
 
 @Directive({
+	// tslint:disable-next-line:directive-selector
 	selector: 'json-formatter'
 })
 export class JsonFormatterDirective implements OnChanges {

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

@@ -33,11 +33,11 @@ export class CheckbuttonComponent implements OnInit, ControlValueAccessor {
 		// Move meta variables up a level, for direct access in templates
 		['label', 'value', 'isDisabled'].map(p => this[p] = this.meta[p] || this[p]);
 	}
-	
+
 	private toggleChecked(e): void {
 		e.target.blur();
 		e.preventDefault();
-		if (this.isDisabled) return;
+		if (this.isDisabled) { return; }
 		this.isChecked = !this.isChecked;
 		this.currentValue = this.isChecked ? this.value : false;
 		this.propagateChange(this.currentValue);

src/app/dynaform/components/fields/dropdown-modified-input/dropdown-modified-input.component.ts

@@ -1,20 +1,16 @@
 import { Component, OnInit, Input, forwardRef } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-
-export interface ValueTransformer {
-	inputFn: (value: string) => { modifier: string, value: string }
-	outputFn: (modifier: string, value: string) => string
-}
+import { ValueTransformer }	from './../../interfaces';
 
 @Component({
 	selector: 'app-dropdown-modified-input',
 	templateUrl: 'dropdown-modified-input.component.html',
 	styles: [],
 	providers: [
-		{ 
-		  provide: NG_VALUE_ACCESSOR,
-		  useExisting: forwardRef(() => DropdownModifiedInputComponent),
-		  multi: true
+		{
+			provide: NG_VALUE_ACCESSOR,
+			useExisting: forwardRef(() => DropdownModifiedInputComponent),
+			multi: true
 		}
 	]
 })
@@ -22,7 +18,7 @@ export class DropdownModifiedInputComponent implements OnInit, ControlValueAcces
 
 
 	@Input()
-	meta: StringMap= {};
+	meta: StringMap = {};
 
 	modifiers: Array<string>;
 	transform: ValueTransformer = {
@@ -32,7 +28,7 @@ export class DropdownModifiedInputComponent implements OnInit, ControlValueAcces
 	private selectedModifier: string;
 	private displayedValue: string;
 	private _controlValue: string;
-	
+
 	private extraClass: string = '';
 
 	propagateChange = (_: any) => {};
@@ -42,7 +38,7 @@ export class DropdownModifiedInputComponent implements OnInit, ControlValueAcces
 		['modifiers', 'transform', 'placeholder'].map(p => this[p] = this.meta[p] || this[p]);
 		this.controlValue = this.meta.value;
 	}
-	
+
 	get controlValue(): string {
 		return this._controlValue;;
 	}
@@ -53,7 +49,7 @@ export class DropdownModifiedInputComponent implements OnInit, ControlValueAcces
 		this.displayedValue = value;
 		this._controlValue = inputValue;
 	}
-	
+
 	writeValue(value: string): void {
 		this.controlValue = value;
 	}

src/app/dynaform/directives/dynafield.directive.ts

@@ -4,7 +4,7 @@ import {
 } from '@angular/core';
 import { Form, FormControl, ControlContainer, NgControl, ControlValueAccessor, ValidatorFn, AsyncValidatorFn } from '@angular/forms';
 
-import * as formFieldComponents from './../components/fields';
+import * as formFieldComponents from './../components';
 
 interface FFC {
 	control: FormControl;

src/app/dynaform/dynaform.module.ts

@@ -4,10 +4,10 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 
-import { DynaformComponent } from './components/dynaform/dynaform.component';
+import { DynaformComponent } from './dynaform.component';
 import { DynafieldDirective } from './directives/dynafield.directive';
 
-import * as formFieldComponents from './components/fields';
+import * as formFieldComponents from './components';
 const ffcArr = Object.values(formFieldComponents); // Array of all the Form Field Components
 
 @NgModule({

src/app/dynaform/interfaces/index.ts

@@ -0,0 +1,6 @@
+export interface ValueTransformer {
+	inputFn: (value: string) => { modifier: string, value: string };
+	outputFn: (modifier: string, value: string) => string;
+}
+
+export const a = 1;

src/app/dynaform/models/index.ts

@@ -5,38 +5,38 @@
  ********************************************************************************************************************* */
 
 import { ValidatorFn, AsyncValidatorFn } from '@angular/forms';
-import { ValueTransformer } from './../components/fields/dropdown-modified-input/dropdown-modified-input.component';
+import { ValueTransformer } from './../interfaces';
 
 // ---------------------------------------------------------------------------------------------------------------------
 // Types & Interfaces
 
-type Option = {
-	label: string,
-	value: string
+interface Option {
+	label: string;
+	value: string;
 }
 
 interface BasicFieldMetaData {
-	name: string 								// The FormControl name
-	origin?: string								// Location in API-returned model - defaults to name
-	type?: string 								// The component type e.g. BasicInput, Checkbutton, Timepicker, etc
-	label?: string								// The field label - defaults to unCamelCased name if not supplied
-	value?: string								// The field value - defaults to empty string if not supplied
-	placeholder?: string						// Optional placeholder text
-	class?: string | Array<string>				// CSS classes to apply								
-	id?: string									// CSS id to apply
-	isDisabled?: boolean						// Whether field is initially disabled
-	validators?: Array<ValidatorFn>				// Array of validator functions - following Angular FormControl API
-	asyncValidators?: Array<AsyncValidatorFn>	// Array of async validator functions - following Angular FormControl API
-	valFailureMsgs?: StringMap					// Validation failure messages - display appropriate message if validation fails
+	name: string; 								// The FormControl name
+	origin?: string;							// Location in API-returned model - defaults to name
+	type?: string; 								// The component type e.g. BasicInput, Checkbutton, Timepicker, etc
+	label?: string;								// The field label - defaults to unCamelCased name if not supplied
+	value?: string;								// The field value - defaults to empty string if not supplied
+	placeholder?: string;						// Optional placeholder text
+	class?: string | Array<string>;				// CSS classes to apply
+	id?: string;								// CSS id to apply
+	isDisabled?: boolean;						// Whether field is initially disabled
+	validators?: Array<ValidatorFn>;			// Array of validator functions - following Angular FormControl API
+	asyncValidators?: Array<AsyncValidatorFn>;	// Array of async validator functions - following Angular FormControl API
+	valFailureMsgs?: StringMap;					// Validation failure messages - display appropriate message if validation fails
 }
 
 interface OptionsFieldMetaData extends BasicFieldMetaData {
-	options: Option[]							// Array of Options - for select, radio-button-group and other 'multiple-choice' types
+	options: Option[];							// Array of Options - for select, radio-button-group and other 'multiple-choice' types
 }
 
 interface DropdownModifiedInputFieldMetaData extends BasicFieldMetaData {
-	modifiers: string[]
-	transform: ValueTransformer
+	modifiers: string[];
+	transform: ValueTransformer;
 }
 
 interface TimePickerFieldMetaData extends BasicFieldMetaData {
@@ -130,7 +130,7 @@ for (field in model) {
 		Object.assign(modeledMeta, new BasicField(field)); // Defaults to basic text field
 	}
  }
- 
+
 
  (2) Apprach 2: Meta-data fully specified (not lazily-generated), so loop through metadata genetating field models.
      metaspec may be hard-coded (for now) or loaded from server and cached, as part of app boostraping