fix(material/button): remove duplicate typography styles from FAB (#2…

…8258)

The FAB was already tokenized some time ago, but we still included typography styles both through the `without-ripple` mixin in the theme and the `static-styles` in the base component styles.

These changes remove the unnecessary styles and re-add the font smoothing since it can affect internal tests.

src/material/button/_fab-theme.scss

@@ -1,8 +1,6 @@
 @use 'sass:map';
-@use '@material/fab/fab' as mdc-fab;
 @use '@material/fab/fab-theme' as mdc-fab-theme;
 @use '@material/fab/extended-fab-theme' as mdc-extended-fab-theme;
-@use '../core/mdc-helpers/mdc-helpers';
 @use '../core/style/sass-utils';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
@@ -73,13 +71,8 @@
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
   }
   @else {
-    @include mdc-helpers.using-mdc-typography($theme) {
-      @include mdc-fab.without-ripple($query: mdc-helpers.$mdc-typography-styles-query);
-    }
-
-    $typography-tokens: tokens-mdc-extended-fab.get-typography-tokens($theme);
     @include sass-utils.current-selector-or-root() {
-      @include mdc-extended-fab-theme.theme($typography-tokens);
+      @include mdc-extended-fab-theme.theme(tokens-mdc-extended-fab.get-typography-tokens($theme));
     }
   }
 }

src/material/button/fab.scss

@@ -1,6 +1,7 @@
 @use '@material/fab' as mdc-fab;
 @use '@material/fab/extended-fab-theme' as mdc-extended-fab-theme;
 @use '@material/fab/fab-theme' as mdc-fab-theme;
+@use '@material/typography/typography' as mdc-typography;
 @use '@material/theme/custom-properties' as mdc-custom-properties;
 
 @use './button-base';
@@ -17,17 +18,19 @@
   $mdc-fab-token-slots: tokens-mdc-fab.get-token-slots();
   $mdc-extended-fab-token-slots: tokens-mdc-extended-fab.get-token-slots();
 
-  // Add the MDC fab static styles.
-  @include mdc-fab.static-styles();
+  // Note: it's important to pass the query here, otherwise MDC generates
+  // some unnecessary typography styles for the extended FAB.
+  @include mdc-fab.static-styles($query: mdc-helpers.$mdc-base-styles-query);
 
-  // Add default values for tokens that aren't outputted by the theming API.
   .mat-mdc-fab, .mat-mdc-mini-fab {
-    // Add the official slots for the MDC fab.
     @include mdc-fab-theme.theme-styles($mdc-fab-token-slots);
   }
 
   .mat-mdc-extended-fab {
-    // Add the official slots for the MDC fab.
+    // Before tokens MDC included the font smoothing automatically, but with
+    // tokens it doesn't. We add it since it can cause tiny differences in
+    // screenshot tests and it generally looks better.
+    @include mdc-typography.smooth-font();
     @include mdc-extended-fab-theme.theme-styles($mdc-extended-fab-token-slots);
   }
 }