@angular/material 17.1.0-next.0 → 17.1.0-next.1

package/button/_icon-button-theme.scss

@@ -1,9 +1,9 @@
+@use 'sass:map';
 @use 'sass:math';
 @use '@material/density/functions' as mdc-density-functions;
 @use '@material/icon-button/icon-button-theme' as mdc-icon-button-theme;
 @use '../core/tokens/m2/mdc/icon-button' as tokens-mdc-icon-button;
 @use '../core/tokens/m2/mat/icon-button' as tokens-mat-icon-button;
-
 @use '../core/style/sass-utils';
 @use './button-base';
 @use '../core/tokens/token-utils';
@@ -12,9 +12,14 @@
 
 
 @mixin base($theme) {
-  // Add default values for tokens not related to color, typography, or density.
-  @include sass-utils.current-selector-or-root() {
-    @include mdc-icon-button-theme.theme(tokens-mdc-icon-button.get-unthemable-tokens());
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
+  }
+  @else {
+    // Add default values for tokens not related to color, typography, or density.
+    @include sass-utils.current-selector-or-root() {
+      @include mdc-icon-button-theme.theme(tokens-mdc-icon-button.get-unthemable-tokens());
+    }
   }
 }
 
@@ -34,74 +39,102 @@
 }
 
 @mixin color($theme) {
-  .mat-mdc-icon-button {
-    @include _icon-button-variant($theme, null);
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));
+  }
+  @else {
+    .mat-mdc-icon-button {
+      @include _icon-button-variant($theme, null);
 
-    &.mat-primary {
-      @include _icon-button-variant($theme, primary);
-    }
+      &.mat-primary {
+        @include _icon-button-variant($theme, primary);
+      }
 
-    &.mat-accent {
-      @include _icon-button-variant($theme, accent);
-    }
+      &.mat-accent {
+        @include _icon-button-variant($theme, accent);
+      }
 
-    &.mat-warn {
-      @include _icon-button-variant($theme, warn);
+      &.mat-warn {
+        @include _icon-button-variant($theme, warn);
+      }
     }
   }
 }
 
-@mixin typography($theme) {}
+@mixin typography($theme) {
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
+  }
+  @else {}
+}
 
 @mixin density($theme) {
-  $icon-size: 24px;
-  $density-scale: inspection.get-theme-density($theme);
-  // Manually apply the expected density theming, and include the padding
-  // as it was applied before
-  $calculated-size: mdc-density-functions.prop-value(
-    $density-config: (
-      size: (
-        default: 48px,
-        maximum: 48px,
-        minimum: 28px,
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
+  }
+  @else {
+    $icon-size: 24px;
+    $density-scale: inspection.get-theme-density($theme);
+    // Manually apply the expected density theming, and include the padding
+    // as it was applied before
+    $calculated-size: mdc-density-functions.prop-value(
+      $density-config: (
+        size: (
+          default: 48px,
+          maximum: 48px,
+          minimum: 28px,
+        ),
       ),
-    ),
-    $density-scale: $density-scale,
-    $property-name: size,
-  );
-
-  // Use `mat-mdc-button-base` to increase the specificity over the button's structural styles.
-  .mat-mdc-icon-button.mat-mdc-button-base {
-    // Match the styles that used to be present. This is necessary for backwards
-    // compat to match the previous implementations selector count (two classes).
-    @include mdc-icon-button-theme.theme((
-      state-layer-size: $calculated-size,
-    ));
-
-    // TODO: Switch calculated-size to "var(--mdc-icon-button-state-layer-size)"
-    // Currently fails validation because the variable is "undefined"
-    // in the sass stack.
-    // TODO: Switch icon-size to "var(--mdc-icon-button-icon-size)". Currently
-    // fails validation because the variable is "undefined" in the sass stack.
-    width: var(--mdc-icon-button-state-layer-size);
-    height: var(--mdc-icon-button-state-layer-size);
-    padding: math.div($calculated-size - $icon-size, 2);
-
-    @include button-base.mat-private-button-touch-target-density($density-scale);
+      $density-scale: $density-scale,
+      $property-name: size,
+    );
+
+    // Use `mat-mdc-button-base` to increase the specificity over the button's structural styles.
+    .mat-mdc-icon-button.mat-mdc-button-base {
+      // Match the styles that used to be present. This is necessary for backwards
+      // compat to match the previous implementations selector count (two classes).
+      @include mdc-icon-button-theme.theme((
+        state-layer-size: $calculated-size,
+      ));
+
+      // TODO: Switch calculated-size to "var(--mdc-icon-button-state-layer-size)"
+      // Currently fails validation because the variable is "undefined"
+      // in the sass stack.
+      // TODO: Switch icon-size to "var(--mdc-icon-button-icon-size)". Currently
+      // fails validation because the variable is "undefined" in the sass stack.
+      width: var(--mdc-icon-button-state-layer-size);
+      height: var(--mdc-icon-button-state-layer-size);
+      padding: math.div($calculated-size - $icon-size, 2);
+
+      @include button-base.mat-private-button-touch-target-density($density-scale);
+    }
   }
 }
 
 @mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-icon-button') {
-    @include base($theme);
-    @if inspection.theme-has($theme, color) {
-      @include color($theme);
+    @if inspection.get-theme-version($theme) == 1 {
+      @include _theme-from-tokens(inspection.get-theme-tokens($theme));
     }
-    @if inspection.theme-has($theme, density) {
-      @include density($theme);
-    }
-    @if inspection.theme-has($theme, typography) {
-      @include typography($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) {
+  @if ($tokens != ()) {
+    @include mdc-icon-button-theme.theme(map.get($tokens, tokens-mdc-icon-button.$prefix));
+    @include token-utils.create-token-values(
+        tokens-mat-icon-button.$prefix, map.get($tokens, tokens-mat-icon-button.$prefix));
+  }
+}

package/button/index.d.ts

@@ -2,7 +2,7 @@ import { AfterViewInit } from '@angular/core';
 import { ElementRef } from '@angular/core';
 import { FocusOrigin } from '@angular/cdk/a11y';
 import * as i0 from '@angular/core';
-import * as i4 from '@angular/material/core';
+import * as i1 from '@angular/material/core';
 import { InjectionToken } from '@angular/core';
 import { MatRipple } from '@angular/material/core';
 import { MatRippleLoader } from '@angular/material/core';
@@ -12,21 +12,21 @@ import { OnInit } from '@angular/core';
 import { Platform } from '@angular/cdk/platform';
 import { ThemePalette } from '@angular/material/core';
 
-declare namespace i1 {
+declare namespace i2 {
     export {
         MatButton,
         MatAnchor
     }
 }
 
-declare namespace i2 {
+declare namespace i3 {
     export {
         MatIconButton,
         MatIconAnchor
     }
 }
 
-declare namespace i3 {
+declare namespace i4 {
     export {
         MAT_FAB_DEFAULT_OPTIONS_FACTORY,
         MatFabDefaultOptions,
@@ -57,7 +57,7 @@ export declare function MAT_FAB_DEFAULT_OPTIONS_FACTORY(): MatFabDefaultOptions;
 export declare class MatAnchor extends MatAnchorBase {
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatAnchor, [null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatAnchor, "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", ["matButton", "matAnchor"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatAnchor, "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", ["matButton", "matAnchor"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
 }
 
 /**
@@ -86,7 +86,7 @@ declare class MatAnchorBase extends MatButtonBase implements OnInit, OnDestroy {
 export declare class MatButton extends MatButtonBase {
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatButton, [null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatButton, "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", ["matButton"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatButton, "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", ["matButton"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
 }
 
 /** Base class for all buttons.  */
@@ -133,7 +133,7 @@ declare class MatButtonBase implements AfterViewInit, OnDestroy {
 
 export declare class MatButtonModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatButtonModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MatButtonModule, [typeof i1.MatAnchor, typeof i1.MatButton, typeof i2.MatIconAnchor, typeof i3.MatMiniFabAnchor, typeof i3.MatMiniFabButton, typeof i2.MatIconButton, typeof i3.MatFabAnchor, typeof i3.MatFabButton], [typeof i4.MatCommonModule, typeof i4.MatRippleModule], [typeof i1.MatAnchor, typeof i1.MatButton, typeof i2.MatIconAnchor, typeof i2.MatIconButton, typeof i3.MatMiniFabAnchor, typeof i3.MatMiniFabButton, typeof i3.MatFabAnchor, typeof i3.MatFabButton, typeof i4.MatCommonModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MatButtonModule, never, [typeof i1.MatCommonModule, typeof i1.MatRippleModule, typeof i2.MatAnchor, typeof i2.MatButton, typeof i3.MatIconAnchor, typeof i4.MatMiniFabAnchor, typeof i4.MatMiniFabButton, typeof i3.MatIconButton, typeof i4.MatFabAnchor, typeof i4.MatFabButton], [typeof i2.MatAnchor, typeof i2.MatButton, typeof i3.MatIconAnchor, typeof i3.MatIconButton, typeof i4.MatMiniFabAnchor, typeof i4.MatMiniFabButton, typeof i4.MatFabAnchor, typeof i4.MatFabButton, typeof i1.MatCommonModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MatButtonModule>;
 }
 
@@ -150,7 +150,7 @@ export declare class MatFabAnchor extends MatAnchor {
     extended: boolean;
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string, _options?: MatFabDefaultOptions | undefined);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatFabAnchor, [null, null, null, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatFabAnchor, "a[mat-fab]", ["matButton", "matAnchor"], { "extended": { "alias": "extended"; "required": false; }; }, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatFabAnchor, "a[mat-fab]", ["matButton", "matAnchor"], { "extended": { "alias": "extended"; "required": false; }; }, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
     static ngAcceptInputType_extended: unknown;
 }
 
@@ -167,7 +167,7 @@ export declare class MatFabButton extends MatButtonBase {
     extended: boolean;
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string, _options?: MatFabDefaultOptions | undefined);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatFabButton, [null, null, null, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatFabButton, "button[mat-fab]", ["matButton"], { "extended": { "alias": "extended"; "required": false; }; }, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatFabButton, "button[mat-fab]", ["matButton"], { "extended": { "alias": "extended"; "required": false; }; }, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
     static ngAcceptInputType_extended: unknown;
 }
 
@@ -184,7 +184,7 @@ export declare interface MatFabDefaultOptions {
 export declare class MatIconAnchor extends MatAnchorBase {
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatIconAnchor, [null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatIconAnchor, "a[mat-icon-button]", ["matButton", "matAnchor"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatIconAnchor, "a[mat-icon-button]", ["matButton", "matAnchor"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
 }
 
 /**
@@ -195,7 +195,7 @@ export declare class MatIconAnchor extends MatAnchorBase {
 export declare class MatIconButton extends MatButtonBase {
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatIconButton, [null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatIconButton, "button[mat-icon-button]", ["matButton"], {}, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatIconButton, "button[mat-icon-button]", ["matButton"], {}, {}, never, ["*"], true, never>;
 }
 
 /**
@@ -208,7 +208,7 @@ export declare class MatMiniFabAnchor extends MatAnchor {
     _isFab: boolean;
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string, _options?: MatFabDefaultOptions | undefined);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatMiniFabAnchor, [null, null, null, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatMiniFabAnchor, "a[mat-mini-fab]", ["matButton", "matAnchor"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatMiniFabAnchor, "a[mat-mini-fab]", ["matButton", "matAnchor"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
 }
 
 /**
@@ -221,7 +221,7 @@ export declare class MatMiniFabButton extends MatButtonBase {
     _isFab: boolean;
     constructor(elementRef: ElementRef, platform: Platform, ngZone: NgZone, animationMode?: string, _options?: MatFabDefaultOptions | undefined);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatMiniFabButton, [null, null, null, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatMiniFabButton, "button[mat-mini-fab]", ["matButton"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatMiniFabButton, "button[mat-mini-fab]", ["matButton"], {}, {}, never, [".material-icons:not([iconPositionEnd]), mat-icon:not([iconPositionEnd]), [matButtonIcon]:not([iconPositionEnd])", "*", ".material-icons[iconPositionEnd], mat-icon[iconPositionEnd], [matButtonIcon][iconPositionEnd]"], true, never>;
 }
 
 export { }

package/button-toggle/_button-toggle-theme.scss

@@ -1,3 +1,4 @@
+@use 'sass:map';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
 @use '../core/typography/typography';
@@ -7,56 +8,89 @@
 @use '../core/style/sass-utils';
 
 @mixin base($theme) {
-  @include sass-utils.current-selector-or-root() {
-    @include token-utils.create-token-values(
-        tokens-mat-legacy-button-toggle.$prefix,
-        tokens-mat-legacy-button-toggle.get-unthemable-tokens()
-    );
-    @include token-utils.create-token-values(
-        tokens-mat-standard-button-toggle.$prefix,
-        tokens-mat-standard-button-toggle.get-unthemable-tokens()
-    );
+  @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-legacy-button-toggle.$prefix,
+          tokens-mat-legacy-button-toggle.get-unthemable-tokens()
+      );
+      @include token-utils.create-token-values(
+          tokens-mat-standard-button-toggle.$prefix,
+          tokens-mat-standard-button-toggle.get-unthemable-tokens()
+      );
+    }
   }
 }
 
 @mixin color($theme) {
-  @include sass-utils.current-selector-or-root() {
-    @include token-utils.create-token-values(tokens-mat-legacy-button-toggle.$prefix,
-      tokens-mat-legacy-button-toggle.get-color-tokens($theme));
-    @include token-utils.create-token-values(tokens-mat-standard-button-toggle.$prefix,
-      tokens-mat-standard-button-toggle.get-color-tokens($theme));
+  @if inspection.get-theme-version($theme) == 1 {
+    @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));
+  }
+  @else {
+    @include sass-utils.current-selector-or-root() {
+      @include token-utils.create-token-values(tokens-mat-legacy-button-toggle.$prefix,
+        tokens-mat-legacy-button-toggle.get-color-tokens($theme));
+      @include token-utils.create-token-values(tokens-mat-standard-button-toggle.$prefix,
+        tokens-mat-standard-button-toggle.get-color-tokens($theme));
+    }
   }
 }
 
 @mixin typography($theme) {
-  @include sass-utils.current-selector-or-root() {
-    @include token-utils.create-token-values(tokens-mat-legacy-button-toggle.$prefix,
-      tokens-mat-legacy-button-toggle.get-typography-tokens($theme));
-    @include token-utils.create-token-values(tokens-mat-standard-button-toggle.$prefix,
-      tokens-mat-standard-button-toggle.get-typography-tokens($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-legacy-button-toggle.$prefix,
+        tokens-mat-legacy-button-toggle.get-typography-tokens($theme));
+      @include token-utils.create-token-values(tokens-mat-standard-button-toggle.$prefix,
+        tokens-mat-standard-button-toggle.get-typography-tokens($theme));
+    }
   }
 }
 
 @mixin density($theme) {
-  @include sass-utils.current-selector-or-root() {
-    @include token-utils.create-token-values(tokens-mat-legacy-button-toggle.$prefix,
-      tokens-mat-legacy-button-toggle.get-density-tokens($theme));
-    @include token-utils.create-token-values(tokens-mat-standard-button-toggle.$prefix,
-      tokens-mat-standard-button-toggle.get-density-tokens($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-legacy-button-toggle.$prefix,
+        tokens-mat-legacy-button-toggle.get-density-tokens($theme));
+      @include token-utils.create-token-values(tokens-mat-standard-button-toggle.$prefix,
+        tokens-mat-standard-button-toggle.get-density-tokens($theme));
+    }
   }
 }
 
 @mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-button-toggle') {
-    @include base($theme);
-    @if inspection.theme-has($theme, color) {
-      @include color($theme);
+    @if inspection.get-theme-version($theme) == 1 {
+      @include _theme-from-tokens(inspection.get-theme-tokens($theme));
     }
-    @if inspection.theme-has($theme, density) {
-      @include density($theme);
-    }
-    @if inspection.theme-has($theme, typography) {
-      @include typography($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) {
+  @if ($tokens != ()) {
+    @include token-utils.create-token-values(
+        tokens-mat-standard-button-toggle.$prefix,
+        map.get($tokens, tokens-mat-standard-button-toggle.$prefix));
+  }
+}

package/button-toggle/index.d.ts

@@ -6,13 +6,13 @@ import { ElementRef } from '@angular/core';
 import { EventEmitter } from '@angular/core';
 import { FocusMonitor } from '@angular/cdk/a11y';
 import * as i0 from '@angular/core';
-import * as i2 from '@angular/material/core';
+import * as i1 from '@angular/material/core';
 import { InjectionToken } from '@angular/core';
 import { OnDestroy } from '@angular/core';
 import { OnInit } from '@angular/core';
 import { QueryList } from '@angular/core';
 
-declare namespace i1 {
+declare namespace i2 {
     export {
         ToggleType,
         MatButtonToggleAppearance,
@@ -109,7 +109,7 @@ export declare class MatButtonToggle implements OnInit, AfterViewInit, OnDestroy
     /** Whether the toggle is in single selection mode. */
     private _isSingleSelector;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatButtonToggle, [{ optional: true; }, null, null, null, { attribute: "tabindex"; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatButtonToggle, "mat-button-toggle", ["matButtonToggle"], { "ariaLabel": { "alias": "aria-label"; "required": false; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "value": { "alias": "value"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "change": "change"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatButtonToggle, "mat-button-toggle", ["matButtonToggle"], { "ariaLabel": { "alias": "aria-label"; "required": false; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "value": { "alias": "value"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "change": "change"; }, never, ["*"], true, never>;
     static ngAcceptInputType_disableRipple: unknown;
     static ngAcceptInputType_checked: unknown;
     static ngAcceptInputType_disabled: unknown;
@@ -228,7 +228,7 @@ export declare class MatButtonToggleGroup implements ControlValueAccessor, OnIni
     /** Marks all of the child button toggles to be checked. */
     private _markButtonsForCheck;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatButtonToggleGroup, [null, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatButtonToggleGroup, "mat-button-toggle-group", ["matButtonToggleGroup"], { "appearance": { "alias": "appearance"; "required": false; }; "name": { "alias": "name"; "required": false; }; "vertical": { "alias": "vertical"; "required": false; }; "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; "change": "change"; }, ["_buttonToggles"], never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatButtonToggleGroup, "mat-button-toggle-group", ["matButtonToggleGroup"], { "appearance": { "alias": "appearance"; "required": false; }; "name": { "alias": "name"; "required": false; }; "vertical": { "alias": "vertical"; "required": false; }; "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; "change": "change"; }, ["_buttonToggles"], never, true, never>;
     static ngAcceptInputType_vertical: unknown;
     static ngAcceptInputType_multiple: unknown;
     static ngAcceptInputType_disabled: unknown;
@@ -236,7 +236,7 @@ export declare class MatButtonToggleGroup implements ControlValueAccessor, OnIni
 
 export declare class MatButtonToggleModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatButtonToggleModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MatButtonToggleModule, [typeof i1.MatButtonToggleGroup, typeof i1.MatButtonToggle], [typeof i2.MatCommonModule, typeof i2.MatRippleModule], [typeof i2.MatCommonModule, typeof i1.MatButtonToggleGroup, typeof i1.MatButtonToggle]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MatButtonToggleModule, never, [typeof i1.MatCommonModule, typeof i1.MatRippleModule, typeof i2.MatButtonToggleGroup, typeof i2.MatButtonToggle], [typeof i1.MatCommonModule, typeof i2.MatButtonToggleGroup, typeof i2.MatButtonToggle]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MatButtonToggleModule>;
 }
 

package/card/index.d.ts

@@ -1,9 +1,9 @@
 import * as i0 from '@angular/core';
-import * as i2 from '@angular/material/core';
-import * as i3 from '@angular/common';
+import * as i1 from '@angular/material/core';
+import * as i2 from '@angular/common';
 import { InjectionToken } from '@angular/core';
 
-declare namespace i1 {
+declare namespace i3 {
     export {
         MatCardAppearance,
         MatCardConfig,
@@ -38,7 +38,7 @@ export declare class MatCard {
     appearance: MatCardAppearance;
     constructor(config?: MatCardConfig);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCard, [{ optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatCard, "mat-card", ["matCard"], { "appearance": { "alias": "appearance"; "required": false; }; }, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatCard, "mat-card", ["matCard"], { "appearance": { "alias": "appearance"; "required": false; }; }, {}, never, ["*"], true, never>;
 }
 
 /**
@@ -52,7 +52,7 @@ export declare class MatCardActions {
     /** Position of the actions inside the card. */
     align: 'start' | 'end';
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardActions, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardActions, "mat-card-actions", ["matCardActions"], { "align": { "alias": "align"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardActions, "mat-card-actions", ["matCardActions"], { "align": { "alias": "align"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 export declare type MatCardAppearance = 'outlined' | 'raised';
@@ -68,7 +68,7 @@ export declare type MatCardAppearance = 'outlined' | 'raised';
  */
 export declare class MatCardAvatar {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardAvatar, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardAvatar, "[mat-card-avatar], [matCardAvatar]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardAvatar, "[mat-card-avatar], [matCardAvatar]", never, {}, {}, never, never, true, never>;
 }
 
 /** Object that can be used to configure the default options for the card module. */
@@ -86,7 +86,7 @@ export declare interface MatCardConfig {
  */
 export declare class MatCardContent {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardContent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardContent, "mat-card-content", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardContent, "mat-card-content", never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -98,7 +98,7 @@ export declare class MatCardContent {
  */
 export declare class MatCardFooter {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardFooter, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardFooter, "mat-card-footer", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardFooter, "mat-card-footer", never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -111,7 +111,7 @@ export declare class MatCardFooter {
  */
 export declare class MatCardHeader {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardHeader, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatCardHeader, "mat-card-header", never, {}, {}, never, ["[mat-card-avatar], [matCardAvatar]", "mat-card-title, mat-card-subtitle,\n      [mat-card-title], [mat-card-subtitle],\n      [matCardTitle], [matCardSubtitle]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatCardHeader, "mat-card-header", never, {}, {}, never, ["[mat-card-avatar], [matCardAvatar]", "mat-card-title, mat-card-subtitle,\n      [mat-card-title], [mat-card-subtitle],\n      [matCardTitle], [matCardSubtitle]", "*"], true, never>;
 }
 
 /**
@@ -125,31 +125,31 @@ export declare class MatCardHeader {
  */
 export declare class MatCardImage {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardImage, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardImage, "[mat-card-image], [matCardImage]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardImage, "[mat-card-image], [matCardImage]", never, {}, {}, never, never, true, never>;
 }
 
 /** Same as `MatCardImage`, but large. */
 export declare class MatCardLgImage {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardLgImage, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardLgImage, "[mat-card-lg-image], [matCardImageLarge]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardLgImage, "[mat-card-lg-image], [matCardImageLarge]", never, {}, {}, never, never, true, never>;
 }
 
 /** Same as `MatCardImage`, but medium. */
 export declare class MatCardMdImage {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardMdImage, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardMdImage, "[mat-card-md-image], [matCardImageMedium]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardMdImage, "[mat-card-md-image], [matCardImageMedium]", never, {}, {}, never, never, true, never>;
 }
 
 export declare class MatCardModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MatCardModule, [typeof i1.MatCard, typeof i1.MatCardActions, typeof i1.MatCardAvatar, typeof i1.MatCardContent, typeof i1.MatCardFooter, typeof i1.MatCardHeader, typeof i1.MatCardImage, typeof i1.MatCardLgImage, typeof i1.MatCardMdImage, typeof i1.MatCardSmImage, typeof i1.MatCardSubtitle, typeof i1.MatCardTitle, typeof i1.MatCardTitleGroup, typeof i1.MatCardXlImage], [typeof i2.MatCommonModule, typeof i3.CommonModule], [typeof i1.MatCard, typeof i1.MatCardActions, typeof i1.MatCardAvatar, typeof i1.MatCardContent, typeof i1.MatCardFooter, typeof i1.MatCardHeader, typeof i1.MatCardImage, typeof i1.MatCardLgImage, typeof i1.MatCardMdImage, typeof i1.MatCardSmImage, typeof i1.MatCardSubtitle, typeof i1.MatCardTitle, typeof i1.MatCardTitleGroup, typeof i1.MatCardXlImage, typeof i2.MatCommonModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MatCardModule, never, [typeof i1.MatCommonModule, typeof i2.CommonModule, typeof i3.MatCard, typeof i3.MatCardActions, typeof i3.MatCardAvatar, typeof i3.MatCardContent, typeof i3.MatCardFooter, typeof i3.MatCardHeader, typeof i3.MatCardImage, typeof i3.MatCardLgImage, typeof i3.MatCardMdImage, typeof i3.MatCardSmImage, typeof i3.MatCardSubtitle, typeof i3.MatCardTitle, typeof i3.MatCardTitleGroup, typeof i3.MatCardXlImage], [typeof i3.MatCard, typeof i3.MatCardActions, typeof i3.MatCardAvatar, typeof i3.MatCardContent, typeof i3.MatCardFooter, typeof i3.MatCardHeader, typeof i3.MatCardImage, typeof i3.MatCardLgImage, typeof i3.MatCardMdImage, typeof i3.MatCardSmImage, typeof i3.MatCardSubtitle, typeof i3.MatCardTitle, typeof i3.MatCardTitleGroup, typeof i3.MatCardXlImage, typeof i1.MatCommonModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MatCardModule>;
 }
 
 /** Same as `MatCardImage`, but small. */
 export declare class MatCardSmImage {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardSmImage, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardSmImage, "[mat-card-sm-image], [matCardImageSmall]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardSmImage, "[mat-card-sm-image], [matCardImageSmall]", never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -161,7 +161,7 @@ export declare class MatCardSmImage {
  */
 export declare class MatCardSubtitle {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardSubtitle, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardSubtitle, "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardSubtitle, "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]", never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -172,7 +172,7 @@ export declare class MatCardSubtitle {
  */
 export declare class MatCardTitle {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardTitle, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardTitle, "mat-card-title, [mat-card-title], [matCardTitle]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardTitle, "mat-card-title, [mat-card-title], [matCardTitle]", never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -182,13 +182,13 @@ export declare class MatCardTitle {
  */
 export declare class MatCardTitleGroup {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardTitleGroup, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatCardTitleGroup, "mat-card-title-group", never, {}, {}, never, ["mat-card-title, mat-card-subtitle,\n      [mat-card-title], [mat-card-subtitle],\n      [matCardTitle], [matCardSubtitle]", "[mat-card-image], [matCardImage],\n                    [mat-card-sm-image], [matCardImageSmall],\n                    [mat-card-md-image], [matCardImageMedium],\n                    [mat-card-lg-image], [matCardImageLarge],\n                    [mat-card-xl-image], [matCardImageXLarge]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatCardTitleGroup, "mat-card-title-group", never, {}, {}, never, ["mat-card-title, mat-card-subtitle,\n      [mat-card-title], [mat-card-subtitle],\n      [matCardTitle], [matCardSubtitle]", "[mat-card-image], [matCardImage],\n                    [mat-card-sm-image], [matCardImageSmall],\n                    [mat-card-md-image], [matCardImageMedium],\n                    [mat-card-lg-image], [matCardImageLarge],\n                    [mat-card-xl-image], [matCardImageXLarge]", "*"], true, never>;
 }
 
 /** Same as `MatCardImage`, but extra-large. */
 export declare class MatCardXlImage {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCardXlImage, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardXlImage, "[mat-card-xl-image], [matCardImageXLarge]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatCardXlImage, "[mat-card-xl-image], [matCardImageXLarge]", never, {}, {}, never, never, true, never>;
 }
 
 export { }