From da4ec4e44e2d47e6a78b2346ec4bd38a3aa7dc50 Mon Sep 17 00:00:00 2001
From: Stefan Popov <stefanpopov@list.ru>
Date: Sat, 1 Aug 2020 15:18:46 +0400
Subject: [PATCH 1/2] Fix input v-model

---
 src/components/Input/SInput.vue | 4 +++-
 src/stories/SInput.stories.ts   | 6 ++++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/Input/SInput.vue b/src/components/Input/SInput.vue
index 17a652ec..8cf14ce6 100644
--- a/src/components/Input/SInput.vue
+++ b/src/components/Input/SInput.vue
@@ -30,7 +30,7 @@
     />
     <template v-if="type === InputType.TEXT_FILE">
       <i class="s-icon-file"></i>
-      <input type="file" :accept="accept" @change="handleTextFileChange">
+      <input :value="emptyValue" type="file" :accept="accept" @change="handleTextFileChange">
     </template>
   </div>
 </template>
@@ -45,6 +45,7 @@ import { Autocomplete, InputType } from './consts'
 @Component
 export default class SInput extends Vue {
   readonly InputType = InputType
+  readonly emptyValue = null
   /**
    * Type of input. It can be "text" or "textarea" or any native input type.
    * `"text"` by default
@@ -129,6 +130,7 @@ export default class SInput extends Vue {
 
   @Watch('model')
   private handleValueChange (value: string | number): void {
+    this.$emit('input', value)
     this.$emit('change', value)
   }
 
diff --git a/src/stories/SInput.stories.ts b/src/stories/SInput.stories.ts
index f1269566..9ad8258e 100644
--- a/src/stories/SInput.stories.ts
+++ b/src/stories/SInput.stories.ts
@@ -160,6 +160,7 @@ export const textFileInput = () => ({
                type="text-file"
                placeholder="Upload or input text"
                :accept="accept"
+               @change="(value) => handleChange(value, input)"
              />`,
   data: () => ({
     input: ''
@@ -168,5 +169,10 @@ export const textFileInput = () => ({
     accept: {
       default: text('Accept', '*/*')
     }
+  },
+  methods: {
+    handleChange: (value, input) => {
+      console.log(`v-model=${input}`, `@change=${value}`)
+    }
   }
 })

From 5a37e8bcbbc71d610c51cd9e3b992ab972f64bf8 Mon Sep 17 00:00:00 2001
From: Stefan Popov <stefanpopov@list.ru>
Date: Tue, 4 Aug 2020 00:49:17 +0400
Subject: [PATCH 2/2] Add more visible results

---
 src/stories/SInput.stories.ts | 27 ++++++++++++++-------------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/stories/SInput.stories.ts b/src/stories/SInput.stories.ts
index 9ad8258e..e484d588 100644
--- a/src/stories/SInput.stories.ts
+++ b/src/stories/SInput.stories.ts
@@ -155,24 +155,25 @@ export const withTextLimit = () => ({
 
 export const textFileInput = () => ({
   components: { SInput },
-  template: `<s-input
-               v-model="input"
-               type="text-file"
-               placeholder="Upload or input text"
-               :accept="accept"
-               @change="(value) => handleChange(value, input)"
-             />`,
+  template: `<div class="flex" style="flex: 1; flex-direction: column;">
+               <s-input
+                 v-model="vModelValue"
+                 type="text-file"
+                 placeholder="Upload or input text"
+                 :accept="accept"
+                 @change="(value) => changeValue = value"
+               />
+               <span style="margin-top: 40px;">
+                 v-model="{{ vModelValue }}", @change="{{ changeValue }}"
+               </span>
+             </div>`,
   data: () => ({
-    input: ''
+    vModelValue: '',
+    changeValue: ''
   }),
   props: {
     accept: {
       default: text('Accept', '*/*')
     }
-  },
-  methods: {
-    handleChange: (value, input) => {
-      console.log(`v-model=${input}`, `@change=${value}`)
-    }
   }
 })