MatSelectionList accent color not correctly applied when inside tabs

[benelliott]

Reproduction

https://stackblitz.com/edit/components-issue-u8tctx

Expected Behavior

Selection list checkboxes should default to accent regardless of their parent.

Actual Behavior

Selection list checkboxes get stuck on primary even when accent is explicitly specified, when inside components that do apply a theme class, such as tabs.

This is because MatSelectionList doesn't apply a specific theme when accent is set:

components/src/material/list/selection-list.ts

Line 105 in e6afdbb

'[class.mat-primary]': 'color === "primary"',

However, this fails when the selection list is inside tabs as those tabs do have a mat-primary theme set on them which overrides this default behaviour.

Here is the theme logic inside pseudo-checkbox:

components/src/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss

Line 35 in 9eeb4b5

.mat-accent .mat-pseudo-checkbox-checked,

This could be fixed by explicitly setting the default accent class on the selection list when none is specified (or accent is explicitly specified).

Environment

Latest StackBlitz

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}