@dimailn/vuetify 2.7.2-alpha25 → 2.7.2-alpha27

package/src/components/VTimePicker/__tests__/__snapshots__/VTimePicker.spec.ts.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`VTimePicker.ts should accept a date object for a value 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -34,7 +34,9 @@ exports[`VTimePicker.ts should accept a date object for a value 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(0deg) scaleY(1);"
@@ -128,11 +130,15 @@ exports[`VTimePicker.ts should accept a date object for a value 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should accept a date object for a value. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -171,7 +177,9 @@ exports[`VTimePicker.ts should accept a date object for a value. with useSeconds
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(0deg) scaleY(1);"
@@ -265,11 +273,15 @@ exports[`VTimePicker.ts should accept a date object for a value. with useSeconds
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should accept a value 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -302,7 +314,9 @@ exports[`VTimePicker.ts should accept a value 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -396,11 +410,15 @@ exports[`VTimePicker.ts should accept a value 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should accept a value. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -439,7 +457,9 @@ exports[`VTimePicker.ts should accept a value. with useSeconds 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -533,11 +553,15 @@ exports[`VTimePicker.ts should accept a value. with useSeconds 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should change am/pm when updated from model 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -570,7 +594,9 @@ exports[`VTimePicker.ts should change am/pm when updated from model 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -664,11 +690,15 @@ exports[`VTimePicker.ts should change am/pm when updated from model 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should change am/pm when updated from model. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -707,7 +737,9 @@ exports[`VTimePicker.ts should change am/pm when updated from model. with useSec
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -801,11 +833,15 @@ exports[`VTimePicker.ts should change am/pm when updated from model. with useSec
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render colored time picker 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title orange darken-1">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -838,7 +874,9 @@ exports[`VTimePicker.ts should render colored time picker 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand orange darken-1"
                style="transform: rotate(270deg) scaleY(1);"
@@ -932,11 +970,15 @@ exports[`VTimePicker.ts should render colored time picker 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render colored time picker, header 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title orange darken-1">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -969,7 +1011,9 @@ exports[`VTimePicker.ts should render colored time picker, header 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand primary"
                style="transform: rotate(270deg) scaleY(1);"
@@ -1063,11 +1107,15 @@ exports[`VTimePicker.ts should render colored time picker, header 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render colored time picker, header. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title orange darken-1">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1106,7 +1154,9 @@ exports[`VTimePicker.ts should render colored time picker, header. with useSecon
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand primary"
                style="transform: rotate(270deg) scaleY(1);"
@@ -1200,11 +1250,15 @@ exports[`VTimePicker.ts should render colored time picker, header. with useSecon
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render colored time picker. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title orange darken-1">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1243,7 +1297,9 @@ exports[`VTimePicker.ts should render colored time picker. with useSeconds 1`] =
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand orange darken-1"
                style="transform: rotate(270deg) scaleY(1);"
@@ -1337,11 +1393,15 @@ exports[`VTimePicker.ts should render colored time picker. with useSeconds 1`] =
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render component with elevation 1`] = `
-<div class="v-picker v-card v-picker--time theme--light elevation-15">
+<div class="v-picker v-card theme--light elevation-15 v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1374,7 +1434,9 @@ exports[`VTimePicker.ts should render component with elevation 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -1468,11 +1530,15 @@ exports[`VTimePicker.ts should render component with elevation 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render component with elevation. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light elevation-15">
+<div class="v-picker v-card theme--light elevation-15 v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1511,7 +1577,9 @@ exports[`VTimePicker.ts should render component with elevation. with useSeconds
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -1605,11 +1673,15 @@ exports[`VTimePicker.ts should render component with elevation. with useSeconds
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render dark time picker 1`] = `
-<div class="v-picker v-card v-picker--time theme--dark">
+<div class="v-picker v-card theme--dark v-picker--time">
   <div class="v-picker__title">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1642,7 +1714,9 @@ exports[`VTimePicker.ts should render dark time picker 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock v-time-picker-clock--indeterminate theme--dark">
+      <div class="v-time-picker-clock v-time-picker-clock--indeterminate theme--dark"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand"
                style="transform: rotate(0deg) scaleY(1);"
@@ -1736,11 +1810,15 @@ exports[`VTimePicker.ts should render dark time picker 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render dark time picker. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--dark">
+<div class="v-picker v-card theme--dark v-picker--time">
   <div class="v-picker__title">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1779,7 +1857,9 @@ exports[`VTimePicker.ts should render dark time picker. with useSeconds 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock v-time-picker-clock--indeterminate theme--dark">
+      <div class="v-time-picker-clock v-time-picker-clock--indeterminate theme--dark"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand"
                style="transform: rotate(0deg) scaleY(1);"
@@ -1873,11 +1953,15 @@ exports[`VTimePicker.ts should render dark time picker. with useSeconds 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render disabled component 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -1910,7 +1994,9 @@ exports[`VTimePicker.ts should render disabled component 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -2004,11 +2090,15 @@ exports[`VTimePicker.ts should render disabled component 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render disabled component. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time theme--light">
+<div class="v-picker v-card theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -2047,7 +2137,9 @@ exports[`VTimePicker.ts should render disabled component. with useSeconds 1`] =
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -2141,11 +2233,15 @@ exports[`VTimePicker.ts should render disabled component. with useSeconds 1`] =
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render flat component 1`] = `
-<div class="v-picker v-card v-picker--time v-picker--flat theme--light">
+<div class="v-picker v-card v-picker--flat theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -2178,7 +2274,9 @@ exports[`VTimePicker.ts should render flat component 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -2272,11 +2370,15 @@ exports[`VTimePicker.ts should render flat component 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render flat component. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time v-picker--flat theme--light">
+<div class="v-picker v-card v-picker--flat theme--light v-picker--time">
   <div class="v-picker__title primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -2315,7 +2417,9 @@ exports[`VTimePicker.ts should render flat component. with useSeconds 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="270"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -2409,11 +2513,15 @@ exports[`VTimePicker.ts should render flat component. with useSeconds 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render landscape component 1`] = `
-<div class="v-picker v-card v-picker--time v-picker--landscape theme--light">
+<div class="v-picker v-card v-picker--landscape theme--light v-picker--time">
   <div class="v-picker__title v-picker__title--landscape primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -2446,7 +2554,9 @@ exports[`VTimePicker.ts should render landscape component 1`] = `
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="210"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -2540,11 +2650,15 @@ exports[`VTimePicker.ts should render landscape component 1`] = `
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;
 
 exports[`VTimePicker.ts should render landscape component. with useSeconds 1`] = `
-<div class="v-picker v-card v-picker--time v-picker--landscape theme--light">
+<div class="v-picker v-card v-picker--landscape theme--light v-picker--time">
   <div class="v-picker__title v-picker__title--landscape primary">
     <div class="v-time-picker-title">
       <div class="v-time-picker-title__time">
@@ -2583,7 +2697,9 @@ exports[`VTimePicker.ts should render landscape component. with useSeconds 1`] =
           PM
         </div>
       </div>
-      <div class="v-time-picker-clock theme--light">
+      <div class="v-time-picker-clock theme--light"
+           size="210"
+      >
         <div class="v-time-picker-clock__inner">
           <div class="v-time-picker-clock__hand accent"
                style="transform: rotate(270deg) scaleY(1);"
@@ -2677,5 +2793,9 @@ exports[`VTimePicker.ts should render landscape component. with useSeconds 1`] =
       </div>
     </div>
   </div>
+  <div class="v-picker__actions v-card__actions">
+    <template>
+    </template>
+  </div>
 </div>
 `;

package/src/components/VToolbar/VToolbar.ts

@@ -126,7 +126,7 @@ export default defineComponent({
 
       const image = this.$slots.img
         ? this.$slots.img({ props })
-        : h(VImg, { props })
+        : h(VImg, props)
 
       return h('div', {
         class: 'v-toolbar__image',

package/src/components/VTooltip/VTooltip.ts

@@ -193,20 +193,20 @@ export default mixins(Colorable, Delayable, Dependent, Menuable).extend({
 
       return h(Transition, {
         name: this.computedTransition,
-      }, [content])
+      }, () => [content])
     },
     genContent () {
       return withDirectives(
         h(
           'div',
           this.setBackgroundColor(this.color, {
+            ...this.getScopeIdAttrs(),
             class: ['v-tooltip__content', {
               [this.contentClass]: true,
               menuable__content__active: this.isActive,
               'v-tooltip__content--fixed': this.activatorFixed,
             }],
             style: this.styles,
-            attrs: this.getScopeIdAttrs(),
             ref: 'content',
           }),
           this.getContentSlot()

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/VVirtualScroll/VVirtualScroll.ts

@@ -20,7 +20,6 @@ import { VNode, defineComponent } from 'vue'
 export default defineComponent({
   name: 'v-virtual-scroll',
 
-  directives: { Scroll },
 
   extends: Measurable,
 

package/src/components/VWindow/VWindow.ts

@@ -21,7 +21,6 @@ export default defineComponent({
   name: 'v-window',
   extends: BaseItemGroup,
 
-  directives: { Touch },
 
   provide (): object {
     return {

package/src/components/VWindow/VWindowItem.ts

@@ -29,9 +29,8 @@ interface options extends ExtractVue<typeof baseMixins> {
 export default baseMixins.extend({
   name: 'v-window-item',
 
-  directives: {
-    Touch,
-  },
+  emits: ['change'],
+
 
   props: {
     disabled: Boolean,

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()
       )
     },
   }