[Feature Request] Ripple Effect Disabled But Active State Styling Missing

Problem to solve

Description

When I disable the ripple effect globally using the following configuration:

export const vuetify = createVuetify({
   defaults: {
      global: {
         ripple: false
      },
   }
});

I no longer get the usual active state color feedback (such as the color change on :active state) on components like buttons (v-btn) and list items (v-list-item). This makes it difficult to visually detect that the button or list item has been clicked.

Currently, I am resolving this issue by manually applying the variant: "focus" property on individual components, like this:

defaults: {
   global: {
      ripple: false
   },
   VBtn: {
      variant: "focus"
   }
}

And also adding the following custom CSS:

.v-btn.v-btn--variant-focus:active > .v-btn__overlay {
   opacity: calc(var(--v-selected-opacity) * var(--v-theme-overlay-multiplier));
}

However, applying this fix manually for each component is not scalable.

Proposed solution

It would be great if Vuetify could automatically add a class (e.g., v-ripple--false) to the

element or provide an easier way to manage the active state styling when ripple is globally disabled. This would allow us to manage the active state styles through CSS more efficiently, without having to manually configure each component.

Thank you!

<div class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr v-ripple--false">

Start by tracing the global ripple configuration and the active-state styling for v-btn and v-list-item. Compare their behavior with ripple enabled and disabled, then determine how a global state can preserve active feedback; done means both components visibly indicate activation without per-component variant or custom CSS overrides.