♻️ better types system

ui/Components/Value/String.vue

@@ -1,6 +1,6 @@
 <template>
     <input
-        v-model="value.value"
+        v-model="value"
         :type="
             type === 'Number' ? 'number' :
             type === 'Color' ? 'color' :
@@ -11,7 +11,7 @@
 <script>
 export default {
     props: {
-        value: {
+        io: {
             type: null,
             required: true,
         },
@@ -19,6 +19,26 @@ export default {
             type: String,
             required: true,
         }
+    },
+    computed: {
+        value: {
+            get() {
+                return this.io.value;
+            },
+            set(val) {
+                if (this.type === 'Number') {
+                    this.io.value = parseFloat(val)
+                } else {
+                    this.io.value = val;
+                }
+            }
+        }
+    },
+    methods: {
+        onChange($event) {
+            console.log('change', $event);
+            this.value = $event.target.value;
+        }
     }
 }
 </script>