Skip to content

Commit 2c9c787

Browse files
authored
fix(material/schematics): update theme names for MDC migration schematic (#25550)
1 parent ebc7b2b commit 2c9c787

40 files changed

+422
-412
lines changed

integration/mdc-migration/golden/src/styles.scss

Lines changed: 39 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -28,51 +28,52 @@ $sample-project-theme: mat.define-light-theme((
2828
)
2929
));
3030

31-
@include mat.mdc-autocomplete-theme($sample-project-theme);
32-
@include mat.mdc-autocomplete-typography($sample-project-theme);
33-
@include mat.mdc-button-theme($sample-project-theme);
34-
@include mat.mdc-button-typography($sample-project-theme);
35-
@include mat.mdc-fab-theme($sample-project-theme);
36-
@include mat.mdc-fab-typography($sample-project-theme);
37-
@include mat.mdc-icon-button-theme($sample-project-theme);
38-
@include mat.mdc-icon-button-typography($sample-project-theme);
39-
@include mat.mdc-card-theme($sample-project-theme);
40-
@include mat.mdc-card-typography($sample-project-theme);
41-
@include mat.mdc-checkbox-theme($sample-project-theme);
42-
@include mat.mdc-checkbox-typography($sample-project-theme);
43-
@include mat.mdc-chips-theme($sample-project-theme);
44-
@include mat.mdc-chips-typography($sample-project-theme);
45-
@include mat.mdc-form-field-theme($sample-project-theme);
46-
@include mat.mdc-form-field-typography($sample-project-theme);
47-
@include mat.mdc-input-theme($sample-project-theme);
48-
@include mat.mdc-input-typography($sample-project-theme);
49-
@include mat.mdc-list-theme($sample-project-theme);
50-
@include mat.mdc-list-typography($sample-project-theme);
51-
@include mat.mdc-menu-theme($sample-project-theme);
52-
@include mat.mdc-menu-typography($sample-project-theme);
53-
@include mat.mdc-paginator-theme($sample-project-theme);
54-
@include mat.mdc-paginator-typography($sample-project-theme);
55-
@include mat.mdc-progress-bar-theme($sample-project-theme);
56-
@include mat.mdc-progress-bar-typography($sample-project-theme);
57-
@include mat.mdc-progress-spinner-theme($sample-project-theme);
58-
@include mat.mdc-progress-spinner-typography($sample-project-theme);
59-
@include mat.mdc-radio-theme($sample-project-theme);
60-
@include mat.mdc-radio-typography($sample-project-theme);
61-
@include mat.mdc-select-theme($sample-project-theme);
62-
@include mat.mdc-select-typography($sample-project-theme);
63-
@include mat.mdc-core-theme($sample-project-theme);
64-
@include mat.mdc-core-typography($sample-project-theme);
31+
@include mat.autocomplete-theme($sample-project-theme);
32+
@include mat.autocomplete-typography($sample-project-theme);
33+
@include mat.button-theme($sample-project-theme);
34+
@include mat.button-typography($sample-project-theme);
35+
@include mat.fab-theme($sample-project-theme);
36+
@include mat.fab-typography($sample-project-theme);
37+
@include mat.icon-button-theme($sample-project-theme);
38+
@include mat.icon-button-typography($sample-project-theme);
39+
@include mat.card-theme($sample-project-theme);
40+
@include mat.card-typography($sample-project-theme);
41+
@include mat.checkbox-theme($sample-project-theme);
42+
@include mat.checkbox-typography($sample-project-theme);
43+
@include mat.chips-theme($sample-project-theme);
44+
@include mat.chips-typography($sample-project-theme);
45+
@include mat.form-field-theme($sample-project-theme);
46+
@include mat.form-field-typography($sample-project-theme);
47+
@include mat.input-theme($sample-project-theme);
48+
@include mat.input-typography($sample-project-theme);
49+
@include mat.list-theme($sample-project-theme);
50+
@include mat.list-typography($sample-project-theme);
51+
@include mat.menu-theme($sample-project-theme);
52+
@include mat.menu-typography($sample-project-theme);
53+
@include mat.paginator-theme($sample-project-theme);
54+
@include mat.paginator-typography($sample-project-theme);
55+
@include mat.progress-bar-theme($sample-project-theme);
56+
@include mat.progress-bar-typography($sample-project-theme);
57+
@include mat.progress-spinner-theme($sample-project-theme);
58+
@include mat.progress-spinner-typography($sample-project-theme);
59+
@include mat.radio-theme($sample-project-theme);
60+
@include mat.radio-typography($sample-project-theme);
61+
@include mat.select-theme($sample-project-theme);
62+
@include mat.select-typography($sample-project-theme);
63+
@include mat.core-theme($sample-project-theme);
64+
@include mat.core-typography($sample-project-theme);
6565
@include mat.slide-toggle-theme($sample-project-theme);
6666
@include mat.slide-toggle-typography($sample-project-theme);
67-
@include mat.mdc-slider-theme($sample-project-theme);
68-
@include mat.mdc-slider-typography($sample-project-theme);
67+
@include mat.slider-theme($sample-project-theme);
68+
@include mat.slider-typography($sample-project-theme);
69+
@include mat.snack-bar-theme($sample-project-theme);
6970
@include mat.snack-bar-typography($sample-project-theme);
7071
@include mat.table-theme($sample-project-theme);
7172
@include mat.table-typography($sample-project-theme);
7273
@include mat.tabs-theme($sample-project-theme);
7374
@include mat.tabs-typography($sample-project-theme);
74-
@include mat.mdc-tooltip-theme($sample-project-theme);
75-
@include mat.mdc-tooltip-typography($sample-project-theme);
75+
@include mat.tooltip-theme($sample-project-theme);
76+
@include mat.tooltip-typography($sample-project-theme);
7677

7778
/* You can add global styles to this file, and also import other style files */
7879

integration/mdc-migration/sample-project/src/styles.scss

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -28,26 +28,26 @@ $sample-project-theme: mat.define-light-theme((
2828
)
2929
));
3030

31-
@include mat.autocomplete-theme($sample-project-theme);
32-
@include mat.button-theme($sample-project-theme);
33-
@include mat.card-theme($sample-project-theme);
34-
@include mat.checkbox-theme($sample-project-theme);
35-
@include mat.chips-theme($sample-project-theme);
36-
@include mat.form-field-theme($sample-project-theme);
37-
@include mat.input-theme($sample-project-theme);
38-
@include mat.list-theme($sample-project-theme);
39-
@include mat.menu-theme($sample-project-theme);
40-
@include mat.paginator-theme($sample-project-theme);
41-
@include mat.progress-bar-theme($sample-project-theme);
42-
@include mat.progress-spinner-theme($sample-project-theme);
43-
@include mat.radio-theme($sample-project-theme);
44-
@include mat.select-theme($sample-project-theme);
31+
@include mat.legacy-autocomplete-theme($sample-project-theme);
32+
@include mat.legacy-button-theme($sample-project-theme);
33+
@include mat.legacy-card-theme($sample-project-theme);
34+
@include mat.legacy-checkbox-theme($sample-project-theme);
35+
@include mat.legacy-chips-theme($sample-project-theme);
36+
@include mat.legacy-form-field-theme($sample-project-theme);
37+
@include mat.legacy-input-theme($sample-project-theme);
38+
@include mat.legacy-list-theme($sample-project-theme);
39+
@include mat.legacy-menu-theme($sample-project-theme);
40+
@include mat.legacy-paginator-theme($sample-project-theme);
41+
@include mat.legacy-progress-bar-theme($sample-project-theme);
42+
@include mat.legacy-progress-spinner-theme($sample-project-theme);
43+
@include mat.legacy-radio-theme($sample-project-theme);
44+
@include mat.legacy-select-theme($sample-project-theme);
4545
@include mat.legacy-slide-toggle-theme($sample-project-theme);
46-
@include mat.slider-theme($sample-project-theme);
46+
@include mat.legacy-slider-theme($sample-project-theme);
4747
@include mat.legacy-snack-bar-theme($sample-project-theme);
4848
@include mat.legacy-table-theme($sample-project-theme);
4949
@include mat.legacy-tabs-theme($sample-project-theme);
50-
@include mat.tooltip-theme($sample-project-theme);
50+
@include mat.legacy-tooltip-theme($sample-project-theme);
5151

5252
/* You can add global styles to this file, and also import other style files */
5353

src/material/schematics/ng-generate/mdc-migration/rules/components/autocomplete/autocomplete-styles.spec.ts

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,13 @@ describe('autocomplete styles', () => {
2323
`
2424
@use '@angular/material' as mat;
2525
$theme: ();
26-
@include mat.autocomplete-theme($theme);
26+
@include mat.legacy-autocomplete-theme($theme);
2727
`,
2828
`
2929
@use '@angular/material' as mat;
3030
$theme: ();
31-
@include mat.mdc-autocomplete-theme($theme);
32-
@include mat.mdc-autocomplete-typography($theme);
31+
@include mat.autocomplete-theme($theme);
32+
@include mat.autocomplete-typography($theme);
3333
`,
3434
);
3535
});
@@ -39,13 +39,13 @@ describe('autocomplete styles', () => {
3939
`
4040
@use '@angular/material' as arbitrary;
4141
$theme: ();
42-
@include arbitrary.autocomplete-theme($theme);
42+
@include arbitrary.legacy-autocomplete-theme($theme);
4343
`,
4444
`
4545
@use '@angular/material' as arbitrary;
4646
$theme: ();
47-
@include arbitrary.mdc-autocomplete-theme($theme);
48-
@include arbitrary.mdc-autocomplete-typography($theme);
47+
@include arbitrary.autocomplete-theme($theme);
48+
@include arbitrary.autocomplete-typography($theme);
4949
`,
5050
);
5151
});
@@ -56,17 +56,17 @@ describe('autocomplete styles', () => {
5656
@use '@angular/material' as mat;
5757
$light-theme: ();
5858
$dark-theme: ();
59-
@include mat.autocomplete-theme($light-theme);
60-
@include mat.autocomplete-theme($dark-theme);
59+
@include mat.legacy-autocomplete-theme($light-theme);
60+
@include mat.legacy-autocomplete-theme($dark-theme);
6161
`,
6262
`
6363
@use '@angular/material' as mat;
6464
$light-theme: ();
6565
$dark-theme: ();
66-
@include mat.mdc-autocomplete-theme($light-theme);
67-
@include mat.mdc-autocomplete-typography($light-theme);
68-
@include mat.mdc-autocomplete-theme($dark-theme);
69-
@include mat.mdc-autocomplete-typography($dark-theme);
66+
@include mat.autocomplete-theme($light-theme);
67+
@include mat.autocomplete-typography($light-theme);
68+
@include mat.autocomplete-theme($dark-theme);
69+
@include mat.autocomplete-typography($dark-theme);
7070
`,
7171
);
7272
});
@@ -78,7 +78,7 @@ describe('autocomplete styles', () => {
7878
$theme: ();
7979
8080
81-
@include mat.autocomplete-theme($theme);
81+
@include mat.legacy-autocomplete-theme($theme);
8282
8383
8484
`,
@@ -87,8 +87,8 @@ describe('autocomplete styles', () => {
8787
$theme: ();
8888
8989
90-
@include mat.mdc-autocomplete-theme($theme);
91-
@include mat.mdc-autocomplete-typography($theme);
90+
@include mat.autocomplete-theme($theme);
91+
@include mat.autocomplete-typography($theme);
9292
9393
9494
`,

src/material/schematics/ng-generate/mdc-migration/rules/components/autocomplete/autocomplete-styles.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ export class AutocompleteStylesMigrator extends StyleMigrator {
1515

1616
mixinChanges = [
1717
{
18-
old: 'autocomplete-theme',
19-
new: ['mdc-autocomplete-theme', 'mdc-autocomplete-typography'],
18+
old: 'legacy-autocomplete-theme',
19+
new: ['autocomplete-theme', 'autocomplete-typography'],
2020
},
2121
];
2222

src/material/schematics/ng-generate/mdc-migration/rules/components/button/button-styles.spec.ts

Lines changed: 43 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -23,17 +23,17 @@ describe('button styles', () => {
2323
`
2424
@use '@angular/material' as mat;
2525
$theme: ();
26-
@include mat.button-theme($theme);
26+
@include mat.legacy-button-theme($theme);
2727
`,
2828
`
2929
@use '@angular/material' as mat;
3030
$theme: ();
31-
@include mat.mdc-button-theme($theme);
32-
@include mat.mdc-button-typography($theme);
33-
@include mat.mdc-fab-theme($theme);
34-
@include mat.mdc-fab-typography($theme);
35-
@include mat.mdc-icon-button-theme($theme);
36-
@include mat.mdc-icon-button-typography($theme);
31+
@include mat.button-theme($theme);
32+
@include mat.button-typography($theme);
33+
@include mat.fab-theme($theme);
34+
@include mat.fab-typography($theme);
35+
@include mat.icon-button-theme($theme);
36+
@include mat.icon-button-typography($theme);
3737
`,
3838
);
3939
});
@@ -43,19 +43,19 @@ describe('button styles', () => {
4343
`
4444
@use '@angular/material' as mat;
4545
$theme: ();
46-
@include mat.mdc-button-theme($theme);
47-
@include mat.mdc-button-typography($theme);
4846
@include mat.button-theme($theme);
47+
@include mat.button-typography($theme);
48+
@include mat.legacy-button-theme($theme);
4949
`,
5050
`
5151
@use '@angular/material' as mat;
5252
$theme: ();
53-
@include mat.mdc-button-theme($theme);
54-
@include mat.mdc-button-typography($theme);
55-
@include mat.mdc-fab-theme($theme);
56-
@include mat.mdc-fab-typography($theme);
57-
@include mat.mdc-icon-button-theme($theme);
58-
@include mat.mdc-icon-button-typography($theme);
53+
@include mat.button-theme($theme);
54+
@include mat.button-typography($theme);
55+
@include mat.fab-theme($theme);
56+
@include mat.fab-typography($theme);
57+
@include mat.icon-button-theme($theme);
58+
@include mat.icon-button-typography($theme);
5959
`,
6060
);
6161
});
@@ -65,17 +65,17 @@ describe('button styles', () => {
6565
`
6666
@use '@angular/material' as arbitrary;
6767
$theme: ();
68-
@include arbitrary.button-theme($theme);
68+
@include arbitrary.legacy-button-theme($theme);
6969
`,
7070
`
7171
@use '@angular/material' as arbitrary;
7272
$theme: ();
73-
@include arbitrary.mdc-button-theme($theme);
74-
@include arbitrary.mdc-button-typography($theme);
75-
@include arbitrary.mdc-fab-theme($theme);
76-
@include arbitrary.mdc-fab-typography($theme);
77-
@include arbitrary.mdc-icon-button-theme($theme);
78-
@include arbitrary.mdc-icon-button-typography($theme);
73+
@include arbitrary.button-theme($theme);
74+
@include arbitrary.button-typography($theme);
75+
@include arbitrary.fab-theme($theme);
76+
@include arbitrary.fab-typography($theme);
77+
@include arbitrary.icon-button-theme($theme);
78+
@include arbitrary.icon-button-typography($theme);
7979
`,
8080
);
8181
});
@@ -86,25 +86,25 @@ describe('button styles', () => {
8686
@use '@angular/material' as mat;
8787
$light-theme: ();
8888
$dark-theme: ();
89-
@include mat.button-theme($light-theme);
90-
@include mat.button-theme($dark-theme);
89+
@include mat.legacy-button-theme($light-theme);
90+
@include mat.legacy-button-theme($dark-theme);
9191
`,
9292
`
9393
@use '@angular/material' as mat;
9494
$light-theme: ();
9595
$dark-theme: ();
96-
@include mat.mdc-button-theme($light-theme);
97-
@include mat.mdc-button-typography($light-theme);
98-
@include mat.mdc-fab-theme($light-theme);
99-
@include mat.mdc-fab-typography($light-theme);
100-
@include mat.mdc-icon-button-theme($light-theme);
101-
@include mat.mdc-icon-button-typography($light-theme);
102-
@include mat.mdc-button-theme($dark-theme);
103-
@include mat.mdc-button-typography($dark-theme);
104-
@include mat.mdc-fab-theme($dark-theme);
105-
@include mat.mdc-fab-typography($dark-theme);
106-
@include mat.mdc-icon-button-theme($dark-theme);
107-
@include mat.mdc-icon-button-typography($dark-theme);
96+
@include mat.button-theme($light-theme);
97+
@include mat.button-typography($light-theme);
98+
@include mat.fab-theme($light-theme);
99+
@include mat.fab-typography($light-theme);
100+
@include mat.icon-button-theme($light-theme);
101+
@include mat.icon-button-typography($light-theme);
102+
@include mat.button-theme($dark-theme);
103+
@include mat.button-typography($dark-theme);
104+
@include mat.fab-theme($dark-theme);
105+
@include mat.fab-typography($dark-theme);
106+
@include mat.icon-button-theme($dark-theme);
107+
@include mat.icon-button-typography($dark-theme);
108108
`,
109109
);
110110
});
@@ -116,7 +116,7 @@ describe('button styles', () => {
116116
$theme: ();
117117
118118
119-
@include mat.button-theme($theme);
119+
@include mat.legacy-button-theme($theme);
120120
121121
122122
`,
@@ -125,12 +125,12 @@ describe('button styles', () => {
125125
$theme: ();
126126
127127
128-
@include mat.mdc-button-theme($theme);
129-
@include mat.mdc-button-typography($theme);
130-
@include mat.mdc-fab-theme($theme);
131-
@include mat.mdc-fab-typography($theme);
132-
@include mat.mdc-icon-button-theme($theme);
133-
@include mat.mdc-icon-button-typography($theme);
128+
@include mat.button-theme($theme);
129+
@include mat.button-typography($theme);
130+
@include mat.fab-theme($theme);
131+
@include mat.fab-typography($theme);
132+
@include mat.icon-button-theme($theme);
133+
@include mat.icon-button-typography($theme);
134134
135135
136136
`,

src/material/schematics/ng-generate/mdc-migration/rules/components/button/button-styles.ts

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,14 @@ export class ButtonStylesMigrator extends StyleMigrator {
1515

1616
mixinChanges = [
1717
{
18-
old: 'button-theme',
18+
old: 'legacy-button-theme',
1919
new: [
20-
'mdc-button-theme',
21-
'mdc-button-typography',
22-
'mdc-fab-theme',
23-
'mdc-fab-typography',
24-
'mdc-icon-button-theme',
25-
'mdc-icon-button-typography',
20+
'button-theme',
21+
'button-typography',
22+
'fab-theme',
23+
'fab-typography',
24+
'icon-button-theme',
25+
'icon-button-typography',
2626
],
2727
checkForDuplicates: true,
2828
},

0 commit comments

Comments
 (0)