style: eslint fixes

Author: uwla

src/aliases.ts

@@ -19,19 +19,19 @@ function addAlias(key: string, alias: FieldAlias): void {
 }
 
 function addAliases(newAliases: FieldAliases): void {
-    for (let key of Object.keys(newAliases)) addAlias(key, newAliases[key])
+    for (const key of Object.keys(newAliases)) addAlias(key, newAliases[key])
 }
 
 function setAlias(key: string, alias: FieldAlias): void {
     if (aliases[key] !== undefined) aliases[key] = alias
 }
 
 function setAliases(newAliases: FieldAliases): void {
-    for (let key of Object.keys(newAliases)) setAlias(key, newAliases[key])
+    for (const key of Object.keys(newAliases)) setAlias(key, newAliases[key])
 }
 
 function delAllAliases(): void {
-    for (let key of Object.keys(aliases)) delete aliases[key]
+    for (const key of Object.keys(aliases)) delete aliases[key]
 }
 
 function delAlias(key: string): void {

src/components/VfbCheckbox.ts

@@ -1,6 +1,7 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue"],
     data() {
         return { checked: this.modelValue }
     },
@@ -9,5 +10,4 @@ export default defineComponent({
             this.$emit("update:modelValue", this.checked)
         },
     },
-    props: ["modelValue"],
 })

src/components/VfbCheckbox.vue

@@ -1,8 +1,8 @@
 <template>
     <input
+        v-model="checked"
         type="checkbox"
         class="vfb-checkbox"
-        v-model="checked"
         @change="handleInput"
     />
 </template>

src/components/VfbCheckboxes.ts

@@ -1,16 +1,16 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue", "options", "name", "state", "id"],
     methods: {
         handleInput(e: any) {
-            let target = e.target
-            let value = target.value
+            const target = e.target
+            const value = target.value
             let newChecked = [...this.modelValue]
             if (newChecked.includes(value))
                 newChecked = newChecked.filter(v => v !== value)
             else newChecked.push(value)
             this.$emit("update:modelValue", newChecked)
         },
     },
-    props: ["modelValue", "options", "name", "state", "id"],
 })

src/components/VfbCheckboxes.vue

@@ -8,10 +8,10 @@
             :key="i"
         >
             <input
+                :id="`${id}_${i}`"
                 type="checkbox"
                 class="vfb-checkbox"
                 :name="name"
-                :id="`${id}_${i}`"
                 :value="option.value"
                 :checked="modelValue.includes(option.value)"
                 @change="handleInput"

src/components/VfbFeedback.ts

@@ -1,6 +1,13 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: {
+        state: { default: null, type: Boolean },
+        errors: [String, Array],
+        message: String,
+        invalidFeedbackComponent: [String, Object],
+        validFeedbackComponent: [String, Object],
+    },
     computed: {
         showFeedback() {
             return this.state !== null
@@ -11,11 +18,4 @@ export default defineComponent({
             return []
         },
     },
-    props: {
-        state: { default: null, type: Boolean },
-        errors: [String, Array],
-        message: String,
-        invalidFeedbackComponent: [String, Object],
-        validFeedbackComponent: [String, Object],
-    },
 })

src/components/VfbFeedback.vue

@@ -1,7 +1,7 @@
 <template>
     <div
-        class="vfb-feedback"
         v-if="showFeedback"
+        class="vfb-feedback"
     >
         <component
             :is="invalidFeedbackComponent"

src/components/VfbFile.ts

@@ -1,12 +1,12 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue", "multiple", "state"],
     methods: {
         handleInput(e: any) {
             const { files } = e.target
             if (this.multiple) this.$emit("update:modelValue", files)
             else this.$emit("update:modelValue", files[0])
         },
     },
-    props: ["modelValue", "multiple", "state"],
 })

src/components/VfbFile.vue

@@ -3,8 +3,8 @@
         class="vfb-input"
         type="file"
         :multiple="multiple"
-        @change="handleInput"
         :class="{ invalid: state === false, valid: state === true }"
+        @change="handleInput"
     />
 </template>
 <script lang="ts" src="./VfbFile.ts"></script>

src/components/VfbGroup.vue

@@ -1,8 +1,8 @@
 <template>
     <div class="vfb-group">
         <label
-            :for="labelFor"
             v-if="label"
+            :for="labelFor"
         >
             {{ label }}
         </label>

src/components/VfbInput.ts

@@ -1,6 +1,7 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue", "state"],
     computed: {
         val: {
             get() {
@@ -11,5 +12,4 @@ export default defineComponent({
             },
         },
     },
-    props: ["modelValue", "state"],
 })

src/components/VfbRadio.ts

@@ -1,6 +1,7 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue", "options", "name", "id", "state"],
     data() {
         return { checked: this.modelValue }
     },
@@ -9,5 +10,4 @@ export default defineComponent({
             this.$emit("update:modelValue", this.checked)
         },
     },
-    props: ["modelValue", "options", "name", "id", "state"],
 })

src/components/VfbRadio.vue

@@ -8,12 +8,12 @@
             :key="i"
         >
             <input
+                :id="`${id}_${i}`"
+                v-model="checked"
                 class="vfb-radio"
                 type="radio"
                 :name="name"
                 :value="option.value"
-                :id="`${id}_${i}`"
-                v-model="checked"
                 @change="handleInput"
             />
             <label :for="`${id}_${i}`">

src/components/VfbRange.ts

@@ -1,6 +1,7 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue", "state"],
     computed: {
         val: {
             get() {
@@ -11,5 +12,4 @@ export default defineComponent({
             },
         },
     },
-    props: ["modelValue", "state"],
 })

src/components/VfbSelect.ts

@@ -2,6 +2,7 @@ import { defineComponent } from "vue"
 
 export default defineComponent({
     name: "VfbSelect",
+    props: ["options", "modelValue", "state"],
     computed: {
         selected: {
             get() {
@@ -12,5 +13,4 @@ export default defineComponent({
             },
         },
     },
-    props: ["options", "modelValue", "state"],
 })

src/components/VfbTags.ts

@@ -2,6 +2,18 @@ import { defineComponent } from "vue"
 
 export default defineComponent({
     name: "VfbTags",
+    props: {
+        options: { type: Array, required: true },
+        modelValue: { type: Array, required: true },
+        state: { type: Boolean, default: null },
+        placeholder: { type: String, default: "search..." },
+        emptyResults: {
+            type: String,
+            default: "0 items matching the search...",
+        },
+        id: String,
+        name: String,
+    },
     data() {
         return { query: "" }
     },
@@ -18,8 +30,8 @@ export default defineComponent({
     },
     methods: {
         handleInput(e: any) {
-            let target = e.target
-            let value = target.value
+            const target = e.target
+            const value = target.value
             let newChecked = [...(this.modelValue as string[])]
             if (newChecked.includes(value))
                 newChecked = newChecked.filter(v => v !== value)
@@ -33,16 +45,4 @@ export default defineComponent({
             this.$emit("update:modelValue", newChecked)
         },
     },
-    props: {
-        options: { type: Array, required: true },
-        modelValue: { type: Array, required: true },
-        state: { type: Boolean, default: null },
-        placeholder: { type: String, default: "search..." },
-        emptyResults: {
-            type: String,
-            default: "0 items matching the search...",
-        },
-        id: String,
-        name: String,
-    },
 })

src/components/VfbTags.vue

@@ -2,23 +2,23 @@
     <div class="vfb-tags">
         <div class="vfb-group">
             <input
-                v-model="query"
                 :id="id"
+                v-model="query"
                 :placeholder="placeholder"
                 class="vfb-input"
                 type="text"
             />
         </div>
         <div
-            class="vfb-group vfb-buttons"
             v-show="modelValue.length"
+            class="vfb-group vfb-buttons"
         >
             <!-- @vue-ignore -->
             <button
                 v-for="(value, i) in modelValue"
                 :key="i"
-                @click="removeTag(value)"
                 class="vfb-tag"
+                @click="removeTag(value)"
             >
                 <span>{{ value }}</span>
                 <span class="vfb-tag-x">x</span>
@@ -37,10 +37,10 @@
                 :key="option.value"
             >
                 <input
+                    :id="`${id}_${i}`"
                     type="checkbox"
                     class="vfb-checkbox"
                     :name="name"
-                    :id="`${id}_${i}`"
                     :value="option.value"
                     :checked="modelValue.includes(option.value)"
                     @change="handleInput"

src/components/VfbTextarea.ts

@@ -1,6 +1,7 @@
 import { defineComponent } from "vue"
 
 export default defineComponent({
+    props: ["modelValue", "state"],
     computed: {
         text: {
             get() {
@@ -11,5 +12,4 @@ export default defineComponent({
             },
         },
     },
-    props: ["modelValue", "state"],
 })