@nx/angular 17.0.0-beta.1 → 17.0.0-beta.4

package/executors.json

@@ -22,21 +22,6 @@
     }
   },
   "builders": {
-    "delegate-build": {
-      "implementation": "./src/executors/delegate-build/compat",
-      "schema": "./src/executors/delegate-build/schema.json",
-      "description": "Delegates the build to a different target while supporting incremental builds."
-    },
-    "ng-packagr-lite": {
-      "implementation": "./src/executors/ng-packagr-lite/compat",
-      "schema": "./src/executors/ng-packagr-lite/schema.json",
-      "description": "Builds a library with support for incremental builds.\nThis executor is meant to be used with buildable libraries in an incremental build scenario. It is similar to the `@nrwl/angular:package` executor but with some key differences:\n- It doesn't run `ngcc` automatically (`ngcc` needs to be run separately beforehand if needed, this can be done in a `postinstall` hook on `package.json`)\n- It only produces ESM2020 bundles\n- It doesn't generate package exports in the `package.json`"
-    },
-    "package": {
-      "implementation": "./src/executors/package/compat",
-      "schema": "./src/executors/package/schema.json",
-      "description": "Builds and packages an Angular library to be distributed as an NPM package. It supports incremental builds."
-    },
     "webpack-browser": {
       "implementation": "./src/builders/webpack-browser/webpack-browser.impl",
       "schema": "./src/builders/webpack-browser/schema.json",
@@ -61,11 +46,6 @@
       "implementation": "./src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl",
       "schema": "./src/builders/module-federation-dev-ssr/schema.json",
       "description": "The module-federation-dev-ssr executor is reserved exclusively for use with host Module Federation applications that use SSR. It allows the user to specify which remote applications should be served with the host."
-    },
-    "browser-esbuild": {
-      "implementation": "./src/executors/browser-esbuild/compat",
-      "schema": "./src/executors/browser-esbuild/schema.json",
-      "description": "Builds your application with esbuild and adds support for incremental builds."
     }
   }
 }

package/generators.d.ts

@@ -4,6 +4,7 @@ export * from './src/generators/component-cypress-spec/component-cypress-spec';
 export * from './src/generators/component-story/component-story';
 export * from './src/generators/component/component';
 export * from './src/generators/directive/directive';
+export * from './src/generators/federate-module/federate-module';
 export * from './src/generators/host/host';
 export * from './src/generators/init/init';
 export * from './src/generators/library-secondary-entry-point/library-secondary-entry-point';

package/generators.js

@@ -7,6 +7,7 @@ tslib_1.__exportStar(require("./src/generators/component-cypress-spec/component-
 tslib_1.__exportStar(require("./src/generators/component-story/component-story"), exports);
 tslib_1.__exportStar(require("./src/generators/component/component"), exports);
 tslib_1.__exportStar(require("./src/generators/directive/directive"), exports);
+tslib_1.__exportStar(require("./src/generators/federate-module/federate-module"), exports);
 tslib_1.__exportStar(require("./src/generators/host/host"), exports);
 tslib_1.__exportStar(require("./src/generators/init/init"), exports);
 tslib_1.__exportStar(require("./src/generators/library-secondary-entry-point/library-secondary-entry-point"), exports);

package/generators.json

@@ -2,154 +2,6 @@
   "name": "Nx Angular",
   "version": "0.1",
   "extends": ["@schematics/angular", "@nx/workspace"],
-  "schematics": {
-    "add-linting": {
-      "factory": "./src/generators/add-linting/compat",
-      "schema": "./src/generators/add-linting/schema.json",
-      "description": "Adds linting configuration to an Angular project.",
-      "hidden": true
-    },
-    "application": {
-      "factory": "./src/generators/application/application.compat#applicationSchematic",
-      "schema": "./src/generators/application/schema.json",
-      "aliases": ["app"],
-      "x-type": "application",
-      "description": "Creates an Angular application."
-    },
-    "component": {
-      "factory": "./src/generators/component/component.compat",
-      "schema": "./src/generators/component/schema.json",
-      "aliases": ["c"],
-      "description": "Generate an Angular Component."
-    },
-    "component-cypress-spec": {
-      "factory": "./src/generators/component-cypress-spec/compat",
-      "schema": "./src/generators/component-cypress-spec/schema.json",
-      "description": "Creates a Cypress spec for a UI component that has a story.",
-      "hidden": true
-    },
-    "component-story": {
-      "factory": "./src/generators/component-story/compat",
-      "schema": "./src/generators/component-story/schema.json",
-      "description": "Creates a `stories.ts` file for a component.",
-      "hidden": true
-    },
-    "component-test": {
-      "factory": "./src/generators/component-test/compat",
-      "schema": "./src/generators/component-test/schema.json",
-      "description": "Creates a cypress component test file for a component."
-    },
-    "init": {
-      "factory": "./src/generators/init/init.compat#initSchematic",
-      "schema": "./src/generators/init/schema.json",
-      "description": "Initializes the `@nrwl/angular` plugin.",
-      "hidden": true
-    },
-    "library": {
-      "factory": "./src/generators/library/library.compat#librarySchematic",
-      "schema": "./src/generators/library/schema.json",
-      "aliases": ["lib"],
-      "x-type": "library",
-      "description": "Creates an Angular library."
-    },
-    "library-secondary-entry-point": {
-      "factory": "./src/generators/library-secondary-entry-point/compat",
-      "schema": "./src/generators/library-secondary-entry-point/schema.json",
-      "aliases": ["secondary-entry-point", "entry-point"],
-      "description": "Creates a secondary entry point for an Angular publishable library."
-    },
-    "remote": {
-      "factory": "./src/generators/remote/remote.compat",
-      "schema": "./src/generators/remote/schema.json",
-      "x-type": "application",
-      "description": "Generate a Remote Angular Module Federation Application."
-    },
-    "move": {
-      "factory": "./src/generators/move/compat",
-      "schema": "./src/generators/move/schema.json",
-      "aliases": ["mv"],
-      "description": "Moves an Angular application or library to another folder within the workspace and updates the project configuration.",
-      "x-deprecated": "Use the `@nx/workspace:move` generator instead. This generator will be removed in Nx v18."
-    },
-    "convert-to-with-mf": {
-      "factory": "./src/generators/convert-to-with-mf/convert-to-with-mf.compat",
-      "schema": "./src/generators/convert-to-with-mf/schema.json",
-      "description": "Converts an old micro frontend configuration to use the new `withModuleFederation` helper. It will run successfully if the following conditions are met: \n - Is either a host or remote application \n - Shared npm package configurations have not been modified \n - Name used to identify the Micro Frontend application matches the project name \n\n{% callout type=\"warning\" title=\"Overrides\" %}This generator will overwrite your webpack config. If you have additional custom configuration in your config file, it will be lost!{% /callout %}"
-    },
-    "host": {
-      "factory": "./src/generators/host/host.compat",
-      "schema": "./src/generators/host/schema.json",
-      "x-type": "application",
-      "description": "Generate a Host Angular Module Federation Application."
-    },
-    "ng-add": {
-      "factory": "./src/generators/ng-add/compat",
-      "schema": "./src/generators/ng-add/schema.json",
-      "description": "Migrates an Angular CLI workspace to Nx or adds the Angular plugin to an Nx workspace.",
-      "hidden": true
-    },
-    "ngrx": {
-      "factory": "./src/generators/ngrx/compat",
-      "schema": "./src/generators/ngrx/schema.json",
-      "description": "Adds NgRx support to an application or library.",
-      "x-deprecated": "This generator is deprecated and will be removed in a future version of Nx. Use the 'ngrx-root-store' and 'ngrx-feature-store' generators instead."
-    },
-    "scam-to-standalone": {
-      "factory": "./src/generators/scam-to-standalone/compat",
-      "schema": "./src/generators/scam-to-standalone/schema.json",
-      "description": "Convert an existing Single Component Angular Module (SCAM) to a Standalone Component."
-    },
-    "scam": {
-      "factory": "./src/generators/scam/scam.compat",
-      "schema": "./src/generators/scam/schema.json",
-      "description": "Generate a component with an accompanying Single Component Angular Module (SCAM)."
-    },
-    "scam-directive": {
-      "factory": "./src/generators/scam-directive/scam-directive.compat",
-      "schema": "./src/generators/scam-directive/schema.json",
-      "description": "Generate a directive with an accompanying Single Component Angular Module (SCAM)."
-    },
-    "scam-pipe": {
-      "factory": "./src/generators/scam-pipe/scam-pipe.compat",
-      "schema": "./src/generators/scam-pipe/schema.json",
-      "description": "Generate a pipe with an accompanying Single Component Angular Module (SCAM)."
-    },
-    "setup-mf": {
-      "factory": "./src/generators/setup-mf/setup-mf.compat",
-      "schema": "./src/generators/setup-mf/schema.json",
-      "description": "Generate a Module Federation configuration for a given Angular application."
-    },
-    "setup-ssr": {
-      "factory": "./src/generators/setup-ssr/setup-ssr.compat",
-      "schema": "./src/generators/setup-ssr/schema.json",
-      "description": "Generate Angular Universal (SSR) setup for an Angular application."
-    },
-    "setup-tailwind": {
-      "factory": "./src/generators/setup-tailwind/setup-tailwind.compat",
-      "schema": "./src/generators/setup-tailwind/schema.json",
-      "description": "Configures Tailwind CSS for an application or a buildable/publishable library."
-    },
-    "stories": {
-      "factory": "./src/generators/stories/compat",
-      "schema": "./src/generators/stories/schema.json",
-      "description": "Creates stories/specs for all components declared in a project."
-    },
-    "storybook-configuration": {
-      "factory": "./src/generators/storybook-configuration/compat",
-      "schema": "./src/generators/storybook-configuration/schema.json",
-      "description": "Adds Storybook configuration to a project."
-    },
-    "cypress-component-configuration": {
-      "factory": "./src/generators/cypress-component-configuration/compat",
-      "schema": "./src/generators/cypress-component-configuration/schema.json",
-      "description": "Setup Cypress component testing for a project."
-    },
-    "web-worker": {
-      "factory": "./src/generators/web-worker/compat",
-      "schema": "./src/generators/web-worker/schema.json",
-      "description": "Creates a Web Worker."
-    }
-  },
   "generators": {
     "add-linting": {
       "factory": "./src/generators/add-linting/add-linting",
@@ -165,7 +17,7 @@
       "description": "Creates an Angular application."
     },
     "component": {
-      "factory": "./src/generators/component/component",
+      "factory": "./src/generators/component/component#componentGeneratorInternal",
       "schema": "./src/generators/component/schema.json",
       "aliases": ["c"],
       "description": "Generate an Angular Component."
@@ -193,6 +45,12 @@
       "aliases": ["d"],
       "description": "Generate an Angular directive."
     },
+    "federate-module": {
+      "factory": "./src/generators/federate-module/federate-module",
+      "schema": "./src/generators/federate-module/schema.json",
+      "x-type": "application",
+      "description": "Create a federated module, which is exposed by a remote and can be subsequently loaded by a host."
+    },
     "init": {
       "factory": "./src/generators/init/init",
       "schema": "./src/generators/init/schema.json",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "17.0.0-beta.1",
+  "version": "17.0.0-beta.4",
   "private": false,
   "description": "The Nx Plugin for Angular contains executors, generators, and utilities for managing Angular applications and libraries within an Nx workspace. It provides: \n\n- Integration with libraries such as Storybook, Jest, ESLint, Tailwind CSS, and Cypress. \n\n- Generators to help scaffold code quickly (like: Micro Frontends, Libraries, both internal to your codebase and publishable to npm) \n\n- Upgrading AngularJS applications \n\n- Single Component Application Modules (SCAMs) \n\n- NgRx helpers. \n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -60,8 +60,8 @@
     "url": "https://github.com/nrwl/nx/issues"
   },
   "homepage": "https://nx.dev",
-  "builders": "./executors.json",
-  "schematics": "./generators.json",
+  "executors": "./executors.json",
+  "generators": "./generators.json",
   "ng-update": {
     "requirements": {},
     "migrations": "./migrations.json"
@@ -79,14 +79,14 @@
     "webpack": "^5.80.0",
     "webpack-merge": "^5.8.0",
     "enquirer": "^2.3.6",
-    "@nx/devkit": "17.0.0-beta.1",
-    "@nx/cypress": "17.0.0-beta.1",
-    "@nx/jest": "17.0.0-beta.1",
-    "@nx/js": "17.0.0-beta.1",
-    "@nx/linter": "17.0.0-beta.1",
-    "@nx/webpack": "17.0.0-beta.1",
-    "@nx/workspace": "17.0.0-beta.1",
-    "@nrwl/angular": "17.0.0-beta.1"
+    "@nx/devkit": "17.0.0-beta.4",
+    "@nx/cypress": "17.0.0-beta.4",
+    "@nx/jest": "17.0.0-beta.4",
+    "@nx/js": "17.0.0-beta.4",
+    "@nx/linter": "17.0.0-beta.4",
+    "@nx/webpack": "17.0.0-beta.4",
+    "@nx/workspace": "17.0.0-beta.4",
+    "@nrwl/angular": "17.0.0-beta.4"
   },
   "peerDependencies": {
     "@angular-devkit/build-angular": ">= 14.0.0 < 17.0.0",

package/src/executors/ng-packagr-lite/schema.json

@@ -33,19 +33,6 @@
       "description": "Whether to run a build when any file changes.",
       "default": false
     },
-    "updateBuildableProjectDepsInPackageJson": {
-      "type": "boolean",
-      "description": "Whether to update the buildable project dependencies in the build output package.json.",
-      "default": false,
-      "x-deprecated": "Configure the project to use the '@nx/dependency-checks' ESLint rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks). It will be removed in v17."
-    },
-    "buildableProjectDepsInPackageJsonType": {
-      "type": "string",
-      "description": "When `updateBuildableProjectDepsInPackageJson` is `true`, this adds dependencies to either `peerDependencies` or `dependencies`.",
-      "enum": ["dependencies", "peerDependencies"],
-      "default": "peerDependencies",
-      "x-deprecated": "Configure the '@nx/dependency-checks' ESLint rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks). It will be removed in v17."
-    },
     "tailwindConfig": {
       "type": "string",
       "description": "The full path for the Tailwind configuration file, relative to the workspace root. If not provided and a `tailwind.config.js` file exists in the project or workspace root, it will be used. Otherwise, Tailwind will not be configured."

package/src/executors/package/package.impl.js

@@ -39,17 +39,11 @@ function createLibraryExecutor(initializeNgPackagr) {
         if (!(0, buildable_libs_utils_1.checkDependentProjectsHaveBeenBuilt)(context.root, context.projectName, context.targetName, dependencies)) {
             return Promise.resolve({ success: false });
         }
-        function updatePackageJson() {
-            if (topLevelDependencies.length > 0 &&
-                options.updateBuildableProjectDepsInPackageJson) {
-                (0, buildable_libs_utils_1.updateBuildableProjectPackageJsonDependencies)(context.root, context.projectName, context.targetName, context.configurationName, target, topLevelDependencies, options.buildableProjectDepsInPackageJsonType);
-            }
-        }
         if (options.watch) {
-            return yield* (0, rxjs_for_await_1.eachValueFrom)((0, rxjs_1.from)(initializeNgPackagr(options, context, dependencies)).pipe((0, operators_1.switchMap)((packagr) => packagr.watch()), (0, operators_1.tap)(() => updatePackageJson()), (0, operators_1.mapTo)({ success: true })));
+            return yield* (0, rxjs_for_await_1.eachValueFrom)((0, rxjs_1.from)(initializeNgPackagr(options, context, dependencies)).pipe((0, operators_1.switchMap)((packagr) => packagr.watch()), (0, operators_1.mapTo)({ success: true })));
         }
         return (0, rxjs_1.from)(initializeNgPackagr(options, context, dependencies))
-            .pipe((0, operators_1.switchMap)((packagr) => packagr.build()), (0, operators_1.tap)(() => updatePackageJson()), (0, operators_1.mapTo)({ success: true }))
+            .pipe((0, operators_1.switchMap)((packagr) => packagr.build()), (0, operators_1.mapTo)({ success: true }))
             .toPromise();
     };
 }

package/src/executors/package/schema.d.ts

@@ -1,18 +1,6 @@
 export interface BuildAngularLibraryExecutorOptions {
   project: string;
-  /**
-   * @deprecated Configure the project to use the `@nx/dependency-checks` ESLint
-   * rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks).
-   * It will be removed in v17.
-   */
-  buildableProjectDepsInPackageJsonType?: 'dependencies' | 'peerDependencies';
   tailwindConfig?: string;
   tsConfig?: string;
-  /**
-   * @deprecated Configure the project to use the `@nx/dependency-checks` ESLint
-   * rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks).
-   * It will be removed in v17.
-   */
-  updateBuildableProjectDepsInPackageJson?: boolean;
   watch?: boolean;
 }

package/src/executors/package/schema.json

@@ -33,19 +33,6 @@
       "description": "Whether to run a build when any file changes.",
       "default": false
     },
-    "updateBuildableProjectDepsInPackageJson": {
-      "type": "boolean",
-      "description": "Whether to update the buildable project dependencies in the build output package.json.",
-      "default": false,
-      "x-deprecated": "Configure the project to use the '@nx/dependency-checks' ESLint rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks). It will be removed in v17."
-    },
-    "buildableProjectDepsInPackageJsonType": {
-      "type": "string",
-      "description": "When `updateBuildableProjectDepsInPackageJson` is `true`, this adds dependencies to either `peerDependencies` or `dependencies`.",
-      "enum": ["dependencies", "peerDependencies"],
-      "default": "peerDependencies",
-      "x-deprecated": "Configure the project to use the '@nx/dependency-checks' ESLint rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks). It will be removed in v17."
-    },
     "tailwindConfig": {
       "type": "string",
       "description": "The full path for the Tailwind configuration file, relative to the workspace root. If not provided and a `tailwind.config.js` file exists in the project or workspace root, it will be used. Otherwise, Tailwind will not be configured.",

package/src/generators/component/component.d.ts

@@ -1,4 +1,5 @@
 import type { Tree } from '@nx/devkit';
 import type { Schema } from './schema';
 export declare function componentGenerator(tree: Tree, rawOptions: Schema): Promise<void>;
+export declare function componentGeneratorInternal(tree: Tree, rawOptions: Schema): Promise<void>;
 export default componentGenerator;

package/src/generators/component/component.js

@@ -1,19 +1,23 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.componentGenerator = void 0;
+exports.componentGeneratorInternal = exports.componentGenerator = void 0;
 const devkit_1 = require("@nx/devkit");
 const utils_1 = require("../utils");
 const lib_1 = require("./lib");
 async function componentGenerator(tree, rawOptions) {
+    await componentGeneratorInternal(tree, {
+        nameAndDirectoryFormat: 'derived',
+        ...rawOptions,
+    });
+}
+exports.componentGenerator = componentGenerator;
+async function componentGeneratorInternal(tree, rawOptions) {
     (0, lib_1.validateOptions)(tree, rawOptions);
-    const options = (0, lib_1.normalizeOptions)(tree, rawOptions);
-    const componentNames = (0, devkit_1.names)(options.name);
-    const typeNames = (0, devkit_1.names)(options.type);
+    const options = await (0, lib_1.normalizeOptions)(tree, rawOptions);
     (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, 'files'), options.directory, {
-        fileName: componentNames.fileName,
-        className: componentNames.className,
-        type: typeNames.fileName,
-        typeClassName: typeNames.className,
+        name: options.name,
+        fileName: options.fileName,
+        symbolName: options.symbolName,
         style: options.style,
         inlineStyle: options.inlineStyle,
         inlineTemplate: options.inlineTemplate,
@@ -26,25 +30,25 @@ async function componentGenerator(tree, rawOptions) {
         tpl: '',
     });
     if (options.skipTests) {
-        const pathToSpecFile = (0, devkit_1.joinPathFragments)(options.directory, `${componentNames.fileName}.${typeNames.fileName}.spec.ts`);
+        const pathToSpecFile = (0, devkit_1.joinPathFragments)(options.directory, `${options.fileName}.spec.ts`);
         tree.delete(pathToSpecFile);
     }
     if (options.inlineTemplate) {
-        const pathToTemplateFile = (0, devkit_1.joinPathFragments)(options.directory, `${componentNames.fileName}.${typeNames.fileName}.html`);
+        const pathToTemplateFile = (0, devkit_1.joinPathFragments)(options.directory, `${options.fileName}.html`);
         tree.delete(pathToTemplateFile);
     }
     if (options.style === 'none' || options.inlineStyle) {
-        const pathToStyleFile = (0, devkit_1.joinPathFragments)(options.directory, `${componentNames.fileName}.${typeNames.fileName}.${options.style}`);
+        const pathToStyleFile = (0, devkit_1.joinPathFragments)(options.directory, `${options.fileName}.${options.style}`);
         tree.delete(pathToStyleFile);
     }
     if (!options.skipImport && !options.standalone) {
         const modulePath = (0, lib_1.findModuleFromOptions)(tree, options, options.projectRoot);
-        (0, utils_1.addToNgModule)(tree, options.path, modulePath, componentNames.fileName, `${componentNames.className}${typeNames.className}`, `${componentNames.fileName}.${typeNames.fileName}`, 'declarations', options.flat, options.export);
+        (0, utils_1.addToNgModule)(tree, options.directory, modulePath, options.name, options.symbolName, options.fileName, 'declarations', true, options.export);
     }
     (0, lib_1.exportComponentInEntryPoint)(tree, options);
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(tree);
     }
 }
-exports.componentGenerator = componentGenerator;
+exports.componentGeneratorInternal = componentGeneratorInternal;
 exports.default = componentGenerator;

package/src/generators/component/files/__fileName__.html__tpl__

@@ -0,0 +1 @@
+<p><%= name %> works!</p>

package/src/generators/component/files/__fileName__.spec.ts__tpl__

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { <%= symbolName %> } from './<%= fileName %>';
+
+describe('<%= symbolName %>', () => {
+  let component: <%= symbolName %>;
+  let fixture: ComponentFixture<<%= symbolName %>>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      <%= standalone ? 'imports' : 'declarations' %>: [ <%= symbolName %> ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(<%= symbolName %>);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/generators/component/files/{__fileName__.__type__.ts__tpl__ → __fileName__.ts__tpl__}

@@ -5,8 +5,8 @@ import { CommonModule } from '@angular/common';<% } %>
   selector: '<%= selector %>',<%}%><% if(standalone) {%>
   standalone: true,
   imports: [CommonModule],<%}%><% if(inlineTemplate) { %>
-  template: `<p><%= fileName %> works!</p>`<% } else { %>
-  templateUrl: './<%= fileName %><%= type ? '.' + type : '' %>.html'<% } if(inlineStyle) { %>,
+  template: `<p><%= name %> works!</p>`<% } else { %>
+  templateUrl: './<%= fileName %>.html'<% } if(inlineStyle) { %>,
   styles: [<% if(displayBlock){ %>
     `
       :host {
@@ -14,8 +14,8 @@ import { CommonModule } from '@angular/common';<% } %>
       }
     `<% } %>
   ]<% } else if (style !== 'none') { %>,
-  styleUrls: ['./<%= fileName %><%= type ? '.' + type : '' %>.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>,
+  styleUrls: ['./<%= fileName %>.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>,
   encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
   changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
 })
-export class <%= className %><%= typeClassName %> {}
+export class <%= symbolName %> {}

package/src/generators/component/lib/module.js

@@ -12,10 +12,10 @@ function findModuleFromOptions(tree, options, projectRoot) {
         return (0, devkit_1.normalizePath)(findModule(tree, options.directory, projectRoot));
     }
     else {
-        const modulePath = (0, devkit_1.joinPathFragments)(options.path, options.module);
+        const modulePath = (0, devkit_1.joinPathFragments)(options.directory, options.module);
         const componentPath = options.directory;
         const moduleBaseName = (0, path_1.basename)(modulePath);
-        const candidateSet = new Set([options.path]);
+        const candidateSet = new Set([options.directory]);
         const projectRootParent = (0, path_1.dirname)(projectRoot);
         for (let dir = modulePath; dir !== projectRootParent; dir = (0, path_1.dirname)(dir)) {
             candidateSet.add(dir);

package/src/generators/component/lib/normalize-options.d.ts

@@ -1,3 +1,3 @@
 import type { Tree } from '@nx/devkit';
 import type { NormalizedSchema, Schema } from '../schema';
-export declare function normalizeOptions(tree: Tree, options: Schema): NormalizedSchema;
+export declare function normalizeOptions(tree: Tree, options: Schema): Promise<NormalizedSchema>;

package/src/generators/component/lib/normalize-options.js

@@ -2,23 +2,36 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = void 0;
 const devkit_1 = require("@nx/devkit");
-const path_1 = require("../../utils/path");
+const artifact_name_and_directory_utils_1 = require("@nx/devkit/src/generators/artifact-name-and-directory-utils");
 const selector_1 = require("../../utils/selector");
-function normalizeOptions(tree, options) {
+async function normalizeOptions(tree, options) {
     options.type ??= 'component';
-    const { directory, filePath, name, path, root, sourceRoot } = (0, path_1.normalizeNameAndPaths)(tree, options);
-    const { prefix } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+    const { artifactName: name, directory, fileName, filePath, project, } = await (0, artifact_name_and_directory_utils_1.determineArtifactNameAndDirectoryOptions)(tree, {
+        artifactType: 'component',
+        callingGenerator: '@nx/angular:component',
+        name: options.name,
+        directory: options.directory ?? options.path,
+        flat: options.flat,
+        nameAndDirectoryFormat: options.nameAndDirectoryFormat,
+        project: options.project,
+        suffix: options.type ?? 'component',
+    });
+    const { className } = (0, devkit_1.names)(name);
+    const { className: suffixClassName } = (0, devkit_1.names)(options.type);
+    const symbolName = `${className}${suffixClassName}`;
+    const { prefix, root, sourceRoot } = (0, devkit_1.readProjectConfiguration)(tree, project);
     const selector = options.selector ??
         (0, selector_1.buildSelector)(tree, name, options.prefix, prefix, 'fileName');
     return {
         ...options,
         name,
+        project,
         changeDetection: options.changeDetection ?? 'Default',
         style: options.style ?? 'css',
-        flat: options.flat ?? false,
         directory,
+        fileName,
         filePath,
-        path,
+        symbolName,
         projectSourceRoot: sourceRoot,
         projectRoot: root,
         selector,

package/src/generators/component/lib/validate-options.js

@@ -3,8 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.validateOptions = void 0;
 const validations_1 = require("../../utils/validations");
 function validateOptions(tree, options) {
-    (0, validations_1.validateProject)(tree, options.project);
-    (0, validations_1.validatePathIsUnderProjectRoot)(tree, options.project, options.path);
     (0, validations_1.validateStandaloneOption)(tree, options.standalone);
 }
 exports.validateOptions = validateOptions;

package/src/generators/component/schema.d.ts

@@ -1,7 +1,9 @@
+import type { NameAndDirectoryFormat } from '@nx/devkit/src/generators/artifact-name-and-directory-utils';
+
 export interface Schema {
   name: string;
-  project: string;
-  path?: string;
+  directory?: string;
+  nameAndDirectoryFormat?: NameAndDirectoryFormat;
   displayBlock?: boolean;
   inlineStyle?: boolean;
   inlineTemplate?: boolean;
@@ -11,7 +13,6 @@ export interface Schema {
   style?: 'css' | 'scss' | 'sass' | 'less' | 'none';
   skipTests?: boolean;
   type?: string;
-  flat?: boolean;
   skipImport?: boolean;
   selector?: string;
   module?: string;
@@ -19,12 +20,29 @@ export interface Schema {
   export?: boolean;
   prefix?: string;
   skipFormat?: boolean;
+
+  /**
+   * @deprecated Provide the `directory` option instead and use the `as-provided` format. It will be removed in Nx v18.
+   */
+  flat?: boolean;
+  /**
+   * @deprecated Provide the `directory` option instead. It will be removed in Nx v18.
+   */
+  path?: string;
+  /**
+   * @deprecated Provide the `directory` option instead. The project will be determined from the directory provided. It will be removed in Nx v18.
+   */
+  project?: string;
 }
 
 export interface NormalizedSchema extends Schema {
   directory: string;
   filePath: string;
+  project: string;
   projectSourceRoot: string;
   projectRoot: string;
   selector: string;
+
+  fileName: string;
+  symbolName: string;
 }