@angular/material 11.0.3 → 11.1.1

package/checkbox/_checkbox-theme.scss

@@ -1,5 +1,4 @@
 @import '../core/theming/theming';
-@import '../core/theming/check-duplicate-styles';
 @import '../core/typography/typography-utils';
 
 
@@ -111,8 +110,8 @@
 @mixin _mat-checkbox-density($config-or-theme) {}
 
 @mixin mat-checkbox-theme($theme-or-color-config) {
-  $theme: _mat-legacy-get-theme($theme-or-color-config);
-  @include _mat-check-duplicate-theme-styles($theme, 'mat-checkbox') {
+  $theme: mat-private-legacy-get-theme($theme-or-color-config);
+  @include mat-private-check-duplicate-theme-styles($theme, 'mat-checkbox') {
     $color: mat-get-color-config($theme);
     $density: mat-get-density-config($theme);
     $typography: mat-get-typography-config($theme);

package/checkbox/testing/checkbox-harness.d.ts

@@ -5,22 +5,11 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-import { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
+import { AsyncFactoryFn, ComponentHarness, HarnessPredicate, TestElement } from '@angular/cdk/testing';
 import { CheckboxHarnessFilters } from './checkbox-harness-filters';
-/** Harness for interacting with a standard mat-checkbox in tests. */
-export declare class MatCheckboxHarness extends ComponentHarness {
-    /** The selector for the host element of a `MatCheckbox` instance. */
-    static hostSelector: string;
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for a `MatCheckboxHarness` that meets
-     * certain criteria.
-     * @param options Options for filtering which checkbox instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options?: CheckboxHarnessFilters): HarnessPredicate<MatCheckboxHarness>;
-    private _label;
-    private _input;
-    private _inputContainer;
+export declare abstract class _MatCheckboxHarnessBase extends ComponentHarness {
+    protected abstract _input: AsyncFactoryFn<TestElement>;
+    protected abstract _label: AsyncFactoryFn<TestElement>;
     /** Whether the checkbox is checked. */
     isChecked(): Promise<boolean>;
     /** Whether the checkbox is in an indeterminate state. */
@@ -54,7 +43,7 @@ export declare class MatCheckboxHarness extends ComponentHarness {
      * are using `MAT_CHECKBOX_DEFAULT_OPTIONS` to change the behavior on click, calling this method
      * might not have the expected result.
      */
-    toggle(): Promise<void>;
+    abstract toggle(): Promise<void>;
     /**
      * Puts the checkbox in a checked state by toggling it if it is currently unchecked, or doing
      * nothing if it is already checked.
@@ -74,3 +63,19 @@ export declare class MatCheckboxHarness extends ComponentHarness {
      */
     uncheck(): Promise<void>;
 }
+/** Harness for interacting with a standard mat-checkbox in tests. */
+export declare class MatCheckboxHarness extends _MatCheckboxHarnessBase {
+    /** The selector for the host element of a `MatCheckbox` instance. */
+    static hostSelector: string;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a `MatCheckboxHarness` that meets
+     * certain criteria.
+     * @param options Options for filtering which checkbox instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options?: CheckboxHarnessFilters): HarnessPredicate<MatCheckboxHarness>;
+    protected _input: AsyncFactoryFn<TestElement>;
+    protected _label: AsyncFactoryFn<TestElement>;
+    private _inputContainer;
+    toggle(): Promise<void>;
+}

package/chips/_chips-theme.scss

@@ -1,7 +1,6 @@
-@import '../core/style/elevation';
+@import '../core/style/private';
 @import '../core/theming/palette';
 @import '../core/theming/theming';
-@import '../core/theming/check-duplicate-styles';
 @import '../core/typography/typography-utils';
 
 $mat-chip-remove-font-size: 18px;
@@ -55,7 +54,7 @@ $mat-chip-remove-font-size: 18px;
 
     &:not(.mat-chip-disabled) {
       &:active {
-        @include _mat-theme-elevation(3, $config);
+        @include mat-private-theme-elevation(3, $config);
       }
 
       .mat-chip-remove:hover {
@@ -103,8 +102,8 @@ $mat-chip-remove-font-size: 18px;
 @mixin _mat-chips-density($config-or-theme) {}
 
 @mixin mat-chips-theme($theme-or-color-config) {
-  $theme: _mat-legacy-get-theme($theme-or-color-config);
-  @include _mat-check-duplicate-theme-styles($theme, 'mat-chips') {
+  $theme: mat-private-legacy-get-theme($theme-or-color-config);
+  @include mat-private-check-duplicate-theme-styles($theme, 'mat-chips') {
     $color: mat-get-color-config($theme);
     $density: mat-get-density-config($theme);
     $typography: mat-get-typography-config($theme);

package/chips/testing/chip-harness-filters.d.ts

@@ -6,20 +6,28 @@
  * found in the LICENSE file at https://angular.io/license
  */
 import { BaseHarnessFilters } from '@angular/cdk/testing';
-/** A set of criteria that can be used to filter a list of `MatChipHarness` instances. */
+/** A set of criteria that can be used to filter a list of chip instances. */
 export interface ChipHarnessFilters extends BaseHarnessFilters {
     /** Only find instances whose text matches the given value. */
     text?: string | RegExp;
     /**
      * Only find chip instances whose selected state matches the given value.
-     * @deprecated Will be moved into separate selection-specific harness.
+     * @deprecated Use `MatChipOptionHarness` together with `ChipOptionHarnessFilters`.
      * @breaking-change 12.0.0
      */
     selected?: boolean;
 }
-/** A set of criteria that can be used to filter a list of `MatChipListHarness` instances. */
+/** A set of criteria that can be used to filter a list of selectable chip instances. */
+export interface ChipOptionHarnessFilters extends ChipHarnessFilters {
+    /** Only find chip instances whose selected state matches the given value. */
+    selected?: boolean;
+}
+/** A set of criteria that can be used to filter chip list instances. */
 export interface ChipListHarnessFilters extends BaseHarnessFilters {
 }
+/** A set of criteria that can be used to filter selectable chip list instances. */
+export interface ChipListboxHarnessFilters extends BaseHarnessFilters {
+}
 /** A set of criteria that can be used to filter a list of `MatChipListInputHarness` instances. */
 export interface ChipInputHarnessFilters extends BaseHarnessFilters {
     /** Filters based on the value of the input. */

package/chips/testing/chip-harness.d.ts

@@ -8,7 +8,7 @@
 import { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
 import { ChipHarnessFilters, ChipRemoveHarnessFilters } from './chip-harness-filters';
 import { MatChipRemoveHarness } from './chip-remove-harness';
-/** Harness for interacting with a standard Angular Material chip in tests. */
+/** Harness for interacting with a standard selectable Angular Material chip in tests. */
 export declare class MatChipHarness extends ComponentHarness {
     /** The selector for the host element of a `MatChip` instance. */
     static hostSelector: string;
@@ -23,7 +23,7 @@ export declare class MatChipHarness extends ComponentHarness {
     getText(): Promise<string>;
     /**
      * Whether the chip is selected.
-     * @deprecated Will be moved into separate selection-specific harness.
+     * @deprecated Use `MatChipOptionHarness.isSelected` instead.
      * @breaking-change 12.0.0
      */
     isSelected(): Promise<boolean>;
@@ -31,19 +31,19 @@ export declare class MatChipHarness extends ComponentHarness {
     isDisabled(): Promise<boolean>;
     /**
      * Selects the given chip. Only applies if it's selectable.
-     * @deprecated Will be moved into separate selection-specific harness.
+     * @deprecated Use `MatChipOptionHarness.select` instead.
      * @breaking-change 12.0.0
      */
     select(): Promise<void>;
     /**
      * Deselects the given chip. Only applies if it's selectable.
-     * @deprecated Will be moved into separate selection-specific harness.
+     * @deprecated Use `MatChipOptionHarness.deselect` instead.
      * @breaking-change 12.0.0
      */
     deselect(): Promise<void>;
     /**
      * Toggles the selected state of the given chip. Only applies if it's selectable.
-     * @deprecated Will be moved into separate selection-specific harness.
+     * @deprecated Use `MatChipOptionHarness.toggle` instead.
      * @breaking-change 12.0.0
      */
     toggle(): Promise<void>;

package/chips/testing/chip-list-harness.d.ts

@@ -9,17 +9,8 @@ import { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
 import { MatChipHarness } from './chip-harness';
 import { MatChipInputHarness } from './chip-input-harness';
 import { ChipListHarnessFilters, ChipHarnessFilters, ChipInputHarnessFilters } from './chip-harness-filters';
-/** Harness for interacting with a standard chip list in tests. */
-export declare class MatChipListHarness extends ComponentHarness {
-    /** The selector for the host element of a `MatChipList` instance. */
-    static hostSelector: string;
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for a `MatChipListHarness` that meets
-     * certain criteria.
-     * @param options Options for filtering which chip list instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options?: ChipListHarnessFilters): HarnessPredicate<MatChipListHarness>;
+/** Base class for chip list harnesses. */
+export declare abstract class _MatChipListHarnessBase extends ComponentHarness {
     /** Gets whether the chip list is disabled. */
     isDisabled(): Promise<boolean>;
     /** Gets whether the chip list is required. */
@@ -30,6 +21,18 @@ export declare class MatChipListHarness extends ComponentHarness {
     isMultiple(): Promise<boolean>;
     /** Gets whether the orientation of the chip list. */
     getOrientation(): Promise<'horizontal' | 'vertical'>;
+}
+/** Harness for interacting with a standard chip list in tests. */
+export declare class MatChipListHarness extends _MatChipListHarnessBase {
+    /** The selector for the host element of a `MatChipList` instance. */
+    static hostSelector: string;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a `MatChipListHarness` that meets
+     * certain criteria.
+     * @param options Options for filtering which chip list instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options?: ChipListHarnessFilters): HarnessPredicate<MatChipListHarness>;
     /**
      * Gets the list of chips inside the chip list.
      * @param filter Optionally filters which chips are included.
@@ -39,7 +42,7 @@ export declare class MatChipListHarness extends ComponentHarness {
      * Selects a chip inside the chip list.
      * @param filter An optional filter to apply to the child chips.
      *    All the chips matching the filter will be selected.
-     * @deprecated Will be moved into separate selection-specific harness.
+     * @deprecated Use `MatChipListboxHarness.selectChips` instead.
      * @breaking-change 12.0.0
      */
     selectChips(filter?: ChipHarnessFilters): Promise<void>;

package/chips/testing/chip-listbox-harness.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { HarnessPredicate } from '@angular/cdk/testing';
+import { MatChipOptionHarness } from './chip-option-harness';
+import { ChipListboxHarnessFilters, ChipOptionHarnessFilters } from './chip-harness-filters';
+import { _MatChipListHarnessBase } from './chip-list-harness';
+/** Harness for interacting with a standard selectable chip list in tests. */
+export declare class MatChipListboxHarness extends _MatChipListHarnessBase {
+    /** The selector for the host element of a `MatChipList` instance. */
+    static hostSelector: string;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a `MatChipListHarness` that meets
+     * certain criteria.
+     * @param options Options for filtering which chip list instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options?: ChipListboxHarnessFilters): HarnessPredicate<MatChipListboxHarness>;
+    /**
+     * Gets the list of chips inside the chip list.
+     * @param filter Optionally filters which chips are included.
+     */
+    getChips(filter?: ChipOptionHarnessFilters): Promise<MatChipOptionHarness[]>;
+    /**
+     * Selects a chip inside the chip list.
+     * @param filter An optional filter to apply to the child chips.
+     *    All the chips matching the filter will be selected.
+     */
+    selectChips(filter?: ChipOptionHarnessFilters): Promise<void>;
+}

package/chips/testing/chip-option-harness.d.ts

@@ -0,0 +1,29 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { HarnessPredicate } from '@angular/cdk/testing';
+import { MatChipHarness } from './chip-harness';
+import { ChipOptionHarnessFilters } from './chip-harness-filters';
+export declare class MatChipOptionHarness extends MatChipHarness {
+    /** The selector for the host element of a selectable chip instance. */
+    static hostSelector: string;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a `MatChipOptionHarness`
+     * that meets certain criteria.
+     * @param options Options for filtering which chip instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options?: ChipOptionHarnessFilters): HarnessPredicate<MatChipOptionHarness>;
+    /** Whether the chip is selected. */
+    isSelected(): Promise<boolean>;
+    /** Selects the given chip. Only applies if it's selectable. */
+    select(): Promise<void>;
+    /** Deselects the given chip. Only applies if it's selectable. */
+    deselect(): Promise<void>;
+    /** Toggles the selected state of the given chip. */
+    toggle(): Promise<void>;
+}

package/chips/testing/public-api.d.ts

@@ -7,6 +7,8 @@
  */
 export * from './chip-harness';
 export * from './chip-harness-filters';
-export * from './chip-list-harness';
+export { MatChipListHarness } from './chip-list-harness';
 export * from './chip-input-harness';
 export * from './chip-remove-harness';
+export * from './chip-option-harness';
+export * from './chip-listbox-harness';

package/core/_core.scss

@@ -3,7 +3,7 @@
 @import '../../cdk/text-field/text-field';
 
 // Core styles that can be used to apply material design treatments to any element.
-@import './style/elevation';
+@import './style/private';
 @import './ripple/ripple';
 @import './focus-indicators/focus-indicators';
 @import './option/option-theme';
@@ -19,7 +19,7 @@
   @include cdk-overlay();
   @include cdk-text-field();
 
-  @include _mat-strong-focus-indicators-positioning();
+  @include mat-private-strong-focus-indicators-positioning();
   @include _mat-mdc-core();
 }
 
@@ -40,8 +40,8 @@
   // `mat-elevation-z$zValue` where `$zValue` corresponds to the z-space to which the element is
   // elevated.
   @for $zValue from 0 through 24 {
-    .#{$_mat-elevation-prefix}#{$zValue} {
-      @include _mat-theme-elevation($zValue, $config);
+    .#{$mat-elevation-prefix}#{$zValue} {
+      @include mat-private-theme-elevation($zValue, $config);
     }
   }
 
@@ -55,11 +55,11 @@
 
 // Mixin that renders all of the core styles that depend on the theme.
 @mixin mat-core-theme($theme-or-color-config) {
-  $theme: _mat-legacy-get-theme($theme-or-color-config);
+  $theme: mat-private-legacy-get-theme($theme-or-color-config);
   // Wrap the sub-theme includes in the duplicate theme styles mixin. This ensures that
   // there won't be multiple warnings. e.g. if `mat-core-theme` reports a warning, then
   // the imported themes (such as `mat-ripple-theme`) should not report again.
-  @include _mat-check-duplicate-theme-styles($theme, 'mat-core') {
+  @include mat-private-check-duplicate-theme-styles($theme, 'mat-core') {
     @include mat-ripple-theme($theme);
     @include mat-option-theme($theme);
     @include mat-optgroup-theme($theme);

package/core/color/_all-color.scss

@@ -1,10 +1,11 @@
 @import '../theming/all-theme';
+@import '../theming/theming';
 
 // Includes all of the color styles.
 @mixin angular-material-color($config-or-theme) {
   // In case a theme object has been passed instead of a configuration for
   // the color system, extract the color config from the theme object.
-  $config: if(_mat-is-theme-object($config-or-theme),
+  $config: if(mat-private-is-theme-object($config-or-theme),
       mat-get-color-config($config-or-theme), $config-or-theme);
 
   @if $config == null {

package/core/datetime/date-formats.d.ts

@@ -12,6 +12,7 @@ export declare type MatDateFormats = {
     };
     display: {
         dateInput: any;
+        monthLabel?: any;
         monthYearLabel: any;
         dateA11yLabel: any;
         monthYearA11yLabel: any;

package/core/density/private/_all-density.scss

@@ -0,0 +1,34 @@
+@import '../../theming/theming';
+@import '../../../expansion/expansion-theme';
+@import '../../../stepper/stepper-theme';
+@import '../../../toolbar/toolbar-theme';
+@import '../../../tree/tree-theme';
+@import '../../../paginator/paginator-theme';
+@import '../../../form-field/form-field-theme';
+@import '../../../button-toggle/button-toggle-theme';
+
+// Includes all of the density styles.
+@mixin angular-material-density($config-or-theme) {
+  // In case a theme object has been passed instead of a configuration for
+  // the density system, extract the density config from the theme object.
+  $config: if(mat-private-is-theme-object($config-or-theme),
+      mat-get-density-config($config-or-theme), $config-or-theme);
+
+  @if $config == null {
+    @error 'No density configuration specified.';
+  }
+
+  // TODO: COMP-309: Do not use individual mixins. Instead, use the all-theme mixin and only
+  // specify a `density` config while setting `color` and `typography` to `null`. This is currently
+  // not possible as it would introduce a circular dependency for density because the `mat-core`
+  // mixin that is transitively loaded by the `all-theme` file, imports `all-density` which
+  // would then load `all-theme` again. This ultimately results a circular dependency.
+
+  @include mat-expansion-panel-density($config);
+  @include mat-stepper-density($config);
+  @include mat-toolbar-density($config);
+  @include mat-tree-density($config);
+  @include mat-paginator-density($config);
+  @include mat-form-field-density($config);
+  @include mat-button-toggle-density($config);
+}

package/core/density/{_index.scss → private/_compatibility.scss}

@@ -1,3 +1,6 @@
+// Note that this file is called `private`, because the APIs in it aren't public yet.
+// Once they're made available, the code should be moved out into an `index.scss`.
+
 // Taken from mat-density with small modifications to not rely on the new Sass module
 // system, and to support arbitrary properties in a density configuration.
 // https://github.com/material-components/material-components-web/blob/master/packages/mdc-density
@@ -10,15 +13,15 @@ $_mat-density-default-scale: 0 !default;
 
 // Whether density should be generated at root. This will be temporarily set to `true`
 // whenever density styles for legacy themes are generated.
-$_mat-density-generate-at-root: false;
+$mat-private-density-generate-at-root: false;
 // Whether density styles should be generated. This will be temporarily set to `false` if
 // duplicate density styles for a legacy theme would be generated. For legacy themes,
 // we always generate the default density **only once** at root.
-$_mat-density-generate-styles: true;
+$mat-private-density-generate-styles: true;
 
 // Mixin that can be used to wrap density styles of given components. The mixin will
-// move the density styles to root if the `$_mat-density-generate-at-root` global variable
-// is set. If `$_mat-density-generate-styles` is set to `false`, generation of density
+// move the density styles to root if the `$mat-private-density-generate-at-root` global variable
+// is set. If `$mat-private-density-generate-styles` is set to `false`, generation of density
 // styles wrapped in this mixin is skipped. This mixin exists to improve backwards compatibility
 // of the new theming API where density styles are included as part of themes. Previously,
 // density styles of components were part of their base styles. With the new API, they are
@@ -28,18 +31,18 @@ $_mat-density-generate-styles: true;
 // density styles. This is breaking as it increases specificity of density styles. This mixin
 // provides an API to control generation of density styles so that we can ensure they are only
 // created *once* and at root.
-@mixin _mat-density-legacy-compatibility() {
-  @if $_mat-density-generate-styles and $_mat-density-generate-at-root {
+@mixin mat-private-density-legacy-compatibility() {
+  @if $mat-private-density-generate-styles and $mat-private-density-generate-at-root {
     @at-root {
       @content;
     }
   }
-  @else if $_mat-density-generate-styles {
+  @else if $mat-private-density-generate-styles {
     @content;
   }
 }
 
-@function _mat-density-prop-value($density-config, $density-scale, $property-name) {
+@function mat-private-density-prop-value($density-config, $density-scale, $property-name) {
   @if (type-of($density-scale) == 'string' and
       index($list: $_mat-density-supported-scales, $value: $density-scale) == null) {
     @error 'mat-density: Supported density scales #{$_mat-density-supported-scales}, '  +

package/core/focus-indicators/_focus-indicators.scss

@@ -1,5 +1,4 @@
 @import '../theming/theming';
-@import '../theming/check-duplicate-styles';
 @import '../style/layout-common';
 
 /// Mixin that turns on strong focus indicators.
@@ -111,8 +110,8 @@
     @include _mat-strong-focus-indicators-border-color($theme-or-color);
   }
   @else {
-    $theme: _mat-legacy-get-theme($theme-or-color);
-    @include _mat-check-duplicate-theme-styles($theme, 'mat-strong-focus-indicators') {
+    $theme: mat-private-legacy-get-theme($theme-or-color);
+    @include mat-private-check-duplicate-theme-styles($theme, 'mat-strong-focus-indicators') {
       $color: mat-get-color-config($theme);
       @if $color != null {
         @include mat-strong-focus-indicators-color($color);
@@ -124,7 +123,7 @@
 // Mixin that ensures focus indicator host elements are positioned so that the focus indicator
 // pseudo element within is positioned relative to the host. Private mixin included within
 // `mat-core`.
-@mixin _mat-strong-focus-indicators-positioning() {
+@mixin mat-private-strong-focus-indicators-positioning() {
   .mat-focus-indicator {
     position: relative;
   }