Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/cdk/schematics/migration.json
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
{
"$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
"schematics": {
"migration-v20": {
"version": "20.0.0-0",
"description": "Updates the Angular CDK to v20",
"factory": "./ng-update/index#updateToV20"
"migration-v21": {
"version": "21.0.0-0",
"description": "Updates the Angular CDK to v21",
"factory": "./ng-update/index#updateToV21"
},
"ng-post-update": {
"description": "Prints out results after ng-update.",
Expand Down
4 changes: 2 additions & 2 deletions src/cdk/schematics/ng-update/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@ import {createMigrationSchematicRule, NullableDevkitMigration} from './devkit-mi
const cdkMigrations: NullableDevkitMigration[] = [];

/** Entry point for the migration schematics with target of Angular CDK 20.0.0 */
export function updateToV20(): Rule {
export function updateToV21(): Rule {
return createMigrationSchematicRule(
TargetVersion.V20,
TargetVersion.V21,
cdkMigrations,
cdkUpgradeData,
onMigrationComplete,
Expand Down
2 changes: 1 addition & 1 deletion src/cdk/schematics/update-tool/target-version.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@

// tslint:disable-next-line:prefer-const-enum
export enum TargetVersion {
V20 = 'version 20',
V21 = 'version 21',
}

/**
Expand Down
8 changes: 4 additions & 4 deletions src/google-maps/schematics/migration.json
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
{
"schematics": {
"migration-v20": {
"version": "20.0.0-0",
"description": "Updates the Angular Google Maps package to v20",
"factory": "./ng-update/index#updateToV20"
"migration-v21": {
"version": "21.0.0-0",
"description": "Updates the Angular Google Maps package to v21",
"factory": "./ng-update/index#updateToV21"
}
}
}
4 changes: 2 additions & 2 deletions src/google-maps/schematics/ng-update/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@

import {Rule} from '@angular-devkit/schematics';

/** Entry point for the migration schematics with target of Angular Material v20 */
export function updateToV20(): Rule {
/** Entry point for the migration schematics with target of Angular Material v21 */
export function updateToV21(): Rule {
return () => {};
}
6 changes: 3 additions & 3 deletions src/material/schematics/migration.json
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
{
"$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
"schematics": {
"migration-v20": {
"migration-v21": {
"version": "20.0.0-0",
"description": "Updates Angular Material to v20",
"factory": "./ng-update/index_bundled#updateToV20"
"description": "Updates Angular Material to v21",
"factory": "./ng-update/index_bundled#updateToV21"
}
}
}
114 changes: 5 additions & 109 deletions src/material/schematics/ng-update/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,124 +6,20 @@
* found in the LICENSE file at https://angular.dev/license
*/

import {chain, Rule, SchematicContext} from '@angular-devkit/schematics';
import {chain, Rule} from '@angular-devkit/schematics';
import {
createMigrationSchematicRule,
NullableDevkitMigration,
TargetVersion,
} from '@angular/cdk/schematics';

import {materialUpgradeData} from './upgrade-data';
import {MatCoreMigration} from './migrations/mat-core-removal';
import {ExplicitSystemVariablePrefixMigration} from './migrations/explicit-system-variable-prefix';

const materialMigrations: NullableDevkitMigration[] = [
MatCoreMigration,
ExplicitSystemVariablePrefixMigration,
];
const materialMigrations: NullableDevkitMigration[] = [];

/** Entry point for the migration schematics with target of Angular Material v20 */
export function updateToV20(): Rule {
/** Entry point for the migration schematics with target of Angular Material v21 */
export function updateToV21(): Rule {
return chain([
createMigrationSchematicRule(
TargetVersion.V20,
materialMigrations,
materialUpgradeData,
onMigrationComplete,
),
renameMdcTokens(),
renameComponentTokens(),
createMigrationSchematicRule(TargetVersion.V21, materialMigrations, materialUpgradeData),
]);
}

// Whether the given path should be included when renaming theme token names.
function shouldRenameTokens(path: string) {
if (path.includes('node_modules') || path.includes('.angular') || path.includes('.git')) {
return false;
}

return (
path.endsWith('.html') ||
path.endsWith('.css') ||
path.endsWith('.scss') ||
path.endsWith('.ts')
);
}

// Renames any CSS variables beginning with "--mdc-" to be "--mat-". These CSS variables
// refer to tokens that used to be derived from a mix of MDC and Angular. Now all the tokens
// are converged on being prefixed "--mat-".
function renameMdcTokens(): Rule {
return tree => {
tree.visit(path => {
if (shouldRenameTokens(path)) {
const content = tree.readText(path);
const updatedContent = content.replaceAll('--mdc-', '--mat-');
if (content !== updatedContent) {
tree.overwrite(path, updatedContent);
}
}
});
};
}

// Renames Angular Material component token CSS variables that were renamed so that the base
// component's name came first or otherwise renamed to match our terminology instead of MDC's.
function renameComponentTokens(): Rule {
const tokenPrefixes = [
{old: '--mat-circular-progress', replacement: '--mat-progress-spinner'},
{old: '--mat-elevated-card', replacement: '--mat-card-elevated'},
{old: '--mat-extended-fab', replacement: '--mat-fab-extended'},
{old: '--mat-filled-button', replacement: '--mat-button-filled'},
{old: '--mat-filled-text-field', replacement: '--mat-form-field-filled'},
{old: '--mat-full-pseudo-checkbox', replacement: '--mat-pseudo-checkbox-full'},
{old: '--mat-legacy-button-toggle', replacement: '--mat-button-toggle-legacy'},
{old: '--mat-linear-progress', replacement: '--mat-progress-bar'},
{old: '--mat-minimal-pseudo-checkbox', replacement: '--mat-pseudo-checkbox-minimal'},
{old: '--mat-outlined-button', replacement: '--mat-button-outlined'},
{old: '--mat-outlined-card', replacement: '--mat-card-outlined'},
{old: '--mat-outlined-text-field', replacement: '--mat-form-field-outlined'},
{old: '--mat-plain-tooltip', replacement: '--mat-tooltip'},
{old: '--mat-protected-button', replacement: '--mat-button-protected'},
{old: '--mat-secondary-navigation-tab', replacement: '--mat-tab'},
{old: '--mat-standard-button-toggle', replacement: '--mat-button-toggle'},
{old: '--mat-switch', replacement: '--mat-slide-toggle'},
{old: '--mat-tab-header', replacement: '--mat-tab'},
{old: '--mat-tab-header-with-background', replacement: '--mat-tab'},
{old: '--mat-tab-indicator', replacement: '--mat-tab'},
{old: '--mat-text-button', replacement: '--mat-button-text'},
{old: '--mat-tonal-button', replacement: '--mat-button-tonal'},
];
return tree => {
tree.visit(path => {
if (shouldRenameTokens(path)) {
const content = tree.readText(path);
let updatedContent = content;
for (const tokenPrefix of tokenPrefixes) {
updatedContent = updatedContent.replaceAll(tokenPrefix.old, tokenPrefix.replacement);
}
if (content !== updatedContent) {
tree.overwrite(path, updatedContent);
}
}
});
};
}

/** Function that will be called when the migration completed. */
function onMigrationComplete(
context: SchematicContext,
targetVersion: TargetVersion,
hasFailures: boolean,
) {
context.logger.info('');
context.logger.info(` ✓ Updated Angular Material to ${targetVersion}`);
context.logger.info('');

if (hasFailures) {
context.logger.warn(
' ⚠ Some issues were detected but could not be fixed automatically. Please check the ' +
'output above and fix these issues manually.',
);
}
}

This file was deleted.

Loading
Loading