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

package/{core/tokens/m2/mat/_select.scss → select/_m2-select.scss}

@@ -1,9 +1,9 @@
 @use 'sass:map';
-@use '../../token-definition';
-@use '../../../theming/inspection';
-@use '../../../theming/theming';
-@use '../../../style/elevation';
-@use '../../../style/sass-utils';
+@use '../core/tokens/m2-utils';
+@use '../core/theming/inspection';
+@use '../core/theming/theming';
+@use '../core/style/elevation';
+@use '../core/style/sass-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, select);
@@ -23,11 +23,11 @@ $prefix: (mat, select);
   // 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.
   $on-surface: if($is-dark, #fff, #000);
-  $text-color-base: if(token-definition.$private-is-internal-build, $on-surface,
+  $text-color-base: if(m2-utils.$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,
+  $disabled-text-color-base: if(m2-utils.$private-is-internal-build, $on-surface,
     inspection.get-theme-color($theme, foreground, disabled-text, 1));
-  $icon-color-base: if(token-definition.$private-is-internal-build, $on-surface,
+  $icon-color-base: if(m2-utils.$private-is-internal-build, $on-surface,
     inspection.get-theme-color($theme, foreground, divider, 1));
 
   @return (
@@ -74,8 +74,8 @@ $prefix: (mat, select);
 @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)
+      get-color-tokens(m2-utils.$placeholder-color-config),
+      get-typography-tokens(m2-utils.$placeholder-typography-config),
+      get-density-tokens(m2-utils.$placeholder-density-config)
   );
 }

package/{core/tokens/m3/mat/_select.scss → select/_m3-select.scss}

@@ -1,7 +1,10 @@
 @use 'sass:map';
-@use '../../../style/sass-utils';
-@use '../../../style/elevation';
-@use '../../token-definition';
+@use 'sass:list';
+@use '../core/style/sass-utils';
+@use '../core/style/elevation';
+@use '../core/tokens/m3-utils';
+@use '../core/theming/theming';
+@use '../core/theming/inspection';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, select);
@@ -13,7 +16,7 @@ $prefix: (mat, select);
 /// @return {Map} A set of custom tokens for the mat-select
 @function get-tokens($systems, $exclude-hardcoded, $token-slots) {
   $tokens: sass-utils.merge-all(
-    token-definition.generate-typography-tokens($systems, trigger-text, body-large),
+    m3-utils.generate-typography-tokens($systems, trigger-text, body-large),
     (
       panel-background-color: map.get($systems, md-sys-color, surface-container),
       enabled-trigger-text-color: map.get($systems, md-sys-color, on-surface),
@@ -26,7 +29,7 @@ $prefix: (mat, select);
       focused-arrow-color: map.get($systems, md-sys-color, primary),
       invalid-arrow-color: map.get($systems, md-sys-color, error),
       container-elevation-shadow:
-        token-definition.hardcode(elevation.get-box-shadow(2), $exclude-hardcoded),
+        m3-utils.hardcode(elevation.get-box-shadow(2), $exclude-hardcoded),
     )
   );
 
@@ -44,5 +47,15 @@ $prefix: (mat, select);
     )
   );
 
-  @return token-definition.namespace-tokens($prefix, ($tokens, $variant-tokens), $token-slots);
+  @return m3-utils.namespace($prefix, ($tokens, $variant-tokens), $token-slots);
+}
+
+// Tokens that can be configured through Angular Material's density theming API.
+@function get-density-tokens($theme) {
+  $scale: theming.clamp-density(inspection.get-theme-density($theme), -2);
+  $index: ($scale * -1) + 1;
+
+  @return (
+    arrow-transform: list.nth((translateY(-8px), translateY(-8px), none), $index),
+  );
 }

package/select/_select-theme.scss

@@ -1,11 +1,11 @@
-@use '../core/tokens/m2/mat/select' as tokens-mat-select;
-@use '../core/tokens/token-utils';
 @use '../core/style/sass-utils';
-
-@use '../core/theming/theming';
 @use '../core/theming/inspection';
+@use '../core/theming/theming';
 @use '../core/theming/validation';
+@use '../core/tokens/token-utils';
 @use '../core/typography/typography';
+@use './m2-select';
+@use './m3-select';
 
 /// Outputs base theme styles (styles not dependent on the color, typography, or density settings)
 /// for the mat-select.
@@ -15,8 +15,8 @@
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
   } @else {
     @include sass-utils.current-selector-or-root() {
-      $mat-tokens: tokens-mat-select.get-unthemable-tokens();
-      @include token-utils.create-token-values-mixed(tokens-mat-select.$prefix, $mat-tokens);
+      $mat-tokens: m2-select.get-unthemable-tokens();
+      @include token-utils.create-token-values-mixed(m2-select.$prefix, $mat-tokens);
     }
   }
 }
@@ -32,21 +32,21 @@
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
-        tokens-mat-select.$prefix,
-        tokens-mat-select.get-color-tokens($theme)
+        m2-select.$prefix,
+        m2-select.get-color-tokens($theme)
       );
 
       .mat-mdc-form-field.mat-accent {
         @include token-utils.create-token-values-mixed(
-          tokens-mat-select.$prefix,
-          tokens-mat-select.get-color-tokens($theme, accent)
+          m2-select.$prefix,
+          m2-select.get-color-tokens($theme, accent)
         );
       }
 
       .mat-mdc-form-field.mat-warn {
         @include token-utils.create-token-values-mixed(
-          tokens-mat-select.$prefix,
-          tokens-mat-select.get-color-tokens($theme, warn)
+          m2-select.$prefix,
+          m2-select.get-color-tokens($theme, warn)
         );
       }
     }
@@ -61,8 +61,8 @@
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
-        tokens-mat-select.$prefix,
-        tokens-mat-select.get-typography-tokens($theme)
+        m2-select.$prefix,
+        m2-select.get-typography-tokens($theme)
       );
     }
   }
@@ -72,12 +72,13 @@
 /// @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));
+    @include token-utils.create-token-values(
+        m3-select.$prefix, m3-select.get-density-tokens($theme));
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
-        tokens-mat-select.$prefix,
-        tokens-mat-select.get-density-tokens($theme)
+        m2-select.$prefix,
+        m2-select.get-density-tokens($theme)
       );
     }
   }
@@ -87,8 +88,8 @@
 @function _define-overrides() {
   @return (
     (
-      namespace: tokens-mat-select.$prefix,
-      tokens: tokens-mat-select.get-token-slots(),
+      namespace: m2-select.$prefix,
+      tokens: m2-select.get-token-slots(),
     ),
   );
 }
@@ -108,6 +109,9 @@
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-select') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
+      @if inspection.theme-has($theme, density) {
+        @include density($theme);
+      }
     } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
@@ -127,6 +131,6 @@
   @include validation.selector-defined(
     'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
   );
-  $mat-select-tokens: token-utils.get-tokens-for($tokens, tokens-mat-select.$prefix, $options...);
-  @include token-utils.create-token-values(tokens-mat-select.$prefix, $mat-select-tokens);
+  $mat-select-tokens: token-utils.get-tokens-for($tokens, m2-select.$prefix, $options...);
+  @include token-utils.create-token-values(m2-select.$prefix, $mat-select-tokens);
 }

package/select/index.d.ts

@@ -1,26 +1,26 @@
-export { d as MAT_SELECT_CONFIG, a as MAT_SELECT_SCROLL_STRATEGY, e as MAT_SELECT_SCROLL_STRATEGY_PROVIDER, b as MAT_SELECT_SCROLL_STRATEGY_PROVIDER_FACTORY, f as MAT_SELECT_TRIGGER, h as MatSelect, g as MatSelectChange, c as MatSelectConfig, M as MatSelectModule, i as MatSelectTrigger } from '../module.d-916841df.js';
-export { a as MatOptgroup, M as MatOption } from '../option.d-be9de0a8.js';
-export { M as MatLabel } from '../module.d-a335a842.js';
-export { a as MatError, k as MatFormField, b as MatHint, d as MatPrefix, f as MatSuffix } from '../form-field.d-e2081e20.js';
+export { MAT_SELECT_CONFIG, MAT_SELECT_SCROLL_STRATEGY, MAT_SELECT_SCROLL_STRATEGY_PROVIDER, MAT_SELECT_SCROLL_STRATEGY_PROVIDER_FACTORY, MAT_SELECT_TRIGGER, MatSelect, MatSelectChange, MatSelectConfig, MatSelectModule, MatSelectTrigger } from '../module.d-D0Yb5xFi.js';
+export { MatOptgroup, MatOption } from '../option.d-ef4idHSb.js';
+export { MatLabel } from '../module.d-_FxAFBZR.js';
+export { MatError, MatFormField, MatHint, MatPrefix, MatSuffix } from '../form-field.d-DeaA8Upo.js';
 import '@angular/core';
 import '@angular/cdk/overlay';
-import '../index.d-6e895711.js';
-import '../index.d-609609fc.js';
-import '../common-module.d-1b789e68.js';
+import '../index.d-osnm7rw7.js';
+import '../index.d-_XdEyDn3.js';
+import '../common-module.d-CUT8AqiB.js';
 import '@angular/cdk/bidi';
-import '../ripple.d-838c5cd6.js';
+import '../ripple.d-DBFnJ3Aa.js';
 import '@angular/cdk/platform';
-import '../pseudo-checkbox-module.d-efa6959b.js';
+import '../pseudo-checkbox-module.d-czRCRd5m.js';
 import '@angular/cdk/a11y';
 import '@angular/cdk/collections';
 import '@angular/cdk/scrolling';
 import '@angular/forms';
 import 'rxjs';
-import '../error-options.d-bd1801bf.js';
-import '../form-field-control.d-d7b3a431.js';
+import '../error-options.d-C1yXmo10.js';
+import '../form-field-control.d-39fAGkWp.js';
 import '@angular/cdk/observers';
 import '@angular/cdk/coercion';
-import '../palette.d-f5ca9a2b.js';
+import '../palette.d-fF1us9u8.js';
 
 /**
  * The following are all the animations for the mat-select component, with each

package/select/testing/index.d.ts

@@ -1,5 +1,64 @@
-export { M as MatSelectHarness, S as SelectHarnessFilters } from '../../select-harness.d-03127681.js';
-import '@angular/cdk/testing';
-import '../../option-harness.d-047df5c5.js';
-import '../../optgroup-harness.d-fc22ca1c.js';
-import '../../form-field-control-harness.d-8ec51e17.js';
+import { BaseHarnessFilters, ComponentHarnessConstructor, HarnessPredicate } from '@angular/cdk/testing';
+import { OptionHarnessFilters, MatOptionHarness } from '../../option-harness.d-BpYClwei.js';
+import { OptgroupHarnessFilters, MatOptgroupHarness } from '../../core/testing/index.js';
+import { MatFormFieldControlHarness } from '../../form-field/testing/control/index.js';
+
+/** A set of criteria that can be used to filter a list of `MatSelectHarness` instances. */
+interface SelectHarnessFilters extends BaseHarnessFilters {
+    /** Only find instances which match the given disabled state. */
+    disabled?: boolean;
+}
+
+/** Harness for interacting with a mat-select in tests. */
+declare class MatSelectHarness extends MatFormFieldControlHarness {
+    static hostSelector: string;
+    private _prefix;
+    private _optionClass;
+    private _optionGroupClass;
+    private _documentRootLocator;
+    private _backdrop;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a select with specific attributes.
+     * @param options Options for filtering which select instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with<T extends MatSelectHarness>(this: ComponentHarnessConstructor<T>, options?: SelectHarnessFilters): HarnessPredicate<T>;
+    /** Gets a boolean promise indicating if the select is disabled. */
+    isDisabled(): Promise<boolean>;
+    /** Gets a boolean promise indicating if the select is valid. */
+    isValid(): Promise<boolean>;
+    /** Gets a boolean promise indicating if the select is required. */
+    isRequired(): Promise<boolean>;
+    /** Gets a boolean promise indicating if the select is empty (no value is selected). */
+    isEmpty(): Promise<boolean>;
+    /** Gets a boolean promise indicating if the select is in multi-selection mode. */
+    isMultiple(): Promise<boolean>;
+    /** Gets a promise for the select's value text. */
+    getValueText(): Promise<string>;
+    /** Focuses the select and returns a void promise that indicates when the action is complete. */
+    focus(): Promise<void>;
+    /** Blurs the select and returns a void promise that indicates when the action is complete. */
+    blur(): Promise<void>;
+    /** Whether the select is focused. */
+    isFocused(): Promise<boolean>;
+    /** Gets the options inside the select panel. */
+    getOptions(filter?: Omit<OptionHarnessFilters, 'ancestor'>): Promise<MatOptionHarness[]>;
+    /** Gets the groups of options inside the panel. */
+    getOptionGroups(filter?: Omit<OptgroupHarnessFilters, 'ancestor'>): Promise<MatOptgroupHarness[]>;
+    /** Gets whether the select is open. */
+    isOpen(): Promise<boolean>;
+    /** Opens the select's panel. */
+    open(): Promise<void>;
+    /**
+     * Clicks the options that match the passed-in filter. If the select is in multi-selection
+     * mode all options will be clicked, otherwise the harness will pick the first matching option.
+     */
+    clickOptions(filter?: OptionHarnessFilters): Promise<void>;
+    /** Closes the select's panel. */
+    close(): Promise<void>;
+    /** Gets the selector that should be used to find this select's panel. */
+    private _getPanelSelector;
+}
+
+export { MatSelectHarness };
+export type { SelectHarnessFilters };

package/{core/tokens/m2/mat/_sidenav.scss → sidenav/_m2-sidenav.scss}

@@ -1,9 +1,9 @@
 @use 'sass:color';
 @use 'sass:meta';
-@use '../../token-definition';
-@use '../../../theming/inspection';
-@use '../../../style/elevation';
-@use '../../../style/sass-utils';
+@use '../core/tokens/m2-utils';
+@use '../core/theming/inspection';
+@use '../core/style/elevation';
+@use '../core/style/sass-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, sidenav);
@@ -59,8 +59,8 @@ $prefix: (mat, sidenav);
 @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)
+      get-color-tokens(m2-utils.$placeholder-color-config),
+      get-typography-tokens(m2-utils.$placeholder-typography-config),
+      get-density-tokens(m2-utils.$placeholder-density-config)
   );
 }

package/{core/tokens/m3/mat/_sidenav.scss → sidenav/_m3-sidenav.scss}

@@ -1,6 +1,6 @@
 @use 'sass:map';
-@use '../../../style/sass-utils';
-@use '../../token-definition';
+@use '../core/style/sass-utils';
+@use '../core/tokens/m3-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, sidenav);
@@ -12,9 +12,9 @@ $prefix: (mat, sidenav);
 /// @return {Map} A set of custom tokens for the mat-sidenav
 @function get-tokens($systems, $exclude-hardcoded, $token-slots) {
   $tokens: (
-    container-elevation-shadow: token-definition.hardcode(none, $exclude-hardcoded),
-    container-divider-color: token-definition.hardcode(transparent, $exclude-hardcoded),
-    container-width: token-definition.hardcode(360px, $exclude-hardcoded),
+    container-elevation-shadow: m3-utils.hardcode(none, $exclude-hardcoded),
+    container-divider-color: m3-utils.hardcode(transparent, $exclude-hardcoded),
+    container-width: m3-utils.hardcode(360px, $exclude-hardcoded),
     container-shape: map.get($systems, md-sys-shape, corner-large),
     container-background-color: map.get($systems, md-sys-color, surface),
     container-text-color: map.get($systems, md-sys-color, on-surface-variant),
@@ -24,5 +24,5 @@ $prefix: (mat, sidenav);
         map.get($systems, md-ref-palette, neutral-variant20), $alpha: 0.4),
   );
 
-  @return token-definition.namespace-tokens($prefix, $tokens, $token-slots);
+  @return m3-utils.namespace($prefix, $tokens, $token-slots);
 }

package/sidenav/_sidenav-theme.scss

@@ -1,10 +1,10 @@
 @use 'sass:map';
-@use '../core/theming/theming';
+@use '../core/style/sass-utils';
 @use '../core/theming/inspection';
+@use '../core/theming/theming';
 @use '../core/theming/validation';
-@use '../core/tokens/m2/mat/sidenav' as tokens-mat-sidenav;
 @use '../core/tokens/token-utils';
-@use '../core/style/sass-utils';
+@use './m2-sidenav';
 
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
@@ -12,9 +12,7 @@
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
-        tokens-mat-sidenav.$prefix,
-        tokens-mat-sidenav.get-unthemable-tokens()
-      );
+        m2-sidenav.$prefix, m2-sidenav.get-unthemable-tokens());
     }
   }
 }
@@ -25,9 +23,7 @@
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
-        tokens-mat-sidenav.$prefix,
-        tokens-mat-sidenav.get-color-tokens($theme)
-      );
+        m2-sidenav.$prefix, m2-sidenav.get-color-tokens($theme));
     }
   }
 }
@@ -41,7 +37,7 @@
 
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
-    @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
+    // There are no M3 density tokens for this component
   } @else {
   }
 }
@@ -50,8 +46,8 @@
 @function _define-overrides() {
   @return (
     (
-      namespace: tokens-mat-sidenav.$prefix,
-      tokens: tokens-mat-sidenav.get-token-slots(),
+      namespace: m2-sidenav.$prefix,
+      tokens: m2-sidenav.get-token-slots(),
     ),
   );
 }
@@ -85,8 +81,8 @@
   );
   @if ($tokens != ()) {
     @include token-utils.create-token-values(
-      tokens-mat-sidenav.$prefix,
-      map.get($tokens, tokens-mat-sidenav.$prefix)
+      m2-sidenav.$prefix,
+      map.get($tokens, m2-sidenav.$prefix)
     );
   }
 }

package/sidenav/index.d.ts

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, AfterContentInit, AfterViewInit, OnDestroy, EventEmitter, ElementRef, DoCheck, QueryList } from '@angular/core';
-import { M as MatCommonModule } from '../common-module.d-1b789e68.js';
+import { InjectionToken, AfterContentInit, DoCheck, OnDestroy, QueryList, AfterViewInit, EventEmitter, ElementRef } from '@angular/core';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
 import * as i5 from '@angular/cdk/scrolling';
 import { CdkScrollable } from '@angular/cdk/scrolling';
 import { FocusOrigin } from '@angular/cdk/a11y';
@@ -348,4 +348,5 @@ declare const matDrawerAnimations: {
     readonly transformDrawer: any;
 };
 
-export { MAT_DRAWER_DEFAULT_AUTOSIZE, MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY, MatDrawer, MatDrawerContainer, MatDrawerContent, type MatDrawerMode, type MatDrawerToggleResult, MatSidenav, MatSidenavContainer, MatSidenavContent, MatSidenavModule, matDrawerAnimations, throwMatDuplicatedDrawerError };
+export { MAT_DRAWER_DEFAULT_AUTOSIZE, MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY, MatDrawer, MatDrawerContainer, MatDrawerContent, MatSidenav, MatSidenavContainer, MatSidenavContent, MatSidenavModule, matDrawerAnimations, throwMatDuplicatedDrawerError };
+export type { MatDrawerMode, MatDrawerToggleResult };

package/sidenav/testing/index.d.ts

@@ -1,4 +1,4 @@
-import { BaseHarnessFilters, HarnessPredicate, ContentContainerComponentHarness } from '@angular/cdk/testing';
+import { BaseHarnessFilters, ContentContainerComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
 
 /** A set of criteria that can be used to filter a list of `MatDrawerHarness` instances. */
 interface DrawerHarnessFilters extends BaseHarnessFilters {
@@ -118,4 +118,5 @@ declare class MatSidenavContainerHarness extends ContentContainerComponentHarnes
     getContent(): Promise<MatSidenavContentHarness>;
 }
 
-export { type DrawerContainerHarnessFilters, type DrawerContentHarnessFilters, type DrawerHarnessFilters, MatDrawerContainerHarness, MatDrawerContentHarness, MatDrawerHarness, MatSidenavContainerHarness, MatSidenavContentHarness, MatSidenavHarness };
+export { MatDrawerContainerHarness, MatDrawerContentHarness, MatDrawerHarness, MatSidenavContainerHarness, MatSidenavContentHarness, MatSidenavHarness };
+export type { DrawerContainerHarnessFilters, DrawerContentHarnessFilters, DrawerHarnessFilters };

package/{core/tokens/m2/mat/_switch.scss → slide-toggle/_m2-slide-toggle.scss}

@@ -1,12 +1,12 @@
-@use '../../token-definition';
-@use '../../../style/sass-utils';
+@use '../core/style/elevation';
+@use '../core/style/sass-utils';
+@use '../core/theming/inspection';
+@use '../core/theming/theming';
+@use '../core/tokens/m2-utils';
 @use 'sass:map';
-@use '../../../theming/inspection';
-@use '../../../theming/theming';
-@use '../../../style/elevation';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, switch);
+$prefix: (mat, slide-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.
@@ -160,8 +160,8 @@ $prefix: (mat, switch);
 @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)
+    get-color-tokens(m2-utils.$placeholder-color-config),
+    get-typography-tokens(m2-utils.$placeholder-typography-config),
+    get-density-tokens(m2-utils.$placeholder-density-config)
   );
 }

package/{core/tokens/m3/mat/_switch.scss → slide-toggle/_m3-slide-toggle.scss}

@@ -1,9 +1,8 @@
 @use 'sass:map';
-@use '../../token-definition';
-@use '../../../style/elevation';
+@use '../core/tokens/m3-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
-$prefix: (mat, switch);
+$prefix: (mat, slide-toggle);
 
 /// Generates custom tokens for the mat-slide-toggle.
 /// @param {Map} $systems The MDC system tokens
@@ -32,25 +31,25 @@ $prefix: (mat, switch);
     disabled-unselected-track-color: map.get($systems, md-sys-color, surface-variant),
     disabled-unselected-track-outline-color: map.get($systems, md-sys-color, on-surface),
     disabled-unselected-track-outline-width:
-    token-definition.hardcode(2px, $exclude-hardcoded),
+    m3-utils.hardcode(2px, $exclude-hardcoded),
     handle-shape: map.get($systems, md-sys-shape, corner-full),
-    hidden-track-opacity: token-definition.hardcode(0, $exclude-hardcoded),
-    hidden-track-transition: token-definition.hardcode(opacity 75ms, $exclude-hardcoded),
+    hidden-track-opacity: m3-utils.hardcode(0, $exclude-hardcoded),
+    hidden-track-transition: m3-utils.hardcode(opacity 75ms, $exclude-hardcoded),
     label-text-color: map.get($systems, md-sys-color, on-surface),
     label-text-font: map.get($systems, md-sys-typescale, body-medium-font),
     label-text-line-height: map.get($systems, md-sys-typescale, body-medium-line-height),
     label-text-size: map.get($systems, md-sys-typescale, body-medium-size),
     label-text-tracking: map.get($systems, md-sys-typescale, body-medium-tracking),
     label-text-weight: map.get($systems, md-sys-typescale, body-medium-weight),
-    pressed-handle-size: token-definition.hardcode(28px, $exclude-hardcoded),
+    pressed-handle-size: m3-utils.hardcode(28px, $exclude-hardcoded),
     selected-focus-handle-color: map.get($systems, md-sys-color, primary-container),
     selected-focus-state-layer-color: map.get($systems, md-sys-color, primary),
     selected-focus-state-layer-opacity:
         map.get($systems, md-sys-state, focus-state-layer-opacity),
     selected-focus-track-color: map.get($systems, md-sys-color, primary),
     selected-handle-color: map.get($systems, md-sys-color, on-primary),
-    selected-handle-horizontal-margin: token-definition.hardcode(0 24px, $exclude-hardcoded),
-    selected-handle-size: token-definition.hardcode(24px, $exclude-hardcoded),
+    selected-handle-horizontal-margin: m3-utils.hardcode(0 24px, $exclude-hardcoded),
+    selected-handle-size: m3-utils.hardcode(24px, $exclude-hardcoded),
     selected-hover-handle-color: map.get($systems, md-sys-color, primary-container),
     selected-hover-state-layer-color: map.get($systems, md-sys-color, primary),
     selected-hover-state-layer-opacity: map.get($systems, md-sys-state, hover-state-layer-opacity),
@@ -59,16 +58,16 @@ $prefix: (mat, switch);
     selected-icon-size: if($exclude-hardcoded, null, 16px),
     selected-pressed-handle-color: map.get($systems, md-sys-color, primary-container),
     selected-pressed-handle-horizontal-margin:
-    token-definition.hardcode(0 22px, $exclude-hardcoded),
+    m3-utils.hardcode(0 22px, $exclude-hardcoded),
     selected-pressed-state-layer-color: map.get($systems, md-sys-color, primary),
     selected-pressed-state-layer-opacity:
         map.get($systems, md-sys-state, pressed-state-layer-opacity),
     selected-pressed-track-color: map.get($systems, md-sys-color, primary),
     selected-track-color: map.get($systems, md-sys-color, primary),
-    selected-track-outline-color: token-definition.hardcode(transparent, $exclude-hardcoded),
-    selected-track-outline-width: token-definition.hardcode(2px, $exclude-hardcoded),
+    selected-track-outline-color: m3-utils.hardcode(transparent, $exclude-hardcoded),
+    selected-track-outline-width: m3-utils.hardcode(2px, $exclude-hardcoded),
     selected-with-icon-handle-horizontal-margin:
-    token-definition.hardcode(0 24px, $exclude-hardcoded),
+    m3-utils.hardcode(0 24px, $exclude-hardcoded),
     state-layer-size: if($exclude-hardcoded, null, 40px),
     track-height: if($exclude-hardcoded, null, 32px),
     track-outline-color: map.get($systems, md-sys-color, outline),
@@ -82,8 +81,8 @@ $prefix: (mat, switch);
     unselected-focus-track-color: map.get($systems, md-sys-color, surface-variant),
     unselected-handle-color: map.get($systems, md-sys-color, outline),
     unselected-handle-horizontal-margin:
-    token-definition.hardcode(0 8px, $exclude-hardcoded),
-    unselected-handle-size: token-definition.hardcode(16px, $exclude-hardcoded),
+    m3-utils.hardcode(0 8px, $exclude-hardcoded),
+    unselected-handle-size: m3-utils.hardcode(16px, $exclude-hardcoded),
     unselected-hover-handle-color: map.get($systems, md-sys-color, on-surface-variant),
     unselected-hover-state-layer-color: map.get($systems, md-sys-color, on-surface),
     unselected-hover-state-layer-opacity:
@@ -93,27 +92,23 @@ $prefix: (mat, switch);
     unselected-icon-size: if($exclude-hardcoded, null, 16px),
     unselected-pressed-handle-color: map.get($systems, md-sys-color, on-surface-variant),
     unselected-pressed-handle-horizontal-margin:
-        token-definition.hardcode(0 2px, $exclude-hardcoded),
+        m3-utils.hardcode(0 2px, $exclude-hardcoded),
     unselected-pressed-state-layer-color: map.get($systems, md-sys-color, on-surface),
     unselected-pressed-state-layer-opacity:
         map.get($systems, md-sys-state, pressed-state-layer-opacity),
     unselected-pressed-track-color: map.get($systems, md-sys-color, surface-variant),
     unselected-track-color: map.get($systems, md-sys-color, surface-variant),
     unselected-with-icon-handle-horizontal-margin:
-        token-definition.hardcode(0 4px, $exclude-hardcoded),
-    visible-track-opacity: token-definition.hardcode(1, $exclude-hardcoded),
-    visible-track-transition: token-definition.hardcode(opacity 75ms, $exclude-hardcoded),
-    with-icon-handle-size: token-definition.hardcode(24px, $exclude-hardcoded),
+        m3-utils.hardcode(0 4px, $exclude-hardcoded),
+    visible-track-opacity: m3-utils.hardcode(1, $exclude-hardcoded),
+    visible-track-transition: m3-utils.hardcode(opacity 75ms, $exclude-hardcoded),
+    with-icon-handle-size: m3-utils.hardcode(24px, $exclude-hardcoded),
+    // These tokens have always been empty for M3, but these token values should be used
+    // (with the same technique of calling `elevation.get-box-shadow`)
+    // Currently, internal users have M2 tokens being applied by accident
+    // handle-elevation-shadow: map.get($systems, md-sys-elevation, level0),
+    // disabled-handle-elevation-shadow: map.get($systems, md-sys-elevation, level0),
   );
-  $elevation-tokens: (handle-elevation, disabled-handle-elevation);
-
-  @each $token in $elevation-tokens {
-    $elevation: map.get($tokens, $token);
-
-    @if ($elevation != null) {
-      $tokens: map.set($tokens, $token + -shadow, elevation.get-box-shadow($elevation));
-    }
-  }
 
   $variant-tokens: (
     primary: (), // Default, no overrides needed
@@ -161,5 +156,5 @@ $prefix: (mat, switch);
     ),
   );
 
-  @return token-definition.namespace-tokens($prefix, ($tokens, $variant-tokens), $token-slots);
+  @return m3-utils.namespace($prefix, ($tokens, $variant-tokens), $token-slots);
 }