diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt
index 253f8fae..854ad3e8 100644
--- a/ayanova/devdocs/todo.txt
+++ b/ayanova/devdocs/todo.txt
@@ -45,7 +45,13 @@ CURRENT ROADMAP
 CURRENT TODOs
 =-=-=-=-=-=-=
 
-NOW:  working on Custom2 biz rule when empty on regular record (not new yet, just getting it working on regular up front)
+TODO: Custom fields component
+	- implement each type of control
+	- Add code to coerce the value or handle a completely change of datatype on the record
+		- i.e. it was text and now is a date etc
+		
+
+
 	
 TODO: Make sure can easily make new record in Widget form before getting into deeper stuff or making any other object forms.
 
@@ -59,25 +65,6 @@ TODO: Widget edit form, new record sb time and dates pre-filled in? Server invol
 	- some objects may be configurable what the default date/time range is so maybe enable that for widget to test
 	- SB defaults route on server or is this a profile thing and user selectable?
 
-TODO: Widget edit form, new record cdata error as it's empty on new
-	- To see, create new and edit the custom2
-
-TODO: Custom fields
-	- Needs to cache the customization data of the form and concurrency token used to fetch it and then it checks the concurrency token periodically
-		- {"data":{"id":1,"concurrencyToken":3761005,"formKey":"widget","template":"[{\"fld\":\"WidgetNotes\",\"required\":\"true\"},{\"fld\":\"WidgetCustom1\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"datetime\"},{\"fld\":\"WidgetCustom2\",\"hide\":\"false\",\"required\":\"true\",\"type\":\"text\"},{\"fld\":\"WidgetCustom3\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"number\"},{\"fld\":\"WidgetCustom4\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"bool\"},{\"fld\":\"WidgetCustom5\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"currency\"},{\"fld\":\"WidgetCustom6\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"date\"},{\"fld\":\"WidgetCustom7\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"time\"}]"}}
-
-	- Needs to be aware of and handle the fact that the end user may change the data type 		
-		- if it expects a type of value and finds one it can't co-erce into the new type then it should zap it or set it null by default.
-		- This could get ugly so just stick to a simple system like wiping uncoercable data and fuck it, they made their choice :)
-	- Implement then Componentize
-	- Maybe start with a component first now that I have my feet wet in it, saves time
-	- Have to think about the design, but probably most useful when on the same page as the main record just like in v7 windows
-	- Should be a single component I can reference on the form that handles it all directly
-	- Custom field "slot" maybe just like the VUE Way so that it can be easily optionally shown or not in it's slot
-	- Though, these need to be part of the record as well, hmmm...maybe better if they appear to be just normal fields and are added dynamically??
-		- It would be nice though to just insert a slot and let a component handle it rather than buncvh of code on every form...
-		- It's kind of like one control that is bound to the JSON custom fields-field and it would update it as edited and required so I guess this is how to think about it and implement it, as a control
-
 TODO: Form customize UI
 	- Where you create custom fields and edit 
 	- If a user changes a field data type there needs to be a big warning before accepting it.
diff --git a/ayanova/src/components/custom-fields-control.vue b/ayanova/src/components/custom-fields-control.vue
index 7acd4e9c..b70fde23 100644
--- a/ayanova/src/components/custom-fields-control.vue
+++ b/ayanova/src/components/custom-fields-control.vue
@@ -34,7 +34,18 @@
             px-2
           >
             <div v-if="item.type === 'currency'">
-              CURRENCY CONTROL HERE
+              <v-text-field
+                v-model="_self[item.dataKey]"
+                :readonly="readOnly"
+                :prefix="ltFormat().currencySymbol"
+                :label="lt(item.fld)"
+                :ref="item.fld"
+                :error-messages="form().serverErrors(parentVM, item.fld)"
+                :rules="[
+                  form().customFieldsCheck(parentVM, item, _self, lt(item.fld))
+                ]"
+                type="number"
+              ></v-text-field>
             </div>
             <div v-else-if="item.type === 'date'">
               DATE CONTROL HERE
@@ -46,7 +57,6 @@
               DATE and TIME CONTROL HERE
             </div>
             <div v-else-if="item.type === 'text'">
-              {{ lt(item.fld) }}
               <v-textarea
                 v-model="_self[item.dataKey]"
                 :readonly="readOnly"
@@ -59,20 +69,6 @@
                 auto-grow
                 clearable
               ></v-textarea>
-
-              <!-- <v-textarea
-                v-model="obj.notes"
-                :readonly="this.formState.readOnly"
-                :label="lt('WidgetNotes')"
-                :error-messages="form().serverErrors(this, 'notes')"
-                ref="notes"
-                @change="onChange('notes')"
-                auto-grow
-                 
-                @change="onChange(item.fld)"
-                
-              >
-              ></v-textarea> -->
             </div>
             <div v-else-if="item.type === 'number'">
               NUMBER INPUT CONTROL HERE
@@ -131,21 +127,21 @@ CUSTOM FIELD DATA:
 export default {
   data() {
     return {
-      c1: null,
-      // c2: null, this was replaced with a computed property as will all others
-      c3: null,
-      c4: null,
-      c5: null,
-      c6: null,
-      c7: null,
-      c8: null,
-      c9: null,
-      c10: null,
-      c12: null,
-      c13: null,
-      c14: null,
-      c15: null,
-      c16: null
+      // c1: null,
+      // // c2: null, this was replaced with a computed property as will all others
+      // c3: null,
+      // c4: null,
+      // c5: null,
+      // c6: null,
+      // c7: null,
+      // c8: null,
+      // c9: null,
+      // c10: null,
+      // c12: null,
+      // c13: null,
+      // c14: null,
+      // c15: null,
+      // c16: null
     };
   },
   props: {
@@ -155,6 +151,14 @@ export default {
     parentVM: Object
   },
   computed: {
+    c1: {
+      get: function() {
+        return this.GetValueForField("c1");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c1", newValue);
+      }
+    },
     c2: {
       get: function() {
         return this.GetValueForField("c2");
@@ -162,12 +166,127 @@ export default {
       set: function(newValue) {
         this.SetValueForField("c2", newValue);
       }
+    },
+    c3: {
+      get: function() {
+        return this.GetValueForField("c3");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c3", newValue);
+      }
+    },
+    c4: {
+      get: function() {
+        return this.GetValueForField("c4");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c4", newValue);
+      }
+    },
+    c5: {
+      get: function() {
+        return this.GetValueForField("c5");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c5", newValue);
+      }
+    },
+    c6: {
+      get: function() {
+        return this.GetValueForField("c6");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c6", newValue);
+      }
+    },
+    c7: {
+      get: function() {
+        return this.GetValueForField("c7");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c7", newValue);
+      }
+    },
+    c8: {
+      get: function() {
+        return this.GetValueForField("c8");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c8", newValue);
+      }
+    },
+    c9: {
+      get: function() {
+        return this.GetValueForField("c9");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c9", newValue);
+      }
+    },
+    c10: {
+      get: function() {
+        return this.GetValueForField("c10");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c10", newValue);
+      }
+    },
+    c11: {
+      get: function() {
+        return this.GetValueForField("c11");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c11", newValue);
+      }
+    },
+    c12: {
+      get: function() {
+        return this.GetValueForField("c12");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c12", newValue);
+      }
+    },
+    c13: {
+      get: function() {
+        return this.GetValueForField("c13");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c13", newValue);
+      }
+    },
+    c14: {
+      get: function() {
+        return this.GetValueForField("c14");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c14", newValue);
+      }
+    },
+    c15: {
+      get: function() {
+        return this.GetValueForField("c15");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c15", newValue);
+      }
+    },
+    c16: {
+      get: function() {
+        return this.GetValueForField("c16");
+      },
+      set: function(newValue) {
+        this.SetValueForField("c16", newValue);
+      }
     }
   },
   methods: {
     lt: function(ltkey) {
       return window.$gz.locale.get(ltkey);
     },
+    ltFormat() {
+      return window.$gz.locale.format();
+    },
     form() {
       //nothing
       return window.$gz.form;
@@ -199,14 +318,12 @@ export default {
     SetValueForField: function(dataKey, newValue) {
       //https://stackoverflow.com/questions/39868963/vue-2-mutating-props-vue-warn
 
-      //debugger;
-
       //Is this a new or empty custom fields object?
       if (this.value === null || this.value === undefined) {
         this.value = "{}"; //empty json fragment, field will be added later below
       }
 
-      //Get the data out of the json string value
+      //Get the current data out of the json string value
       //
       var cData = JSON.parse(this.value);
       if (!window.$gz._.has(cData, dataKey)) {
@@ -233,7 +350,6 @@ export default {
     }
   },
   beforeCreate() {
-    // console.log("custom-fields-control::BEFORECREATE: TOP");
     //check pre-requisites exist just in case
     if (window.$gz.errorHandler.devMode()) {
       if (!window.$gz._) {
@@ -245,7 +361,6 @@ export default {
     }
   },
   created() {
-    // console.log("custom-fields-control::BEFORECREATE: TOP");
     if (window.$gz.errorHandler.devMode()) {
       //debugger;
       if (!this.formKey) {