vuetifyjs / vuetify

🐉 Vue Component Framework
https://vuetifyjs.com
MIT License
39.06k stars 6.91k forks source link

[Feature Request] Allow contentClass global configuration and component configuration with merge behavior #19633

Open eolamisan opened 2 weeks ago

eolamisan commented 2 weeks ago

Problem to solve

Allow setting global contentClass with merge behavior to reduce code duplication for components with contentClass prop:

import { createVuetify } from 'vuetify'
import { VBtn } from 'vuetify/components/VBtn'

export default createVuetify({
global: {
      contentClass: ['v-overlay-global'],
    },
  defaults: {
    VMenu: {
      contentClass: ['v-overlay-global-menu'],
    },
  },
})

...

<template>
  <v-menu contentClass="foobar">Foobar</v-menu>
</template>

Actual output

<!-- Example HTML Output -->
<v-menu contentClass="foobar">Fizzbuzz</v-menu>

Expected Output

<!-- Example HTML Output -->
<v-menu contentClass="v-overlay-global v-overlay-global-menu foobar">Fizzbuzz</v-menu>

Proposed solution

Merge contentClass prop like class props.

Expected Output

<!-- Example HTML Output -->
<v-menu contentClass="v-overlay-global v-overlay-global-menu foobar">Fizzbuzz</v-menu>