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

package/select/_m3-select.scss

@@ -1,7 +1,10 @@
 @use 'sass:map';
+@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);
@@ -46,3 +49,13 @@ $prefix: (mat, select);
 
   @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

@@ -5,6 +5,7 @@
 @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.
@@ -71,7 +72,8 @@
 /// @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(
@@ -107,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) {

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-8839a0c2.js';
-export { a as MatOptgroup, M as MatOption } from '../option.d-4fb11594.js';
-export { M as MatLabel } from '../module.d-683b2a19.js';
-export { a as MatError, k as MatFormField, b as MatHint, d as MatPrefix, f as MatSuffix } from '../form-field.d-486f4e86.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-73f24bb1.js';
-import '../index.d-511f9e6c.js';
-import '../common-module.d-421e3498.js';
+import '../index.d-osnm7rw7.js';
+import '../index.d-_XdEyDn3.js';
+import '../common-module.d-CUT8AqiB.js';
 import '@angular/cdk/bidi';
-import '../ripple.d-305c30f3.js';
+import '../ripple.d-DBFnJ3Aa.js';
 import '@angular/cdk/platform';
-import '../pseudo-checkbox-module.d-42351ab6.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-059d9639.js';
-import '../form-field-control.d-9ed49092.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-1d8ebc0d.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-485a3cf8.js';
-import '@angular/cdk/testing';
-import '../../option-harness.d-4f143bc0.js';
-import '../../optgroup-harness.d-c52f5a8b.js';
-import '../../form-field-control-harness.d-e3cf007b.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/sidenav/_sidenav-theme.scss

@@ -37,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 {
   }
 }

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-421e3498.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';

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 {

package/slide-toggle/_slide-toggle-theme.scss

@@ -119,7 +119,7 @@
 /// @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));
+    // There are no M3 density tokens for this component
   } @else {
     @include sass-utils.current-selector-or-root() {
       // TODO: See if this can be removed

package/slide-toggle/index.d.ts

@@ -2,8 +2,8 @@ import * as i0 from '@angular/core';
 import { InjectionToken, OnDestroy, AfterContentInit, OnChanges, ChangeDetectorRef, ElementRef, EventEmitter, SimpleChanges } from '@angular/core';
 import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
 import { FocusMonitor } from '@angular/cdk/a11y';
-import { T as ThemePalette } from '../palette.d-1d8ebc0d.js';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
+import { ThemePalette } from '../palette.d-fF1us9u8.js';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
 import '@angular/cdk/bidi';
 
 /** Default `mat-slide-toggle` options that can be overridden. */

package/slider/_slider-theme.scss

@@ -63,7 +63,7 @@
 /// @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));
+    // There are no M3 density tokens for this component
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(

package/slider/index.d.ts

@@ -1,12 +1,12 @@
 import { Directionality } from '@angular/cdk/bidi';
 import * as i0 from '@angular/core';
-import { ChangeDetectorRef, WritableSignal, AfterViewInit, OnDestroy, NgZone, ElementRef, QueryList, EventEmitter } from '@angular/core';
-import { T as ThemePalette } from '../palette.d-1d8ebc0d.js';
-import { b as RippleGlobalOptions, M as MatRipple } from '../ripple.d-305c30f3.js';
+import { WritableSignal, ChangeDetectorRef, AfterViewInit, OnDestroy, NgZone, ElementRef, QueryList, EventEmitter } from '@angular/core';
+import { ThemePalette } from '../palette.d-fF1us9u8.js';
+import { MatRipple, RippleGlobalOptions } from '../ripple.d-DBFnJ3Aa.js';
 import { ControlValueAccessor } from '@angular/forms';
 import { Subject } from 'rxjs';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
-import { M as MatRippleModule } from '../index.d-511f9e6c.js';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
+import { MatRippleModule } from '../index.d-_XdEyDn3.js';
 import '@angular/cdk/platform';
 
 /**

package/snack-bar/index.d.ts

@@ -5,15 +5,15 @@ import { AriaLivePoliteness } from '@angular/cdk/a11y';
 import * as i3 from '@angular/cdk/portal';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal, DomPortal } from '@angular/cdk/portal';
 import * as i0 from '@angular/core';
-import { InjectionToken, ViewContainerRef, OnDestroy, ElementRef, ComponentRef, EmbeddedViewRef, TemplateRef } from '@angular/core';
+import { ViewContainerRef, InjectionToken, OnDestroy, ElementRef, ComponentRef, EmbeddedViewRef, TemplateRef } from '@angular/core';
 import { Direction } from '@angular/cdk/bidi';
-import { n as MatButtonModule } from '../module.d-9a1d1c76.js';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
-import '../index.d-511f9e6c.js';
-import '../ripple.d-305c30f3.js';
+import { MatButtonModule } from '../button/index.js';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
+import '../palette.d-fF1us9u8.js';
+import '../ripple-loader.d-DL-hT7NH.js';
+import '../index.d-_XdEyDn3.js';
+import '../ripple.d-DBFnJ3Aa.js';
 import '@angular/cdk/platform';
-import '../palette.d-1d8ebc0d.js';
-import '../ripple-loader.d-f51e5eb6.js';
 
 /** Injection token that can be used to access the data that was passed in to a snack bar. */
 declare const MAT_SNACK_BAR_DATA: InjectionToken<any>;

package/sort/_sort-theme.scss

@@ -38,7 +38,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 {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(

package/sort/index.d.ts

@@ -1,10 +1,9 @@
 import * as i0 from '@angular/core';
 import { Optional, OnDestroy, OnInit, AfterViewInit } from '@angular/core';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
-import { M as MatSortable, a as MatSort, S as SortHeaderArrowPosition } from '../sort.d-7718b3de.js';
-export { d as MAT_SORT_DEFAULT_OPTIONS, a as MatSort, c as MatSortDefaultOptions, M as MatSortable, b as Sort, S as SortHeaderArrowPosition } from '../sort.d-7718b3de.js';
-import { S as SortDirection } from '../sort-direction.d-52bce05e.js';
-export { S as SortDirection } from '../sort-direction.d-52bce05e.js';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
+import { MatSortable, MatSort, SortHeaderArrowPosition } from '../sort.d-CHu7FXsP.js';
+export { MAT_SORT_DEFAULT_OPTIONS, MatSortDefaultOptions, Sort } from '../sort.d-CHu7FXsP.js';
+import { SortDirection } from '../sort-direction.d-Dlz8961P.js';
 import { Subject } from 'rxjs';
 import '@angular/cdk/bidi';
 
@@ -160,5 +159,5 @@ declare const matSortAnimations: {
     readonly allowChildren: any;
 };
 
-export { MAT_SORT_HEADER_INTL_PROVIDER, MAT_SORT_HEADER_INTL_PROVIDER_FACTORY, MatSortHeader, MatSortHeaderIntl, MatSortModule, matSortAnimations };
+export { MAT_SORT_HEADER_INTL_PROVIDER, MAT_SORT_HEADER_INTL_PROVIDER_FACTORY, MatSort, MatSortHeader, MatSortHeaderIntl, MatSortModule, MatSortable, SortDirection, SortHeaderArrowPosition, matSortAnimations };
 export type { ArrowViewState, ArrowViewStateTransition };

package/sort/testing/index.d.ts

@@ -1,5 +1,5 @@
 import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
-import { S as SortDirection } from '../../sort-direction.d-52bce05e.js';
+import { SortDirection } from '../../sort-direction.d-Dlz8961P.js';
 
 interface SortHarnessFilters extends BaseHarnessFilters {
 }

package/{sort-direction.d-52bce05e.d.ts → sort-direction.d-Dlz8961P.d.ts}

@@ -1,3 +1,3 @@
 type SortDirection = 'asc' | 'desc' | '';
 
-export type { SortDirection as S };
+export type { SortDirection };

package/{sort.d-7718b3de.d.ts → sort.d-CHu7FXsP.d.ts}

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, OnChanges, OnDestroy, OnInit, EventEmitter } from '@angular/core';
+import { OnChanges, OnDestroy, OnInit, EventEmitter, InjectionToken } from '@angular/core';
 import { Subject, Observable } from 'rxjs';
-import { S as SortDirection } from './sort-direction.d-52bce05e.js';
+import { SortDirection } from './sort-direction.d-Dlz8961P.js';
 
 /** Position of the arrow that displays when sorted. */
 type SortHeaderArrowPosition = 'before' | 'after';
@@ -84,5 +84,5 @@ declare class MatSort implements OnChanges, OnDestroy, OnInit {
     static ngAcceptInputType_disabled: unknown;
 }
 
-export { MatSort as a, MAT_SORT_DEFAULT_OPTIONS as d };
-export type { MatSortable as M, SortHeaderArrowPosition as S, Sort as b, MatSortDefaultOptions as c };
+export { MAT_SORT_DEFAULT_OPTIONS, MatSort };
+export type { MatSortDefaultOptions, MatSortable, Sort, SortHeaderArrowPosition };

package/stepper/_m3-stepper.scss

@@ -1,6 +1,9 @@
 @use 'sass:map';
+@use 'sass:list';
 @use '../core/style/sass-utils';
 @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, stepper);
@@ -77,3 +80,13 @@ $prefix: (mat, stepper);
 
   @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), -4);
+  $index: ($scale * -1) + 1;
+
+  @return (
+    header-height: list.nth((72px, 68px, 64px, 60px, 42px), $index),
+  );
+}

package/stepper/_stepper-theme.scss

@@ -5,6 +5,7 @@
 @use '../core/style/sass-utils';
 @use '../core/tokens/token-utils';
 @use './m2-stepper';
+@use './m3-stepper';
 
 /// Outputs base theme styles (styles not dependent on the color, typography, or density settings)
 /// for mat-stepper.
@@ -67,7 +68,8 @@
 /// @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-stepper.$prefix, m3-stepper.get-density-tokens($theme));
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
@@ -103,6 +105,9 @@
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-stepper') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
+      @if inspection.theme-has($theme, density) {
+        @include density($theme);
+      }
     } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {

package/stepper/index.d.ts

@@ -3,18 +3,18 @@ import { CdkStepLabel, StepState, CdkStepHeader, CdkStep, CdkStepper, CdkStepper
 export { StepState, StepperOrientation } from '@angular/cdk/stepper';
 import * as i0 from '@angular/core';
 import { Optional, TemplateRef, AfterViewInit, OnDestroy, AfterContentInit, QueryList, ElementRef, EventEmitter } from '@angular/core';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
 import * as i3 from '@angular/cdk/portal';
 import { TemplatePortal } from '@angular/cdk/portal';
-import { M as MatIconModule } from '../icon-module.d-a4b3b1e1.js';
-import { M as MatRippleModule } from '../index.d-511f9e6c.js';
+import { MatIconModule } from '../icon-module.d-BeibE7j0.js';
+import { MatRippleModule } from '../index.d-_XdEyDn3.js';
 import { AbstractControl, FormGroupDirective, NgForm } from '@angular/forms';
-import { T as ThemePalette } from '../palette.d-1d8ebc0d.js';
-import { E as ErrorStateMatcher } from '../error-options.d-059d9639.js';
+import { ThemePalette } from '../palette.d-fF1us9u8.js';
+import { ErrorStateMatcher } from '../error-options.d-C1yXmo10.js';
 import { FocusOrigin } from '@angular/cdk/a11y';
 import { Subject } from 'rxjs';
 import '@angular/cdk/bidi';
-import '../ripple.d-305c30f3.js';
+import '../ripple.d-DBFnJ3Aa.js';
 import '@angular/cdk/platform';
 
 declare class MatStepLabel extends CdkStepLabel {

package/table/_m3-table.scss

@@ -1,6 +1,9 @@
 @use 'sass:map';
+@use 'sass:list';
 @use '../core/style/sass-utils';
 @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, table);
@@ -27,3 +30,15 @@ $prefix: (mat, table);
 
   @return m3-utils.namespace($prefix, $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), -4);
+  $index: ($scale * -1) + 1;
+
+  @return (
+    header-container-height: list.nth((56px, 52px, 48px, 44px, 40px), $index),
+    footer-container-height: list.nth((52px, 48px, 44px, 40px, 36px), $index),
+    row-item-container-height: list.nth((52px, 48px, 44px, 40px, 36px), $index),
+  );
+}

package/table/_table-theme.scss

@@ -1,5 +1,6 @@
 @use 'sass:map';
 @use './m2-table';
+@use './m3-table';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
 @use '../core/theming/validation';
@@ -42,7 +43,7 @@
 
 @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-table.$prefix, m3-table.get-density-tokens($theme));
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(
@@ -69,6 +70,9 @@
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-table') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme));
+      @if inspection.theme-has($theme, density) {
+        @include density($theme);
+      }
     } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {

package/table/index.d.ts

@@ -1,18 +1,18 @@
 import * as i2 from '@angular/cdk/table';
-import { CdkTable, CdkCellDef, CdkHeaderCellDef, CdkFooterCellDef, CdkColumnDef, CdkHeaderCell, CdkFooterCell, CdkCell, CdkHeaderRowDef, CdkFooterRowDef, CdkRowDef, CdkHeaderRow, CdkFooterRow, CdkRow, CdkNoDataRow, CdkTextColumn } from '@angular/cdk/table';
+import { CdkTable, CdkHeaderCellDef, CdkColumnDef, CdkCellDef, CdkFooterCellDef, CdkHeaderCell, CdkCell, CdkFooterCell, CdkHeaderRowDef, CdkRowDef, CdkFooterRowDef, CdkHeaderRow, CdkRow, CdkFooterRow, CdkNoDataRow, CdkTextColumn } from '@angular/cdk/table';
 import * as i0 from '@angular/core';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
 import { Subscription, BehaviorSubject } from 'rxjs';
 import { DataSource } from '@angular/cdk/collections';
-import { M as MatPaginator } from '../paginator.d-181ff014.js';
-import { a as MatSort } from '../sort.d-7718b3de.js';
+import { MatPaginator } from '../paginator.d-Ctdtnt7L.js';
+import { MatSort } from '../sort.d-CHu7FXsP.js';
 import '@angular/cdk/bidi';
-import '../palette.d-1d8ebc0d.js';
-import '../form-field.d-486f4e86.js';
+import '../palette.d-fF1us9u8.js';
+import '../form-field.d-DeaA8Upo.js';
 import '@angular/cdk/coercion';
 import '@angular/forms';
-import '../form-field-control.d-9ed49092.js';
-import '../sort-direction.d-52bce05e.js';
+import '../form-field-control.d-39fAGkWp.js';
+import '../sort-direction.d-Dlz8961P.js';
 
 /**
  * Enables the recycle view repeater strategy, which reduces rendering latency. Not compatible with

package/table/testing/index.d.ts

@@ -1,4 +1,4 @@
-import { BaseHarnessFilters, ContentContainerComponentHarness, ComponentHarnessConstructor, HarnessPredicate, ComponentHarness } from '@angular/cdk/testing';
+import { BaseHarnessFilters, ContentContainerComponentHarness, HarnessPredicate, ComponentHarnessConstructor, ComponentHarness } from '@angular/cdk/testing';
 
 /** A set of criteria that can be used to filter a list of cell harness instances. */
 interface CellHarnessFilters extends BaseHarnessFilters {

package/tabs/_m3-tabs.scss

@@ -1,6 +1,9 @@
 @use '../core/tokens/m3-utils';
 @use '../core/style/sass-utils';
 @use 'sass:map';
+@use 'sass:list';
+@use '../core/theming/theming';
+@use '../core/theming/inspection';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, tab);
@@ -23,7 +26,6 @@ $prefix: (mat, tab);
         active-indicator-shape: m3-utils.hardcode(0, $exclude-hardcoded),
         active-label-text-color: map.get($systems, md-sys-color, on-surface),
         active-ripple-color: map.get($systems, md-sys-color, on-surface),
-        container-height: if($exclude-hardcoded, null, 48px),
         divider-color: map.get($systems, md-sys-color, surface-variant),
         divider-height: m3-utils.hardcode(1px, $exclude-hardcoded),
         inactive-focus-label-text-color: map.get($systems, md-sys-color, on-surface),
@@ -56,3 +58,13 @@ $prefix: (mat, tab);
 
   @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), -4);
+  $index: ($scale * -1) + 1;
+
+  @return (
+    container-height: list.nth((48px, 44px, 40px, 36px, 32px), $index),
+  );
+}

package/tabs/_tabs-theme.scss

@@ -1,5 +1,6 @@
 @use '../core/style/sass-utils';
 @use './m2-tabs';
+@use './m3-tabs';
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
 @use '../core/theming/validation';
@@ -95,7 +96,7 @@
 /// @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-tabs.$prefix, m3-tabs.get-density-tokens($theme));
   } @else {
     .mat-mdc-tab-header {
       @include token-utils.create-token-values-mixed(
@@ -129,6 +130,9 @@
   @include theming.private-check-duplicate-theme-styles($theme, 'mat-tabs') {
     @if inspection.get-theme-version($theme) == 1 {
       @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
+      @if inspection.theme-has($theme, density) {
+        @include density($theme);
+      }
     } @else {
       @include base($theme);
       @if inspection.theme-has($theme, color) {

package/tabs/index.d.ts

@@ -1,12 +1,12 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, TemplateRef, OnInit, OnChanges, OnDestroy, SimpleChanges, QueryList, ElementRef, AfterContentChecked, AfterContentInit, AfterViewInit, ChangeDetectorRef, EventEmitter } from '@angular/core';
-import { M as MatCommonModule } from '../common-module.d-421e3498.js';
+import { TemplateRef, InjectionToken, OnInit, OnChanges, OnDestroy, SimpleChanges, QueryList, ElementRef, AfterContentChecked, AfterContentInit, AfterViewInit, ChangeDetectorRef, EventEmitter } from '@angular/core';
+import { MatCommonModule } from '../common-module.d-CUT8AqiB.js';
 import { CdkPortal, TemplatePortal, CdkPortalOutlet } from '@angular/cdk/portal';
 import { Subject, BehaviorSubject } from 'rxjs';
 import { FocusableOption, FocusOrigin } from '@angular/cdk/a11y';
 import { Direction } from '@angular/cdk/bidi';
-import { T as ThemePalette } from '../palette.d-1d8ebc0d.js';
-import { a as RippleTarget, f as RippleConfig, b as RippleGlobalOptions } from '../ripple.d-305c30f3.js';
+import { ThemePalette } from '../palette.d-fF1us9u8.js';
+import { RippleTarget, RippleConfig, RippleGlobalOptions } from '../ripple.d-DBFnJ3Aa.js';
 import '@angular/cdk/platform';
 
 /**

package/timepicker/_timepicker-theme.scss

@@ -60,7 +60,7 @@
 /// @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));
+    // There are no M3 density tokens for this component
   } @else {
     @include sass-utils.current-selector-or-root() {
       @include token-utils.create-token-values-mixed(

package/timepicker/index.d.ts

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { OnDestroy, Signal, ModelSignal, InputSignal, InputSignalWithTransform, ElementRef, InjectionToken, TemplateRef, OutputEmitterRef } from '@angular/core';
-import { M as MatOption } from '../option.d-4fb11594.js';
-import { M as MatOptionParentComponent } from '../option-parent.d-d4243d2f.js';
+import { MatOption } from '../option.d-ef4idHSb.js';
+import { MatOptionParentComponent } from '../option-parent.d-CvnRKBST.js';
 import { ScrollStrategy } from '@angular/cdk/overlay';
 import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
 import * as i5 from '@angular/cdk/scrolling';

package/timepicker/testing/index.d.ts

@@ -1,5 +1,5 @@
 import { BaseHarnessFilters, ComponentHarness, ComponentHarnessConstructor, HarnessPredicate } from '@angular/cdk/testing';
-import { O as OptionHarnessFilters, M as MatOptionHarness } from '../../option-harness.d-4f143bc0.js';
+import { OptionHarnessFilters, MatOptionHarness } from '../../option-harness.d-BpYClwei.js';
 
 /** A set of criteria that can be used to filter a list of `MatTimepickerHarness` instances. */
 interface TimepickerHarnessFilters extends BaseHarnessFilters {