@vuetify/nightly 3.0.0-next-20220112.0 → 3.0.0-next-20220128.0

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.0.0-next-20220112.0
+* Vuetify v3.0.0-next-20220128.0
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -2607,12 +2607,7 @@ function useGroup(props, injectKey) {
     next: () => step(1),
     isSelected: id => selected.value.includes(id),
     selectedClass: computed(() => props.selectedClass),
-    items: computed(() => items.map(_ref => {
-      let {
-        id
-      } = _ref;
-      return id;
-    }))
+    items: computed(() => items)
   };
   provide(injectKey, state);
   return state;
@@ -2853,7 +2848,8 @@ const VIcon = defineComponent({
     ...makeSizeProps(),
     ...makeTagProps({
       tag: 'i'
-    })
+    }),
+    ...makeThemeProps()
   },
 
   setup(props, _ref) {
@@ -2872,6 +2868,9 @@ const VIcon = defineComponent({
       });
     }
 
+    const {
+      themeClasses
+    } = provideTheme(props);
     const {
       iconData
     } = useIcon(slotIcon || props);
@@ -2886,7 +2885,7 @@ const VIcon = defineComponent({
       return createVNode(iconData.value.component, {
         "tag": props.tag,
         "icon": iconData.value.icon,
-        "class": ['v-icon', 'notranslate', sizeClasses.value, textColorClasses.value, {
+        "class": ['v-icon', 'notranslate', sizeClasses.value, textColorClasses.value, themeClasses.value, {
           'v-icon--left': props.left,
           'v-icon--right': props.right
         }],
@@ -7112,11 +7111,11 @@ const VExpansionPanel = defineComponent({
     } = useElevation(props);
     provide(VExpansionPanelSymbol, groupItem);
     const isBeforeSelected = computed(() => {
-      const index = groupItem.group.items.value.indexOf(groupItem.id);
+      const index = groupItem.group.items.value.findIndex(item => item.id === groupItem.id);
       return !groupItem.isSelected.value && groupItem.group.selected.value.some(id => groupItem.group.items.value.indexOf(id) - index === 1);
     });
     const isAfterSelected = computed(() => {
-      const index = groupItem.group.items.value.indexOf(groupItem.id);
+      const index = groupItem.group.items.value.findIndex(item => item.id === groupItem.id);
       return !groupItem.isSelected.value && groupItem.group.selected.value.some(id => groupItem.group.items.value.indexOf(id) - index === -1);
     });
     const {
@@ -8369,16 +8368,16 @@ const VHover = defineComponent({
     let {
       slots
     } = _ref;
-    const hover = useProxiedModel(props, 'modelValue');
+    const isHovering = useProxiedModel(props, 'modelValue');
     const {
       runOpenDelay,
       runCloseDelay
-    } = useDelay(props, value => !props.disabled && (hover.value = value));
+    } = useDelay(props, value => !props.disabled && (isHovering.value = value));
     return () => {
       var _slots$default;
 
       return (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, {
-        hover: hover.value,
+        isHovering: isHovering.value,
         props: {
           onMouseenter: runOpenDelay,
           onMouseleave: runCloseDelay
@@ -8592,37 +8591,26 @@ const VLazy = defineComponent({
 
 });
 
-const VListSubheader = defineComponent({
-  name: 'VListSubheader',
-  props: {
-    color: String,
-    inset: Boolean,
-    ...makeTagProps()
-  },
-
-  setup(props, _ref) {
-    let {
-      slots
-    } = _ref;
-    const {
-      textColorClasses,
-      textColorStyles
-    } = useTextColor(toRef(props, 'color'));
-    return () => createVNode(props.tag, {
-      "class": ['v-list-subheader', {
-        'v-list-subheader--inset': props.inset
-      }, textColorClasses.value],
-      "style": {
-        textColorStyles
-      }
-    }, {
-      default: () => [slots.default && createVNode("div", {
-        "class": "v-list-subheader__text"
-      }, [slots.default()])]
-    }, 8, ["class", "style"]);
-  }
+// Utilities
 
-});
+const ListKey = Symbol.for('vuetify:list');
+function createList() {
+  const parent = inject(ListKey, {
+    hasPrepend: ref(false),
+    updateHasPrepend: () => null
+  });
+  const data = {
+    hasPrepend: ref(false),
+    updateHasPrepend: value => {
+      if (value) data.hasPrepend.value = value;
+    }
+  };
+  provide(ListKey, data);
+  return parent;
+}
+function useList() {
+  return inject(ListKey, null);
+}
 
 const singleOpenStrategy = _ref => {
   let {
@@ -8660,7 +8648,7 @@ const multipleOpenStrategy = _ref2 => {
     let parent = parents.get(id);
     opened.add(id);
 
-    while (parent != null) {
+    while (parent != null && parent !== id) {
       opened.add(parent);
       parent = parents.get(parent);
     }
@@ -8912,7 +8900,7 @@ const useNested = props => {
         return arr;
       }),
       register: (id, parentId, isGroup) => {
-        parentId && parents.value.set(id, parentId);
+        parentId && id !== parentId && parents.value.set(id, parentId);
         isGroup && children.value.set(id, []);
 
         if (parentId != null) {
@@ -9019,30 +9007,6 @@ const useNestedGroup = props => {
   return group;
 };
 
-const VListGroupItems = defineComponent({
-  name: 'VListGroupItems',
-  props: {
-    open: Boolean,
-    items: Array
-  },
-
-  setup(props, _ref) {
-    let {
-      slots
-    } = _ref;
-    createList();
-    return () => {
-      return createVNode(VExpandTransition, null, {
-        default: () => [withDirectives(createVNode("div", {
-          "class": "v-list-group__items"
-        }, [createVNode(VListChildren, {
-          "items": props.items
-        }, slots, 8, ["items"])], 512), [[vShow, props.open]])]
-      });
-    };
-  }
-
-});
 const VListGroup = genericComponent()({
   name: 'VListGroup',
   props: {
@@ -9055,14 +9019,13 @@ const VListGroup = genericComponent()({
       type: String,
       default: '$expand'
     },
-    items: Array,
     ...makeTagProps()
   },
 
-  setup(props, _ref2) {
+  setup(props, _ref) {
     let {
       slots
-    } = _ref2;
+    } = _ref;
     const {
       isOpen,
       open
@@ -9073,23 +9036,27 @@ const VListGroup = genericComponent()({
       open(!isOpen.value, e);
     };
 
-    const headerProps = computed(() => ({
+    const activatorProps = computed(() => ({
       onClick,
       appendIcon: isOpen.value ? props.collapseIcon : props.expandIcon,
-      class: 'v-list-group__header'
+      class: 'v-list-group__header',
+      value: `${props.value}_header`
     }));
     return () => {
-      var _slots$header;
+      var _slots$activator, _slots$default;
 
       return createVNode(props.tag, {
         "class": ['v-list-group', {
           'v-list-group--prepend': list == null ? void 0 : list.hasPrepend.value
         }]
       }, {
-        default: () => [(_slots$header = slots.header) == null ? void 0 : _slots$header.call(slots, headerProps.value), createVNode(VListGroupItems, {
-          "items": props.items,
-          "open": isOpen.value
-        }, slots, 8, ["items", "open"])],
+        default: () => [(_slots$activator = slots.activator) == null ? void 0 : _slots$activator.call(slots, {
+          props: activatorProps.value
+        }), createVNode(VExpandTransition, null, {
+          default: () => [withDirectives(createVNode("div", {
+            "class": "v-list-group__items"
+          }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)], 512), [[vShow, isOpen.value]])]
+        })],
         _: 1
       }, 8, ["class"]);
     };
@@ -9266,9 +9233,13 @@ const VListItem = genericComponent()({
           }, null, 8, ["density", "icon", "image"])]
         }, 8, ["left"])), hasHeader && createVNode(VListItemHeader, null, {
           default: () => [hasTitle && createVNode(VListItemTitle, null, {
-            default: () => [slots.title ? slots.title() : props.title]
+            default: () => [slots.title ? slots.title({
+              title: props.title
+            }) : props.title]
           }), hasSubtitle && createVNode(VListItemSubtitle, null, {
-            default: () => [slots.subtitle ? slots.subtitle() : props.subtitle]
+            default: () => [slots.subtitle ? slots.subtitle({
+              subtitle: props.subtitle
+            }) : props.subtitle]
           })],
           _: 1
         }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, slotProps.value), hasAppend && (slots.append ? slots.append(slotProps.value) : createVNode(VListItemAvatar, {
@@ -9287,6 +9258,46 @@ const VListItem = genericComponent()({
 
 });
 
+const VListSubheader = defineComponent({
+  name: 'VListSubheader',
+  props: {
+    color: String,
+    inset: Boolean,
+    sticky: Boolean,
+    text: String,
+    ...makeTagProps()
+  },
+
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const {
+      textColorClasses,
+      textColorStyles
+    } = useTextColor(toRef(props, 'color'));
+    return () => {
+      var _slots$default, _slots$default2;
+
+      const hasText = !!(slots.default || props.text);
+      return createVNode(props.tag, {
+        "class": ['v-list-subheader', {
+          'v-list-subheader--inset': props.inset,
+          'v-list-subheader--sticky': props.sticky
+        }, textColorClasses.value],
+        "style": {
+          textColorStyles
+        }
+      }, {
+        default: () => [hasText && createVNode("div", {
+          "class": "v-list-subheader__text"
+        }, [(_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)) != null ? _slots$default : props.text])]
+      }, 8, ["class", "style"]);
+    };
+  }
+
+});
+
 const VListChildren = genericComponent()({
   name: 'VListChildren',
   props: {
@@ -9297,51 +9308,69 @@ const VListChildren = genericComponent()({
     let {
       slots
     } = _ref;
+    createList();
     return () => {
       var _slots$default, _slots$default2, _props$items;
 
       return (_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)) != null ? _slots$default : (_props$items = props.items) == null ? void 0 : _props$items.map(_ref2 => {
         let {
           children,
-          ...item
+          props: itemProps,
+          type
         } = _ref2;
-        const {
-          value,
-          ...rest
-        } = item;
+        if (type === 'divider') return createVNode(VDivider, itemProps, null, 16);
+        if (type === 'subheader') return createVNode(VListSubheader, itemProps, slots, 16);
         return children ? createVNode(VListGroup, {
-          "value": value,
-          "items": children
-        }, { ...slots,
-          header: headerProps => slots.externalHeader ? slots.externalHeader({ ...rest,
-            ...headerProps
-          }) : createVNode(VListItem, mergeProps(rest, headerProps), null, 16),
+          "value": itemProps == null ? void 0 : itemProps.value
+        }, {
+          default: () => createVNode(VListChildren, {
+            "items": children
+          }, slots, 8, ["items"]),
+          activator: _ref3 => {
+            let {
+              props: activatorProps
+            } = _ref3;
+            return slots.header ? slots.header({ ...itemProps,
+              ...activatorProps
+            }) : createVNode(VListItem, mergeProps(itemProps, activatorProps), null, 16);
+          },
           _: 2
-        }, 8, ["value", "items"]) : slots.item ? slots.item(item) : createVNode(VListItem, item, slots, 16);
+        }, 8, ["value"]) : slots.item ? slots.item(itemProps) : createVNode(VListItem, itemProps, slots, 16);
       });
     };
   }
 
 });
 
-const ListKey = Symbol.for('vuetify:list');
-const createList = () => {
-  const parent = inject(ListKey, {
-    hasPrepend: ref(false),
-    updateHasPrepend: () => null
+const parseItems = items => {
+  if (!items) return undefined;
+  return items.map(item => {
+    if (typeof item === 'string') return {
+      type: 'item',
+      value: item,
+      title: item
+    };
+    const {
+      $type,
+      $children,
+      ...props
+    } = item;
+    if ($type === 'subheader') return {
+      type: 'subheader',
+      props
+    };
+    if ($type === 'divider') return {
+      type: 'divider',
+      props
+    };
+    return {
+      type: 'item',
+      props,
+      children: parseItems($children)
+    };
   });
-  const data = {
-    hasPrepend: ref(false),
-    updateHasPrepend: value => {
-      if (value) data.hasPrepend.value = value;
-    }
-  };
-  provide(ListKey, data);
-  return parent;
-};
-const useList = () => {
-  return inject(ListKey, null);
 };
+
 const VList = genericComponent()({
   name: 'VList',
   props: {
@@ -9352,10 +9381,6 @@ const VList = genericComponent()({
       default: 'one'
     },
     nav: Boolean,
-    subheader: {
-      type: [Boolean, String],
-      default: false
-    },
     items: Array,
     ...makeNestedProps({
       selectStrategy: 'leaf',
@@ -9380,6 +9405,7 @@ const VList = genericComponent()({
     let {
       slots
     } = _ref;
+    const items = computed(() => parseItems(props.items));
     const {
       themeClasses
     } = provideTheme(props);
@@ -9409,28 +9435,24 @@ const VList = genericComponent()({
     } = useNested(props);
     createList();
     useRender(() => {
-      const hasHeader = typeof props.subheader === 'string' || slots.subheader;
       return createVNode(props.tag, {
         "class": ['v-list', {
           'v-list--disabled': props.disabled,
           'v-list--nav': props.nav,
-          'v-list--subheader': props.subheader,
-          'v-list--subheader-sticky': props.subheader === 'sticky',
           [`v-list--${props.lines}-line`]: true
         }, themeClasses.value, backgroundColorClasses.value, borderClasses.value, densityClasses.value, elevationClasses.value, roundedClasses.value],
         "style": [backgroundColorStyles.value, dimensionStyles.value]
       }, {
-        default: () => [hasHeader && (slots.subheader ? slots.subheader() : createVNode(VListSubheader, null, {
-          default: () => [props.subheader]
-        })), createVNode(VListChildren, {
-          "items": props.items
+        default: () => [createVNode(VListChildren, {
+          "items": items.value
         }, {
           default: slots.default,
           item: slots.item,
-          externalHeader: slots.header,
+          title: slots.title,
+          subtitle: slots.subtitle,
+          header: slots.header,
           _: 1
-        }, 8, ["items"])],
-        _: 1
+        }, 8, ["items"])]
       }, 8, ["class", "style"]);
     });
     return {
@@ -10172,6 +10194,7 @@ const VPagination = defineComponent({
       default: '...'
     },
     showFirstLastPage: Boolean,
+    ...makeRoundedProps(),
     ...makeBorderProps(),
     ...makeDensityProps(),
     ...makeElevationProps(),
@@ -10306,6 +10329,7 @@ const VPagination = defineComponent({
               icon: true,
               disabled: !!props.disabled || props.length < 2,
               elevation: props.elevation,
+              rounded: props.rounded,
               color: isActive ? props.color : undefined,
               ariaCurrent: isActive,
               ariaLabel: t(isActive ? props.currentPageAriaLabel : props.pageAriaLabel, index + 1),
@@ -10733,7 +10757,7 @@ const makeSliderProps = propsFactory({
   },
   showTicks: {
     type: [Boolean, String],
-    default: true,
+    default: false,
     validator: v => typeof v === 'boolean' || v === 'always'
   },
   showTickLabels: {
@@ -10817,6 +10841,7 @@ const useSlider = _ref => {
   const mousePressed = ref(false);
   const startOffset = ref(0);
   const trackContainerRef = ref();
+  const activeThumbRef = ref();
 
   function roundValue(value) {
     if (step.value <= 0) return value;
@@ -10858,14 +10883,14 @@ const useSlider = _ref => {
   };
 
   const handleStart = e => {
-    const activeThumb = getActiveThumb(e);
-    if (!activeThumb) return;
-    activeThumb.focus();
+    activeThumbRef.value = getActiveThumb(e);
+    if (!activeThumbRef.value) return;
+    activeThumbRef.value.focus();
     mousePressed.value = true;
 
-    if (activeThumb.contains(e.target)) {
+    if (activeThumbRef.value.contains(e.target)) {
       thumbMoved = true;
-      startOffset.value = getOffset(e, activeThumb, props.direction);
+      startOffset.value = getOffset(e, activeThumbRef.value, props.direction);
     } else {
       startOffset.value = 0;
       handleMouseMove(parseMouseMove(e));
@@ -10949,6 +10974,7 @@ const useSlider = _ref => {
     return !!label;
   }));
   const data = {
+    activeThumbRef,
     color: toRef(props, 'color'),
     decimals,
     disabled,
@@ -11037,7 +11063,8 @@ const VSliderThumb = defineComponent({
       elevation,
       isReversed,
       horizontalDirection,
-      mousePressed
+      mousePressed,
+      decimals
     } = slider;
     const {
       textColorClasses,
@@ -11114,7 +11141,7 @@ const VSliderThumb = defineComponent({
         "aria-valuenow": props.modelValue,
         "aria-readonly": readonly.value,
         "aria-orientation": direction.value,
-        "onKeydown": onKeydown
+        "onKeydown": !readonly.value ? onKeydown : undefined
       }, [createVNode("div", {
         "class": ['v-slider-thumb__surface', textColorClasses.value, elevationClasses.value],
         "style": { ...textColorStyles.value
@@ -11134,7 +11161,7 @@ const VSliderThumb = defineComponent({
           "class": ['v-slider-thumb__label']
         }, [createVNode("div", null, [(_slots$thumbLabel = (_slots$thumbLabel2 = slots['thumb-label']) == null ? void 0 : _slots$thumbLabel2.call(slots, {
           modelValue: props.modelValue
-        })) != null ? _slots$thumbLabel : props.modelValue.toFixed(1)])])], 512), [[vShow, thumbLabel.value && props.focused || thumbLabel.value === 'always']])]
+        })) != null ? _slots$thumbLabel : props.modelValue.toFixed(step.value ? decimals.value : 1)])])], 512), [[vShow, thumbLabel.value && props.focused || thumbLabel.value === 'always']])]
       })], 46, ["tabindex", "aria-label", "aria-valuemin", "aria-valuemax", "aria-valuenow", "aria-readonly", "aria-orientation", "onKeydown"]);
     };
   }
@@ -11255,6 +11282,7 @@ const VRangeSlider = defineComponent$1({
   name: 'VRangeSlider',
   props: { ...makeVInputProps(),
     ...makeSliderProps(),
+    strict: Boolean,
     modelValue: {
       type: Array,
       default: () => [0, 0]
@@ -11271,20 +11299,15 @@ const VRangeSlider = defineComponent$1({
     } = _ref;
     const startThumbRef = ref();
     const stopThumbRef = ref();
-    const focusedThumb = ref();
     const inputRef = ref();
-    let canSwitch = false;
 
     function getActiveThumb(e) {
-      var _startThumbRef$value, _stopThumbRef$value;
-
       if (!startThumbRef.value || !stopThumbRef.value) return;
-      canSwitch = true;
       const startOffset = getOffset(e, startThumbRef.value.$el, props.direction);
       const stopOffset = getOffset(e, stopThumbRef.value.$el, props.direction);
       const a = Math.abs(startOffset);
       const b = Math.abs(stopOffset);
-      return a < b || a === b && startOffset < 0 ? (_startThumbRef$value = startThumbRef.value) == null ? void 0 : _startThumbRef$value.$el : (_stopThumbRef$value = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value.$el;
+      return a < b || a === b && startOffset < 0 ? startThumbRef.value.$el : stopThumbRef.value.$el;
     }
 
     const {
@@ -11296,25 +11319,33 @@ const VRangeSlider = defineComponent$1({
       onSliderTouchstart,
       trackContainerRef,
       position,
-      hasLabels
+      hasLabels,
+      activeThumbRef
     } = useSlider({
       /* eslint-disable @typescript-eslint/no-use-before-define */
       props,
       handleSliderMouseUp: newValue => {
-        model.value = focusedThumb.value === startThumbRef.value ? [newValue, model.value[1]] : [model.value[0], newValue];
+        var _startThumbRef$value;
+
+        model.value = activeThumbRef.value === ((_startThumbRef$value = startThumbRef.value) == null ? void 0 : _startThumbRef$value.$el) ? [newValue, model.value[1]] : [model.value[0], newValue];
       },
       handleMouseMove: newValue => {
-        if (focusedThumb.value === startThumbRef.value) {
-          model.value = [Math.min(newValue, model.value[1]), model.value[1]];
-        } else {
-          model.value = [model.value[0], Math.max(model.value[0], newValue)];
-        }
+        var _startThumbRef$value3;
+
+        const [start, stop] = model.value;
+
+        if (!props.strict && start === stop && start !== min.value) {
+          var _stopThumbRef$value, _startThumbRef$value2, _activeThumbRef$value;
 
-        if (canSwitch && model.value[0] === model.value[1]) {
-          focusedThumb.value = newValue > model.value[0] ? stopThumbRef.value : startThumbRef.value;
+          activeThumbRef.value = newValue > start ? (_stopThumbRef$value = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value.$el : (_startThumbRef$value2 = startThumbRef.value) == null ? void 0 : _startThumbRef$value2.$el;
+          (_activeThumbRef$value = activeThumbRef.value) == null ? void 0 : _activeThumbRef$value.focus();
         }
 
-        canSwitch = false;
+        if (activeThumbRef.value === ((_startThumbRef$value3 = startThumbRef.value) == null ? void 0 : _startThumbRef$value3.$el)) {
+          model.value = [Math.min(newValue, stop), stop];
+        } else {
+          model.value = [start, Math.max(start, newValue)];
+        }
       },
       getActiveThumb
       /* eslint-enable @typescript-eslint/no-use-before-define */
@@ -11345,6 +11376,8 @@ const VRangeSlider = defineComponent$1({
         "focused": isFocused.value
       }), { ...slots,
         default: _ref2 => {
+          var _startThumbRef$value4, _stopThumbRef$value4;
+
           let {
             id
           } = _ref2;
@@ -11375,23 +11408,28 @@ const VRangeSlider = defineComponent$1({
             _: 1
           }, 8, ["start", "stop"]), createVNode(VSliderThumb, {
             "ref": startThumbRef,
-            "focused": isFocused && focusedThumb.value === startThumbRef.value,
+            "focused": isFocused && activeThumbRef.value === ((_startThumbRef$value4 = startThumbRef.value) == null ? void 0 : _startThumbRef$value4.$el),
             "modelValue": model.value[0],
             "onUpdate:modelValue": v => model.value = [v, model.value[1]],
             "onFocus": e => {
-              var _stopThumbRef$value2, _stopThumbRef$value3;
+              var _startThumbRef$value5, _stopThumbRef$value2;
 
               focus();
-              focusedThumb.value = startThumbRef.value; // Make sure second thumb is focused if
+              activeThumbRef.value = (_startThumbRef$value5 = startThumbRef.value) == null ? void 0 : _startThumbRef$value5.$el; // Make sure second thumb is focused if
               // the thumbs are on top of each other
               // and they are both at minimum value
               // but only if focused from outside.
 
-              if (model.value[0] === model.value[1] && model.value[1] === min.value && e.relatedTarget !== ((_stopThumbRef$value2 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value2.$el)) (_stopThumbRef$value3 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value3.$el.focus();
+              if (model.value[0] === model.value[1] && model.value[1] === min.value && e.relatedTarget !== ((_stopThumbRef$value2 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value2.$el)) {
+                var _startThumbRef$value6, _stopThumbRef$value3;
+
+                (_startThumbRef$value6 = startThumbRef.value) == null ? void 0 : _startThumbRef$value6.$el.blur();
+                (_stopThumbRef$value3 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value3.$el.focus();
+              }
             },
             "onBlur": () => {
               blur();
-              focusedThumb.value = null;
+              activeThumbRef.value = undefined;
             },
             "min": min.value,
             "max": model.value[1],
@@ -11401,27 +11439,28 @@ const VRangeSlider = defineComponent$1({
             _: 1
           }, 8, ["focused", "modelValue", "onUpdate:modelValue", "onFocus", "onBlur", "min", "max", "position"]), createVNode(VSliderThumb, {
             "ref": stopThumbRef,
-            "focused": isFocused && focusedThumb.value === stopThumbRef.value,
+            "focused": isFocused && activeThumbRef.value === ((_stopThumbRef$value4 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value4.$el),
             "modelValue": model.value[1],
             "onUpdate:modelValue": v => model.value = [model.value[0], v],
             "onFocus": e => {
-              var _startThumbRef$value2;
+              var _stopThumbRef$value5, _startThumbRef$value7;
 
               focus();
-              focusedThumb.value = stopThumbRef.value; // Make sure first thumb is focused if
+              activeThumbRef.value = (_stopThumbRef$value5 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value5.$el; // Make sure first thumb is focused if
               // the thumbs are on top of each other
               // and they are both at maximum value
               // but only if focused from outside.
 
-              if (model.value[0] === model.value[1] && model.value[0] === max.value && e.relatedTarget !== ((_startThumbRef$value2 = startThumbRef.value) == null ? void 0 : _startThumbRef$value2.$el)) {
-                var _startThumbRef$value3;
+              if (model.value[0] === model.value[1] && model.value[0] === max.value && e.relatedTarget !== ((_startThumbRef$value7 = startThumbRef.value) == null ? void 0 : _startThumbRef$value7.$el)) {
+                var _stopThumbRef$value6, _startThumbRef$value8;
 
-                (_startThumbRef$value3 = startThumbRef.value) == null ? void 0 : _startThumbRef$value3.$el.focus();
+                (_stopThumbRef$value6 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value6.$el.blur();
+                (_startThumbRef$value8 = startThumbRef.value) == null ? void 0 : _startThumbRef$value8.$el.focus();
               }
             },
             "onBlur": () => {
               blur();
-              focusedThumb.value = null;
+              activeThumbRef.value = undefined;
             },
             "min": model.value[0],
             "max": max.value,
@@ -11752,7 +11791,8 @@ const VSlider = defineComponent({
       onSliderTouchstart,
       trackContainerRef,
       position,
-      hasLabels
+      hasLabels,
+      readonly
     } = useSlider({
       props,
       // eslint-disable-next-line @typescript-eslint/no-use-before-define
@@ -11793,8 +11833,8 @@ const VSlider = defineComponent({
           } = _ref2;
           return createVNode("div", {
             "class": "v-slider__container",
-            "onMousedown": onSliderMousedown,
-            "onTouchstartPassive": onSliderTouchstart
+            "onMousedown": !readonly.value ? onSliderMousedown : undefined,
+            "onTouchstartPassive": !readonly.value ? onSliderTouchstart : undefined
           }, [createVNode("input", {
             "id": id.value,
             "name": props.name || id.value,
@@ -12796,111 +12836,535 @@ const VValidation = defineComponent({
 
 });
 
-var components = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  VApp: VApp,
-  VAppBar: VAppBar,
-  VAppBarNavIcon: VAppBarNavIcon,
-  VAppBarTitle: VAppBarTitle,
-  VAlert: VAlert,
-  VAvatar: VAvatar,
-  VBadge: VBadge,
-  VBanner: VBanner,
-  VBannerActions: VBannerActions,
-  VBannerAvatar: VBannerAvatar,
-  VBannerContent: VBannerContent,
-  VBannerText: VBannerText,
-  VBottomNavigation: VBottomNavigation,
-  VBreadcrumbs: VBreadcrumbs,
-  VBreadcrumbsItem: VBreadcrumbsItem,
-  VBreadcrumbsDivider: VBreadcrumbsDivider,
-  VBtn: VBtn,
-  VBtnGroup: VBtnGroup,
-  VBtnToggle: VBtnToggle,
-  VCard: VCard,
-  VCardActions: VCardActions,
-  VCardAvatar: VCardAvatar,
-  VCardHeader: VCardHeader,
-  VCardHeaderText: VCardHeaderText,
-  VCardImg: VCardImg,
-  VCardSubtitle: VCardSubtitle,
-  VCardText: VCardText,
-  VCardTitle: VCardTitle,
-  VCheckbox: VCheckbox,
-  VChip: VChip,
-  VCode: VCode,
-  VCounter: VCounter,
-  VDefaultsProvider: VDefaultsProvider,
-  VDialog: VDialog,
-  VDivider: VDivider,
-  VExpansionPanels: VExpansionPanels,
-  VExpansionPanel: VExpansionPanel,
-  VExpansionPanelText: VExpansionPanelText,
-  VExpansionPanelTitle: VExpansionPanelTitle,
-  VField: VField,
-  VFieldLabel: VFieldLabel,
-  VFileInput: VFileInput,
-  VFooter: VFooter,
-  VForm: VForm,
-  VContainer: VContainer,
-  VCol: VCol,
-  VRow: VRow,
-  VSpacer: VSpacer,
-  VHover: VHover,
-  VIcon: VIcon,
-  VComponentIcon: VComponentIcon,
-  VSvgIcon: VSvgIcon,
-  VLigatureIcon: VLigatureIcon,
-  VClassIcon: VClassIcon,
-  VImg: VImg,
-  VInput: VInput,
-  VItemGroup: VItemGroup,
-  VItem: VItem,
-  VKbd: VKbd,
-  VLabel: VLabel,
-  VLayout: VLayout,
-  VLayoutItem: VLayoutItem,
-  VLazy: VLazy,
-  VList: VList,
-  VListSubheader: VListSubheader,
-  VListImg: VListImg,
-  VListItem: VListItem,
-  VListItemAvatar: VListItemAvatar,
-  VListItemHeader: VListItemHeader,
-  VListItemMedia: VListItemMedia,
-  VListItemSubtitle: VListItemSubtitle,
-  VListItemTitle: VListItemTitle,
-  VListGroup: VListGroup,
-  VLocaleProvider: VLocaleProvider,
-  VMain: VMain,
-  VMenu: VMenu,
-  VMessages: VMessages,
-  VNavigationDrawer: VNavigationDrawer,
-  VNoSsr: VNoSsr,
-  VOverlay: VOverlay,
-  VPagination: VPagination,
-  VParallax: VParallax,
-  VProgressCircular: VProgressCircular,
-  VProgressLinear: VProgressLinear,
-  VRadio: VRadio,
-  VRadioGroup: VRadioGroup,
-  VRangeSlider: VRangeSlider,
-  VRating: VRating,
-  VResponsive: VResponsive,
-  VSelectionControl: VSelectionControl,
-  VSelectionControlGroup: VSelectionControlGroup,
-  VSheet: VSheet,
-  VSlider: VSlider,
-  VSwitch: VSwitch,
-  VSystemBar: VSystemBar,
-  VTable: VTable,
-  VTextarea: VTextarea,
-  VTextField: VTextField,
-  VThemeProvider: VThemeProvider,
+// Types
+
+const handleGesture = wrapper => {
+  const {
+    touchstartX,
+    touchendX,
+    touchstartY,
+    touchendY
+  } = wrapper;
+  const dirRatio = 0.5;
+  const minDistance = 16;
+  wrapper.offsetX = touchendX - touchstartX;
+  wrapper.offsetY = touchendY - touchstartY;
+
+  if (Math.abs(wrapper.offsetY) < dirRatio * Math.abs(wrapper.offsetX)) {
+    wrapper.left && touchendX < touchstartX - minDistance && wrapper.left(wrapper);
+    wrapper.right && touchendX > touchstartX + minDistance && wrapper.right(wrapper);
+  }
+
+  if (Math.abs(wrapper.offsetX) < dirRatio * Math.abs(wrapper.offsetY)) {
+    wrapper.up && touchendY < touchstartY - minDistance && wrapper.up(wrapper);
+    wrapper.down && touchendY > touchstartY + minDistance && wrapper.down(wrapper);
+  }
+};
+
+function touchstart(event, wrapper) {
+  var _wrapper$start;
+
+  const touch = event.changedTouches[0];
+  wrapper.touchstartX = touch.clientX;
+  wrapper.touchstartY = touch.clientY;
+  (_wrapper$start = wrapper.start) == null ? void 0 : _wrapper$start.call(wrapper, {
+    originalEvent: event,
+    ...wrapper
+  });
+}
+
+function touchend(event, wrapper) {
+  var _wrapper$end;
+
+  const touch = event.changedTouches[0];
+  wrapper.touchendX = touch.clientX;
+  wrapper.touchendY = touch.clientY;
+  (_wrapper$end = wrapper.end) == null ? void 0 : _wrapper$end.call(wrapper, {
+    originalEvent: event,
+    ...wrapper
+  });
+  handleGesture(wrapper);
+}
+
+function touchmove(event, wrapper) {
+  var _wrapper$move;
+
+  const touch = event.changedTouches[0];
+  wrapper.touchmoveX = touch.clientX;
+  wrapper.touchmoveY = touch.clientY;
+  (_wrapper$move = wrapper.move) == null ? void 0 : _wrapper$move.call(wrapper, {
+    originalEvent: event,
+    ...wrapper
+  });
+}
+
+function createHandlers() {
+  let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  const wrapper = {
+    touchstartX: 0,
+    touchstartY: 0,
+    touchendX: 0,
+    touchendY: 0,
+    touchmoveX: 0,
+    touchmoveY: 0,
+    offsetX: 0,
+    offsetY: 0,
+    left: value.left,
+    right: value.right,
+    up: value.up,
+    down: value.down,
+    start: value.start,
+    move: value.move,
+    end: value.end
+  };
+  return {
+    touchstart: e => touchstart(e, wrapper),
+    touchend: e => touchend(e, wrapper),
+    touchmove: e => touchmove(e, wrapper)
+  };
+}
+
+function mounted$3(el, binding) {
+  var _value$options, _binding$instance, _target$_touchHandler;
+
+  const value = binding.value;
+  const target = value != null && value.parent ? el.parentElement : el;
+  const options = (_value$options = value == null ? void 0 : value.options) != null ? _value$options : {
+    passive: true
+  };
+  const uid = (_binding$instance = binding.instance) == null ? void 0 : _binding$instance.$.uid; // TODO: use custom uid generator
+
+  if (!target || !uid) return;
+  const handlers = createHandlers(binding.value);
+  target._touchHandlers = (_target$_touchHandler = target._touchHandlers) != null ? _target$_touchHandler : Object.create(null);
+  target._touchHandlers[uid] = handlers;
+  keys(handlers).forEach(eventName => {
+    target.addEventListener(eventName, handlers[eventName], options);
+  });
+}
+
+function unmounted$3(el, binding) {
+  var _binding$value, _binding$instance2;
+
+  const target = (_binding$value = binding.value) != null && _binding$value.parent ? el.parentElement : el;
+  const uid = (_binding$instance2 = binding.instance) == null ? void 0 : _binding$instance2.$.uid;
+  if (!(target != null && target._touchHandlers) || !uid) return;
+  const handlers = target._touchHandlers[uid];
+  keys(handlers).forEach(eventName => {
+    target.removeEventListener(eventName, handlers[eventName]);
+  });
+  delete target._touchHandlers[uid];
+}
+
+const Touch = {
+  mounted: mounted$3,
+  unmounted: unmounted$3
+};
+
+const VWindowSymbol = Symbol.for('vuetify:v-window');
+const VWindowGroupSymbol = Symbol.for('vuetify:v-window-group');
+const VWindow = defineComponent$1({
+  name: 'VWindow',
+  directives: {
+    Touch
+  },
+  props: {
+    continuous: Boolean,
+    nextIcon: {
+      type: [Boolean, String],
+      default: '$next'
+    },
+    prevIcon: {
+      type: [Boolean, String],
+      default: '$prev'
+    },
+    reverse: Boolean,
+    showArrows: {
+      type: [Boolean, String],
+      validator: v => typeof v === 'boolean' || v === 'hover'
+    },
+    touch: {
+      type: [Object, Boolean],
+      default: undefined
+    },
+    direction: {
+      type: String,
+      default: 'horizontal'
+    },
+    modelValue: null,
+    disabled: Boolean,
+    selectedClass: {
+      type: String,
+      default: 'v-window-item--active'
+    },
+    // TODO: mandatory should probably not be exposed but do this for now
+    mandatory: {
+      default: 'force'
+    },
+    ...makeTagProps(),
+    ...makeThemeProps()
+  },
+  emits: {
+    'update:modelValue': v => true
+  },
+
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const {
+      themeClasses
+    } = provideTheme(props);
+    const {
+      isRtl
+    } = useRtl();
+    const {
+      t
+    } = useLocale();
+    const group = useGroup(props, VWindowGroupSymbol);
+    const rootRef = ref();
+    const isRtlReverse = computed(() => isRtl.value ? !props.reverse : props.reverse);
+    const isReversed = ref(false);
+    const transition = computed(() => {
+      const axis = props.direction === 'vertical' ? 'y' : 'x';
+      const reverse = isRtlReverse.value ? !isReversed.value : isReversed.value;
+      const direction = reverse ? '-reverse' : '';
+      return `v-window-${axis}${direction}-transition`;
+    });
+    const transitionCount = ref(0);
+    const transitionHeight = ref(undefined);
+    const activeIndex = computed(() => {
+      return group.items.value.findIndex(item => group.selected.value.includes(item.id));
+    });
+    watch(activeIndex, (newVal, oldVal) => {
+      const itemsLength = group.items.value.length;
+      const lastIndex = itemsLength - 1;
+
+      if (itemsLength <= 2) {
+        isReversed.value = newVal < oldVal;
+      } else if (newVal === lastIndex && oldVal === 0) {
+        isReversed.value = true;
+      } else if (newVal === 0 && oldVal === lastIndex) {
+        isReversed.value = false;
+      } else {
+        isReversed.value = newVal < oldVal;
+      }
+    });
+    provide(VWindowSymbol, {
+      transition,
+      isReversed,
+      transitionCount,
+      transitionHeight,
+      rootRef
+    });
+    const canMoveBack = computed(() => props.continuous || activeIndex.value !== 0);
+    const canMoveForward = computed(() => props.continuous || activeIndex.value !== group.items.value.length - 1);
+
+    function prev() {
+      canMoveBack.value && group.prev();
+    }
+
+    function next() {
+      canMoveForward.value && group.next();
+    }
+
+    provideDefaults({
+      VBtn: {
+        variant: 'text'
+      }
+    }, {
+      scoped: true
+    });
+    const arrows = computed(() => {
+      const arrows = [];
+      const prevProps = {
+        icon: isRtl.value ? props.nextIcon : props.prevIcon,
+        class: `v-window__${isRtlReverse.value ? 'right' : 'left'}`,
+        onClick: group.prev,
+        ariaLabel: t('$vuetify.carousel.prev')
+      };
+      arrows.push(canMoveBack.value ? slots.prev ? slots.prev({
+        props: prevProps
+      }) : createVNode(VBtn, prevProps, null, 16) : createVNode("div", null, null));
+      const nextProps = {
+        icon: isRtl.value ? props.prevIcon : props.nextIcon,
+        class: `v-window__${isRtlReverse.value ? 'left' : 'right'}`,
+        onClick: group.next,
+        ariaLabel: t('$vuetify.carousel.next')
+      };
+      arrows.push(canMoveForward.value ? slots.next ? slots.next({
+        props: nextProps
+      }) : createVNode(VBtn, nextProps, null, 16) : createVNode("div", null, null));
+      return arrows;
+    });
+    const touchOptions = computed(() => {
+      if (props.touch === false) return props.touch;
+      const options = {
+        left: () => {
+          isRtlReverse.value ? prev() : next();
+        },
+        right: () => {
+          isRtlReverse.value ? next() : prev();
+        },
+        end: _ref2 => {
+          let {
+            originalEvent
+          } = _ref2;
+          originalEvent.stopPropagation();
+        },
+        start: _ref3 => {
+          let {
+            originalEvent
+          } = _ref3;
+          originalEvent.stopPropagation();
+        }
+      };
+      return { ...options,
+        ...(props.touch === true ? {} : props.touch)
+      };
+    });
+    return () => {
+      var _slots$default;
+
+      return withDirectives(createVNode(props.tag, {
+        "ref": rootRef,
+        "class": ['v-window', {
+          'v-window--show-arrows-on-hover': props.showArrows === 'hover'
+        }, themeClasses.value]
+      }, {
+        default: () => [createVNode("div", {
+          "class": "v-window__container",
+          "style": {
+            height: transitionHeight.value
+          }
+        }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), props.showArrows !== false && createVNode("div", {
+          "class": "v-window__controls"
+        }, [arrows.value])], 4)]
+      }, 8, ["class"]), [[resolveDirective("touch"), touchOptions.value]]);
+    };
+  }
+
+});
+
+const VWindowItem = defineComponent({
+  name: 'VWindowItem',
+  directives: {
+    Touch
+  },
+  props: {
+    reverseTransition: {
+      type: [Boolean, String],
+      default: undefined
+    },
+    transition: {
+      type: [Boolean, String],
+      default: undefined
+    },
+    ...makeLazyProps(),
+    ...makeGroupItemProps()
+  },
+
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const window = inject(VWindowSymbol);
+    const groupItem = useGroupItem(props, VWindowGroupSymbol);
+    if (!window || !groupItem) throw new Error('[Vuetify] VWindowItem must be used inside VWindow');
+    const isTransitioning = ref(false);
+    const hasTransition = computed(() => window.isReversed.value ? props.reverseTransition !== false : props.transition !== false);
+
+    function onAfterTransition() {
+      if (!isTransitioning.value || !window) {
+        return;
+      } // Finalize transition state.
+
+
+      isTransitioning.value = false;
+
+      if (window.transitionCount.value > 0) {
+        window.transitionCount.value -= 1; // Remove container height if we are out of transition.
+
+        if (window.transitionCount.value === 0) {
+          window.transitionHeight.value = undefined;
+        }
+      }
+    }
+
+    function onBeforeTransition() {
+      if (isTransitioning.value || !window) {
+        return;
+      } // Initialize transition state here.
+
+
+      isTransitioning.value = true;
+
+      if (window.transitionCount.value === 0) {
+        var _window$rootRef$value;
+
+        // Set initial height for height transition.
+        window.transitionHeight.value = convertToUnit((_window$rootRef$value = window.rootRef.value) == null ? void 0 : _window$rootRef$value.clientHeight);
+      }
+
+      window.transitionCount.value += 1;
+    }
+
+    function onTransitionCancelled() {
+      onAfterTransition(); // This should have the same path as normal transition end.
+    }
+
+    function onEnterTransition(el) {
+      if (!isTransitioning.value) {
+        return;
+      }
+
+      nextTick(() => {
+        // Do not set height if no transition or cancelled.
+        if (!hasTransition.value || !isTransitioning.value || !window) {
+          return;
+        } // Set transition target height.
+
+
+        window.transitionHeight.value = convertToUnit(el.clientHeight);
+      });
+    }
+
+    const transition = computed(() => {
+      const name = window.isReversed.value ? props.reverseTransition : props.transition;
+      return !hasTransition.value ? false : {
+        name: typeof name !== 'string' ? window.transition.value : name,
+        onBeforeEnter: onBeforeTransition,
+        onAfterEnter: onAfterTransition,
+        onEnterCancelled: onTransitionCancelled,
+        onBeforeLeave: onBeforeTransition,
+        onAfterLeave: onAfterTransition,
+        onLeaveCancelled: onTransitionCancelled,
+        onEnter: onEnterTransition
+      };
+    });
+    const {
+      hasContent
+    } = useLazy(props, groupItem.isSelected);
+    return () => {
+      return createVNode(MaybeTransition, {
+        "transition": transition.value
+      }, {
+        default: () => [withDirectives(createVNode("div", {
+          "class": ['v-window-item', groupItem.selectedClass.value]
+        }, [slots.default && hasContent.value && slots.default()], 2), [[vShow, groupItem.isSelected.value]])]
+      }, 8, ["transition"]);
+    };
+  }
+
+});
+
+var components = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  VApp: VApp,
+  VAppBar: VAppBar,
+  VAppBarNavIcon: VAppBarNavIcon,
+  VAppBarTitle: VAppBarTitle,
+  VAlert: VAlert,
+  VAvatar: VAvatar,
+  VBadge: VBadge,
+  VBanner: VBanner,
+  VBannerActions: VBannerActions,
+  VBannerAvatar: VBannerAvatar,
+  VBannerContent: VBannerContent,
+  VBannerText: VBannerText,
+  VBottomNavigation: VBottomNavigation,
+  VBreadcrumbs: VBreadcrumbs,
+  VBreadcrumbsItem: VBreadcrumbsItem,
+  VBreadcrumbsDivider: VBreadcrumbsDivider,
+  VBtn: VBtn,
+  VBtnGroup: VBtnGroup,
+  VBtnToggle: VBtnToggle,
+  VCard: VCard,
+  VCardActions: VCardActions,
+  VCardAvatar: VCardAvatar,
+  VCardHeader: VCardHeader,
+  VCardHeaderText: VCardHeaderText,
+  VCardImg: VCardImg,
+  VCardSubtitle: VCardSubtitle,
+  VCardText: VCardText,
+  VCardTitle: VCardTitle,
+  VCheckbox: VCheckbox,
+  VChip: VChip,
+  VCode: VCode,
+  VCounter: VCounter,
+  VDefaultsProvider: VDefaultsProvider,
+  VDialog: VDialog,
+  VDivider: VDivider,
+  VExpansionPanels: VExpansionPanels,
+  VExpansionPanel: VExpansionPanel,
+  VExpansionPanelText: VExpansionPanelText,
+  VExpansionPanelTitle: VExpansionPanelTitle,
+  VField: VField,
+  VFieldLabel: VFieldLabel,
+  VFileInput: VFileInput,
+  VFooter: VFooter,
+  VForm: VForm,
+  VContainer: VContainer,
+  VCol: VCol,
+  VRow: VRow,
+  VSpacer: VSpacer,
+  VHover: VHover,
+  VIcon: VIcon,
+  VComponentIcon: VComponentIcon,
+  VSvgIcon: VSvgIcon,
+  VLigatureIcon: VLigatureIcon,
+  VClassIcon: VClassIcon,
+  VImg: VImg,
+  VInput: VInput,
+  VItemGroup: VItemGroup,
+  VItem: VItem,
+  VKbd: VKbd,
+  VLabel: VLabel,
+  VLayout: VLayout,
+  VLayoutItem: VLayoutItem,
+  VLazy: VLazy,
+  VList: VList,
+  VListSubheader: VListSubheader,
+  VListImg: VListImg,
+  VListItem: VListItem,
+  VListItemAvatar: VListItemAvatar,
+  VListItemHeader: VListItemHeader,
+  VListItemMedia: VListItemMedia,
+  VListItemSubtitle: VListItemSubtitle,
+  VListItemTitle: VListItemTitle,
+  VListGroup: VListGroup,
+  VLocaleProvider: VLocaleProvider,
+  VMain: VMain,
+  VMenu: VMenu,
+  VMessages: VMessages,
+  VNavigationDrawer: VNavigationDrawer,
+  VNoSsr: VNoSsr,
+  VOverlay: VOverlay,
+  VPagination: VPagination,
+  VParallax: VParallax,
+  VProgressCircular: VProgressCircular,
+  VProgressLinear: VProgressLinear,
+  VRadio: VRadio,
+  VRadioGroup: VRadioGroup,
+  VRangeSlider: VRangeSlider,
+  VRating: VRating,
+  VResponsive: VResponsive,
+  VSelectionControl: VSelectionControl,
+  VSelectionControlGroup: VSelectionControlGroup,
+  VSheet: VSheet,
+  VSlider: VSlider,
+  VSwitch: VSwitch,
+  VSystemBar: VSystemBar,
+  VTable: VTable,
+  VTextarea: VTextarea,
+  VTextField: VTextField,
+  VThemeProvider: VThemeProvider,
   VTimeline: VTimeline,
   VTimelineItem: VTimelineItem,
   VTooltip: VTooltip,
   VValidation: VValidation,
+  VWindow: VWindow,
+  VWindowItem: VWindowItem,
   VDialogTransition: VDialogTransition,
   VCarouselTransition: VCarouselTransition,
   VCarouselReverseTransition: VCarouselReverseTransition,
@@ -12925,7 +13389,7 @@ var components = /*#__PURE__*/Object.freeze({
 });
 
 // Types
-function mounted$3(el, binding) {
+function mounted$2(el, binding) {
   var _modifierKeys$attr, _modifierKeys$char, _modifierKeys$child, _modifierKeys$sub;
 
   const modifiers = binding.modifiers || {};
@@ -12952,7 +13416,7 @@ function mounted$3(el, binding) {
     let mutations = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     let observer = arguments.length > 1 ? arguments[1] : undefined;
     handler == null ? void 0 : handler(mutations, observer);
-    if (once) unmounted$3(el, binding);
+    if (once) unmounted$2(el, binding);
   });
   if (immediate) handler == null ? void 0 : handler([], observer);
   el._mutate = Object(el._mutate);
@@ -12962,7 +13426,7 @@ function mounted$3(el, binding) {
   observer.observe(el, options);
 }
 
-function unmounted$3(el, binding) {
+function unmounted$2(el, binding) {
   var _el$_mutate;
 
   if (!((_el$_mutate = el._mutate) != null && _el$_mutate[binding.instance.$.uid])) return;
@@ -12973,11 +13437,11 @@ function unmounted$3(el, binding) {
 }
 
 const Mutate = {
-  mounted: mounted$3,
-  unmounted: unmounted$3
+  mounted: mounted$2,
+  unmounted: unmounted$2
 };
 
-function mounted$2(el, binding) {
+function mounted$1(el, binding) {
   var _binding$modifiers, _binding$modifiers2;
 
   const handler = binding.value;
@@ -12996,7 +13460,7 @@ function mounted$2(el, binding) {
   }
 }
 
-function unmounted$2(el, binding) {
+function unmounted$1(el, binding) {
   var _el$_onResize;
 
   if (!((_el$_onResize = el._onResize) != null && _el$_onResize[binding.instance.$.uid])) return;
@@ -13009,11 +13473,11 @@ function unmounted$2(el, binding) {
 }
 
 const Resize = {
-  mounted: mounted$2,
-  unmounted: unmounted$2
+  mounted: mounted$1,
+  unmounted: unmounted$1
 };
 
-function mounted$1(el, binding) {
+function mounted(el, binding) {
   var _binding$modifiers;
 
   const {
@@ -13036,7 +13500,7 @@ function mounted$1(el, binding) {
   };
 }
 
-function unmounted$1(el, binding) {
+function unmounted(el, binding) {
   var _el$_onScroll;
 
   if (!((_el$_onScroll = el._onScroll) != null && _el$_onScroll[binding.instance.$.uid])) return;
@@ -13051,136 +13515,14 @@ function unmounted$1(el, binding) {
 
 function updated(el, binding) {
   if (binding.value === binding.oldValue) return;
-  unmounted$1(el, binding);
-  mounted$1(el, binding);
+  unmounted(el, binding);
+  mounted(el, binding);
 }
 
 const Scroll = {
-  mounted: mounted$1,
-  unmounted: unmounted$1,
-  updated
-};
-
-// Types
-
-const handleGesture = wrapper => {
-  const {
-    touchstartX,
-    touchendX,
-    touchstartY,
-    touchendY
-  } = wrapper;
-  const dirRatio = 0.5;
-  const minDistance = 16;
-  wrapper.offsetX = touchendX - touchstartX;
-  wrapper.offsetY = touchendY - touchstartY;
-
-  if (Math.abs(wrapper.offsetY) < dirRatio * Math.abs(wrapper.offsetX)) {
-    wrapper.left && touchendX < touchstartX - minDistance && wrapper.left(wrapper);
-    wrapper.right && touchendX > touchstartX + minDistance && wrapper.right(wrapper);
-  }
-
-  if (Math.abs(wrapper.offsetX) < dirRatio * Math.abs(wrapper.offsetY)) {
-    wrapper.up && touchendY < touchstartY - minDistance && wrapper.up(wrapper);
-    wrapper.down && touchendY > touchstartY + minDistance && wrapper.down(wrapper);
-  }
-};
-
-function touchstart(event, wrapper) {
-  var _wrapper$start;
-
-  const touch = event.changedTouches[0];
-  wrapper.touchstartX = touch.clientX;
-  wrapper.touchstartY = touch.clientY;
-  (_wrapper$start = wrapper.start) == null ? void 0 : _wrapper$start.call(wrapper, { ...event,
-    ...wrapper
-  });
-}
-
-function touchend(event, wrapper) {
-  var _wrapper$end;
-
-  const touch = event.changedTouches[0];
-  wrapper.touchendX = touch.clientX;
-  wrapper.touchendY = touch.clientY;
-  (_wrapper$end = wrapper.end) == null ? void 0 : _wrapper$end.call(wrapper, { ...event,
-    ...wrapper
-  });
-  handleGesture(wrapper);
-}
-
-function touchmove(event, wrapper) {
-  var _wrapper$move;
-
-  const touch = event.changedTouches[0];
-  wrapper.touchmoveX = touch.clientX;
-  wrapper.touchmoveY = touch.clientY;
-  (_wrapper$move = wrapper.move) == null ? void 0 : _wrapper$move.call(wrapper, { ...event,
-    ...wrapper
-  });
-}
-
-function createHandlers() {
-  let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  const wrapper = {
-    touchstartX: 0,
-    touchstartY: 0,
-    touchendX: 0,
-    touchendY: 0,
-    touchmoveX: 0,
-    touchmoveY: 0,
-    offsetX: 0,
-    offsetY: 0,
-    left: value.left,
-    right: value.right,
-    up: value.up,
-    down: value.down,
-    start: value.start,
-    move: value.move,
-    end: value.end
-  };
-  return {
-    touchstart: e => touchstart(e, wrapper),
-    touchend: e => touchend(e, wrapper),
-    touchmove: e => touchmove(e, wrapper)
-  };
-}
-
-function mounted(el, binding) {
-  var _value$options, _binding$instance, _target$_touchHandler;
-
-  const value = binding.value;
-  const target = value != null && value.parent ? el.parentElement : el;
-  const options = (_value$options = value == null ? void 0 : value.options) != null ? _value$options : {
-    passive: true
-  };
-  const uid = (_binding$instance = binding.instance) == null ? void 0 : _binding$instance.$.uid; // TODO: use custom uid generator
-
-  if (!target || !uid) return;
-  const handlers = createHandlers(binding.value);
-  target._touchHandlers = (_target$_touchHandler = target._touchHandlers) != null ? _target$_touchHandler : Object.create(null);
-  target._touchHandlers[uid] = handlers;
-  keys(handlers).forEach(eventName => {
-    target.addEventListener(eventName, handlers[eventName], options);
-  });
-}
-
-function unmounted(el, binding) {
-  var _binding$value, _binding$instance2;
-
-  const target = (_binding$value = binding.value) != null && _binding$value.parent ? el.parentElement : el;
-  const uid = (_binding$instance2 = binding.instance) == null ? void 0 : _binding$instance2.$.uid;
-  if (!(target != null && target._touchHandlers) || !uid) return;
-  const handlers = target._touchHandlers[uid];
-  keys(handlers).forEach(eventName => {
-    target.removeEventListener(eventName, handlers[eventName]);
-  });
-  delete target._touchHandlers[uid];
-}
-
-const Touch = {
   mounted,
-  unmounted
+  unmounted,
+  updated
 };
 
 var directives = /*#__PURE__*/Object.freeze({
@@ -13319,7 +13661,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.0.0-next-20220112.0";
+const version = "3.0.0-next-20220128.0";
 
 export { components, createVuetify, directives, provideRtl, useDisplay, useLayout, useRtl, useTheme, version };
 //# sourceMappingURL=vuetify.esm.js.map