@angular/cli 21.0.0-next.0 → 21.0.0-next.2

package/lib/config/schema.json

@@ -51,7 +51,6 @@
           "type": "string",
           "enum": [
             "npm",
-            "cnpm",
             "yarn",
             "pnpm",
             "bun"
@@ -118,7 +117,6 @@
           "type": "string",
           "enum": [
             "npm",
-            "cnpm",
             "yarn",
             "pnpm",
             "bun"
@@ -1007,7 +1005,8 @@
             "css",
             "scss",
             "sass",
-            "less"
+            "less",
+            "tailwind"
           ]
         },
         "skipTests": {
@@ -1050,6 +1049,15 @@
           "description": "Generate an application that does not use `zone.js`.",
           "type": "boolean",
           "default": false
+        },
+        "fileNameStyleGuide": {
+          "type": "string",
+          "enum": [
+            "2016",
+            "2025"
+          ],
+          "default": "2025",
+          "description": "The file naming convention to use for generated files. The '2025' style guide (default) uses a concise format (e.g., `app.ts` for the root component), while the '2016' style guide includes the type in the file name (e.g., `app.component.ts`). For more information, see the Angular Style Guide (https://angular.dev/style-guide)."
         }
       }
     },
@@ -1197,6 +1205,11 @@
           "type": "string",
           "description": "Append a custom type to the component's filename. For example, if you set the type to `container`, the file will be named `my-component.container.ts`."
         },
+        "addTypeToClassName": {
+          "type": "boolean",
+          "default": true,
+          "description": "When true, the 'type' option will be appended to the generated class name. When false, only the file name will include the type."
+        },
         "skipTests": {
           "type": "boolean",
           "description": "Skip the generation of unit test files `spec.ts`.",
@@ -1326,6 +1339,11 @@
         "type": {
           "type": "string",
           "description": "Append a custom type to the directive's filename. For example, if you set the type to `directive`, the file will be named `example.directive.ts`."
+        },
+        "addTypeToClassName": {
+          "type": "boolean",
+          "default": true,
+          "description": "When true, the 'type' option will be appended to the generated class name. When false, only the file name will include the type."
         }
       }
     },
@@ -1769,7 +1787,8 @@
             "css",
             "scss",
             "sass",
-            "less"
+            "less",
+            "tailwind"
           ]
         },
         "skipTests": {
@@ -1800,7 +1819,6 @@
             "npm",
             "yarn",
             "pnpm",
-            "cnpm",
             "bun"
           ]
         },
@@ -1833,6 +1851,15 @@
               "windsurf"
             ]
           }
+        },
+        "fileNameStyleGuide": {
+          "type": "string",
+          "enum": [
+            "2016",
+            "2025"
+          ],
+          "default": "2025",
+          "description": "The file naming convention to use for generated files. The '2025' style guide (default) uses a concise format (e.g., `app.ts` for the root component), while the '2016' style guide includes the type in the file name (e.g., `app.component.ts`). For more information, see the Angular Style Guide (https://angular.dev/style-guide)."
         }
       }
     },
@@ -1934,6 +1961,11 @@
         "type": {
           "type": "string",
           "description": "Append a custom type to the service's filename. For example, if you set the type to `service`, the file will be named `my-service.service.ts`."
+        },
+        "addTypeToClassName": {
+          "type": "boolean",
+          "default": true,
+          "description": "When true, the 'type' option will be appended to the generated class name. When false, only the file name will include the type."
         }
       }
     },

package/lib/config/workspace-schema.d.ts

@@ -67,7 +67,6 @@ export declare enum Environment {
  */
 export declare enum PackageManager {
     Bun = "bun",
-    Cnpm = "cnpm",
     Npm = "npm",
     Pnpm = "pnpm",
     Yarn = "yarn"
@@ -106,6 +105,13 @@ export type SchematicOptions = {
  * routing, styling, and testing.
  */
 export type AngularApplicationOptionsSchema = {
+    /**
+     * The file naming convention to use for generated files. The '2025' style guide (default)
+     * uses a concise format (e.g., `app.ts` for the root component), while the '2016' style
+     * guide includes the type in the file name (e.g., `app.component.ts`). For more
+     * information, see the Angular Style Guide (https://angular.dev/style-guide).
+     */
+    fileNameStyleGuide?: FileNameStyleGuide;
     /**
      * Include the styles for the root component directly within the `app.component.ts` file.
      * Only CSS styles can be included inline. By default, a separate stylesheet file (e.g.,
@@ -187,6 +193,16 @@ export type AngularApplicationOptionsSchema = {
      */
     zoneless?: boolean;
 };
+/**
+ * The file naming convention to use for generated files. The '2025' style guide (default)
+ * uses a concise format (e.g., `app.ts` for the root component), while the '2016' style
+ * guide includes the type in the file name (e.g., `app.component.ts`). For more
+ * information, see the Angular Style Guide (https://angular.dev/style-guide).
+ */
+export declare enum FileNameStyleGuide {
+    The2016 = "2016",
+    The2025 = "2025"
+}
 /**
  * The type of stylesheet files to be created for components in the application.
  *
@@ -196,7 +212,8 @@ export declare enum SchematicsAngularApplicationStyle {
     Css = "css",
     Less = "less",
     Sass = "sass",
-    Scss = "scss"
+    Scss = "scss",
+    Tailwind = "tailwind"
 }
 /**
  * Sets the view encapsulation mode for the application's components. This determines how
@@ -253,6 +270,11 @@ export type AngularClassOptionsSchema = {
  * optional CSS stylesheet. Use this schematic to generate a new component in your project.
  */
 export type AngularComponentOptionsSchema = {
+    /**
+     * When true, the 'type' option will be appended to the generated class name. When false,
+     * only the file name will include the type.
+     */
+    addTypeToClassName?: boolean;
     /**
      * Configures the change detection strategy for the component.
      */
@@ -381,6 +403,11 @@ export declare enum SchematicsAngularComponentStyle {
  * and boilerplate code for a new directive.
  */
 export type AngularDirectiveOptionsSchema = {
+    /**
+     * When true, the 'type' option will be appended to the generated class name. When false,
+     * only the file name will include the type.
+     */
+    addTypeToClassName?: boolean;
     /**
      * Automatically export the directive from the specified NgModule, making it accessible to
      * other modules in the application.
@@ -692,6 +719,13 @@ export type AngularNgNewOptionsSchema = {
      * the workspace will be created in the current directory.
      */
     directory?: string;
+    /**
+     * The file naming convention to use for generated files. The '2025' style guide (default)
+     * uses a concise format (e.g., `app.ts` for the root component), while the '2016' style
+     * guide includes the type in the file name (e.g., `app.component.ts`). For more
+     * information, see the Angular Style Guide (https://angular.dev/style-guide).
+     */
+    fileNameStyleGuide?: FileNameStyleGuide;
     /**
      * Include the styles for the initial application's root component directly within the
      * `app.component.ts` file. By default, a separate stylesheet file (e.g.,
@@ -907,6 +941,11 @@ export type AngularResolverOptionsSchema = {
  * process of generating a new service with the necessary files and boilerplate code.
  */
 export type AngularServiceOptionsSchema = {
+    /**
+     * When true, the 'type' option will be appended to the generated class name. When false,
+     * only the file name will include the type.
+     */
+    addTypeToClassName?: boolean;
     /**
      * Creates files at the top level of the project or the given path. If set to false, a new
      * folder with the service's name will be created to contain the files.

package/lib/config/workspace-schema.js

@@ -2,7 +2,7 @@
 // THIS FILE IS AUTOMATICALLY GENERATED. TO UPDATE THIS FILE YOU NEED TO CHANGE THE
 // CORRESPONDING JSON SCHEMA FILE, THEN RUN devkit-admin build (or bazel build ...).
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AiConfig = exports.TypeSeparator = exports.Implement = exports.SchematicsAngularComponentStyle = exports.ChangeDetection = exports.ViewEncapsulation = exports.SchematicsAngularApplicationStyle = exports.PackageManager = exports.Environment = void 0;
+exports.AiConfig = exports.TypeSeparator = exports.Implement = exports.SchematicsAngularComponentStyle = exports.ChangeDetection = exports.ViewEncapsulation = exports.SchematicsAngularApplicationStyle = exports.FileNameStyleGuide = exports.PackageManager = exports.Environment = void 0;
 /**
  * Configure in which environment disk cache is enabled.
  */
@@ -20,11 +20,21 @@ var Environment;
 var PackageManager;
 (function (PackageManager) {
     PackageManager["Bun"] = "bun";
-    PackageManager["Cnpm"] = "cnpm";
     PackageManager["Npm"] = "npm";
     PackageManager["Pnpm"] = "pnpm";
     PackageManager["Yarn"] = "yarn";
 })(PackageManager || (exports.PackageManager = PackageManager = {}));
+/**
+ * The file naming convention to use for generated files. The '2025' style guide (default)
+ * uses a concise format (e.g., `app.ts` for the root component), while the '2016' style
+ * guide includes the type in the file name (e.g., `app.component.ts`). For more
+ * information, see the Angular Style Guide (https://angular.dev/style-guide).
+ */
+var FileNameStyleGuide;
+(function (FileNameStyleGuide) {
+    FileNameStyleGuide["The2016"] = "2016";
+    FileNameStyleGuide["The2025"] = "2025";
+})(FileNameStyleGuide || (exports.FileNameStyleGuide = FileNameStyleGuide = {}));
 /**
  * The type of stylesheet files to be created for components in the application.
  *
@@ -36,6 +46,7 @@ var SchematicsAngularApplicationStyle;
     SchematicsAngularApplicationStyle["Less"] = "less";
     SchematicsAngularApplicationStyle["Sass"] = "sass";
     SchematicsAngularApplicationStyle["Scss"] = "scss";
+    SchematicsAngularApplicationStyle["Tailwind"] = "tailwind";
 })(SchematicsAngularApplicationStyle || (exports.SchematicsAngularApplicationStyle = SchematicsAngularApplicationStyle = {}));
 /**
  * Sets the view encapsulation mode for the application's components. This determines how

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular/cli",
-  "version": "21.0.0-next.0",
+  "version": "21.0.0-next.2",
   "description": "CLI tool for Angular",
   "main": "lib/cli/index.js",
   "bin": {
@@ -25,18 +25,18 @@
   },
   "homepage": "https://github.com/angular/angular-cli",
   "dependencies": {
-    "@angular-devkit/architect": "0.2100.0-next.0",
-    "@angular-devkit/core": "21.0.0-next.0",
-    "@angular-devkit/schematics": "21.0.0-next.0",
-    "@inquirer/prompts": "7.8.3",
-    "@listr2/prompt-adapter-inquirer": "3.0.1",
-    "@modelcontextprotocol/sdk": "1.17.3",
-    "@schematics/angular": "21.0.0-next.0",
+    "@angular-devkit/architect": "0.2100.0-next.2",
+    "@angular-devkit/core": "21.0.0-next.2",
+    "@angular-devkit/schematics": "21.0.0-next.2",
+    "@inquirer/prompts": "7.8.4",
+    "@listr2/prompt-adapter-inquirer": "3.0.3",
+    "@modelcontextprotocol/sdk": "1.17.5",
+    "@schematics/angular": "21.0.0-next.2",
     "@yarnpkg/lockfile": "1.1.0",
-    "algoliasearch": "5.35.0",
+    "algoliasearch": "5.37.0",
     "ini": "5.0.0",
     "jsonc-parser": "3.3.1",
-    "listr2": "9.0.1",
+    "listr2": "9.0.3",
     "npm-package-arg": "13.0.0",
     "pacote": "21.0.0",
     "resolve": "1.22.10",
@@ -47,17 +47,17 @@
   "ng-update": {
     "migrations": "@schematics/angular/migrations/migration-collection.json",
     "packageGroup": {
-      "@angular/cli": "21.0.0-next.0",
-      "@angular/build": "21.0.0-next.0",
-      "@angular/ssr": "21.0.0-next.0",
-      "@angular-devkit/architect": "0.2100.0-next.0",
-      "@angular-devkit/build-angular": "21.0.0-next.0",
-      "@angular-devkit/build-webpack": "0.2100.0-next.0",
-      "@angular-devkit/core": "21.0.0-next.0",
-      "@angular-devkit/schematics": "21.0.0-next.0"
+      "@angular/cli": "21.0.0-next.2",
+      "@angular/build": "21.0.0-next.2",
+      "@angular/ssr": "21.0.0-next.2",
+      "@angular-devkit/architect": "0.2100.0-next.2",
+      "@angular-devkit/build-angular": "21.0.0-next.2",
+      "@angular-devkit/build-webpack": "0.2100.0-next.2",
+      "@angular-devkit/core": "21.0.0-next.2",
+      "@angular-devkit/schematics": "21.0.0-next.2"
     }
   },
-  "packageManager": "pnpm@10.15.0",
+  "packageManager": "pnpm@10.15.1",
   "engines": {
     "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
     "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",

package/src/command-builder/architect-command-module.js

@@ -109,9 +109,14 @@ let ArchitectCommandModule = (() => {
             return this.addSchemaOptionsToCommand(localYargs, schemaOptions);
         }
         async run(options) {
-            const target = this.getArchitectTarget();
-            const { configuration = '', project, ...architectOptions } = options;
-            if (!project) {
+            const originalProcessTitle = process.title;
+            try {
+                const target = this.getArchitectTarget();
+                const { configuration = '', project, ...architectOptions } = options;
+                if (project) {
+                    process.title = `${originalProcessTitle} (${project})`;
+                    return await this.runSingleTarget({ configuration, target, project }, architectOptions);
+                }
                 // This runs each target sequentially.
                 // Running them in parallel would jumble the log messages.
                 let result = 0;
@@ -120,12 +125,13 @@ let ArchitectCommandModule = (() => {
                     return this.onMissingTarget('Cannot determine project or target for command.');
                 }
                 for (const project of projectNames) {
+                    process.title = `${originalProcessTitle} (${project})`;
                     result |= await this.runSingleTarget({ configuration, target, project }, architectOptions);
                 }
                 return result;
             }
-            else {
-                return await this.runSingleTarget({ configuration, target, project }, architectOptions);
+            finally {
+                process.title = originalProcessTitle;
             }
         }
         getArchitectProject() {

package/src/command-builder/schematics-command-module.js

@@ -224,13 +224,18 @@ let SchematicsCommandModule = (() => {
                                         ? {
                                             name: item,
                                             value: item,
-                                            checked: item === definition.default,
+                                            checked: definition.multiselect && Array.isArray(definition.default)
+                                                ? definition.default?.includes(item)
+                                                : item === definition.default,
                                         }
                                         : {
                                             ...item,
                                             name: item.label,
                                             value: item.value,
-                                            checked: item.value === definition.default,
+                                            checked: definition.multiselect && Array.isArray(definition.default)
+                                                ? // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                                                    definition.default?.includes(item.value)
+                                                : item.value === definition.default,
                                         }),
                                 });
                                 break;

package/src/command-builder/utilities/json-schema.js

@@ -120,11 +120,15 @@ async function parseJsonSchemaToOptions(registry, schema, interactive = true) {
         if (current.default !== undefined) {
             switch (types[0]) {
                 case 'string':
-                case 'array':
                     if (typeof current.default == 'string') {
                         defaultValue = current.default;
                     }
                     break;
+                case 'array':
+                    if (Array.isArray(current.default) && current.default.length > 0) {
+                        defaultValue = current.default;
+                    }
+                    break;
                 case 'number':
                     if (typeof current.default == 'number') {
                         defaultValue = current.default;

package/src/command-builder/utilities/schematic-engine-host.js

@@ -47,11 +47,9 @@ function shouldWrapSchematic(schematicFile, schematicEncapsulation) {
     }
     // Check for first-party Angular schematic packages
     // Angular schematics are safe to use in the wrapped VM context
-    if (/\/node_modules\/@(?:angular|schematics|nguniversal)\//.test(normalizedSchematicFile)) {
-        return true;
-    }
-    // Otherwise use the value of the schematic collection's encapsulation option (current default of false)
-    return schematicEncapsulation;
+    const isFirstParty = /\/node_modules\/@(?:angular|schematics|nguniversal)\//.test(normalizedSchematicFile);
+    // Use value of defined option if present, otherwise default to first-party usage.
+    return schematicEncapsulation ?? isFirstParty;
 }
 class SchematicEngineHost extends tools_1.NodeModulesEngineHost {
     _resolveReferenceString(refString, parentPath, collectionDescription) {
@@ -60,7 +58,7 @@ class SchematicEngineHost extends tools_1.NodeModulesEngineHost {
         const fullPath = path[0] === '.' ? (0, node_path_1.resolve)(parentPath ?? process.cwd(), path) : path;
         const referenceRequire = (0, node_module_1.createRequire)(__filename);
         const schematicFile = referenceRequire.resolve(fullPath, { paths: [parentPath] });
-        if (shouldWrapSchematic(schematicFile, !!collectionDescription?.encapsulation)) {
+        if (shouldWrapSchematic(schematicFile, collectionDescription?.encapsulation)) {
             const schematicPath = (0, node_path_1.dirname)(schematicFile);
             const moduleCache = new Map();
             const factoryInitializer = wrap(schematicFile, schematicPath, moduleCache, name || 'default');

package/src/commands/add/cli.d.ts

@@ -15,6 +15,7 @@ interface AddCommandArgs extends SchematicsCommandArgs {
     'skip-confirmation'?: boolean;
 }
 export default class AddCommandModule extends SchematicsCommandModule implements CommandModuleImplementation<AddCommandArgs> {
+    #private;
     command: string;
     describe: string;
     longDescriptionPath: string;
@@ -33,6 +34,6 @@ export default class AddCommandModule extends SchematicsCommandModule implements
     private isPackageInstalled;
     private executeSchematic;
     private findProjectVersion;
-    private hasMismatchedPeer;
+    private getPeerDependencyConflicts;
 }
 export {};