[Bug Report][4.0.6] VThemeProvider color not applied on VRadio

[xmorell]

Environment

Vuetify Version: 4.0.6
Vue Version: 3.5.25
OS: macOS 10.15.7 (current)

Steps to reproduce

1. Check the example

Expected Behavior

I would expect to be able to see the radio over the black text

Actual Behavior

Everything is black

Reproduction Link

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

Other comments

The colors of the radio are "inherit" and even thought the theme is light, there is no css adding color "white" in order to make the radio options visible

[J-Sek]

Not sure if it is a bug or just some confusion and lack of experience.

Workaround (demo):

<v-sheet theme="dark" color="surface" class="v-container v-container--fluid">
  <!-- dark section content -->
</v-sheet>

or

<v-container fluid class="v-theme--dark bg-surface">
  <!-- dark section content -->
</v-container>

[xmorell]

Thanks for the workaround, but I don't think this should be closed as a user error.

The whole point of VThemeProvider is to declare "everything inside this boundary uses theme X". From your own documentation:

By default, v-theme-provider is a renderless component that allows you to change the applied theme for all of its children.

It doesn't matter whether I set the background color with a plain div, a v-sheet, or a v-card. That's a separate concern. I just want to declare that from that point on, all child components should use the dark theme — and that is not working.

[J-Sek]

• v-container is theme independent - does not have the prop.
• theme prop exists on v-radio, but does not seem to work

We can fix theme prop for radios to align with v2 (that reacted to dark by making the labels and indicators white), but we will also need to take potential regression into account as it would probably mean removal of color: inherit and might introduce visual regression in some projects. It would be easier to remove theme prop from the VSelectionControlGroup.tsx.