No need for 'valid' data

Add name prop, and event emitter for changes

js/components/text_input.js

@@ -9,6 +9,7 @@ export default {
   },
 
   props: {
+    name: String,
     validation: {
       type: String,
       default: () => 'anything'
@@ -21,7 +22,6 @@ export default {
 
   data: function () {
     return {
-      valid: false,
       showError: false,
       showValid: false,
       mask: inputValidations[this.validation].mask,
@@ -60,8 +60,14 @@ export default {
       } else if (invalidate) {
         this.showError = true
       }
-      this.valid = valid
       this.showValid = valid
+
+      // Emit a change event
+      this.$emit('fieldChange', {
+        value,
+        valid,
+        name: this.name
+      })
     },
 
     _validate: function (value) {