@vuetify/nightly 3.8.7-dev.2025-05-27 → 3.8.7-dev.2025-05-30

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.8.7-dev.2025-05-27
+* Vuetify v3.8.7-dev.2025-05-30
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -5904,8 +5904,8 @@ function rippleCancelShow(e) {
   window.clearTimeout(element._ripple.showTimer);
 }
 let keyboardRipple = false;
-function keyboardRippleShow(e) {
-  if (!keyboardRipple && (e.keyCode === keyCodes.enter || e.keyCode === keyCodes.space)) {
+function keyboardRippleShow(e, keys) {
+  if (!keyboardRipple && keys.includes(e.keyCode)) {
     keyboardRipple = true;
     rippleShow(e);
   }
@@ -5933,9 +5933,12 @@ function updateRipple(el, binding, wasEnabled) {
   el._ripple.enabled = enabled;
   el._ripple.centered = modifiers.center;
   el._ripple.circle = modifiers.circle;
-  if (isObject(value) && value.class) {
-    el._ripple.class = value.class;
+  const bindingValue = isObject(value) ? value : {};
+  if (bindingValue.class) {
+    el._ripple.class = bindingValue.class;
   }
+  const allowedKeys = bindingValue.keys ?? [keyCodes.enter, keyCodes.space];
+  el._ripple.keyDownHandler = e => keyboardRippleShow(e, allowedKeys);
   if (enabled && !wasEnabled) {
     if (modifiers.stop) {
       el.addEventListener('touchstart', rippleStop, {
@@ -5957,7 +5960,7 @@ function updateRipple(el, binding, wasEnabled) {
     el.addEventListener('mousedown', rippleShow);
     el.addEventListener('mouseup', rippleHide);
     el.addEventListener('mouseleave', rippleHide);
-    el.addEventListener('keydown', keyboardRippleShow);
+    el.addEventListener('keydown', e => keyboardRippleShow(e, allowedKeys));
     el.addEventListener('keyup', keyboardRippleHide);
     el.addEventListener('blur', focusRippleHide);
 
@@ -5977,7 +5980,9 @@ function removeListeners(el) {
   el.removeEventListener('touchcancel', rippleHide);
   el.removeEventListener('mouseup', rippleHide);
   el.removeEventListener('mouseleave', rippleHide);
-  el.removeEventListener('keydown', keyboardRippleShow);
+  if (el._ripple?.keyDownHandler) {
+    el.removeEventListener('keydown', el._ripple.keyDownHandler);
+  }
   el.removeEventListener('keyup', keyboardRippleHide);
   el.removeEventListener('dragstart', rippleHide);
   el.removeEventListener('blur', focusRippleHide);
@@ -5986,8 +5991,8 @@ function mounted$4(el, binding) {
   updateRipple(el, binding, false);
 }
 function unmounted$4(el) {
-  delete el._ripple;
   removeListeners(el);
+  delete el._ripple;
 }
 function updated$1(el, binding) {
   if (binding.value === binding.oldValue) {
@@ -8698,11 +8703,18 @@ const VDivider = genericComponent()({
 // List
 const ListKey = Symbol.for('vuetify:list');
 function createList() {
+  let {
+    filterable
+  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+    filterable: false
+  };
   const parent = inject$1(ListKey, {
+    filterable: false,
     hasPrepend: shallowRef(false),
     updateHasPrepend: () => null
   });
   const data = {
+    filterable: parent.filterable || filterable,
     hasPrepend: shallowRef(false),
     updateHasPrepend: value => {
       if (value) data.hasPrepend.value = value;
@@ -9654,6 +9666,9 @@ const VListItem = genericComponent()({
       roundedClasses
     } = useRounded(roundedProps);
     const lineClasses = toRef(() => props.lines ? `v-list-item--${props.lines}-line` : undefined);
+    const rippleOptions = toRef(() => props.ripple !== undefined && !!props.ripple && list?.filterable ? {
+      keys: [keyCodes.enter]
+    } : props.ripple);
     const slotProps = computed(() => ({
       isActive: isActive.value,
       select,
@@ -9678,8 +9693,9 @@ const VListItem = genericComponent()({
     function onKeyDown(e) {
       const target = e.target;
       if (['INPUT', 'TEXTAREA'].includes(target.tagName)) return;
-      if (e.key === 'Enter' || e.key === ' ') {
+      if (e.key === 'Enter' || e.key === ' ' && !list?.filterable) {
         e.preventDefault();
+        e.stopPropagation();
         e.target.dispatchEvent(new MouseEvent('click', e));
       }
     }
@@ -9789,7 +9805,7 @@ const VListItem = genericComponent()({
         }), createElementVNode("div", {
           "class": "v-list-item__spacer"
         }, null)])]
-      }), [[Ripple, isClickable.value && props.ripple]]);
+      }), [[Ripple, isClickable.value && rippleOptions.value]]);
     });
     return {
       activate,
@@ -10112,6 +10128,7 @@ const makeVListProps = propsFactory({
   activeClass: String,
   bgColor: String,
   disabled: Boolean,
+  filterable: Boolean,
   expandIcon: IconValue,
   collapseIcon: IconValue,
   lines: {
@@ -10195,7 +10212,9 @@ const VList = genericComponent()({
     const activeColor = toRef(() => props.activeColor);
     const baseColor = toRef(() => props.baseColor);
     const color = toRef(() => props.color);
-    createList();
+    createList({
+      filterable: props.filterable
+    });
     provideDefaults({
       VListGroup: {
         activeColor,
@@ -13818,7 +13837,7 @@ const VAutocomplete = genericComponent()({
       menu.value = !menu.value;
     }
     function onListKeydown(e) {
-      if (e.key !== ' ' && checkPrintable(e)) {
+      if (checkPrintable(e) || e.key === 'Backspace') {
         vTextFieldRef.value?.focus();
       }
     }
@@ -14023,6 +14042,7 @@ const VAutocomplete = genericComponent()({
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, mergeProps({
             "ref": listRef,
+            "filterable": true,
             "selected": selectedValues.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
@@ -18561,7 +18581,7 @@ const VCombobox = genericComponent()({
       menu.value = !menu.value;
     }
     function onListKeydown(e) {
-      if (e.key !== ' ' && checkPrintable(e)) {
+      if (checkPrintable(e) || e.key === 'Backspace') {
         vTextFieldRef.value?.focus();
       }
     }
@@ -18766,6 +18786,7 @@ const VCombobox = genericComponent()({
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, mergeProps({
             "ref": listRef,
+            "filterable": true,
             "selected": selectedValues.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
@@ -29498,7 +29519,7 @@ function createVuetify$1() {
     };
   });
 }
-const version$1 = "3.8.7-dev.2025-05-27";
+const version$1 = "3.8.7-dev.2025-05-30";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -29523,7 +29544,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.8.7-dev.2025-05-27";
+const version = "3.8.7-dev.2025-05-30";
 createVuetify.version = version;
 
 export { index as blueprints, components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useLayout, useLocale, useRtl, useTheme, version };