Code maintenance; solving a few minor issues

README.md

@@ -156,7 +156,7 @@ sayCheese() {
 | `after`              | Ordering instruction - move after *name of another control in group* |                                                              |
 | `validators`         | Array of validator functions - following Angular FormControl API | []                                                           |
 | `asyncValidators`    | Array of async validator functions - following Angular FormControl API | []                                                           |
-| `valFailureMessages` | Validation failure messages - used to display appropriate message if validation fails |                                                              |
+| `valFailureMsgs`     | Validation failure messages - used to display appropriate message if validation fails |                                                              |
 
 #### Available types
 

package.json

@@ -20,26 +20,27 @@
     "@angular/platform-browser": "^8.2.14",
     "@angular/platform-browser-dynamic": "^8.2.14",
     "@angular/router": "^8.2.14",
-    "@clr/angular": "^2.3.2",
-    "@clr/icons": "^2.3.2",
-    "@clr/ui": "^2.3.2",
+    "@clr/angular": "^2.3.3",
+    "@clr/icons": "^2.3.3",
+    "@clr/ui": "^2.3.3",
     "@webcomponents/custom-elements": "^1.3.1",
     "angular-super-validator": "^2.0.0",
     "json-formatter-js": "^2.2.1",
     "lodash": "^4.17.15",
     "ramda": "^0.26.1",
     "rxjs": "^6.5.3",
+    "typescript": "^3.5.3",
     "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.803.19",
-    "@angular/cli": "^8.3.19",
+    "@angular-devkit/build-angular": "~0.803.20",
+    "@angular/cli": "^8.3.20",
     "@angular/compiler-cli": "^8.2.14",
     "@angular/language-service": "^8.2.14",
     "@types/jasmine": "^3.5.0",
     "@types/jasminewd2": "~2.0.8",
     "@types/lodash": "^4.14.149",
-    "@types/node": "^12.12.14",
+    "@types/node": "^12.12.21",
     "codelyzer": "^5.2.0",
     "jasmine-core": "~3.5.0",
     "jasmine-spec-reporter": "~4.2.1",
@@ -51,8 +52,7 @@
     "node-sass": "^4.13.0",
     "protractor": "^5.4.2",
     "rxjs-tslint": "^0.1.7",
-    "ts-node": "^8.5.2",
-    "tslint": "~5.20.1",
-    "typescript": "3.5.3"
+    "ts-node": "^8.5.4",
+    "tslint": "~5.20.1"
   }
 }

src/app/_mock/testfields.v1.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Generation of Modeled MetaData using form field models
+// ---------------------------------------------------------------------------------------------------------------------
 
 import { ValueTransformer } from './../dynaform/interfaces';
 import * as fmd from '../dynaform/models/field.model'; // fmd = Form Meta Data

src/app/_mock/testfields.v10.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Labelling Containers, hidden fields, and fields with links
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {
 	aSubGroup: {

src/app/_mock/testfields.v11.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Contaiuners seeding metadata (except source, which is currently handled separately)
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {};
 
@@ -9,7 +11,7 @@ const meta = {
 		meta: {
 			a: {},
 			b: {},
-			c: { value: 6 },
+			c: { value: 6, class: 'short-field' },
 			d: {},
 			nestedContiner: {
 				label: 'More deeply nested container',

src/app/_mock/testfields.v12.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Repeating Groups Of Fields ( 1 -> N arrays of containers for multiple fields )
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {
 	repeating: [

src/app/_mock/testfields.v2.ts

@@ -1,4 +1,6 @@
-// TESTS: Generation of Field-Specific Modeled MetaData using buildFieldSpecific library function
+// ---------------------------------------------------------------------------------------------------------------------
+// TESTS: Generation of Field-Specific Modeled MetaData using buildFieldSpecificMeta library function
+// ---------------------------------------------------------------------------------------------------------------------
 
 import { ValueTransformer } from './../dynaform/interfaces';
 

src/app/_mock/testfields.v3.ts

@@ -1,5 +1,7 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Generation of Automatic MetaData from model using autoMeta library function
 // All fields will default to type 'text'
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {
 	a: 'Value 1',

src/app/_mock/testfields.v4.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Lazy combination of Automatic MetaData with Extra MetaData
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {
 	a: 'Value 1',
@@ -21,7 +23,7 @@ const meta = {
 	d: {
 		meta: {
 			e: { type: 'radio', 'label': 'Does it work yet?' },
-			f: { type: 'clrDatepicker' }
+			f: { type: 'datepicker' }
 		}
 	}
 };

src/app/_mock/testfields.v5.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Deep nesting
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {
 	dynaformtest: {
@@ -25,7 +27,7 @@ const meta = {
 			d: {
 				meta: {
 					e: { type: 'radio', 'label': 'Does it work yet?' },
-					f: { type: 'clrDatepicker' }
+					f: { type: 'datepicker' }
 				}
 			}
 		}

src/app/_mock/testfields.v6.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Deep Nesting and Validators
+// ---------------------------------------------------------------------------------------------------------------------
 
 import { Validators } from '@angular/forms';
 
@@ -28,8 +30,8 @@ const meta = {
 			valTest: {
 				validators: [ Validators.required, Validators.minLength(4) ],
 				// perhaps have some standard messages for standard failures in the Object.prototype ??
-				valFailureMessages: {
-					'required': 'This field is required',
+				valFailureMsgs: {
+					'required': 'YOU MUST REPLY',
 					'minlength': 'Please type something longer'
 				}
 			},
@@ -38,7 +40,7 @@ const meta = {
 			d: {
 				meta: {
 					e: { type: 'radio', 'label': 'Does it work yet?', validators: Validators.required },
-					f: { type: 'clrDatepicker' }
+					f: { type: 'datepicker' }
 				}
 			}
 		}

src/app/_mock/testfields.v7.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: Async Validator
+// ---------------------------------------------------------------------------------------------------------------------
 
 import { FormControl, Validators, ValidationErrors } from '@angular/forms';
 
@@ -9,7 +11,7 @@ import { delay, map } from 'rxjs/internal/operators';
 const testAsyncValidator = (fc: FormControl): Observable<ValidationErrors> => {
 	return of(fc).pipe(delay(2000)).pipe(map(_fc => {
 		console.log('Async validator got', _fc.value);
-		return { isNot42: _fc.value.trim() !== '42' };
+		return _fc.value.trim() !== '42' ? { isNot42: true } : null;
 	}));
 };
 

src/app/_mock/testfields.v8.ts

@@ -1,4 +1,6 @@
+// ---------------------------------------------------------------------------------------------------------------------
 // TESTS: FormBuilder FormArray's and CheckButtomGroups (with Select All / Select Non option)
+// ---------------------------------------------------------------------------------------------------------------------
 
 const model = {
 	standardField: '',

src/app/_mock/testfields.v9.ts

@@ -1,4 +1,6 @@
-// TESTS: Button callbacks in deeply nested forms, an validators on custom controls
+// ---------------------------------------------------------------------------------------------------------------------
+// TESTS: Button callbacks in deeply nested forms, and validators on custom controls
+// ---------------------------------------------------------------------------------------------------------------------
 
 import { FormControl, Validators, ValidationErrors } from '@angular/forms';
 
@@ -7,7 +9,7 @@ import { Observable, of } from 'rxjs';
 import { delay, map } from 'rxjs/internal/operators';
 
 const testAsyncValidator = (fc: FormControl): Observable<ValidationErrors> => {
-	return of(fc).pipe(delay(5000)).pipe(map(_fc => {
+	return of(fc).pipe(delay(2000)).pipe(map(_fc => {
 		console.log('Async validator got', _fc.value);
 		return _fc.value === '4200' ? null : { is4200: false };
 	}));
@@ -46,8 +48,8 @@ const meta = {
 			validatorTest: {
 				validators: [ Validators.required, Validators.minLength(4) ],
 				// perhaps have some standard messages for standard failures in the Object.prototype ??
-				valFailureMessages: {
-					'required': 'This field is required',
+				valFailureMsgs: {
+					'required': 'This field is simply a MUST',
 					'minlength': 'Please type something longer'
 				}
 			},
@@ -60,7 +62,7 @@ const meta = {
 			d: {
 				meta: {
 					isWorking: { type: 'radio', 'label': 'Does it work yet?', validators: Validators.required },
-					f: { type: 'clrDatepicker' },
+					f: { type: 'datepicker' },
 					deeplyNestedButtonGroup: { type: 'buttonGroup', label: 'Deeply Nested Buttons',
 						meta: [
 							{ label: 'Say Hello', fnId: 'SAYHELLO' },

src/app/app.component.html

@@ -3,7 +3,7 @@
 		<div class="clr-col-12 pt-4 pb-2">
 			<h1>NgDynaform: Clarity Edition</h1>
 			<p>
-			Dynamic Form Layout Module<br>
+			<b>Dynamic Form Layout Module</b><br>
 			Load different tests by appending a query param to the URL <b>?test=N</b> (where N is a number between 1 and 12).<br>
 			NOTE: Model set to update on change, but this can be set to blur or submit for less re-rendering.
 			</p>

src/app/dynaform/dynaform.component.ts

@@ -236,7 +236,7 @@ export class DynaformComponent implements OnInit, OnChanges {
 		if (control.errors) {
 			const errKeys = Object.keys(control.errors);
 			console.log(errKeys);
-			return meta.valFailureMessages[errKeys[0]];
+			return meta.valFailureMsgs[errKeys[0]];
 		}
 	}
 

src/app/dynaform/testdata/testset.2.ts

@@ -28,7 +28,7 @@ const meta = {
 			validationTest: {
 				validators: [ Validators.required, Validators.minLength(4) ],
 				// perhaps have some standard messages for standard failures in the Object.prototype ??
-				valFailureMessages: {
+				valFailureMsgs: {
 					'required': 'This field is required',
 					'minlength': 'Please type something longer'
 				}