diff --git a/src/dev-app/theme.scss b/src/dev-app/theme.scss index 0c0b57964765..91b27fe001ba 100644 --- a/src/dev-app/theme.scss +++ b/src/dev-app/theme.scss @@ -86,7 +86,7 @@ $dark-theme: mat-dark-theme(( // The classes are applied conditionally based on the selected density in the dev-app layout // component. $density-scales: (-1, -2, minimum, maximum); -@each $density in$density-scales { +@each $density in $density-scales { .demo-density-#{$density} { @include angular-material-density($density); @include angular-material-mdc-density($density); diff --git a/src/material-experimental/column-resize/_column-resize.scss b/src/material-experimental/column-resize/_column-resize.scss index 98d14bc7d117..4cb7f2359c6c 100644 --- a/src/material-experimental/column-resize/_column-resize.scss +++ b/src/material-experimental/column-resize/_column-resize.scss @@ -1,6 +1,5 @@ @import '../../material/core/style/variables'; @import '../../material/core/style/vendor-prefixes'; -@import '../../material/core/theming/private'; @import '../../material/core/theming/palette'; @import '../../material/core/theming/theming'; diff --git a/src/material-experimental/mdc-button/_button-theme.scss b/src/material-experimental/mdc-button/_button-theme.scss index f4c61b317309..8a45866656eb 100644 --- a/src/material-experimental/mdc-button/_button-theme.scss +++ b/src/material-experimental/mdc-button/_button-theme.scss @@ -3,6 +3,7 @@ @import '@material/fab/mixins.import'; @import '@material/ripple/mixins.import'; @import '@material/icon-button/mixins.import'; +@import '@material/theme/mixins.import'; @import '../../material/core/ripple/ripple'; @import '../mdc-helpers/mdc-helpers'; diff --git a/src/material-experimental/mdc-core/_core.scss b/src/material-experimental/mdc-core/_core.scss index 589a7f6e4eec..dd6881fa1991 100644 --- a/src/material-experimental/mdc-core/_core.scss +++ b/src/material-experimental/mdc-core/_core.scss @@ -1,4 +1,4 @@ -@import '../../material/core/theming/private'; +@import '../../material/core/theming/theming'; @import './option/option-theme'; @import './option/optgroup-theme'; diff --git a/src/material-experimental/mdc-core/option/_optgroup-theme.scss b/src/material-experimental/mdc-core/option/_optgroup-theme.scss index e31ab03f6292..dee79df87107 100644 --- a/src/material-experimental/mdc-core/option/_optgroup-theme.scss +++ b/src/material-experimental/mdc-core/option/_optgroup-theme.scss @@ -1,8 +1,9 @@ @import '@material/list/mixins.import'; @import '@material/list/variables.import'; @import '@material/theme/functions.import'; +@import '@material/theme/mixins.import'; @import '../../mdc-helpers/mdc-helpers'; -@import '../../../material/core/theming/private'; +@import '../../../material/core/theming/theming'; @mixin mat-mdc-optgroup-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material-experimental/mdc-core/option/_option-theme.scss b/src/material-experimental/mdc-core/option/_option-theme.scss index c1bffebdf518..fa9366abded6 100644 --- a/src/material-experimental/mdc-core/option/_option-theme.scss +++ b/src/material-experimental/mdc-core/option/_option-theme.scss @@ -1,8 +1,9 @@ @import '@material/list/mixins.import'; @import '@material/list/variables.import'; @import '@material/theme/functions.import'; +@import '@material/theme/mixins.import'; @import '../../mdc-helpers/mdc-helpers'; -@import '../../../material/core/theming/private'; +@import '../../../material/core/theming/theming'; @mixin mat-mdc-option-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material-experimental/mdc-dialog/_mdc-dialog-structure-overrides.scss b/src/material-experimental/mdc-dialog/_mdc-dialog-structure-overrides.scss index ef48ce976686..3960b52db15e 100644 --- a/src/material-experimental/mdc-dialog/_mdc-dialog-structure-overrides.scss +++ b/src/material-experimental/mdc-dialog/_mdc-dialog-structure-overrides.scss @@ -1,6 +1,6 @@ // Mixin that can be included to override the default MDC dialog styles to fit // our needs. See individual comments for context on why certain styles need to be modified. -@mixin mat-mdc-private-dialog-structure-overrides() { +@mixin mat-mdc-private-dialog-structure-overrides($content-max-height) { // MDC dialog sets max-height and max-width on the `mdc-dialog__surface` element. This // element is the parent of the portal outlet. This means that the actual user-content // is scrollable, but as per Material Design specification, only the dialog content @@ -10,7 +10,7 @@ // an explicit max-height for the content element, so that the content is scrollable. This // matches the behavior from the non-MDC dialog and is backwards compatible. .mat-mdc-dialog-content { - max-height: $mat-dialog-content-max-height; + max-height: $content-max-height; } .mat-mdc-dialog-container { diff --git a/src/material-experimental/mdc-dialog/dialog.scss b/src/material-experimental/mdc-dialog/dialog.scss index 6d8a2a204a3b..cadf6ddd80cb 100644 --- a/src/material-experimental/mdc-dialog/dialog.scss +++ b/src/material-experimental/mdc-dialog/dialog.scss @@ -12,7 +12,7 @@ $mat-dialog-content-max-height: 65vh !default; $mat-dialog-button-horizontal-margin: 8px !default; @include mdc-dialog-core-styles($query: $mat-base-styles-query); -@include mat-mdc-private-dialog-structure-overrides(); +@include mat-mdc-private-dialog-structure-overrides($mat-dialog-content-max-height); // The dialog container is focusable. We remove the default outline shown in browsers. .mat-mdc-dialog-container { diff --git a/src/material-experimental/mdc-form-field/_form-field-density.scss b/src/material-experimental/mdc-form-field/_form-field-density.scss index 92d78000ee12..0beddde308c8 100644 --- a/src/material-experimental/mdc-form-field/_form-field-density.scss +++ b/src/material-experimental/mdc-form-field/_form-field-density.scss @@ -1,5 +1,6 @@ -@import '@material/density/functions.import'; +@use '@material/density'; @import '@material/textfield/variables.import'; +@import '../../material/core/theming/theming'; @import 'form-field-sizing'; // Mixin that sets the vertical spacing for the infix container of filled form fields. @@ -38,7 +39,7 @@ @mixin mat-mdc-private-form-field-density($config-or-theme) { $density-scale: mat-get-density-config($config-or-theme); // Height of the form field that is based on the current density scale. - $height: mdc-density-prop-value( + $height: density.prop-value( $density-config: $mdc-text-field-density-config, $density-scale: $density-scale, $property-name: height, diff --git a/src/material-experimental/mdc-form-field/_form-field-subscript.scss b/src/material-experimental/mdc-form-field/_form-field-subscript.scss index c4b2ed0a2cb7..c5d27af07daa 100644 --- a/src/material-experimental/mdc-form-field/_form-field-subscript.scss +++ b/src/material-experimental/mdc-form-field/_form-field-subscript.scss @@ -1,3 +1,5 @@ +@import '@material/theme/mixins.import'; +@import '@material/textfield/variables.import'; @import 'form-field-sizing'; @import '../mdc-helpers/mdc-helpers'; diff --git a/src/material-experimental/mdc-helpers/_mdc-helpers.scss b/src/material-experimental/mdc-helpers/_mdc-helpers.scss index e3cd78f260a6..5a3dfb3be981 100644 --- a/src/material-experimental/mdc-helpers/_mdc-helpers.scss +++ b/src/material-experimental/mdc-helpers/_mdc-helpers.scss @@ -8,7 +8,6 @@ @import '@material/typography/variables.import'; @import '../../material/core/style/layout-common'; @import '../../material/core/theming/theming'; -@import '../../material/core/theming/private'; @import '../../material/core/typography/typography'; // A set of standard queries to use with MDC's queryable mixins. diff --git a/src/material-experimental/mdc-list/_list-theme.scss b/src/material-experimental/mdc-list/_list-theme.scss index 6040a81b5c01..1299c23da730 100644 --- a/src/material-experimental/mdc-list/_list-theme.scss +++ b/src/material-experimental/mdc-list/_list-theme.scss @@ -1,4 +1,4 @@ -@import '@material/density/functions.import'; +@use '@material/density'; @import '@material/list/variables.import'; @import '@material/list/mixins.import'; @@ -34,7 +34,7 @@ @mixin mat-mdc-list-density($config-or-theme) { $density-scale: mat-get-density-config($config-or-theme); - $height: mdc-density-prop-value( + $height: density.prop-value( $density-config: $mdc-list-single-line-density-config, $density-scale: $density-scale, $property-name: height, diff --git a/src/material-experimental/mdc-menu/_menu-theme.scss b/src/material-experimental/mdc-menu/_menu-theme.scss index 7b9317c358ba..66b306fa53e6 100644 --- a/src/material-experimental/mdc-menu/_menu-theme.scss +++ b/src/material-experimental/mdc-menu/_menu-theme.scss @@ -3,6 +3,7 @@ @import '@material/list/mixins.import'; @import '@material/list/variables.import'; @import '@material/theme/functions.import'; +@import '@material/theme/mixins.import'; @import '../mdc-helpers/mdc-helpers'; @mixin mat-mdc-menu-color($config-or-theme) { diff --git a/src/material-experimental/mdc-menu/menu.scss b/src/material-experimental/mdc-menu/menu.scss index ff4e5824dd0f..861066cca39c 100644 --- a/src/material-experimental/mdc-menu/menu.scss +++ b/src/material-experimental/mdc-menu/menu.scss @@ -1,3 +1,4 @@ +@use '@material/density'; @import '@material/menu-surface/mixins.import'; @import '@material/list/mixins.import'; @import '@material/list/variables.import'; @@ -29,7 +30,7 @@ } .mat-mdc-menu-item { - $height: mdc-density-prop-value( + $height: density.prop-value( $density-config: $mdc-list-single-line-density-config, $density-scale: $mdc-list-single-line-density-scale, $property-name: height, diff --git a/src/material-experimental/mdc-paginator/_paginator-theme.scss b/src/material-experimental/mdc-paginator/_paginator-theme.scss index 9be88be6ee1c..2dd59134797e 100644 --- a/src/material-experimental/mdc-paginator/_paginator-theme.scss +++ b/src/material-experimental/mdc-paginator/_paginator-theme.scss @@ -1,7 +1,8 @@ @import '@material/theme/variables.import'; -@import '@material/typography/variables.import'; -@import '../../material/core/theming/private'; +@import '@material/typography/mixins.import'; +@import '../../material/core/theming/theming'; @import '../../material/core/density/private/compatibility'; +@import '../mdc-helpers/mdc-helpers'; @import './paginator-variables'; @mixin mat-mdc-paginator-color($config-or-theme) { diff --git a/src/material-experimental/mdc-tabs/_tabs-theme.scss b/src/material-experimental/mdc-tabs/_tabs-theme.scss index b543fa3262da..a6b91e3dd5d4 100644 --- a/src/material-experimental/mdc-tabs/_tabs-theme.scss +++ b/src/material-experimental/mdc-tabs/_tabs-theme.scss @@ -1,4 +1,5 @@ @import '@material/theme/functions.import'; +@import '@material/theme/mixins.import'; @import '@material/tab-indicator/mixins.import'; @import '@material/tab/mixins.import'; @import '@material/tab/variables.import'; diff --git a/src/material-experimental/mdc-theming/_all-theme.scss b/src/material-experimental/mdc-theming/_all-theme.scss index d83560955a11..65e5ba07c444 100644 --- a/src/material-experimental/mdc-theming/_all-theme.scss +++ b/src/material-experimental/mdc-theming/_all-theme.scss @@ -19,7 +19,7 @@ @import '../mdc-input/input-theme'; @import '../mdc-form-field/form-field-theme'; @import '../../material/core/core'; -@import '../../material/core/theming/private'; +@import '../../material/core/theming/theming'; @mixin angular-material-mdc-theme($theme-or-color-config) { $dedupe-key: 'angular-material-mdc-theme'; diff --git a/src/material-experimental/selection/_selection.scss b/src/material-experimental/selection/_selection.scss index cb4b5049078d..17b83e563381 100644 --- a/src/material-experimental/selection/_selection.scss +++ b/src/material-experimental/selection/_selection.scss @@ -1,4 +1,4 @@ -@import '../../material/core/theming/private'; +@import '../../material/core/theming/theming'; @mixin mat-selection-theme($theme-or-color-config) { $theme: mat-private-legacy-get-theme($theme-or-color-config); diff --git a/src/material/autocomplete/_autocomplete-theme.scss b/src/material/autocomplete/_autocomplete-theme.scss index ec0d78ddcb3c..a473e1f1f9f2 100644 --- a/src/material/autocomplete/_autocomplete-theme.scss +++ b/src/material/autocomplete/_autocomplete-theme.scss @@ -1,6 +1,5 @@ @import '../core/style/private'; @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-autocomplete-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/badge/_badge-theme.scss b/src/material/badge/_badge-theme.scss index 8cbb22267873..44613fa7110f 100644 --- a/src/material/badge/_badge-theme.scss +++ b/src/material/badge/_badge-theme.scss @@ -3,7 +3,6 @@ // no style sheet support for directives. @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import '../../cdk/a11y/a11y'; diff --git a/src/material/bottom-sheet/_bottom-sheet-theme.scss b/src/material/bottom-sheet/_bottom-sheet-theme.scss index e3e2a9a34ce2..e3e175ce615d 100644 --- a/src/material/bottom-sheet/_bottom-sheet-theme.scss +++ b/src/material/bottom-sheet/_bottom-sheet-theme.scss @@ -2,7 +2,6 @@ @import '../core/typography/typography-utils'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-bottom-sheet-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/button-toggle/_button-toggle-theme.scss b/src/material/button-toggle/_button-toggle-theme.scss index c6db2e9962f7..7c2633a40293 100644 --- a/src/material/button-toggle/_button-toggle-theme.scss +++ b/src/material/button-toggle/_button-toggle-theme.scss @@ -2,7 +2,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import '../core/density/private/compatibility'; @import './button-toggle-variables'; @@ -92,7 +91,7 @@ } } -@mixin _mat-button-toggle-density($config-or-theme) { +@mixin mat-button-toggle-density($config-or-theme) { $density-scale: mat-get-density-config($config-or-theme); $standard-height: mat-private-density-prop-value( $mat-button-toggle-standard-density-config, $density-scale, height); @@ -115,7 +114,7 @@ @include mat-button-toggle-color($color); } @if $density != null { - @include _mat-button-toggle-density($density); + @include mat-button-toggle-density($density); } @if $typography != null { @include mat-button-toggle-typography($typography); diff --git a/src/material/button/_button-theme.scss b/src/material/button/_button-theme.scss index 34c8711baaf1..9605e5e5bb5a 100644 --- a/src/material/button/_button-theme.scss +++ b/src/material/button/_button-theme.scss @@ -1,7 +1,6 @@ @import '../core/theming/theming'; @import '../core/style/private'; @import '../core/typography/typography-utils'; -@import '../core/theming/private'; $_mat-button-ripple-opacity: 0.1; diff --git a/src/material/card/_card-theme.scss b/src/material/card/_card-theme.scss index 085ae7d5eaa8..c4cd92551cd6 100644 --- a/src/material/card/_card-theme.scss +++ b/src/material/card/_card-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/private'; @import '../core/typography/typography-utils'; diff --git a/src/material/checkbox/_checkbox-theme.scss b/src/material/checkbox/_checkbox-theme.scss index e3282073ff17..f438ee69535e 100644 --- a/src/material/checkbox/_checkbox-theme.scss +++ b/src/material/checkbox/_checkbox-theme.scss @@ -1,5 +1,4 @@ @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; diff --git a/src/material/chips/_chips-theme.scss b/src/material/chips/_chips-theme.scss index a298601e54e4..309a55e058dd 100644 --- a/src/material/chips/_chips-theme.scss +++ b/src/material/chips/_chips-theme.scss @@ -1,7 +1,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; $mat-chip-remove-font-size: 18px; diff --git a/src/material/core/color/_all-color.scss b/src/material/core/color/_all-color.scss index b3f19b1c4dbc..66acb3d41500 100644 --- a/src/material/core/color/_all-color.scss +++ b/src/material/core/color/_all-color.scss @@ -1,5 +1,5 @@ @import '../theming/all-theme'; -@import '../theming/private'; +@import '../theming/theming'; // Includes all of the color styles. @mixin angular-material-color($config-or-theme) { diff --git a/src/material/core/density/private/_all-density.scss b/src/material/core/density/private/_all-density.scss index c73d92b6e09f..d8841e1fd79c 100644 --- a/src/material/core/density/private/_all-density.scss +++ b/src/material/core/density/private/_all-density.scss @@ -1,4 +1,11 @@ -@import '../../theming/private'; +@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) { @@ -11,9 +18,17 @@ @error 'No density configuration specified.'; } - @include angular-material-theme(( - color: null, - typography: null, - density: $config, - )); + // 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); } diff --git a/src/material/core/focus-indicators/_focus-indicators.scss b/src/material/core/focus-indicators/_focus-indicators.scss index de915cf00fff..36029393a2bc 100644 --- a/src/material/core/focus-indicators/_focus-indicators.scss +++ b/src/material/core/focus-indicators/_focus-indicators.scss @@ -1,5 +1,4 @@ @import '../theming/theming'; -@import '../theming/private'; @import '../style/layout-common'; /// Mixin that turns on strong focus indicators. diff --git a/src/material/core/option/_optgroup-theme.scss b/src/material/core/option/_optgroup-theme.scss index 72961b475db2..763702b92075 100644 --- a/src/material/core/option/_optgroup-theme.scss +++ b/src/material/core/option/_optgroup-theme.scss @@ -1,6 +1,5 @@ @import '../theming/palette'; @import '../theming/theming'; -@import '../theming/private'; @import '../typography/typography-utils'; @mixin mat-optgroup-color($config-or-theme) { diff --git a/src/material/core/option/_option-theme.scss b/src/material/core/option/_option-theme.scss index 1d769dbc5b96..7fc1a8c9d8c7 100644 --- a/src/material/core/option/_option-theme.scss +++ b/src/material/core/option/_option-theme.scss @@ -1,6 +1,5 @@ @import '../theming/palette'; @import '../theming/theming'; -@import '../theming/private'; @import '../typography/typography-utils'; @mixin mat-option-color($config-or-theme) { diff --git a/src/material/core/ripple/_ripple.scss b/src/material/core/ripple/_ripple.scss index a84d250ac11e..45cb40cd0230 100644 --- a/src/material/core/ripple/_ripple.scss +++ b/src/material/core/ripple/_ripple.scss @@ -1,5 +1,4 @@ @import '../theming/theming'; -@import '../theming/private'; @import '../../../cdk/a11y/a11y'; $mat-ripple-color-opacity: 0.1; diff --git a/src/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss b/src/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss index 6d6000096c24..a69b3ac8b5aa 100644 --- a/src/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss +++ b/src/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss @@ -1,5 +1,4 @@ @import '../../theming/theming'; -@import '../../theming/private'; @mixin mat-pseudo-checkbox-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/core/theming/_all-theme.scss b/src/material/core/theming/_all-theme.scss index 0b6681a75c9a..c800a7222a68 100644 --- a/src/material/core/theming/_all-theme.scss +++ b/src/material/core/theming/_all-theme.scss @@ -34,7 +34,7 @@ @import '../../tree/tree-theme'; @import '../../snack-bar/snack-bar-theme'; @import '../../form-field/form-field-theme'; -@import './private'; +@import './theming'; // Create a theme. @mixin angular-material-theme($theme-or-color-config) { diff --git a/src/material/core/theming/_private.scss b/src/material/core/theming/_private.scss deleted file mode 100644 index bbf38dd902d3..000000000000 --- a/src/material/core/theming/_private.scss +++ /dev/null @@ -1,160 +0,0 @@ -// Warning that will be printed if duplicated styles are generated by a theme. -$_mat-theme-duplicate-warning: 'Read more about how style duplication can be avoided in a ' + - 'dedicated guide. https://github.com/angular/components/blob/master/guides/duplicate-theming-styles.md'; - -// These variable are not intended to be overridden externally. They use `!default` to -// avoid being reset every time this file is imported. -$_mat-theme-emitted-color: () !default; -$_mat-theme-emitted-typography: () !default; -$_mat-theme-emitted-density: () !default; - -// Checks if configurations that have been declared in the given theme have been generated -// before. If so, warnings will be reported. This should notify developers in case duplicate -// styles are accidentally generated due to wrong usage of the all-theme mixins. -// -// Additionally, this mixin controls the default value for the density configuration. By -// default, density styles are generated at scale zero. If the same density styles would be -// generated a second time though, the default value will change to avoid duplicate styles. -// -// The mixin keeps track of all configurations in a list that is scoped to the specified -// id. This is necessary because a given theme can be passed to multiple disjoint theme mixins -// (e.g. `angular-material-theme` and `angular-material-mdc-theme`) without causing any -// style duplication. -@mixin mat-private-check-duplicate-theme-styles($theme-or-color-config, $id) { - $theme: mat-private-legacy-get-theme($theme-or-color-config); - $color-config: mat-get-color-config($theme); - $density-config: mat-get-density-config($theme); - $typography-config: mat-get-typography-config($theme); - // Lists of previous `color`, `density` and `typography` configurations. - $previous-color: map-get($_mat-theme-emitted-color, $id) or (); - $previous-typography: map-get($_mat-theme-emitted-typography, $id) or (); - $previous-density: map-get($_mat-theme-emitted-density, $id) or (); - // Whether duplicate legacy density styles would be generated. - $duplicate-legacy-density: false; - - // Check if the color configuration has been generated before. - @if $color-config != null { - @if index($previous-color, $color-config) != null and - not $mat-theme-ignore-duplication-warnings { - @warn 'The same color styles are generated multiple times. ' + - $_mat-theme-duplicate-warning; - } - $previous-color: append($previous-color, $color-config); - } - - // Check if the typography configuration has been generated before. - @if $typography-config != null { - @if index($previous-typography, $typography-config) != null and - not $mat-theme-ignore-duplication-warnings { - @warn 'The same typography styles are generated multiple times. ' + - $_mat-theme-duplicate-warning; - } - $previous-typography: append($previous-typography, $typography-config); - } - - // Check if the density configuration has been generated before. - @if $density-config != null { - @if index($previous-density, $density-config) != null { - // Only report a warning if density styles would be duplicated for non-legacy theme - // definitions. For legacy themes, we have compatibility logic that avoids duplication - // of default density styles. We don't want to report a warning in those cases. - @if mat-private-is-legacy-constructed-theme($theme) { - $duplicate-legacy-density: true; - } - @else if not $mat-theme-ignore-duplication-warnings { - @warn 'The same density styles are generated multiple times. ' + - $_mat-theme-duplicate-warning; - } - } - $previous-density: append($previous-density, $density-config); - } - - $_mat-theme-emitted-color: map-merge( - $_mat-theme-emitted-color, ($id: $previous-color)) !global; - $_mat-theme-emitted-density: map-merge( - $_mat-theme-emitted-density, ($id: $previous-density)) !global; - $_mat-theme-emitted-typography: map-merge( - $_mat-theme-emitted-typography, ($id: $previous-typography)) !global; - - // Optionally, consumers of this mixin can wrap contents inside so that nested - // duplicate style checks do not report another warning. e.g. if developers include - // the `angular-material-theme` mixin twice, only the top-level duplicate styles check - // should report a warning. Not all individual components should report a warning too. - $orig-mat-theme-ignore-duplication-warnings: $mat-theme-ignore-duplication-warnings; - $mat-theme-ignore-duplication-warnings: true !global; - - // If duplicate default density styles would be generated for a legacy constructed theme, - // we adjust the density generation so that no density styles are generated by default. - // If no default density styles have been generated yet, we ensure that the styles - // are generated at root. For legacy themes our goal is to generate default density - // styles **once** and at root. This matches the old behavior where density styles were - // part of the base component styles (that did not use view encapsulation). - // TODO: Remove this compatibility logic when the legacy theming API is removed. - $mat-private-density-generate-at-root: mat-private-is-legacy-constructed-theme($theme) !global; - $mat-private-density-generate-styles: not $duplicate-legacy-density !global; - - @content; - $mat-theme-ignore-duplication-warnings: $orig-mat-theme-ignore-duplication-warnings !global; - - $mat-private-density-generate-at-root: false !global; - $mat-private-density-generate-styles: true !global; -} - -// Checks whether the given value resolves to a theme object. Theme objects are always -// of type `map` and can optionally only specify `color`, `density` or `typography`. -@function mat-private-is-theme-object($value) { - @return type-of($value) == 'map' and ( - map-has-key($value, color) or - map-has-key($value, density) or - map-has-key($value, typography) or - length($value) == 0 - ); -} - -// Checks whether a given value corresponds to a legacy constructed theme. -@function mat-private-is-legacy-constructed-theme($value) { - @return type-of($value) == 'map' and map-get($value, '_is-legacy-theme'); -} - -// Creates a backwards compatible theme. Previously in Angular Material, theme objects -// contained the color configuration directly. With the recent refactoring of the theming -// system to allow for density and typography configurations, this is no longer the case. -// To ensure that constructed themes which will be passed to custom theme mixins do not break, -// we copy the color configuration and put its properties at the top-level of the theme object. -// Here is an example of a pattern that should still work until it's officially marked as a -// breaking change: -// -// @mixin my-custom-component-theme($theme) { -// .my-comp { -// background-color: mat-color(map-get($theme, primary)); -// } -// } -// -// Note that the `$theme.primary` key does usually not exist since the color configuration -// is stored in `$theme.color` which contains a property for `primary`. This method copies -// the map from `$theme.color` to `$theme` for backwards compatibility. -@function mat-private-create-backwards-compatibility-theme($theme) { - @if not map-get($theme, color) { - @return $theme; - } - $color: map-get($theme, color); - @return map-merge($theme, $color); -} - -// Gets the theme from the given value that is either already a theme, or a color configuration. -// This handles the legacy case where developers pass a color configuration directly to the -// theme mixin. Before we introduced the new pattern for constructing a theme, developers passed -// the color configuration directly to the theme mixins. This can be still the case if developers -// construct a theme manually and pass it to a theme. We support this for backwards compatibility. -// TODO(devversion): remove this in the future. Constructing themes manually is rare, -// and the code can be easily updated to the new API. -@function mat-private-legacy-get-theme($theme-or-color-config) { - @if mat-private-is-theme-object($theme-or-color-config) { - @return $theme-or-color-config; - } - @return mat-private-create-backwards-compatibility-theme(( - _is-legacy-theme: true, - color: $theme-or-color-config - )); -} - diff --git a/src/material/core/theming/_theming.scss b/src/material/core/theming/_theming.scss index a18059329173..e155a0ad5b99 100644 --- a/src/material/core/theming/_theming.scss +++ b/src/material/core/theming/_theming.scss @@ -1,5 +1,4 @@ @import 'palette'; -@import './private'; // Whether duplication warnings should be disabled. Warnings enabled by default. $mat-theme-ignore-duplication-warnings: false !default; @@ -7,6 +6,16 @@ $mat-theme-ignore-duplication-warnings: false !default; // Whether density should be generated by default. $_mat-theme-generate-default-density: true !default; +// Warning that will be printed if duplicated styles are generated by a theme. +$_mat-theme-duplicate-warning: 'Read more about how style duplication can be avoided in a ' + + 'dedicated guide. https://github.com/angular/components/blob/master/guides/duplicate-theming-styles.md'; + +// These variable are not intended to be overridden externally. They use `!default` to +// avoid being reset every time this file is imported. +$_mat-theme-emitted-color: () !default; +$_mat-theme-emitted-typography: () !default; +$_mat-theme-emitted-density: () !default; + // For a given hue in a palette, return the contrast color from the map of contrast palettes. // @param $color-map // @param $hue @@ -236,3 +245,158 @@ $_mat-theme-generate-default-density: true !default; } @return $default; } + + +// +// Private APIs +// + +// Checks if configurations that have been declared in the given theme have been generated +// before. If so, warnings will be reported. This should notify developers in case duplicate +// styles are accidentally generated due to wrong usage of the all-theme mixins. +// +// Additionally, this mixin controls the default value for the density configuration. By +// default, density styles are generated at scale zero. If the same density styles would be +// generated a second time though, the default value will change to avoid duplicate styles. +// +// The mixin keeps track of all configurations in a list that is scoped to the specified +// id. This is necessary because a given theme can be passed to multiple disjoint theme mixins +// (e.g. `angular-material-theme` and `angular-material-mdc-theme`) without causing any +// style duplication. +@mixin mat-private-check-duplicate-theme-styles($theme-or-color-config, $id) { + $theme: mat-private-legacy-get-theme($theme-or-color-config); + $color-config: mat-get-color-config($theme); + $density-config: mat-get-density-config($theme); + $typography-config: mat-get-typography-config($theme); + // Lists of previous `color`, `density` and `typography` configurations. + $previous-color: map-get($_mat-theme-emitted-color, $id) or (); + $previous-typography: map-get($_mat-theme-emitted-typography, $id) or (); + $previous-density: map-get($_mat-theme-emitted-density, $id) or (); + // Whether duplicate legacy density styles would be generated. + $duplicate-legacy-density: false; + + // Check if the color configuration has been generated before. + @if $color-config != null { + @if index($previous-color, $color-config) != null and + not $mat-theme-ignore-duplication-warnings { + @warn 'The same color styles are generated multiple times. ' + + $_mat-theme-duplicate-warning; + } + $previous-color: append($previous-color, $color-config); + } + + // Check if the typography configuration has been generated before. + @if $typography-config != null { + @if index($previous-typography, $typography-config) != null and + not $mat-theme-ignore-duplication-warnings { + @warn 'The same typography styles are generated multiple times. ' + + $_mat-theme-duplicate-warning; + } + $previous-typography: append($previous-typography, $typography-config); + } + + // Check if the density configuration has been generated before. + @if $density-config != null { + @if index($previous-density, $density-config) != null { + // Only report a warning if density styles would be duplicated for non-legacy theme + // definitions. For legacy themes, we have compatibility logic that avoids duplication + // of default density styles. We don't want to report a warning in those cases. + @if mat-private-is-legacy-constructed-theme($theme) { + $duplicate-legacy-density: true; + } + @else if not $mat-theme-ignore-duplication-warnings { + @warn 'The same density styles are generated multiple times. ' + + $_mat-theme-duplicate-warning; + } + } + $previous-density: append($previous-density, $density-config); + } + + $_mat-theme-emitted-color: map-merge( + $_mat-theme-emitted-color, ($id: $previous-color)) !global; + $_mat-theme-emitted-density: map-merge( + $_mat-theme-emitted-density, ($id: $previous-density)) !global; + $_mat-theme-emitted-typography: map-merge( + $_mat-theme-emitted-typography, ($id: $previous-typography)) !global; + + // Optionally, consumers of this mixin can wrap contents inside so that nested + // duplicate style checks do not report another warning. e.g. if developers include + // the `angular-material-theme` mixin twice, only the top-level duplicate styles check + // should report a warning. Not all individual components should report a warning too. + $orig-mat-theme-ignore-duplication-warnings: $mat-theme-ignore-duplication-warnings; + $mat-theme-ignore-duplication-warnings: true !global; + + // If duplicate default density styles would be generated for a legacy constructed theme, + // we adjust the density generation so that no density styles are generated by default. + // If no default density styles have been generated yet, we ensure that the styles + // are generated at root. For legacy themes our goal is to generate default density + // styles **once** and at root. This matches the old behavior where density styles were + // part of the base component styles (that did not use view encapsulation). + // TODO: Remove this compatibility logic when the legacy theming API is removed. + $mat-private-density-generate-at-root: mat-private-is-legacy-constructed-theme($theme) !global; + $mat-private-density-generate-styles: not $duplicate-legacy-density !global; + + @content; + $mat-theme-ignore-duplication-warnings: $orig-mat-theme-ignore-duplication-warnings !global; + + $mat-private-density-generate-at-root: false !global; + $mat-private-density-generate-styles: true !global; +} + +// Checks whether the given value resolves to a theme object. Theme objects are always +// of type `map` and can optionally only specify `color`, `density` or `typography`. +@function mat-private-is-theme-object($value) { + @return type-of($value) == 'map' and ( + map-has-key($value, color) or + map-has-key($value, density) or + map-has-key($value, typography) or + length($value) == 0 + ); +} + +// Checks whether a given value corresponds to a legacy constructed theme. +@function mat-private-is-legacy-constructed-theme($value) { + @return type-of($value) == 'map' and map-get($value, '_is-legacy-theme'); +} + +// Creates a backwards compatible theme. Previously in Angular Material, theme objects +// contained the color configuration directly. With the recent refactoring of the theming +// system to allow for density and typography configurations, this is no longer the case. +// To ensure that constructed themes which will be passed to custom theme mixins do not break, +// we copy the color configuration and put its properties at the top-level of the theme object. +// Here is an example of a pattern that should still work until it's officially marked as a +// breaking change: +// +// @mixin my-custom-component-theme($theme) { +// .my-comp { +// background-color: mat-color(map-get($theme, primary)); +// } +// } +// +// Note that the `$theme.primary` key does usually not exist since the color configuration +// is stored in `$theme.color` which contains a property for `primary`. This method copies +// the map from `$theme.color` to `$theme` for backwards compatibility. +@function mat-private-create-backwards-compatibility-theme($theme) { + @if not map-get($theme, color) { + @return $theme; + } + $color: map-get($theme, color); + @return map-merge($theme, $color); +} + +// Gets the theme from the given value that is either already a theme, or a color configuration. +// This handles the legacy case where developers pass a color configuration directly to the +// theme mixin. Before we introduced the new pattern for constructing a theme, developers passed +// the color configuration directly to the theme mixins. This can be still the case if developers +// construct a theme manually and pass it to a theme. We support this for backwards compatibility. +// TODO(devversion): remove this in the future. Constructing themes manually is rare, +// and the code can be easily updated to the new API. +@function mat-private-legacy-get-theme($theme-or-color-config) { + @if mat-private-is-theme-object($theme-or-color-config) { + @return $theme-or-color-config; + } + @return mat-private-create-backwards-compatibility-theme(( + _is-legacy-theme: true, + color: $theme-or-color-config + )); +} diff --git a/src/material/core/typography/_all-typography.scss b/src/material/core/typography/_all-typography.scss index 14fdf5b27c44..6bfd4058c87c 100644 --- a/src/material/core/typography/_all-typography.scss +++ b/src/material/core/typography/_all-typography.scss @@ -1,5 +1,4 @@ @import './typography'; -@import '../theming/private'; @import '../../autocomplete/autocomplete-theme'; @import '../../badge/badge-theme'; @import '../../bottom-sheet/bottom-sheet-theme'; diff --git a/src/material/datepicker/_datepicker-theme.scss b/src/material/datepicker/_datepicker-theme.scss index d78fdfd4a62e..1f18327d5436 100644 --- a/src/material/datepicker/_datepicker-theme.scss +++ b/src/material/datepicker/_datepicker-theme.scss @@ -1,7 +1,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; diff --git a/src/material/dialog/_dialog-theme.scss b/src/material/dialog/_dialog-theme.scss index 2602024179ea..fb6d8a425807 100644 --- a/src/material/dialog/_dialog-theme.scss +++ b/src/material/dialog/_dialog-theme.scss @@ -1,7 +1,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; diff --git a/src/material/divider/_divider-theme.scss b/src/material/divider/_divider-theme.scss index 87a2be761582..ee88df9163cb 100644 --- a/src/material/divider/_divider-theme.scss +++ b/src/material/divider/_divider-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-divider-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/expansion/_expansion-theme.scss b/src/material/expansion/_expansion-theme.scss index 49fbf6786751..914816ca07d1 100644 --- a/src/material/expansion/_expansion-theme.scss +++ b/src/material/expansion/_expansion-theme.scss @@ -1,7 +1,6 @@ @import '../core/density/private/compatibility'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/private'; @import '../core/typography/typography-utils'; @import './expansion-variables'; diff --git a/src/material/form-field/_form-field-fill-theme.scss b/src/material/form-field/_form-field-fill-theme.scss index 092b0c89dd29..a20f317f4214 100644 --- a/src/material/form-field/_form-field-fill-theme.scss +++ b/src/material/form-field/_form-field-fill-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; diff --git a/src/material/form-field/_form-field-legacy-theme.scss b/src/material/form-field/_form-field-legacy-theme.scss index 432925da98af..91ff3b23299e 100644 --- a/src/material/form-field/_form-field-legacy-theme.scss +++ b/src/material/form-field/_form-field-legacy-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; diff --git a/src/material/form-field/_form-field-outline-theme.scss b/src/material/form-field/_form-field-outline-theme.scss index 62a4dcd0a61d..088845169d5c 100644 --- a/src/material/form-field/_form-field-outline-theme.scss +++ b/src/material/form-field/_form-field-outline-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; diff --git a/src/material/form-field/_form-field-standard-theme.scss b/src/material/form-field/_form-field-standard-theme.scss index 8ae3d2ae1e60..e46743612574 100644 --- a/src/material/form-field/_form-field-standard-theme.scss +++ b/src/material/form-field/_form-field-standard-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; diff --git a/src/material/form-field/_form-field-theme.scss b/src/material/form-field/_form-field-theme.scss index 13a33db8c334..74ace20528eb 100644 --- a/src/material/form-field/_form-field-theme.scss +++ b/src/material/form-field/_form-field-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; @@ -238,7 +237,7 @@ $mat-form-field-dedupe: 0; @include mat-form-field-outline-typography($config); } -@mixin _mat-form-field-density($config-or-theme) { +@mixin mat-form-field-density($config-or-theme) { $density-scale: mat-get-density-config($config-or-theme); @include mat-private-form-field-legacy-density($density-scale); @include mat-private-form-field-standard-density($density-scale); @@ -257,7 +256,7 @@ $mat-form-field-dedupe: 0; @include mat-form-field-color($color); } @if $density != null { - @include _mat-form-field-density($density); + @include mat-form-field-density($density); } @if $typography != null { @include mat-form-field-typography($typography); diff --git a/src/material/grid-list/_grid-list-theme.scss b/src/material/grid-list/_grid-list-theme.scss index 807e7c5332c6..cb8d98a8b406 100644 --- a/src/material/grid-list/_grid-list-theme.scss +++ b/src/material/grid-list/_grid-list-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import '../core/style/list-common'; diff --git a/src/material/icon/_icon-theme.scss b/src/material/icon/_icon-theme.scss index d39e1809040d..d9afb7465d83 100644 --- a/src/material/icon/_icon-theme.scss +++ b/src/material/icon/_icon-theme.scss @@ -1,5 +1,4 @@ @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-icon-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/input/_input-theme.scss b/src/material/input/_input-theme.scss index 271b9a670acc..6e728383df2b 100644 --- a/src/material/input/_input-theme.scss +++ b/src/material/input/_input-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; @import '../core/style/vendor-prefixes'; diff --git a/src/material/list/_list-theme.scss b/src/material/list/_list-theme.scss index 4ed132cfff9f..e49df6cd64c0 100644 --- a/src/material/list/_list-theme.scss +++ b/src/material/list/_list-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import '../core/style/list-common'; diff --git a/src/material/menu/_menu-theme.scss b/src/material/menu/_menu-theme.scss index afce2150b8b6..f4d982b29283 100644 --- a/src/material/menu/_menu-theme.scss +++ b/src/material/menu/_menu-theme.scss @@ -1,7 +1,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; diff --git a/src/material/paginator/_paginator-theme.scss b/src/material/paginator/_paginator-theme.scss index b4deefc6e0d3..8ca4570552d9 100644 --- a/src/material/paginator/_paginator-theme.scss +++ b/src/material/paginator/_paginator-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import '../core/density/private/compatibility'; @import './paginator-variables'; @@ -51,7 +50,7 @@ } } -@mixin _mat-paginator-density($config-or-theme) { +@mixin mat-paginator-density($config-or-theme) { $density-scale: mat-get-density-config($config-or-theme); $height: mat-private-density-prop-value($mat-paginator-density-config, $density-scale, height); @@ -73,7 +72,7 @@ @include mat-paginator-color($color); } @if $density != null { - @include _mat-paginator-density($density); + @include mat-paginator-density($density); } @if $typography != null { @include mat-paginator-typography($typography); diff --git a/src/material/progress-bar/_progress-bar-theme.scss b/src/material/progress-bar/_progress-bar-theme.scss index 5acc86872f87..9b1c3ff854ab 100644 --- a/src/material/progress-bar/_progress-bar-theme.scss +++ b/src/material/progress-bar/_progress-bar-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-progress-bar-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/progress-spinner/_progress-spinner-theme.scss b/src/material/progress-spinner/_progress-spinner-theme.scss index d10e26f665fa..d92b92521d02 100644 --- a/src/material/progress-spinner/_progress-spinner-theme.scss +++ b/src/material/progress-spinner/_progress-spinner-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-progress-spinner-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/radio/_radio-theme.scss b/src/material/radio/_radio-theme.scss index e8d379242e26..b211ae2d77ac 100644 --- a/src/material/radio/_radio-theme.scss +++ b/src/material/radio/_radio-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @mixin _mat-radio-color($palette) { diff --git a/src/material/select/_select-theme.scss b/src/material/select/_select-theme.scss index c403ac7b147b..c64a029f682d 100644 --- a/src/material/select/_select-theme.scss +++ b/src/material/select/_select-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/style/private'; @import '../core/style/form-common'; @import '../core/typography/typography-utils'; diff --git a/src/material/sidenav/_sidenav-theme.scss b/src/material/sidenav/_sidenav-theme.scss index 00c8a274aafc..6360584afad1 100644 --- a/src/material/sidenav/_sidenav-theme.scss +++ b/src/material/sidenav/_sidenav-theme.scss @@ -1,7 +1,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-sidenav-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/slide-toggle/_slide-toggle-theme.scss b/src/material/slide-toggle/_slide-toggle-theme.scss index cb7b8703a749..9d45d46078ca 100644 --- a/src/material/slide-toggle/_slide-toggle-theme.scss +++ b/src/material/slide-toggle/_slide-toggle-theme.scss @@ -1,7 +1,6 @@ @import '../core/style/private'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @mixin _mat-slide-toggle-checked($palette, $thumb-checked-hue) { diff --git a/src/material/slider/_slider-theme.scss b/src/material/slider/_slider-theme.scss index 2bf988f99483..facd274e72c0 100644 --- a/src/material/slider/_slider-theme.scss +++ b/src/material/slider/_slider-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @mixin _mat-slider-inner-content-theme($palette) { diff --git a/src/material/snack-bar/_snack-bar-theme.scss b/src/material/snack-bar/_snack-bar-theme.scss index cd8eb2bf13e3..7ead10607829 100644 --- a/src/material/snack-bar/_snack-bar-theme.scss +++ b/src/material/snack-bar/_snack-bar-theme.scss @@ -1,6 +1,5 @@ @import '../core/typography/typography-utils'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/theming/palette'; @import '../core/style/private'; diff --git a/src/material/sort/_sort-theme.scss b/src/material/sort/_sort-theme.scss index e644a3e8f09f..96dbf3b060c9 100644 --- a/src/material/sort/_sort-theme.scss +++ b/src/material/sort/_sort-theme.scss @@ -1,5 +1,4 @@ @import '../core/theming/theming'; -@import '../core/theming/private'; @mixin mat-sort-color($config-or-theme) { $config: mat-get-color-config($config-or-theme); diff --git a/src/material/stepper/_stepper-theme.scss b/src/material/stepper/_stepper-theme.scss index 9b17f65b0721..e8c197c465b2 100644 --- a/src/material/stepper/_stepper-theme.scss +++ b/src/material/stepper/_stepper-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import '../core/density/private/compatibility'; @import './stepper-variables'; diff --git a/src/material/table/_table-theme.scss b/src/material/table/_table-theme.scss index d433c9bed052..962f07ca6a13 100644 --- a/src/material/table/_table-theme.scss +++ b/src/material/table/_table-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @mixin mat-table-color($config-or-theme) { diff --git a/src/material/tabs/_tabs-theme.scss b/src/material/tabs/_tabs-theme.scss index b73d32648e50..9bac48ab50c9 100644 --- a/src/material/tabs/_tabs-theme.scss +++ b/src/material/tabs/_tabs-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @mixin mat-tabs-color($config-or-theme) { diff --git a/src/material/toolbar/_toolbar-theme.scss b/src/material/toolbar/_toolbar-theme.scss index deef00a27912..025237fee89b 100644 --- a/src/material/toolbar/_toolbar-theme.scss +++ b/src/material/toolbar/_toolbar-theme.scss @@ -2,7 +2,6 @@ @import '../core/style/variables'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import './toolbar-variables'; diff --git a/src/material/tooltip/_tooltip-theme.scss b/src/material/tooltip/_tooltip-theme.scss index 9ab85ec07600..1d5250433687 100644 --- a/src/material/tooltip/_tooltip-theme.scss +++ b/src/material/tooltip/_tooltip-theme.scss @@ -1,6 +1,5 @@ @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; $mat-tooltip-target-height: 22px; diff --git a/src/material/tree/_tree-theme.scss b/src/material/tree/_tree-theme.scss index 758074e72b67..9f9a059d9934 100644 --- a/src/material/tree/_tree-theme.scss +++ b/src/material/tree/_tree-theme.scss @@ -1,7 +1,6 @@ @import '../core/density/private/compatibility'; @import '../core/theming/palette'; @import '../core/theming/theming'; -@import '../core/theming/private'; @import '../core/typography/typography-utils'; @import './tree-variables';