@angular/material 19.0.0-next.8 → 19.0.0-rc.0

package/datepicker/_datepicker-theme.scss

@@ -21,11 +21,15 @@ $calendar-weekday-table-font-size: 11px !default;
   $palette-color: inspection.get-theme-color($theme, $palette-name);
   $range-color: tokens-mat-datepicker.private-get-range-background-color($palette-color);
   $range-tokens: tokens-mat-datepicker.get-range-color-tokens($range-color);
-  $calendar-tokens:
-    tokens-mat-datepicker.private-get-calendar-color-palette-color-tokens($theme, $palette-name);
+  $calendar-tokens: tokens-mat-datepicker.private-get-calendar-color-palette-color-tokens(
+    $theme,
+    $palette-name
+  );
 
-  @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
-    map.merge($calendar-tokens, $range-tokens));
+  @include token-utils.create-token-values(
+    tokens-mat-datepicker.$prefix,
+    map.merge($calendar-tokens, $range-tokens)
+  );
 }
 
 /// Outputs base theme styles (styles not dependent on the color, typography, or density settings)
@@ -34,11 +38,12 @@ $calendar-weekday-table-font-size: 11px !default;
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
-        tokens-mat-datepicker.get-unthemable-tokens());
+      @include token-utils.create-token-values(
+        tokens-mat-datepicker.$prefix,
+        tokens-mat-datepicker.get-unthemable-tokens()
+      );
     }
   }
 }
@@ -51,11 +56,12 @@ $calendar-weekday-table-font-size: 11px !default;
 @mixin color($theme, $options...) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
-        tokens-mat-datepicker.get-color-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-datepicker.$prefix,
+        tokens-mat-datepicker.get-color-tokens($theme)
+      );
     }
 
     .mat-datepicker-content {
@@ -70,14 +76,18 @@ $calendar-weekday-table-font-size: 11px !default;
 
     .mat-datepicker-toggle-active {
       &.mat-accent {
-        $accent-tokens:
-          tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, accent);
+        $accent-tokens: tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens(
+          $theme,
+          accent
+        );
         @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $accent-tokens);
       }
 
       &.mat-warn {
-        $warn-tokens:
-          tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, warn);
+        $warn-tokens: tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens(
+          $theme,
+          warn
+        );
         @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $warn-tokens);
       }
     }
@@ -89,11 +99,12 @@ $calendar-weekday-table-font-size: 11px !default;
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,
-        tokens-mat-datepicker.get-typography-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-datepicker.$prefix,
+        tokens-mat-datepicker.get-typography-tokens($theme)
+      );
     }
   }
 }
@@ -103,7 +114,8 @@ $calendar-weekday-table-font-size: 11px !default;
   $comparison-color: tokens-mat-datepicker.$private-default-comparison-color,
   $overlap-color: tokens-mat-datepicker.$private-default-overlap-color,
   $overlap-selected-color:
-    tokens-mat-datepicker.private-get-default-overlap-selected-color($overlap-color)) {
+    tokens-mat-datepicker.private-get-default-overlap-selected-color($overlap-color)
+) {
   $tokens: tokens-mat-datepicker.get-range-color-tokens(
     $range-color: $range-color,
     $comparison-color: $comparison-color,
@@ -121,8 +133,7 @@ $calendar-weekday-table-font-size: 11px !default;
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
-  }
-  @else {
+  } @else {
     // TODO(crisbeto): move this into the structural styles
     // once the icon button density is switched to tokens.
 
@@ -134,13 +145,20 @@ $calendar-weekday-table-font-size: 11px !default;
   }
 }
 
+/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
+@function _define-overrides() {
+  @return (
+    (
+      namespace: tokens-mat-datepicker.$prefix,
+      tokens: tokens-mat-datepicker.get-token-slots(),
+    ),
+  );
+}
+
 /// Outputs the CSS variable values for the given tokens.
 /// @param {Map} $tokens The token values to emit.
 @mixin overrides($tokens: ()) {
-  @include token-utils.batch-create-token-values(
-    $tokens,
-    (prefix: tokens-mat-datepicker.$prefix, tokens: tokens-mat-datepicker.get-token-slots()),
-  );
+  @include token-utils.batch-create-token-values($tokens, _define-overrides()...);
 }
 
 /// Outputs all (base, color, typography, and density) theme styles for the mat-datepicker.
@@ -152,8 +170,7 @@ $calendar-weekday-table-font-size: 11px !default;
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-datepicker') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -170,8 +187,12 @@ $calendar-weekday-table-font-size: 11px !default;
 
 @mixin _theme-from-tokens($tokens, $options...) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
-  $mat-datepicker-tokens:
-      token-utils.get-tokens-for($tokens, tokens-mat-datepicker.$prefix, $options...);
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
+  $mat-datepicker-tokens: token-utils.get-tokens-for(
+    $tokens,
+    tokens-mat-datepicker.$prefix,
+    $options...
+  );
   @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $mat-datepicker-tokens);
 }

package/datepicker/index.d.ts

@@ -17,13 +17,12 @@ import { FactoryProvider } from '@angular/core';
 import { FocusOrigin } from '@angular/cdk/a11y';
 import { FormGroupDirective } from '@angular/forms';
 import * as i0 from '@angular/core';
-import * as i1 from '@angular/common';
-import * as i2 from '@angular/material/button';
-import * as i20 from '@angular/cdk/scrolling';
-import * as i3 from '@angular/cdk/overlay';
-import * as i4 from '@angular/cdk/a11y';
-import * as i5 from '@angular/cdk/portal';
-import * as i6 from '@angular/material/core';
+import * as i1 from '@angular/material/button';
+import * as i19 from '@angular/cdk/scrolling';
+import * as i2 from '@angular/cdk/overlay';
+import * as i3 from '@angular/cdk/a11y';
+import * as i4 from '@angular/cdk/portal';
+import * as i5 from '@angular/material/core';
 import { InjectionToken } from '@angular/core';
 import { MatButton } from '@angular/material/button';
 import { MatFormFieldControl } from '@angular/material/form-field';
@@ -116,20 +115,6 @@ export declare type ExtractDateTypeFromSelection<T> = T extends DateRange<infer
 declare function getActiveOffset<D>(dateAdapter: DateAdapter<D>, activeDate: D, minDate: D | null, maxDate: D | null): number;
 
 declare namespace i10 {
-    export {
-        MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY,
-        MAT_DATEPICKER_SCROLL_STRATEGY,
-        DatepickerDropdownPositionX,
-        DatepickerDropdownPositionY,
-        MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER,
-        MatDatepickerContent,
-        MatDatepickerControl,
-        MatDatepickerPanel,
-        MatDatepickerBase
-    }
-}
-
-declare namespace i11 {
     export {
         MAT_DATEPICKER_VALUE_ACCESSOR,
         MAT_DATEPICKER_VALIDATORS,
@@ -137,26 +122,26 @@ declare namespace i11 {
     }
 }
 
-declare namespace i12 {
+declare namespace i11 {
     export {
         MatDatepickerToggleIcon,
         MatDatepickerToggle
     }
 }
 
-declare namespace i13 {
+declare namespace i12 {
     export {
         MatMonthView
     }
 }
 
-declare namespace i14 {
+declare namespace i13 {
     export {
         MatYearView
     }
 }
 
-declare namespace i15 {
+declare namespace i14 {
     export {
         isSameMultiYearView,
         getActiveOffset,
@@ -166,13 +151,13 @@ declare namespace i15 {
     }
 }
 
-declare namespace i16 {
+declare namespace i15 {
     export {
         MatDateRangeInput
     }
 }
 
-declare namespace i17 {
+declare namespace i16 {
     export {
         MatDateRangeInputParent,
         MAT_DATE_RANGE_INPUT_PARENT,
@@ -181,14 +166,14 @@ declare namespace i17 {
     }
 }
 
-declare namespace i18 {
+declare namespace i17 {
     export {
         MatDateRangePickerInput,
         MatDateRangePicker
     }
 }
 
-declare namespace i19 {
+declare namespace i18 {
     export {
         MatDatepickerApply,
         MatDatepickerCancel,
@@ -196,7 +181,7 @@ declare namespace i19 {
     }
 }
 
-declare namespace i7 {
+declare namespace i6 {
     export {
         MatCalendarView,
         MatCalendarHeader,
@@ -204,7 +189,7 @@ declare namespace i7 {
     }
 }
 
-declare namespace i8 {
+declare namespace i7 {
     export {
         MatCalendarCellCssClasses,
         MatCalendarCellClassFunction,
@@ -214,12 +199,26 @@ declare namespace i8 {
     }
 }
 
-declare namespace i9 {
+declare namespace i8 {
     export {
         MatDatepicker
     }
 }
 
+declare namespace i9 {
+    export {
+        MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY,
+        MAT_DATEPICKER_SCROLL_STRATEGY,
+        DatepickerDropdownPositionX,
+        DatepickerDropdownPositionY,
+        MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER,
+        MatDatepickerContent,
+        MatDatepickerControl,
+        MatDatepickerPanel,
+        MatDatepickerBase
+    }
+}
+
 declare function isSameMultiYearView<D>(dateAdapter: DateAdapter<D>, date1: D, date2: D, minDate: D | null, maxDate: D | null): boolean;
 
 /**
@@ -825,7 +824,7 @@ declare abstract class MatDatepickerBase<C extends MatDatepickerControl<D>, S, D
     /** Gets an observable that will emit when the overlay is supposed to be closed. */
     private _getCloseStream;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerBase<any, any, any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerBase<any, any, any>, never, never, { "calendarHeaderComponent": { "alias": "calendarHeaderComponent"; "required": false; }; "startAt": { "alias": "startAt"; "required": false; }; "startView": { "alias": "startView"; "required": false; }; "color": { "alias": "color"; "required": false; }; "touchUi": { "alias": "touchUi"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "xPosition": { "alias": "xPosition"; "required": false; }; "yPosition": { "alias": "yPosition"; "required": false; }; "restoreFocus": { "alias": "restoreFocus"; "required": false; }; "dateClass": { "alias": "dateClass"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "opened": { "alias": "opened"; "required": false; }; }, { "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "viewChanged": "viewChanged"; "openedStream": "opened"; "closedStream": "closed"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerBase<any, any, any>, never, never, { "calendarHeaderComponent": { "alias": "calendarHeaderComponent"; "required": false; }; "startAt": { "alias": "startAt"; "required": false; }; "startView": { "alias": "startView"; "required": false; }; "color": { "alias": "color"; "required": false; }; "touchUi": { "alias": "touchUi"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "xPosition": { "alias": "xPosition"; "required": false; }; "yPosition": { "alias": "yPosition"; "required": false; }; "restoreFocus": { "alias": "restoreFocus"; "required": false; }; "dateClass": { "alias": "dateClass"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "opened": { "alias": "opened"; "required": false; }; }, { "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "viewChanged": "viewChanged"; "openedStream": "opened"; "closedStream": "closed"; }, never, never, true, never>;
     static ngAcceptInputType_touchUi: unknown;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_restoreFocus: unknown;
@@ -1148,7 +1147,7 @@ export declare class MatDatepickerIntl {
 
 export declare class MatDatepickerModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MatDatepickerModule, never, [typeof i1.CommonModule, typeof i2.MatButtonModule, typeof i3.OverlayModule, typeof i4.A11yModule, typeof i5.PortalModule, typeof i6.MatCommonModule, typeof i7.MatCalendar, typeof i8.MatCalendarBody, typeof i9.MatDatepicker, typeof i10.MatDatepickerContent, typeof i11.MatDatepickerInput, typeof i12.MatDatepickerToggle, typeof i12.MatDatepickerToggleIcon, typeof i13.MatMonthView, typeof i14.MatYearView, typeof i15.MatMultiYearView, typeof i7.MatCalendarHeader, typeof i16.MatDateRangeInput, typeof i17.MatStartDate, typeof i17.MatEndDate, typeof i18.MatDateRangePicker, typeof i19.MatDatepickerActions, typeof i19.MatDatepickerCancel, typeof i19.MatDatepickerApply], [typeof i20.CdkScrollableModule, typeof i7.MatCalendar, typeof i8.MatCalendarBody, typeof i9.MatDatepicker, typeof i10.MatDatepickerContent, typeof i11.MatDatepickerInput, typeof i12.MatDatepickerToggle, typeof i12.MatDatepickerToggleIcon, typeof i13.MatMonthView, typeof i14.MatYearView, typeof i15.MatMultiYearView, typeof i7.MatCalendarHeader, typeof i16.MatDateRangeInput, typeof i17.MatStartDate, typeof i17.MatEndDate, typeof i18.MatDateRangePicker, typeof i19.MatDatepickerActions, typeof i19.MatDatepickerCancel, typeof i19.MatDatepickerApply]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MatDatepickerModule, never, [typeof i1.MatButtonModule, typeof i2.OverlayModule, typeof i3.A11yModule, typeof i4.PortalModule, typeof i5.MatCommonModule, typeof i6.MatCalendar, typeof i7.MatCalendarBody, typeof i8.MatDatepicker, typeof i9.MatDatepickerContent, typeof i10.MatDatepickerInput, typeof i11.MatDatepickerToggle, typeof i11.MatDatepickerToggleIcon, typeof i12.MatMonthView, typeof i13.MatYearView, typeof i14.MatMultiYearView, typeof i6.MatCalendarHeader, typeof i15.MatDateRangeInput, typeof i16.MatStartDate, typeof i16.MatEndDate, typeof i17.MatDateRangePicker, typeof i18.MatDatepickerActions, typeof i18.MatDatepickerCancel, typeof i18.MatDatepickerApply], [typeof i19.CdkScrollableModule, typeof i6.MatCalendar, typeof i7.MatCalendarBody, typeof i8.MatDatepicker, typeof i9.MatDatepickerContent, typeof i10.MatDatepickerInput, typeof i11.MatDatepickerToggle, typeof i11.MatDatepickerToggleIcon, typeof i12.MatMonthView, typeof i13.MatYearView, typeof i14.MatMultiYearView, typeof i6.MatCalendarHeader, typeof i15.MatDateRangeInput, typeof i16.MatStartDate, typeof i16.MatEndDate, typeof i17.MatDateRangePicker, typeof i18.MatDatepickerActions, typeof i18.MatDatepickerCancel, typeof i18.MatDatepickerApply]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MatDatepickerModule>;
 }
 

package/dialog/_dialog-theme.scss

@@ -11,14 +11,17 @@
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
-  }
-  @else {
+  } @else {
     // Add default values for tokens not related to color, typography, or density.
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
-        tokens-mdc-dialog.$prefix, tokens-mdc-dialog.get-unthemable-tokens());
+        tokens-mdc-dialog.$prefix,
+        tokens-mdc-dialog.get-unthemable-tokens()
+      );
       @include token-utils.create-token-values(
-        tokens-mat-dialog.$prefix, tokens-mat-dialog.get-unthemable-tokens());
+        tokens-mat-dialog.$prefix,
+        tokens-mat-dialog.get-unthemable-tokens()
+      );
     }
   }
 }
@@ -26,13 +29,16 @@
 @mixin color($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
-        tokens-mdc-dialog.$prefix, tokens-mdc-dialog.get-color-tokens($theme));
+        tokens-mdc-dialog.$prefix,
+        tokens-mdc-dialog.get-color-tokens($theme)
+      );
       @include token-utils.create-token-values(
-        tokens-mat-dialog.$prefix, tokens-mat-dialog.get-color-tokens($theme));
+        tokens-mat-dialog.$prefix,
+        tokens-mat-dialog.get-color-tokens($theme)
+      );
     }
   }
 }
@@ -40,13 +46,16 @@
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
-        tokens-mdc-dialog.$prefix, tokens-mdc-dialog.get-typography-tokens($theme));
+        tokens-mdc-dialog.$prefix,
+        tokens-mdc-dialog.get-typography-tokens($theme)
+      );
       @include token-utils.create-token-values(
-        tokens-mat-dialog.$prefix, tokens-mat-dialog.get-typography-tokens($theme));
+        tokens-mat-dialog.$prefix,
+        tokens-mat-dialog.get-typography-tokens($theme)
+      );
     }
   }
 }
@@ -54,24 +63,33 @@
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
+  } @else {
   }
-  @else {}
 }
 
-@mixin overrides($tokens: ()) {
-  @include token-utils.batch-create-token-values(
-    $tokens,
-    (prefix: tokens-mdc-dialog.$prefix, tokens: tokens-mdc-dialog.get-token-slots()),
-    (prefix: tokens-mat-dialog.$prefix, tokens: tokens-mat-dialog.get-token-slots()),
+/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
+@function _define-overrides() {
+  @return (
+    (
+      namespace: tokens-mdc-dialog.$prefix,
+      tokens: tokens-mdc-dialog.get-token-slots(),
+    ),
+    (
+      namespace: tokens-mat-dialog.$prefix,
+      tokens: tokens-mat-dialog.get-token-slots(),
+    ),
   );
 }
 
+@mixin overrides($tokens: ()) {
+  @include token-utils.batch-create-token-values($tokens, _define-overrides()...);
+}
+
 @mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-dialog') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme));
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -88,11 +106,16 @@
 
 @mixin _theme-from-tokens($tokens) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
   @if ($tokens != ()) {
     @include token-utils.create-token-values(
-      tokens-mdc-dialog.$prefix, map.get($tokens, tokens-mdc-dialog.$prefix));
+      tokens-mdc-dialog.$prefix,
+      map.get($tokens, tokens-mdc-dialog.$prefix)
+    );
     @include token-utils.create-token-values(
-      tokens-mat-dialog.$prefix, map.get($tokens, tokens-mat-dialog.$prefix));
+      tokens-mat-dialog.$prefix,
+      map.get($tokens, tokens-mat-dialog.$prefix)
+    );
   }
 }

package/divider/_divider-theme.scss

@@ -9,11 +9,12 @@
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
-          tokens-mat-divider.$prefix, tokens-mat-divider.get-unthemable-tokens());
+        tokens-mat-divider.$prefix,
+        tokens-mat-divider.get-unthemable-tokens()
+      );
     }
   }
 }
@@ -21,11 +22,12 @@
 @mixin color($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-divider.$prefix,
-        tokens-mat-divider.get-color-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-divider.$prefix,
+        tokens-mat-divider.get-color-tokens($theme)
+      );
     }
   }
 }
@@ -33,30 +35,36 @@
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
+  } @else {
   }
-  @else {}
 }
 
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
+  } @else {
   }
-  @else {}
 }
 
-@mixin overrides($tokens: ()) {
-  @include token-utils.batch-create-token-values(
-    $tokens,
-    (prefix: tokens-mat-divider.$prefix, tokens: tokens-mat-divider.get-token-slots()),
+/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
+@function _define-overrides() {
+  @return (
+    (
+      namespace: tokens-mat-divider.$prefix,
+      tokens: tokens-mat-divider.get-token-slots(),
+    ),
   );
 }
 
+@mixin overrides($tokens: ()) {
+  @include token-utils.batch-create-token-values($tokens, _define-overrides()...);
+}
+
 @mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-divider') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme));
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -73,9 +81,12 @@
 
 @mixin _theme-from-tokens($tokens) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
   @if ($tokens != ()) {
     @include token-utils.create-token-values(
-        tokens-mat-divider.$prefix, map.get($tokens, tokens-mat-divider.$prefix));
+      tokens-mat-divider.$prefix,
+      map.get($tokens, tokens-mat-divider.$prefix)
+    );
   }
 }

package/expansion/_expansion-theme.scss

@@ -10,11 +10,12 @@
 @mixin base($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values(
-          tokens-mat-expansion.$prefix, tokens-mat-expansion.get-unthemable-tokens());
+        tokens-mat-expansion.$prefix,
+        tokens-mat-expansion.get-unthemable-tokens()
+      );
     }
   }
 }
@@ -22,11 +23,12 @@
 @mixin color($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-expansion.$prefix,
-        tokens-mat-expansion.get-color-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-expansion.$prefix,
+        tokens-mat-expansion.get-color-tokens($theme)
+      );
     }
   }
 }
@@ -34,14 +36,15 @@
 @mixin typography($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
-  }
-  @else {
+  } @else {
     // TODO(mmalerba): Stop calling this and resolve resulting screen diffs.
     $theme: inspection.private-get-typography-back-compat-theme($theme);
 
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-expansion.$prefix,
-        tokens-mat-expansion.get-typography-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-expansion.$prefix,
+        tokens-mat-expansion.get-typography-tokens($theme)
+      );
     }
   }
 }
@@ -49,28 +52,35 @@
 @mixin density($theme) {
   @if inspection.get-theme-version($theme) == 1 {
     @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
-  }
-  @else {
+  } @else {
     @include sass-utils.current-selector-or-root() {
-      @include token-utils.create-token-values(tokens-mat-expansion.$prefix,
-        tokens-mat-expansion.get-density-tokens($theme));
+      @include token-utils.create-token-values(
+        tokens-mat-expansion.$prefix,
+        tokens-mat-expansion.get-density-tokens($theme)
+      );
     }
   }
 }
 
-@mixin overrides($tokens: ()) {
-  @include token-utils.batch-create-token-values(
-    $tokens,
-    (prefix: tokens-mat-expansion.$prefix, tokens: tokens-mat-expansion.get-token-slots()),
+/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
+@function _define-overrides() {
+  @return (
+    (
+      namespace: tokens-mat-expansion.$prefix,
+      tokens: tokens-mat-expansion.get-token-slots(),
+    ),
   );
 }
 
+@mixin overrides($tokens: ()) {
+  @include token-utils.batch-create-token-values($tokens, _define-overrides()...);
+}
+
 @mixin theme($theme) {
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-expansion') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme));
-    }
-    @else {
+    } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {
         @include color($theme);
@@ -85,12 +95,14 @@
   }
 }
 
-
 @mixin _theme-from-tokens($tokens) {
   @include validation.selector-defined(
-      'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
+    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector'
+  );
   @if ($tokens != ()) {
     @include token-utils.create-token-values(
-        tokens-mat-expansion.$prefix, map.get($tokens, tokens-mat-expansion.$prefix));
+      tokens-mat-expansion.$prefix,
+      map.get($tokens, tokens-mat-expansion.$prefix)
+    );
   }
 }