vuetify 3.2.1 → 3.2.3

package/dist/vuetify.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.2.1
+* Vuetify v3.2.3
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -1674,9 +1674,9 @@
         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,
@@ -2205,15 +2205,16 @@
     };
   }
 
+  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
@@ -2248,15 +2249,16 @@
 
   // 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
@@ -2282,25 +2284,23 @@
 
   // 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
@@ -2458,11 +2458,12 @@
 
   // Types
 
+  const makeVDialogTransitionProps = propsFactory({
+    target: Object
+  }, 'v-dialog-transition');
   const VDialogTransition = genericComponent()({
     name: 'VDialogTransition',
-    props: {
-      target: Object
-    },
+    props: makeVDialogTransitionProps(),
     setup(props, _ref) {
       let {
         slots
@@ -2652,14 +2653,15 @@
       })
     };
   }
+  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
@@ -2761,38 +2763,39 @@
 
   // 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,
@@ -3244,6 +3247,9 @@
       const {
         themeClasses
       } = provideTheme(props);
+      const {
+        rtlClasses
+      } = useRtl();
       const isExtended = vue.ref(!!(props.extended || slots.extension?.()));
       const contentHeight = vue.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 = vue.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);
@@ -3264,7 +3270,7 @@
             '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 && vue.createVNode("div", {
@@ -3340,14 +3346,13 @@
       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;
@@ -3357,8 +3362,16 @@
     const currentThreshold = vue.ref(0);
     const isScrollActive = vue.ref(false);
     const isScrollingUp = vue.ref(false);
-    const computedScrollThreshold = vue.computed(() => {
-      return Number(props.scrollThreshold ?? scrollThreshold ?? 300);
+    const scrollThreshold = vue.computed(() => {
+      return Number(props.scrollThreshold);
+    });
+
+    /**
+     * 1: at top
+     * 0: at threshold
+     */
+    const scrollRatio = vue.computed(() => {
+      return clamp((scrollThreshold.value - currentScroll.value) / scrollThreshold.value || 0);
     });
     const onScroll = () => {
       const targetEl = target.value;
@@ -3366,7 +3379,7 @@
       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);
     };
     vue.watch(isScrollingUp, () => {
       savedScroll.value = savedScroll.value || currentScroll.value;
@@ -3394,15 +3407,6 @@
     vue.onBeforeUnmount(() => {
       target.value?.removeEventListener('scroll', onScroll);
     });
-    thresholdMetCallback && vue.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
@@ -3410,10 +3414,11 @@
       immediate: true
     });
     return {
-      computedScrollThreshold,
+      scrollThreshold,
       currentScroll,
       currentThreshold,
       isScrollActive,
+      scrollRatio,
       // required only for testing
       // probably can be removed
       // later (2 chars chlng)
@@ -3443,27 +3448,28 @@
 
   // 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
     },
@@ -3496,15 +3502,14 @@
       });
       const {
         currentScroll,
-        currentThreshold,
-        computedScrollThreshold,
-        isScrollingUp
+        scrollThreshold,
+        isScrollingUp,
+        scrollRatio
       } = useScroll(props, {
         canScroll
       });
-      const isCollapsed = vue.computed(() => props.collapse || scrollBehavior.value.collapse && (scrollBehavior.value.inverted ? currentScroll.value < 1 : currentScroll.value > 0));
-      const isFlat = vue.computed(() => props.flat || scrollBehavior.value.elevate && currentScroll.value === (scrollBehavior.value.inverted ? 1 : 0));
-      const scrollRatio = vue.computed(() => Math.min((currentThreshold.value - currentScroll.value) / currentThreshold.value || 1, 1));
+      const isCollapsed = vue.computed(() => props.collapse || scrollBehavior.value.collapse && (scrollBehavior.value.inverted ? scrollRatio.value > 0 : scrollRatio.value === 0));
+      const isFlat = vue.computed(() => props.flat || scrollBehavior.value.elevate && (scrollBehavior.value.inverted ? currentScroll.value > 0 : currentScroll.value === 0));
       const opacity = vue.computed(() => scrollBehavior.value.fadeImage ? scrollBehavior.value.inverted ? 1 - scrollRatio.value : scrollRatio.value : undefined);
       const height = vue.computed(() => {
         if (scrollBehavior.value.hide && scrollBehavior.value.inverted) return 0;
@@ -3513,15 +3518,12 @@
         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;
         }
@@ -3897,12 +3899,13 @@
   // 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
     },
@@ -4097,7 +4100,7 @@
     const icons = vue.inject(IconSymbol);
     if (!icons) throw new Error('Missing Vuetify Icons provide!');
     const iconData = vue.computed(() => {
-      const iconAlias = vue.isRef(props) ? props.value : props.icon;
+      const iconAlias = vue.unref(props);
       if (!iconAlias) return {
         component: VComponentIcon
       };
@@ -4164,8 +4167,6 @@
     });
   }
 
-  // Types
-
   const makeVIconProps = propsFactory({
     color: String,
     start: Boolean,
@@ -4186,20 +4187,13 @@
         attrs,
         slots
       } = _ref;
-      let slotIcon;
-      if (slots.default) {
-        slotIcon = vue.computed(() => {
-          const slot = slots.default?.();
-          if (!slot) return;
-          return slot.filter(node => node.type === vue.Text && node.children && typeof node.children === 'string')[0]?.children;
-        });
-      }
+      const slotIcon = vue.ref();
       const {
         themeClasses
       } = provideTheme(props);
       const {
         iconData
-      } = useIcon(slotIcon || props);
+      } = useIcon(vue.computed(() => slotIcon.value || props.icon));
       const {
         sizeClasses
       } = useSize(props);
@@ -4207,24 +4201,30 @@
         textColorClasses,
         textColorStyles
       } = useTextColor(vue.toRef(props, 'color'));
-      useRender(() => vue.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 === vue.Text && node.children && typeof node.children === 'string')[0]?.children;
+        }
+        return vue.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 {};
     }
   });
@@ -4259,31 +4259,32 @@
 
   // 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
@@ -4720,47 +4721,48 @@
     };
   }
 
+  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
     },
@@ -4770,7 +4772,8 @@
       } = _ref;
       const progress = useProxiedModel(props, 'modelValue');
       const {
-        isRtl
+        isRtl,
+        rtlClasses
       } = useRtl();
       const {
         themeClasses
@@ -4825,7 +4828,7 @@
           '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,
@@ -5061,7 +5064,7 @@
     ...makeVariantProps({
       variant: 'elevated'
     })
-  }, 'VBtn');
+  }, 'v-btn');
   const VBtn = genericComponent()({
     name: 'VBtn',
     directives: {
@@ -5131,6 +5134,11 @@
         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;
@@ -5153,11 +5161,7 @@
           "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 && vue.createVNode("span", {
@@ -5221,36 +5225,35 @@
 
   // 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(() => vue.createVNode(VBtn, {
-        "class": ['v-app-bar-nav-icon', props.class],
-        "icon": props.icon,
-        "style": props.style
-      }, slots));
+      useRender(() => vue.createVNode(VBtn, vue.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
@@ -5292,53 +5295,54 @@
   // 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
@@ -5499,14 +5503,15 @@
     };
   }
 
+  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
@@ -5521,12 +5526,13 @@
     }
   });
 
+  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
@@ -5645,6 +5651,9 @@
       const {
         roundedClasses
       } = useRounded(props);
+      const {
+        rtlClasses
+      } = useRtl();
       const isActive = vue.computed(() => props.dirty || props.active);
       const hasLabel = vue.computed(() => !props.singleLine && !!(props.label || slots.label));
       const uid = getUid();
@@ -5738,7 +5747,7 @@
             '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), [vue.createVNode("div", {
@@ -5833,24 +5842,25 @@
 
   // 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
@@ -6262,23 +6272,24 @@
     }
   });
 
+  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
@@ -6441,7 +6452,7 @@
       const vInputRef = vue.ref();
       const vFieldRef = vue.ref();
       const inputRef = vue.ref();
-      const isActive = vue.computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value);
+      const isActive = vue.computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value || props.active);
       function onFocus() {
         if (inputRef.value !== document.activeElement) {
           inputRef.value?.focus();
@@ -6580,6 +6591,7 @@
   const makeSelectionControlGroupProps = propsFactory({
     color: String,
     disabled: Boolean,
+    defaultsTarget: String,
     error: Boolean,
     id: String,
     inline: Boolean,
@@ -6601,19 +6613,18 @@
       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
     },
@@ -6877,7 +6888,6 @@
         "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
@@ -6888,13 +6898,14 @@
 
   // 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
     },
@@ -7009,25 +7020,26 @@
   // 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
     },
@@ -7071,65 +7083,66 @@
     }
   });
 
+  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,
@@ -7258,14 +7271,16 @@
                 start: true
               }
             }
-          }, slots.prepend)]), slots.default?.({
+          }, slots.prepend)]), vue.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 && vue.createVNode("div", {
+          }) ?? props.text]), hasAppend && vue.createVNode("div", {
             "key": "append",
             "class": "v-chip__append"
           }, [!slots.append ? vue.createVNode(vue.Fragment, null, [props.appendIcon && vue.createVNode(VIcon, {
@@ -7310,17 +7325,18 @@
     }
   });
 
+  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
@@ -7846,16 +7862,14 @@
     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
@@ -7931,51 +7945,52 @@
 
   // 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
     },
@@ -8162,16 +8177,17 @@
     }
   });
 
+  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
@@ -8202,11 +8218,12 @@
 
   // Types
 
+  const makeVListChildrenProps = propsFactory({
+    items: Array
+  }, 'v-list-children');
   const VListChildren = genericComponent()({
     name: 'VListChildren',
-    props: {
-      items: Array
-    },
+    props: makeVListChildrenProps(),
     setup(props, _ref) {
       let {
         slots
@@ -8392,39 +8409,40 @@
       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,
@@ -8545,14 +8563,15 @@
 
   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
@@ -8568,14 +8587,15 @@
     }
   });
 
+  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
@@ -9037,7 +9057,9 @@
     const activatorFixed = isFixedPosition(data.activatorEl.value);
     if (activatorFixed) {
       Object.assign(contentStyles.value, {
-        position: 'fixed'
+        position: 'fixed',
+        top: 0,
+        left: 0
       });
     }
     const {
@@ -9109,8 +9131,8 @@
       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) => {
@@ -9763,7 +9785,7 @@
       });
       if (!el._clickOutside) {
         el._clickOutside = {
-          lastMousedownWasOutside: true
+          lastMousedownWasOutside: false
         };
       }
       el._clickOutside[binding.instance.$.uid] = {
@@ -10039,24 +10061,25 @@
 
   // 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
     },
@@ -10162,20 +10185,21 @@
     ...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,
@@ -10294,14 +10318,14 @@
           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']);
@@ -10345,15 +10369,15 @@
             "maxHeight": 310,
             "openOnClick": false,
             "closeOnContentClick": false,
-            "transition": props.transition
+            "transition": props.transition,
+            "onAfterLeave": onAfterLeave
           }, props.menuProps), {
             default: () => [hasList && vue.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']?.() ?? vue.createVNode(VListItem, {
                 "title": t(props.noDataText)
@@ -10376,11 +10400,13 @@
                     let {
                       isSelected
                     } = _ref2;
-                    return props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
+                    return vue.createVNode(vue.Fragment, null, [props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
                       "modelValue": isSelected,
                       "ripple": false,
                       "tabindex": "-1"
-                    }, null) : undefined;
+                    }, null) : undefined, item.props.prependIcon && vue.createVNode(VIcon, {
+                      "icon": item.props.prependIcon
+                    }, null)]);
                   }
                 });
               }), slots['append-item']?.()]
@@ -10393,6 +10419,10 @@
             }
             const slotProps = {
               'onClick:close': onChipClose,
+              onMousedown(e) {
+                e.preventDefault();
+                e.stopPropagation();
+              },
               modelValue: true,
               'onUpdate:modelValue': undefined
             };
@@ -10552,23 +10582,24 @@
       "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,
@@ -10697,16 +10728,14 @@
         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 = vue.ref(false);
       function select(item) {
         if (props.multiple) {
@@ -10721,9 +10750,7 @@
         } else {
           model.value = [item];
           isSelecting.value = true;
-          if (!slots.selection) {
-            search.value = item.title;
-          }
+          search.value = item.title;
           menu.value = false;
           isPristine.value = true;
           vue.nextTick(() => isSelecting.value = false);
@@ -10732,12 +10759,14 @@
       vue.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;
           vue.nextTick(() => isSelecting.value = false);
         } else {
+          if (!props.multiple && !search.value) model.value = [];
           menu.value = false;
           search.value = '';
+          selectionIndex.value = -1;
         }
       });
       vue.watch(search, val => {
@@ -10762,12 +10791,10 @@
           "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,
@@ -10796,8 +10823,7 @@
               "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']?.() ?? vue.createVNode(VListItem, {
                 "title": t(props.noDataText)
@@ -10815,11 +10841,13 @@
                   let {
                     isSelected
                   } = _ref2;
-                  return props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
+                  return vue.createVNode(vue.Fragment, null, [props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
                     "modelValue": isSelected,
                     "ripple": false,
                     "tabindex": "-1"
-                  }, null) : undefined;
+                  }, null) : undefined, item.props.prependIcon && vue.createVNode(VIcon, {
+                    "icon": item.props.prependIcon
+                  }, null)]);
                 },
                 title: () => {
                   return isPristine.value ? item.title : highlightResult$1(item.title, getMatches(item)?.title, search.value?.length ?? 0);
@@ -10834,6 +10862,10 @@
             }
             const slotProps = {
               'onClick:close': onChipClose,
+              onMousedown(e) {
+                e.preventDefault();
+                e.stopPropagation();
+              },
               modelValue: true,
               'onUpdate:modelValue': undefined
             };
@@ -10883,40 +10915,41 @@
     }
   });
 
+  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,
@@ -10977,13 +11010,14 @@
     }
   });
 
+  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
@@ -11007,27 +11041,28 @@
 
   // 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
@@ -11114,50 +11149,51 @@
     }
   });
 
-  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
@@ -11223,12 +11259,13 @@
     }
   });
 
+  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
@@ -11241,21 +11278,22 @@
     }
   });
 
+  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,
@@ -11291,30 +11329,31 @@
 
   // 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
@@ -11423,18 +11462,19 @@
 
   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
@@ -11505,47 +11545,48 @@
 
   // 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,
@@ -11939,34 +11980,35 @@
 
   // 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
     },
@@ -12056,24 +12098,25 @@
     }
   });
 
+  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
     },
@@ -12167,25 +12210,28 @@
 
   // 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(() => vue.createVNode(VWindowItem, {
-        "class": ['v-carousel-item', props.class],
-        "style": props.style,
-        "value": props.value
-      }, {
-        default: () => [vue.createVNode(VImg, attrs, slots)]
-      }));
+      useRender(() => {
+        const [imgProps] = VImg.filterProps(props);
+        const [windowItemProps] = VWindowItem.filterProps(props);
+        return vue.createVNode(VWindowItem, vue.mergeProps({
+          "class": "v-carousel-item"
+        }, windowItemProps), {
+          default: () => [vue.createVNode(VImg, vue.mergeProps(attrs, imgProps), slots)]
+        });
+      });
     }
   });
 
@@ -12205,9 +12251,7 @@
   }, 'v-sheet');
   const VSheet = genericComponent()({
     name: 'VSheet',
-    props: {
-      ...makeVSheetProps()
-    },
+    props: makeVSheetProps(),
     setup(props, _ref) {
       let {
         slots
@@ -12247,27 +12291,28 @@
 
   // 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
@@ -12523,7 +12568,7 @@
         let {
           a
         } = _ref;
-        return a ? Math.round(a * 100) / 100 : 1;
+        return a != null ? Math.round(a * 100) / 100 : 1;
       },
       getColor: (c, v) => ({
         ...c,
@@ -12577,7 +12622,7 @@
         let {
           a
         } = _ref2;
-        return a ? Math.round(a * 100) / 100 : 1;
+        return a != null ? Math.round(a * 100) / 100 : 1;
       },
       getColor: (c, v) => ({
         ...c,
@@ -12631,23 +12676,24 @@
       "class": "v-color-picker-edit__input"
     }, [vue.createVNode("input", rest, null), vue.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
@@ -12980,35 +13026,36 @@
     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
     },
@@ -13125,19 +13172,20 @@
     }
   });
 
+  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 {
@@ -13243,17 +13291,18 @@
 
   // 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,
@@ -13266,6 +13315,9 @@
         emit
       } = _ref;
       const thumbContainerRef = vue.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;
@@ -13319,7 +13371,7 @@
             '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
@@ -13376,16 +13428,17 @@
 
   // 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
     },
@@ -13763,6 +13816,16 @@
 
   // 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];
@@ -13771,16 +13834,7 @@
   }
   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
     },
@@ -13816,44 +13870,45 @@
 
   // 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
@@ -13876,6 +13931,9 @@
         if (!v) return null;
         return extractColor(v, props.modelValue);
       });
+      const {
+        rtlClasses
+      } = useRtl();
       const updateColor = hsva => {
         currentColor.value = hsva;
         lastPickedColor.value = hsva;
@@ -13896,7 +13954,7 @@
           "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),
@@ -13958,26 +14016,27 @@
       "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,
@@ -14147,7 +14206,10 @@
         }
       }
       function onAfterLeave() {
-        if (isFocused.value) isPristine.value = true;
+        if (isFocused.value) {
+          isPristine.value = true;
+          vTextFieldRef.value?.focus();
+        }
       }
       function select(item) {
         if (props.multiple) {
@@ -14174,23 +14236,16 @@
       function onFocusin(e) {
         isFocused.value = true;
       }
-      function onFocusout(e) {
-        if (e.relatedTarget == null) {
-          vTextFieldRef.value?.focus();
-        }
-      }
       vue.watch(filteredItems, val => {
         if (!val.length && props.hideNoData) menu.value = false;
       });
       vue.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);
@@ -14241,8 +14296,7 @@
               "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']?.() ?? vue.createVNode(VListItem, {
                 "title": t(props.noDataText)
@@ -14260,11 +14314,13 @@
                   let {
                     isSelected
                   } = _ref2;
-                  return props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
+                  return vue.createVNode(vue.Fragment, null, [props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
                     "modelValue": isSelected,
                     "ripple": false,
                     "tabindex": "-1"
-                  }, null) : undefined;
+                  }, null) : undefined, item.props.prependIcon && vue.createVNode(VIcon, {
+                    "icon": item.props.prependIcon
+                  }, null)]);
                 },
                 title: () => {
                   return isPristine.value ? item.title : highlightResult(item.title, getMatches(item)?.title, search.value?.length ?? 0);
@@ -14279,6 +14335,10 @@
             }
             const slotProps = {
               'onClick:close': onChipClose,
+              onMousedown(e) {
+                e.preventDefault();
+                e.stopPropagation();
+              },
               modelValue: true,
               'onUpdate:modelValue': undefined
             };
@@ -14331,24 +14391,25 @@
 
   // 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
     },
@@ -14442,21 +14503,22 @@
 
   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
     },
@@ -14500,17 +14562,15 @@
       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
@@ -14549,12 +14609,13 @@
     }
   });
 
+  const makeVExpansionPanelTextProps = propsFactory({
+    ...makeComponentProps(),
+    ...makeLazyProps()
+  }, 'v-expansion-panel-text');
   const VExpansionPanelText = genericComponent()({
     name: 'VExpansionPanelText',
-    props: {
-      ...makeComponentProps(),
-      ...makeLazyProps()
-    },
+    props: makeVExpansionPanelTextProps(),
     setup(props, _ref) {
       let {
         slots
@@ -14579,20 +14640,21 @@
     }
   });
 
+  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
     },
@@ -14635,8 +14697,7 @@
             '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: () => [vue.createVNode("div", {
             "class": ['v-expansion-panel__shadow', ...elevationClasses.value]
@@ -14663,42 +14724,43 @@
 
   // 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,
@@ -14742,6 +14804,7 @@
       const vInputRef = vue.ref();
       const vFieldRef = vue.ref();
       const inputRef = vue.ref();
+      const isActive = vue.computed(() => isFocused.value || props.active);
       function onFocus() {
         if (inputRef.value !== document.activeElement) {
           inputRef.value?.focus();
@@ -14810,7 +14873,7 @@
               "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,
@@ -14868,25 +14931,26 @@
     }
   });
 
+  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
@@ -14937,12 +15001,13 @@
 
   // 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
@@ -14989,24 +15054,28 @@
     }
   });
 
+  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(() => vue.createVNode(props.tag, {
         "class": ['v-container', {
           'v-container--fluid': props.fluid
-        }, props.class],
+        }, rtlClasses.value, props.class],
         "style": props.style
       }, slots));
       return {};
@@ -15075,32 +15144,33 @@
     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
@@ -15193,32 +15263,33 @@
     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
@@ -15254,16 +15325,17 @@
   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
     },
@@ -15287,16 +15359,17 @@
   });
 
   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
     },
@@ -15364,12 +15437,13 @@
 
   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
@@ -15395,21 +15469,22 @@
 
   // 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
@@ -15434,30 +15509,31 @@
 
   // 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
     },
@@ -15491,18 +15567,19 @@
     }
   });
 
+  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
@@ -15518,15 +15595,16 @@
     }
   });
 
+  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
@@ -15594,18 +15672,24 @@
       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;
     }
@@ -15848,54 +15932,55 @@
   // 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
@@ -15976,7 +16061,6 @@
       });
       const {
         layoutItemStyles,
-        layoutRect,
         layoutItemScrimStyles
       } = useLayoutItem({
         id: props.name,
@@ -16006,12 +16090,6 @@
           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({
@@ -16100,88 +16178,89 @@
 
   // 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,
@@ -16420,15 +16499,16 @@
   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
@@ -16502,14 +16582,15 @@
 
   // 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
@@ -16525,29 +16606,30 @@
 
   // 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
     },
@@ -16613,18 +16695,19 @@
 
   // 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,
@@ -16639,6 +16722,9 @@
       const startThumbRef = vue.ref();
       const stopThumbRef = vue.ref();
       const inputRef = vue.ref();
+      const {
+        rtlClasses
+      } = useRtl();
       function getActiveThumb(e) {
         if (!startThumbRef.value || !stopThumbRef.value) return;
         const startOffset = getOffset(e, startThumbRef.value.$el, props.direction);
@@ -16709,7 +16795,7 @@
             '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, {
@@ -16815,50 +16901,51 @@
 
   // 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
     },
@@ -17370,9 +17457,7 @@
 
   const VSlideGroupItem = genericComponent()({
     name: 'VSlideGroupItem',
-    props: {
-      ...makeGroupItemProps()
-    },
+    props: makeGroupItemProps(),
     emits: {
       'group:selected': val => true
     },
@@ -17390,26 +17475,27 @@
     }
   });
 
+  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
     },
@@ -17506,20 +17592,21 @@
 
   // 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,
@@ -17629,19 +17716,20 @@
     }
   });
 
+  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
@@ -17686,21 +17774,22 @@
 
   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,
@@ -17786,34 +17875,35 @@
       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
     },
@@ -17865,18 +17955,19 @@
     }
   });
 
+  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
@@ -17911,36 +18002,37 @@
 
   // 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,
@@ -17975,7 +18067,7 @@
       const vFieldRef = vue.ref();
       const controlHeight = vue.ref('');
       const textareaRef = vue.ref();
-      const isActive = vue.computed(() => isFocused.value || props.persistentPlaceholder);
+      const isActive = vue.computed(() => props.persistentPlaceholder || isFocused.value || props.active);
       function onFocus() {
         if (textareaRef.value !== document.activeElement) {
           textareaRef.value?.focus();
@@ -18142,14 +18234,15 @@
     }
   });
 
+  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
@@ -18171,46 +18264,47 @@
 
   // 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
@@ -18221,6 +18315,9 @@
       const {
         densityClasses
       } = useDensity(props);
+      const {
+        rtlClasses
+      } = useRtl();
       provideDefaults({
         VTimelineDivider: {
           lineColor: vue.toRef(props, 'lineColor')
@@ -18250,7 +18347,7 @@
       useRender(() => vue.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]
@@ -18259,20 +18356,21 @@
     }
   });
 
+  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
@@ -18335,27 +18433,28 @@
 
   // 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
@@ -18403,26 +18502,27 @@
 
   // 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
     },
@@ -18485,9 +18585,7 @@
   // Composables
   const VValidation = genericComponent()({
     name: 'VValidation',
-    props: {
-      ...makeValidationProps()
-    },
+    props: makeValidationProps(),
     emits: {
       'update:modelValue': val => true
     },
@@ -18500,12 +18598,13 @@
     }
   });
 
+  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
     },
@@ -18541,17 +18640,18 @@
 
   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
@@ -19431,7 +19531,7 @@
       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
@@ -19451,7 +19551,7 @@
       ...options
     });
   };
-  const version = "3.2.1";
+  const version = "3.2.3";
   createVuetify.version = version;
 
   exports.components = components;