@dimailn/vuetify 2.7.2-alpha40 → 2.7.2-alpha42

package/src/components/VDataTable/VDataTableHeaderMobile.ts

@@ -1,4 +1,5 @@
-import { h, VNode, VNodeChildrenArrayContents } from 'vue'
+import type { VNode, VNodeChildrenArrayContents } from '../../types/vue-internal'
+import { h } from 'vue'
 import mixins from '../../util/mixins'
 import VSelect from '../VSelect/VSelect'
 import VChip from '../VChip'
@@ -11,9 +12,9 @@ export default mixins(header).extend({
   props: {
     sortByText: {
       type: String,
-      default: '$vuetify.dataTable.sortBy',
+      default: '$vuetify.dataTable.sortBy'
     },
-    mobile: Boolean,
+    mobile: Boolean
   },
 
   emits: ['sort'],
@@ -32,8 +33,8 @@ export default mixins(header).extend({
           sortable: true,
           active: beingSorted,
           asc: beingSorted && !isDesc,
-          desc: beingSorted && isDesc,
-        },
+          desc: beingSorted && isDesc
+        }
       }, [this.genSortIcon()]))
 
       return h(VChip, {
@@ -41,8 +42,8 @@ export default mixins(header).extend({
         onClick: (e: MouseEvent) => {
           e.stopPropagation()
           this.$emit('sort', props.item.value)
-        },
-      }, children)
+        }
+      }, () => children)
     },
     genSortSelect (items: any[]) {
       return h(VSelect, {
@@ -52,11 +53,11 @@ export default mixins(header).extend({
         multiple: this.options.multiSort,
         modelValue: this.options.multiSort ? this.options.sortBy : this.options.sortBy[0],
         menuProps: { closeOnContentClick: true },
-        'onUpdate:modelValue': (v: string | string[]) => this.$emit('sort', v),
+        'onUpdate:modelValue': (v: string | string[]) => this.$emit('sort', v)
       }, {
-        selection: (props: any) => this.genSortChip(props),
+        selection: (props: any) => this.genSortChip(props)
       })
-    },
+    }
   },
 
   render (): VNode {
@@ -67,9 +68,9 @@ export default mixins(header).extend({
       children.push(h('div', {
         class: [
           'v-data-table-header-mobile__select',
-          ...wrapInArray(header.class),
+          ...wrapInArray(header.class)
         ],
-        width: header.width,
+        width: header.width
       }, [this.genSelectAll()]))
     }
 
@@ -77,7 +78,7 @@ export default mixins(header).extend({
       .filter(h => h.sortable !== false && h.value !== 'data-table-select')
       .map(h => ({
         text: h.text,
-        value: h.value,
+        value: h.value
       }))
 
     if (!this.disableSort && sortHeaders.length) {
@@ -91,7 +92,7 @@ export default mixins(header).extend({
     const tr = h('tr', [th])
 
     return h('thead', {
-      class: 'v-data-table-header v-data-table-header-mobile',
+      class: 'v-data-table-header v-data-table-header-mobile'
     }, [tr])
-  },
+  }
 })

package/src/components/VDataTable/VEditDialog.ts

@@ -14,7 +14,7 @@ import VBtn from '../VBtn'
 import VMenu from '../VMenu'
 
 // Types
-import { VNode, VNodeChildren } from 'vue'
+import type { VNode, VNodeChildren } from '../../types/vue-internal'
 import mixins from '../../util/mixins'
 
 /* @vue/component */
@@ -23,18 +23,18 @@ export default mixins(Returnable, Themeable).extend({
 
   props: {
     cancelText: {
-      default: 'Cancel',
+      default: 'Cancel'
     },
     large: Boolean,
     eager: Boolean,
     persistent: Boolean,
     saveText: {
-      default: 'Save',
+      default: 'Save'
     },
     transition: {
       type: String,
-      default: 'slide-x-reverse-transition',
-    },
+      default: 'slide-x-reverse-transition'
+    }
   },
 
   emits: ['update:return-value', 'open', 'close', 'cancel', 'save'],
@@ -53,7 +53,7 @@ export default mixins(Returnable, Themeable).extend({
       } else {
         this.$emit('close')
       }
-    },
+    }
   },
 
   methods: {
@@ -70,18 +70,18 @@ export default mixins(Returnable, Themeable).extend({
         text: true,
         color: 'primary',
         light: true,
-        onClick: fn,
+        onClick: fn
       }, () => text)
     },
     genActions (): VNode {
       return h('div', {
-        class: 'v-small-dialog__actions',
+        class: 'v-small-dialog__actions'
       }, [
         this.genButton(this.cancel, this.cancelText),
         this.genButton(() => {
           this.save(this.returnValue)
           this.$emit('save')
-        }, this.saveText),
+        }, this.saveText)
       ])
     },
     genContent (): VNode {
@@ -94,9 +94,9 @@ export default mixins(Returnable, Themeable).extend({
             this.$emit('save')
           }
         },
-        ref: 'content',
+        ref: 'content'
       }, getSlot(this, 'input'))
-    },
+    }
   },
 
   render (): VNode {
@@ -112,22 +112,22 @@ export default mixins(Returnable, Themeable).extend({
       eager: this.eager,
       light: this.light,
       dark: this.dark,
-      'onUpdate:modelValue': (val: boolean) => (this.isActive = val),
+      'onUpdate:modelValue': (val: boolean) => (this.isActive = val)
     }, {
       activator: ({ on }: { on: any }) => {
         return h('div', {
           class: 'v-small-dialog__activator',
-          ...on,
+          ...on
         }, [
           h('span', {
-            class: 'v-small-dialog__activator__content',
-          }, getSlot(this)),
+            class: 'v-small-dialog__activator__content'
+          }, getSlot(this))
         ])
       },
       default: () => [
         this.genContent(),
-        this.large ? this.genActions() : null,
-      ],
+        this.large ? this.genActions() : null
+      ]
     })
-  },
+  }
 })

package/src/components/VDataTable/VSimpleTable.ts

@@ -11,7 +11,7 @@ export default mixins(Themeable).extend({
   props: {
     dense: Boolean,
     fixedHeader: Boolean,
-    height: [Number, String],
+    height: [Number, String]
   },
 
   computed: {
@@ -22,9 +22,9 @@ export default mixins(Themeable).extend({
         'v-data-table--fixed-header': this.fixedHeader,
         'v-data-table--has-top': !!this.$slots.top,
         'v-data-table--has-bottom': !!this.$slots.bottom,
-        ...this.themeClasses,
+        ...this.themeClasses
       }
-    },
+    }
   },
 
   methods: {
@@ -32,21 +32,21 @@ export default mixins(Themeable).extend({
       return getSlot(this, 'wrapper') || h('div', {
         class: 'v-data-table__wrapper',
         style: {
-          height: convertToUnit(this.height),
-        },
+          height: convertToUnit(this.height)
+        }
       }, [
-        h('table', getSlot(this)),
+        h('table', getSlot(this))
       ])
-    },
+    }
   },
 
   render (): VNode {
     return h('div', {
-      class: ['v-data-table', this.classes],
+      class: ['v-data-table', this.classes]
     }, [
       getSlot(this, 'top'),
       this.genWrapper(),
-      getSlot(this, 'bottom'),
+      getSlot(this, 'bottom')
     ])
-  },
+  }
 })

package/src/components/VDataTable/VVirtualTable.ts

@@ -1,12 +1,11 @@
-import {h} from 'vue'
+import { h, PropType } from 'vue'
 import './VVirtualTable.sass'
 
 // Components
 import VSimpleTable from './VSimpleTable'
 
 // Types
-import { VNode, VNodeChildren } from 'vue'
-import { PropValidator } from 'vue/types/options'
+import type { VNode, VNodeChildren } from '../../types/vue-internal'
 import mixins from '../../util/mixins'
 
 // Utiltiies
@@ -15,7 +14,7 @@ import { convertToUnit, debounce, getSlot } from '../../util/helpers'
 // Types
 const baseMixins = mixins(VSimpleTable)
 
-interface options extends InstanceType<typeof baseMixins> {
+type options = {
   $refs: {
     table: HTMLElement
   }
@@ -28,27 +27,27 @@ export default baseMixins.extend({
   props: {
     chunkSize: {
       type: Number,
-      default: 25,
+      default: 25
     },
     headerHeight: {
       type: Number,
-      default: 48,
+      default: 48
     },
     items: {
       type: Array,
-      default: () => ([]),
-    } as PropValidator<any[]>,
+      default: () => ([])
+    } as unknown as PropType<any[]>,
     rowHeight: {
       type: Number,
-      default: 48,
-    },
+      default: 48
+    }
   },
 
   data: () => ({
     scrollTop: 0,
     oldChunk: 0,
     scrollDebounce: null as any,
-    invalidateCache: false,
+    invalidateCache: false
   }),
 
   computed: {
@@ -75,7 +74,7 @@ export default baseMixins.extend({
     },
     offsetBottom (): number {
       return Math.max(0, (this.itemsLength - this.stopIndex - this.startIndex) * this.rowHeight)
-    },
+    }
   },
 
   watch: {
@@ -85,7 +84,7 @@ export default baseMixins.extend({
     items () {
       this.cachedItems = null
       this.$refs.table.scrollTop = 0
-    },
+    }
   },
 
   created () {
@@ -105,7 +104,7 @@ export default baseMixins.extend({
   methods: {
     createStyleHeight (height: number) {
       return {
-        height: `${height}px`,
+        height: `${height}px`
       }
     },
     genBody () {
@@ -117,7 +116,7 @@ export default baseMixins.extend({
       return h('tbody', [
         h('tr', { style: this.createStyleHeight(this.offsetTop) }),
         this.cachedItems,
-        h('tr', { style: this.createStyleHeight(this.offsetBottom) }),
+        h('tr', { style: this.createStyleHeight(this.offsetBottom) })
       ])
     },
     genItems () {
@@ -130,34 +129,34 @@ export default baseMixins.extend({
     genTable () {
       return h('div', {
         ref: 'table',
-        class: 'v-virtual-table__table',
+        class: 'v-virtual-table__table'
       }, [
         h('table', [
           this.$slots['body.before'],
           this.genBody(),
-          this.$slots['body.after'],
-        ]),
+          this.$slots['body.after']
+        ])
       ])
     },
     genWrapper () {
       return h('div', {
         class: 'v-virtual-table__wrapper',
         style: {
-          height: convertToUnit(this.height),
-        },
+          height: convertToUnit(this.height)
+        }
       }, [
-        this.genTable(),
+        this.genTable()
       ])
-    },
+    }
   },
 
   render (): VNode {
     return h('div', {
-      class: ['v-data-table', 'v-virtual-table', this.classes],
+      class: ['v-data-table', 'v-virtual-table', this.classes]
     }, [
       getSlot(this, 'top'),
       this.genWrapper(),
-      getSlot(this, 'bottom'),
+      getSlot(this, 'bottom')
     ])
-  },
+  }
 })

package/src/components/VDataTable/__tests__/MobileRow.spec.ts

@@ -2,7 +2,7 @@ import MobileRow from '../MobileRow'
 import {
   mount,
   VueWrapper,
-  MountingOptions,
+  MountingOptions
 } from '@vue/test-utils'
 import { h } from 'vue'
 
@@ -20,13 +20,13 @@ describe('MobileRow', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
+          { text: 'Diesel', value: 'diesel' }
         ],
         item: {
           petrol: 0.68,
-          diesel: 0.65,
-        },
-      },
+          diesel: 0.65
+        }
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)
@@ -44,7 +44,7 @@ describe('MobileRow', () => {
           { value: 'boolean' },
           { value: 'object' },
           { value: 'undefined' },
-          { value: 'null' },
+          { value: 'null' }
         ],
         item: {
           string: 'string',
@@ -52,9 +52,9 @@ describe('MobileRow', () => {
           array: [1, 2],
           boolean: false,
           object: { foo: 'bar' },
-          null: null,
-        },
-      },
+          null: null
+        }
+      }
     })
 
     expect(wrapper.html()).toMatchSnapshot()
@@ -65,13 +65,13 @@ describe('MobileRow', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
-        ],
+          { text: 'Diesel', value: 'diesel' }
+        ]
       },
       slots: {
         petrol: '<p class="test">$0.68</p>',
-        diesel: '<p class="test">$0.65</p>',
-      },
+        diesel: '<p class="test">$0.65</p>'
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)
@@ -85,17 +85,17 @@ describe('MobileRow', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
+          { text: 'Diesel', value: 'diesel' }
         ],
         item: {
           petrol: 0.68,
-          diesel: 0.65,
-        },
+          diesel: 0.65
+        }
       },
       slots: {
         petrol: (props: any) => h('p', { class: `test ${props.header.value}` }, [props.value]),
-        diesel: (props: any) => h('p', { class: `test ${props.header.value}` }, [props.value]),
-      },
+        diesel: (props: any) => h('p', { class: `test ${props.header.value}` }, [props.value])
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)
@@ -109,14 +109,14 @@ describe('MobileRow', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
+          { text: 'Diesel', value: 'diesel' }
         ],
         hideDefaultHeader: true,
         item: {
           petrol: 0.68,
-          diesel: 0.65,
-        },
-      },
+          diesel: 0.65
+        }
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)

package/src/components/VDataTable/__tests__/Row.spec.ts

@@ -2,7 +2,7 @@ import Row from '../Row'
 import {
   mount,
   VueWrapper,
-  enableAutoUnmount,
+  enableAutoUnmount
 } from '@vue/test-utils'
 import { h } from 'vue'
 
@@ -22,13 +22,13 @@ describe('Table Row', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
+          { text: 'Diesel', value: 'diesel' }
         ],
         item: {
           petrol: 0.68,
-          diesel: 0.65,
-        },
-      },
+          diesel: 0.65
+        }
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)
@@ -46,7 +46,7 @@ describe('Table Row', () => {
           { text: 'Boolean', value: 'boolean' },
           { text: 'Object', value: 'object' },
           { text: 'Undefined', value: 'undefined' },
-          { text: 'Null', value: 'null' },
+          { text: 'Null', value: 'null' }
         ],
         item: {
           string: 'string',
@@ -54,9 +54,9 @@ describe('Table Row', () => {
           array: [1, 2],
           boolean: false,
           object: { foo: 'bar' },
-          null: null,
-        },
-      },
+          null: null
+        }
+      }
     })
 
     expect(wrapper.html()).toMatchSnapshot()
@@ -67,13 +67,13 @@ describe('Table Row', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol', cellClass: 'a' },
-          { text: 'Diesel', value: 'diesel', cellClass: ['b', 'c'] },
+          { text: 'Diesel', value: 'diesel', cellClass: ['b', 'c'] }
         ],
         item: {
           petrol: 0.68,
-          diesel: 0.65,
-        },
-      },
+          diesel: 0.65
+        }
+      }
     })
 
     const tds = wrapper.findAll('td')
@@ -88,13 +88,13 @@ describe('Table Row', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
-        ],
+          { text: 'Diesel', value: 'diesel' }
+        ]
       },
       slots: {
         petrol: '<p class="test">$0.68</p>',
-        diesel: '<p class="test">$0.65</p>',
-      },
+        diesel: '<p class="test">$0.65</p>'
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)
@@ -108,17 +108,17 @@ describe('Table Row', () => {
       props: {
         headers: [
           { text: 'Petrol', value: 'petrol' },
-          { text: 'Diesel', value: 'diesel' },
+          { text: 'Diesel', value: 'diesel' }
         ],
         item: {
           petrol: 0.68,
-          diesel: 0.65,
-        },
+          diesel: 0.65
+        }
       },
       slots: {
         petrol: ({ header, value }: any) => h('p', { class: `test ${header.value}` }, [value]),
-        diesel: ({ header, value }: any) => h('p', { class: `test ${header.value}` }, [value]),
-      },
+        diesel: ({ header, value }: any) => h('p', { class: `test ${header.value}` }, [value])
+      }
     })
 
     expect(wrapper.findAll('tr')).toHaveLength(1)

package/src/components/VDataTable/__tests__/RowGroup.spec.ts

@@ -2,7 +2,7 @@ import RowGroup from '../RowGroup'
 import {
   mount,
   VueWrapper,
-  enableAutoUnmount,
+  enableAutoUnmount
 } from '@vue/test-utils'
 
 describe('Table RowGroup', () => {
@@ -19,8 +19,8 @@ describe('Table RowGroup', () => {
   it('should render with "column.summary" slot', () => {
     const wrapper = mountFunction({
       slots: {
-        'column.summary': '<div></div>',
-      },
+        'column.summary': '<div></div>'
+      }
     })
 
     expect(wrapper.html()).toMatchSnapshot()
@@ -29,8 +29,8 @@ describe('Table RowGroup', () => {
   it('should render with "row.summary" slot', () => {
     const wrapper = mountFunction({
       slots: {
-        'row.summary': '<div></div>',
-      },
+        'row.summary': '<div></div>'
+      }
     })
 
     expect(wrapper.html()).toMatchSnapshot()