Skip to content

Commit 4573263

Browse files
authored
fix(material/schematics): improve instructions for dealing with typography changes (#25950)
1 parent 1e56524 commit 4573263

File tree

2 files changed

+32
-9
lines changed

2 files changed

+32
-9
lines changed

src/material/schematics/ng-update/migrations/legacy-components-v15/index.ts

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -74,14 +74,27 @@ export class LegacyComponentsMigration extends Migration<null> {
7474
const includeTypography = [atInclude, delim, mixinName, updatedFunctionsRest]
7575
.join('')
7676
.replace(`${namespace}.core`, `${namespace}.all-legacy-component-typographies`);
77+
// If there are no params, pass the default typography config.
78+
const hierarchyParams =
79+
updatedFunctionsRest.replace(/[()\s]/g, '') === ''
80+
? `(${namespace}.define-legacy-typography-config())`
81+
: updatedFunctionsRest;
82+
const includeHierarchy = [atInclude, delim, mixinName, hierarchyParams]
83+
.join('')
84+
.replace(`${namespace}.core`, `${namespace}.legacy-typography-hierarchy`);
7785
const indent = original.match(/^\s*/)?.[0] || '';
7886
// Replace the whole original with a comment, typography include, and legacy-core include.
7987
this._replaceAt(filePath, node.source.start.offset, {
8088
old: original,
8189
new: [
82-
`${indent}// TODO(v15): As of v15 ${namespace}.legacy-core no longer includes default typography styles.`,
83-
`${indent}// Instead an explicit typography include has been automatically added here.`,
84-
`${indent}// If you add typography styles elsewhere, you may want to remove this.`,
90+
`// TODO(v15): As of v15 ${namespace}.legacy-core no longer includes default typography styles.`,
91+
`// The following line adds:`,
92+
`// 1. Default typography styles for all components`,
93+
`// 2. Styles for typography hierarchy classes (e.g. .mat-headline-1)`,
94+
`// If you specify typography styles for the components you use elsewhere, you should delete this line.`,
95+
`// If you don't need the default component typographies but still want the hierarchy styles,`,
96+
`// you can delete this line and instead use:`,
97+
`// \`${includeHierarchy};\``,
8598
`${includeTypography};`,
8699
`${indent}@include ${namespace}.legacy-core()`,
87100
].join('\n'),

src/material/schematics/ng-update/test-cases/v15/legacy-components-v15.spec.ts

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -285,20 +285,30 @@ describe('v15 legacy components migration', () => {
285285
old: [
286286
`@use '@angular/material' as mat;`,
287287
`@include mat.core();`,
288-
`@include mat.core(mat.define-typography-config());`,
288+
`@include mat.core(mat.define-typography-config(()));`,
289289
`@include mat.core-theme(())`,
290290
],
291291
new: [
292292
`@use '@angular/material' as mat;`,
293293
`// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.`,
294-
`// Instead an explicit typography include has been automatically added here.`,
295-
`// If you add typography styles elsewhere, you may want to remove this.`,
294+
`// The following line adds:`,
295+
`// 1. Default typography styles for all components`,
296+
`// 2. Styles for typography hierarchy classes (e.g. .mat-headline-1)`,
297+
`// If you specify typography styles for the components you use elsewhere, you should delete this line.`,
298+
`// If you don't need the default component typographies but still want the hierarchy styles,`,
299+
`// you can delete this line and instead use:`,
300+
`// \`@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());\``,
296301
`@include mat.all-legacy-component-typographies();`,
297302
`@include mat.legacy-core();`,
298303
`// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.`,
299-
`// Instead an explicit typography include has been automatically added here.`,
300-
`// If you add typography styles elsewhere, you may want to remove this.`,
301-
`@include mat.all-legacy-component-typographies(mat.define-legacy-typography-config());`,
304+
`// The following line adds:`,
305+
`// 1. Default typography styles for all components`,
306+
`// 2. Styles for typography hierarchy classes (e.g. .mat-headline-1)`,
307+
`// If you specify typography styles for the components you use elsewhere, you should delete this line.`,
308+
`// If you don't need the default component typographies but still want the hierarchy styles,`,
309+
`// you can delete this line and instead use:`,
310+
`// \`@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config(()));\``,
311+
`@include mat.all-legacy-component-typographies(mat.define-legacy-typography-config(()));`,
302312
`@include mat.legacy-core();`,
303313
`@include mat.legacy-core-theme(())`,
304314
],

0 commit comments

Comments
 (0)