vuetify 3.1.0 → 3.1.2

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.1.0
+* Vuetify v3.1.2
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -990,7 +990,7 @@ function propsFactory(props, source) {
 // Utils
 function propIsDefined(vnode, prop) {
   var _vnode$props, _vnode$props2;
-  return ((_vnode$props = vnode.props) == null ? void 0 : _vnode$props.hasOwnProperty(prop)) || ((_vnode$props2 = vnode.props) == null ? void 0 : _vnode$props2.hasOwnProperty(toKebabCase(prop)));
+  return typeof ((_vnode$props = vnode.props) == null ? void 0 : _vnode$props[prop]) !== 'undefined' || typeof ((_vnode$props2 = vnode.props) == null ? void 0 : _vnode$props2[toKebabCase(prop)]) !== 'undefined';
 }
 const defineComponent = function defineComponent(options) {
   options._setup = options._setup ?? options.setup;
@@ -2366,9 +2366,7 @@ const VDialogTransition = defineComponent({
         const animation = animate(el, [{
           transform: `translate(${x}px, ${y}px) scale(${sx}, ${sy})`,
           opacity: 0
-        }, {
-          transform: ''
-        }], {
+        }, {}], {
           duration: 225 * speed,
           easing: deceleratedEasing
         });
@@ -2378,9 +2376,7 @@ const VDialogTransition = defineComponent({
           }, {
             opacity: 0,
             offset: 0.33
-          }, {
-            opacity: 1
-          }], {
+          }, {}], {
             duration: 225 * 2 * speed,
             easing: standardEasing
           });
@@ -2403,9 +2399,7 @@ const VDialogTransition = defineComponent({
           sy,
           speed
         } = getDimensions(props.target, el);
-        const animation = animate(el, [{
-          transform: ''
-        }, {
+        const animation = animate(el, [{}, {
           transform: `translate(${x}px, ${y}px) scale(${sx}, ${sy})`,
           opacity: 0
         }], {
@@ -4386,9 +4380,69 @@ const Ripple = {
   updated: updated$1
 };
 
+// Composables
+
+// Types
+
+const oppositeMap = {
+  center: 'center',
+  top: 'bottom',
+  bottom: 'top',
+  left: 'right',
+  right: 'left'
+};
+const makeLocationProps = propsFactory({
+  location: String
+}, 'location');
+function useLocation(props) {
+  let opposite = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  let offset = arguments.length > 2 ? arguments[2] : undefined;
+  const {
+    isRtl
+  } = useRtl();
+  const locationStyles = computed(() => {
+    if (!props.location) return {};
+    const {
+      side,
+      align
+    } = parseAnchor(props.location.split(' ').length > 1 ? props.location : `${props.location} center`, isRtl.value);
+    function getOffset(side) {
+      return offset ? offset(side) : 0;
+    }
+    const styles = {};
+    if (side !== 'center') {
+      if (opposite) styles[oppositeMap[side]] = `calc(100% - ${getOffset(side)}px)`;else styles[side] = 0;
+    }
+    if (align !== 'center') {
+      if (opposite) styles[oppositeMap[align]] = `calc(100% - ${getOffset(align)}px)`;else styles[align] = 0;
+    } else {
+      if (side === 'center') styles.top = styles.left = '50%';else {
+        styles[{
+          top: 'left',
+          bottom: 'left',
+          left: 'top',
+          right: 'top'
+        }[side]] = '50%';
+      }
+      styles.transform = {
+        top: 'translateX(-50%)',
+        bottom: 'translateX(-50%)',
+        left: 'translateY(-50%)',
+        right: 'translateY(-50%)',
+        center: 'translate(-50%, -50%)'
+      }[side];
+    }
+    return styles;
+  });
+  return {
+    locationStyles
+  };
+}
+
 const VProgressLinear = defineComponent({
   name: 'VProgressLinear',
   props: {
+    absolute: Boolean,
     active: {
       type: Boolean,
       default: true
@@ -4418,6 +4472,9 @@ const VProgressLinear = defineComponent({
     stream: Boolean,
     striped: Boolean,
     roundedBar: Boolean,
+    ...makeLocationProps({
+      location: 'top'
+    }),
     ...makeRoundedProps(),
     ...makeTagProps(),
     ...makeThemeProps()
@@ -4436,6 +4493,9 @@ const VProgressLinear = defineComponent({
     const {
       themeClasses
     } = provideTheme(props);
+    const {
+      locationStyles
+    } = useLocation(props);
     const {
       textColorClasses,
       textColorStyles
@@ -4477,6 +4537,7 @@ const VProgressLinear = defineComponent({
     useRender(() => createVNode(props.tag, {
       "ref": intersectionRef,
       "class": ['v-progress-linear', {
+        'v-progress-linear--absolute': props.absolute,
         'v-progress-linear--active': props.active && isIntersecting.value,
         'v-progress-linear--reverse': isReversed.value,
         'v-progress-linear--rounded': props.rounded,
@@ -4484,8 +4545,11 @@ const VProgressLinear = defineComponent({
         'v-progress-linear--striped': props.striped
       }, roundedClasses.value, themeClasses.value],
       "style": {
+        bottom: props.location === 'bottom' ? 0 : undefined,
+        top: props.location === 'top' ? 0 : undefined,
         height: props.active ? convertToUnit(height.value) : 0,
-        '--v-progress-linear-height': convertToUnit(height.value)
+        '--v-progress-linear-height': convertToUnit(height.value),
+        ...locationStyles.value
       },
       "role": "progressbar",
       "aria-hidden": props.active ? 'false' : 'true',
@@ -4571,65 +4635,6 @@ function LoaderSlot(props, _ref) {
   }, null)]);
 }
 
-// Composables
-
-// Types
-
-const oppositeMap = {
-  center: 'center',
-  top: 'bottom',
-  bottom: 'top',
-  left: 'right',
-  right: 'left'
-};
-const makeLocationProps = propsFactory({
-  location: String
-}, 'location');
-function useLocation(props) {
-  let opposite = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-  let offset = arguments.length > 2 ? arguments[2] : undefined;
-  const {
-    isRtl
-  } = useRtl();
-  const locationStyles = computed(() => {
-    if (!props.location) return {};
-    const {
-      side,
-      align
-    } = parseAnchor(props.location.split(' ').length > 1 ? props.location : `${props.location} center`, isRtl.value);
-    function getOffset(side) {
-      return offset ? offset(side) : 0;
-    }
-    const styles = {};
-    if (side !== 'center') {
-      if (opposite) styles[oppositeMap[side]] = `calc(100% - ${getOffset(side)}px)`;else styles[side] = 0;
-    }
-    if (align !== 'center') {
-      if (opposite) styles[oppositeMap[align]] = `calc(100% - ${getOffset(align)}px)`;else styles[align] = 0;
-    } else {
-      if (side === 'center') styles.top = styles.left = '50%';else {
-        styles[{
-          top: 'left',
-          bottom: 'left',
-          left: 'top',
-          right: 'top'
-        }[side]] = '50%';
-      }
-      styles.transform = {
-        top: 'translateX(-50%)',
-        bottom: 'translateX(-50%)',
-        left: 'translateY(-50%)',
-        right: 'translateY(-50%)',
-        center: 'translate(-50%, -50%)'
-      }[side];
-    }
-    return styles;
-  });
-  return {
-    locationStyles
-  };
-}
-
 // Utilities
 
 // Types
@@ -4835,8 +4840,14 @@ const VBtn = defineComponent({
     const group = useGroupItem(props, props.symbol, false);
     const link = useLink(props, attrs);
     const isActive = computed(() => {
-      var _link$isActive;
-      return props.active !== false && (props.active || ((_link$isActive = link.isActive) == null ? void 0 : _link$isActive.value) || (group == null ? void 0 : group.isSelected.value));
+      if (props.active !== undefined) {
+        return props.active;
+      }
+      if (link.isLink.value) {
+        var _link$isActive;
+        return (_link$isActive = link.isActive) == null ? void 0 : _link$isActive.value;
+      }
+      return group == null ? void 0 : group.isSelected.value;
     });
     const isDisabled = computed(() => (group == null ? void 0 : group.disabled.value) || props.disabled);
     const isElevated = computed(() => {
@@ -4846,7 +4857,7 @@ const VBtn = defineComponent({
     useRender(() => {
       var _slots$prepend, _slots$default, _slots$append, _slots$loader;
       const Tag = link.isLink.value ? 'a' : props.tag;
-      const hasColor = !group || group.isSelected.value;
+      const hasColor = !group || isActive.value;
       const hasPrepend = !!(props.prependIcon || slots.prepend);
       const hasAppend = !!(props.appendIcon || slots.append);
       const hasIcon = !!(props.icon && props.icon !== true);
@@ -4974,13 +4985,13 @@ const VAppBarTitle = defineComponent({
   props: {
     ...VToolbarTitle.props
   },
-  setup(_, _ref) {
+  setup(props, _ref) {
     let {
       slots
     } = _ref;
-    useRender(() => createVNode(VToolbarTitle, {
+    useRender(() => createVNode(VToolbarTitle, mergeProps(props, {
       "class": "v-app-bar-title"
-    }, slots));
+    }), slots));
     return {};
   }
 });
@@ -5326,6 +5337,7 @@ const VField = genericComponent()({
     const hasLabel = computed(() => !props.singleLine && !!(props.label || slots.label));
     const uid = getUid();
     const id = computed(() => props.id || `input-${uid}`);
+    const messagesId = computed(() => `${id.value}-messages`);
     const labelRef = ref();
     const floatingLabelRef = ref();
     const controlRef = ref();
@@ -5450,7 +5462,8 @@ const VField = genericComponent()({
         ...slotProps.value,
         props: {
           id: id.value,
-          class: 'v-field__input'
+          class: 'v-field__input',
+          'aria-describedby': messagesId.value
         },
         focus,
         blur
@@ -5533,7 +5546,9 @@ const VMessages = defineComponent({
       "transition": props.transition,
       "tag": "div",
       "class": ['v-messages', textColorClasses.value],
-      "style": textColorStyles.value
+      "style": textColorStyles.value,
+      "role": "alert",
+      "aria-live": "polite"
     }, {
       default: () => [props.active && messages.value.map((message, i) => createVNode("div", {
         "class": "v-messages__message",
@@ -5851,6 +5866,7 @@ const VInput = genericComponent()({
     } = useInputIcon(props);
     const uid = getUid();
     const id = computed(() => props.id || `input-${uid}`);
+    const messagesId = computed(() => `${id.value}-messages`);
     const {
       errorMessages,
       isDirty,
@@ -5866,6 +5882,7 @@ const VInput = genericComponent()({
     } = useValidation(props, 'v-input', id);
     const slotProps = computed(() => ({
       id,
+      messagesId,
       isDirty,
       isDisabled,
       isReadonly,
@@ -5901,6 +5918,7 @@ const VInput = genericComponent()({
       }, null), (_slots$append = slots.append) == null ? void 0 : _slots$append.call(slots, slotProps.value)]), hasDetails && createVNode("div", {
         "class": "v-input__details"
       }, [createVNode(VMessages, {
+        "id": messagesId.value,
         "active": hasMessages,
         "messages": errorMessages.value.length > 0 ? errorMessages.value : props.messages
       }, {
@@ -6572,11 +6590,13 @@ const VCheckbox = defineComponent({
         default: _ref2 => {
           let {
             id,
+            messagesId,
             isDisabled,
             isReadonly
           } = _ref2;
           return createVNode(VCheckboxBtn, mergeProps(checkboxProps, {
             "id": id.value,
+            "aria-describedby": messagesId.value,
             "disabled": isDisabled.value,
             "readonly": isReadonly.value
           }, controlAttrs, {
@@ -6694,6 +6714,7 @@ const VChipGroup = defineComponent({
     provideDefaults({
       VChip: {
         color: toRef(props, 'color'),
+        disabled: toRef(props, 'disabled'),
         filter: toRef(props, 'filter'),
         variant: toRef(props, 'variant')
       }
@@ -6743,7 +6764,10 @@ const VChip = defineComponent({
       default: '$complete'
     },
     label: Boolean,
-    link: Boolean,
+    link: {
+      type: Boolean,
+      default: undefined
+    },
     pill: Boolean,
     prependAvatar: String,
     prependIcon: IconValue,
@@ -6756,6 +6780,8 @@ const VChip = defineComponent({
       type: Boolean,
       default: true
     },
+    onClick: EventProp,
+    onClickOnce: EventProp,
     ...makeBorderProps(),
     ...makeDensityProps(),
     ...makeElevationProps(),
@@ -6809,7 +6835,8 @@ const VChip = defineComponent({
     const isActive = useProxiedModel(props, 'modelValue');
     const group = useGroupItem(props, VChipGroupSymbol, false);
     const link = useLink(props, attrs);
-    const isClickable = computed(() => !props.disabled && (!!group || link.isClickable.value || props.link));
+    const isLink = computed(() => props.link !== false && link.isLink.value);
+    const isClickable = computed(() => !props.disabled && props.link !== false && (!!group || props.link || link.isClickable.value));
     function onCloseClick(e) {
       isActive.value = false;
       emit('click:close', e);
@@ -6821,6 +6848,12 @@ const VChip = defineComponent({
       (_link$navigate = link.navigate) == null ? void 0 : _link$navigate.call(link, e);
       group == null ? void 0 : group.toggle();
     }
+    function onKeyDown(e) {
+      if (e.key === 'Enter' || e.key === ' ') {
+        e.preventDefault();
+        onClick(e);
+      }
+    }
     return () => {
       var _slots$default;
       const Tag = link.isLink.value ? 'a' : props.tag;
@@ -6841,7 +6874,9 @@ const VChip = defineComponent({
         "disabled": props.disabled || undefined,
         "draggable": props.draggable,
         "href": link.href.value,
-        "onClick": onClick
+        "tabindex": isClickable.value ? 0 : undefined,
+        "onClick": onClick,
+        "onKeydown": isClickable.value && !isLink.value && onKeyDown
       }, {
         default: () => [genOverlays(isClickable.value, 'v-chip'), hasFilter && createVNode(VDefaultsProvider, {
           "key": "filter",
@@ -7557,6 +7592,10 @@ const VListItem = genericComponent()({
     nav: Boolean,
     prependAvatar: String,
     prependIcon: IconValue,
+    ripple: {
+      type: Boolean,
+      default: true
+    },
     subtitle: [String, Number, Boolean],
     title: [String, Number, Boolean],
     value: null,
@@ -7748,7 +7787,7 @@ const VListItem = genericComponent()({
             "key": "append-avatar"
           }, null)])]
         })]
-      }), [[resolveDirective("ripple"), isClickable.value]]);
+      }), [[resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
     return {};
   }
@@ -9289,19 +9328,18 @@ function useTeleport(target) {
       warn(`Unable to locate target ${_target}`);
       return undefined;
     }
-    if (!useTeleport.cache.has(targetElement)) {
-      const el = document.createElement('div');
-      el.className = 'v-overlay-container';
-      targetElement.appendChild(el);
-      useTeleport.cache.set(targetElement, el);
+    let container = targetElement.querySelector('.v-overlay-container');
+    if (!container) {
+      container = document.createElement('div');
+      container.className = 'v-overlay-container';
+      targetElement.appendChild(container);
     }
-    return useTeleport.cache.get(targetElement);
+    return container;
   });
   return {
     teleportTarget
   };
 }
-useTeleport.cache = new WeakMap();
 
 function defaultConditional() {
   return true;
@@ -9805,12 +9843,19 @@ const VSelect = genericComponent()({
       const transformed = transformOut(v);
       return props.multiple ? transformed : transformed[0] ?? null;
     });
+    const form = useForm();
     const selections = computed(() => {
       return model.value.map(v => {
         return items.value.find(item => props.valueComparator(item.value, v.value)) || v;
       });
     });
     const selected = computed(() => selections.value.map(selection => selection.props.value));
+    const displayItems = computed(() => {
+      if (props.hideSelected) {
+        return items.value.filter(item => !selections.value.some(s => s === item));
+      }
+      return items.value;
+    });
     const listRef = ref();
     function onClear(e) {
       model.value = [];
@@ -9819,11 +9864,11 @@ const VSelect = genericComponent()({
       }
     }
     function onClickControl() {
-      if (props.hideNoData && !items.value.length || props.readonly) return;
+      if (props.hideNoData && !items.value.length || props.readonly || form != null && form.isReadonly.value) return;
       menu.value = !menu.value;
     }
     function onKeydown(e) {
-      if (props.readonly) return;
+      if (props.readonly || form != null && form.isReadonly.value) return;
       if (['Enter', 'ArrowDown', ' '].includes(e.key)) {
         e.preventDefault();
         menu.value = true;
@@ -9850,7 +9895,7 @@ const VSelect = genericComponent()({
     }
     function select(item) {
       if (props.multiple) {
-        const index = selected.value.findIndex(selection => selection === item.value);
+        const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
         if (index === -1) {
           model.value = [...model.value, item];
         } else {
@@ -9877,6 +9922,7 @@ const VSelect = genericComponent()({
     }
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
+      const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
       const [textFieldProps] = filterVTextFieldProps(props);
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
@@ -9909,20 +9955,21 @@ const VSelect = genericComponent()({
             "activator": "parent",
             "contentClass": "v-select__content",
             "eager": props.eager,
+            "maxHeight": 310,
             "openOnClick": false,
             "closeOnContentClick": false,
             "transition": props.transition
           }, props.menuProps), {
-            default: () => [createVNode(VList, {
+            default: () => [hasList && createVNode(VList, {
               "ref": listRef,
               "selected": selected.value,
               "selectStrategy": props.multiple ? 'independent' : 'single-independent',
               "onMousedown": e => e.preventDefault(),
               "onFocusout": onFocusout
             }, {
-              default: () => [!items.value.length && !props.hideNoData && (((_slots$noData = slots['no-data']) == null ? void 0 : _slots$noData.call(slots)) ?? createVNode(VListItem, {
+              default: () => [!displayItems.value.length && !props.hideNoData && (((_slots$noData = slots['no-data']) == null ? void 0 : _slots$noData.call(slots)) ?? createVNode(VListItem, {
                 "title": t(props.noDataText)
-              }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), items.value.map((item, index) => {
+              }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), displayItems.value.map((item, index) => {
                 if (slots.item) {
                   var _slots$item;
                   return (_slots$item = slots.item) == null ? void 0 : _slots$item.call(slots, {
@@ -10024,7 +10071,7 @@ function filterItems(items, query, options) {
   const customFiltersLength = Object.keys((options == null ? void 0 : options.customKeyFilter) ?? {}).length;
   if (!(items != null && items.length)) return array;
   loop: for (let i = 0; i < items.length; i++) {
-    const item = items[i].raw;
+    const item = items[i];
     const customMatches = {};
     const defaultMatches = {};
     let match = -1;
@@ -10064,7 +10111,7 @@ function filterItems(items, query, options) {
   }
   return array;
 }
-function useFilter(props, items, query) {
+function useFilter(props, items, query, options) {
   const strQuery = computed(() => typeof (query == null ? void 0 : query.value) !== 'string' && typeof (query == null ? void 0 : query.value) !== 'number' ? '' : String(query.value));
   const filteredItems = ref([]);
   const filteredMatches = ref(new Map());
@@ -10075,7 +10122,7 @@ function useFilter(props, items, query) {
     const results = filterItems(transformedItems, strQuery.value, {
       customKeyFilter: props.customKeyFilter,
       default: props.customFilter,
-      filterKeys: props.filterKeys,
+      filterKeys: unref(options == null ? void 0 : options.filterKeys) ?? props.filterKeys,
       filterMode: props.filterMode,
       noFilter: props.noFilter
     });
@@ -10155,6 +10202,7 @@ const VAutocomplete = genericComponent()({
       const transformed = transformOut(v);
       return props.multiple ? transformed : transformed[0] ?? null;
     });
+    const form = useForm();
     const {
       filteredItems,
       getMatches
@@ -10164,6 +10212,12 @@ const VAutocomplete = genericComponent()({
         return items.value.find(item => props.valueComparator(item.value, v.value)) || v;
       });
     });
+    const displayItems = computed(() => {
+      if (props.hideSelected) {
+        return filteredItems.value.filter(filteredItem => !selections.value.some(s => s.value === filteredItem.value));
+      }
+      return filteredItems.value;
+    });
     const selected = computed(() => selections.value.map(selection => selection.props.value));
     const listRef = ref();
     function onClear(e) {
@@ -10174,11 +10228,11 @@ const VAutocomplete = genericComponent()({
       search.value = '';
     }
     function onClickControl() {
-      if (props.hideNoData && !items.value.length || props.readonly) return;
+      if (props.hideNoData && !items.value.length || props.readonly || form != null && form.isReadonly.value) return;
       menu.value = true;
     }
     function onKeydown(e) {
-      if (props.readonly) return;
+      if (props.readonly || form != null && form.isReadonly.value) return;
       if (['Enter', 'ArrowDown'].includes(e.key)) {
         menu.value = true;
       }
@@ -10216,7 +10270,7 @@ const VAutocomplete = genericComponent()({
     const isSelecting = ref(false);
     function select(item) {
       if (props.multiple) {
-        const index = selected.value.findIndex(selection => selection === item.value);
+        const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
         if (index === -1) {
           model.value = [...model.value, item];
           search.value = '';
@@ -10255,6 +10309,7 @@ const VAutocomplete = genericComponent()({
     });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
+      const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
       const [textFieldProps] = filterVTextFieldProps(props);
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
@@ -10290,12 +10345,13 @@ const VAutocomplete = genericComponent()({
             "activator": "parent",
             "contentClass": "v-autocomplete__content",
             "eager": props.eager,
+            "maxHeight": 310,
             "openOnClick": false,
             "closeOnContentClick": false,
             "transition": props.transition,
             "onAfterLeave": onAfterLeave
           }, props.menuProps), {
-            default: () => [createVNode(VList, {
+            default: () => [hasList && createVNode(VList, {
               "ref": listRef,
               "selected": selected.value,
               "selectStrategy": props.multiple ? 'independent' : 'single-independent',
@@ -10303,9 +10359,9 @@ const VAutocomplete = genericComponent()({
               "onFocusin": onFocusin,
               "onFocusout": onFocusout
             }, {
-              default: () => [!filteredItems.value.length && !props.hideNoData && (((_slots$noData = slots['no-data']) == null ? void 0 : _slots$noData.call(slots)) ?? createVNode(VListItem, {
+              default: () => [!displayItems.value.length && !props.hideNoData && (((_slots$noData = slots['no-data']) == null ? void 0 : _slots$noData.call(slots)) ?? createVNode(VListItem, {
                 "title": t(props.noDataText)
-              }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), filteredItems.value.map((item, index) => {
+              }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), displayItems.value.map((item, index) => {
                 var _slots$item;
                 return ((_slots$item = slots.item) == null ? void 0 : _slots$item.call(slots, {
                   item,
@@ -10998,7 +11054,10 @@ const VCard = defineComponent({
     },
     prependAvatar: String,
     prependIcon: IconValue,
-    ripple: Boolean,
+    ripple: {
+      type: Boolean,
+      default: true
+    },
     subtitle: String,
     text: String,
     title: String,
@@ -11119,7 +11178,7 @@ const VCard = defineComponent({
         }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), slots.actions && createVNode(VCardActions, null, {
           default: slots.actions
         }), genOverlays(isClickable.value, 'v-card')]
-      }), [[resolveDirective("ripple"), isClickable.value]]);
+      }), [[resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
     return {};
   }
@@ -12412,6 +12471,10 @@ const VSliderThumb = defineComponent({
     position: {
       type: Number,
       required: true
+    },
+    ripple: {
+      type: Boolean,
+      default: true
     }
   },
   emits: {
@@ -12512,7 +12575,7 @@ const VSliderThumb = defineComponent({
       }, null), withDirectives(createVNode("div", {
         "class": ['v-slider-thumb__ripple', textColorClasses.value],
         "style": textColorStyles.value
-      }, null), [[resolveDirective("ripple"), true, null, {
+      }, null), [[resolveDirective("ripple"), props.ripple, null, {
         circle: true,
         center: true
       }]]), createVNode(VScaleTransition, {
@@ -12715,13 +12778,15 @@ const VSlider = defineComponent({
         prepend: hasPrepend ? slotProps => {
           var _slots$label, _slots$prepend;
           return createVNode(Fragment, null, [((_slots$label = slots.label) == null ? void 0 : _slots$label.call(slots, slotProps)) ?? props.label ? createVNode(VLabel, {
+            "id": slotProps.id,
             "class": "v-slider__label",
             "text": props.label
           }, null) : undefined, (_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps)]);
         } : undefined,
         default: _ref2 => {
           let {
-            id
+            id,
+            messagesId
           } = _ref2;
           return createVNode("div", {
             "class": "v-slider__container",
@@ -12742,6 +12807,7 @@ const VSlider = defineComponent({
             'tick-label': slots['tick-label']
           }), createVNode(VSliderThumb, {
             "ref": thumbContainerRef,
+            "aria-describedby": messagesId.value,
             "focused": isFocused.value,
             "min": min.value,
             "max": max.value,
@@ -13443,6 +13509,7 @@ const VCombobox = genericComponent()({
       const transformed = transformOut(v);
       return props.multiple ? transformed : transformed[0] ?? null;
     });
+    const form = useForm();
     const _search = ref(!props.multiple ? ((_model$value$ = model.value[0]) == null ? void 0 : _model$value$.title) ?? '' : '');
     const search = computed({
       get: () => {
@@ -13487,6 +13554,12 @@ const VCombobox = genericComponent()({
         return items.value.find(item => props.valueComparator(item.value, v.value)) || v;
       });
     });
+    const displayItems = computed(() => {
+      if (props.hideSelected) {
+        return filteredItems.value.filter(filteredItem => !selections.value.some(s => s.value === filteredItem.value));
+      }
+      return filteredItems.value;
+    });
     const selected = computed(() => selections.value.map(selection => selection.props.value));
     const selection = computed(() => selections.value[selectionIndex.value]);
     const listRef = ref();
@@ -13497,11 +13570,11 @@ const VCombobox = genericComponent()({
       }
     }
     function onClickControl() {
-      if (props.hideNoData && !items.value.length || props.readonly) return;
+      if (props.hideNoData && !items.value.length || props.readonly || form != null && form.isReadonly.value) return;
       menu.value = true;
     }
     function onKeydown(e) {
-      if (props.readonly) return;
+      if (props.readonly || form != null && form.isReadonly.value) return;
       const selectionStart = vTextFieldRef.value.selectionStart;
       const length = selected.value.length;
       if (selectionIndex.value > -1) e.preventDefault();
@@ -13554,7 +13627,7 @@ const VCombobox = genericComponent()({
           vTextFieldRef.value.setSelectionRange(0, 0);
         }
       }
-      if (e.key === 'Enter') {
+      if (e.key === 'Enter' && search.value) {
         select(transformItem$1(props, search.value));
         search.value = '';
       }
@@ -13564,7 +13637,7 @@ const VCombobox = genericComponent()({
     }
     function select(item) {
       if (props.multiple) {
-        const index = selected.value.findIndex(selection => selection === item.value);
+        const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
         if (index === -1) {
           model.value = [...model.value, item];
         } else {
@@ -13608,6 +13681,7 @@ const VCombobox = genericComponent()({
     });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
+      const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
       const [textFieldProps] = filterVTextFieldProps(props);
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
@@ -13642,12 +13716,13 @@ const VCombobox = genericComponent()({
             "activator": "parent",
             "contentClass": "v-combobox__content",
             "eager": props.eager,
+            "maxHeight": 310,
             "openOnClick": false,
             "closeOnContentClick": false,
             "transition": props.transition,
             "onAfterLeave": onAfterLeave
           }, props.menuProps), {
-            default: () => [createVNode(VList, {
+            default: () => [hasList && createVNode(VList, {
               "ref": listRef,
               "selected": selected.value,
               "selectStrategy": props.multiple ? 'independent' : 'single-independent',
@@ -13655,9 +13730,9 @@ const VCombobox = genericComponent()({
               "onFocusin": onFocusin,
               "onFocusout": onFocusout
             }, {
-              default: () => [!filteredItems.value.length && !props.hideNoData && (((_slots$noData = slots['no-data']) == null ? void 0 : _slots$noData.call(slots)) ?? createVNode(VListItem, {
+              default: () => [!displayItems.value.length && !props.hideNoData && (((_slots$noData = slots['no-data']) == null ? void 0 : _slots$noData.call(slots)) ?? createVNode(VListItem, {
                 "title": t(props.noDataText)
-              }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), filteredItems.value.map((item, index) => {
+              }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), displayItems.value.map((item, index) => {
                 var _slots$item;
                 return ((_slots$item = slots.item) == null ? void 0 : _slots$item.call(slots, {
                   item,
@@ -14207,6 +14282,7 @@ const VFileInput = defineComponent({
         ...slots,
         default: _ref3 => {
           let {
+            id,
             isDisabled,
             isDirty,
             isReadonly,
@@ -14220,6 +14296,7 @@ const VFileInput = defineComponent({
             "onClick:prependInner": props['onClick:prependInner'],
             "onClick:appendInner": props['onClick:appendInner']
           }, fieldProps, {
+            "id": id.value,
             "active": isDirty.value || isFocused.value,
             "dirty": isDirty.value,
             "focused": isFocused.value,
@@ -16000,6 +16077,7 @@ const VRadioGroup = defineComponent({
         default: _ref2 => {
           let {
             id,
+            messagesId,
             isDisabled,
             isReadonly
           } = _ref2;
@@ -16009,6 +16087,7 @@ const VRadioGroup = defineComponent({
             default: () => [label]
           }), createVNode(VSelectionControlGroup, mergeProps(controlProps, {
             "id": id.value,
+            "aria-describedby": messagesId.value,
             "defaultsTarget": "VRadio",
             "trueIcon": props.trueIcon,
             "falseIcon": props.falseIcon,
@@ -16132,7 +16211,8 @@ const VRangeSlider = defineComponent({
         default: _ref2 => {
           var _startThumbRef$value4, _stopThumbRef$value4;
           let {
-            id
+            id,
+            messagesId
           } = _ref2;
           return createVNode("div", {
             "class": "v-slider__container",
@@ -16160,6 +16240,7 @@ const VRangeSlider = defineComponent({
             'tick-label': slots['tick-label']
           }), createVNode(VSliderThumb, {
             "ref": startThumbRef,
+            "aria-describedby": messagesId.value,
             "focused": isFocused && activeThumbRef.value === ((_startThumbRef$value4 = startThumbRef.value) == null ? void 0 : _startThumbRef$value4.$el),
             "modelValue": model.value[0],
             "onUpdate:modelValue": v => model.value = [v, model.value[1]],
@@ -16189,6 +16270,7 @@ const VRangeSlider = defineComponent({
             'thumb-label': slots['thumb-label']
           }), createVNode(VSliderThumb, {
             "ref": stopThumbRef,
+            "aria-describedby": messagesId.value,
             "focused": isFocused && activeThumbRef.value === ((_stopThumbRef$value4 = stopThumbRef.value) == null ? void 0 : _stopThumbRef$value4.$el),
             "modelValue": model.value[1],
             "onUpdate:modelValue": v => model.value = [model.value[0], v],
@@ -17026,6 +17108,7 @@ const VSwitch = defineComponent({
         default: _ref2 => {
           let {
             id,
+            messagesId,
             isDisabled,
             isReadonly,
             isValid
@@ -17036,6 +17119,7 @@ const VSwitch = defineComponent({
             "modelValue": model.value,
             "onUpdate:modelValue": [$event => model.value = $event, onChange],
             "id": id.value,
+            "aria-describedby": messagesId.value,
             "type": "checkbox",
             "aria-checked": indeterminate.value ? 'mixed' : undefined,
             "disabled": isDisabled.value,
@@ -18306,7 +18390,7 @@ function createVuetify$1() {
     locale
   };
 }
-const version$1 = "3.1.0";
+const version$1 = "3.1.2";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -18327,7 +18411,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.1.0";
+const version = "3.1.2";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDisplay, useLayout, useLocale, useRtl, useTheme, version };