[Bug]: Basic List - Background color issue on Theme switch

[jayachandrikagadwal]

Library

React / v8 (@fluentui/react)

System Info

System:
    OS: Windows 11 10.0.22621
    CPU: (8) x64 Intel(R) Core(TM) i7-1065G7 CPU @ 1.30GHz
    Memory: 13.69 GB / 31.60 GB
  Browsers:
    Edge: Chromium (120.0.2210.133)
    Internet Explorer: 11.0.22621.1

Are you reporting Accessibility issue?

None

Reproduction

https://developer.microsoft.com/en-us/fluentui#/controls/web/list

Bug Description

Actual Behavior

List control from fluent UI is not changing the background color of its items on hover according to the theme. All of the list attributes are switching according to the theme except the background color for onhover behaviour. The sample given in fluent documentation also shows the same behaviour.
Fluent List

css used:

initial behaviour with light theme:

behaviour upon theme switch:

Expected Behavior

If the theme is switched, the hover color should change.

Logs

No response

Requested priority

Normal

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[mltejera]

Hi jayachandrikagadwal - thanks for submitting!

The examples for list use a very outdated theme mechanism (getTheme) that gets a global static theme, rather than the live theme that lives in the theme provider. The useTheme hook is our current way of getting the theme. These examples just haven't been updated.

Can you provide a link to a reduction that uses the current standard for theming?

The List component itself doesn't contain any theming or styling opinions, so I really hesitate to investigate further without a verified reproduction using the modern approach to theme.

I'm going to close for now, but please feel free to re-open if you're able to get a reproduction.