@angular/material 19.0.0-next.7 → 19.0.0-next.9

package/stepper/_stepper-theme.scss

@@ -12,8 +12,8 @@
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
+  } @else {
   }
-  @else {}
 }
 
 /// Outputs color theme styles for mat-stepper.
@@ -24,20 +24,25 @@
 @mixin color($theme, $options...) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-        tokens-mat-stepper.get-color-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-stepper.$prefix,
+        tokens-mat-stepper.get-color-tokens($theme)
+      );
 
       .mat-step-header.mat-accent {
-        @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-          tokens-mat-stepper.private-get-color-palette-color-tokens($theme, accent));
+        @include token-utils.create-token-values(
+          tokens-mat-stepper.$prefix,
+          tokens-mat-stepper.private-get-color-palette-color-tokens($theme, accent)
+        );
       }
 
       .mat-step-header.mat-warn {
-        @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-          tokens-mat-stepper.private-get-color-palette-color-tokens($theme, warn));
+        @include token-utils.create-token-values(
+          tokens-mat-stepper.$prefix,
+          tokens-mat-stepper.private-get-color-palette-color-tokens($theme, warn)
+        );
       }
     }
   }
@@ -48,11 +53,12 @@
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-        tokens-mat-stepper.get-typography-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-stepper.$prefix,
+        tokens-mat-stepper.get-typography-tokens($theme)
+      );
     }
   }
 }
@@ -62,11 +68,12 @@
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-stepper.$prefix,
-        tokens-mat-stepper.get-density-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-stepper.$prefix,
+        tokens-mat-stepper.get-density-tokens($theme)
+      );
     }
   }
 }
@@ -76,7 +83,10 @@
 @mixin overrides($tokens: ()) {
   @include token-utils.batch-create-token-values(
     $tokens,
-    (prefix: tokens-mat-stepper.$prefix, tokens: tokens-mat-stepper.get-token-slots()),
+    (
+      namespace: tokens-mat-stepper.$prefix,
+      tokens: tokens-mat-stepper.get-token-slots(),
+    )
   );
 }
 
@@ -85,12 +95,11 @@
 /// @param {ArgList} Additional optional arguments (only supported for M3 themes):
 ///   $color-variant: The color variant to use for the stepper: primary, secondary,
 ///   tertiary, or error (If not specified, primary color values will be used).
-@mixin theme($theme,  $options...) {
+@mixin theme($theme, $options...) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-stepper') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -107,14 +116,14 @@
 
 @mixin _theme-from-tokens($tokens, $options...) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
   @if ($tokens != ()) {
     $mat-stepper-tokens: token-utils.get-tokens-for(
       $tokens,
       tokens-mat-stepper.$prefix,
       $options...
     );
-    @include token-utils.create-token-values(
-        tokens-mat-stepper.$prefix, $mat-stepper-tokens);
+    @include token-utils.create-token-values(tokens-mat-stepper.$prefix, $mat-stepper-tokens);
   }
 }

package/table/_table-theme.scss

@@ -10,11 +10,12 @@
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
-          tokens-mat-table.$prefix, tokens-mat-table.get-unthemable-tokens());
+        tokens-mat-table.$prefix,
+        tokens-mat-table.get-unthemable-tokens()
+      );
     }
   }
 }
@@ -22,11 +23,12 @@
 @mixin color($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-table.$prefix,
-        tokens-mat-table.get-color-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-table.$prefix,
+        tokens-mat-table.get-color-tokens($theme)
+      );
     }
   }
 }
@@ -34,11 +36,12 @@
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-table.$prefix,
-        tokens-mat-table.get-typography-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-table.$prefix,
+        tokens-mat-table.get-typography-tokens($theme)
+      );
     }
   }
 }
@@ -46,11 +49,12 @@
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-table.$prefix,
-        tokens-mat-table.get-density-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-table.$prefix,
+        tokens-mat-table.get-density-tokens($theme)
+      );
     }
   }
 }
@@ -58,7 +62,10 @@
 @mixin overrides($tokens: ()) {
   @include token-utils.batch-create-token-values(
     $tokens,
-    (prefix: tokens-mat-table.$prefix, tokens: tokens-mat-table.get-token-slots()),
+    (
+      namespace: tokens-mat-table.$prefix,
+      tokens: tokens-mat-table.get-token-slots(),
+    )
   );
 }
 
@@ -66,8 +73,7 @@
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-table') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme));
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -84,9 +90,12 @@
 
 @mixin _theme-from-tokens($tokens) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
   @if ($tokens != ()) {
     @include token-utils.create-token-values(
-        tokens-mat-table.$prefix, map.get($tokens, tokens-mat-table.$prefix));
+      tokens-mat-table.$prefix,
+      map.get($tokens, tokens-mat-table.$prefix)
+    );
   }
 }

package/tabs/_tabs-theme.scss

@@ -15,19 +15,24 @@
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
         tokens-mdc-secondary-navigation-tab.$prefix,
-        tokens-mdc-secondary-navigation-tab.get-unthemable-tokens());
+        tokens-mdc-secondary-navigation-tab.get-unthemable-tokens()
+      );
       @include token-utils.create-token-values(
-        tokens-mdc-tab-indicator.$prefix, tokens-mdc-tab-indicator.get-unthemable-tokens());
+        tokens-mdc-tab-indicator.$prefix,
+        tokens-mdc-tab-indicator.get-unthemable-tokens()
+      );
       @include token-utils.create-token-values(
-        tokens-mat-tab-header.$prefix, tokens-mat-tab-header.get-unthemable-tokens());
+        tokens-mat-tab-header.$prefix,
+        tokens-mat-tab-header.get-unthemable-tokens()
+      );
       @include token-utils.create-token-values(
         tokens-mat-tab-header-with-background.$prefix,
-        tokens-mat-tab-header-with-background.get-unthemable-tokens());
+        tokens-mat-tab-header-with-background.get-unthemable-tokens()
+      );
     }
   }
 }
@@ -40,9 +45,9 @@
 @mixin color($theme, $options...) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);
-  }
-  @else {
-    .mat-mdc-tab-group, .mat-mdc-tab-nav-bar {
+  } @else {
+    .mat-mdc-tab-group,
+    .mat-mdc-tab-nav-bar {
       @include _palette-styles($theme, primary);
 
       &.mat-accent {
@@ -69,8 +74,10 @@
 }
 
 @mixin _background-styles($theme, $palette-name) {
-  @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,
-    tokens-mat-tab-header-with-background.get-color-tokens($theme, $palette-name));
+  @include token-utils.create-token-values(
+    tokens-mat-tab-header-with-background.$prefix,
+    tokens-mat-tab-header-with-background.get-color-tokens($theme, $palette-name)
+  );
 }
 
 @mixin _palette-styles($theme, $palette-name) {
@@ -80,9 +87,12 @@
   );
   @include token-utils.create-token-values(
     tokens-mdc-tab-indicator.$prefix,
-    tokens-mdc-tab-indicator.get-color-tokens($theme, $palette-name));
-  @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,
-   tokens-mat-tab-header.get-color-tokens($theme, $palette-name));
+    tokens-mdc-tab-indicator.get-color-tokens($theme, $palette-name)
+  );
+  @include token-utils.create-token-values(
+    tokens-mat-tab-header.$prefix,
+    tokens-mat-tab-header.get-color-tokens($theme, $palette-name)
+  );
 }
 
 /// Outputs typography theme styles for the mat-tab.
@@ -90,18 +100,24 @@
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
-  }
-  @else {
+  } @else {
     .mat-mdc-tab-header {
       @include token-utils.create-token-values(
         tokens-mdc-secondary-navigation-tab.$prefix,
-        tokens-mdc-secondary-navigation-tab.get-typography-tokens($theme));
+        tokens-mdc-secondary-navigation-tab.get-typography-tokens($theme)
+      );
+      @include token-utils.create-token-values(
+        tokens-mdc-tab-indicator.$prefix,
+        tokens-mdc-tab-indicator.get-typography-tokens($theme)
+      );
+      @include token-utils.create-token-values(
+        tokens-mat-tab-header.$prefix,
+        tokens-mat-tab-header.get-typography-tokens($theme)
+      );
       @include token-utils.create-token-values(
-        tokens-mdc-tab-indicator.$prefix, tokens-mdc-tab-indicator.get-typography-tokens($theme));
-      @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,
-        tokens-mat-tab-header.get-typography-tokens($theme));
-      @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,
-        tokens-mat-tab-header-with-background.get-typography-tokens($theme));
+        tokens-mat-tab-header-with-background.$prefix,
+        tokens-mat-tab-header-with-background.get-typography-tokens($theme)
+      );
     }
   }
 }
@@ -111,18 +127,24 @@
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
-  }
-  @else {
+  } @else {
     .mat-mdc-tab-header {
       @include token-utils.create-token-values(
         tokens-mdc-secondary-navigation-tab.$prefix,
-        tokens-mdc-secondary-navigation-tab.get-density-tokens($theme));
+        tokens-mdc-secondary-navigation-tab.get-density-tokens($theme)
+      );
+      @include token-utils.create-token-values(
+        tokens-mdc-tab-indicator.$prefix,
+        tokens-mdc-tab-indicator.get-density-tokens($theme)
+      );
       @include token-utils.create-token-values(
-        tokens-mdc-tab-indicator.$prefix, tokens-mdc-tab-indicator.get-density-tokens($theme));
-      @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,
-        tokens-mat-tab-header.get-density-tokens($theme));
-      @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,
-        tokens-mat-tab-header-with-background.get-density-tokens($theme));
+        tokens-mat-tab-header.$prefix,
+        tokens-mat-tab-header.get-density-tokens($theme)
+      );
+      @include token-utils.create-token-values(
+        tokens-mat-tab-header-with-background.$prefix,
+        tokens-mat-tab-header-with-background.get-density-tokens($theme)
+      );
     }
   }
 }
@@ -137,13 +159,22 @@
 
   @include token-utils.batch-create-token-values(
     $tokens,
-    (prefix: tokens-mdc-secondary-navigation-tab.$prefix, tokens: $tab-tokens),
-    (prefix: tokens-mdc-tab-indicator.$prefix, tokens: $tab-indicator-tokens),
-    (prefix: tokens-mat-tab-header.$prefix, tokens: $tab-header-tokens),
     (
-      prefix: tokens-mat-tab-header-with-background.$prefix,
-      tokens: $tab-header-with-background-tokens,
+      namespace: tokens-mdc-secondary-navigation-tab.$prefix,
+      tokens: $tab-tokens,
+    ),
+    (
+      namespace: tokens-mdc-tab-indicator.$prefix,
+      tokens: $tab-indicator-tokens,
     ),
+    (
+      namespace: tokens-mat-tab-header.$prefix,
+      tokens: $tab-header-tokens,
+    ),
+    (
+      namespace: tokens-mat-tab-header-with-background.$prefix,
+      tokens: $tab-header-with-background-tokens,
+    )
   );
 }
 
@@ -156,8 +187,7 @@
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-tabs') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -174,18 +204,31 @@
 
 @mixin _theme-from-tokens($tokens, $options...) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
   $mdc-tab-indicator-tokens: token-utils.get-tokens-for(
-      $tokens, tokens-mdc-tab-indicator.$prefix, $options...);
+    $tokens,
+    tokens-mdc-tab-indicator.$prefix,
+    $options...
+  );
   $mat-tab-header-tokens: token-utils.get-tokens-for(
-      $tokens, tokens-mat-tab-header.$prefix, $options...);
+    $tokens,
+    tokens-mat-tab-header.$prefix,
+    $options...
+  );
   // Don't pass $options here, because the mdc-tab doesn't have color variants,
   // only the mdc-tab-indicator and mat-tab-header do.
-  $mdc-secondary-navigation-tab-tokens:
-    token-utils.get-tokens-for($tokens, tokens-mdc-secondary-navigation-tab.$prefix);
-  @include token-utils.create-token-values(tokens-mdc-secondary-navigation-tab.$prefix,
-    $mdc-secondary-navigation-tab-tokens);
-  @include token-utils.create-token-values(tokens-mdc-tab-indicator.$prefix,
-    $mdc-tab-indicator-tokens);
+  $mdc-secondary-navigation-tab-tokens: token-utils.get-tokens-for(
+    $tokens,
+    tokens-mdc-secondary-navigation-tab.$prefix
+  );
+  @include token-utils.create-token-values(
+    tokens-mdc-secondary-navigation-tab.$prefix,
+    $mdc-secondary-navigation-tab-tokens
+  );
+  @include token-utils.create-token-values(
+    tokens-mdc-tab-indicator.$prefix,
+    $mdc-tab-indicator-tokens
+  );
   @include token-utils.create-token-values(tokens-mat-tab-header.$prefix, $mat-tab-header-tokens);
 }

package/tabs/index.d.ts

@@ -91,7 +91,7 @@ declare abstract class InkBarItem implements OnInit, OnDestroy {
      */
     private _appendInkBarElement;
     static ɵfac: i0.ɵɵFactoryDeclaration<InkBarItem, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<InkBarItem, never, never, { "fitInkBarToContent": { "alias": "fitInkBarToContent"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<InkBarItem, never, never, { "fitInkBarToContent": { "alias": "fitInkBarToContent"; "required": false; }; }, {}, never, never, true, never>;
     static ngAcceptInputType_fitInkBarToContent: unknown;
 }
 
@@ -341,7 +341,7 @@ export declare abstract class MatPaginatedTabHeader implements AfterContentCheck
      */
     private _scrollTo;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatPaginatedTabHeader, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatPaginatedTabHeader, never, never, { "disablePagination": { "alias": "disablePagination"; "required": false; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; }, { "selectFocusedIndex": "selectFocusedIndex"; "indexFocused": "indexFocused"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatPaginatedTabHeader, never, never, { "disablePagination": { "alias": "disablePagination"; "required": false; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; }, { "selectFocusedIndex": "selectFocusedIndex"; "indexFocused": "indexFocused"; }, never, never, true, never>;
     static ngAcceptInputType_disablePagination: unknown;
     static ngAcceptInputType_selectedIndex: unknown;
 }

package/timepicker/_timepicker-theme.scss

@@ -0,0 +1,120 @@
+@use 'sass:map';
+@use '../core/theming/theming';
+@use '../core/theming/inspection';
+@use '../core/theming/validation';
+@use '../core/typography/typography';
+@use '../core/style/sass-utils';
+@use '../core/tokens/m2/mat/timepicker' as tokens-mat-timepicker;
+@use '../core/tokens/token-utils';
+
+/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)
+/// for the mat-timepicker.
+/// @param {Map} $theme The theme to generate base styles for.
+@mixin base($theme) {
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
+  } @else {
+    @include sass-utils.current-selector-or-root() {
+      @include token-utils.create-token-values(
+        tokens-mat-timepicker.$prefix,
+        tokens-mat-timepicker.get-unthemable-tokens()
+      );
+    }
+  }
+}
+
+/// Outputs color theme styles for the mat-timepicker.
+/// @param {Map} $theme The theme to generate color styles for.
+/// @param {ArgList} Additional optional arguments (only supported for M3 themes):
+///   $color-variant: The color variant to use for the main selection: primary, secondary, tertiary,
+///      or error (If not specified, default primary color will be used).
+@mixin color($theme, $options...) {
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);
+  } @else {
+    @include sass-utils.current-selector-or-root() {
+      @include token-utils.create-token-values(
+        tokens-mat-timepicker.$prefix,
+        tokens-mat-timepicker.get-color-tokens($theme)
+      );
+    }
+  }
+}
+
+/// Outputs typography theme styles for the mat-timepicker.
+/// @param {Map} $theme The theme to generate typography styles for.
+@mixin typography($theme) {
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
+  } @else {
+    @include sass-utils.current-selector-or-root() {
+      @include token-utils.create-token-values(
+        tokens-mat-timepicker.$prefix,
+        tokens-mat-timepicker.get-typography-tokens($theme)
+      );
+    }
+  }
+}
+
+/// Outputs density theme styles for the mat-timepicker.
+/// @param {Map} $theme The theme to generate density styles for.
+@mixin density($theme) {
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
+  } @else {
+    @include sass-utils.current-selector-or-root() {
+      @include token-utils.create-token-values(
+        tokens-mat-timepicker.$prefix,
+        tokens-mat-timepicker.get-density-tokens($theme)
+      );
+    }
+  }
+}
+
+/// Outputs the CSS variable values for the given tokens.
+/// @param {Map} $tokens The token values to emit.
+@mixin overrides($tokens: ()) {
+  @include token-utils.batch-create-token-values(
+    $tokens,
+    (
+      namespace: tokens-mat-timepicker.$prefix,
+      tokens: tokens-mat-timepicker.get-token-slots(),
+    )
+  );
+}
+
+/// Outputs all (base, color, typography, and density) theme styles for the mat-timepicker.
+/// @param {Map} $theme The theme to generate styles for.
+/// @param {ArgList} Additional optional arguments (only supported for M3 themes):
+///   $color-variant: The color variant to use for the main selection: primary, secondary, tertiary,
+///      or error (If not specified, default primary color will be used).
+@mixin theme($theme) {
+  @include theming.private-check-duplicate-theme-styles($theme, 'mat-timepicker') {
+    @if inspection.get-theme-version($theme) == 1 {
+      @include _theme-from-tokens(inspection.get-theme-tokens($theme));
+    } @else {
+      @include base($theme);
+      @if inspection.theme-has($theme, color) {
+        @include color($theme);
+      }
+      @if inspection.theme-has($theme, density) {
+        @include density($theme);
+      }
+      @if inspection.theme-has($theme, typography) {
+        @include typography($theme);
+      }
+    }
+  }
+}
+
+@mixin _theme-from-tokens($tokens) {
+  @include validation.selector-defined(
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
+  @if ($tokens != ()) {
+    @include token-utils.create-token-values(
+      tokens-mat-timepicker.$prefix,
+      map.get($tokens, tokens-mat-timepicker.$prefix)
+    );
+  }
+}