vuetify 3.2.1 → 3.2.3

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.2.1
+* Vuetify v3.2.3
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -1670,9 +1670,9 @@ const defaultThemeOptions = {
       variables: {
         'border-color': '#FFFFFF',
         'border-opacity': 0.12,
-        'high-emphasis-opacity': 0.87,
-        'medium-emphasis-opacity': 0.60,
-        'disabled-opacity': 0.38,
+        'high-emphasis-opacity': 1,
+        'medium-emphasis-opacity': 0.70,
+        'disabled-opacity': 0.50,
         'idle-opacity': 0.10,
         'hover-opacity': 0.04,
         'focus-opacity': 0.12,
@@ -2201,15 +2201,16 @@ function useRtl() {
   };
 }
 
+const makeVAppProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeLayoutProps({
+    fullHeight: true
+  }),
+  ...makeThemeProps()
+}, 'v-app');
 const VApp = genericComponent()({
   name: 'VApp',
-  props: {
-    ...makeComponentProps(),
-    ...makeLayoutProps({
-      fullHeight: true
-    }),
-    ...makeThemeProps()
-  },
+  props: makeVAppProps(),
   setup(props, _ref) {
     let {
       slots
@@ -2244,15 +2245,16 @@ const VApp = genericComponent()({
 
 // Types
 
+const makeDefaultsProviderProps = propsFactory({
+  defaults: Object,
+  disabled: Boolean,
+  reset: [Number, String],
+  root: Boolean,
+  scoped: Boolean
+}, 'v-defaults-provider');
 const VDefaultsProvider = genericComponent(false)({
   name: 'VDefaultsProvider',
-  props: {
-    defaults: Object,
-    disabled: Boolean,
-    reset: [Number, String],
-    root: Boolean,
-    scoped: Boolean
-  },
+  props: makeDefaultsProviderProps(),
   setup(props, _ref) {
     let {
       slots
@@ -2278,25 +2280,23 @@ const VDefaultsProvider = genericComponent(false)({
 
 // Types
 
+const makeTransitionProps$1 = propsFactory({
+  disabled: Boolean,
+  group: Boolean,
+  hideOnLeave: Boolean,
+  leaveAbsolute: Boolean,
+  mode: String,
+  origin: String
+}, 'transition');
 function createCssTransition(name) {
   let origin = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'center center';
   let mode = arguments.length > 2 ? arguments[2] : undefined;
   return genericComponent()({
     name,
-    props: {
-      disabled: Boolean,
-      group: Boolean,
-      hideOnLeave: Boolean,
-      leaveAbsolute: Boolean,
-      mode: {
-        type: String,
-        default: mode
-      },
-      origin: {
-        type: String,
-        default: origin
-      }
-    },
+    props: makeTransitionProps$1({
+      mode,
+      origin
+    }),
     setup(props, _ref) {
       let {
         slots
@@ -2454,11 +2454,12 @@ function ExpandTransitionGenerator () {
 
 // Types
 
+const makeVDialogTransitionProps = propsFactory({
+  target: Object
+}, 'v-dialog-transition');
 const VDialogTransition = genericComponent()({
   name: 'VDialogTransition',
-  props: {
-    target: Object
-  },
+  props: makeVDialogTransitionProps(),
   setup(props, _ref) {
     let {
       slots
@@ -2648,14 +2649,15 @@ function useAspectStyles(props) {
     })
   };
 }
+const makeVResponsiveProps = propsFactory({
+  aspectRatio: [String, Number],
+  contentClass: String,
+  ...makeComponentProps(),
+  ...makeDimensionProps()
+}, 'v-responsive');
 const VResponsive = genericComponent()({
   name: 'VResponsive',
-  props: {
-    aspectRatio: [String, Number],
-    contentClass: String,
-    ...makeComponentProps(),
-    ...makeDimensionProps()
-  },
+  props: makeVResponsiveProps(),
   setup(props, _ref) {
     let {
       slots
@@ -2757,38 +2759,39 @@ const MaybeTransition = (props, _ref) => {
 
 // Types
 
+const makeVImgProps = propsFactory({
+  aspectRatio: [String, Number],
+  alt: String,
+  cover: Boolean,
+  eager: Boolean,
+  gradient: String,
+  lazySrc: String,
+  options: {
+    type: Object,
+    // For more information on types, navigate to:
+    // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
+    default: () => ({
+      root: undefined,
+      rootMargin: undefined,
+      threshold: undefined
+    })
+  },
+  sizes: String,
+  src: {
+    type: [String, Object],
+    default: ''
+  },
+  srcset: String,
+  width: [String, Number],
+  ...makeComponentProps(),
+  ...makeTransitionProps()
+}, 'v-img');
 const VImg = genericComponent()({
   name: 'VImg',
   directives: {
     intersect: Intersect
   },
-  props: {
-    aspectRatio: [String, Number],
-    alt: String,
-    cover: Boolean,
-    eager: Boolean,
-    gradient: String,
-    lazySrc: String,
-    options: {
-      type: Object,
-      // For more information on types, navigate to:
-      // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
-      default: () => ({
-        root: undefined,
-        rootMargin: undefined,
-        threshold: undefined
-      })
-    },
-    sizes: String,
-    src: {
-      type: [String, Object],
-      default: ''
-    },
-    srcset: String,
-    width: [String, Number],
-    ...makeComponentProps(),
-    ...makeTransitionProps()
-  },
+  props: makeVImgProps(),
   emits: {
     loadstart: value => true,
     load: value => true,
@@ -3240,6 +3243,9 @@ const VToolbar = genericComponent()({
     const {
       themeClasses
     } = provideTheme(props);
+    const {
+      rtlClasses
+    } = useRtl();
     const isExtended = ref(!!(props.extended || slots.extension?.()));
     const contentHeight = computed(() => parseInt(Number(props.height) + (props.density === 'prominent' ? Number(props.height) : 0) - (props.density === 'comfortable' ? 8 : 0) - (props.density === 'compact' ? 16 : 0), 10));
     const extensionHeight = computed(() => isExtended.value ? parseInt(Number(props.extensionHeight) + (props.density === 'prominent' ? Number(props.extensionHeight) : 0) - (props.density === 'comfortable' ? 4 : 0) - (props.density === 'compact' ? 8 : 0), 10) : 0);
@@ -3260,7 +3266,7 @@ const VToolbar = genericComponent()({
           'v-toolbar--flat': props.flat,
           'v-toolbar--floating': props.floating,
           [`v-toolbar--density-${props.density}`]: true
-        }, backgroundColorClasses.value, borderClasses.value, elevationClasses.value, roundedClasses.value, themeClasses.value, props.class],
+        }, backgroundColorClasses.value, borderClasses.value, elevationClasses.value, roundedClasses.value, themeClasses.value, rtlClasses.value, props.class],
         "style": [backgroundColorStyles.value, props.style]
       }, {
         default: () => [hasImage && createVNode("div", {
@@ -3336,14 +3342,13 @@ const makeScrollProps = propsFactory({
     type: String
   },
   scrollThreshold: {
-    type: [String, Number]
+    type: [String, Number],
+    default: 300
   }
 }, 'scroll');
 function useScroll(props) {
   let args = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   const {
-    thresholdMetCallback,
-    scrollThreshold,
     canScroll
   } = args;
   let previousScroll = 0;
@@ -3353,8 +3358,16 @@ function useScroll(props) {
   const currentThreshold = ref(0);
   const isScrollActive = ref(false);
   const isScrollingUp = ref(false);
-  const computedScrollThreshold = computed(() => {
-    return Number(props.scrollThreshold ?? scrollThreshold ?? 300);
+  const scrollThreshold = computed(() => {
+    return Number(props.scrollThreshold);
+  });
+
+  /**
+   * 1: at top
+   * 0: at threshold
+   */
+  const scrollRatio = computed(() => {
+    return clamp((scrollThreshold.value - currentScroll.value) / scrollThreshold.value || 0);
   });
   const onScroll = () => {
     const targetEl = target.value;
@@ -3362,7 +3375,7 @@ function useScroll(props) {
     previousScroll = currentScroll.value;
     currentScroll.value = 'window' in targetEl ? targetEl.pageYOffset : targetEl.scrollTop;
     isScrollingUp.value = currentScroll.value < previousScroll;
-    currentThreshold.value = Math.abs(currentScroll.value - computedScrollThreshold.value);
+    currentThreshold.value = Math.abs(currentScroll.value - scrollThreshold.value);
   };
   watch(isScrollingUp, () => {
     savedScroll.value = savedScroll.value || currentScroll.value;
@@ -3390,15 +3403,6 @@ function useScroll(props) {
   onBeforeUnmount(() => {
     target.value?.removeEventListener('scroll', onScroll);
   });
-  thresholdMetCallback && watch(() => Math.abs(currentScroll.value - savedScroll.value) > computedScrollThreshold.value, thresholdMet => {
-    thresholdMet && thresholdMetCallback({
-      currentThreshold: currentThreshold.value,
-      isScrollingUp: isScrollingUp.value,
-      savedScroll
-    });
-  }, {
-    immediate: true
-  });
 
   // Do we need this? If yes - seems that
   // there's no need to expose onScroll
@@ -3406,10 +3410,11 @@ function useScroll(props) {
     immediate: true
   });
   return {
-    computedScrollThreshold,
+    scrollThreshold,
     currentScroll,
     currentThreshold,
     isScrollActive,
+    scrollRatio,
     // required only for testing
     // probably can be removed
     // later (2 chars chlng)
@@ -3439,27 +3444,28 @@ function useSsrBoot() {
 
 // Types
 
+const makeVAppBarProps = propsFactory({
+  scrollBehavior: String,
+  modelValue: {
+    type: Boolean,
+    default: true
+  },
+  location: {
+    type: String,
+    default: 'top',
+    validator: value => ['top', 'bottom'].includes(value)
+  },
+  ...makeVToolbarProps(),
+  ...makeLayoutItemProps(),
+  ...makeScrollProps(),
+  height: {
+    type: [Number, String],
+    default: 64
+  }
+}, 'v-app-bar');
 const VAppBar = genericComponent()({
   name: 'VAppBar',
-  props: {
-    scrollBehavior: String,
-    modelValue: {
-      type: Boolean,
-      default: true
-    },
-    location: {
-      type: String,
-      default: 'top',
-      validator: value => ['top', 'bottom'].includes(value)
-    },
-    ...makeVToolbarProps(),
-    ...makeLayoutItemProps(),
-    ...makeScrollProps(),
-    height: {
-      type: [Number, String],
-      default: 64
-    }
-  },
+  props: makeVAppBarProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -3492,15 +3498,14 @@ const VAppBar = genericComponent()({
     });
     const {
       currentScroll,
-      currentThreshold,
-      computedScrollThreshold,
-      isScrollingUp
+      scrollThreshold,
+      isScrollingUp,
+      scrollRatio
     } = useScroll(props, {
       canScroll
     });
-    const isCollapsed = computed(() => props.collapse || scrollBehavior.value.collapse && (scrollBehavior.value.inverted ? currentScroll.value < 1 : currentScroll.value > 0));
-    const isFlat = computed(() => props.flat || scrollBehavior.value.elevate && currentScroll.value === (scrollBehavior.value.inverted ? 1 : 0));
-    const scrollRatio = computed(() => Math.min((currentThreshold.value - currentScroll.value) / currentThreshold.value || 1, 1));
+    const isCollapsed = computed(() => props.collapse || scrollBehavior.value.collapse && (scrollBehavior.value.inverted ? scrollRatio.value > 0 : scrollRatio.value === 0));
+    const isFlat = computed(() => props.flat || scrollBehavior.value.elevate && (scrollBehavior.value.inverted ? currentScroll.value > 0 : currentScroll.value === 0));
     const opacity = computed(() => scrollBehavior.value.fadeImage ? scrollBehavior.value.inverted ? 1 - scrollRatio.value : scrollRatio.value : undefined);
     const height = computed(() => {
       if (scrollBehavior.value.hide && scrollBehavior.value.inverted) return 0;
@@ -3509,15 +3514,12 @@ const VAppBar = genericComponent()({
       return height + extensionHeight;
     });
     function setActive() {
-      const val = currentScroll.value;
       if (scrollBehavior.value.hide) {
         if (scrollBehavior.value.inverted) {
-          isActive.value = val > computedScrollThreshold.value;
+          isActive.value = currentScroll.value > scrollThreshold.value;
         } else {
-          isActive.value = isScrollingUp.value || val < computedScrollThreshold.value;
+          isActive.value = isScrollingUp.value || currentScroll.value < scrollThreshold.value;
         }
-      } else if (scrollBehavior.value.inverted) {
-        isActive.value = currentScroll.value === 0;
       } else {
         isActive.value = true;
       }
@@ -3893,12 +3895,13 @@ function getValues(items, ids) {
 // Types
 
 const VBtnToggleSymbol = Symbol.for('vuetify:v-btn-toggle');
+const makeVBtnToggleProps = propsFactory({
+  ...makeVBtnGroupProps(),
+  ...makeGroupProps()
+}, 'v-btn-toggle');
 const VBtnToggle = genericComponent()({
   name: 'VBtnToggle',
-  props: {
-    ...makeVBtnGroupProps(),
-    ...makeGroupProps()
-  },
+  props: makeVBtnToggleProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -4093,7 +4096,7 @@ const useIcon = props => {
   const icons = inject$1(IconSymbol);
   if (!icons) throw new Error('Missing Vuetify Icons provide!');
   const iconData = computed(() => {
-    const iconAlias = isRef(props) ? props.value : props.icon;
+    const iconAlias = unref(props);
     if (!iconAlias) return {
       component: VComponentIcon
     };
@@ -4160,8 +4163,6 @@ function useSize(props) {
   });
 }
 
-// Types
-
 const makeVIconProps = propsFactory({
   color: String,
   start: Boolean,
@@ -4182,20 +4183,13 @@ const VIcon = genericComponent()({
       attrs,
       slots
     } = _ref;
-    let slotIcon;
-    if (slots.default) {
-      slotIcon = computed(() => {
-        const slot = slots.default?.();
-        if (!slot) return;
-        return slot.filter(node => node.type === Text && node.children && typeof node.children === 'string')[0]?.children;
-      });
-    }
+    const slotIcon = ref();
     const {
       themeClasses
     } = provideTheme(props);
     const {
       iconData
-    } = useIcon(slotIcon || props);
+    } = useIcon(computed(() => slotIcon.value || props.icon));
     const {
       sizeClasses
     } = useSize(props);
@@ -4203,24 +4197,30 @@ const VIcon = genericComponent()({
       textColorClasses,
       textColorStyles
     } = useTextColor(toRef(props, 'color'));
-    useRender(() => createVNode(iconData.value.component, {
-      "tag": props.tag,
-      "icon": iconData.value.icon,
-      "class": ['v-icon', 'notranslate', themeClasses.value, sizeClasses.value, textColorClasses.value, {
-        'v-icon--clickable': !!attrs.onClick,
-        'v-icon--start': props.start,
-        'v-icon--end': props.end
-      }, props.class],
-      "style": [!sizeClasses.value ? {
-        fontSize: convertToUnit(props.size),
-        height: convertToUnit(props.size),
-        width: convertToUnit(props.size)
-      } : undefined, textColorStyles.value, props.style],
-      "role": attrs.onClick ? 'button' : undefined,
-      "aria-hidden": !attrs.onClick
-    }, {
-      default: () => [slots.default?.()]
-    }));
+    useRender(() => {
+      const slotValue = slots.default?.();
+      if (slotValue) {
+        slotIcon.value = slotValue.filter(node => node.type === Text && node.children && typeof node.children === 'string')[0]?.children;
+      }
+      return createVNode(iconData.value.component, {
+        "tag": props.tag,
+        "icon": iconData.value.icon,
+        "class": ['v-icon', 'notranslate', themeClasses.value, sizeClasses.value, textColorClasses.value, {
+          'v-icon--clickable': !!attrs.onClick,
+          'v-icon--start': props.start,
+          'v-icon--end': props.end
+        }, props.class],
+        "style": [!sizeClasses.value ? {
+          fontSize: convertToUnit(props.size),
+          height: convertToUnit(props.size),
+          width: convertToUnit(props.size)
+        } : undefined, textColorStyles.value, props.style],
+        "role": attrs.onClick ? 'button' : undefined,
+        "aria-hidden": !attrs.onClick
+      }, {
+        default: () => [slotValue]
+      });
+    });
     return {};
   }
 });
@@ -4255,31 +4255,32 @@ function useIntersectionObserver(callback, options) {
 
 // Types
 
+const makeVProgressCircularProps = propsFactory({
+  bgColor: String,
+  color: String,
+  indeterminate: [Boolean, String],
+  modelValue: {
+    type: [Number, String],
+    default: 0
+  },
+  rotate: {
+    type: [Number, String],
+    default: 0
+  },
+  width: {
+    type: [Number, String],
+    default: 4
+  },
+  ...makeComponentProps(),
+  ...makeSizeProps(),
+  ...makeTagProps({
+    tag: 'div'
+  }),
+  ...makeThemeProps()
+}, 'v-progress-circular');
 const VProgressCircular = genericComponent()({
   name: 'VProgressCircular',
-  props: {
-    bgColor: String,
-    color: String,
-    indeterminate: [Boolean, String],
-    modelValue: {
-      type: [Number, String],
-      default: 0
-    },
-    rotate: {
-      type: [Number, String],
-      default: 0
-    },
-    width: {
-      type: [Number, String],
-      default: 4
-    },
-    ...makeComponentProps(),
-    ...makeSizeProps(),
-    ...makeTagProps({
-      tag: 'div'
-    }),
-    ...makeThemeProps()
-  },
+  props: makeVProgressCircularProps(),
   setup(props, _ref) {
     let {
       slots
@@ -4716,47 +4717,48 @@ function useLocation(props) {
   };
 }
 
+const makeVProgressLinearProps = propsFactory({
+  absolute: Boolean,
+  active: {
+    type: Boolean,
+    default: true
+  },
+  bgColor: String,
+  bgOpacity: [Number, String],
+  bufferValue: {
+    type: [Number, String],
+    default: 0
+  },
+  clickable: Boolean,
+  color: String,
+  height: {
+    type: [Number, String],
+    default: 4
+  },
+  indeterminate: Boolean,
+  max: {
+    type: [Number, String],
+    default: 100
+  },
+  modelValue: {
+    type: [Number, String],
+    default: 0
+  },
+  reverse: Boolean,
+  stream: Boolean,
+  striped: Boolean,
+  roundedBar: Boolean,
+  ...makeComponentProps(),
+  ...makeLocationProps({
+    location: 'top'
+  }),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-progress-linear');
 const VProgressLinear = genericComponent()({
   name: 'VProgressLinear',
-  props: {
-    absolute: Boolean,
-    active: {
-      type: Boolean,
-      default: true
-    },
-    bgColor: String,
-    bgOpacity: [Number, String],
-    bufferValue: {
-      type: [Number, String],
-      default: 0
-    },
-    clickable: Boolean,
-    color: String,
-    height: {
-      type: [Number, String],
-      default: 4
-    },
-    indeterminate: Boolean,
-    max: {
-      type: [Number, String],
-      default: 100
-    },
-    modelValue: {
-      type: [Number, String],
-      default: 0
-    },
-    reverse: Boolean,
-    stream: Boolean,
-    striped: Boolean,
-    roundedBar: Boolean,
-    ...makeComponentProps(),
-    ...makeLocationProps({
-      location: 'top'
-    }),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVProgressLinearProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -4766,7 +4768,8 @@ const VProgressLinear = genericComponent()({
     } = _ref;
     const progress = useProxiedModel(props, 'modelValue');
     const {
-      isRtl
+      isRtl,
+      rtlClasses
     } = useRtl();
     const {
       themeClasses
@@ -4821,7 +4824,7 @@ const VProgressLinear = genericComponent()({
         'v-progress-linear--rounded': props.rounded,
         'v-progress-linear--rounded-bar': props.roundedBar,
         'v-progress-linear--striped': props.striped
-      }, roundedClasses.value, themeClasses.value, props.class],
+      }, roundedClasses.value, themeClasses.value, rtlClasses.value, props.class],
       "style": [{
         bottom: props.location === 'bottom' ? 0 : undefined,
         top: props.location === 'top' ? 0 : undefined,
@@ -5057,7 +5060,7 @@ const makeVBtnProps = propsFactory({
   ...makeVariantProps({
     variant: 'elevated'
   })
-}, 'VBtn');
+}, 'v-btn');
 const VBtn = genericComponent()({
   name: 'VBtn',
   directives: {
@@ -5127,6 +5130,11 @@ const VBtn = genericComponent()({
       if (props.value === undefined) return undefined;
       return Object(props.value) === props.value ? JSON.stringify(props.value, null, 0) : props.value;
     });
+    function onClick(e) {
+      if (isDisabled.value) return;
+      link.navigate?.(e);
+      group?.toggle();
+    }
     useSelectLink(link, group?.select);
     useRender(() => {
       const Tag = link.isLink.value ? 'a' : props.tag;
@@ -5149,11 +5157,7 @@ const VBtn = genericComponent()({
         "style": [hasColor ? colorStyles.value : undefined, dimensionStyles.value, locationStyles.value, sizeStyles.value, props.style],
         "disabled": isDisabled.value || undefined,
         "href": link.href.value,
-        "onClick": e => {
-          if (isDisabled.value) return;
-          link.navigate?.(e);
-          group?.toggle();
-        },
+        "onClick": onClick,
         "value": valueAttr.value
       }, {
         default: () => [genOverlays(true, 'v-btn'), !props.icon && hasPrepend && createVNode("span", {
@@ -5217,36 +5221,35 @@ const VBtn = genericComponent()({
 
 // Types
 
+const makeVAppBarNavIconProps = propsFactory({
+  ...makeVBtnProps({
+    icon: '$menu',
+    variant: 'text'
+  })
+}, 'v-app-bar-nav-icon');
 const VAppBarNavIcon = genericComponent()({
   name: 'VAppBarNavIcon',
-  props: {
-    icon: {
-      type: IconValue,
-      default: '$menu'
-    },
-    ...makeComponentProps()
-  },
+  props: makeVAppBarNavIconProps(),
   setup(props, _ref) {
     let {
       slots
     } = _ref;
-    useRender(() => createVNode(VBtn, {
-      "class": ['v-app-bar-nav-icon', props.class],
-      "icon": props.icon,
-      "style": props.style
-    }, slots));
+    useRender(() => createVNode(VBtn, mergeProps(props, {
+      "class": ['v-app-bar-nav-icon']
+    }), slots));
     return {};
   }
 });
 
+const makeVToolbarItemsProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeVariantProps({
+    variant: 'text'
+  })
+}, 'v-toolbar-items');
 const VToolbarItems = genericComponent()({
   name: 'VToolbarItems',
-  props: {
-    ...makeComponentProps(),
-    ...makeVariantProps({
-      variant: 'text'
-    })
-  },
+  props: makeVToolbarItemsProps(),
   setup(props, _ref) {
     let {
       slots
@@ -5288,53 +5291,54 @@ const VAlertTitle = createSimpleFunctional('v-alert-title');
 // Types
 
 const allowedTypes = ['success', 'info', 'warning', 'error'];
+const makeVAlertProps = propsFactory({
+  border: {
+    type: [Boolean, String],
+    validator: val => {
+      return typeof val === 'boolean' || ['top', 'end', 'bottom', 'start'].includes(val);
+    }
+  },
+  borderColor: String,
+  closable: Boolean,
+  closeIcon: {
+    type: IconValue,
+    default: '$close'
+  },
+  closeLabel: {
+    type: String,
+    default: '$vuetify.close'
+  },
+  icon: {
+    type: [Boolean, String, Function, Object],
+    default: null
+  },
+  modelValue: {
+    type: Boolean,
+    default: true
+  },
+  prominent: Boolean,
+  title: String,
+  text: String,
+  type: {
+    type: String,
+    validator: val => allowedTypes.includes(val)
+  },
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeLocationProps(),
+  ...makePositionProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'flat'
+  })
+}, 'v-alert');
 const VAlert = genericComponent()({
   name: 'VAlert',
-  props: {
-    border: {
-      type: [Boolean, String],
-      validator: val => {
-        return typeof val === 'boolean' || ['top', 'end', 'bottom', 'start'].includes(val);
-      }
-    },
-    borderColor: String,
-    closable: Boolean,
-    closeIcon: {
-      type: IconValue,
-      default: '$close'
-    },
-    closeLabel: {
-      type: String,
-      default: '$vuetify.close'
-    },
-    icon: {
-      type: [Boolean, String, Function, Object],
-      default: null
-    },
-    modelValue: {
-      type: Boolean,
-      default: true
-    },
-    prominent: Boolean,
-    title: String,
-    text: String,
-    type: {
-      type: String,
-      validator: val => allowedTypes.includes(val)
-    },
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeLocationProps(),
-    ...makePositionProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'flat'
-    })
-  },
+  props: makeVAlertProps(),
   emits: {
     'click:close': e => true,
     'update:modelValue': value => true
@@ -5495,14 +5499,15 @@ function useInputIcon(props) {
   };
 }
 
+const makeVLabelProps = propsFactory({
+  text: String,
+  clickable: Boolean,
+  ...makeComponentProps(),
+  ...makeThemeProps()
+}, 'v-label');
 const VLabel = genericComponent()({
   name: 'VLabel',
-  props: {
-    text: String,
-    clickable: Boolean,
-    ...makeComponentProps(),
-    ...makeThemeProps()
-  },
+  props: makeVLabelProps(),
   setup(props, _ref) {
     let {
       slots
@@ -5517,12 +5522,13 @@ const VLabel = genericComponent()({
   }
 });
 
+const makeVFieldLabelProps = propsFactory({
+  floating: Boolean,
+  ...makeComponentProps()
+}, 'v-field-label');
 const VFieldLabel = genericComponent()({
   name: 'VFieldLabel',
-  props: {
-    floating: Boolean,
-    ...makeComponentProps()
-  },
+  props: makeVFieldLabelProps(),
   setup(props, _ref) {
     let {
       slots
@@ -5641,6 +5647,9 @@ const VField = genericComponent()({
     const {
       roundedClasses
     } = useRounded(props);
+    const {
+      rtlClasses
+    } = useRtl();
     const isActive = computed(() => props.dirty || props.active);
     const hasLabel = computed(() => !props.singleLine && !!(props.label || slots.label));
     const uid = getUid();
@@ -5734,7 +5743,7 @@ const VField = genericComponent()({
           'v-field--single-line': props.singleLine,
           'v-field--no-label': !label,
           [`v-field--variant-${props.variant}`]: true
-        }, themeClasses.value, backgroundColorClasses.value, focusClasses.value, loaderClasses.value, roundedClasses.value, props.class],
+        }, themeClasses.value, backgroundColorClasses.value, focusClasses.value, loaderClasses.value, roundedClasses.value, rtlClasses.value, props.class],
         "style": [backgroundColorStyles.value, textColorStyles.value, props.style],
         "onClick": onClick
       }, attrs), [createVNode("div", {
@@ -5829,24 +5838,25 @@ function filterFieldProps(attrs) {
 
 // Types
 
+const makeVMessagesProps = propsFactory({
+  active: Boolean,
+  color: String,
+  messages: {
+    type: [Array, String],
+    default: () => []
+  },
+  ...makeComponentProps(),
+  ...makeTransitionProps({
+    transition: {
+      component: VSlideYTransition,
+      leaveAbsolute: true,
+      group: true
+    }
+  })
+}, 'v-messages');
 const VMessages = genericComponent()({
   name: 'VMessages',
-  props: {
-    active: Boolean,
-    color: String,
-    messages: {
-      type: [Array, String],
-      default: () => []
-    },
-    ...makeComponentProps(),
-    ...makeTransitionProps({
-      transition: {
-        component: VSlideYTransition,
-        leaveAbsolute: true,
-        group: true
-      }
-    })
-  },
+  props: makeVMessagesProps(),
   setup(props, _ref) {
     let {
       slots
@@ -6258,23 +6268,24 @@ const VInput = genericComponent()({
   }
 });
 
+const makeVCounterProps = propsFactory({
+  active: Boolean,
+  max: [Number, String],
+  value: {
+    type: [Number, String],
+    default: 0
+  },
+  ...makeComponentProps(),
+  ...makeTransitionProps({
+    transition: {
+      component: VSlideYTransition
+    }
+  })
+}, 'v-counter');
 const VCounter = genericComponent()({
   name: 'VCounter',
   functional: true,
-  props: {
-    active: Boolean,
-    max: [Number, String],
-    value: {
-      type: [Number, String],
-      default: 0
-    },
-    ...makeComponentProps(),
-    ...makeTransitionProps({
-      transition: {
-        component: VSlideYTransition
-      }
-    })
-  },
+  props: makeVCounterProps(),
   setup(props, _ref) {
     let {
       slots
@@ -6437,7 +6448,7 @@ const VTextField = genericComponent()({
     const vInputRef = ref();
     const vFieldRef = ref();
     const inputRef = ref();
-    const isActive = computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value);
+    const isActive = computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value || props.active);
     function onFocus() {
       if (inputRef.value !== document.activeElement) {
         inputRef.value?.focus();
@@ -6576,6 +6587,7 @@ const VSelectionControlGroupSymbol = Symbol.for('vuetify:selection-control-group
 const makeSelectionControlGroupProps = propsFactory({
   color: String,
   disabled: Boolean,
+  defaultsTarget: String,
   error: Boolean,
   id: String,
   inline: Boolean,
@@ -6597,19 +6609,18 @@ const makeSelectionControlGroupProps = propsFactory({
     type: Function,
     default: deepEqual
   },
-  ...makeThemeProps(),
-  ...makeDensityProps()
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeThemeProps()
+}, 'selection-control-group');
+const makeVSelectionControlGroupProps = propsFactory({
+  ...makeSelectionControlGroupProps({
+    defaultsTarget: 'VSelectionControl'
+  })
 }, 'v-selection-control-group');
 const VSelectionControlGroup = genericComponent()({
   name: 'VSelectionControlGroup',
-  props: {
-    defaultsTarget: {
-      type: String,
-      default: 'VSelectionControl'
-    },
-    ...makeComponentProps(),
-    ...makeSelectionControlGroupProps()
-  },
+  props: makeVSelectionControlGroupProps(),
   emits: {
     'update:modelValue': val => true
   },
@@ -6873,7 +6884,6 @@ const VCheckboxBtn = genericComponent()({
       "class": ['v-checkbox-btn', props.class],
       "style": props.style,
       "type": "checkbox",
-      "inline": true,
       "falseIcon": falseIcon.value,
       "trueIcon": trueIcon.value,
       "aria-checked": props.indeterminate ? 'mixed' : undefined
@@ -6884,13 +6894,14 @@ const VCheckboxBtn = genericComponent()({
 
 // Types
 
+const makeVCheckboxProps = propsFactory({
+  ...makeVInputProps(),
+  ...omit(makeVCheckboxBtnProps(), ['inline'])
+}, 'v-checkbox');
 const VCheckbox = genericComponent()({
   name: 'VCheckbox',
   inheritAttrs: false,
-  props: {
-    ...makeVInputProps(),
-    ...omit(makeVCheckboxBtnProps(), ['inline'])
-  },
+  props: makeVCheckboxProps(),
   emits: {
     'update:focused': focused => true
   },
@@ -7005,25 +7016,26 @@ const VAvatar = genericComponent()({
 // Types
 
 const VChipGroupSymbol = Symbol.for('vuetify:v-chip-group');
+const makeVChipGroupProps = propsFactory({
+  column: Boolean,
+  filter: Boolean,
+  valueComparator: {
+    type: Function,
+    default: deepEqual
+  },
+  ...makeComponentProps(),
+  ...makeGroupProps({
+    selectedClass: 'v-chip--selected'
+  }),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'tonal'
+  })
+}, 'v-chip-group');
 const VChipGroup = genericComponent()({
   name: 'VChipGroup',
-  props: {
-    column: Boolean,
-    filter: Boolean,
-    valueComparator: {
-      type: Function,
-      default: deepEqual
-    },
-    ...makeComponentProps(),
-    ...makeGroupProps({
-      selectedClass: 'v-chip--selected'
-    }),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'tonal'
-    })
-  },
+  props: makeVChipGroupProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -7067,65 +7079,66 @@ const VChipGroup = genericComponent()({
   }
 });
 
+const makeVChipProps = propsFactory({
+  activeClass: String,
+  appendAvatar: String,
+  appendIcon: IconValue,
+  closable: Boolean,
+  closeIcon: {
+    type: IconValue,
+    default: '$delete'
+  },
+  closeLabel: {
+    type: String,
+    default: '$vuetify.close'
+  },
+  draggable: Boolean,
+  filter: Boolean,
+  filterIcon: {
+    type: String,
+    default: '$complete'
+  },
+  label: Boolean,
+  link: {
+    type: Boolean,
+    default: undefined
+  },
+  pill: Boolean,
+  prependAvatar: String,
+  prependIcon: IconValue,
+  ripple: {
+    type: Boolean,
+    default: true
+  },
+  text: String,
+  modelValue: {
+    type: Boolean,
+    default: true
+  },
+  onClick: EventProp(),
+  onClickOnce: EventProp(),
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeElevationProps(),
+  ...makeGroupItemProps(),
+  ...makeRoundedProps(),
+  ...makeRouterProps(),
+  ...makeSizeProps(),
+  ...makeTagProps({
+    tag: 'span'
+  }),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'tonal'
+  })
+}, 'v-chip');
 const VChip = genericComponent()({
   name: 'VChip',
   directives: {
     Ripple
   },
-  props: {
-    activeClass: String,
-    appendAvatar: String,
-    appendIcon: IconValue,
-    closable: Boolean,
-    closeIcon: {
-      type: IconValue,
-      default: '$delete'
-    },
-    closeLabel: {
-      type: String,
-      default: '$vuetify.close'
-    },
-    draggable: Boolean,
-    filter: Boolean,
-    filterIcon: {
-      type: String,
-      default: '$complete'
-    },
-    label: Boolean,
-    link: {
-      type: Boolean,
-      default: undefined
-    },
-    pill: Boolean,
-    prependAvatar: String,
-    prependIcon: IconValue,
-    ripple: {
-      type: Boolean,
-      default: true
-    },
-    text: String,
-    modelValue: {
-      type: Boolean,
-      default: true
-    },
-    onClick: EventProp(),
-    onClickOnce: EventProp(),
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeElevationProps(),
-    ...makeGroupItemProps(),
-    ...makeRoundedProps(),
-    ...makeRouterProps(),
-    ...makeSizeProps(),
-    ...makeTagProps({
-      tag: 'span'
-    }),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'tonal'
-    })
-  },
+  props: makeVChipProps(),
   emits: {
     'click:close': e => true,
     'update:modelValue': value => true,
@@ -7254,14 +7267,16 @@ const VChip = genericComponent()({
               start: true
             }
           }
-        }, slots.prepend)]), slots.default?.({
+        }, slots.prepend)]), createVNode("div", {
+          "class": "v-chip__content"
+        }, [slots.default?.({
           isSelected: group?.isSelected.value,
           selectedClass: group?.selectedClass.value,
           select: group?.select,
           toggle: group?.toggle,
           value: group?.value.value,
           disabled: props.disabled
-        }) ?? props.text, hasAppend && createVNode("div", {
+        }) ?? props.text]), hasAppend && createVNode("div", {
           "key": "append",
           "class": "v-chip__append"
         }, [!slots.append ? createVNode(Fragment, null, [props.appendIcon && createVNode(VIcon, {
@@ -7306,17 +7321,18 @@ const VChip = genericComponent()({
   }
 });
 
+const makeVDividerProps = propsFactory({
+  color: String,
+  inset: Boolean,
+  length: [Number, String],
+  thickness: [Number, String],
+  vertical: Boolean,
+  ...makeComponentProps(),
+  ...makeThemeProps()
+}, 'v-divider');
 const VDivider = genericComponent()({
   name: 'VDivider',
-  props: {
-    color: String,
-    inset: Boolean,
-    length: [Number, String],
-    thickness: [Number, String],
-    vertical: Boolean,
-    ...makeComponentProps(),
-    ...makeThemeProps()
-  },
+  props: makeVDividerProps(),
   setup(props, _ref) {
     let {
       attrs
@@ -7842,16 +7858,14 @@ const makeVListGroupProps = propsFactory({
   appendIcon: IconValue,
   fluid: Boolean,
   subgroup: Boolean,
+  title: String,
   value: null,
   ...makeComponentProps(),
   ...makeTagProps()
 }, 'v-list-group');
 const VListGroup = genericComponent()({
   name: 'VListGroup',
-  props: {
-    title: String,
-    ...makeVListGroupProps()
-  },
+  props: makeVListGroupProps(),
   setup(props, _ref2) {
     let {
       slots
@@ -7927,51 +7941,52 @@ const VListItemTitle = createSimpleFunctional('v-list-item-title');
 
 // Types
 
+const makeVListItemProps = propsFactory({
+  active: {
+    type: Boolean,
+    default: undefined
+  },
+  activeClass: String,
+  activeColor: String,
+  appendAvatar: String,
+  appendIcon: IconValue,
+  disabled: Boolean,
+  lines: String,
+  link: {
+    type: Boolean,
+    default: undefined
+  },
+  nav: Boolean,
+  prependAvatar: String,
+  prependIcon: IconValue,
+  ripple: {
+    type: Boolean,
+    default: true
+  },
+  subtitle: [String, Number, Boolean],
+  title: [String, Number, Boolean],
+  value: null,
+  onClick: EventProp(),
+  onClickOnce: EventProp(),
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeRoundedProps(),
+  ...makeRouterProps(),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'text'
+  })
+}, 'v-list-item');
 const VListItem = genericComponent()({
   name: 'VListItem',
   directives: {
     Ripple
   },
-  props: {
-    active: {
-      type: Boolean,
-      default: undefined
-    },
-    activeClass: String,
-    activeColor: String,
-    appendAvatar: String,
-    appendIcon: IconValue,
-    disabled: Boolean,
-    lines: String,
-    link: {
-      type: Boolean,
-      default: undefined
-    },
-    nav: Boolean,
-    prependAvatar: String,
-    prependIcon: IconValue,
-    ripple: {
-      type: Boolean,
-      default: true
-    },
-    subtitle: [String, Number, Boolean],
-    title: [String, Number, Boolean],
-    value: null,
-    onClick: EventProp(),
-    onClickOnce: EventProp(),
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeRoundedProps(),
-    ...makeRouterProps(),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'text'
-    })
-  },
+  props: makeVListItemProps(),
   emits: {
     click: e => true
   },
@@ -8158,16 +8173,17 @@ const VListItem = genericComponent()({
   }
 });
 
+const makeVListSubheaderProps = propsFactory({
+  color: String,
+  inset: Boolean,
+  sticky: Boolean,
+  title: String,
+  ...makeComponentProps(),
+  ...makeTagProps()
+}, 'v-list-subheader');
 const VListSubheader = genericComponent()({
   name: 'VListSubheader',
-  props: {
-    color: String,
-    inset: Boolean,
-    sticky: Boolean,
-    title: String,
-    ...makeComponentProps(),
-    ...makeTagProps()
-  },
+  props: makeVListSubheaderProps(),
   setup(props, _ref) {
     let {
       slots
@@ -8198,11 +8214,12 @@ const VListSubheader = genericComponent()({
 
 // Types
 
+const makeVListChildrenProps = propsFactory({
+  items: Array
+}, 'v-list-children');
 const VListChildren = genericComponent()({
   name: 'VListChildren',
-  props: {
-    items: Array
-  },
+  props: makeVListChildrenProps(),
   setup(props, _ref) {
     let {
       slots
@@ -8388,39 +8405,40 @@ function useListItems(props) {
     items
   };
 }
+const makeVListProps = propsFactory({
+  activeColor: String,
+  activeClass: String,
+  bgColor: String,
+  disabled: Boolean,
+  lines: {
+    type: [Boolean, String],
+    default: 'one'
+  },
+  nav: Boolean,
+  ...makeNestedProps({
+    selectStrategy: 'single-leaf',
+    openStrategy: 'list'
+  }),
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  itemType: {
+    type: String,
+    default: 'type'
+  },
+  ...makeItemsProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'text'
+  })
+}, 'v-list');
 const VList = genericComponent()({
   name: 'VList',
-  props: {
-    activeColor: String,
-    activeClass: String,
-    bgColor: String,
-    disabled: Boolean,
-    lines: {
-      type: [Boolean, String],
-      default: 'one'
-    },
-    nav: Boolean,
-    ...makeNestedProps({
-      selectStrategy: 'single-leaf',
-      openStrategy: 'list'
-    }),
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    itemType: {
-      type: String,
-      default: 'type'
-    },
-    ...makeItemsProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'text'
-    })
-  },
+  props: makeVListProps(),
   emits: {
     'update:selected': val => true,
     'update:opened': val => true,
@@ -8541,14 +8559,15 @@ const VList = genericComponent()({
 
 const VListImg = createSimpleFunctional('v-list-img');
 
+const makeVListItemActionProps = propsFactory({
+  start: Boolean,
+  end: Boolean,
+  ...makeComponentProps(),
+  ...makeTagProps()
+}, 'v-list-item-action');
 const VListItemAction = genericComponent()({
   name: 'VListItemAction',
-  props: {
-    start: Boolean,
-    end: Boolean,
-    ...makeComponentProps(),
-    ...makeTagProps()
-  },
+  props: makeVListItemActionProps(),
   setup(props, _ref) {
     let {
       slots
@@ -8564,14 +8583,15 @@ const VListItemAction = genericComponent()({
   }
 });
 
+const makeVListItemMediaProps = propsFactory({
+  start: Boolean,
+  end: Boolean,
+  ...makeComponentProps(),
+  ...makeTagProps()
+}, 'v-list-item-media');
 const VListItemMedia = genericComponent()({
   name: 'VListItemMedia',
-  props: {
-    start: Boolean,
-    end: Boolean,
-    ...makeComponentProps(),
-    ...makeTagProps()
-  },
+  props: makeVListItemMediaProps(),
   setup(props, _ref) {
     let {
       slots
@@ -9033,7 +9053,9 @@ function connectedLocationStrategy(data, props, contentStyles) {
   const activatorFixed = isFixedPosition(data.activatorEl.value);
   if (activatorFixed) {
     Object.assign(contentStyles.value, {
-      position: 'fixed'
+      position: 'fixed',
+      top: 0,
+      left: 0
     });
   }
   const {
@@ -9105,8 +9127,8 @@ function connectedLocationStrategy(data, props, contentStyles) {
     if (!scrollParents.length) {
       scrollParents.push(document.documentElement);
       if (!(data.contentEl.value.style.top && data.contentEl.value.style.left)) {
-        contentBox.x += parseFloat(document.documentElement.style.getPropertyValue('--v-body-scroll-x') || 0);
-        contentBox.y += parseFloat(document.documentElement.style.getPropertyValue('--v-body-scroll-y') || 0);
+        contentBox.x -= parseFloat(document.documentElement.style.getPropertyValue('--v-body-scroll-x') || 0);
+        contentBox.y -= parseFloat(document.documentElement.style.getPropertyValue('--v-body-scroll-y') || 0);
       }
     }
     const viewport = scrollParents.reduce((box, el) => {
@@ -9759,7 +9781,7 @@ const ClickOutside = {
     });
     if (!el._clickOutside) {
       el._clickOutside = {
-        lastMousedownWasOutside: true
+        lastMousedownWasOutside: false
       };
     }
     el._clickOutside[binding.instance.$.uid] = {
@@ -10035,24 +10057,25 @@ const VOverlay = genericComponent()({
 
 // Types
 
+const makeVMenuProps = propsFactory({
+  // TODO
+  // disableKeys: Boolean,
+  id: String,
+  ...omit(makeVOverlayProps({
+    closeDelay: 250,
+    closeOnContentClick: true,
+    locationStrategy: 'connected',
+    openDelay: 300,
+    scrim: false,
+    scrollStrategy: 'reposition',
+    transition: {
+      component: VDialogTransition
+    }
+  }), ['absolute'])
+}, 'v-menu');
 const VMenu = genericComponent()({
   name: 'VMenu',
-  props: {
-    // TODO
-    // disableKeys: Boolean,
-    id: String,
-    ...omit(makeVOverlayProps({
-      closeDelay: 250,
-      closeOnContentClick: true,
-      locationStrategy: 'connected',
-      openDelay: 300,
-      scrim: false,
-      scrollStrategy: 'reposition',
-      transition: {
-        component: VDialogTransition
-      }
-    }), ['absolute'])
-  },
+  props: makeVMenuProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -10158,20 +10181,21 @@ const makeSelectProps = propsFactory({
   ...makeItemsProps({
     itemChildren: false
   })
+}, 'select');
+const makeVSelectProps = propsFactory({
+  ...makeSelectProps(),
+  ...omit(makeVTextFieldProps({
+    modelValue: null
+  }), ['validationValue', 'dirty', 'appendInnerIcon']),
+  ...makeTransitionProps({
+    transition: {
+      component: VDialogTransition
+    }
+  })
 }, 'v-select');
 const VSelect = genericComponent()({
   name: 'VSelect',
-  props: {
-    ...makeSelectProps(),
-    ...omit(makeVTextFieldProps({
-      modelValue: null
-    }), ['validationValue', 'dirty', 'appendInnerIcon']),
-    ...makeTransitionProps({
-      transition: {
-        component: VDialogTransition
-      }
-    })
-  },
+  props: makeVSelectProps(),
   emits: {
     'update:focused': focused => true,
     'update:modelValue': val => true,
@@ -10290,14 +10314,14 @@ const VSelect = genericComponent()({
         menu.value = false;
       }
     }
-    function onFocusin(e) {
-      isFocused.value = true;
-    }
-    function onFocusout(e) {
-      if (e.relatedTarget == null) {
+    function onAfterLeave() {
+      if (isFocused.value) {
         vTextFieldRef.value?.focus();
       }
     }
+    function onFocusin(e) {
+      isFocused.value = true;
+    }
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
@@ -10341,15 +10365,15 @@ const VSelect = genericComponent()({
           "maxHeight": 310,
           "openOnClick": false,
           "closeOnContentClick": false,
-          "transition": props.transition
+          "transition": props.transition,
+          "onAfterLeave": onAfterLeave
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, {
             "ref": listRef,
             "selected": selected.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
-            "onFocusin": onFocusin,
-            "onFocusout": onFocusout
+            "onFocusin": onFocusin
           }, {
             default: () => [!displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
@@ -10372,11 +10396,13 @@ const VSelect = genericComponent()({
                   let {
                     isSelected
                   } = _ref2;
-                  return props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
+                  return createVNode(Fragment, null, [props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
                     "modelValue": isSelected,
                     "ripple": false,
                     "tabindex": "-1"
-                  }, null) : undefined;
+                  }, null) : undefined, item.props.prependIcon && createVNode(VIcon, {
+                    "icon": item.props.prependIcon
+                  }, null)]);
                 }
               });
             }), slots['append-item']?.()]
@@ -10389,6 +10415,10 @@ const VSelect = genericComponent()({
           }
           const slotProps = {
             'onClick:close': onChipClose,
+            onMousedown(e) {
+              e.preventDefault();
+              e.stopPropagation();
+            },
             modelValue: true,
             'onUpdate:modelValue': undefined
           };
@@ -10548,23 +10578,24 @@ function highlightResult$1(text, matches, length) {
     "class": "v-autocomplete__unmask"
   }, [text.substr(matches + length)])]) : text;
 }
+const makeVAutocompleteProps = propsFactory({
+  // TODO: implement post keyboard support
+  // autoSelectFirst: Boolean,
+  search: String,
+  ...makeFilterProps({
+    filterKeys: ['title']
+  }),
+  ...makeSelectProps(),
+  ...omit(makeVTextFieldProps({
+    modelValue: null
+  }), ['validationValue', 'dirty', 'appendInnerIcon']),
+  ...makeTransitionProps({
+    transition: false
+  })
+}, 'v-autocomplete');
 const VAutocomplete = genericComponent()({
   name: 'VAutocomplete',
-  props: {
-    // TODO: implement post keyboard support
-    // autoSelectFirst: Boolean,
-    search: String,
-    ...makeFilterProps({
-      filterKeys: ['title']
-    }),
-    ...makeSelectProps(),
-    ...omit(makeVTextFieldProps({
-      modelValue: null
-    }), ['validationValue', 'dirty', 'appendInnerIcon']),
-    ...makeTransitionProps({
-      transition: false
-    })
-  },
+  props: makeVAutocompleteProps(),
   emits: {
     'update:focused': focused => true,
     'update:search': val => true,
@@ -10693,16 +10724,14 @@ const VAutocomplete = genericComponent()({
       search.value = e.target.value;
     }
     function onAfterLeave() {
-      if (isFocused.value) isPristine.value = true;
+      if (isFocused.value) {
+        isPristine.value = true;
+        vTextFieldRef.value?.focus();
+      }
     }
     function onFocusin(e) {
       isFocused.value = true;
     }
-    function onFocusout(e) {
-      if (e.relatedTarget == null) {
-        vTextFieldRef.value?.focus();
-      }
-    }
     const isSelecting = ref(false);
     function select(item) {
       if (props.multiple) {
@@ -10717,9 +10746,7 @@ const VAutocomplete = genericComponent()({
       } else {
         model.value = [item];
         isSelecting.value = true;
-        if (!slots.selection) {
-          search.value = item.title;
-        }
+        search.value = item.title;
         menu.value = false;
         isPristine.value = true;
         nextTick(() => isSelecting.value = false);
@@ -10728,12 +10755,14 @@ const VAutocomplete = genericComponent()({
     watch(isFocused, val => {
       if (val) {
         isSelecting.value = true;
-        search.value = props.multiple || !!slots.selection ? '' : String(selections.value.at(-1)?.props.title ?? '');
+        search.value = props.multiple ? '' : String(selections.value.at(-1)?.props.title ?? '');
         isPristine.value = true;
         nextTick(() => isSelecting.value = false);
       } else {
+        if (!props.multiple && !search.value) model.value = [];
         menu.value = false;
         search.value = '';
+        selectionIndex.value = -1;
       }
     });
     watch(search, val => {
@@ -10758,12 +10787,10 @@ const VAutocomplete = genericComponent()({
         "validationValue": model.externalValue,
         "dirty": isDirty,
         "onInput": onInput,
-        "class": ['v-autocomplete', {
+        "class": ['v-autocomplete', `v-autocomplete--${props.multiple ? 'multiple' : 'single'}`, {
           'v-autocomplete--active-menu': menu.value,
           'v-autocomplete--chips': !!props.chips,
-          'v-autocomplete--selecting-index': selectionIndex.value > -1,
-          [`v-autocomplete--${props.multiple ? 'multiple' : 'single'}`]: true,
-          'v-autocomplete--selection-slot': !!slots.selection
+          'v-autocomplete--selecting-index': selectionIndex.value > -1
         }, props.class],
         "style": props.style,
         "appendInnerIcon": props.menuIcon,
@@ -10792,8 +10819,7 @@ const VAutocomplete = genericComponent()({
             "selected": selected.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
-            "onFocusin": onFocusin,
-            "onFocusout": onFocusout
+            "onFocusin": onFocusin
           }, {
             default: () => [!displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
@@ -10811,11 +10837,13 @@ const VAutocomplete = genericComponent()({
                 let {
                   isSelected
                 } = _ref2;
-                return props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
+                return createVNode(Fragment, null, [props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
                   "modelValue": isSelected,
                   "ripple": false,
                   "tabindex": "-1"
-                }, null) : undefined;
+                }, null) : undefined, item.props.prependIcon && createVNode(VIcon, {
+                  "icon": item.props.prependIcon
+                }, null)]);
               },
               title: () => {
                 return isPristine.value ? item.title : highlightResult$1(item.title, getMatches(item)?.title, search.value?.length ?? 0);
@@ -10830,6 +10858,10 @@ const VAutocomplete = genericComponent()({
           }
           const slotProps = {
             'onClick:close': onChipClose,
+            onMousedown(e) {
+              e.preventDefault();
+              e.stopPropagation();
+            },
             modelValue: true,
             'onUpdate:modelValue': undefined
           };
@@ -10879,40 +10911,41 @@ const VAutocomplete = genericComponent()({
   }
 });
 
+const makeVBadgeProps = propsFactory({
+  bordered: Boolean,
+  color: String,
+  content: [Number, String],
+  dot: Boolean,
+  floating: Boolean,
+  icon: IconValue,
+  inline: Boolean,
+  label: {
+    type: String,
+    default: '$vuetify.badge'
+  },
+  max: [Number, String],
+  modelValue: {
+    type: Boolean,
+    default: true
+  },
+  offsetX: [Number, String],
+  offsetY: [Number, String],
+  textColor: String,
+  ...makeComponentProps(),
+  ...makeLocationProps({
+    location: 'top end'
+  }),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeTransitionProps({
+    transition: 'scale-rotate-transition'
+  })
+}, 'v-badge');
 const VBadge = genericComponent()({
   name: 'VBadge',
   inheritAttrs: false,
-  props: {
-    bordered: Boolean,
-    color: String,
-    content: [Number, String],
-    dot: Boolean,
-    floating: Boolean,
-    icon: IconValue,
-    inline: Boolean,
-    label: {
-      type: String,
-      default: '$vuetify.badge'
-    },
-    max: [Number, String],
-    modelValue: {
-      type: Boolean,
-      default: true
-    },
-    offsetX: [Number, String],
-    offsetY: [Number, String],
-    textColor: String,
-    ...makeComponentProps(),
-    ...makeLocationProps({
-      location: 'top end'
-    }),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeTransitionProps({
-      transition: 'scale-rotate-transition'
-    })
-  },
+  props: makeVBadgeProps(),
   setup(props, ctx) {
     const {
       backgroundColorClasses,
@@ -10973,13 +11006,14 @@ const VBadge = genericComponent()({
   }
 });
 
+const makeVBannerActionsProps = propsFactory({
+  color: String,
+  density: String,
+  ...makeComponentProps()
+}, 'v-banner-actions');
 const VBannerActions = genericComponent()({
   name: 'VBannerActions',
-  props: {
-    color: String,
-    density: String,
-    ...makeComponentProps()
-  },
+  props: makeVBannerActionsProps(),
   setup(props, _ref) {
     let {
       slots
@@ -11003,27 +11037,28 @@ const VBannerText = createSimpleFunctional('v-banner-text');
 
 // Types
 
+const makeVBannerProps = propsFactory({
+  avatar: String,
+  color: String,
+  icon: IconValue,
+  lines: String,
+  stacked: Boolean,
+  sticky: Boolean,
+  text: String,
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeLocationProps(),
+  ...makePositionProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-banner');
 const VBanner = genericComponent()({
   name: 'VBanner',
-  props: {
-    avatar: String,
-    color: String,
-    icon: IconValue,
-    lines: String,
-    stacked: Boolean,
-    sticky: Boolean,
-    text: String,
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeLocationProps(),
-    ...makePositionProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVBannerProps(),
   setup(props, _ref) {
     let {
       slots
@@ -11110,50 +11145,51 @@ const VBanner = genericComponent()({
   }
 });
 
-const VBottomNavigation = genericComponent()({
-  name: 'VBottomNavigation',
-  props: {
-    bgColor: String,
-    color: String,
-    grow: Boolean,
-    mode: {
-      type: String,
-      validator: v => !v || ['horizontal', 'shift'].includes(v)
-    },
-    height: {
-      type: [Number, String],
-      default: 56
-    },
-    active: {
-      type: Boolean,
-      default: true
-    },
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeElevationProps(),
-    ...makeRoundedProps(),
-    ...makeLayoutItemProps({
-      name: 'bottom-navigation'
-    }),
-    ...makeTagProps({
-      tag: 'header'
-    }),
-    ...makeGroupProps({
-      modelValue: true,
-      selectedClass: 'v-btn--selected'
-    }),
-    ...makeThemeProps()
+const makeVBottomNavigationProps = propsFactory({
+  bgColor: String,
+  color: String,
+  grow: Boolean,
+  mode: {
+    type: String,
+    validator: v => !v || ['horizontal', 'shift'].includes(v)
   },
-  emits: {
-    'update:modelValue': value => true
+  height: {
+    type: [Number, String],
+    default: 56
   },
-  setup(props, _ref) {
-    let {
-      slots
-    } = _ref;
-    const {
-      themeClasses
+  active: {
+    type: Boolean,
+    default: true
+  },
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeElevationProps(),
+  ...makeRoundedProps(),
+  ...makeLayoutItemProps({
+    name: 'bottom-navigation'
+  }),
+  ...makeTagProps({
+    tag: 'header'
+  }),
+  ...makeGroupProps({
+    modelValue: true,
+    selectedClass: 'v-btn--selected'
+  }),
+  ...makeThemeProps()
+}, 'v-bottom-navigation');
+const VBottomNavigation = genericComponent()({
+  name: 'VBottomNavigation',
+  props: makeVBottomNavigationProps(),
+  emits: {
+    'update:modelValue': value => true
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const {
+      themeClasses
     } = useTheme();
     const {
       borderClasses
@@ -11219,12 +11255,13 @@ const VBottomNavigation = genericComponent()({
   }
 });
 
+const makeVBreadcrumbsDividerProps = propsFactory({
+  divider: [Number, String],
+  ...makeComponentProps()
+}, 'v-breacrumbs-divider');
 const VBreadcrumbsDivider = genericComponent()({
   name: 'VBreadcrumbsDivider',
-  props: {
-    divider: [Number, String],
-    ...makeComponentProps()
-  },
+  props: makeVBreadcrumbsDividerProps(),
   setup(props, _ref) {
     let {
       slots
@@ -11237,21 +11274,22 @@ const VBreadcrumbsDivider = genericComponent()({
   }
 });
 
+const makeVBreadcrumbsItemProps = propsFactory({
+  active: Boolean,
+  activeClass: String,
+  activeColor: String,
+  color: String,
+  disabled: Boolean,
+  title: String,
+  ...makeComponentProps(),
+  ...makeRouterProps(),
+  ...makeTagProps({
+    tag: 'li'
+  })
+}, 'v-breadcrumbs-item');
 const VBreadcrumbsItem = genericComponent()({
   name: 'VBreadcrumbsItem',
-  props: {
-    active: Boolean,
-    activeClass: String,
-    activeColor: String,
-    color: String,
-    disabled: Boolean,
-    title: String,
-    ...makeComponentProps(),
-    ...makeRouterProps(),
-    ...makeTagProps({
-      tag: 'li'
-    })
-  },
+  props: makeVBreadcrumbsItemProps(),
   setup(props, _ref) {
     let {
       slots,
@@ -11287,30 +11325,31 @@ const VBreadcrumbsItem = genericComponent()({
 
 // Types
 
+const makeVBreadcrumbsProps = propsFactory({
+  activeClass: String,
+  activeColor: String,
+  bgColor: String,
+  color: String,
+  disabled: Boolean,
+  divider: {
+    type: String,
+    default: '/'
+  },
+  icon: IconValue,
+  items: {
+    type: Array,
+    default: () => []
+  },
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps({
+    tag: 'ul'
+  })
+}, 'v-breacrumbs');
 const VBreadcrumbs = genericComponent()({
   name: 'VBreadcrumbs',
-  props: {
-    activeClass: String,
-    activeColor: String,
-    bgColor: String,
-    color: String,
-    disabled: Boolean,
-    divider: {
-      type: String,
-      default: '/'
-    },
-    icon: IconValue,
-    items: {
-      type: Array,
-      default: () => []
-    },
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps({
-      tag: 'ul'
-    })
-  },
+  props: makeVBreadcrumbsProps(),
   setup(props, _ref) {
     let {
       slots
@@ -11419,18 +11458,19 @@ const VCardSubtitle = createSimpleFunctional('v-card-subtitle');
 
 const VCardTitle = createSimpleFunctional('v-card-title');
 
+const makeCardItemProps = propsFactory({
+  appendAvatar: String,
+  appendIcon: IconValue,
+  prependAvatar: String,
+  prependIcon: IconValue,
+  subtitle: String,
+  title: String,
+  ...makeComponentProps(),
+  ...makeDensityProps()
+}, 'v-card-item');
 const VCardItem = genericComponent()({
   name: 'VCardItem',
-  props: {
-    appendAvatar: String,
-    appendIcon: IconValue,
-    prependAvatar: String,
-    prependIcon: IconValue,
-    subtitle: String,
-    title: String,
-    ...makeComponentProps(),
-    ...makeDensityProps()
-  },
+  props: makeCardItemProps(),
   setup(props, _ref) {
     let {
       slots
@@ -11501,47 +11541,48 @@ const VCardText = createSimpleFunctional('v-card-text');
 
 // Types
 
+const makeVCardProps = propsFactory({
+  appendAvatar: String,
+  appendIcon: IconValue,
+  disabled: Boolean,
+  flat: Boolean,
+  hover: Boolean,
+  image: String,
+  link: {
+    type: Boolean,
+    default: undefined
+  },
+  prependAvatar: String,
+  prependIcon: IconValue,
+  ripple: {
+    type: Boolean,
+    default: true
+  },
+  subtitle: String,
+  text: String,
+  title: String,
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeLoaderProps(),
+  ...makeLocationProps(),
+  ...makePositionProps(),
+  ...makeRoundedProps(),
+  ...makeRouterProps(),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'elevated'
+  })
+}, 'v-card');
 const VCard = genericComponent()({
   name: 'VCard',
   directives: {
     Ripple
   },
-  props: {
-    appendAvatar: String,
-    appendIcon: IconValue,
-    disabled: Boolean,
-    flat: Boolean,
-    hover: Boolean,
-    image: String,
-    link: {
-      type: Boolean,
-      default: undefined
-    },
-    prependAvatar: String,
-    prependIcon: IconValue,
-    ripple: {
-      type: Boolean,
-      default: true
-    },
-    subtitle: String,
-    text: String,
-    title: String,
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeLoaderProps(),
-    ...makeLocationProps(),
-    ...makePositionProps(),
-    ...makeRoundedProps(),
-    ...makeRouterProps(),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'elevated'
-    })
-  },
+  props: makeVCardProps(),
   setup(props, _ref) {
     let {
       attrs,
@@ -11935,34 +11976,35 @@ const VWindow = genericComponent()({
 
 // Types
 
+const makeVCarouselProps = propsFactory({
+  color: String,
+  cycle: Boolean,
+  delimiterIcon: {
+    type: IconValue,
+    default: '$delimiter'
+  },
+  height: {
+    type: [Number, String],
+    default: 500
+  },
+  hideDelimiters: Boolean,
+  hideDelimiterBackground: Boolean,
+  interval: {
+    type: [Number, String],
+    default: 6000,
+    validator: value => Number(value) > 0
+  },
+  progress: [Boolean, String],
+  verticalDelimiters: [Boolean, String],
+  ...makeVWindowProps({
+    continuous: true,
+    mandatory: 'force',
+    showArrows: true
+  })
+}, 'v-carousel');
 const VCarousel = genericComponent()({
   name: 'VCarousel',
-  props: {
-    color: String,
-    cycle: Boolean,
-    delimiterIcon: {
-      type: IconValue,
-      default: '$delimiter'
-    },
-    height: {
-      type: [Number, String],
-      default: 500
-    },
-    hideDelimiters: Boolean,
-    hideDelimiterBackground: Boolean,
-    interval: {
-      type: [Number, String],
-      default: 6000,
-      validator: value => Number(value) > 0
-    },
-    progress: [Boolean, String],
-    verticalDelimiters: [Boolean, String],
-    ...makeVWindowProps({
-      continuous: true,
-      mandatory: 'force',
-      showArrows: true
-    })
-  },
+  props: makeVCarouselProps(),
   emits: {
     'update:modelValue': val => true
   },
@@ -12052,24 +12094,25 @@ const VCarousel = genericComponent()({
   }
 });
 
+const makeVWindowItemProps = propsFactory({
+  reverseTransition: {
+    type: [Boolean, String],
+    default: undefined
+  },
+  transition: {
+    type: [Boolean, String],
+    default: undefined
+  },
+  ...makeComponentProps(),
+  ...makeGroupItemProps(),
+  ...makeLazyProps()
+}, 'v-window-item');
 const VWindowItem = genericComponent()({
   name: 'VWindowItem',
   directives: {
     Touch
   },
-  props: {
-    reverseTransition: {
-      type: [Boolean, String],
-      default: undefined
-    },
-    transition: {
-      type: [Boolean, String],
-      default: undefined
-    },
-    ...makeComponentProps(),
-    ...makeGroupItemProps(),
-    ...makeLazyProps()
-  },
+  props: makeVWindowItemProps(),
   emits: {
     'group:selected': val => true
   },
@@ -12163,25 +12206,28 @@ const VWindowItem = genericComponent()({
 
 // Types
 
+const makeVCarouselItemProps = propsFactory({
+  ...makeVImgProps(),
+  ...makeVWindowItemProps()
+}, 'v-carousel-item');
 const VCarouselItem = genericComponent()({
   name: 'VCarouselItem',
   inheritAttrs: false,
-  props: {
-    value: null,
-    ...makeComponentProps()
-  },
+  props: makeVCarouselItemProps(),
   setup(props, _ref) {
     let {
       slots,
       attrs
     } = _ref;
-    useRender(() => createVNode(VWindowItem, {
-      "class": ['v-carousel-item', props.class],
-      "style": props.style,
-      "value": props.value
-    }, {
-      default: () => [createVNode(VImg, attrs, slots)]
-    }));
+    useRender(() => {
+      const [imgProps] = VImg.filterProps(props);
+      const [windowItemProps] = VWindowItem.filterProps(props);
+      return createVNode(VWindowItem, mergeProps({
+        "class": "v-carousel-item"
+      }, windowItemProps), {
+        default: () => [createVNode(VImg, mergeProps(attrs, imgProps), slots)]
+      });
+    });
   }
 });
 
@@ -12201,9 +12247,7 @@ const makeVSheetProps = propsFactory({
 }, 'v-sheet');
 const VSheet = genericComponent()({
   name: 'VSheet',
-  props: {
-    ...makeVSheetProps()
-  },
+  props: makeVSheetProps(),
   setup(props, _ref) {
     let {
       slots
@@ -12243,27 +12287,28 @@ const VSheet = genericComponent()({
 
 // Types
 
+const makeVColorPickerCanvasProps = propsFactory({
+  color: {
+    type: Object
+  },
+  disabled: Boolean,
+  dotSize: {
+    type: [Number, String],
+    default: 10
+  },
+  height: {
+    type: [Number, String],
+    default: 150
+  },
+  width: {
+    type: [Number, String],
+    default: 300
+  },
+  ...makeComponentProps()
+}, 'v-color-picker-canvas');
 const VColorPickerCanvas = defineComponent({
   name: 'VColorPickerCanvas',
-  props: {
-    color: {
-      type: Object
-    },
-    disabled: Boolean,
-    dotSize: {
-      type: [Number, String],
-      default: 10
-    },
-    height: {
-      type: [Number, String],
-      default: 150
-    },
-    width: {
-      type: [Number, String],
-      default: 300
-    },
-    ...makeComponentProps()
-  },
+  props: makeVColorPickerCanvasProps(),
   emits: {
     'update:color': color => true,
     'update:position': hue => true
@@ -12519,7 +12564,7 @@ const rgba = {
       let {
         a
       } = _ref;
-      return a ? Math.round(a * 100) / 100 : 1;
+      return a != null ? Math.round(a * 100) / 100 : 1;
     },
     getColor: (c, v) => ({
       ...c,
@@ -12573,7 +12618,7 @@ const hsla = {
       let {
         a
       } = _ref2;
-      return a ? Math.round(a * 100) / 100 : 1;
+      return a != null ? Math.round(a * 100) / 100 : 1;
     },
     getColor: (c, v) => ({
       ...c,
@@ -12627,23 +12672,24 @@ const VColorPickerInput = _ref => {
     "class": "v-color-picker-edit__input"
   }, [createVNode("input", rest, null), createVNode("span", null, [label])]);
 };
+const makeVColorPickerEditProps = propsFactory({
+  color: Object,
+  disabled: Boolean,
+  mode: {
+    type: String,
+    default: 'rgba',
+    validator: v => Object.keys(modes).includes(v)
+  },
+  modes: {
+    type: Array,
+    default: () => Object.keys(modes),
+    validator: v => Array.isArray(v) && v.every(m => Object.keys(modes).includes(m))
+  },
+  ...makeComponentProps()
+}, 'v-color-picker-edit');
 const VColorPickerEdit = defineComponent({
   name: 'VColorPickerEdit',
-  props: {
-    color: Object,
-    disabled: Boolean,
-    mode: {
-      type: String,
-      default: 'rgba',
-      validator: v => Object.keys(modes).includes(v)
-    },
-    modes: {
-      type: Array,
-      default: () => Object.keys(modes),
-      validator: v => Array.isArray(v) && v.every(m => Object.keys(modes).includes(m))
-    },
-    ...makeComponentProps()
-  },
+  props: makeVColorPickerEditProps(),
   emits: {
     'update:color': color => true,
     'update:mode': mode => true
@@ -12976,35 +13022,36 @@ const useSlider = _ref => {
   return data;
 };
 
+const makeVSliderThumbProps = propsFactory({
+  focused: Boolean,
+  max: {
+    type: Number,
+    required: true
+  },
+  min: {
+    type: Number,
+    required: true
+  },
+  modelValue: {
+    type: Number,
+    required: true
+  },
+  position: {
+    type: Number,
+    required: true
+  },
+  ripple: {
+    type: Boolean,
+    default: true
+  },
+  ...makeComponentProps()
+}, 'v-slider-thumb');
 const VSliderThumb = genericComponent()({
   name: 'VSliderThumb',
   directives: {
     Ripple
   },
-  props: {
-    focused: Boolean,
-    max: {
-      type: Number,
-      required: true
-    },
-    min: {
-      type: Number,
-      required: true
-    },
-    modelValue: {
-      type: Number,
-      required: true
-    },
-    position: {
-      type: Number,
-      required: true
-    },
-    ripple: {
-      type: Boolean,
-      default: true
-    },
-    ...makeComponentProps()
-  },
+  props: makeVSliderThumbProps(),
   emits: {
     'update:modelValue': v => true
   },
@@ -13121,19 +13168,20 @@ const VSliderThumb = genericComponent()({
   }
 });
 
+const makeVSliderTrackProps = propsFactory({
+  start: {
+    type: Number,
+    required: true
+  },
+  stop: {
+    type: Number,
+    required: true
+  },
+  ...makeComponentProps()
+}, 'v-slider-track');
 const VSliderTrack = genericComponent()({
   name: 'VSliderTrack',
-  props: {
-    start: {
-      type: Number,
-      required: true
-    },
-    stop: {
-      type: Number,
-      required: true
-    },
-    ...makeComponentProps()
-  },
+  props: makeVSliderTrackProps(),
   emits: {},
   setup(props, _ref) {
     let {
@@ -13239,17 +13287,18 @@ const VSliderTrack = genericComponent()({
 
 // Types
 
+const makeVSliderProps = propsFactory({
+  ...makeFocusProps(),
+  ...makeSliderProps(),
+  ...makeVInputProps(),
+  modelValue: {
+    type: [Number, String],
+    default: 0
+  }
+}, 'v-slider');
 const VSlider = genericComponent()({
   name: 'VSlider',
-  props: {
-    ...makeFocusProps(),
-    ...makeSliderProps(),
-    ...makeVInputProps(),
-    modelValue: {
-      type: [Number, String],
-      default: 0
-    }
-  },
+  props: makeVSliderProps(),
   emits: {
     'update:focused': value => true,
     'update:modelValue': v => true,
@@ -13262,6 +13311,9 @@ const VSlider = genericComponent()({
       emit
     } = _ref;
     const thumbContainerRef = ref();
+    const {
+      rtlClasses
+    } = useRtl();
     const steps = useSteps(props);
     const model = useProxiedModel(props, 'modelValue', undefined, v => {
       const value = typeof v === 'string' ? parseFloat(v) : v == null ? steps.min.value : v;
@@ -13315,7 +13367,7 @@ const VSlider = genericComponent()({
           'v-slider--focused': isFocused.value,
           'v-slider--pressed': mousePressed.value,
           'v-slider--disabled': props.disabled
-        }, props.class],
+        }, rtlClasses.value, props.class],
         "style": props.style
       }, inputProps, {
         "focused": isFocused.value
@@ -13372,16 +13424,17 @@ const VSlider = genericComponent()({
 
 // Types
 
+const makeVColorPickerPreviewProps = propsFactory({
+  color: {
+    type: Object
+  },
+  disabled: Boolean,
+  hideAlpha: Boolean,
+  ...makeComponentProps()
+}, 'v-color-picker-preview');
 const VColorPickerPreview = defineComponent({
   name: 'VColorPickerPreview',
-  props: {
-    color: {
-      type: Object
-    },
-    disabled: Boolean,
-    hideAlpha: Boolean,
-    ...makeComponentProps()
-  },
+  props: makeVColorPickerPreviewProps(),
   emits: {
     'update:color': color => true
   },
@@ -13759,6 +13812,16 @@ var colors = Object.freeze({
 
 // Types
 
+const makeVColorPickerSwatchesProps = propsFactory({
+  swatches: {
+    type: Array,
+    default: () => parseDefaultColors(colors)
+  },
+  disabled: Boolean,
+  color: Object,
+  maxHeight: [Number, String],
+  ...makeComponentProps()
+}, 'v-color-picker-swatches');
 function parseDefaultColors(colors) {
   return Object.keys(colors).map(key => {
     const color = colors[key];
@@ -13767,16 +13830,7 @@ function parseDefaultColors(colors) {
 }
 const VColorPickerSwatches = defineComponent({
   name: 'VColorPickerSwatches',
-  props: {
-    swatches: {
-      type: Array,
-      default: () => parseDefaultColors(colors)
-    },
-    disabled: Boolean,
-    color: Object,
-    maxHeight: [Number, String],
-    ...makeComponentProps()
-  },
+  props: makeVColorPickerSwatchesProps(),
   emits: {
     'update:color': color => true
   },
@@ -13812,44 +13866,45 @@ const VColorPickerSwatches = defineComponent({
 
 // Types
 
+const makeVPickerProps = propsFactory({
+  canvasHeight: {
+    type: [String, Number],
+    default: 150
+  },
+  disabled: Boolean,
+  dotSize: {
+    type: [Number, String],
+    default: 10
+  },
+  hideCanvas: Boolean,
+  hideSliders: Boolean,
+  hideInputs: Boolean,
+  mode: {
+    type: String,
+    default: 'rgba',
+    validator: v => Object.keys(modes).includes(v)
+  },
+  modes: {
+    type: Array,
+    default: () => Object.keys(modes),
+    validator: v => Array.isArray(v) && v.every(m => Object.keys(modes).includes(m))
+  },
+  showSwatches: Boolean,
+  swatches: Array,
+  swatchesMaxHeight: {
+    type: [Number, String],
+    default: 150
+  },
+  modelValue: {
+    type: [Object, String]
+  },
+  ...omit(makeVSheetProps({
+    width: 300
+  }), ['height', 'location', 'minHeight', 'maxHeight', 'minWidth', 'maxWidth'])
+}, 'v-color-picker');
 const VColorPicker = defineComponent({
   name: 'VColorPicker',
-  props: {
-    canvasHeight: {
-      type: [String, Number],
-      default: 150
-    },
-    disabled: Boolean,
-    dotSize: {
-      type: [Number, String],
-      default: 10
-    },
-    hideCanvas: Boolean,
-    hideSliders: Boolean,
-    hideInputs: Boolean,
-    mode: {
-      type: String,
-      default: 'rgba',
-      validator: v => Object.keys(modes).includes(v)
-    },
-    modes: {
-      type: Array,
-      default: () => Object.keys(modes),
-      validator: v => Array.isArray(v) && v.every(m => Object.keys(modes).includes(m))
-    },
-    showSwatches: Boolean,
-    swatches: Array,
-    swatchesMaxHeight: {
-      type: [Number, String],
-      default: 150
-    },
-    modelValue: {
-      type: [Object, String]
-    },
-    ...omit(makeVSheetProps({
-      width: 300
-    }), ['height', 'location', 'minHeight', 'maxHeight', 'minWidth', 'maxWidth'])
-  },
+  props: makeVPickerProps(),
   emits: {
     'update:modelValue': color => true,
     'update:mode': mode => true
@@ -13872,6 +13927,9 @@ const VColorPicker = defineComponent({
       if (!v) return null;
       return extractColor(v, props.modelValue);
     });
+    const {
+      rtlClasses
+    } = useRtl();
     const updateColor = hsva => {
       currentColor.value = hsva;
       lastPickedColor.value = hsva;
@@ -13892,7 +13950,7 @@ const VColorPicker = defineComponent({
         "rounded": props.rounded,
         "elevation": props.elevation,
         "theme": props.theme,
-        "class": ['v-color-picker', props.class],
+        "class": ['v-color-picker', rtlClasses.value, props.class],
         "style": [{
           '--v-color-picker-color-hsv': HSVtoCSS({
             ...(currentColor.value ?? nullColor),
@@ -13954,26 +14012,27 @@ function highlightResult(text, matches, length) {
     "class": "v-combobox__unmask"
   }, [text.substr(matches + length)])]) : text;
 }
+const makeVComboboxProps = propsFactory({
+  // TODO: implement post keyboard support
+  // autoSelectFirst: Boolean,
+  delimiters: Array,
+  ...makeFilterProps({
+    filterKeys: ['title']
+  }),
+  ...makeSelectProps({
+    hideNoData: true,
+    returnObject: true
+  }),
+  ...omit(makeVTextFieldProps({
+    modelValue: null
+  }), ['validationValue', 'dirty', 'appendInnerIcon']),
+  ...makeTransitionProps({
+    transition: false
+  })
+}, 'v-combobox');
 const VCombobox = genericComponent()({
   name: 'VCombobox',
-  props: {
-    // TODO: implement post keyboard support
-    // autoSelectFirst: Boolean,
-    delimiters: Array,
-    ...makeFilterProps({
-      filterKeys: ['title']
-    }),
-    ...makeSelectProps({
-      hideNoData: true,
-      returnObject: true
-    }),
-    ...omit(makeVTextFieldProps({
-      modelValue: null
-    }), ['validationValue', 'dirty', 'appendInnerIcon']),
-    ...makeTransitionProps({
-      transition: false
-    })
-  },
+  props: makeVComboboxProps(),
   emits: {
     'update:focused': focused => true,
     'update:modelValue': val => true,
@@ -14143,7 +14202,10 @@ const VCombobox = genericComponent()({
       }
     }
     function onAfterLeave() {
-      if (isFocused.value) isPristine.value = true;
+      if (isFocused.value) {
+        isPristine.value = true;
+        vTextFieldRef.value?.focus();
+      }
     }
     function select(item) {
       if (props.multiple) {
@@ -14170,23 +14232,16 @@ const VCombobox = genericComponent()({
     function onFocusin(e) {
       isFocused.value = true;
     }
-    function onFocusout(e) {
-      if (e.relatedTarget == null) {
-        vTextFieldRef.value?.focus();
-      }
-    }
     watch(filteredItems, val => {
       if (!val.length && props.hideNoData) menu.value = false;
     });
     watch(isFocused, val => {
-      if (val) {
-        selectionIndex.value = -1;
-      } else {
-        menu.value = false;
-        if (!props.multiple || !search.value) return;
-        model.value = [...model.value, transformItem$1(props, search.value)];
-        search.value = '';
-      }
+      if (val) return;
+      selectionIndex.value = -1;
+      menu.value = false;
+      if (!props.multiple || !search.value) return;
+      model.value = [...model.value, transformItem$1(props, search.value)];
+      search.value = '';
     });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
@@ -14237,8 +14292,7 @@ const VCombobox = genericComponent()({
             "selected": selected.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
-            "onFocusin": onFocusin,
-            "onFocusout": onFocusout
+            "onFocusin": onFocusin
           }, {
             default: () => [!displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
@@ -14256,11 +14310,13 @@ const VCombobox = genericComponent()({
                 let {
                   isSelected
                 } = _ref2;
-                return props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
+                return createVNode(Fragment, null, [props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
                   "modelValue": isSelected,
                   "ripple": false,
                   "tabindex": "-1"
-                }, null) : undefined;
+                }, null) : undefined, item.props.prependIcon && createVNode(VIcon, {
+                  "icon": item.props.prependIcon
+                }, null)]);
               },
               title: () => {
                 return isPristine.value ? item.title : highlightResult(item.title, getMatches(item)?.title, search.value?.length ?? 0);
@@ -14275,6 +14331,10 @@ const VCombobox = genericComponent()({
           }
           const slotProps = {
             'onClick:close': onChipClose,
+            onMousedown(e) {
+              e.preventDefault();
+              e.stopPropagation();
+            },
             modelValue: true,
             'onUpdate:modelValue': undefined
           };
@@ -14327,24 +14387,25 @@ const VCombobox = genericComponent()({
 
 // Types
 
+const makeVDialogProps = propsFactory({
+  fullscreen: Boolean,
+  retainFocus: {
+    type: Boolean,
+    default: true
+  },
+  scrollable: Boolean,
+  ...makeVOverlayProps({
+    origin: 'center center',
+    scrollStrategy: 'block',
+    transition: {
+      component: VDialogTransition
+    },
+    zIndex: 2400
+  })
+}, 'v-dialog');
 const VDialog = genericComponent()({
   name: 'VDialog',
-  props: {
-    fullscreen: Boolean,
-    retainFocus: {
-      type: Boolean,
-      default: true
-    },
-    scrollable: Boolean,
-    ...makeVOverlayProps({
-      origin: 'center center',
-      scrollStrategy: 'block',
-      transition: {
-        component: VDialogTransition
-      },
-      zIndex: 2400
-    })
-  },
+  props: makeVDialogProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -14438,21 +14499,22 @@ const VDialog = genericComponent()({
 
 const VExpansionPanelSymbol = Symbol.for('vuetify:v-expansion-panel');
 const allowedVariants = ['default', 'accordion', 'inset', 'popout'];
+const makeVExpansionPanelsProps = propsFactory({
+  color: String,
+  variant: {
+    type: String,
+    default: 'default',
+    validator: v => allowedVariants.includes(v)
+  },
+  readonly: Boolean,
+  ...makeComponentProps(),
+  ...makeGroupProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-expansion-panel');
 const VExpansionPanels = genericComponent()({
   name: 'VExpansionPanels',
-  props: {
-    color: String,
-    variant: {
-      type: String,
-      default: 'default',
-      validator: v => allowedVariants.includes(v)
-    },
-    readonly: Boolean,
-    ...makeComponentProps(),
-    ...makeGroupProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVExpansionPanelsProps(),
   emits: {
     'update:modelValue': val => true
   },
@@ -14496,17 +14558,15 @@ const makeVExpansionPanelTitleProps = propsFactory({
     type: [Boolean, Object],
     default: false
   },
-  readonly: Boolean
+  readonly: Boolean,
+  ...makeComponentProps()
 }, 'v-expansion-panel-title');
 const VExpansionPanelTitle = genericComponent()({
   name: 'VExpansionPanelTitle',
   directives: {
     Ripple
   },
-  props: {
-    ...makeComponentProps(),
-    ...makeVExpansionPanelTitleProps()
-  },
+  props: makeVExpansionPanelTitleProps(),
   setup(props, _ref) {
     let {
       slots
@@ -14545,12 +14605,13 @@ const VExpansionPanelTitle = genericComponent()({
   }
 });
 
+const makeVExpansionPanelTextProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeLazyProps()
+}, 'v-expansion-panel-text');
 const VExpansionPanelText = genericComponent()({
   name: 'VExpansionPanelText',
-  props: {
-    ...makeComponentProps(),
-    ...makeLazyProps()
-  },
+  props: makeVExpansionPanelTextProps(),
   setup(props, _ref) {
     let {
       slots
@@ -14575,20 +14636,21 @@ const VExpansionPanelText = genericComponent()({
   }
 });
 
+const makeVExpansionPanelProps = propsFactory({
+  title: String,
+  text: String,
+  bgColor: String,
+  ...makeComponentProps(),
+  ...makeElevationProps(),
+  ...makeGroupItemProps(),
+  ...makeLazyProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeVExpansionPanelTitleProps()
+}, 'v-expansion-panel');
 const VExpansionPanel = genericComponent()({
   name: 'VExpansionPanel',
-  props: {
-    title: String,
-    text: String,
-    bgColor: String,
-    ...makeComponentProps(),
-    ...makeElevationProps(),
-    ...makeGroupItemProps(),
-    ...makeLazyProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeVExpansionPanelTitleProps()
-  },
+  props: makeVExpansionPanelProps(),
   emits: {
     'group:selected': val => true
   },
@@ -14631,8 +14693,7 @@ const VExpansionPanel = genericComponent()({
           'v-expansion-panel--after-active': isAfterSelected.value,
           'v-expansion-panel--disabled': isDisabled.value
         }, roundedClasses.value, backgroundColorClasses.value, props.class],
-        "style": [backgroundColorStyles.value, props.style],
-        "aria-expanded": groupItem.isSelected.value
+        "style": [backgroundColorStyles.value, props.style]
       }, {
         default: () => [createVNode("div", {
           "class": ['v-expansion-panel__shadow', ...elevationClasses.value]
@@ -14659,42 +14720,43 @@ const VExpansionPanel = genericComponent()({
 
 // Types
 
+const makeVFileInputProps = propsFactory({
+  chips: Boolean,
+  counter: Boolean,
+  counterSizeString: {
+    type: String,
+    default: '$vuetify.fileInput.counterSize'
+  },
+  counterString: {
+    type: String,
+    default: '$vuetify.fileInput.counter'
+  },
+  multiple: Boolean,
+  showSize: {
+    type: [Boolean, Number],
+    default: false,
+    validator: v => {
+      return typeof v === 'boolean' || [1000, 1024].includes(v);
+    }
+  },
+  ...makeVInputProps({
+    prependIcon: '$file'
+  }),
+  modelValue: {
+    type: Array,
+    default: () => [],
+    validator: val => {
+      return wrapInArray(val).every(v => v != null && typeof v === 'object');
+    }
+  },
+  ...makeVFieldProps({
+    clearable: true
+  })
+}, 'v-file-input');
 const VFileInput = genericComponent()({
   name: 'VFileInput',
   inheritAttrs: false,
-  props: {
-    chips: Boolean,
-    counter: Boolean,
-    counterSizeString: {
-      type: String,
-      default: '$vuetify.fileInput.counterSize'
-    },
-    counterString: {
-      type: String,
-      default: '$vuetify.fileInput.counter'
-    },
-    multiple: Boolean,
-    showSize: {
-      type: [Boolean, Number],
-      default: false,
-      validator: v => {
-        return typeof v === 'boolean' || [1000, 1024].includes(v);
-      }
-    },
-    ...makeVInputProps({
-      prependIcon: '$file'
-    }),
-    modelValue: {
-      type: Array,
-      default: () => [],
-      validator: val => {
-        return wrapInArray(val).every(v => v != null && typeof v === 'object');
-      }
-    },
-    ...makeVFieldProps({
-      clearable: true
-    })
-  },
+  props: makeVFileInputProps(),
   emits: {
     'click:control': e => true,
     'mousedown:control': e => true,
@@ -14738,6 +14800,7 @@ const VFileInput = genericComponent()({
     const vInputRef = ref();
     const vFieldRef = ref();
     const inputRef = ref();
+    const isActive = computed(() => isFocused.value || props.active);
     function onFocus() {
       if (inputRef.value !== document.activeElement) {
         inputRef.value?.focus();
@@ -14806,7 +14869,7 @@ const VFileInput = genericComponent()({
             "onClick:appendInner": props['onClick:appendInner']
           }, fieldProps, {
             "id": id.value,
-            "active": isDirty.value || isFocused.value,
+            "active": isActive.value || isDirty.value,
             "dirty": isDirty.value,
             "disabled": isDisabled.value,
             "focused": isFocused.value,
@@ -14864,25 +14927,26 @@ const VFileInput = genericComponent()({
   }
 });
 
+const makeVFooterProps = propsFactory({
+  app: Boolean,
+  color: String,
+  height: {
+    type: [Number, String],
+    default: 'auto'
+  },
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeElevationProps(),
+  ...makeLayoutItemProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps({
+    tag: 'footer'
+  }),
+  ...makeThemeProps()
+}, 'v-footer');
 const VFooter = genericComponent()({
   name: 'VFooter',
-  props: {
-    app: Boolean,
-    color: String,
-    height: {
-      type: [Number, String],
-      default: 'auto'
-    },
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeElevationProps(),
-    ...makeLayoutItemProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps({
-      tag: 'footer'
-    }),
-    ...makeThemeProps()
-  },
+  props: makeVFooterProps(),
   setup(props, _ref) {
     let {
       slots
@@ -14933,12 +14997,13 @@ const VFooter = genericComponent()({
 
 // Types
 
+const makeVFormProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeFormProps()
+}, 'v-form');
 const VForm = genericComponent()({
   name: 'VForm',
-  props: {
-    ...makeComponentProps(),
-    ...makeFormProps()
-  },
+  props: makeVFormProps(),
   emits: {
     'update:modelValue': val => true,
     submit: e => true
@@ -14985,24 +15050,28 @@ const VForm = genericComponent()({
   }
 });
 
+const makeVContainerProps = propsFactory({
+  fluid: {
+    type: Boolean,
+    default: false
+  },
+  ...makeComponentProps(),
+  ...makeTagProps()
+}, 'v-container');
 const VContainer = genericComponent()({
   name: 'VContainer',
-  props: {
-    fluid: {
-      type: Boolean,
-      default: false
-    },
-    ...makeComponentProps(),
-    ...makeTagProps()
-  },
+  props: makeVContainerProps(),
   setup(props, _ref) {
     let {
       slots
     } = _ref;
+    const {
+      rtlClasses
+    } = useRtl();
     useRender(() => createVNode(props.tag, {
       "class": ['v-container', {
         'v-container--fluid': props.fluid
-      }, props.class],
+      }, rtlClasses.value, props.class],
       "style": props.style
     }, slots));
     return {};
@@ -15071,32 +15140,33 @@ function breakpointClass$1(type, prop, val) {
   return className.toLowerCase();
 }
 const ALIGN_SELF_VALUES = ['auto', 'start', 'end', 'center', 'baseline', 'stretch'];
+const makeVColProps = propsFactory({
+  cols: {
+    type: [Boolean, String, Number],
+    default: false
+  },
+  ...breakpointProps,
+  offset: {
+    type: [String, Number],
+    default: null
+  },
+  ...offsetProps,
+  order: {
+    type: [String, Number],
+    default: null
+  },
+  ...orderProps,
+  alignSelf: {
+    type: String,
+    default: null,
+    validator: str => ALIGN_SELF_VALUES.includes(str)
+  },
+  ...makeComponentProps(),
+  ...makeTagProps()
+}, 'v-col');
 const VCol = genericComponent()({
   name: 'VCol',
-  props: {
-    cols: {
-      type: [Boolean, String, Number],
-      default: false
-    },
-    ...breakpointProps,
-    offset: {
-      type: [String, Number],
-      default: null
-    },
-    ...offsetProps,
-    order: {
-      type: [String, Number],
-      default: null
-    },
-    ...orderProps,
-    alignSelf: {
-      type: String,
-      default: null,
-      validator: str => ALIGN_SELF_VALUES.includes(str)
-    },
-    ...makeComponentProps(),
-    ...makeTagProps()
-  },
+  props: makeVColProps(),
   setup(props, _ref) {
     let {
       slots
@@ -15189,32 +15259,33 @@ function breakpointClass(type, prop, val) {
   className += `-${val}`;
   return className.toLowerCase();
 }
+const makeVRowProps = propsFactory({
+  dense: Boolean,
+  noGutters: Boolean,
+  align: {
+    type: String,
+    default: null,
+    validator: alignValidator
+  },
+  ...alignProps,
+  justify: {
+    type: String,
+    default: null,
+    validator: justifyValidator
+  },
+  ...justifyProps,
+  alignContent: {
+    type: String,
+    default: null,
+    validator: alignContentValidator
+  },
+  ...alignContentProps,
+  ...makeComponentProps(),
+  ...makeTagProps()
+}, 'v-row');
 const VRow = genericComponent()({
   name: 'VRow',
-  props: {
-    dense: Boolean,
-    noGutters: Boolean,
-    align: {
-      type: String,
-      default: null,
-      validator: alignValidator
-    },
-    ...alignProps,
-    justify: {
-      type: String,
-      default: null,
-      validator: justifyValidator
-    },
-    ...justifyProps,
-    alignContent: {
-      type: String,
-      default: null,
-      validator: alignContentValidator
-    },
-    ...alignContentProps,
-    ...makeComponentProps(),
-    ...makeTagProps()
-  },
+  props: makeVRowProps(),
   setup(props, _ref) {
     let {
       slots
@@ -15250,16 +15321,17 @@ const VRow = genericComponent()({
 const VSpacer = createSimpleFunctional('flex-grow-1', 'div', 'VSpacer');
 
 // Composables
+const makeVHoverProps = propsFactory({
+  disabled: Boolean,
+  modelValue: {
+    type: Boolean,
+    default: undefined
+  },
+  ...makeDelayProps()
+}, 'v-hover');
 const VHover = genericComponent()({
   name: 'VHover',
-  props: {
-    disabled: Boolean,
-    modelValue: {
-      type: Boolean,
-      default: undefined
-    },
-    ...makeDelayProps()
-  },
+  props: makeVHoverProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -15283,16 +15355,17 @@ const VHover = genericComponent()({
 });
 
 const VItemGroupSymbol = Symbol.for('vuetify:v-item-group');
+const makeVItemGroupProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeGroupProps({
+    selectedClass: 'v-item--selected'
+  }),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-item-group');
 const VItemGroup = genericComponent()({
   name: 'VItemGroup',
-  props: {
-    ...makeComponentProps(),
-    ...makeGroupProps({
-      selectedClass: 'v-item--selected'
-    }),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVItemGroupProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -15360,12 +15433,13 @@ const VItem = genericComponent()({
 
 const VKbd = createSimpleFunctional('v-kbd');
 
+const makeVLayoutProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeLayoutProps()
+}, 'v-layout');
 const VLayout = genericComponent()({
   name: 'VLayout',
-  props: {
-    ...makeComponentProps(),
-    ...makeLayoutProps()
-  },
+  props: makeVLayoutProps(),
   setup(props, _ref) {
     let {
       slots
@@ -15391,21 +15465,22 @@ const VLayout = genericComponent()({
 
 // Types
 
+const makeVLayoutItemProps = propsFactory({
+  position: {
+    type: String,
+    required: true
+  },
+  size: {
+    type: [Number, String],
+    default: 300
+  },
+  modelValue: Boolean,
+  ...makeComponentProps(),
+  ...makeLayoutItemProps()
+}, 'v-layout-item');
 const VLayoutItem = genericComponent()({
   name: 'VLayoutItem',
-  props: {
-    position: {
-      type: String,
-      required: true
-    },
-    size: {
-      type: [Number, String],
-      default: 300
-    },
-    modelValue: Boolean,
-    ...makeComponentProps(),
-    ...makeLayoutItemProps()
-  },
+  props: makeVLayoutItemProps(),
   setup(props, _ref) {
     let {
       slots
@@ -15430,30 +15505,31 @@ const VLayoutItem = genericComponent()({
 
 // Types
 
+const makeVLazyProps = propsFactory({
+  modelValue: Boolean,
+  options: {
+    type: Object,
+    // For more information on types, navigate to:
+    // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
+    default: () => ({
+      root: undefined,
+      rootMargin: undefined,
+      threshold: undefined
+    })
+  },
+  ...makeComponentProps(),
+  ...makeDimensionProps(),
+  ...makeTagProps(),
+  ...makeTransitionProps({
+    transition: 'fade-transition'
+  })
+}, 'v-lazy');
 const VLazy = genericComponent()({
   name: 'VLazy',
   directives: {
     intersect: Intersect
   },
-  props: {
-    modelValue: Boolean,
-    options: {
-      type: Object,
-      // For more information on types, navigate to:
-      // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
-      default: () => ({
-        root: undefined,
-        rootMargin: undefined,
-        threshold: undefined
-      })
-    },
-    ...makeComponentProps(),
-    ...makeDimensionProps(),
-    ...makeTagProps(),
-    ...makeTransitionProps({
-      transition: 'fade-transition'
-    })
-  },
+  props: makeVLazyProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -15487,18 +15563,19 @@ const VLazy = genericComponent()({
   }
 });
 
+const makeVLocaleProviderProps = propsFactory({
+  locale: String,
+  fallbackLocale: String,
+  messages: Object,
+  rtl: {
+    type: Boolean,
+    default: undefined
+  },
+  ...makeComponentProps()
+}, 'v-locale-provider');
 const VLocaleProvider = genericComponent()({
   name: 'VLocaleProvider',
-  props: {
-    locale: String,
-    fallbackLocale: String,
-    messages: Object,
-    rtl: {
-      type: Boolean,
-      default: undefined
-    },
-    ...makeComponentProps()
-  },
+  props: makeVLocaleProviderProps(),
   setup(props, _ref) {
     let {
       slots
@@ -15514,15 +15591,16 @@ const VLocaleProvider = genericComponent()({
   }
 });
 
+const makeVMainProps = propsFactory({
+  scrollable: Boolean,
+  ...makeComponentProps(),
+  ...makeTagProps({
+    tag: 'main'
+  })
+}, 'v-main');
 const VMain = genericComponent()({
   name: 'VMain',
-  props: {
-    scrollable: Boolean,
-    ...makeComponentProps(),
-    ...makeTagProps({
-      tag: 'main'
-    })
-  },
+  props: makeVMainProps(),
   setup(props, _ref) {
     let {
       slots
@@ -15590,18 +15668,24 @@ function useSticky(_ref) {
     const layoutTop = parseFloat(layoutItemStyles.value.top ?? 0);
     const top = window.scrollY - Math.max(0, stuckPosition.value - layoutTop);
     const bottom = rect.height + Math.max(stuckPosition.value, layoutTop) - window.scrollY - window.innerHeight;
+    const bodyScroll = parseFloat(getComputedStyle(rootEl.value).getPropertyValue('--v-body-scroll-y')) || 0;
     if (rect.height < window.innerHeight - layoutTop) {
       isStuck.value = 'top';
       stuckPosition.value = layoutTop;
     } else if (direction === 'up' && isStuck.value === 'bottom' || direction === 'down' && isStuck.value === 'top') {
-      stuckPosition.value = window.scrollY + rect.top;
+      stuckPosition.value = window.scrollY + rect.top - bodyScroll;
       isStuck.value = true;
     } else if (direction === 'down' && bottom <= 0) {
       stuckPosition.value = 0;
       isStuck.value = 'bottom';
     } else if (direction === 'up' && top <= 0) {
-      stuckPosition.value = rect.top + top;
-      isStuck.value = 'top';
+      if (!bodyScroll) {
+        stuckPosition.value = rect.top + top;
+        isStuck.value = 'top';
+      } else if (isStuck.value !== 'top') {
+        stuckPosition.value = -top + bodyScroll + layoutTop;
+        isStuck.value = 'top';
+      }
     }
     lastScrollTop = window.scrollY;
   }
@@ -15844,54 +15928,55 @@ function oops() {
 // Types
 
 const locations = ['start', 'end', 'left', 'right', 'top', 'bottom'];
+const makeVNavigationDrawerProps = propsFactory({
+  color: String,
+  disableResizeWatcher: Boolean,
+  disableRouteWatcher: Boolean,
+  expandOnHover: Boolean,
+  floating: Boolean,
+  modelValue: {
+    type: Boolean,
+    default: null
+  },
+  permanent: Boolean,
+  rail: {
+    type: Boolean,
+    default: null
+  },
+  railWidth: {
+    type: [Number, String],
+    default: 56
+  },
+  scrim: {
+    type: [String, Boolean],
+    default: true
+  },
+  image: String,
+  temporary: Boolean,
+  touchless: Boolean,
+  width: {
+    type: [Number, String],
+    default: 256
+  },
+  location: {
+    type: String,
+    default: 'start',
+    validator: value => locations.includes(value)
+  },
+  sticky: Boolean,
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeElevationProps(),
+  ...makeLayoutItemProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps({
+    tag: 'nav'
+  }),
+  ...makeThemeProps()
+}, 'v-navigation-drawer');
 const VNavigationDrawer = genericComponent()({
   name: 'VNavigationDrawer',
-  props: {
-    color: String,
-    disableResizeWatcher: Boolean,
-    disableRouteWatcher: Boolean,
-    expandOnHover: Boolean,
-    floating: Boolean,
-    modelValue: {
-      type: Boolean,
-      default: null
-    },
-    permanent: Boolean,
-    rail: {
-      type: Boolean,
-      default: null
-    },
-    railWidth: {
-      type: [Number, String],
-      default: 56
-    },
-    scrim: {
-      type: [String, Boolean],
-      default: true
-    },
-    image: String,
-    temporary: Boolean,
-    touchless: Boolean,
-    width: {
-      type: [Number, String],
-      default: 256
-    },
-    location: {
-      type: String,
-      default: 'start',
-      validator: value => locations.includes(value)
-    },
-    sticky: Boolean,
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeElevationProps(),
-    ...makeLayoutItemProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps({
-      tag: 'nav'
-    }),
-    ...makeThemeProps()
-  },
+  props: makeVNavigationDrawerProps(),
   emits: {
     'update:modelValue': val => true,
     'update:rail': val => true
@@ -15972,7 +16057,6 @@ const VNavigationDrawer = genericComponent()({
     });
     const {
       layoutItemStyles,
-      layoutRect,
       layoutItemScrimStyles
     } = useLayoutItem({
       id: props.name,
@@ -16002,12 +16086,6 @@ const VNavigationDrawer = genericComponent()({
         opacity: dragProgress.value * 0.2,
         transition: 'none'
       } : undefined),
-      ...(layoutRect.value ? {
-        left: convertToUnit(layoutRect.value.left),
-        right: convertToUnit(layoutRect.value.right),
-        top: convertToUnit(layoutRect.value.top),
-        bottom: convertToUnit(layoutRect.value.bottom)
-      } : undefined),
       ...layoutItemScrimStyles.value
     }));
     provideDefaults({
@@ -16096,88 +16174,89 @@ function useRefs() {
 
 // Types
 
-const VPagination = genericComponent()({
-  name: 'VPagination',
-  props: {
-    activeColor: String,
-    start: {
-      type: [Number, String],
-      default: 1
-    },
-    modelValue: {
-      type: Number,
-      default: props => props.start
-    },
-    disabled: Boolean,
-    length: {
-      type: [Number, String],
-      default: 1,
-      validator: val => val % 1 === 0
-    },
-    totalVisible: [Number, String],
-    firstIcon: {
-      type: IconValue,
-      default: '$first'
-    },
-    prevIcon: {
-      type: IconValue,
-      default: '$prev'
-    },
-    nextIcon: {
-      type: IconValue,
-      default: '$next'
-    },
-    lastIcon: {
-      type: IconValue,
-      default: '$last'
-    },
-    ariaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.root'
-    },
-    pageAriaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.page'
-    },
-    currentPageAriaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.currentPage'
-    },
-    firstAriaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.first'
-    },
-    previousAriaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.previous'
-    },
-    nextAriaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.next'
-    },
-    lastAriaLabel: {
-      type: String,
-      default: '$vuetify.pagination.ariaLabel.last'
-    },
-    ellipsis: {
-      type: String,
-      default: '...'
-    },
-    showFirstLastPage: Boolean,
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeElevationProps(),
-    ...makeRoundedProps(),
-    ...makeSizeProps(),
-    ...makeTagProps({
-      tag: 'nav'
-    }),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'text'
-    })
+const makeVPaginationProps = propsFactory({
+  activeColor: String,
+  start: {
+    type: [Number, String],
+    default: 1
+  },
+  modelValue: {
+    type: Number,
+    default: props => props.start
+  },
+  disabled: Boolean,
+  length: {
+    type: [Number, String],
+    default: 1,
+    validator: val => val % 1 === 0
+  },
+  totalVisible: [Number, String],
+  firstIcon: {
+    type: IconValue,
+    default: '$first'
+  },
+  prevIcon: {
+    type: IconValue,
+    default: '$prev'
+  },
+  nextIcon: {
+    type: IconValue,
+    default: '$next'
+  },
+  lastIcon: {
+    type: IconValue,
+    default: '$last'
+  },
+  ariaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.root'
+  },
+  pageAriaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.page'
+  },
+  currentPageAriaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.currentPage'
+  },
+  firstAriaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.first'
+  },
+  previousAriaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.previous'
+  },
+  nextAriaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.next'
+  },
+  lastAriaLabel: {
+    type: String,
+    default: '$vuetify.pagination.ariaLabel.last'
+  },
+  ellipsis: {
+    type: String,
+    default: '...'
   },
+  showFirstLastPage: Boolean,
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeElevationProps(),
+  ...makeRoundedProps(),
+  ...makeSizeProps(),
+  ...makeTagProps({
+    tag: 'nav'
+  }),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'text'
+  })
+}, 'v-pagination');
+const VPagination = genericComponent()({
+  name: 'VPagination',
+  props: makeVPaginationProps(),
   emits: {
     'update:modelValue': value => true,
     first: value => true,
@@ -16416,15 +16495,16 @@ const VPagination = genericComponent()({
 function floor(val) {
   return Math.floor(Math.abs(val)) * Math.sign(val);
 }
+const makeVParallaxProps = propsFactory({
+  scale: {
+    type: [Number, String],
+    default: 0.5
+  },
+  ...makeComponentProps()
+}, 'v-parallax');
 const VParallax = genericComponent()({
   name: 'VParallax',
-  props: {
-    scale: {
-      type: [Number, String],
-      default: 0.5
-    },
-    ...makeComponentProps()
-  },
+  props: makeVParallaxProps(),
   setup(props, _ref) {
     let {
       slots
@@ -16498,14 +16578,15 @@ const VParallax = genericComponent()({
 
 // Types
 
+const makeVRadioProps = propsFactory({
+  ...makeSelectionControlProps({
+    falseIcon: '$radioOff',
+    trueIcon: '$radioOn'
+  })
+}, 'v-radio');
 const VRadio = genericComponent()({
   name: 'VRadio',
-  props: {
-    ...makeSelectionControlProps({
-      falseIcon: '$radioOff',
-      trueIcon: '$radioOn'
-    })
-  },
+  props: makeVRadioProps(),
   setup(props, _ref) {
     let {
       slots
@@ -16521,29 +16602,30 @@ const VRadio = genericComponent()({
 
 // Types
 
+const makeVRadioGroupProps = propsFactory({
+  height: {
+    type: [Number, String],
+    default: 'auto'
+  },
+  ...makeVInputProps(),
+  ...omit(makeSelectionControlGroupProps(), ['multiple']),
+  trueIcon: {
+    type: IconValue,
+    default: '$radioOn'
+  },
+  falseIcon: {
+    type: IconValue,
+    default: '$radioOff'
+  },
+  type: {
+    type: String,
+    default: 'radio'
+  }
+}, 'v-radio-group');
 const VRadioGroup = genericComponent()({
   name: 'VRadioGroup',
   inheritAttrs: false,
-  props: {
-    height: {
-      type: [Number, String],
-      default: 'auto'
-    },
-    ...makeVInputProps(),
-    ...omit(makeSelectionControlGroupProps(), ['multiple']),
-    trueIcon: {
-      type: IconValue,
-      default: '$radioOn'
-    },
-    falseIcon: {
-      type: IconValue,
-      default: '$radioOff'
-    },
-    type: {
-      type: String,
-      default: 'radio'
-    }
-  },
+  props: makeVRadioGroupProps(),
   emits: {
     'update:modelValue': val => true
   },
@@ -16609,18 +16691,19 @@ const VRadioGroup = genericComponent()({
 
 // Types
 
+const makeVRangeSliderProps = propsFactory({
+  ...makeFocusProps(),
+  ...makeVInputProps(),
+  ...makeSliderProps(),
+  strict: Boolean,
+  modelValue: {
+    type: Array,
+    default: () => [0, 0]
+  }
+}, 'v-range-slider');
 const VRangeSlider = genericComponent()({
   name: 'VRangeSlider',
-  props: {
-    ...makeFocusProps(),
-    ...makeVInputProps(),
-    ...makeSliderProps(),
-    strict: Boolean,
-    modelValue: {
-      type: Array,
-      default: () => [0, 0]
-    }
-  },
+  props: makeVRangeSliderProps(),
   emits: {
     'update:focused': value => true,
     'update:modelValue': value => true,
@@ -16635,6 +16718,9 @@ const VRangeSlider = genericComponent()({
     const startThumbRef = ref();
     const stopThumbRef = ref();
     const inputRef = ref();
+    const {
+      rtlClasses
+    } = useRtl();
     function getActiveThumb(e) {
       if (!startThumbRef.value || !stopThumbRef.value) return;
       const startOffset = getOffset(e, startThumbRef.value.$el, props.direction);
@@ -16705,7 +16791,7 @@ const VRangeSlider = genericComponent()({
           'v-slider--focused': isFocused.value,
           'v-slider--pressed': mousePressed.value,
           'v-slider--disabled': props.disabled
-        }, props.class],
+        }, rtlClasses.value, props.class],
         "style": props.style,
         "ref": inputRef
       }, inputProps, {
@@ -16811,50 +16897,51 @@ const VRangeSlider = genericComponent()({
 
 // Types
 
+const makeVRatingProps = propsFactory({
+  name: String,
+  itemAriaLabel: {
+    type: String,
+    default: '$vuetify.rating.ariaLabel.item'
+  },
+  activeColor: String,
+  color: String,
+  clearable: Boolean,
+  disabled: Boolean,
+  emptyIcon: {
+    type: IconValue,
+    default: '$ratingEmpty'
+  },
+  fullIcon: {
+    type: IconValue,
+    default: '$ratingFull'
+  },
+  halfIncrements: Boolean,
+  hover: Boolean,
+  length: {
+    type: [Number, String],
+    default: 5
+  },
+  readonly: Boolean,
+  modelValue: {
+    type: [Number, String],
+    default: 0
+  },
+  itemLabels: Array,
+  itemLabelPosition: {
+    type: String,
+    default: 'top',
+    validator: v => ['top', 'bottom'].includes(v)
+  },
+  ripple: Boolean,
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeSizeProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-rating');
 const VRating = genericComponent()({
   name: 'VRating',
-  props: {
-    name: String,
-    itemAriaLabel: {
-      type: String,
-      default: '$vuetify.rating.ariaLabel.item'
-    },
-    activeColor: String,
-    color: String,
-    clearable: Boolean,
-    disabled: Boolean,
-    emptyIcon: {
-      type: IconValue,
-      default: '$ratingEmpty'
-    },
-    fullIcon: {
-      type: IconValue,
-      default: '$ratingFull'
-    },
-    halfIncrements: Boolean,
-    hover: Boolean,
-    length: {
-      type: [Number, String],
-      default: 5
-    },
-    readonly: Boolean,
-    modelValue: {
-      type: [Number, String],
-      default: 0
-    },
-    itemLabels: Array,
-    itemLabelPosition: {
-      type: String,
-      default: 'top',
-      validator: v => ['top', 'bottom'].includes(v)
-    },
-    ripple: Boolean,
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeSizeProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVRatingProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -17366,9 +17453,7 @@ const VSlideGroup = genericComponent()({
 
 const VSlideGroupItem = genericComponent()({
   name: 'VSlideGroupItem',
-  props: {
-    ...makeGroupItemProps()
-  },
+  props: makeGroupItemProps(),
   emits: {
     'group:selected': val => true
   },
@@ -17386,26 +17471,27 @@ const VSlideGroupItem = genericComponent()({
   }
 });
 
+const makeVSnackbarProps = propsFactory({
+  multiLine: Boolean,
+  timeout: {
+    type: [Number, String],
+    default: 5000
+  },
+  vertical: Boolean,
+  ...makeLocationProps({
+    location: 'bottom'
+  }),
+  ...makePositionProps(),
+  ...makeRoundedProps(),
+  ...makeVariantProps(),
+  ...makeThemeProps(),
+  ...omit(makeVOverlayProps({
+    transition: 'v-snackbar-transition'
+  }), ['persistent', 'noClickAnimation', 'scrim', 'scrollStrategy'])
+}, 'v-snackbar');
 const VSnackbar = genericComponent()({
   name: 'VSnackbar',
-  props: {
-    multiLine: Boolean,
-    timeout: {
-      type: [Number, String],
-      default: 5000
-    },
-    vertical: Boolean,
-    ...makeLocationProps({
-      location: 'bottom'
-    }),
-    ...makePositionProps(),
-    ...makeRoundedProps(),
-    ...makeVariantProps(),
-    ...makeThemeProps(),
-    ...omit(makeVOverlayProps({
-      transition: 'v-snackbar-transition'
-    }), ['persistent', 'noClickAnimation', 'scrim', 'scrollStrategy'])
-  },
+  props: makeVSnackbarProps(),
   emits: {
     'update:modelValue': v => true
   },
@@ -17502,20 +17588,21 @@ const VSnackbar = genericComponent()({
 
 // Types
 
+const makeVSwitchProps = propsFactory({
+  indeterminate: Boolean,
+  inset: Boolean,
+  flat: Boolean,
+  loading: {
+    type: [Boolean, String],
+    default: false
+  },
+  ...makeVInputProps(),
+  ...makeSelectionControlProps()
+}, 'v-switch');
 const VSwitch = genericComponent()({
   name: 'VSwitch',
   inheritAttrs: false,
-  props: {
-    indeterminate: Boolean,
-    inset: Boolean,
-    flat: Boolean,
-    loading: {
-      type: [Boolean, String],
-      default: false
-    },
-    ...makeVInputProps(),
-    ...makeSelectionControlProps()
-  },
+  props: makeVSwitchProps(),
   emits: {
     'update:focused': focused => true,
     'update:modelValue': () => true,
@@ -17625,19 +17712,20 @@ const VSwitch = genericComponent()({
   }
 });
 
+const makeVSystemBarProps = propsFactory({
+  color: String,
+  height: [Number, String],
+  window: Boolean,
+  ...makeComponentProps(),
+  ...makeElevationProps(),
+  ...makeLayoutItemProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-system-bar');
 const VSystemBar = genericComponent()({
   name: 'VSystemBar',
-  props: {
-    color: String,
-    height: [Number, String],
-    window: Boolean,
-    ...makeComponentProps(),
-    ...makeElevationProps(),
-    ...makeLayoutItemProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVSystemBarProps(),
   setup(props, _ref) {
     let {
       slots
@@ -17682,21 +17770,22 @@ const VSystemBar = genericComponent()({
 
 const VTabsSymbol = Symbol.for('vuetify:v-tabs');
 
+const makeVTabProps = propsFactory({
+  fixed: Boolean,
+  sliderColor: String,
+  hideSlider: Boolean,
+  direction: {
+    type: String,
+    default: 'horizontal'
+  },
+  ...omit(makeVBtnProps({
+    selectedClass: 'v-tab--selected',
+    variant: 'text'
+  }), ['active', 'block', 'flat', 'location', 'position', 'symbol'])
+}, 'v-tabs');
 const VTab = genericComponent()({
   name: 'VTab',
-  props: {
-    fixed: Boolean,
-    sliderColor: String,
-    hideSlider: Boolean,
-    direction: {
-      type: String,
-      default: 'horizontal'
-    },
-    ...omit(makeVBtnProps({
-      selectedClass: 'v-tab--selected',
-      variant: 'text'
-    }), ['active', 'block', 'flat', 'location', 'position', 'symbol'])
-  },
+  props: makeVTabProps(),
   setup(props, _ref) {
     let {
       slots,
@@ -17782,34 +17871,35 @@ function parseItems(items) {
     return item;
   });
 }
+const makeVTabsProps = propsFactory({
+  alignTabs: {
+    type: String,
+    default: 'start'
+  },
+  color: String,
+  fixedTabs: Boolean,
+  items: {
+    type: Array,
+    default: () => []
+  },
+  stacked: Boolean,
+  bgColor: String,
+  grow: Boolean,
+  height: {
+    type: [Number, String],
+    default: undefined
+  },
+  hideSlider: Boolean,
+  sliderColor: String,
+  ...makeVSlideGroupProps({
+    mandatory: 'force'
+  }),
+  ...makeDensityProps(),
+  ...makeTagProps()
+}, 'v-tabs');
 const VTabs = genericComponent()({
   name: 'VTabs',
-  props: {
-    alignTabs: {
-      type: String,
-      default: 'start'
-    },
-    color: String,
-    fixedTabs: Boolean,
-    items: {
-      type: Array,
-      default: () => []
-    },
-    stacked: Boolean,
-    bgColor: String,
-    grow: Boolean,
-    height: {
-      type: [Number, String],
-      default: undefined
-    },
-    hideSlider: Boolean,
-    sliderColor: String,
-    ...makeVSlideGroupProps({
-      mandatory: 'force'
-    }),
-    ...makeDensityProps(),
-    ...makeTagProps()
-  },
+  props: makeVTabsProps(),
   emits: {
     'update:modelValue': v => true
   },
@@ -17861,18 +17951,19 @@ const VTabs = genericComponent()({
   }
 });
 
+const makeVTableProps = propsFactory({
+  fixedHeader: Boolean,
+  fixedFooter: Boolean,
+  height: [Number, String],
+  hover: Boolean,
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-table');
 const VTable = genericComponent()({
   name: 'VTable',
-  props: {
-    fixedHeader: Boolean,
-    fixedFooter: Boolean,
-    height: [Number, String],
-    hover: Boolean,
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVTableProps(),
   setup(props, _ref) {
     let {
       slots
@@ -17907,36 +17998,37 @@ const VTable = genericComponent()({
 
 // Types
 
+const makeVTextareaProps = propsFactory({
+  autoGrow: Boolean,
+  autofocus: Boolean,
+  counter: [Boolean, Number, String],
+  counterValue: Function,
+  prefix: String,
+  placeholder: String,
+  persistentPlaceholder: Boolean,
+  persistentCounter: Boolean,
+  noResize: Boolean,
+  rows: {
+    type: [Number, String],
+    default: 5,
+    validator: v => !isNaN(parseFloat(v))
+  },
+  maxRows: {
+    type: [Number, String],
+    validator: v => !isNaN(parseFloat(v))
+  },
+  suffix: String,
+  modelModifiers: Object,
+  ...makeVInputProps(),
+  ...makeVFieldProps()
+}, 'v-textarea');
 const VTextarea = genericComponent()({
   name: 'VTextarea',
   directives: {
     Intersect
   },
   inheritAttrs: false,
-  props: {
-    autoGrow: Boolean,
-    autofocus: Boolean,
-    counter: [Boolean, Number, String],
-    counterValue: Function,
-    prefix: String,
-    placeholder: String,
-    persistentPlaceholder: Boolean,
-    persistentCounter: Boolean,
-    noResize: Boolean,
-    rows: {
-      type: [Number, String],
-      default: 5,
-      validator: v => !isNaN(parseFloat(v))
-    },
-    maxRows: {
-      type: [Number, String],
-      validator: v => !isNaN(parseFloat(v))
-    },
-    suffix: String,
-    modelModifiers: Object,
-    ...makeVInputProps(),
-    ...makeVFieldProps()
-  },
+  props: makeVTextareaProps(),
   emits: {
     'click:control': e => true,
     'mousedown:control': e => true,
@@ -17971,7 +18063,7 @@ const VTextarea = genericComponent()({
     const vFieldRef = ref();
     const controlHeight = ref('');
     const textareaRef = ref();
-    const isActive = computed(() => isFocused.value || props.persistentPlaceholder);
+    const isActive = computed(() => props.persistentPlaceholder || isFocused.value || props.active);
     function onFocus() {
       if (textareaRef.value !== document.activeElement) {
         textareaRef.value?.focus();
@@ -18138,14 +18230,15 @@ const VTextarea = genericComponent()({
   }
 });
 
+const makeVThemeProviderProps = propsFactory({
+  withBackground: Boolean,
+  ...makeComponentProps(),
+  ...makeThemeProps(),
+  ...makeTagProps()
+}, 'v-theme-provider');
 const VThemeProvider = genericComponent()({
   name: 'VThemeProvider',
-  props: {
-    withBackground: Boolean,
-    ...makeComponentProps(),
-    ...makeThemeProps(),
-    ...makeTagProps()
-  },
+  props: makeVThemeProviderProps(),
   setup(props, _ref) {
     let {
       slots
@@ -18167,46 +18260,47 @@ const VThemeProvider = genericComponent()({
 
 // Types
 
+const makeVTimelineProps = propsFactory({
+  align: {
+    type: String,
+    default: 'center',
+    validator: v => ['center', 'start'].includes(v)
+  },
+  direction: {
+    type: String,
+    default: 'vertical',
+    validator: v => ['vertical', 'horizontal'].includes(v)
+  },
+  justify: {
+    type: String,
+    default: 'auto',
+    validator: v => ['auto', 'center'].includes(v)
+  },
+  side: {
+    type: String,
+    validator: v => v == null || ['start', 'end'].includes(v)
+  },
+  lineInset: {
+    type: [String, Number],
+    default: 0
+  },
+  lineThickness: {
+    type: [String, Number],
+    default: 2
+  },
+  lineColor: String,
+  truncateLine: {
+    type: String,
+    validator: v => ['start', 'end', 'both'].includes(v)
+  },
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-timeline');
 const VTimeline = genericComponent()({
   name: 'VTimeline',
-  props: {
-    align: {
-      type: String,
-      default: 'center',
-      validator: v => ['center', 'start'].includes(v)
-    },
-    direction: {
-      type: String,
-      default: 'vertical',
-      validator: v => ['vertical', 'horizontal'].includes(v)
-    },
-    justify: {
-      type: String,
-      default: 'auto',
-      validator: v => ['auto', 'center'].includes(v)
-    },
-    side: {
-      type: String,
-      validator: v => v == null || ['start', 'end'].includes(v)
-    },
-    lineInset: {
-      type: [String, Number],
-      default: 0
-    },
-    lineThickness: {
-      type: [String, Number],
-      default: 2
-    },
-    lineColor: String,
-    truncateLine: {
-      type: String,
-      validator: v => ['start', 'end', 'both'].includes(v)
-    },
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVTimelineProps(),
   setup(props, _ref) {
     let {
       slots
@@ -18217,6 +18311,9 @@ const VTimeline = genericComponent()({
     const {
       densityClasses
     } = useDensity(props);
+    const {
+      rtlClasses
+    } = useRtl();
     provideDefaults({
       VTimelineDivider: {
         lineColor: toRef(props, 'lineColor')
@@ -18246,7 +18343,7 @@ const VTimeline = genericComponent()({
     useRender(() => createVNode(props.tag, {
       "class": ['v-timeline', `v-timeline--${props.direction}`, `v-timeline--align-${props.align}`, `v-timeline--justify-${props.justify}`, truncateClasses.value, {
         'v-timeline--inset-line': !!props.lineInset
-      }, themeClasses.value, densityClasses.value, sideClasses.value, props.class],
+      }, themeClasses.value, densityClasses.value, sideClasses.value, rtlClasses.value, props.class],
       "style": [{
         '--v-timeline-line-thickness': convertToUnit(props.lineThickness)
       }, props.style]
@@ -18255,20 +18352,21 @@ const VTimeline = genericComponent()({
   }
 });
 
+const makeVTimelineDividerProps = propsFactory({
+  dotColor: String,
+  fillDot: Boolean,
+  hideDot: Boolean,
+  icon: IconValue,
+  iconColor: String,
+  lineColor: String,
+  ...makeComponentProps(),
+  ...makeRoundedProps(),
+  ...makeSizeProps(),
+  ...makeElevationProps()
+}, 'v-timeline-divider');
 const VTimelineDivider = genericComponent()({
   name: 'VTimelineDivider',
-  props: {
-    dotColor: String,
-    fillDot: Boolean,
-    hideDot: Boolean,
-    icon: IconValue,
-    iconColor: String,
-    lineColor: String,
-    ...makeComponentProps(),
-    ...makeRoundedProps(),
-    ...makeSizeProps(),
-    ...makeElevationProps()
-  },
+  props: makeVTimelineDividerProps(),
   setup(props, _ref) {
     let {
       slots
@@ -18331,27 +18429,28 @@ const VTimelineDivider = genericComponent()({
 
 // Types
 
+const makeVTimelineItemProps = propsFactory({
+  density: String,
+  dotColor: String,
+  fillDot: Boolean,
+  hideDot: Boolean,
+  hideOpposite: {
+    type: Boolean,
+    default: undefined
+  },
+  icon: IconValue,
+  iconColor: String,
+  lineInset: [Number, String],
+  ...makeComponentProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeRoundedProps(),
+  ...makeSizeProps(),
+  ...makeTagProps()
+}, 'v-timeline-item');
 const VTimelineItem = genericComponent()({
   name: 'VTimelineItem',
-  props: {
-    density: String,
-    dotColor: String,
-    fillDot: Boolean,
-    hideDot: Boolean,
-    hideOpposite: {
-      type: Boolean,
-      default: undefined
-    },
-    icon: IconValue,
-    iconColor: String,
-    lineInset: [Number, String],
-    ...makeComponentProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeRoundedProps(),
-    ...makeSizeProps(),
-    ...makeTagProps()
-  },
+  props: makeVTimelineItemProps(),
   setup(props, _ref) {
     let {
       slots
@@ -18399,26 +18498,27 @@ const VTimelineItem = genericComponent()({
 
 // Types
 
+const makeVTooltipProps = propsFactory({
+  id: String,
+  text: String,
+  ...omit(makeVOverlayProps({
+    closeOnBack: false,
+    location: 'end',
+    locationStrategy: 'connected',
+    eager: true,
+    minWidth: 0,
+    offset: 10,
+    openOnClick: false,
+    openOnHover: true,
+    origin: 'auto',
+    scrim: false,
+    scrollStrategy: 'reposition',
+    transition: false
+  }), ['absolute', 'persistent'])
+}, 'v-tooltip');
 const VTooltip = genericComponent()({
   name: 'VTooltip',
-  props: {
-    id: String,
-    text: String,
-    ...omit(makeVOverlayProps({
-      closeOnBack: false,
-      location: 'end',
-      locationStrategy: 'connected',
-      eager: true,
-      minWidth: 0,
-      offset: 10,
-      openOnClick: false,
-      openOnHover: true,
-      origin: 'auto',
-      scrim: false,
-      scrollStrategy: 'reposition',
-      transition: false
-    }), ['absolute', 'persistent'])
-  },
+  props: makeVTooltipProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -18481,9 +18581,7 @@ const VTooltip = genericComponent()({
 // Composables
 const VValidation = genericComponent()({
   name: 'VValidation',
-  props: {
-    ...makeValidationProps()
-  },
+  props: makeValidationProps(),
   emits: {
     'update:modelValue': val => true
   },
@@ -18496,12 +18594,13 @@ const VValidation = genericComponent()({
   }
 });
 
+const makeVVirtualScrollItemProps = propsFactory({
+  dynamicHeight: Boolean,
+  ...makeComponentProps()
+}, 'v-virtual-scroll-item');
 const VVirtualScrollItem = genericComponent()({
   name: 'VVirtualScrollItem',
-  props: {
-    dynamicHeight: Boolean,
-    ...makeComponentProps()
-  },
+  props: makeVVirtualScrollItemProps(),
   emits: {
     'update:height': height => true
   },
@@ -18537,17 +18636,18 @@ const VVirtualScrollItem = genericComponent()({
 
 const UP = -1;
 const DOWN = 1;
+const makeVVirtualScrollProps = propsFactory({
+  items: {
+    type: Array,
+    default: () => []
+  },
+  itemHeight: [Number, String],
+  ...makeComponentProps(),
+  ...makeDimensionProps()
+}, 'v-virtual-scroll');
 const VVirtualScroll = genericComponent()({
   name: 'VVirtualScroll',
-  props: {
-    items: {
-      type: Array,
-      default: () => []
-    },
-    itemHeight: [Number, String],
-    ...makeComponentProps(),
-    ...makeDimensionProps()
-  },
+  props: makeVVirtualScrollProps(),
   setup(props, _ref) {
     let {
       slots
@@ -19427,7 +19527,7 @@ function createVuetify$1() {
     date
   };
 }
-const version$1 = "3.2.1";
+const version$1 = "3.2.3";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -19447,7 +19547,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.2.1";
+const version = "3.2.3";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDefaults, useDisplay, useLayout, useLocale, useRtl, useTheme, version };