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

package/dist/vuetify-labs.cjs

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.8.7-dev.2025-05-27
+* Vuetify v3.8.7-dev.2025-06-03
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -3803,7 +3803,10 @@
       default: 'default',
       validator: v => allowedDensities$1.includes(v)
     },
-    extended: Boolean,
+    extended: {
+      type: Boolean,
+      default: null
+    },
     extensionHeight: {
       type: [Number, String],
       default: 48
@@ -3851,7 +3854,7 @@
       const {
         rtlClasses
       } = useRtl();
-      const isExtended = vue.shallowRef(!!(props.extended || slots.extension?.()));
+      const isExtended = vue.shallowRef(props.extended === null ? !!slots.extension?.() : props.extended);
       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);
       provideDefaults({
@@ -3863,7 +3866,7 @@
         const hasTitle = !!(props.title || slots.title);
         const hasImage = !!(slots.image || props.image);
         const extension = slots.extension?.();
-        isExtended.value = !!(props.extended || extension);
+        isExtended.value = props.extended === null ? !!extension : props.extended;
         return vue.createVNode(props.tag, {
           "class": vue.normalizeClass(['v-toolbar', {
             'v-toolbar--absolute': props.absolute,
@@ -5630,8 +5633,8 @@
     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);
     }
@@ -5659,9 +5662,12 @@
     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, {
@@ -5683,7 +5689,7 @@
       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);
 
@@ -5703,7 +5709,9 @@
     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);
@@ -5712,8 +5720,8 @@
     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) {
@@ -8424,11 +8432,18 @@
   // List
   const ListKey = Symbol.for('vuetify:list');
   function createList() {
+    let {
+      filterable
+    } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+      filterable: false
+    };
     const parent = vue.inject(ListKey, {
+      filterable: false,
       hasPrepend: vue.shallowRef(false),
       updateHasPrepend: () => null
     });
     const data = {
+      filterable: parent.filterable || filterable,
       hasPrepend: vue.shallowRef(false),
       updateHasPrepend: value => {
         if (value) data.hasPrepend.value = value;
@@ -9380,6 +9395,9 @@
         roundedClasses
       } = useRounded(roundedProps);
       const lineClasses = vue.toRef(() => props.lines ? `v-list-item--${props.lines}-line` : undefined);
+      const rippleOptions = vue.toRef(() => props.ripple !== undefined && !!props.ripple && list?.filterable ? {
+        keys: [keyCodes.enter]
+      } : props.ripple);
       const slotProps = vue.computed(() => ({
         isActive: isActive.value,
         select,
@@ -9404,8 +9422,9 @@
       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));
         }
       }
@@ -9515,7 +9534,7 @@
           }), vue.createElementVNode("div", {
             "class": "v-list-item__spacer"
           }, null)])]
-        }), [[Ripple, isClickable.value && props.ripple]]);
+        }), [[Ripple, isClickable.value && rippleOptions.value]]);
       });
       return {
         activate,
@@ -9838,6 +9857,7 @@
     activeClass: String,
     bgColor: String,
     disabled: Boolean,
+    filterable: Boolean,
     expandIcon: IconValue,
     collapseIcon: IconValue,
     lines: {
@@ -9921,7 +9941,9 @@
       const activeColor = vue.toRef(() => props.activeColor);
       const baseColor = vue.toRef(() => props.baseColor);
       const color = vue.toRef(() => props.color);
-      createList();
+      createList({
+        filterable: props.filterable
+      });
       provideDefaults({
         VListGroup: {
           activeColor,
@@ -13544,7 +13566,7 @@
         menu.value = !menu.value;
       }
       function onListKeydown(e) {
-        if (e.key !== ' ' && checkPrintable(e)) {
+        if (checkPrintable(e) || e.key === 'Backspace') {
           vTextFieldRef.value?.focus();
         }
       }
@@ -13749,6 +13771,7 @@
           }, props.menuProps), {
             default: () => [hasList && vue.createVNode(VList, vue.mergeProps({
               "ref": listRef,
+              "filterable": true,
               "selected": selectedValues.value,
               "selectStrategy": props.multiple ? 'independent' : 'single-independent',
               "onMousedown": e => e.preventDefault(),
@@ -18287,7 +18310,7 @@
         menu.value = !menu.value;
       }
       function onListKeydown(e) {
-        if (e.key !== ' ' && checkPrintable(e)) {
+        if (checkPrintable(e) || e.key === 'Backspace') {
           vTextFieldRef.value?.focus();
         }
       }
@@ -18492,6 +18515,7 @@
           }, props.menuProps), {
             default: () => [hasList && vue.createVNode(VList, vue.mergeProps({
               "ref": listRef,
+              "filterable": true,
               "selected": selectedValues.value,
               "selectStrategy": props.multiple ? 'independent' : 'single-independent',
               "onMousedown": e => e.preventDefault(),
@@ -20978,11 +21002,18 @@
     }
   });
 
+  // Types
+
   const makeVTableProps = propsFactory({
     fixedHeader: Boolean,
     fixedFooter: Boolean,
     height: [Number, String],
     hover: Boolean,
+    striped: {
+      type: String,
+      default: null,
+      validator: v => ['even', 'odd'].includes(v)
+    },
     ...makeComponentProps(),
     ...makeDensityProps(),
     ...makeTagProps(),
@@ -21009,7 +21040,9 @@
           'v-table--fixed-footer': props.fixedFooter,
           'v-table--has-top': !!slots.top,
           'v-table--has-bottom': !!slots.bottom,
-          'v-table--hover': props.hover
+          'v-table--hover': props.hover,
+          'v-table--striped-even': props.striped === 'even',
+          'v-table--striped-odd': props.striped === 'odd'
         }, themeClasses.value, densityClasses.value, props.class]),
         "style": vue.normalizeStyle(props.style)
       }, {
@@ -32192,7 +32225,7 @@
       };
     });
   }
-  const version$1 = "3.8.7-dev.2025-05-27";
+  const version$1 = "3.8.7-dev.2025-06-03";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -32490,7 +32523,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.8.7-dev.2025-05-27";
+  const version = "3.8.7-dev.2025-06-03";
 
   /* eslint-disable local-rules/sort-imports */