Angular Material Icon Button Changed from Version 14 to 15?

Question

As I updated my app's Angular version from 14 to 15 - including all packages like material design - the mat-icon-button now has a circular background which it hadn't before. And which it doesn't have to have according to the documentation:

The blue background is the normal background of my page.

The code is very straight forward and doesn't change from Angular 14 to 15:

<button mat-icon-button><mat-icon>menu</mat-icon></button>

Answer 1

<!-- Previous syntax (version 14 and below) -->
<button mat-icon-button>
  <mat-icon>favorite</mat-icon>
</button>

<!-- New syntax (version 15 and above) -->
<mat-icon-button>
  <mat-icon>favorite</mat-icon>
</mat-icon-button>

Answer 2

As Andrew mentioned there is a migration guide for material:

https://material.angular.io/guide/mdc-migration

Running the migration tools solved the problem:

ng generate @angular/material:mdc-migration

The migration tool changed e.g. the import for all material components to something like:

import { MatButtonModule } from "@angular/material/button";