@dimailn/vuetify 2.7.2-alpha40 → 2.7.2-alpha42

package/src/components/VAutocomplete/VAutocomplete.ts

@@ -10,18 +10,17 @@ import { defineComponent, mergeProps } from 'vue'
 import {
   getObjectValueByPath,
   getPropertyFromItem,
-  keyCodes,
+  keyCodes
 } from '../../util/helpers'
 
 // Types
-import { PropType, VNode } from 'vue'
-import { PropValidator } from 'vue/types/options'
+import type { PropType, VNode } from 'vue'
 
 const defaultMenuProps = {
   ...VSelectMenuProps,
   offsetY: true,
   offsetOverflow: true,
-  transition: false,
+  transition: false
 }
 
 /* @vue/component */
@@ -29,6 +28,28 @@ export default defineComponent({
   name: 'v-autocomplete',
   extends: VSelect,
 
+  props: {
+    autoSelectFirst: {
+      type: Boolean,
+      default: false
+    },
+    filter: {
+      type: Function,
+      default: (item: any, queryText: string, itemText: string) => {
+        return itemText.toLocaleLowerCase().indexOf(queryText.toLocaleLowerCase()) > -1
+      }
+    } as unknown as PropType<(item: any, queryText: string, itemText: string) => boolean>,
+    hideNoData: Boolean,
+    menuProps: {
+      type: VSelect.props.menuProps.type,
+      default: () => defaultMenuProps
+    },
+    noFilter: Boolean,
+    searchInput: {
+      type: String as PropType<string | null>
+    }
+  },
+
   emits: [
     'update:search-input',
     'update:modelValue',
@@ -48,34 +69,12 @@ export default defineComponent({
     'click:prepend-inner',
     'click:clear',
     'input',
-    'update:error',
+    'update:error'
   ],
 
-  props: {
-    autoSelectFirst: {
-      type: Boolean,
-      default: false,
-    },
-    filter: {
-      type: Function,
-      default: (item: any, queryText: string, itemText: string) => {
-        return itemText.toLocaleLowerCase().indexOf(queryText.toLocaleLowerCase()) > -1
-      },
-    } as PropValidator<(item: any, queryText: string, itemText: string) => boolean>,
-    hideNoData: Boolean,
-    menuProps: {
-      type: VSelect.props.menuProps.type,
-      default: () => defaultMenuProps,
-    },
-    noFilter: Boolean,
-    searchInput: {
-      type: String as PropType<string | null>,
-    },
-  },
-
   data () {
     return {
-      lazySearch: this.searchInput,
+      lazySearch: this.searchInput
     }
   },
 
@@ -84,7 +83,7 @@ export default defineComponent({
       return {
         ...VSelect.computed.classes.call(this),
         'v-autocomplete': true,
-        'v-autocomplete--is-selecting-index': this.selectedIndex > -1,
+        'v-autocomplete--is-selecting-index': this.selectedIndex > -1
       }
     },
     computedItems (): object[] {
@@ -124,7 +123,7 @@ export default defineComponent({
           this.lazySearch = val
           this.$emit('update:search-input', val)
         }
-      },
+      }
     },
     isAnyValueAllowed (): boolean {
       return false
@@ -151,7 +150,7 @@ export default defineComponent({
       (props as any).contentClass = `v-autocomplete__content ${(props as any).contentClass || ''}`.trim()
       return {
         ...defaultMenuProps,
-        ...props,
+        ...props
       }
     },
     searchIsDirty (): boolean {
@@ -176,11 +175,11 @@ export default defineComponent({
           !this.isSearching ||
           !this.filteredItems.length
         ),
-        searchInput: this.internalSearch,
+        searchInput: this.internalSearch
       }
 
       return data
-    },
+    }
   },
 
   watch: {
@@ -219,7 +218,7 @@ export default defineComponent({
       this.lazySearch = val
     },
     internalSearch: 'onInternalSearchChanged',
-    itemText: 'updateSelf',
+    itemText: 'updateSelf'
   },
 
   created () {
@@ -345,7 +344,7 @@ export default defineComponent({
       }, {
         'aria-activedescendant': ariaActiveDescendant,
         autocomplete,
-        value: this.internalSearch,
+        value: this.internalSearch
       })
 
       return input
@@ -393,7 +392,7 @@ export default defineComponent({
 
       if (
         e.ctrlKey ||
-        ![keyCodes.home, keyCodes.end].includes(keyCode)
+        ![keyCodes.home, keyCodes.end].includes(keyCode as typeof keyCodes.home | typeof keyCodes.end)
       ) {
         VSelect.methods.onKeyDown.call(this, e)
       }
@@ -475,6 +474,6 @@ export default defineComponent({
       event.clipboardData?.setData('text/plain', currentItemText)
       event.clipboardData?.setData('text/vnd.vuetify.autocomplete.item+plain', currentItemText)
       event.preventDefault()
-    },
-  },
+    }
+  }
 })

package/src/components/VAutocomplete/__tests__/VAutocomplete.spec.ts

@@ -5,7 +5,7 @@ import VAutocomplete from '../VAutocomplete'
 import {
   mount,
   VueWrapper,
-  enableAutoUnmount,
+  enableAutoUnmount
 } from '@vue/test-utils'
 import { keyCodes } from '../../../util/helpers'
 
@@ -25,17 +25,17 @@ describe('VAutocomplete.ts', () => {
           mocks: {
             $vuetify: {
               lang: {
-                t: (val: string) => val,
+                t: (val: string) => val
               },
               theme: {
-                dark: false,
+                dark: false
               },
               icons: {
-                component: null,
-              },
-            },
-          },
-        },
+                component: null
+              }
+            }
+          }
+        }
       })
     }
   })
@@ -43,8 +43,8 @@ describe('VAutocomplete.ts', () => {
   it('should have explicit tabindex passed through when autocomplete', () => {
     const wrapper = mountFunction({
       attrs: {
-        tabindex: 10,
-      },
+        tabindex: 10
+      }
     })
 
     expect(wrapper.vm.$refs.input.tabIndex).toBe(10)
@@ -70,19 +70,19 @@ describe('VAutocomplete.ts', () => {
 
   it('should filter autocomplete search results', async () => {
     const wrapper = mountFunction({
-      props: { items: ['foo', 'bar'] },
+      props: { items: ['foo', 'bar'] }
     })
 
     // Нужно правильно установить internalSearch и сделать поиск активным
     const input = wrapper.find('input')
     const element = input.element as HTMLInputElement
-    
+
     // Дождаться полной инициализации компонента
     await wrapper.vm.$nextTick()
-    
+
     input.trigger('focus')
     await wrapper.vm.$nextTick()
-    
+
     element.value = 'foo'
     input.trigger('input')
     await wrapper.vm.$nextTick()
@@ -94,20 +94,20 @@ describe('VAutocomplete.ts', () => {
   it('should filter numeric primitives', async () => {
     const wrapper = mountFunction({
       props: {
-        items: [1, 2],
-      },
+        items: [1, 2]
+      }
     })
 
     // Нужно правильно установить internalSearch для числового значения
     const input = wrapper.find('input')
     const element = input.element as HTMLInputElement
-    
+
     // Дождаться полной инициализации компонента
     await wrapper.vm.$nextTick()
-    
+
     input.trigger('focus')
     await wrapper.vm.$nextTick()
-    
+
     element.value = '1'
     input.trigger('input')
     await wrapper.vm.$nextTick()
@@ -120,8 +120,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         items: [1, 2, 3, 4],
-        multiple: true,
-      },
+        multiple: true
+      }
     })
 
     wrapper.vm.isMenuActive = true
@@ -138,8 +138,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         items: [1, 2, 3, 4],
-        multiple: true,
-      },
+        multiple: true
+      }
     })
 
     await wrapper.vm.$nextTick()
@@ -155,7 +155,7 @@ describe('VAutocomplete.ts', () => {
 
     wrapper.setProps({
       multiple: false,
-      modelValue: 1,
+      modelValue: 1
     })
 
     await wrapper.vm.$nextTick()
@@ -186,14 +186,14 @@ describe('VAutocomplete.ts', () => {
         returnObject: true,
         itemText: 'text',
         itemValue: 'id',
-        items: [],
-      },
+        items: []
+      }
     })
 
     await wrapper.setProps({ items: [{ id: 1, text: 'A' }] })
     await wrapper.vm.$nextTick()
     expect(wrapper.vm.computedItems).toHaveLength(1)
-    
+
     await wrapper.setProps({ items: [{ id: 1, text: 'A' }] })
     await wrapper.vm.$nextTick()
     expect(wrapper.vm.computedItems).toHaveLength(1)
@@ -203,8 +203,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         cacheItems: true,
-        items: [1, 2, 3, 4],
-      },
+        items: [1, 2, 3, 4]
+      }
     })
 
     expect(wrapper.vm.computedItems).toHaveLength(4)
@@ -219,8 +219,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         eager: true,
-        items: ['foo', 'bar'],
-      },
+        items: ['foo', 'bar']
+      }
     })
 
     await wrapper.vm.$nextTick()
@@ -247,8 +247,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         items: [1, 2],
-        modelValue: 1,
-      },
+        modelValue: 1
+      }
     })
 
     const input = wrapper.find('input')
@@ -268,8 +268,8 @@ describe('VAutocomplete.ts', () => {
       props: {
         items: ['foo', 'bar', 'fizz'],
         multiple: true,
-        modelValue: ['foo', 'bar', 'fizz'],
-      },
+        modelValue: ['foo', 'bar', 'fizz']
+      }
     })
 
     await wrapper.vm.$nextTick()
@@ -367,8 +367,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       attachTo: document.body,
       props: {
-        items: ['foo', 'bar', 'fizz'],
-      },
+        items: ['foo', 'bar', 'fizz']
+      }
     })
 
     const slot = wrapper.find('.v-input__slot')
@@ -409,15 +409,15 @@ describe('VAutocomplete.ts', () => {
       props: {
         items: ['foo', 'bar', 'fizz'],
         multiple: true,
-        modelValue: ['foo'],
-      },
+        modelValue: ['foo']
+      }
     })
 
     expect(wrapper.vm.selectedItem).toBeNull()
 
     wrapper.setProps({
       multiple: false,
-      modelValue: 'foo',
+      modelValue: 'foo'
     })
 
     expect(wrapper.vm.selectedItem).toBe('foo')
@@ -428,8 +428,8 @@ describe('VAutocomplete.ts', () => {
       props: {
         chips: true,
         items: ['foo', 'bar', 'fizz'],
-        searchInput: 'foo',
-      },
+        searchInput: 'foo'
+      }
     })
 
     expect(wrapper.vm.lazySearch).toBe('foo')
@@ -445,7 +445,7 @@ describe('VAutocomplete.ts', () => {
 
   it('should select input text on focus', async () => {
     const wrapper = mountFunction({
-      attachTo: document.body,
+      attachTo: document.body
     })
     const select = jest.fn()
     wrapper.vm.$refs.input.select = select
@@ -468,13 +468,13 @@ describe('VAutocomplete.ts', () => {
 
   it('should not respond to click', async () => {
     const wrapper = mountFunction({
-      props: { disabled: true },
+      props: { disabled: true }
     })
     const slot = wrapper.find('.v-input__slot')
 
     // Проверяем, что isInteractive false для disabled
     expect(wrapper.vm.isInteractive).toBe(false)
-    
+
     slot.trigger('click')
     await wrapper.vm.$nextTick()
 
@@ -485,7 +485,7 @@ describe('VAutocomplete.ts', () => {
 
     // Проверяем, что isInteractive false для readonly
     expect(wrapper.vm.isInteractive).toBe(false)
-    
+
     slot.trigger('click')
     await wrapper.vm.$nextTick()
 
@@ -496,7 +496,7 @@ describe('VAutocomplete.ts', () => {
 
     // Проверяем, что isInteractive true для активного состояния
     expect(wrapper.vm.isInteractive).toBe(true)
-    
+
     slot.trigger('click')
     await wrapper.vm.$nextTick()
 
@@ -549,8 +549,8 @@ describe('VAutocomplete.ts', () => {
   it('should change autocomplete attribute', () => {
     const wrapper = mountFunction({
       attrs: {
-        autocomplete: 'on',
-      },
+        autocomplete: 'on'
+      }
     })
 
     expect(wrapper.vm.$attrs.autocomplete).toBe('on')
@@ -561,10 +561,10 @@ describe('VAutocomplete.ts', () => {
       props: {
         items: ['a', 'b', 'c'],
         multiple: true,
-        modelValue: ['a', 'b', 'c'],
-      },
+        modelValue: ['a', 'b', 'c']
+      }
     })
-    
+
     // Сначала проверим, что удаление работает в обычном режиме
     wrapper.vm.changeSelectedIndex(keyCodes.right)
     wrapper.vm.changeSelectedIndex(keyCodes.right)
@@ -574,7 +574,7 @@ describe('VAutocomplete.ts', () => {
 
     // Теперь установим readonly и проверим, что удаление не работает
     await wrapper.setProps({
-      readonly: true,
+      readonly: true
     })
 
     const originalLength = wrapper.vm.selectedItems.length

package/src/components/VAutocomplete/__tests__/VAutocomplete2.spec.ts

@@ -6,7 +6,7 @@ import {
   mount,
   VueWrapper,
   MountingOptions,
-  enableAutoUnmount,
+  enableAutoUnmount
 } from '@vue/test-utils'
 import { h, nextTick } from 'vue'
 
@@ -37,7 +37,7 @@ describe('VAutocomplete.ts', () => {
             }
           }
         }
-      });
+      })
     }
   })
 
@@ -46,8 +46,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         items: ['foo', 'bar'],
-        modelValue: 'foo',
-      },
+        modelValue: 'foo'
+      }
     })
 
     expect(wrapper.vm.isMenuActive).toBe(false)
@@ -66,10 +66,10 @@ describe('VAutocomplete.ts', () => {
         multiple: true,
         items: [
           { text: 'foo', value: 'foo', disabled: true },
-          { text: 'bar', value: 'bar' },
+          { text: 'bar', value: 'bar' }
         ],
-        modelValue: ['foo', 'bar'],
-      },
+        modelValue: ['foo', 'bar']
+      }
     })
 
     const chips = wrapper.find('.v-chip')
@@ -94,8 +94,8 @@ describe('VAutocomplete.ts', () => {
   it('should not filter results', async () => {
     const wrapper = mountFunction({
       props: {
-        items: ['foo', 'bar'],
-      },
+        items: ['foo', 'bar']
+      }
     })
 
     const input = wrapper.find('input')
@@ -147,7 +147,7 @@ describe('VAutocomplete.ts', () => {
       hideSelected: true,
       items: [1, 2, 3, 4],
       multiple: true,
-      modelValue: [1, 2, 3],
+      modelValue: [1, 2, 3]
     })
 
     await nextTick()
@@ -165,11 +165,11 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       attachTo: document.body,
       props: {
-        combobox: true,
+        combobox: true
       },
       slots: {
-        'no-data': () => h('span', 'show me'),
-      },
+        'no-data': () => h('span', 'show me')
+      }
     })
 
     const input = wrapper.find('input')
@@ -207,8 +207,8 @@ describe('VAutocomplete.ts', () => {
       props: {
         clearable: true,
         items: ['foo'],
-        modelValue: 'foo',
-      },
+        modelValue: 'foo'
+      }
     })
 
     const icon = wrapper.find('.v-input__append-inner .v-icon')
@@ -229,8 +229,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         menuProps: { contentClass: 'foobar', eager: true },
-        items: ['foo', 'bar'],
-      },
+        items: ['foo', 'bar']
+      }
     })
 
     const slot = wrapper.find('.v-input__slot')
@@ -255,8 +255,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         modelValue: 1,
-        items: [],
-      },
+        items: []
+      }
     })
 
     const input = wrapper.find('input')
@@ -274,8 +274,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         hideNoData: true,
-        items: [],
-      },
+        items: []
+      }
     })
 
     const input = wrapper.find('input')
@@ -286,7 +286,7 @@ describe('VAutocomplete.ts', () => {
     expect(wrapper.vm.isFocused).toBe(true)
 
     wrapper.setProps({
-      items: ['Foo', 'Bar'],
+      items: ['Foo', 'Bar']
     })
 
     await nextTick()
@@ -299,8 +299,8 @@ describe('VAutocomplete.ts', () => {
       attachTo: document.body,
       props: {
         hideNoData: true,
-        items: ['Something first'],
-      },
+        items: ['Something first']
+      }
     })
 
     const input = wrapper.find('input')
@@ -311,7 +311,7 @@ describe('VAutocomplete.ts', () => {
     expect(wrapper.vm.isFocused).toBe(true)
 
     wrapper.setProps({
-      items: ['Foo', 'Bar'],
+      items: ['Foo', 'Bar']
     })
 
     await nextTick()
@@ -326,8 +326,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         modelValue: undefined,
-        items: [0, 1, 2],
-      },
+        items: [0, 1, 2]
+      }
     })
 
     // Initial value
@@ -369,9 +369,9 @@ describe('VAutocomplete.ts', () => {
         items: [
           'foo',
           'foobar',
-          'bar',
-        ],
-      },
+          'bar'
+        ]
+      }
     })
 
     await nextTick()
@@ -400,8 +400,8 @@ describe('VAutocomplete.ts', () => {
         items: [1, 2],
         modelValue: 1,
         hideNoData: true,
-        hideSelected: true,
-      },
+        hideSelected: true
+      }
     })
 
     const input = wrapper.find('input')
@@ -421,8 +421,8 @@ describe('VAutocomplete.ts', () => {
     const wrapper = mountFunction({
       props: {
         items: ['Sandra Adams', 'Ali Connors', 'Trevor Hansen', 'Tucker Smith'],
-        multiple: true,
-      },
+        multiple: true
+      }
     })
 
     await nextTick()
@@ -448,14 +448,14 @@ describe('VAutocomplete.ts', () => {
         items: [
           {
             id: 1,
-            labels: { 1033: 'ID 1 English', 1036: 'ID 1 French' },
+            labels: { 1033: 'ID 1 English', 1036: 'ID 1 French' }
           },
           {
             id: 2,
-            labels: { 1033: 'ID 2 English', 1036: 'ID 2 French' },
-          },
-        ],
-      },
+            labels: { 1033: 'ID 2 English', 1036: 'ID 2 French' }
+          }
+        ]
+      }
     })
 
     await nextTick()
@@ -480,11 +480,11 @@ describe('VAutocomplete.ts', () => {
     const onKeyPress = jest.fn()
     const wrapper = mountFunction({
       props: {
-        items: ['aaa', 'foo', 'faa'],
+        items: ['aaa', 'foo', 'faa']
       },
       global: {
-        methods: { onKeyPress },
-      },
+        methods: { onKeyPress }
+      }
     })
 
     const input = wrapper.find('input')