@dimailn/vuetify 2.7.2-alpha25 → 2.7.2-alpha26

package/src/components/VDataTable/VDataTable.ts

@@ -404,7 +404,7 @@ export default mixins(
           icon: true,
           small: true,
           onClick: toggleFn
-        }, [h(VIcon, [isOpen ? '$minus' : '$plus'])])
+        }, () => [h(VIcon, {}, () => [isOpen ? '$minus' : '$plus'])])
 
         const remove = h(VBtn, {
           class: 'ma-0',
@@ -415,7 +415,7 @@ export default mixins(
           on: {
             click: removeFn,
           },
-        }, [h(VIcon, ['$close'])])
+        }, () => [h(VIcon, {}, () => ['$close'])])
 
         const column = h('td', {
           class: 'text-start',
@@ -528,7 +528,7 @@ export default mixins(
             e.stopPropagation()
             data.expand(!data.isExpanded)
           }
-        }, [this.expandIcon])
+        }, () => [this.expandIcon])
       }
 
       return h(this.isMobile ? MobileRow : Row, {
@@ -634,11 +634,11 @@ export default mixins(
           this.genBody(props),
           this.genFoot(props),
         ],
-        top: getSlot(this, 'top', {
+        top: () => getSlot(this, 'top', {
           ...props,
           isMobile: this.isMobile,
         }, true),
-        bottom: this.genFooters(props)
+        bottom: () => this.genFooters(props)
       })
     }
   },

package/src/components/VDataTable/VDataTableHeader.ts

@@ -33,12 +33,10 @@ export default defineComponent({
     }
 
     // dedupeModelListeners(data)
-    const children = rebuildSlots(this.$slots, h)
-
     if (props.mobile) {
-      return h(VDataTableHeaderMobile, data, children)
+      return h(VDataTableHeaderMobile, data, this.$slots)
     } else {
-      return h(VDataTableHeaderDesktop, data, children)
+      return h(VDataTableHeaderDesktop, data, this.$slots)
     }
   },
 })

package/src/components/VDataTable/VEditDialog.ts

@@ -69,7 +69,7 @@ export default mixins(Returnable, Themeable).extend({
         color: 'primary',
         light: true,
         onClick: fn,
-      }, text)
+      }, () => text)
     },
     genActions (): VNode {
       return h('div', {
@@ -123,7 +123,7 @@ export default mixins(Returnable, Themeable).extend({
           ])
         },
       },
-    }, [
+    }, () => [
       this.genContent(),
       this.large ? this.genActions() : null,
     ])

package/src/components/VDataTable/mixins/header.ts

@@ -72,7 +72,7 @@ export default mixins<HeaderOptions>().extend({
       return h(VIcon, {
         class: 'v-data-table-header__icon',
         size: 18,
-      }, [this.sortIcon])
+      }, () => [this.sortIcon])
     },
   },
 })

package/src/components/VDatePicker/VDatePickerHeader.ts

@@ -90,8 +90,8 @@ export default mixins(
           e.stopPropagation()
           this.$emit('input', this.calculateChange(change))
         }
-      }, [
-        h(VIcon, ((change < 0) === !this.$vuetify.rtl) ? this.prevIcon : this.nextIcon),
+      }, () => [
+        h(VIcon, {}, () => (((change < 0) === !this.$vuetify.rtl) ? this.prevIcon : this.nextIcon)),
       ])
     },
     calculateChange (sign: number) {
@@ -114,7 +114,7 @@ export default mixins(
 
       const transition = h(Transition, {
         name: (this.isReversing === !this.$vuetify.rtl) ? 'tab-reverse-transition' : 'tab-transition',
-      }, [header])
+      }, () => [header])
 
       return h('div', {
         class: ['v-date-picker-header__value', {

package/src/components/VDatePicker/VDatePickerTitle.ts

@@ -59,7 +59,7 @@ export default mixins(
     genYearIcon (): VNode {
       return h(VIcon, {
         dark: true,
-      }, this.yearIcon)
+      }, () => this.yearIcon)
     },
     getYearBtn (): VNode {
       return this.genPickerButton('selectingYear', true, [
@@ -70,7 +70,7 @@ export default mixins(
     genTitleText (): VNode {
       return h(Transition, {
         name: this.computedTransition,
-      }, [
+      }, () => [
         h('div', {
           innerHTML: this.date || ' ',
           key: this.value

package/src/components/VDatePicker/mixins/date-picker-table.ts

@@ -213,7 +213,7 @@ export default mixins(
     genTable (staticClass: string, children: VNodeChildren, calculateTableDate: CalculateTableDateFunction) {
       const transition = h(Transition, {
         name: this.computedTransition,
-      }, [h('table', { key: this.tableDate }, children)])
+      }, () => [h('table', { key: this.tableDate }, children)])
 
       const touchDirective = [
         Touch,

package/src/components/VDialog/VDialog.ts

@@ -244,7 +244,7 @@ export default baseMixins.extend({
           root: true,
           light: this.light,
           dark: this.dark
-        }, [
+        }, () => [
           h('div', {
             class: this.contentClasses,
             role: 'dialog',
@@ -266,7 +266,7 @@ export default baseMixins.extend({
         name: this.transition,
         origin: this.origin,
         appear: true
-      }, [content])
+      }, () => [content])
     },
     genInnerContent () {
       const directives = [

package/src/components/VExpansionPanel/VExpansionPanelContent.ts

@@ -60,7 +60,7 @@ export default baseMixins.extend({
   },
 
   render (): VNode {
-    return h(VExpandTransition, this.showLazyContent(() => [
+    return h(VExpandTransition, {}, () => this.showLazyContent(() => [
       withDirectives(h('div', this.setBackgroundColor(this.color, {
         class: 'v-expansion-panel-content'
       }), [

package/src/components/VExpansionPanel/VExpansionPanelHeader.ts

@@ -83,9 +83,9 @@ export default baseMixins.extend({
     },
     genIcon () {
       const icon = getSlot(this, 'actions', { open: this.isActive }) ||
-        [h(VIcon, this.expandIcon)]
+        [h(VIcon, {}, () => this.expandIcon)]
 
-      return h(VFadeTransition, [
+      return h(VFadeTransition, {}, () => [
         withDirectives(h('div', {
           class: ['v-expansion-panel-header__icon', {
             'v-expansion-panel-header__icon--disable-rotate': this.disableIconRotate,

package/src/components/VImg/VImg.ts

@@ -131,7 +131,7 @@ export default mixins(
       return h(Transition, {
         name: this.transition,
         mode: 'in-out',
-      }, [image])
+      }, () => [image])
     },
   },
 
@@ -265,7 +265,7 @@ export default mixins(
         return h(Transition, {
           appear: true,
           name: this.transition,
-        }, placeholder)
+        }, () => placeholder)
       }
     },
   },

package/src/components/VInput/VInput.ts

@@ -228,7 +228,7 @@ export default baseMixins.extend({
         h(
           VIcon,
           data,
-          icon
+          () => icon
         ),
       ])
     },
@@ -252,7 +252,7 @@ export default baseMixins.extend({
         focused: this.hasState,
         for: this.computedId,
         light: this.light,
-      }, getSlot(this, 'label') || this.label)
+      }, () => getSlot(this, 'label') || this.label)
     },
     genMessages () {
       if (!this.showDetails) return null

package/src/components/VList/VListGroup.ts

@@ -122,7 +122,7 @@ export default baseMixins.extend({
       this.$nextTick(() => (this.isActive = !this.isActive))
     },
     genIcon (icon: string | false): VNode {
-      return h(VIcon, icon)
+      return h(VIcon, {}, () => icon)
     },
     genAppendIcon (): VNode | null {
       const icon = !this.subGroup ? this.appendIcon : false
@@ -132,7 +132,7 @@ export default baseMixins.extend({
 
       return h(VListItemIcon, {
         class: 'v-list-group__header__append-icon',
-      }, [
+      }, () => [
         slot || this.genIcon(icon),
       ])
     },
@@ -147,7 +147,7 @@ export default baseMixins.extend({
         inputValue: this.isActive,
         ...this.listeners$,
         onClick: this.click
-      }, [
+      }, () => [
         this.genPrependIcon(),
         getSlot(this, 'activator'),
         this.genAppendIcon(),
@@ -178,7 +178,7 @@ export default baseMixins.extend({
 
       return h(VListItemIcon, {
         class: 'v-list-group__header__prepend-icon',
-      }, [
+      }, () => [
         slot || this.genIcon(icon),
       ])
     },
@@ -211,7 +211,7 @@ export default baseMixins.extend({
       class: ['v-list-group', this.classes]
     }), [
       this.genHeader(),
-      h(VExpandTransition, this.genItems()),
+      h(VExpandTransition, {}, () => this.genItems()),
     ])
   },
 })

package/src/components/VList/VListItem.ts

@@ -192,9 +192,12 @@ export default baseMixins.extend({
       toggle: this.toggle,
     })
 
-    return withDirectives(
-      h(tag, this.isActive ? this.setTextColor(this.color, data) : data, children),
-      directives
-    )
+    const nodeData = this.isActive ? this.setTextColor(this.color, data) : data
+
+    const node = typeof tag === 'string'
+      ? h(tag, nodeData, children)
+      : h(tag, nodeData, () => children)
+
+    return withDirectives(node, directives)
   },
 })

package/src/components/VMessages/VMessages.ts

@@ -30,7 +30,7 @@ export default mixins(Colorable, Themeable).extend({
         class: 'v-messages__wrapper',
         name: 'message-transition',
         tag: 'div',
-      }, this.value.map(this.genMessage))
+      }, () => this.value.map(this.genMessage))
     },
     genMessage (message: string, key: number) {
       return h('div', {

package/src/components/VOverflowBtn/VOverflowBtn.ts

@@ -99,7 +99,7 @@ export default defineComponent({
             itemObj.callback(e)
           },
         },
-      }, [itemObj.text])
+      }, () => [itemObj.text])
     },
     updateValue (val: boolean) {
       if (val) {

package/src/components/VPagination/VPagination.ts

@@ -197,7 +197,7 @@ export default mixins(
             'aria-label': label,
             ...(disabled ? {} : { onClick: fn }),
           }),
-          [h(VIcon, { color: this.navigationTextColor }, [icon])]
+          [h(VIcon, { color: this.navigationTextColor }, () => [icon])]
         ),
       ])
     },

package/src/components/VPicker/VPicker.ts

@@ -55,7 +55,7 @@ export default mixins(
     genBodyTransition () {
       return h(Transition, {
         name: this.transition,
-      }, getSlot(this))
+      }, () => getSlot(this))
     },
     genBody () {
       return h('div', {

package/src/components/VRadioGroup/VRadio.ts

@@ -139,7 +139,7 @@ export default baseMixins.extend({
         for: this.computedId,
         color: this.validationState,
         focused: this.hasState,
-      }, getSlot(this, 'label') || this.label)
+      }, () => getSlot(this, 'label') || this.label)
     },
     genRadio () {
       const { title, ...radioAttrs } = this.attrs$
@@ -149,7 +149,7 @@ export default baseMixins.extend({
       }, [
         h(VIcon, this.setTextColor(this.validationState, {
           dense: this.radioGroup && this.radioGroup.dense,
-        }), this.computedIcon),
+        }), () => this.computedIcon),
         this.genInput({
           name: this.computedName,
           value: this.value,

package/src/components/VSelect/VSelect.ts

@@ -379,7 +379,7 @@ export default baseMixins.extend({
         },
         'onClick:close': () => this.onChipInput(item),
         key: JSON.stringify(this.getValue(item)),
-      }, this.getText(item))
+      }, () => this.getText(item))
     },
     genCommaSelection (item: object, index: number, last: boolean) {
       const color = index === this.selectedIndex && this.computedColor
@@ -535,7 +535,7 @@ export default baseMixins.extend({
         },
         onScroll: this.onScroll,
         ref: 'menu',
-      }, [this.genList()])
+      }, () => [this.genList()])
     },
     genSelections (): VNode {
       let length = this.selectedItems.length

package/src/components/VSelect/VSelectList.ts

@@ -87,7 +87,7 @@ export default mixins(Colorable, Themeable).extend({
 
   methods: {
     genAction (item: object, inputValue: any): VNode {
-      return h(VListItemAction, [
+      return h(VListItemAction, {}, () => [
         h(VSimpleCheckbox, {
           color: this.color,
           modelValue: inputValue,
@@ -186,8 +186,8 @@ export default mixins(Colorable, Themeable).extend({
         : scopedSlot
     },
     genTileContent (item: any, index = 0): VNode {
-      return h(VListItemContent, [
-        h(VListItemTitle, [
+      return h(VListItemContent, {}, () => [
+        h(VListItemTitle, {}, () => [
           this.genFilteredText(this.getText(item)),
         ]),
       ])

package/src/components/VSlideGroup/VSlideGroup.ts

@@ -323,9 +323,9 @@ export const BaseSlideGroup = mixins<options &
         !hasAffix
       ) return null
 
-      return h(VIcon, {
+      return h(VIcon, () => ({
         disabled: !hasAffix,
-      }, (this as any)[`${icon}Icon`])
+      }, (this as any)[`${icon}Icon`]))
     },
     // Always generate prev for scrollable hint
     genPrev (): VNode | null {
@@ -342,7 +342,7 @@ export const BaseSlideGroup = mixins<options &
       }, [slot])
     },
     genTransition (location: 'prev' | 'next') {
-      return h(VFadeTransition, [this.genIcon(location)])
+      return h(VFadeTransition, () => [this.genIcon(location)])
     },
     genWrapper (): VNode {
       return withDirectives(h('div', {

package/src/components/VSlider/VSlider.ts

@@ -414,7 +414,7 @@ export default mixins<options &
 
       return h(VScaleTransition, {
         origin: 'bottom center',
-      }, [
+      }, () => [
         withDirectives(h('div', {
           class: 'v-slider__thumb-label-container',
         }, [

package/src/components/VStepper/VStepperContent.ts

@@ -168,6 +168,6 @@ export default baseMixins.extend({
 
     return h(this.computedTransition, {
       ...this.$listeners,
-    }, [content])
+    }, () => [content])
   },
 })

package/src/components/VSwitch/VSwitch.ts

@@ -110,7 +110,7 @@ export default defineComponent({
       ])
     },
     genProgress (): VNode {
-      return h(VFabTransition, {}, [
+      return h(VFabTransition, {}, () => [
         this.loading === false
           ? null
           : getSlot(this, 'progress') || h(VProgressCircular, {

package/src/components/VTabs/VTabs.ts

@@ -215,7 +215,7 @@ export default baseMixins.extend({
       this.setTextColor(this.computedColor, data)
       this.setBackgroundColor(this.backgroundColor, data)
 
-      return h(VTabsBar, data, [
+      return h(VTabsBar, data, () => [
         this.genSlider(slider),
         items,
       ])
@@ -234,7 +234,7 @@ export default baseMixins.extend({
         'onUpdate:modelValue': (val: any) => {
           this.internalValue = val
         }
-      }, item)
+      }, () => item)
     },
     genSlider (slider: VNode | null) {
       if (this.hideSlider) return null

package/src/components/VTextField/VTextField.ts

@@ -368,7 +368,7 @@ export default baseMixins.extend({
         value: this.labelValue
       }
 
-      return h(VLabel, data, getSlot(this, 'label') || this.label)
+      return h(VLabel, data, () => getSlot(this, 'label') || this.label)
     },
     genLegend () {
       const width = !this.singleLine && (this.labelValue || this.isDirty) ? this.labelWidth : 0

package/src/components/VTooltip/VTooltip.ts

@@ -193,7 +193,7 @@ export default mixins(Colorable, Delayable, Dependent, Menuable).extend({
 
       return h(Transition, {
         name: this.computedTransition,
-      }, [content])
+      }, () => [content])
     },
     genContent () {
       return withDirectives(

package/src/components/VTreeview/VTreeviewNode.ts

@@ -234,7 +234,7 @@ const VTreeviewNode = baseMixins.extend({
 
           this.checkChildren().then(() => this.open())
         }
-      }, [this.isLoading ? this.loadingIcon : this.expandIcon])
+      }, () => [this.isLoading ? this.loadingIcon : this.expandIcon])
     },
     genCheckbox () {
       return h(VIcon, {
@@ -257,7 +257,7 @@ const VTreeviewNode = baseMixins.extend({
             })
           })
         },
-      }, [this.computedIcon])
+      }, () => [this.computedIcon])
     },
     genLevel (level: number) {
       return createRange(level).map(() => h('div', {
@@ -331,7 +331,7 @@ const VTreeviewNode = baseMixins.extend({
       }, children)
     },
     genTransition () {
-      return h(VExpandTransition, [this.genChildrenWrapper()])
+      return h(VExpandTransition, {}, () => [this.genChildrenWrapper()])
     },
   },
 

package/src/components/transitions/createTransition.ts

@@ -88,7 +88,7 @@ export function createSimpleTransition (
           el.style.setProperty('display', 'none', 'important')
         })
       }
-      return h(tag, mergeData(this.$attrs, data), this.$slots.default())
+      return h(tag, mergeData(this.$attrs, data), () => this.$slots.default())
     },
   }
 }
@@ -117,7 +117,7 @@ export function createJavascriptTransition (
           name,
           ...functions,
         }),
-        this.$slots.default()
+        () => this.$slots.default()
       )
     },
   }

package/src/mixins/picker/index.ts

@@ -47,17 +47,17 @@ export default mixins(
       }) : getSlot(this)
     },
     genPicker (staticClass: string) {
-      const children = {}
+      const children: Record<string, any> = {}
 
       if (!this.noTitle) {
         const title = this.genPickerTitle()
-        title && (children.title = title)
+        title && (children.title = () => [title])
       }
 
       const body = this.genPickerBody()
-      body && (children.default = body)
+      body && (children.default = () => [body])
 
-      children.actions = (h('template', {}, [this.genPickerActionsSlot()]))
+      children.actions = () => [this.genPickerActionsSlot()]
 
       return h(VPicker, {
         class: staticClass,