bug(M3-Buttons): missing color variants

[banut1]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

Missing color-variant error for mat-fab:

Usage:

.danger {
  @include mat.fab-color($theme, $color-variant: error);
}

Error on any kind of color-variant for mat-icon-button:

Usage:

.danger {
  @include mat.icon-button-color($theme, $color-variant: primary);
}

Reproduction

https://stackblitz.com/edit/67r7jk?file=src%2Ftheme.scss

Expected Behavior

all color variants work for all components

Actual Behavior

different errors in different use cases

Environment

• Angular: 18.0.1
• CDK/Material: 18.0.1
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): Windows

[crisbeto]

The color variants are defined by the Material spec which doesn't include an error variant. The way to do it would be to define a theme with your error colors and pass it to mat.button-theme like:

button.error-variant {
  @include mat.button-theme($your-error-theme);
}

[banut1]

I have generated the color palette with ng generate @angular/material:m3-theme, and it has generated an error palette alongside with primary, tertiary, secondary, neutral. I don't have an entire theme for the error colors, just that palette.

Can this be achieved for icon buttons and fabs without defining a whole error theme and just using the error colors from $theme?

[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.}