@angular/material 20.0.0-next.5 → 20.0.0-next.7

package/core/tokens/m2/_index.scss

@@ -1,159 +0,0 @@
-@use 'sass:map';
-@use 'sass:meta';
-@use '../../style/sass-utils';
-@use './mat/app' as tokens-mat-app;
-@use './mat/autocomplete' as tokens-mat-autocomplete;
-@use './mat/badge' as tokens-mat-badge;
-@use './mat/text-button' as tokens-mat-text-button;
-@use './mat/protected-button' as tokens-mat-protected-button;
-@use './mat/filled-button' as tokens-mat-filled-button;
-@use './mat/outlined-button' as tokens-mat-outlined-button;
-@use './mat/dialog' as tokens-mat-dialog;
-@use './mat/bottom-sheet' as tokens-mat-bottom-sheet;
-@use './mat/card' as tokens-mat-card;
-@use './mat/chip' as tokens-mat-chip;
-@use './mat/datepicker' as tokens-mat-datepicker;
-@use './mat/divider' as tokens-mat-divider;
-@use './mat/expansion' as tokens-mat-expansion;
-@use './mat/fab' as tokens-mat-fab;
-@use './mat/fab-small' as tokens-mat-fab-small;
-@use './mat/form-field' as tokens-mat-form-field;
-@use './mat/grid-list' as tokens-mat-grid-list;
-@use './mat/icon' as tokens-mat-icon;
-@use './mat/icon-button' as tokens-mat-icon-button;
-@use './mat/list' as tokens-mat-list;
-@use './mat/menu' as tokens-mat-menu;
-@use './mat/option' as tokens-mat-option;
-@use './mat/optgroup' as tokens-mat-optgroup;
-@use './mat/paginator' as tokens-mat-paginator;
-@use './mat/checkbox' as tokens-mat-checkbox;
-@use './mat/full-pseudo-checkbox' as tokens-mat-full-pseudo-checkbox;
-@use './mat/minimal-pseudo-checkbox' as tokens-mat-minimal-pseudo-checkbox;
-@use './mat/radio' as tokens-mat-radio;
-@use './mat/ripple' as tokens-mat-ripple;
-@use './mat/select' as tokens-mat-select;
-@use './mat/sidenav' as tokens-mat-sidenav;
-@use './mat/slider' as tokens-mat-slider;
-@use './mat/switch' as tokens-mat-switch;
-@use './mat/snack-bar' as tokens-mat-snack-bar;
-@use './mat/sort' as tokens-mat-sort;
-@use './mat/standard-button-toggle' as tokens-mat-button-toggle;
-@use './mat/stepper' as tokens-mat-stepper;
-@use './mat/tab-header' as tokens-mat-tab-header;
-@use './mat/tab-header-with-background' as tokens-mat-tab-header-with-background;
-@use './mat/table' as tokens-mat-table;
-@use './mat/toolbar' as tokens-mat-toolbar;
-@use './mat/tree' as tokens-mat-tree;
-@use './mat/timepicker' as tokens-mat-timepicker;
-@use './mat/tonal-button' as tokens-mat-tonal-button;
-@use './mat/circular-progress' as tokens-mat-circular-progress;
-@use './mat/elevated-card' as tokens-mat-elevated-card;
-@use './mat/extended-fab' as tokens-mat-extended-fab;
-@use './mat/filled-text-field' as tokens-mat-filled-text-field;
-@use './mat/linear-progress' as tokens-mat-linear-progress;
-@use './mat/outlined-card' as tokens-mat-outlined-card;
-@use './mat/outlined-text-field' as tokens-mat-outlined-text-field;
-@use './mat/plain-tooltip' as tokens-mat-plain-tooltip;
-@use './mat/secondary-navigation-tab' as tokens-mat-secondary-navigation-tab;
-@use './mat/tab-indicator' as tokens-mat-tab-indicator;
-@use '../../theming/inspection';
-
-/// Gets the tokens for the given theme, m2 tokens module, and theming system.
-/// @param {Map} $theme The Angular Material theme object to generate token values from.
-/// @param {String} $module The Sass module containing the token getter functions.
-/// @param {String} $system The theming system to get tokens for. Valid values are: unthemable,
-///     color, typography, density.
-/// @return {Map} The token map by calling the token getter for the given system in the given module
-///    with the given Angular Material theme. Token names are not fully-qualified.
-@function _get-tokens-for-module-and-system($theme, $module, $system) {
-  @if $system == unthemable {
-    @return meta.call(meta.get-function(get-#{$system}-tokens, $module: $module));
-  }
-  @if not inspection.theme-has($theme, $system) {
-    @return ();
-  }
-  @return meta.call(meta.get-function(get-#{$system}-tokens, $module: $module), $theme);
-}
-
-/// Gets the fully qualified tokens map for the given theme and m2 tokens module.
-/// @param {Map} $theme The Angular Material theme object to generate token values from.
-/// @param {String} $module The Sass module containing the token getter functions.
-/// @return {Map} The token map by calling the token getters in the given module with the given
-///     Angular Material theme. Token names are fully-qualified.
-@function _get-tokens-for-module($theme, $module) {
-  $tokens: sass-utils.deep-merge-all(
-    _get-tokens-for-module-and-system($theme, $module, unthemable),
-    _get-tokens-for-module-and-system($theme, $module, color),
-    _get-tokens-for-module-and-system($theme, $module, typography),
-    _get-tokens-for-module-and-system($theme, $module, density)
-  );
-  @return map.set((), map.get(meta.module-variables($module), prefix), $tokens);
-}
-
-/// Gets the full set of M2 tokens for the given theme object.
-/// @param {Map} $theme The Angular Material theme object to generate token values from.
-/// @return {Map} The token map for the given Angular Material theme. Returned format:
-///     (
-///       (fully, qualified, namespace): (
-///         token: value
-///       )
-///     )
-@function m2-tokens-from-theme($theme) {
-  @return sass-utils.deep-merge-all(
-    _get-tokens-for-module($theme, tokens-mat-app),
-    _get-tokens-for-module($theme, tokens-mat-autocomplete),
-    _get-tokens-for-module($theme, tokens-mat-badge),
-    _get-tokens-for-module($theme, tokens-mat-bottom-sheet),
-    _get-tokens-for-module($theme, tokens-mat-button-toggle),
-    _get-tokens-for-module($theme, tokens-mat-card),
-    _get-tokens-for-module($theme, tokens-mat-chip),
-    _get-tokens-for-module($theme, tokens-mat-datepicker),
-    _get-tokens-for-module($theme, tokens-mat-dialog),
-    _get-tokens-for-module($theme, tokens-mat-divider),
-    _get-tokens-for-module($theme, tokens-mat-expansion),
-    _get-tokens-for-module($theme, tokens-mat-fab),
-    _get-tokens-for-module($theme, tokens-mat-fab-small),
-    _get-tokens-for-module($theme, tokens-mat-filled-button),
-    _get-tokens-for-module($theme, tokens-mat-form-field),
-    _get-tokens-for-module($theme, tokens-mat-grid-list),
-    _get-tokens-for-module($theme, tokens-mat-icon-button),
-    _get-tokens-for-module($theme, tokens-mat-icon),
-    _get-tokens-for-module($theme, tokens-mat-menu),
-    _get-tokens-for-module($theme, tokens-mat-optgroup),
-    _get-tokens-for-module($theme, tokens-mat-option),
-    _get-tokens-for-module($theme, tokens-mat-outlined-button),
-    _get-tokens-for-module($theme, tokens-mat-paginator),
-    _get-tokens-for-module($theme, tokens-mat-checkbox),
-    _get-tokens-for-module($theme, tokens-mat-full-pseudo-checkbox),
-    _get-tokens-for-module($theme, tokens-mat-list),
-    _get-tokens-for-module($theme, tokens-mat-minimal-pseudo-checkbox),
-    _get-tokens-for-module($theme, tokens-mat-protected-button),
-    _get-tokens-for-module($theme, tokens-mat-radio),
-    _get-tokens-for-module($theme, tokens-mat-ripple),
-    _get-tokens-for-module($theme, tokens-mat-select),
-    _get-tokens-for-module($theme, tokens-mat-sidenav),
-    _get-tokens-for-module($theme, tokens-mat-slider),
-    _get-tokens-for-module($theme, tokens-mat-switch),
-    _get-tokens-for-module($theme, tokens-mat-snack-bar),
-    _get-tokens-for-module($theme, tokens-mat-sort),
-    _get-tokens-for-module($theme, tokens-mat-stepper),
-    _get-tokens-for-module($theme, tokens-mat-tab-header-with-background),
-    _get-tokens-for-module($theme, tokens-mat-tab-header),
-    _get-tokens-for-module($theme, tokens-mat-table),
-    _get-tokens-for-module($theme, tokens-mat-text-button),
-    _get-tokens-for-module($theme, tokens-mat-toolbar),
-    _get-tokens-for-module($theme, tokens-mat-tree),
-    _get-tokens-for-module($theme, tokens-mat-timepicker),
-    _get-tokens-for-module($theme, tokens-mat-tonal-button),
-    _get-tokens-for-module($theme, tokens-mat-circular-progress),
-    _get-tokens-for-module($theme, tokens-mat-elevated-card),
-    _get-tokens-for-module($theme, tokens-mat-extended-fab),
-    _get-tokens-for-module($theme, tokens-mat-filled-text-field),
-    _get-tokens-for-module($theme, tokens-mat-linear-progress),
-    _get-tokens-for-module($theme, tokens-mat-outlined-card),
-    _get-tokens-for-module($theme, tokens-mat-outlined-text-field),
-    _get-tokens-for-module($theme, tokens-mat-plain-tooltip),
-    _get-tokens-for-module($theme, tokens-mat-tab-indicator),
-    _get-tokens-for-module($theme, tokens-mat-secondary-navigation-tab),
-  );
-}

package/core/tokens/m2/mat/_elevated-card.scss

@@ -1,51 +0,0 @@
-@use '../../../theming/inspection';
-@use '../../../style/elevation';
-@use '../../../style/sass-utils';
-@use '../../token-definition';
-
-// The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, elevated-card);
-
-// Tokens that can't be configured through Angular Material's current theming API,
-// but may be in a future version of the theming API.
-//
-// Tokens that are available in MDC, but not used in Angular Material should be mapped to `null`.
-// `null` indicates that we are intentionally choosing not to emit a slot or value for the token in
-// our CSS.
-@function get-unthemable-tokens() {
-  @return (
-    container-shape: 4px,
-  );
-}
-
-// Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($theme) {
-  $elevation: inspection.get-theme-color($theme, foreground, elevation);
-
-  @return (
-    // The background color of the card.
-    container-color: inspection.get-theme-color($theme, background, card),
-    container-elevation: elevation.get-box-shadow(1),
-  );
-}
-
-// Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($theme) {
-  @return ();
-}
-
-// Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($theme) {
-  @return ();
-}
-
-// Combines the tokens generated by the above functions into a single map with placeholder values.
-// This is used to create token slots.
-@function get-token-slots() {
-  @return sass-utils.deep-merge-all(
-      get-unthemable-tokens(),
-      get-color-tokens(token-definition.$placeholder-color-config),
-      get-typography-tokens(token-definition.$placeholder-typography-config),
-      get-density-tokens(token-definition.$placeholder-density-config)
-  );
-}

package/core/tokens/m2/mat/_extended-fab.scss

@@ -1,53 +0,0 @@
-@use 'sass:map';
-@use '../../token-definition';
-@use '../../../style/elevation';
-@use '../../../theming/inspection';
-
-// The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, extended-fab);
-
-@function get-unthemable-tokens() {
-  @return (
-    container-height: 48px,
-    container-shape: 24px,
-    container-elevation-shadow: elevation.get-box-shadow(6),
-    focus-container-elevation-shadow: elevation.get-box-shadow(8),
-    hover-container-elevation-shadow: elevation.get-box-shadow(8),
-    pressed-container-elevation-shadow: elevation.get-box-shadow(12),
-  );
-}
-
-// Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($theme) {
-  @return ();
-}
-
-// Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($theme) {
-  @return (
-    label-text-font: inspection.get-theme-typography($theme, button, font-family),
-    label-text-size: inspection.get-theme-typography($theme, button, font-size),
-    label-text-tracking: inspection.get-theme-typography($theme, button, letter-spacing),
-    label-text-weight: inspection.get-theme-typography($theme, button, font-weight)
-  );
-}
-
-// Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($theme) {
-  @return ();
-}
-
-// Combines the tokens generated by the above functions into a single map with placeholder values.
-// This is used to create token slots.
-@function get-token-slots() {
-  @return map.merge(
-    get-unthemable-tokens(),
-    map.merge(
-      get-color-tokens(token-definition.$placeholder-color-config),
-      map.merge(
-        get-typography-tokens(token-definition.$placeholder-typography-config),
-        get-density-tokens(token-definition.$placeholder-density-config)
-      )
-    )
-  );
-}

package/core/tokens/m2/mat/_fab-small.scss

@@ -1,99 +0,0 @@
-@use 'sass:meta';
-@use '../../token-definition';
-@use '../../../theming/theming';
-@use '../../../theming/inspection';
-@use '../../../style/sass-utils';
-@use '../../../style/elevation';
-
-// The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, fab-small);
-
-// Tokens that can't be configured through Angular Material's current theming API,
-// but may be in a future version of the theming API.
-@function get-unthemable-tokens() {
-  @return (
-    container-shape: 50%,
-    container-elevation-shadow: elevation.get-box-shadow(6),
-    focus-container-elevation-shadow: elevation.get-box-shadow(8),
-    hover-container-elevation-shadow: elevation.get-box-shadow(8),
-    pressed-container-elevation-shadow: elevation.get-box-shadow(12),
-  );
-}
-
-// Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($theme) {
-  $is-dark: inspection.get-theme-type($theme) == dark;
-
-  @return (
-    container-color: inspection.get-theme-color($theme, background, card),
-    disabled-state-container-color:
-        inspection.get-theme-color($theme, background, disabled-button, 0.12),
-    disabled-state-foreground-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
-    disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
-    focus-state-layer-opacity: if($is-dark, 0.24, 0.12),
-    foreground-color: inspection.get-theme-color($theme, foreground, base),
-    hover-state-layer-opacity: if($is-dark, 0.08, 0.04),
-    pressed-state-layer-opacity: if($is-dark, 0.24, 0.12),
-    ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
-    state-layer-color: inspection.get-theme-color($theme, foreground, base),
-  );
-}
-
-// Generates the mapping for the properties that change based on the FAB palette color.
-@function private-get-color-palette-color-tokens($theme, $palette-name) {
-  // Ideally we would derive all values directly from the theme, but it causes a lot of regressions
-  // internally. For now we fall back to the old hardcoded behavior only for internal apps.
-  $foreground-color: null;
-  $state-layer-color: null;
-  $ripple-color: null;
-  $contrast-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
-
-  @if (token-definition.$private-is-internal-build or
-      meta.type-of($contrast-color) != 'color') {
-    $is-dark: inspection.get-theme-type($theme) == dark;
-    $container-color: inspection.get-theme-color($theme, $palette-name);
-    $contrast-tone: token-definition.contrast-tone($container-color, $is-dark);
-    $color: if($contrast-tone == 'dark', #000, #fff);
-    $foreground-color: $color;
-    $state-layer-color: $color;
-    $ripple-color: rgba($color, 0.1);
-  }
-  @else {
-    $foreground-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
-    $state-layer-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
-    $ripple-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 0.1);
-  }
-
-  @return (
-    container-color: inspection.get-theme-color($theme, $palette-name, default),
-    foreground-color: $foreground-color,
-    state-layer-color: $state-layer-color,
-    ripple-color: $ripple-color,
-  );
-}
-
-// Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($theme) {
-  @return ();
-}
-
-// Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($theme) {
-  $density-scale: theming.clamp-density(inspection.get-theme-density($theme), -3);
-
-  @return (
-    touch-target-display: if($density-scale < -1, none, block),
-  );
-}
-
-// Combines the tokens generated by the above functions into a single map with placeholder values.
-// This is used to create token slots.
-@function get-token-slots() {
-  @return sass-utils.deep-merge-all(
-      get-unthemable-tokens(),
-      get-color-tokens(token-definition.$placeholder-color-config),
-      get-typography-tokens(token-definition.$placeholder-typography-config),
-      get-density-tokens(token-definition.$placeholder-density-config)
-  );
-}

package/core/tokens/m2/mat/_filled-button.scss

@@ -1,114 +0,0 @@
-@use 'sass:meta';
-@use 'sass:map';
-@use '../../token-definition';
-@use '../../../theming/theming';
-@use '../../../theming/inspection';
-@use '../../../style/sass-utils';
-
-// The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, filled-button);
-
-// Tokens that can't be configured through Angular Material's current theming API,
-// but may be in a future version of the theming API.
-@function get-unthemable-tokens() {
-  @return (
-    container-shape: 4px,
-    horizontal-padding: 16px,
-    icon-spacing: 8px,
-    icon-offset: -4px,
-  );
-}
-
-// Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($theme) {
-  $is-dark: inspection.get-theme-type($theme) == dark;
-
-  @return (
-    container-color: inspection.get-theme-color($theme, background, card),
-    disabled-container-color: inspection.get-theme-color($theme, foreground, disabled-button, 0.12),
-    disabled-label-text-color:
-        inspection.get-theme-color($theme, foreground, disabled-button, if($is-dark, 0.5, 0.38)),
-    disabled-state-layer-color: inspection.get-theme-color($theme, foreground, base),
-    focus-state-layer-opacity: if($is-dark, 0.24, 0.12),
-    hover-state-layer-opacity: if($is-dark, 0.08, 0.04),
-    label-text-color: inspection.get-theme-color($theme, foreground, text, 1),
-    pressed-state-layer-opacity: if($is-dark, 0.24, 0.12),
-    ripple-color: inspection.get-theme-color($theme, foreground, base, 0.1),
-    state-layer-color: inspection.get-theme-color($theme, foreground, base),
-  );
-}
-
-// Generates the mapping for the properties that change based on the button palette color.
-@function private-get-color-palette-color-tokens($theme, $palette-name) {
-  $state-layer-color: null;
-  $ripple-color: null;
-  $contrast-color: inspection.get-theme-color($theme, $palette-name, default-contrast);
-  $container-color: inspection.get-theme-color($theme, $palette-name, default);
-  $label-text-color: null;
-
-  // Ideally we would derive all values directly from the theme, but it causes a lot of regressions
-  // internally. For now we fall back to the old hardcoded behavior only for internal apps.
-  @if (token-definition.$private-is-internal-build or
-      meta.type-of($contrast-color) != 'color') {
-    $is-dark: inspection.get-theme-type($theme) == dark;
-    $container-color: inspection.get-theme-color($theme, $palette-name);
-    $contrast-tone: token-definition.contrast-tone($container-color, $is-dark);
-    $color: if($contrast-tone == 'dark', #000, #fff);
-    $state-layer-color: $color;
-    $ripple-color: rgba($color, 0.1);
-    $label-text-color: if($contrast-tone == 'dark', #000, #fff);
-  }
-  @else {
-    $label-text-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
-    $state-layer-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 1);
-    $ripple-color: inspection.get-theme-color($theme, $palette-name, default-contrast, 0.1);
-  }
-
-  @return (
-    container-color: $container-color,
-    label-text-color: $label-text-color,
-    ripple-color: $ripple-color,
-    state-layer-color: $state-layer-color,
-  );
-}
-
-// Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($theme) {
-  @return (
-    label-text-font: inspection.get-theme-typography($theme, button, font-family),
-    label-text-size: inspection.get-theme-typography($theme, button, font-size),
-    label-text-tracking: inspection.get-theme-typography($theme, button, letter-spacing),
-    label-text-weight: inspection.get-theme-typography($theme, button, font-weight),
-    label-text-transform: none,
-  );
-}
-
-// Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($theme) {
-  $density-scale: theming.clamp-density(inspection.get-theme-density($theme), -3);
-
-  @return (
-    touch-target-display: if($density-scale < -1, none, block),
-    container-height:
-    map.get(
-        (
-          0: 36px,
-          -1: 32px,
-          -2: 28px,
-          -3: 24px,
-        ),
-        $density-scale
-    )
-  );
-}
-
-// Combines the tokens generated by the above functions into a single map with placeholder values.
-// This is used to create token slots.
-@function get-token-slots() {
-  @return sass-utils.deep-merge-all(
-      get-unthemable-tokens(),
-      get-color-tokens(token-definition.$placeholder-color-config),
-      get-typography-tokens(token-definition.$placeholder-typography-config),
-      get-density-tokens(token-definition.$placeholder-density-config)
-  );
-}

package/core/tokens/m2/mat/_filled-text-field.scss

@@ -1,114 +0,0 @@
-@use 'sass:color';
-@use 'sass:map';
-@use 'sass:meta';
-@use '../../../theming/inspection';
-@use '../../../style/sass-utils';
-@use '../../token-definition';
-
-// The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, filled-text-field);
-
-// Tokens that can't be configured through Angular Material's current theming API,
-// but may be in a future version of the theming API.
-//
-// Tokens that are available in MDC, but not used in Angular Material should be mapped to `null`.
-// `null` indicates that we are intentionally choosing not to emit a slot or value for the token in
-// our CSS.
-@function get-unthemable-tokens() {
-  @return (
-    active-indicator-height: 1px,
-    focus-active-indicator-height: 2px,
-    container-shape: 4px,
-  );
-}
-
-// Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($theme) {
-  $is-dark: inspection.get-theme-type($theme) == dark;
-  $surface: inspection.get-theme-color($theme, background, card);
-  $warn-color: inspection.get-theme-color($theme, warn);
-  $color-tokens: private-get-color-palette-color-tokens($theme, primary);
-  $on-surface: if($is-dark, #fff, #000);
-
-  // Ideally we would derive all values directly from the theme, but it causes a lot of regressions
-  // internally. For now we fall back to the old hardcoded behavior only for internal apps.
-  $text-color-base: if(token-definition.$private-is-internal-build, $on-surface,
-    inspection.get-theme-color($theme, foreground, text, 1));
-  $disabled-text-color-base: if(token-definition.$private-is-internal-build, $on-surface,
-    inspection.get-theme-color($theme, foreground, disabled-text, 1));
-  $divider-base: if(token-definition.$private-is-internal-build, $on-surface,
-    inspection.get-theme-color($theme, foreground, divider, 1));
-
-  @return map.merge($color-tokens, (
-    container-color: _variable-safe-mix($on-surface, $surface, 4%),
-    disabled-container-color: _variable-safe-mix($on-surface, $surface, 2%),
-
-    label-text-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
-    hover-label-text-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
-    disabled-label-text-color:
-      sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
-
-    input-text-color: sass-utils.safe-color-change($text-color-base, $alpha: 0.87),
-    disabled-input-text-color:
-      sass-utils.safe-color-change($disabled-text-color-base, $alpha: 0.38),
-    input-text-placeholder-color:
-      sass-utils.safe-color-change($text-color-base, $alpha: 0.6),
-
-    error-hover-label-text-color: $warn-color,
-    error-focus-label-text-color: $warn-color,
-    error-label-text-color: $warn-color,
-    error-caret-color: $warn-color,
-
-    active-indicator-color: sass-utils.safe-color-change($divider-base, $alpha: 0.42),
-    disabled-active-indicator-color: sass-utils.safe-color-change($divider-base, $alpha: 0.06),
-    hover-active-indicator-color: sass-utils.safe-color-change($divider-base, $alpha: 0.87),
-    error-active-indicator-color: $warn-color,
-    error-focus-active-indicator-color: $warn-color,
-    error-hover-active-indicator-color: $warn-color,
-  ));
-}
-
-@function _variable-safe-mix($first-color, $second-color, $amount) {
-  @if (meta.type-of($first-color) == color and meta.type-of($second-color) == color) {
-    @return color.mix($first-color, $second-color, $amount);
-  }
-  @return $first-color;
-}
-
-// Generates the mapping for the properties that change based on the text field color.
-@function private-get-color-palette-color-tokens($theme, $palette-name) {
-  $palette: map.get($theme, $palette-name);
-  $palette-color: inspection.get-theme-color($theme, $palette-name);
-
-  @return (
-    caret-color: $palette-color,
-    focus-active-indicator-color: $palette-color,
-    focus-label-text-color: sass-utils.safe-color-change($palette-color, $alpha: 0.87),
-  );
-}
-
-// Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($theme) {
-  @return (
-    label-text-font: inspection.get-theme-typography($theme, body-1, font-family),
-    label-text-size: inspection.get-theme-typography($theme, body-1, font-size),
-    label-text-tracking: inspection.get-theme-typography($theme, body-1, letter-spacing),
-    label-text-weight: inspection.get-theme-typography($theme, body-1, font-weight),
-  );
-}
-
-// Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($theme) {
-  @return ();
-}
-
-// Combines the tokens generated by the above functions into a single map with placeholder values.
-// This is used to create token slots.
-@function get-token-slots() {
-  @return sass-utils.deep-merge-all(
-      get-unthemable-tokens(),
-      get-color-tokens(token-definition.$placeholder-color-config),
-      get-typography-tokens(token-definition.$placeholder-typography-config),
-      get-density-tokens(token-definition.$placeholder-density-config)
-  );
-}

package/core/tokens/m2/mat/_legacy-button-toggle.scss

@@ -1,59 +0,0 @@
-@use '../../token-definition';
-@use '../../../theming/inspection';
-@use '../../../style/sass-utils';
-
-// The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, legacy-button-toggle);
-
-// Tokens that can't be configured through Angular Material's current theming API,
-// but may be in a future version of the theming API.
-@function get-unthemable-tokens() {
-  @return (
-    height: 36px,
-    shape: 2px,
-    focus-state-layer-opacity: 1,
-  );
-}
-
-// Tokens that can be configured through Angular Material's color theming API.
-@function get-color-tokens($theme) {
-  @return (
-    text-color: inspection.get-theme-color($theme, foreground, hint-text),
-    state-layer-color: inspection.get-theme-color($theme, background, focused-button),
-    selected-state-text-color: inspection.get-theme-color($theme, foreground, secondary-text),
-    selected-state-background-color: inspection.get-theme-color(
-        $theme, background, selected-button),
-    disabled-state-text-color: inspection.get-theme-color($theme, foreground, disabled-button),
-    disabled-state-background-color: inspection.get-theme-color(
-        $theme, background, disabled-button-toggle),
-    disabled-selected-state-background-color: inspection.get-theme-color(
-        $theme, background, selected-disabled-button)
-  );
-}
-
-// Tokens that can be configured through Angular Material's typography theming API.
-@function get-typography-tokens($theme) {
-  @return (
-    label-text-font: inspection.get-theme-typography($theme, body-1, font-family),
-    label-text-line-height: inspection.get-theme-typography($theme, body-1, line-height),
-    label-text-size: inspection.get-theme-typography($theme, body-1, font-size),
-    label-text-tracking: inspection.get-theme-typography($theme, body-1, letter-spacing),
-    label-text-weight: inspection.get-theme-typography($theme, body-1, font-weight),
-  );
-}
-
-// Tokens that can be configured through Angular Material's density theming API.
-@function get-density-tokens($theme) {
-  @return ();
-}
-
-// Combines the tokens generated by the above functions into a single map with placeholder values.
-// This is used to create token slots.
-@function get-token-slots() {
-  @return sass-utils.deep-merge-all(
-      get-unthemable-tokens(),
-      get-color-tokens(token-definition.$placeholder-color-config),
-      get-typography-tokens(token-definition.$placeholder-typography-config),
-      get-density-tokens(token-definition.$placeholder-density-config)
-  );
-}