[Bug Report][3.4.2] v-chip different theme

[Ribeiro-Tiago]

Environment

Vuetify Version: 3.4.2
Vue Version: 3.3.8
Browsers: Chrome 119.0.0.0
OS: Mac OS 10.15.7

Steps to reproduce

• setup a project with a default theme
• use the "theme" property or v-theme-provider to change the theme of a specific component

Expected Behavior

chips to switch to specified theme

Actual Behavior

they remain with default theme

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

according to the documentation it's possible to have specific components with different themes by using the theme property or v-theme-provider. These do not work. In my case I have a light theme but in some components (like the chips) i wanna have the dark theme

This was possible in v2 and according to the documentation still should be

[KaelWD]

The problem here is v-chip's default variant is tonal which just uses the current text color. If you set variant="flat" or a specific color you will see it does change with the theme.

[Ribeiro-Tiago]

indeed. Shouldn't theme be independent of variant though?

[KaelWD]

It is, the default text color is just inherited.

[J-Sek]

I wanted to understand the problem a little more and created this demo, where you can shift chips outside of the black background.

recording

So if theme="dark" would just blindly switch CSS rules to those dedicated for dark theme, then chips would disappear - making it a footgun. IMO it is better to leave it as-is.

As a workaround (when used on black/white background) - [flat] on white has identical color to [tonal] on black

...or wrap the section within a VCard.