@dimailn/vuetify 2.7.2-alpha40 → 2.7.2-alpha42

package/src/components/VWindow/__tests__/VWindowItem.spec.ts

@@ -1,9 +1,9 @@
 // Libraries
-import { h, nextTick } from "vue";
+import { h, nextTick } from 'vue'
 
 // Components
-import VWindow from "../VWindow";
-import VWindowItem from "../VWindowItem";
+import VWindow from '../VWindow'
+import VWindowItem from '../VWindowItem'
 
 // Utilities
 import {
@@ -11,17 +11,17 @@ import {
   VueWrapper,
   MountingOptions,
   enableAutoUnmount
-} from "@vue/test-utils";
-import { waitAnimationFrame } from "../../../../test";
+} from '@vue/test-utils'
+import { waitAnimationFrame } from '../../../../test'
 
-describe("VWindowItem.ts", () => {
+describe('VWindowItem.ts', () => {
   type Instance = InstanceType<typeof VWindowItem>;
   let mountFunction: (
     options?: MountingOptions<Instance>
-  ) => VueWrapper<Instance>;
+  ) => VueWrapper<Instance>
 
   // Включаем автоматическое размонтирование после каждого теста
-  enableAutoUnmount(afterEach);
+  enableAutoUnmount(afterEach)
 
   beforeEach(() => {
     mountFunction = (options = {}) => {
@@ -32,12 +32,12 @@ describe("VWindowItem.ts", () => {
           }
         },
         ...options
-      });
-    };
-  });
+      })
+    }
+  })
 
   // eslint-disable-next-line max-statements
-  it("should transition content", async () => {
+  it('should transition content', async () => {
     const wrapper = mount(VWindow, {
       slots: {
         default: () => [h(VWindowItem)]
@@ -52,53 +52,53 @@ describe("VWindowItem.ts", () => {
           }
         }
       }
-    });
+    })
 
-    await waitAnimationFrame();
+    await waitAnimationFrame()
 
-    const item = wrapper.findComponent(VWindowItem);
-    const windowVm = wrapper.vm as any;
-    const itemVm = item.vm as any;
+    const item = wrapper.findComponent(VWindowItem)
+    const windowVm = wrapper.vm as any
+    const itemVm = item.vm as any
 
     // Before enter
-    expect(windowVm.isActive).toBeFalsy();
-    expect(windowVm.transitionHeight).toBeUndefined();
-    itemVm.onBeforeTransition();
-    expect(windowVm.isActive).toBeTruthy();
-    expect(windowVm.transitionHeight).toBe("0px");
+    expect(windowVm.isActive).toBeFalsy()
+    expect(windowVm.transitionHeight).toBeUndefined()
+    itemVm.onBeforeTransition()
+    expect(windowVm.isActive).toBeTruthy()
+    expect(windowVm.transitionHeight).toBe('0px')
 
     // Enter
-    const el = { clientHeight: 50 };
-    itemVm.onEnter(el);
-    await nextTick();
-    expect(windowVm.transitionHeight).toBe("50px");
+    const el = { clientHeight: 50 }
+    itemVm.onEnter(el)
+    await nextTick()
+    expect(windowVm.transitionHeight).toBe('50px')
 
     // After enter
-    itemVm.onAfterTransition();
-    expect(windowVm.transitionHeight).toBeUndefined();
-    expect(windowVm.isActive).toBeFalsy();
+    itemVm.onAfterTransition()
+    expect(windowVm.transitionHeight).toBeUndefined()
+    expect(windowVm.isActive).toBeFalsy()
 
     // Canceling
-    itemVm.onBeforeTransition();
-    itemVm.onEnter(el);
-    itemVm.onTransitionCancelled();
+    itemVm.onBeforeTransition()
+    itemVm.onEnter(el)
+    itemVm.onTransitionCancelled()
 
-    expect(itemVm.inTransition).toBeFalsy();
-    expect(windowVm.isActive).toBeFalsy();
+    expect(itemVm.inTransition).toBeFalsy()
+    expect(windowVm.isActive).toBeFalsy()
 
     // Normal path.
-    itemVm.onBeforeTransition();
-    expect(windowVm.isActive).toBeTruthy();
-    itemVm.onAfterTransition();
+    itemVm.onBeforeTransition()
+    expect(windowVm.isActive).toBeTruthy()
+    itemVm.onAfterTransition()
 
-    expect(windowVm.isActive).toBeFalsy();
-  });
+    expect(windowVm.isActive).toBeFalsy()
+  })
 
-  it("should use custom transition", async () => {
+  it('should use custom transition', async () => {
     const wrapper = mountFunction({
       props: {
-        transition: "foo",
-        reverseTransition: "bar"
+        transition: 'foo',
+        reverseTransition: 'bar'
       },
       data: () => ({
         windowGroup: {
@@ -107,28 +107,28 @@ describe("VWindowItem.ts", () => {
           unregister: () => {}
         }
       })
-    });
+    })
 
-    const vm = wrapper.vm as any;
+    const vm = wrapper.vm as any
 
-    expect(vm.computedTransition).toBe("foo");
+    expect(vm.computedTransition).toBe('foo')
 
-    await wrapper.setProps({ transition: false });
-    await nextTick();
+    await wrapper.setProps({ transition: false })
+    await nextTick()
     // В Vue 3 нужно дождаться обновления computed
-    expect(vm.computedTransition).toBe("");
+    expect(vm.computedTransition).toBe('')
 
-    vm.windowGroup.internalReverse = true;
-    await nextTick();
-    expect(vm.computedTransition).toBe("bar");
+    vm.windowGroup.internalReverse = true
+    await nextTick()
+    expect(vm.computedTransition).toBe('bar')
 
-    await wrapper.setProps({ reverseTransition: false });
-    await nextTick();
-    expect(vm.computedTransition).toBe("");
-  });
+    await wrapper.setProps({ reverseTransition: false })
+    await nextTick()
+    expect(vm.computedTransition).toBe('')
+  })
 
-  it("should not set initial height if no computedTransition", async () => {
-    const heightChanged = jest.fn();
+  it('should not set initial height if no computedTransition', async () => {
+    const heightChanged = jest.fn()
     const wrapper = mount(VWindow, {
       props: {
         transition: false,
@@ -150,28 +150,28 @@ describe("VWindowItem.ts", () => {
           }
         }
       }
-    });
+    })
 
-    const item = wrapper.findComponent(VWindowItem);
-    const windowVm = wrapper.vm as any;
-    const itemVm = item.vm as any;
+    const item = wrapper.findComponent(VWindowItem)
+    const windowVm = wrapper.vm as any
+    const itemVm = item.vm as any
 
-    expect(windowVm.computedTransition).toBeFalsy();
+    expect(windowVm.computedTransition).toBeFalsy()
 
-    itemVm.onBeforeTransition();
-    expect(windowVm.isActive).toBeTruthy();
+    itemVm.onBeforeTransition()
+    expect(windowVm.isActive).toBeTruthy()
     // В Vue 3 watch может не срабатывать сразу, поэтому проверяем после nextTick
-    await nextTick();
-    expect(heightChanged).toHaveBeenCalledTimes(1);
+    await nextTick()
+    expect(heightChanged).toHaveBeenCalledTimes(1)
 
-    itemVm.onEnter(wrapper.element);
-    await waitAnimationFrame();
-    expect(windowVm.isActive).toBeTruthy();
+    itemVm.onEnter(wrapper.element)
+    await waitAnimationFrame()
+    expect(windowVm.isActive).toBeTruthy()
 
-    expect(heightChanged).toHaveBeenCalledTimes(1);
-  });
+    expect(heightChanged).toHaveBeenCalledTimes(1)
+  })
 
-  it("should increase and decrease transition count correctly", () => {
+  it('should increase and decrease transition count correctly', () => {
     const wrapper = mount(VWindow, {
       slots: {
         default: () => [h(VWindowItem), h(VWindowItem), h(VWindowItem)]
@@ -186,35 +186,35 @@ describe("VWindowItem.ts", () => {
           }
         }
       }
-    });
-
-    const windowVm = wrapper.vm as any;
-    const items = windowVm.items as any[];
-    expect(items).toHaveLength(3);
-
-    expect(windowVm.transitionCount).toBe(0);
-    expect(windowVm.isActive).toBeFalsy();
-    items[0].onBeforeTransition();
-    expect(windowVm.transitionCount).toBe(1);
-    expect(windowVm.isActive).toBeTruthy();
-    items[1].onBeforeTransition();
-    expect(windowVm.transitionCount).toBe(2);
-    expect(windowVm.isActive).toBeTruthy();
-    items[0].onTransitionCancelled();
-    expect(windowVm.transitionCount).toBe(1);
-    expect(windowVm.isActive).toBeTruthy();
-    items[2].onBeforeTransition();
-    expect(windowVm.transitionCount).toBe(2);
-    expect(windowVm.isActive).toBeTruthy();
-    items[1].onAfterTransition();
-    expect(windowVm.transitionCount).toBe(1);
-    expect(windowVm.isActive).toBeTruthy();
-    items[2].onAfterTransition();
-    expect(windowVm.transitionCount).toBe(0);
-    expect(windowVm.isActive).toBeFalsy();
-  });
-
-  it("should render with correct structure and classes when active", () => {
+    })
+
+    const windowVm = wrapper.vm as any
+    const items = windowVm.items as any[]
+    expect(items).toHaveLength(3)
+
+    expect(windowVm.transitionCount).toBe(0)
+    expect(windowVm.isActive).toBeFalsy()
+    items[0].onBeforeTransition()
+    expect(windowVm.transitionCount).toBe(1)
+    expect(windowVm.isActive).toBeTruthy()
+    items[1].onBeforeTransition()
+    expect(windowVm.transitionCount).toBe(2)
+    expect(windowVm.isActive).toBeTruthy()
+    items[0].onTransitionCancelled()
+    expect(windowVm.transitionCount).toBe(1)
+    expect(windowVm.isActive).toBeTruthy()
+    items[2].onBeforeTransition()
+    expect(windowVm.transitionCount).toBe(2)
+    expect(windowVm.isActive).toBeTruthy()
+    items[1].onAfterTransition()
+    expect(windowVm.transitionCount).toBe(1)
+    expect(windowVm.isActive).toBeTruthy()
+    items[2].onAfterTransition()
+    expect(windowVm.transitionCount).toBe(0)
+    expect(windowVm.isActive).toBeFalsy()
+  })
+
+  it('should render with correct structure and classes when active', () => {
     const wrapper = mountFunction({
       data: () => ({
         isActive: true,
@@ -222,18 +222,18 @@ describe("VWindowItem.ts", () => {
           internalReverse: false,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-transition"
+          computedTransition: 'v-window-x-transition'
         }
       })
-    });
+    })
 
-    expect(wrapper.html()).toMatchSnapshot();
-  });
+    expect(wrapper.html()).toMatchSnapshot()
+  })
 
-  it("should render with custom transition when active", () => {
+  it('should render with custom transition when active', () => {
     const wrapper = mountFunction({
       props: {
-        transition: "custom-transition"
+        transition: 'custom-transition'
       },
       data: () => ({
         isActive: true,
@@ -241,18 +241,18 @@ describe("VWindowItem.ts", () => {
           internalReverse: false,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-transition"
+          computedTransition: 'v-window-x-transition'
         }
       })
-    });
+    })
 
-    expect(wrapper.html()).toMatchSnapshot();
-  });
+    expect(wrapper.html()).toMatchSnapshot()
+  })
 
-  it("should render with reverse transition when active", () => {
+  it('should render with reverse transition when active', () => {
     const wrapper = mountFunction({
       props: {
-        reverseTransition: "custom-reverse-transition"
+        reverseTransition: 'custom-reverse-transition'
       },
       data: () => ({
         isActive: true,
@@ -260,15 +260,15 @@ describe("VWindowItem.ts", () => {
           internalReverse: true,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-reverse-transition"
+          computedTransition: 'v-window-x-reverse-transition'
         }
       })
-    });
+    })
 
-    expect(wrapper.html()).toMatchSnapshot();
-  });
+    expect(wrapper.html()).toMatchSnapshot()
+  })
 
-  it("should render with disabled prop when active", () => {
+  it('should render with disabled prop when active', () => {
     const wrapper = mountFunction({
       props: {
         disabled: true
@@ -279,18 +279,18 @@ describe("VWindowItem.ts", () => {
           internalReverse: false,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-transition"
+          computedTransition: 'v-window-x-transition'
         }
       })
-    });
+    })
 
-    expect(wrapper.html()).toMatchSnapshot();
-  });
+    expect(wrapper.html()).toMatchSnapshot()
+  })
 
-  it("should render with slot content when active", () => {
+  it('should render with slot content when active', () => {
     const wrapper = mountFunction({
       slots: {
-        default: () => h("div", { class: "test-content" }, "Test content")
+        default: () => h('div', { class: 'test-content' }, 'Test content')
       },
       data: () => ({
         isActive: true,
@@ -298,18 +298,18 @@ describe("VWindowItem.ts", () => {
           internalReverse: false,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-transition"
+          computedTransition: 'v-window-x-transition'
         }
       })
-    });
+    })
 
-    expect(wrapper.html()).toMatchSnapshot();
-  });
+    expect(wrapper.html()).toMatchSnapshot()
+  })
 
-  it("should render with value prop when active", () => {
+  it('should render with value prop when active', () => {
     const wrapper = mountFunction({
       props: {
-        value: "test-value"
+        value: 'test-value'
       },
       data: () => ({
         isActive: true,
@@ -317,15 +317,15 @@ describe("VWindowItem.ts", () => {
           internalReverse: false,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-transition"
+          computedTransition: 'v-window-x-transition'
         }
       })
-    });
+    })
 
-    expect(wrapper.html()).toMatchSnapshot();
-  });
+    expect(wrapper.html()).toMatchSnapshot()
+  })
 
-  it("should not render when not active", () => {
+  it('should not render when not active', () => {
     const wrapper = mountFunction({
       data: () => ({
         isActive: false,
@@ -333,12 +333,11 @@ describe("VWindowItem.ts", () => {
           internalReverse: false,
           register: () => {},
           unregister: () => {},
-          computedTransition: "v-window-x-transition"
+          computedTransition: 'v-window-x-transition'
         }
       })
-    });
-
-    expect(wrapper.html()).toMatchSnapshot();
-  });
-});
+    })
 
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+})

package/src/components/VWindow/index.ts

@@ -6,6 +6,6 @@ export { VWindow, VWindowItem }
 export default {
   $_vuetify_subcomponents: {
     VWindow,
-    VWindowItem,
-  },
+    VWindowItem
+  }
 }

package/src/components/transitions/createTransition.ts

@@ -1,6 +1,6 @@
-import { FunctionalComponentOptions, VNode, VNodeData, Transition, TransitionGroup } from 'vue'
+import type { FunctionalComponentOptions, VNode, VNodeData } from '../../types/vue-internal'
+import { Transition, TransitionGroup, h } from 'vue'
 import mergeData from '../../util/mergeData'
-import {h} from 'vue'
 
 function mergeTransitions (
   dest: Function | Function[] = [],
@@ -23,24 +23,24 @@ export function createSimpleTransition (
     props: {
       group: {
         type: Boolean,
-        default: false,
+        default: false
       },
       hideOnLeave: {
         type: Boolean,
-        default: false,
+        default: false
       },
       leaveAbsolute: {
         type: Boolean,
-        default: false,
+        default: false
       },
       mode: {
         type: String,
-        default: mode,
+        default: mode
       },
       origin: {
         type: String,
-        default: origin,
-      },
+        default: origin
+      }
     },
 
     render (): VNode {
@@ -63,7 +63,7 @@ export function createSimpleTransition (
             top: el.style.top,
             left: el.style.left,
             width: el.style.width,
-            height: el.style.height,
+            height: el.style.height
           }
           el.style.position = 'absolute'
           el.style.top = offsetTop + 'px'
@@ -88,8 +88,8 @@ export function createSimpleTransition (
           el.style.setProperty('display', 'none', 'important')
         })
       }
-      return h(tag, mergeData(this.$attrs, data), () => this.$slots.default())
-    },
+      return h(tag as any, mergeData(this.$attrs, data) as any, () => this.$slots.default?.() ?? [])
+    }
   }
 }
 
@@ -106,8 +106,8 @@ export function createJavascriptTransition (
     props: {
       mode: {
         type: String,
-        default: mode,
-      },
+        default: mode
+      }
     },
 
     render (): VNode {
@@ -115,10 +115,10 @@ export function createJavascriptTransition (
         Transition,
         mergeData(this.$attrs, {
           name,
-          ...functions,
+          ...functions
         }),
         () => this.$slots.default()
       )
-    },
+    }
   }
 }

package/src/components/transitions/expand-transition.ts

@@ -20,12 +20,12 @@ export default function (expandedParentClass = '', x = false) {
       el._initialStyle = {
         transition: el.style.transition,
         overflow: el.style.overflow,
-        [sizeProperty]: el.style[sizeProperty],
+        [sizeProperty]: el.style[sizeProperty]
       }
     },
 
     onEnter (el: HTMLExpandElement) {
-      if(el.style.display === 'none') return
+      if (el.style.display === 'none') return
 
       const initialStyle = el._initialStyle!
 
@@ -56,7 +56,7 @@ export default function (expandedParentClass = '', x = false) {
       el._initialStyle = {
         transition: '',
         overflow: el.style.overflow,
-        [sizeProperty]: el.style[sizeProperty],
+        [sizeProperty]: el.style[sizeProperty]
       }
 
       el.style.overflow = 'hidden'
@@ -67,7 +67,7 @@ export default function (expandedParentClass = '', x = false) {
     },
 
     onAfterLeave: afterLeave,
-    onLeaveCancelled: afterLeave,
+    onLeaveCancelled: afterLeave
   }
 
   function afterLeave (el: HTMLExpandElement) {

package/src/components/transitions/index.ts

@@ -1,6 +1,6 @@
 import {
   createSimpleTransition,
-  createJavascriptTransition,
+  createJavascriptTransition
 } from './createTransition'
 
 import ExpandTransitionGenerator from './expand-transition'
@@ -54,6 +54,6 @@ export default {
     VTabReverseTransition,
     VTabTransition,
     VExpandTransition,
-    VExpandXTransition,
-  },
+    VExpandXTransition
+  }
 }

package/src/directives/click-outside/__tests__/click-outside-shadow-dom.spec.ts

@@ -11,8 +11,8 @@ function bootstrap (args?: object) {
   const binding = {
     value: {
       handler: jest.fn(),
-      ...args,
-    },
+      ...args
+    }
   } as any
   const vnode = { ctx: { uid: 1 } } as any
 
@@ -50,7 +50,7 @@ function bootstrap (args?: object) {
     shadowClickHandler,
     outsideClickHandler,
     shadowMousedownHandler,
-    outsideMousedownHandler,
+    outsideMousedownHandler
   }
 }
 

package/src/directives/click-outside/__tests__/click-outside.spec.ts

@@ -8,8 +8,8 @@ function bootstrap (args?: object) {
   const binding = {
     value: {
       handler: jest.fn(),
-      ...args,
-    },
+      ...args
+    }
   } as any
   const vnode = { ctx: { uid: 1 } } as any
 
@@ -29,7 +29,7 @@ function bootstrap (args?: object) {
     callback: binding.value.handler,
     el: el as HTMLElement,
     clickHandler,
-    mousedownHandler,
+    mousedownHandler
   }
 }
 
@@ -78,7 +78,7 @@ describe('click-outside', () => {
   it('should not call the callback when clicked in elements', async () => {
     const { clickHandler, callback, el } = bootstrap({
       closeConditional: () => true,
-      include: () => [el],
+      include: () => [el]
     })
 
     clickHandler({ target: document.createElement('div') })

package/src/directives/click-outside/index.ts

@@ -1,5 +1,5 @@
 import { attachedRoot } from '../../util/dom'
-import { VNodeDirective } from 'vue/types/vnode'
+import type { VNodeDirective } from '../../types/vue-internal'
 import { VNode } from 'vue'
 
 interface ClickOutsideBindingArgs {
@@ -8,7 +8,7 @@ interface ClickOutsideBindingArgs {
   include?: () => HTMLElement[]
 }
 
-interface ClickOutsideDirective extends VNodeDirective {
+type ClickOutsideDirective = VNodeDirective & {
   value?: ((e: Event) => void) | ClickOutsideBindingArgs
 }
 
@@ -90,13 +90,13 @@ export const ClickOutside = {
 
     if (!el._clickOutside) {
       el._clickOutside = {
-        lastMousedownWasOutside: true,
+        lastMousedownWasOutside: true
       }
     }
 
     el._clickOutside[vnode.ctx.uid] = {
       onClick,
-      onMousedown,
+      onMousedown
     }
   },
 
@@ -113,7 +113,7 @@ export const ClickOutside = {
     })
 
     delete el._clickOutside[vnode.ctx.uid]
-  },
+  }
 }
 
 export default ClickOutside