@nx/react 0.0.0-pr-31231-180f614 → 0.0.0-pr-31222-862e973

package/LICENSE

@@ -1,6 +1,6 @@
 (The MIT License)
 
-Copyright (c) 2017-2025 Narwhal Technologies Inc.
+Copyright (c) 2017-2024 Narwhal Technologies Inc.
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

package/README.md

@@ -9,7 +9,7 @@
 
 [![CircleCI](https://circleci.com/gh/nrwl/nx.svg?style=svg)](https://circleci.com/gh/nrwl/nx)
 [![License](https://img.shields.io/npm/l/@nx/workspace.svg?style=flat-square)]()
-[![NPM Version](https://badge.fury.io/js/nx.svg)](https://www.npmjs.com/package/nx)
+[![NPM Version](https://badge.fury.io/js/%40nrwl%2Fworkspace.svg)](https://www.npmjs.com/@nx/workspace)
 [![Semantic Release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square)]()
 [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
 [![Join the chat at https://gitter.im/nrwl-nx/community](https://badges.gitter.im/nrwl-nx/community.svg)](https://gitter.im/nrwl-nx/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

package/generators.json

@@ -25,13 +25,13 @@
       "description": "Create a React library."
     },
     "component": {
-      "factory": "./src/generators/component/component",
+      "factory": "./src/generators/component/component#componentGeneratorInternal",
       "schema": "./src/generators/component/schema.json",
       "description": "Create a React component.",
       "aliases": ["c"]
     },
     "redux": {
-      "factory": "./src/generators/redux/redux",
+      "factory": "./src/generators/redux/redux#reduxGeneratorInternal",
       "schema": "./src/generators/redux/schema.json",
       "description": "Create a Redux slice for a project.",
       "aliases": ["slice"]
@@ -54,25 +54,29 @@
       "description": "Create stories/specs for all components declared in an app or library.",
       "hidden": false
     },
+    "component-cypress-spec": {
+      "factory": "./src/generators/component-cypress-spec/component-cypress-spec#componentCypressGenerator",
+      "schema": "./src/generators/component-cypress-spec/schema.json",
+      "description": "Create a Cypress spec for a UI component that has a story.",
+      "hidden": false
+    },
     "hook": {
-      "factory": "./src/generators/hook/hook",
+      "factory": "./src/generators/hook/hook#hookGeneratorInternal",
       "schema": "./src/generators/hook/schema.json",
       "description": "Create a hook.",
       "aliases": ["c"]
     },
     "host": {
-      "factory": "./src/generators/host/host",
+      "factory": "./src/generators/host/host#hostGeneratorInternal",
       "schema": "./src/generators/host/schema.json",
       "x-type": "application",
-      "description": "Generate a host react application",
-      "aliases": ["consumer"]
+      "description": "Generate a host react application"
     },
     "remote": {
-      "factory": "./src/generators/remote/remote",
+      "factory": "./src/generators/remote/remote#remoteGeneratorInternal",
       "schema": "./src/generators/remote/schema.json",
       "x-type": "application",
-      "description": "Generate a remote react application",
-      "aliases": ["producer"]
+      "description": "Generate a remote react application"
     },
     "cypress-component-configuration": {
       "factory": "./src/generators/cypress-component-configuration/cypress-component-configuration#cypressComponentConfigGenerator",

package/index.d.ts

@@ -1,5 +1,5 @@
 import { NxReactWebpackPlugin as _NxReactWebpackPlugin } from './plugins/nx-react-webpack-plugin/nx-react-webpack-plugin';
-/** @deprecated Use '@nx/react/webpack-plugin' instead, which can improve graph creation by 150-200ms per file. */
+/** @deprecated Use '@nx/react/webpack-plugin' instead. */
 export declare const NxReactWebpackPlugin: typeof _NxReactWebpackPlugin;
 export { extraEslintDependencies, extendReactEslintJson, } from './src/utils/lint';
 export { cssInJsDependenciesBabel } from './src/utils/styled';
@@ -8,6 +8,7 @@ export { reactDomVersion, reactVersion } from './src/utils/versions';
 export { applicationGenerator } from './src/generators/application/application';
 export { componentGenerator } from './src/generators/component/component';
 export { hookGenerator } from './src/generators/hook/hook';
+export { componentCypressGenerator } from './src/generators/component-cypress-spec/component-cypress-spec';
 export { componentStoryGenerator } from './src/generators/component-story/component-story';
 export { libraryGenerator } from './src/generators/library/library';
 export { reactInitGenerator } from './src/generators/init/init';

package/index.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.setupTailwindGenerator = exports.componentTestGenerator = exports.cypressComponentConfigGenerator = exports.remoteGenerator = exports.hostGenerator = exports.storybookConfigurationGenerator = exports.storiesGenerator = exports.reduxGenerator = exports.reactInitGenerator = exports.libraryGenerator = exports.componentStoryGenerator = exports.hookGenerator = exports.componentGenerator = exports.applicationGenerator = exports.reactVersion = exports.reactDomVersion = exports.assertValidStyle = exports.cssInJsDependenciesBabel = exports.extendReactEslintJson = exports.extraEslintDependencies = exports.NxReactWebpackPlugin = void 0;
+exports.setupTailwindGenerator = exports.componentTestGenerator = exports.cypressComponentConfigGenerator = exports.remoteGenerator = exports.hostGenerator = exports.storybookConfigurationGenerator = exports.storiesGenerator = exports.reduxGenerator = exports.reactInitGenerator = exports.libraryGenerator = exports.componentStoryGenerator = exports.componentCypressGenerator = exports.hookGenerator = exports.componentGenerator = exports.applicationGenerator = exports.reactVersion = exports.reactDomVersion = exports.assertValidStyle = exports.cssInJsDependenciesBabel = exports.extendReactEslintJson = exports.extraEslintDependencies = exports.NxReactWebpackPlugin = void 0;
 const tslib_1 = require("tslib");
 const nx_react_webpack_plugin_1 = require("./plugins/nx-react-webpack-plugin/nx-react-webpack-plugin");
-/** @deprecated Use '@nx/react/webpack-plugin' instead, which can improve graph creation by 150-200ms per file. */
+// TODO(v20): Remove this in favor of deep imports in order to load configs faster (150-200ms faster).
+/** @deprecated Use '@nx/react/webpack-plugin' instead. */
 exports.NxReactWebpackPlugin = nx_react_webpack_plugin_1.NxReactWebpackPlugin;
 var lint_1 = require("./src/utils/lint");
 Object.defineProperty(exports, "extraEslintDependencies", { enumerable: true, get: function () { return lint_1.extraEslintDependencies; } });
@@ -21,6 +22,8 @@ var component_1 = require("./src/generators/component/component");
 Object.defineProperty(exports, "componentGenerator", { enumerable: true, get: function () { return component_1.componentGenerator; } });
 var hook_1 = require("./src/generators/hook/hook");
 Object.defineProperty(exports, "hookGenerator", { enumerable: true, get: function () { return hook_1.hookGenerator; } });
+var component_cypress_spec_1 = require("./src/generators/component-cypress-spec/component-cypress-spec");
+Object.defineProperty(exports, "componentCypressGenerator", { enumerable: true, get: function () { return component_cypress_spec_1.componentCypressGenerator; } });
 var component_story_1 = require("./src/generators/component-story/component-story");
 Object.defineProperty(exports, "componentStoryGenerator", { enumerable: true, get: function () { return component_story_1.componentStoryGenerator; } });
 var library_1 = require("./src/generators/library/library");

package/mf/dynamic-federation.d.ts

@@ -1,69 +1,5 @@
 export type ResolveRemoteUrlFunction = (remoteName: string) => string | Promise<string>;
-/**
- * @deprecated Use Runtime Helpers from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- */
 export declare function setRemoteUrlResolver(_resolveRemoteUrl: ResolveRemoteUrlFunction): void;
-/**
- * @deprecated Use init() from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- * If you have a remote app called `my-remote-app` and you want to use the `http://localhost:4201/mf-manifest.json` as the remote url, you should change it from:
- * ```ts
- * import { setRemoteDefinitions } from '@nx/react/mf';
- *
- * setRemoteDefinitions({
- *   'my-remote-app': 'http://localhost:4201/mf-manifest.json'
- * });
- * ```
- * to use init():
- * ```ts
- * import { init } from '@module-federation/enhanced/runtime';
- *
- * init({
- *   name: 'host',
- *   remotes: [{
- *     name: 'my-remote-app',
- *     entry: 'http://localhost:4201/mf-manifest.json'
- *   }]
- * });
- * ```
- */
 export declare function setRemoteDefinitions(definitions: Record<string, string>): void;
-/**
- * @deprecated Use registerRemotes() from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- * If you set a remote app with `setRemoteDefinition` such as:
- * ```ts
- * import { setRemoteDefinition } from '@nx/react/mf';
- *
- * setRemoteDefinition(
- *   'my-remote-app',
- *   'http://localhost:4201/mf-manifest.json'
- * );
- * ```
- * change it to use registerRemotes():
- * ```ts
- * import { registerRemotes } from '@module-federation/enhanced/runtime';
- *
- * registerRemotes([
- *  {
- *     name: 'my-remote-app',
- *     entry: 'http://localhost:4201/mf-manifest.json'
- *   }
- * ]);
- * ```
- */
 export declare function setRemoteDefinition(remoteName: string, remoteUrl: string): void;
-/**
- * @deprecated Use loadRemote() from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- * If you set a load a remote with `loadRemoteModule` such as:
- * ```ts
- * import { loadRemoteModule } from '@nx/react/mf';
- *
- * loadRemoteModule('my-remote-app', './Module').then(m => m.RemoteEntryModule);
- * ```
- * change it to use loadRemote():
- * ```ts
- * import { loadRemote } from '@module-federation/enhanced/runtime';
- *
- * loadRemote<typeof import('my-remote-app/Module')>('my-remote-app/Module').then(m => m.RemoteEntryModule);
- * ```
- */
 export declare function loadRemoteModule(remoteName: string, moduleName: string): Promise<any>;

package/mf/dynamic-federation.js

@@ -9,79 +9,15 @@ let resolveRemoteUrl;
 const remoteModuleMap = new Map();
 const remoteContainerMap = new Map();
 let initialSharingScopeCreated = false;
-/**
- * @deprecated Use Runtime Helpers from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- */
 function setRemoteUrlResolver(_resolveRemoteUrl) {
     resolveRemoteUrl = _resolveRemoteUrl;
 }
-/**
- * @deprecated Use init() from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- * If you have a remote app called `my-remote-app` and you want to use the `http://localhost:4201/mf-manifest.json` as the remote url, you should change it from:
- * ```ts
- * import { setRemoteDefinitions } from '@nx/react/mf';
- *
- * setRemoteDefinitions({
- *   'my-remote-app': 'http://localhost:4201/mf-manifest.json'
- * });
- * ```
- * to use init():
- * ```ts
- * import { init } from '@module-federation/enhanced/runtime';
- *
- * init({
- *   name: 'host',
- *   remotes: [{
- *     name: 'my-remote-app',
- *     entry: 'http://localhost:4201/mf-manifest.json'
- *   }]
- * });
- * ```
- */
 function setRemoteDefinitions(definitions) {
     remoteUrlDefinitions = definitions;
 }
-/**
- * @deprecated Use registerRemotes() from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- * If you set a remote app with `setRemoteDefinition` such as:
- * ```ts
- * import { setRemoteDefinition } from '@nx/react/mf';
- *
- * setRemoteDefinition(
- *   'my-remote-app',
- *   'http://localhost:4201/mf-manifest.json'
- * );
- * ```
- * change it to use registerRemotes():
- * ```ts
- * import { registerRemotes } from '@module-federation/enhanced/runtime';
- *
- * registerRemotes([
- *  {
- *     name: 'my-remote-app',
- *     entry: 'http://localhost:4201/mf-manifest.json'
- *   }
- * ]);
- * ```
- */
 function setRemoteDefinition(remoteName, remoteUrl) {
     remoteUrlDefinitions[remoteName] = remoteUrl;
 }
-/**
- * @deprecated Use loadRemote() from '@module-federation/enhanced/runtime' instead. This will be removed in Nx 22.
- * If you set a load a remote with `loadRemoteModule` such as:
- * ```ts
- * import { loadRemoteModule } from '@nx/react/mf';
- *
- * loadRemoteModule('my-remote-app', './Module').then(m => m.RemoteEntryModule);
- * ```
- * change it to use loadRemote():
- * ```ts
- * import { loadRemote } from '@module-federation/enhanced/runtime';
- *
- * loadRemote<typeof import('my-remote-app/Module')>('my-remote-app/Module').then(m => m.RemoteEntryModule);
- * ```
- */
 async function loadRemoteModule(remoteName, moduleName) {
     const remoteModuleKey = `${remoteName}:${moduleName}`;
     if (remoteModuleMap.has(remoteModuleKey)) {

package/migrations.json

@@ -1,5 +1,47 @@
 {
   "generators": {
+    "update-16-0-0-add-nx-packages": {
+      "cli": "nx",
+      "version": "16.0.0-beta.1",
+      "description": "Replace @nrwl/react with @nx/react",
+      "implementation": "./src/migrations/update-16-0-0-add-nx-packages/update-16-0-0-add-nx-packages"
+    },
+    "update-16-2-0-remove-package": {
+      "cli": "nx",
+      "version": "16.2.0-beta.0",
+      "description": "Remove react-test-renderer from package.json",
+      "implementation": "./src/migrations/update-16-2-0-remove-package/update-16-2-0-remove-package"
+    },
+    "remove-types-react-router-dom": {
+      "cli": "nx",
+      "version": "16.3.0-beta.2",
+      "description": "Remove @types/react-router-dom from package.json",
+      "implementation": "./src/migrations/update-16-3-0/remove-types-react-router-dom-package"
+    },
+    "add-babel-core": {
+      "cli": "nx",
+      "version": "16.7.0-beta.2",
+      "description": "Add @babel/core to package.json if @babel/preset-react is present",
+      "implementation": "./src/migrations/update-16-7-0/add-babel-core"
+    },
+    "update-16-7-0-add-typings": {
+      "cli": "nx",
+      "version": "16.7.0-beta.2",
+      "description": "Add @nx/react types to tsconfig types array",
+      "implementation": "./src/migrations/update-16-7-0-add-typings/update-16-7-0-add-typings"
+    },
+    "add-module-federation-env-var-to-target-defaults": {
+      "cli": "nx",
+      "version": "18.0.0-beta.0",
+      "description": "Add NX_MF_DEV_SERVER_STATIC_REMOTES to inputs for task hashing when '@nx/webpack:webpack' is used for Module Federation.",
+      "factory": "./src/migrations/update-18-0-0/add-mf-env-var-to-target-defaults"
+    },
+    "fix-target-defaults-for-webpack": {
+      "cli": "nx",
+      "version": "18.1.1-beta.0",
+      "description": "Ensure targetDefaults inputs for task hashing when '@nx/webpack:webpack' is used are correct for Module Federation.",
+      "factory": "./src/migrations/update-18-1-1/fix-target-defaults-inputs"
+    },
     "update-19-6-0-turn-module-federation-dts-off": {
       "cli": "nx",
       "version": "19.6.0-beta.4",
@@ -17,39 +59,117 @@
       "version": "19.6.1-beta.0",
       "description": "Ensure Target Defaults are set correctly for Module Federation.",
       "factory": "./src/migrations/update-19-6-1/ensure-depends-on-for-mf"
+    }
+  },
+  "packageJsonUpdates": {
+    "16.3.0": {
+      "version": "16.3.0-beta.2",
+      "packages": {
+        "react-router-dom": {
+          "version": "6.11.2",
+          "alwaysAddToPackageJson": false
+        },
+        "@svgr/rollup": {
+          "version": "^8.0.1",
+          "alwaysAddToPackageJson": false
+        }
+      }
     },
-    "update-20-2-0-update-module-federation-config-import": {
-      "cli": "nx",
-      "version": "20.2.0-beta.2",
-      "description": "Update the ModuleFederationConfig import use @nx/module-federation.",
-      "factory": "./src/migrations/update-20-2-0/migrate-mf-imports-to-new-package"
+    "16.4.0-beta.4": {
+      "version": "16.4.0-beta.4",
+      "packages": {
+        "stylus": {
+          "version": "^0.59.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     },
-    "update-20-2-0-update-with-module-federation-import": {
-      "cli": "nx",
-      "version": "20.2.0-beta.2",
-      "description": "Update the withModuleFederation import use @nx/module-federation/webpack.",
-      "factory": "./src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package"
+    "16.4.0-beta.7": {
+      "version": "16.4.0-beta.7",
+      "packages": {
+        "@types/react": {
+          "version": "18.2.12",
+          "alwaysAddToPackageJson": false
+        },
+        "@types/react-dom": {
+          "version": "18.2.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@types/react-is": {
+          "version": "18.2.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     },
-    "ensure-nx-module-federation-package": {
-      "cli": "nx",
-      "version": "20.3.0-beta.2",
-      "description": "If workspace includes Module Federation projects, ensure the new @nx/module-federation package is installed.",
-      "factory": "./src/migrations/update-20-3-0/ensure-nx-module-federation-package"
+    "16.4.0-beta.8": {
+      "version": "16.4.0-beta.8",
+      "packages": {
+        "@emotion/styled": {
+          "version": "11.11.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@emotion/react": {
+          "version": "11.11.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@emotion/babel-plugin": {
+          "version": "11.11.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     },
-    "add-mf-env-var-to-target-defaults": {
-      "cli": "nx",
-      "version": "20.4.0-beta.0",
-      "description": "Add NX_MF_DEV_REMOTES to inputs for task hashing when '@nx/webpack:webpack' or '@nx/rspack:rspack' is used for Module Federation.",
-      "factory": "./src/migrations/update-18-0-0/add-mf-env-var-to-target-defaults"
+    "16.4.0-beta.11": {
+      "version": "16.4.0-beta.11",
+      "packages": {
+        "@types/react": {
+          "version": "18.2.13",
+          "alwaysAddToPackageJson": false
+        },
+        "@types/react-dom": {
+          "version": "18.2.6",
+          "alwaysAddToPackageJson": false
+        },
+        "@types/react-is": {
+          "version": "18.2.1",
+          "alwaysAddToPackageJson": false
+        }
+      }
+    },
+    "16.5.0-beta.4": {
+      "version": "16.5.0-beta.4",
+      "packages": {
+        "@types/react": {
+          "version": "18.2.14",
+          "alwaysAddToPackageJson": false
+        }
+      }
+    },
+    "17.0.0-beta.0": {
+      "version": "17.0.0-beta.0",
+      "packages": {
+        "@types/react": {
+          "version": "18.2.24",
+          "alwaysAddToPackageJson": false
+        },
+        "@types/react-dom": {
+          "version": "18.2.9",
+          "alwaysAddToPackageJson": false
+        },
+        "@types/react-is": {
+          "version": "18.2.2",
+          "alwaysAddToPackageJson": false
+        }
+      }
+    },
+    "17.3.0": {
+      "version": "17.3.0-beta.3",
+      "packages": {
+        "@types/node": {
+          "version": "18.16.9",
+          "alwaysAddToPackageJson": false
+        }
+      }
     },
-    "update-21-0-0-update-babel-loose": {
-      "cli": "nx",
-      "version": "21.0.0-beta.11",
-      "description": "Replaces `classProperties.loose` option with `loose`.",
-      "factory": "./src/migrations/update-21-0-0/update-babel-loose"
-    }
-  },
-  "packageJsonUpdates": {
     "19.0.0": {
       "version": "19.0.0-beta.12",
       "packages": {
@@ -122,58 +242,6 @@
           "alwaysAddToPackageJson": false
         }
       }
-    },
-    "20.0.0": {
-      "version": "20.0.0-beta.8",
-      "packages": {
-        "eslint-plugin-import": {
-          "version": "2.31.0",
-          "alwaysAddToPackageJson": false
-        }
-      }
-    },
-    "20.1.0": {
-      "version": "20.1.0-beta.0",
-      "packages": {
-        "eslint-plugin-react-hooks": {
-          "version": "5.0.0",
-          "alwaysAddToPackageJson": false
-        },
-        "eslint-plugin-jsx-a11y": {
-          "version": "6.10.1",
-          "alwaysAddToPackageJson": false
-        }
-      }
-    },
-    "20.2.0": {
-      "version": "20.2.0-beta.3",
-      "packages": {
-        "@module-federation/enhanced": {
-          "version": "0.7.6",
-          "alwaysAddToPackageJson": false
-        },
-        "@module-federation/runtime": {
-          "version": "0.7.6",
-          "alwaysAddToPackageJson": false
-        },
-        "@module-federation/sdk": {
-          "version": "0.7.6",
-          "alwaysAddToPackageJson": false
-        },
-        "@module-federation/node": {
-          "version": "2.6.11",
-          "alwaysAddToPackageJson": false
-        }
-      }
-    },
-    "20.3.0": {
-      "version": "20.3.0-beta.0",
-      "packages": {
-        "@testing-library/react": {
-          "version": "16.1.0",
-          "alwaysAddToPackageJson": false
-        }
-      }
     }
   }
 }

package/module-federation.d.ts

@@ -1,6 +1,4 @@
-import { withModuleFederation } from '@nx/module-federation/webpack';
-import { withModuleFederationForSSR } from '@nx/module-federation/webpack';
-/**
- * @deprecated Use `@nx/module-federation/webpack` instead. This will be removed in Nx v22.
- */
-export { withModuleFederation, withModuleFederationForSSR };
+import { withModuleFederation } from './src/module-federation/with-module-federation';
+import { withModuleFederationForSSR } from './src/module-federation/with-module-federation-ssr';
+export { withModuleFederation };
+export { withModuleFederationForSSR };

package/module-federation.js

@@ -1,21 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.withModuleFederationForSSR = exports.withModuleFederation = void 0;
-const webpack_1 = require("@nx/module-federation/webpack");
-Object.defineProperty(exports, "withModuleFederation", { enumerable: true, get: function () { return webpack_1.withModuleFederation; } });
-const webpack_2 = require("@nx/module-federation/webpack");
-Object.defineProperty(exports, "withModuleFederationForSSR", { enumerable: true, get: function () { return webpack_2.withModuleFederationForSSR; } });
+const with_module_federation_1 = require("./src/module-federation/with-module-federation");
+Object.defineProperty(exports, "withModuleFederation", { enumerable: true, get: function () { return with_module_federation_1.withModuleFederation; } });
+const with_module_federation_ssr_1 = require("./src/module-federation/with-module-federation-ssr");
+Object.defineProperty(exports, "withModuleFederationForSSR", { enumerable: true, get: function () { return with_module_federation_ssr_1.withModuleFederationForSSR; } });
 // Support for older generated code: `const withModuleFederation = require('@nx/react/module-federation')`
-/**
- * @deprecated Use `@nx/module-federation/webpack` instead. This will be removed in Nx v22.
- */
-module.exports = webpack_1.withModuleFederation;
+module.exports = with_module_federation_1.withModuleFederation;
 // Allow newer generated code to work: `const { withModuleFederation } = require(...)`;
-/**
- * @deprecated Use `@nx/module-federation/webpack` instead. This will be removed in Nx v22.
- */
-module.exports.withModuleFederation = webpack_1.withModuleFederation;
-/**
- * @deprecated Use `@nx/module-federation/webpack` instead. This will be removed in Nx v22.
- */
-module.exports.withModuleFederationForSSR = webpack_2.withModuleFederationForSSR;
+module.exports.withModuleFederation = with_module_federation_1.withModuleFederation;
+module.exports.withModuleFederationForSSR = with_module_federation_ssr_1.withModuleFederationForSSR;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "0.0.0-pr-31231-180f614",
+  "version": "0.0.0-pr-31222-862e973",
   "private": false,
   "description": "The React plugin for Nx contains executors and generators for managing React applications and libraries within an Nx workspace. It provides:\n\n\n- Integration with libraries such as Jest, Vitest, Playwright, Cypress, and Storybook.\n\n- Generators for applications, libraries, components, hooks, and more.\n\n- Library build support for publishing packages to npm or other registries.\n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -38,18 +38,18 @@
     "minimatch": "9.0.3",
     "picocolors": "^1.1.0",
     "tslib": "^2.3.0",
-    "@nx/devkit": "0.0.0-pr-31231-180f614",
-    "@nx/js": "0.0.0-pr-31231-180f614",
-    "@nx/eslint": "0.0.0-pr-31231-180f614",
-    "@nx/web": "0.0.0-pr-31231-180f614",
-    "@nx/module-federation": "0.0.0-pr-31231-180f614",
-    "express": "^4.21.2",
-    "http-proxy-middleware": "^3.0.3",
-    "semver": "^7.6.3"
+    "@module-federation/enhanced": "~0.6.0",
+    "@nx/devkit": "0.0.0-pr-31222-862e973",
+    "@nx/js": "0.0.0-pr-31222-862e973",
+    "@nx/eslint": "0.0.0-pr-31222-862e973",
+    "@nx/web": "0.0.0-pr-31222-862e973",
+    "express": "^4.19.2",
+    "http-proxy-middleware": "^3.0.0",
+    "@nrwl/react": "0.0.0-pr-31222-862e973"
   },
   "publishConfig": {
     "access": "public"
   },
-  "types": "./index.d.ts",
-  "type": "commonjs"
+  "type": "commonjs",
+  "types": "./index.d.ts"
 }

package/plugins/bundle-rollup.js

@@ -1,9 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-// TODO(v22): Remove this in Nx 22 and migrate to explicit rollup.config.cjs files.
-/**
- * @deprecated Use `withNx` function from `@nx/rollup/with-nx` in your rollup.config.cjs file instead. Use `nx g @nx/rollup:convert-to-inferred` to generate the rollup.config.cjs file if it does not exist.
- */
+// TODO(v20): This should be deprecated and removed in v22.
 function getRollupOptions(options) {
     const extraGlobals = {
         react: 'React',

package/plugins/component-testing/index.js

@@ -167,7 +167,7 @@ function buildTargetWebpack(ctx, buildTarget, componentTestingProjectName) {
     }
     return async () => {
         customWebpack = await customWebpack;
-        // TODO(v22): Component testing need to be agnostic of the underlying executor. With Crystal, we're not using `@nx/webpack:webpack` by default.
+        // TODO(v20): Component testing need to be agnostic of the underlying executor. With Crystal, we're not using `@nx/webpack:webpack` by default.
         // We need to decouple CT from the build target of the app, we just care about bundler config (e.g. webpack.config.js).
         // The generated setup should support both Webpack and Vite as documented here: https://docs.cypress.io/guides/component-testing/react/overview
         // Related issue: https://github.com/nrwl/nx/issues/21546

package/plugins/jest.js

@@ -16,12 +16,17 @@ module.exports = {
       module.exports = {
         __esModule: true,
         default: ${assetFilename},
-        ReactComponent: function ${componentName}(props) {
-          return React.createElement(
-            'svg',
-            Object.assign({}, props, { children: ${assetFilename} })
-          );
-        },
+        ReactComponent: React.forwardRef(function ${componentName}(props, ref) {
+          return {
+            $$typeof: Symbol.for('react.element'),
+            type: 'svg',
+            ref: ref,
+            key: null,
+            props: Object.assign({}, props, {
+              children: ${assetFilename}
+            })
+          };
+        }),
       };`,
             };
         }