@dimailn/vuetify 2.7.2-alpha40 → 2.7.2-alpha42

package/src/mixins/validatable/__tests__/validatable.spec.ts

@@ -2,7 +2,7 @@ import Validatable from '../'
 import {
   mount,
   MountingOptions,
-  VueWrapper,
+  VueWrapper
 } from '@vue/test-utils'
 import { wait } from '../../../../test'
 import { defineComponent, h } from 'vue'
@@ -10,7 +10,7 @@ import { defineComponent, h } from 'vue'
 describe('validatable.ts', () => {
   const Mock = defineComponent({
     mixins: [Validatable],
-    render: () => h('div'),
+    render: () => h('div')
   })
 
   type Instance = InstanceType<typeof Mock>;
@@ -23,11 +23,11 @@ describe('validatable.ts', () => {
         global: {
           mocks: {
             $vuetify: {
-              theme: { dark: false },
-            },
-          },
+              theme: { dark: false }
+            }
+          }
         },
-        ...options,
+        ...options
       })
     }
   })
@@ -35,11 +35,11 @@ describe('validatable.ts', () => {
   it('should register/unregister with injected form is available', () => {
     const form = {
       register: jest.fn(),
-      unregister: jest.fn(),
+      unregister: jest.fn()
     }
 
     const wrapper = mountFunction({
-      global: { provide: { form } },
+      global: { provide: { form } }
     })
 
     expect(form.register).toHaveBeenCalled()
@@ -65,8 +65,8 @@ describe('validatable.ts', () => {
         jest.useFakeTimers()
         const wrapper = mountFunction({
           props: {
-            rules: [() => returns || String(returns)],
-          },
+            rules: [() => returns || String(returns)]
+          }
         })
 
         expect(wrapper.vm.valid).toBe(returns)
@@ -97,7 +97,7 @@ describe('validatable.ts', () => {
 
     // Function passing with proper value handling
     await wrapper.setProps({
-      rules: [val => (val && val.length > 3) || 'fizzbuzz'],
+      rules: [val => (val && val.length > 3) || 'fizzbuzz']
     })
     wrapper.vm.validate(false, 'foo')
 
@@ -157,8 +157,8 @@ describe('validatable.ts', () => {
 
     const wrapper = mountFunction({
       props: {
-        validateOnBlur: true,
-      },
+        validateOnBlur: true
+      }
     })
 
     // Create a mock function and replace the validate method
@@ -318,8 +318,8 @@ describe('validatable.ts', () => {
   it('should return a sliced amount based on error count', async () => {
     const wrapper = mountFunction({
       props: {
-        errorMessages: ['foobar', 'fizzbuzz'],
-      },
+        errorMessages: ['foobar', 'fizzbuzz']
+      }
     })
 
     expect(wrapper.vm.validations).toHaveLength(1)
@@ -391,8 +391,8 @@ describe('validatable.ts', () => {
   it('should reset validation and internalValue', async () => {
     const wrapper = mountFunction({
       props: {
-        modelValue: 'foobar',
-      },
+        modelValue: 'foobar'
+      }
     })
 
     wrapper.vm.reset()
@@ -416,8 +416,8 @@ describe('validatable.ts', () => {
   it('should accept null for external messages', async () => {
     const wrapper = mountFunction({
       props: {
-        errorMessages: ['Foobar'],
-      },
+        errorMessages: ['Foobar']
+      }
     })
 
     expect(wrapper.vm.externalError).toBe(true)
@@ -438,14 +438,14 @@ describe('validatable.ts', () => {
       global: {
         mocks: {
           $vuetify: {
-            theme: { dark: false },
-          },
+            theme: { dark: false }
+          }
         },
         computed: {
-          appIsDark: () => false,
-        },
+          appIsDark: () => false
+        }
       },
-      props: { dark: true },
+      props: { dark: true }
     })
 
     expect(wrapper.vm.computedColor).toBe('white')
@@ -460,13 +460,13 @@ describe('validatable.ts', () => {
       global: {
         mocks: {
           $vuetify: {
-            theme: { dark: true },
-          },
+            theme: { dark: true }
+          }
         },
         computed: {
-          appIsDark: () => true,
-        },
-      },
+          appIsDark: () => true
+        }
+      }
     })
 
     expect(wrapper2.vm.computedColor).toBe('primary')
@@ -483,8 +483,8 @@ describe('validatable.ts', () => {
       props: {
         color: 'blue',
         dark: true,
-        disabled: true,
-      },
+        disabled: true
+      }
     })
 
     expect(wrapper.vm.computedColor).toBeUndefined()
@@ -498,8 +498,8 @@ describe('validatable.ts', () => {
       props: {
         rules: [v => !!v || 'Mandatory Field'],
         validateOnBlur: true,
-        modelValue: 'Foo',
-      },
+        modelValue: 'Foo'
+      }
     })
 
     wrapper.vm.isFocused = true

package/src/mixins/validatable/index.ts

@@ -15,43 +15,43 @@ import { InputMessage, InputValidationRules } from 'vuetify/types'
 export default defineComponent({
   name: 'validatable',
 
-  extends: RegistrableInject<'form', any>('form'),
+  extends: RegistrableInject<'form', any>('form') as any,
 
-  mixins: [Colorable, Themeable],
+  mixins: [Colorable, Themeable] as any,
 
   props: {
     disabled: {
       type: Boolean,
-      default: null,
+      default: null
     },
     error: Boolean,
     errorCount: {
       type: [Number, String],
-      default: 1,
+      default: 1
     },
     errorMessages: {
       type: [String, Array] as PropType<InputMessage | null>,
-      default: () => [],
+      default: () => []
     },
     messages: {
       type: [String, Array] as PropType<InputMessage | null>,
-      default: () => [],
+      default: () => []
     },
     readonly: {
       type: Boolean,
-      default: null,
+      default: null
     },
     rules: {
       type: Array as PropType<InputValidationRules>,
-      default: () => [],
+      default: () => []
     },
     success: Boolean,
     successMessages: {
       type: [String, Array] as PropType<InputMessage | null>,
-      default: () => [],
+      default: () => []
     },
     validateOnBlur: Boolean,
-    modelValue: { required: false },
+    modelValue: { required: false }
   },
 
   data () {
@@ -63,7 +63,7 @@ export default defineComponent({
       isFocused: false,
       isResetting: false,
       lazyValue: this.modelValue ?? null,
-      valid: false,
+      valid: false
     }
   },
 
@@ -126,7 +126,7 @@ export default defineComponent({
 
         this.$emit('input', val)
         this.$emit('update:modelValue', val)
-      },
+      }
     },
     isDisabled (): boolean {
       return this.disabled ?? (
@@ -171,7 +171,7 @@ export default defineComponent({
       } else if (this.shouldValidate) {
         return this.errorBucket
       } else return []
-    },
+    }
   },
 
   watch: {
@@ -180,7 +180,7 @@ export default defineComponent({
         if (deepEqual(newVal, oldVal)) return
         this.validate()
       },
-      deep: true,
+      deep: true
     },
     internalValue () {
       // If it's the first time we're setting input,
@@ -214,7 +214,7 @@ export default defineComponent({
     },
     modelValue (val) {
       this.lazyValue = val
-    },
+    }
   },
 
   beforeMount () {
@@ -224,7 +224,7 @@ export default defineComponent({
   created () {
     const breakingProps = [
       ['value', 'modelValue'],
-      ['onInput', 'onUpdate:modelValue'],
+      ['onInput', 'onUpdate:modelValue']
     ]
 
     /* istanbul ignore next */
@@ -278,6 +278,6 @@ export default defineComponent({
       this.valid = errorBucket.length === 0
 
       return this.valid
-    },
-  },
+    }
+  }
 })

package/src/presets/default/index.ts

@@ -20,19 +20,19 @@ export const preset: VuetifyPreset = {
       xs: 600,
       sm: 960,
       md: 1280,
-      lg: 1920,
-    },
+      lg: 1920
+    }
   },
   icons: {
     // TODO: remove v3
     iconfont: 'mdi',
-    values: {},
+    values: {}
   },
   lang: {
     current: 'en',
     locales: { en },
     // Default translator exists in lang service
-    t: undefined as any,
+    t: undefined as any
   },
   rtl: false,
   theme: {
@@ -44,7 +44,7 @@ export const preset: VuetifyPreset = {
       customProperties: undefined,
       minifyTheme: undefined,
       themeCache: undefined,
-      variations: true,
+      variations: true
     },
     themes: {
       light: {
@@ -54,7 +54,7 @@ export const preset: VuetifyPreset = {
         error: '#FF5252',
         info: '#2196F3',
         success: '#4CAF50',
-        warning: '#FB8C00',
+        warning: '#FB8C00'
       },
       dark: {
         primary: '#2196F3',
@@ -63,8 +63,8 @@ export const preset: VuetifyPreset = {
         error: '#FF5252',
         info: '#2196F3',
         success: '#4CAF50',
-        warning: '#FB8C00',
-      },
-    },
-  },
+        warning: '#FB8C00'
+      }
+    }
+  }
 }

package/src/services/application/index.ts

@@ -28,7 +28,7 @@ export class Application extends Service implements IApplication {
     insetFooter: {},
     right: {},
     bottom: {},
-    footer: {},
+    footer: {}
   }
 
   register (

package/src/services/breakpoint/__tests__/breakpoint.spec.ts

@@ -15,8 +15,8 @@ describe('Breakpoint.ts', () => {
         'xsOnly',
         'smAndDown',
         'mdAndDown',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'Galaxy S5 (portrait)',
@@ -28,8 +28,8 @@ describe('Breakpoint.ts', () => {
         'xsOnly',
         'smAndDown',
         'mdAndDown',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'Galaxy S5 (landscape)',
@@ -42,8 +42,8 @@ describe('Breakpoint.ts', () => {
         'smAndDown',
         'smAndUp',
         'mdAndDown',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'iPhone 6 (portrait)',
@@ -55,8 +55,8 @@ describe('Breakpoint.ts', () => {
         'xsOnly',
         'smAndDown',
         'mdAndDown',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'iPhone 6 (landscape)',
@@ -69,8 +69,8 @@ describe('Breakpoint.ts', () => {
         'smAndDown',
         'smAndUp',
         'mdAndDown',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'iPad (portrait)',
@@ -83,8 +83,8 @@ describe('Breakpoint.ts', () => {
         'smAndDown',
         'smAndUp',
         'mdAndDown',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'iPad (landscape)',
@@ -97,8 +97,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndDown',
         'mdAndUp',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'iPad Pro (portrait)',
@@ -111,8 +111,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndDown',
         'mdAndUp',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'iPad Pro (landscape)',
@@ -125,8 +125,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndUp',
         'lgAndDown',
-        'lgAndUp',
-      ],
+        'lgAndUp'
+      ]
     },
     {
       description: 'WSXGA+ (portrait)',
@@ -139,8 +139,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndDown',
         'mdAndUp',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'WSXGA+ (landscape)',
@@ -153,8 +153,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndUp',
         'lgAndDown',
-        'lgAndUp',
-      ],
+        'lgAndUp'
+      ]
     },
     {
       description: 'FHD (portrait)',
@@ -167,8 +167,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndDown',
         'mdAndUp',
-        'lgAndDown',
-      ],
+        'lgAndDown'
+      ]
     },
     {
       description: 'FHD (landscape)',
@@ -180,8 +180,8 @@ describe('Breakpoint.ts', () => {
         'xlOnly',
         'smAndUp',
         'mdAndUp',
-        'lgAndUp',
-      ],
+        'lgAndUp'
+      ]
     },
     {
       description: 'WQHD (portrait)',
@@ -194,8 +194,8 @@ describe('Breakpoint.ts', () => {
         'smAndUp',
         'mdAndUp',
         'lgAndDown',
-        'lgAndUp',
-      ],
+        'lgAndUp'
+      ]
     },
     {
       description: 'WQHD (landscape)',
@@ -207,9 +207,9 @@ describe('Breakpoint.ts', () => {
         'xlOnly',
         'smAndUp',
         'mdAndUp',
-        'lgAndUp',
-      ],
-    },
+        'lgAndUp'
+      ]
+    }
   ]
   const allFlags = [
     'xs',
@@ -227,7 +227,7 @@ describe('Breakpoint.ts', () => {
     'lgOnly',
     'lgAndDown',
     'lgAndUp',
-    'xlOnly',
+    'xlOnly'
   ]
 
   beforeEach(() => {
@@ -275,8 +275,8 @@ describe('Breakpoint.ts', () => {
     breakpoint = new Breakpoint({
       ...preset,
       breakpoint: {
-        thresholds: { xs: 400 },
-      } as any,
+        thresholds: { xs: 400 }
+      } as any
     })
     breakpoint.init()
 

package/src/services/breakpoint/index.ts

@@ -1,6 +1,5 @@
 import { reactive } from 'vue'
 
-
 // Extensions
 import { Service } from '../service'
 
@@ -69,14 +68,14 @@ export class Breakpoint extends Service implements IBreakpoint {
     const {
       mobileBreakpoint,
       scrollBarWidth,
-      thresholds,
+      thresholds
     } = preset[Breakpoint.property]
 
     this.mobileBreakpoint = mobileBreakpoint
     this.scrollBarWidth = scrollBarWidth
     this.thresholds = thresholds
 
-    return reactive(this)
+    return reactive(this) as any
   }
 
   public init () {
@@ -153,7 +152,7 @@ export class Breakpoint extends Service implements IBreakpoint {
       sm: 1,
       md: 2,
       lg: 3,
-      xl: 4,
+      xl: 4
     } as const
 
     const current = breakpoints[this.name]

package/src/services/goto/__tests__/goto.spec.ts

@@ -23,7 +23,7 @@ describe('$vuetify.goTo', () => {
 
   beforeEach(() => {
     framework = {
-      application: new Application(),
+      application: new Application()
     }
 
     goTo.framework = framework
@@ -71,7 +71,7 @@ describe('$vuetify.goTo', () => {
 
   it('should work with Vue 3 component wrapper from Vue Test Utils', async () => {
     const TestComponent = defineComponent({
-      template: '<div>Test Component</div>',
+      template: '<div>Test Component</div>'
     })
     const wrapper = mount(TestComponent)
 
@@ -103,7 +103,7 @@ describe('$vuetify.goTo', () => {
 
   it('should use VueComponent as container', async () => {
     const TestComponent = defineComponent({
-      template: '<div style="height: 1000px; overflow: auto"><div style="height: 2000px;">Content</div></div>',
+      template: '<div style="height: 1000px; overflow: auto"><div style="height: 2000px;">Content</div></div>'
     })
     const wrapper = mount(TestComponent)
 
@@ -120,7 +120,7 @@ describe('goto utilities', () => {
 
   beforeEach(() => {
     utilsFramework = {
-      application: new Application(),
+      application: new Application()
     }
     goTo.framework = utilsFramework
   })
@@ -143,7 +143,7 @@ describe('goto utilities', () => {
 
     it('should return offset for Vue 3 component', () => {
       const TestComponent = defineComponent({
-        template: '<div>Test</div>',
+        template: '<div>Test</div>'
       })
       const wrapper = mount(TestComponent)
 
@@ -183,7 +183,7 @@ describe('goto utilities', () => {
 
     it('should return HTMLElement for Vue 3 component container', () => {
       const TestComponent = defineComponent({
-        template: '<div>Test Container</div>',
+        template: '<div>Test Container</div>'
       })
       const wrapper = mount(TestComponent)
 

package/src/services/goto/index.ts

@@ -5,7 +5,7 @@ import { Service } from '../service'
 import * as easingPatterns from './easing-patterns'
 import {
   getContainer,
-  getOffset,
+  getOffset
 } from './util'
 
 // Types
@@ -23,7 +23,7 @@ export default function goTo (
     offset: 0,
     easing: 'easeInOutCubic',
     appOffset: true,
-    ..._settings,
+    ..._settings
   }
   const container = getContainer(settings.container)
 

package/src/services/icons/index.ts

@@ -26,7 +26,7 @@ export class Icons extends Service implements IIcons {
     const {
       iconfont,
       values,
-      component,
+      component
     } = preset[Icons.property]
 
     this.component = component

package/src/services/icons/presets/fa-svg.ts

@@ -4,7 +4,7 @@ import icons from './fa'
 
 export function convertToComponentDeclarations (
   component: Component | string,
-  iconSet: VuetifyIcons,
+  iconSet: VuetifyIcons
 ) {
   const result: Partial<VuetifyIcons> = {}
 
@@ -12,8 +12,8 @@ export function convertToComponentDeclarations (
     result[key] = {
       component,
       props: {
-        icon: (iconSet[key] as string).split(' fa-'),
-      },
+        icon: (iconSet[key] as string).split(' fa-')
+      }
     }
   }
 

package/src/services/icons/presets/fa.ts

@@ -33,7 +33,7 @@ const icons: VuetifyIcons = {
   unfold: 'fas fa-arrows-alt-v',
   file: 'fas fa-paperclip',
   plus: 'fas fa-plus',
-  minus: 'fas fa-minus',
+  minus: 'fas fa-minus'
 }
 
 export default icons

package/src/services/icons/presets/fa4.ts

@@ -33,7 +33,7 @@ const icons: VuetifyIcons = {
   unfold: 'fa fa-angle-double-down',
   file: 'fa fa-paperclip',
   plus: 'fa fa-plus',
-  minus: 'fa fa-minus',
+  minus: 'fa fa-minus'
 }
 
 export default icons

package/src/services/icons/presets/index.ts

@@ -11,5 +11,5 @@ export default Object.freeze({
   mdi,
   fa,
   fa4,
-  faSvg,
+  faSvg
 })