@nx/react 23.0.0-beta.1 → 23.0.0-beta.3

package/src/generators/application/schema.json

@@ -45,6 +45,7 @@
       "type": "string",
       "default": "css",
       "alias": "s",
+      "enum": ["css", "scss", "none"],
       "x-prompt": {
         "message": "Which stylesheet format would you like to use?",
         "type": "list",
@@ -55,27 +56,7 @@
           },
           {
             "value": "scss",
-            "label": "SASS(.scss)       [ https://sass-lang.com                    ]"
-          },
-          {
-            "value": "less",
-            "label": "LESS              [ https://lesscss.org                      ]"
-          },
-          {
-            "value": "tailwind",
-            "label": "tailwind          [ https://tailwindcss.com/                 ]"
-          },
-          {
-            "value": "styled-components",
-            "label": "styled-components [ https://styled-components.com            ]"
-          },
-          {
-            "value": "@emotion/styled",
-            "label": "emotion           [ https://emotion.sh                       ]"
-          },
-          {
-            "value": "styled-jsx",
-            "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
+            "label": "SASS(.scss)       [ https://sass-lang.com   ]"
           },
           {
             "value": "none",

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

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/generators/component/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,iBAAiB,EAIjB,IAAI,EACL,MAAM,YAAY,CAAC;AASpB,OAAO,EAAoB,MAAM,EAAE,MAAM,UAAU,CAAC;AAGpD,wBAAsB,kBAAkB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,8BAyBlE;AAiFD,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/generators/component/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,iBAAiB,EAIjB,IAAI,EACL,MAAM,YAAY,CAAC;AAQpB,OAAO,EAAoB,MAAM,EAAE,MAAM,UAAU,CAAC;AAGpD,wBAAsB,kBAAkB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,8BAsBlE;AAiFD,eAAe,kBAAkB,CAAC"}

package/src/generators/component/component.js

@@ -4,7 +4,6 @@ exports.componentGenerator = componentGenerator;
 const devkit_1 = require("@nx/devkit");
 const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
 const path_1 = require("path");
-const add_styled_dependencies_1 = require("../../rules/add-styled-dependencies");
 const ast_utils_1 = require("../../utils/ast-utils");
 const get_in_source_vitest_tests_template_1 = require("../../utils/get-in-source-vitest-tests-template");
 const versions_1 = require("../../utils/versions");
@@ -14,8 +13,6 @@ async function componentGenerator(host, schema) {
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
     createComponentFiles(host, options);
     const tasks = [];
-    const styledTask = (0, add_styled_dependencies_1.addStyledModuleDependencies)(host, options);
-    tasks.push(styledTask);
     addExportsToBarrel(host, options);
     if (options.routing) {
         const routingTask = (0, devkit_1.addDependenciesToPackageJson)(host, { 'react-router-dom': versions_1.reactRouterDomVersion }, {});
@@ -38,10 +35,10 @@ function createComponentFiles(host, options) {
     if (options.skipTests || options.inSourceTests) {
         host.delete((0, devkit_1.joinPathFragments)(options.directory, `${options.fileName}.spec.${options.fileExtension}`));
     }
-    if (options.styledModule || !options.hasStyles || !options.globalCss) {
+    if (!options.hasStyles || !options.globalCss) {
         host.delete((0, path_1.join)(options.directory, `${options.fileName}.${options.style}`));
     }
-    if (options.styledModule || !options.hasStyles || options.globalCss) {
+    if (!options.hasStyles || options.globalCss) {
         host.delete((0, path_1.join)(options.directory, `${options.fileName}.module.${options.style}`));
     }
 }

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

@@ -6,34 +6,21 @@ import { Route, Link } from 'react-router-dom';
 <%_ } _%>
 
 <%_ if (hasStyles) {
-   if (styledModule && styledModule !== 'styled-jsx' && styledModule !== 'tailwind') {
-    var wrapper = 'Styled' + className;
-    var extras = '';
-  _%>
-import styled from '<%= styledModule %>';
-  <%_ } else {
     var wrapper = 'div';
-    var extras = globalCss || styledModule === 'styled-jsx' || styledModule === 'tailwind' ? '' : " className={styles['container']}";
+    var extras = globalCss ? '' : " className={styles['container']}";
   _%>
-<%- style !== 'styled-jsx' && style!== 'tailwind' ? globalCss ? `import './${fileName}.${style}';` : `import styles from './${fileName}.module.${style}';`: '' %>
-  <%_ }
-} else {
+<%- globalCss ? `import './${fileName}.${style}';` : `import styles from './${fileName}.module.${style}';` %>
+<%_ } else {
     var wrapper = 'div';
     var extras = '';
 } _%>
 
-<%_ if (styledModule && styledModule !== 'styled-jsx' && styledModule !== 'tailwind') { _%>
-const Styled<%= className %> = styled.div`
-  color: pink;
-`;
-<%_ } _%>
 <%_ if(!isNextPage) { _%>
   <%_ if (classComponent) { _%>
 export class <%= className %> extends Component<% if (isTs) { %><{}><% } %> {
   <% if (isTs) { %>override<% } %> render() {
     return (
       <<%= wrapper %><%- extras %>>
-        <%= styledModule === 'styled-jsx' ? `<style jsx>{\`div { color: pink; }\`}</style>` : `` %>
         <p>Welcome to <%= className %>!</p>
         <%_ if (routing) { _%>
           <ul>
@@ -49,7 +36,6 @@ export class <%= className %> extends Component<% if (isTs) { %><{}><% } %> {
 export function <%= className %>() {
   return (
     <<%= wrapper %><%- extras %>>
-      <%_ if (styledModule === 'styled-jsx') { _%><style jsx>{`div { color: pink; }`}</style><%_ } _%>
       <h1>Welcome to <%= className %>!</h1>
       <%_ if (routing) { _%>
         <ul>
@@ -67,7 +53,6 @@ export default <%= className %>;
 export default function <%= className %>() {
   return (
     <<%= wrapper %><%- extras %>>
-      <%_ if (styledModule === 'styled-jsx') { _%><style jsx>{`div { color: pink; }`}</style><%_ } _%>
       <h1>Welcome to <%= className %>!</h1>
       <% if (routing) { %>
         <ul>

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

@@ -1 +1 @@
-{"version":3,"file":"normalize-options.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/component/lib/normalize-options.ts"],"names":[],"mappings":"AAAA,OAAO,EAA2C,IAAI,EAAE,MAAM,YAAY,CAAC;AAK3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAGrD,wBAAsB,gBAAgB,CACpC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,MAAM,GACd,OAAO,CAAC,gBAAgB,CAAC,CAgE3B"}
+{"version":3,"file":"normalize-options.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/component/lib/normalize-options.ts"],"names":[],"mappings":"AAAA,OAAO,EAA2C,IAAI,EAAE,MAAM,YAAY,CAAC;AAK3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAGrD,wBAAsB,gBAAgB,CACpC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,MAAM,GACd,OAAO,CAAC,gBAAgB,CAAC,CA2D3B"}

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

@@ -17,9 +17,6 @@ async function normalizeOptions(tree, options) {
     const project = (0, devkit_1.readProjectConfiguration)(tree, projectName);
     const { className } = (0, devkit_1.names)(name);
     const { sourceRoot: projectSourceRoot, root: projectRoot, projectType, } = project;
-    const styledModule = /^(css|scss|less|none)$/.test(options.style)
-        ? null
-        : options.style;
     if (options.export &&
         (0, ts_solution_setup_1.getProjectType)(tree, projectRoot, projectType) === 'application') {
         devkit_1.logger.warn(`The "--export" option should not be used with applications and will do nothing.`);
@@ -34,7 +31,6 @@ async function normalizeOptions(tree, options) {
         ...options,
         directory,
         projectName,
-        styledModule,
         hasStyles: options.style !== 'none',
         className,
         fileName,

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

@@ -31,6 +31,5 @@ export interface NormalizedSchema extends Omit<Schema, 'js'> {
   fileExtension: string;
   fileExtensionType: FileExtensionType;
   className: string;
-  styledModule: null | string;
   hasStyles: boolean;
 }

package/src/generators/component/schema.json

@@ -25,6 +25,7 @@
       "type": "string",
       "alias": "s",
       "default": "css",
+      "enum": ["css", "scss", "none"],
       "x-prompt": {
         "message": "Which stylesheet format would you like to use?",
         "type": "list",
@@ -35,27 +36,7 @@
           },
           {
             "value": "scss",
-            "label": "SASS(.scss)       [ https://sass-lang.com          ]"
-          },
-          {
-            "value": "less",
-            "label": "LESS              [ https://lesscss.org            ]"
-          },
-          {
-            "value": "tailwind",
-            "label": "tailwind          [ https://tailwindcss.com/       ]"
-          },
-          {
-            "value": "styled-components",
-            "label": "styled-components [ https://styled-components.com ]"
-          },
-          {
-            "value": "@emotion/styled",
-            "label": "emotion           [ https://emotion.sh            ]"
-          },
-          {
-            "value": "styled-jsx",
-            "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
+            "label": "SASS(.scss)       [ https://sass-lang.com   ]"
           },
           {
             "value": "none",

package/src/generators/host/schema.json

@@ -27,6 +27,7 @@
       "type": "string",
       "default": "css",
       "alias": "s",
+      "enum": ["css", "scss", "none"],
       "x-prompt": {
         "message": "Which stylesheet format would you like to use?",
         "type": "list",
@@ -37,27 +38,7 @@
           },
           {
             "value": "scss",
-            "label": "SASS(.scss)       [ https://sass-lang.com                     ]"
-          },
-          {
-            "value": "less",
-            "label": "LESS              [ https://lesscss.org                       ]"
-          },
-          {
-            "value": "tailwind",
-            "label": "tailwind [ https://tailwindcss.com/            ]"
-          },
-          {
-            "value": "styled-components",
-            "label": "styled-components [ https://styled-components.com            ]"
-          },
-          {
-            "value": "@emotion/styled",
-            "label": "emotion           [ https://emotion.sh                       ]"
-          },
-          {
-            "value": "styled-jsx",
-            "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
+            "label": "SASS(.scss)       [ https://sass-lang.com   ]"
           },
           {
             "value": "none",

package/src/generators/library/files/common/tsconfig.lib.json__tmpl__

@@ -4,7 +4,6 @@
     "outDir": "<%= offsetFromRoot %>dist/out-tsc",
     "types": [
       "node",
-      <%_ if (style === 'styled-jsx') { %>"@nx/react/typings/styled-jsx.d.ts",<% } _%>
       "@nx/react/typings/cssmodule.d.ts",
       "@nx/react/typings/image.d.ts"
     ]

package/src/generators/library/files/vite/tsconfig.lib.json__tmpl__

@@ -4,7 +4,6 @@
     "outDir": "<%= offsetFromRoot %>dist/out-tsc",
     "types": [
       "node",
-      <%_ if (style === 'styled-jsx') { _%>"@nx/react/typings/styled-jsx.d.ts",<%_ } _%>
       "@nx/react/typings/cssmodule.d.ts",
       "@nx/react/typings/image.d.ts"
     ]

package/src/generators/library/lib/add-rollup-build-target.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"add-rollup-build-target.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/library/lib/add-rollup-build-target.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAGL,iBAAiB,EAOlB,MAAM,YAAY,CAAC;AAQpB,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE7C,wBAAsB,oBAAoB,CACxC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,gBAAgB,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,CAAA;CAAE,EAC7D,QAAQ,GAAE,GAAG,CAAC,MAAM,CAAmC,8BAqHxD"}
+{"version":3,"file":"add-rollup-build-target.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/library/lib/add-rollup-build-target.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAGL,iBAAiB,EAOlB,MAAM,YAAY,CAAC;AAQpB,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE7C,wBAAsB,oBAAoB,CACxC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,gBAAgB,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,CAAA;CAAE,EAC7D,QAAQ,GAAE,GAAG,CAAC,MAAM,CAAmC,8BAiHxD"}

package/src/generators/library/lib/add-rollup-build-target.js

@@ -19,12 +19,7 @@ async function addRollupBuildTarget(host, options, external = new Set(['react',
             '@svgr/rollup': versions_1.svgrRollupVersion,
         }));
     }
-    if (options.style === '@emotion/styled') {
-        external.add('@emotion/react/jsx-runtime');
-    }
-    else {
-        external.add('react/jsx-runtime');
-    }
+    external.add('react/jsx-runtime');
     const nxJson = (0, devkit_1.readNxJson)(host);
     const hasRollupPlugin = !!nxJson.plugins?.some((p) => typeof p === 'string'
         ? p === '@nx/rollup/plugin'

package/src/generators/library/lib/create-files.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-files.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/library/lib/create-files.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,IAAI,EAEL,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAI7C,wBAAgB,WAAW,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,gBAAgB,QA6FhE"}
+{"version":3,"file":"create-files.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/library/lib/create-files.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,IAAI,EAEL,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAI7C,wBAAgB,WAAW,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,gBAAgB,QAiFhE"}

package/src/generators/library/lib/create-files.js

@@ -26,21 +26,10 @@ function createFiles(host, options) {
                     {
                         runtime: 'automatic',
                         useBuiltIns: 'usage',
-                        importSource: options.style === '@emotion/styled'
-                            ? '@emotion/react'
-                            : undefined,
                     },
                 ],
             ],
-            plugins: [
-                options.style === 'styled-components'
-                    ? ['styled-components', { pure: true, ssr: true }]
-                    : undefined,
-                options.style === 'styled-jsx' ? 'styled-jsx/babel' : undefined,
-                options.style === '@emotion/styled'
-                    ? '@emotion/babel-plugin'
-                    : undefined,
-            ].filter(Boolean),
+            plugins: [],
         });
     }
     if ((options.publishable || options.buildable) &&

package/src/generators/library/lib/install-common-dependencies.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"install-common-dependencies.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/library/lib/install-common-dependencies.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAEjB,IAAI,EACL,MAAM,YAAY,CAAC;AAapB,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE7C,wBAAsB,yBAAyB,CAC7C,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,gBAAgB,8BA2D1B"}
+{"version":3,"file":"install-common-dependencies.d.ts","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/library/lib/install-common-dependencies.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAEjB,IAAI,EACL,MAAM,YAAY,CAAC;AAYpB,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE7C,wBAAsB,yBAAyB,CAC7C,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,gBAAgB,8BAsD1B"}

package/src/generators/library/lib/install-common-dependencies.js

@@ -21,13 +21,8 @@ async function installCommonDependencies(host, options) {
     // `@nx/webpack` installs them automatically for now.
     // TODO(jack): Once we clean up webpack we can remove this check
     if (options.bundler === 'vite' || options.unitTestRunner === 'vitest') {
-        switch (options.style) {
-            case 'scss':
-                devDependencies['sass'] = versions_1.sassVersion;
-                break;
-            case 'less':
-                devDependencies['less'] = versions_1.lessVersion;
-                break;
+        if (options.style === 'scss') {
+            devDependencies['sass'] = versions_1.sassVersion;
         }
     }
     if (options.unitTestRunner && options.unitTestRunner !== 'none') {

package/src/generators/library/schema.json

@@ -36,6 +36,7 @@
       "type": "string",
       "default": "css",
       "alias": "s",
+      "enum": ["css", "scss", "none"],
       "x-prompt": {
         "message": "Which stylesheet format would you like to use?",
         "type": "list",
@@ -46,27 +47,7 @@
           },
           {
             "value": "scss",
-            "label": "SASS(.scss)       [ https://sass-lang.com          ]"
-          },
-          {
-            "value": "less",
-            "label": "LESS              [ https://lesscss.org            ]"
-          },
-          {
-            "value": "tailwind",
-            "label": "tailwind          [ https://tailwindcss.com/       ]"
-          },
-          {
-            "value": "styled-components",
-            "label": "styled-components [ https://styled-components.com ]"
-          },
-          {
-            "value": "@emotion/styled",
-            "label": "emotion           [ https://emotion.sh            ]"
-          },
-          {
-            "value": "styled-jsx",
-            "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
+            "label": "SASS(.scss)       [ https://sass-lang.com   ]"
           },
           {
             "value": "none",

package/src/generators/remote/schema.json

@@ -33,6 +33,7 @@
       "type": "string",
       "default": "css",
       "alias": "s",
+      "enum": ["css", "scss", "none"],
       "x-prompt": {
         "message": "Which stylesheet format would you like to use?",
         "type": "list",
@@ -43,27 +44,7 @@
           },
           {
             "value": "scss",
-            "label": "SASS(.scss)       [ https://sass-lang.com                     ]"
-          },
-          {
-            "value": "less",
-            "label": "LESS              [ https://lesscss.org                       ]"
-          },
-          {
-            "value": "tailwind",
-            "label": "tailwind [ https://tailwindcss.com/            ]"
-          },
-          {
-            "value": "styled-components",
-            "label": "styled-components [ https://styled-components.com            ]"
-          },
-          {
-            "value": "@emotion/styled",
-            "label": "emotion           [ https://emotion.sh                       ]"
-          },
-          {
-            "value": "styled-jsx",
-            "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
+            "label": "SASS(.scss)       [ https://sass-lang.com   ]"
           },
           {
             "value": "none",

package/src/migrations/update-22-0-0/add-svgr-to-webpack-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"add-svgr-to-webpack-config.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/migrations/update-22-0-0/add-svgr-to-webpack-config.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,IAAI,EAKV,MAAM,YAAY,CAAC;AAiHpB,wBAA8B,sBAAsB,CAAC,IAAI,EAAE,IAAI,iBAsX9D"}
+{"version":3,"file":"add-svgr-to-webpack-config.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/migrations/update-22-0-0/add-svgr-to-webpack-config.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,IAAI,EAKV,MAAM,YAAY,CAAC;AAiHpB,wBAA8B,sBAAsB,CAAC,IAAI,EAAE,IAAI,iBAsZ9D"}

package/src/migrations/update-22-0-0/add-svgr-to-webpack-config.js

@@ -271,11 +271,38 @@ async function addSvgrToWebpackConfig(tree) {
                             ts.isIdentifier(prop.name) &&
                             prop.name.text === 'svgr');
                         if (svgrProp) {
-                            changes.push({
-                                type: devkit_1.ChangeType.Delete,
-                                start: arg.getStart(),
-                                length: arg.getEnd() - arg.getStart(),
-                            });
+                            const hasOnlySvgrProperty = arg.properties.length === 1;
+                            if (hasOnlySvgrProperty) {
+                                changes.push({
+                                    type: devkit_1.ChangeType.Delete,
+                                    start: arg.getStart(),
+                                    length: arg.getEnd() - arg.getStart(),
+                                });
+                            }
+                            else {
+                                const propIndex = arg.properties.indexOf(svgrProp);
+                                const isLastProp = propIndex === arg.properties.length - 1;
+                                const isFirstProp = propIndex === 0;
+                                let removeStart = svgrProp.getFullStart();
+                                let removeEnd = svgrProp.getEnd();
+                                if (!isLastProp) {
+                                    const nextProp = arg.properties[propIndex + 1];
+                                    removeEnd = nextProp.getFullStart();
+                                }
+                                else if (!isFirstProp) {
+                                    const prevProp = arg.properties[propIndex - 1];
+                                    const textBetween = content.substring(prevProp.getEnd(), svgrProp.getFullStart());
+                                    const commaIndex = textBetween.indexOf(',');
+                                    if (commaIndex !== -1) {
+                                        removeStart = prevProp.getEnd() + commaIndex;
+                                    }
+                                }
+                                changes.push({
+                                    type: devkit_1.ChangeType.Delete,
+                                    start: removeStart,
+                                    length: removeEnd - removeStart,
+                                });
+                            }
                             if (config.svgrOptions) {
                                 const composePluginsCalls = (0, tsquery_1.query)(sourceFile, 'CallExpression[expression.name=composePlugins]');
                                 if (composePluginsCalls.length > 0) {

package/src/utils/assertion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"assertion.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/utils/assertion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAa/D,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAQpD;AAED,wBAAgB,sBAAsB,CACpC,WAAW,EAAE,OAAO,EACpB,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,GACzB,IAAI,CAMN"}
+{"version":3,"file":"assertion.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/utils/assertion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAI/D,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAQpD;AAED,wBAAgB,sBAAsB,CACpC,WAAW,EAAE,OAAO,EACpB,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,GACzB,IAAI,CAMN"}

package/src/utils/assertion.js

@@ -2,16 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.assertValidStyle = assertValidStyle;
 exports.assertValidReactRouter = assertValidReactRouter;
-const VALID_STYLES = [
-    'css',
-    'scss',
-    'less',
-    'tailwind',
-    'styled-components',
-    '@emotion/styled',
-    'styled-jsx',
-    'none',
-];
+const VALID_STYLES = ['css', 'scss', 'none'];
 function assertValidStyle(style) {
     if (VALID_STYLES.indexOf(style) === -1) {
         throw new Error(`Unsupported style option found: ${style}. Valid values are: "${VALID_STYLES.join('", "')}"`);

package/src/utils/create-ts-config.js

@@ -54,10 +54,6 @@ function createTsConfigForTsSolution(host, projectRoot, type, options, relativeP
                 types.add('vite/client');
                 json.compilerOptions.types = Array.from(types);
             }
-            if (options.style === '@emotion/styled') {
-                json.compilerOptions ??= {};
-                json.compilerOptions.jsxImportSource = '@emotion/react';
-            }
             return json;
         });
     }
@@ -79,9 +75,6 @@ function createTsConfigForNonTsSolution(host, projectRoot, type, options, relati
             },
         ],
     };
-    if (options.style === '@emotion/styled') {
-        json.compilerOptions.jsxImportSource = '@emotion/react';
-    }
     if (options.bundler === 'vite') {
         json.compilerOptions.types =
             options.unitTestRunner === 'vitest'

package/src/utils/versions.d.ts

@@ -6,7 +6,6 @@ export declare const reactDomV18Version = "18.3.1";
 export declare const reactIsVersion = "^19.0.0";
 export declare const reactIsV18Version = "18.3.1";
 export declare const swcLoaderVersion = "0.1.15";
-export declare const babelLoaderVersion = "^9.1.2";
 export declare const typesReactV18Version = "18.3.1";
 export declare const typesReactVersion = "^19.0.0";
 export declare const typesReactDomV18Version = "18.3.0";
@@ -17,12 +16,6 @@ export declare const reactViteVersion = "^4.2.0";
 export declare const typesNodeVersion = "^20.0.0";
 export declare const babelPresetReactVersion = "^7.14.5";
 export declare const babelCoreVersion = "^7.14.5";
-export declare const styledComponentsVersion = "5.3.6";
-export declare const typesStyledComponentsVersion = "5.1.26";
-export declare const emotionStyledVersion = "11.14.1";
-export declare const emotionReactVersion = "11.14.0";
-export declare const emotionBabelPlugin = "11.13.5";
-export declare const styledJsxVersion = "5.1.2";
 export declare const reactRouterDomVersion = "6.30.3";
 export declare const reactRouterVersion = "^7.14.2";
 export declare const reactRouterIsBotVersion = "^4.4.0";
@@ -34,10 +27,8 @@ export declare const eslintPluginImportVersion = "2.31.0";
 export declare const eslintPluginJsxA11yVersion = "6.10.1";
 export declare const eslintPluginReactVersion = "7.35.0";
 export declare const eslintPluginReactHooksVersion = "5.0.0";
-export declare const babelPluginStyledComponentsVersion = "1.10.7";
 export declare const tsLibVersion = "^2.3.0";
 export declare const postcssVersion = "8.4.38";
-export declare const tailwindcssVersion = "3.4.3";
 export declare const autoprefixerVersion = "10.4.13";
 export declare const expressVersion = "^4.21.2";
 export declare const typesExpressVersion = "^4.17.21";
@@ -46,11 +37,7 @@ export declare const corsVersion = "~2.8.5";
 export declare const typesCorsVersion = "~2.8.12";
 export declare const moduleFederationNodeVersion = "^2.7.21";
 export declare const moduleFederationEnhancedVersion = "^2.1.0";
-export declare const lessVersion = "3.12.2";
-export declare const sassVersion = "^1.55.0";
+export declare const sassVersion = "^1.97.2";
 export declare const rollupPluginUrlVersion = "^8.0.2";
 export declare const svgrRollupVersion = "^8.1.0";
-export declare const swcPluginStyledJsxVersion = "^1.5.67";
-export declare const swcPluginEmotionVersion = "^2.5.67";
-export declare const swcPluginStyledComponentsVersion = "^1.5.67";
 //# sourceMappingURL=versions.d.ts.map

package/src/utils/versions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"versions.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/utils/versions.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,KAAwC,CAAC;AAE/D,eAAO,MAAM,YAAY,YAAY,CAAC;AACtC,eAAO,MAAM,eAAe,WAAW,CAAC;AACxC,eAAO,MAAM,eAAe,YAAY,CAAC;AACzC,eAAO,MAAM,kBAAkB,WAAW,CAAC;AAC3C,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,iBAAiB,WAAW,CAAC;AAC1C,eAAO,MAAM,gBAAgB,WAAW,CAAC;AACzC,eAAO,MAAM,kBAAkB,WAAW,CAAC;AAC3C,eAAO,MAAM,oBAAoB,WAAW,CAAC;AAC7C,eAAO,MAAM,iBAAiB,YAAY,CAAC;AAC3C,eAAO,MAAM,uBAAuB,WAAW,CAAC;AAChD,eAAO,MAAM,oBAAoB,YAAY,CAAC;AAC9C,eAAO,MAAM,sBAAsB,WAAW,CAAC;AAC/C,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAC7C,eAAO,MAAM,gBAAgB,WAAW,CAAC;AAGzC,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAE1C,eAAO,MAAM,uBAAuB,YAAY,CAAC;AACjD,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAE1C,eAAO,MAAM,uBAAuB,UAAU,CAAC;AAC/C,eAAO,MAAM,4BAA4B,WAAW,CAAC;AAErD,eAAO,MAAM,oBAAoB,YAAY,CAAC;AAC9C,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAC7C,eAAO,MAAM,kBAAkB,YAAY,CAAC;AAG5C,eAAO,MAAM,gBAAgB,UAAU,CAAC;AAExC,eAAO,MAAM,qBAAqB,WAAW,CAAC;AAC9C,eAAO,MAAM,kBAAkB,YAAY,CAAC;AAC5C,eAAO,MAAM,uBAAuB,WAAW,CAAC;AAEhD,eAAO,MAAM,0BAA0B,WAAW,CAAC;AACnD,eAAO,MAAM,wBAAwB,WAAW,CAAC;AAEjD,eAAO,MAAM,qBAAqB,UAAU,CAAC;AAC7C,eAAO,MAAM,iBAAiB,UAAU,CAAC;AAEzC,eAAO,MAAM,yBAAyB,WAAW,CAAC;AAClD,eAAO,MAAM,0BAA0B,WAAW,CAAC;AACnD,eAAO,MAAM,wBAAwB,WAAW,CAAC;AACjD,eAAO,MAAM,6BAA6B,UAAU,CAAC;AAErD,eAAO,MAAM,kCAAkC,WAAW,CAAC;AAE3D,eAAO,MAAM,YAAY,WAAW,CAAC;AAErC,eAAO,MAAM,cAAc,WAAW,CAAC;AACvC,eAAO,MAAM,kBAAkB,UAAU,CAAC;AAC1C,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAG7C,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,mBAAmB,aAAa,CAAC;AAC9C,eAAO,MAAM,YAAY,WAAW,CAAC;AACrC,eAAO,MAAM,WAAW,WAAW,CAAC;AACpC,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAC1C,eAAO,MAAM,2BAA2B,YAAY,CAAC;AACrD,eAAO,MAAM,+BAA+B,WAAW,CAAC;AAGxD,eAAO,MAAM,WAAW,WAAW,CAAC;AACpC,eAAO,MAAM,WAAW,YAAY,CAAC;AAGrC,eAAO,MAAM,sBAAsB,WAAW,CAAC;AAC/C,eAAO,MAAM,iBAAiB,WAAW,CAAC;AAE1C,eAAO,MAAM,yBAAyB,YAAY,CAAC;AACnD,eAAO,MAAM,uBAAuB,YAAY,CAAC;AACjD,eAAO,MAAM,gCAAgC,YAAY,CAAC"}
+{"version":3,"file":"versions.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/utils/versions.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,KAAwC,CAAC;AAE/D,eAAO,MAAM,YAAY,YAAY,CAAC;AACtC,eAAO,MAAM,eAAe,WAAW,CAAC;AACxC,eAAO,MAAM,eAAe,YAAY,CAAC;AACzC,eAAO,MAAM,kBAAkB,WAAW,CAAC;AAC3C,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,iBAAiB,WAAW,CAAC;AAC1C,eAAO,MAAM,gBAAgB,WAAW,CAAC;AACzC,eAAO,MAAM,oBAAoB,WAAW,CAAC;AAC7C,eAAO,MAAM,iBAAiB,YAAY,CAAC;AAC3C,eAAO,MAAM,uBAAuB,WAAW,CAAC;AAChD,eAAO,MAAM,oBAAoB,YAAY,CAAC;AAC9C,eAAO,MAAM,sBAAsB,WAAW,CAAC;AAC/C,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAC7C,eAAO,MAAM,gBAAgB,WAAW,CAAC;AAGzC,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAE1C,eAAO,MAAM,uBAAuB,YAAY,CAAC;AACjD,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAE1C,eAAO,MAAM,qBAAqB,WAAW,CAAC;AAC9C,eAAO,MAAM,kBAAkB,YAAY,CAAC;AAC5C,eAAO,MAAM,uBAAuB,WAAW,CAAC;AAEhD,eAAO,MAAM,0BAA0B,WAAW,CAAC;AACnD,eAAO,MAAM,wBAAwB,WAAW,CAAC;AAEjD,eAAO,MAAM,qBAAqB,UAAU,CAAC;AAC7C,eAAO,MAAM,iBAAiB,UAAU,CAAC;AAEzC,eAAO,MAAM,yBAAyB,WAAW,CAAC;AAClD,eAAO,MAAM,0BAA0B,WAAW,CAAC;AACnD,eAAO,MAAM,wBAAwB,WAAW,CAAC;AACjD,eAAO,MAAM,6BAA6B,UAAU,CAAC;AAErD,eAAO,MAAM,YAAY,WAAW,CAAC;AAErC,eAAO,MAAM,cAAc,WAAW,CAAC;AACvC,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAG7C,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,mBAAmB,aAAa,CAAC;AAC9C,eAAO,MAAM,YAAY,WAAW,CAAC;AACrC,eAAO,MAAM,WAAW,WAAW,CAAC;AACpC,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAC1C,eAAO,MAAM,2BAA2B,YAAY,CAAC;AACrD,eAAO,MAAM,+BAA+B,WAAW,CAAC;AAGxD,eAAO,MAAM,WAAW,YAAY,CAAC;AAGrC,eAAO,MAAM,sBAAsB,WAAW,CAAC;AAC/C,eAAO,MAAM,iBAAiB,WAAW,CAAC"}

package/src/utils/versions.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.sassVersion = exports.lessVersion = exports.moduleFederationEnhancedVersion = exports.moduleFederationNodeVersion = exports.typesCorsVersion = exports.corsVersion = exports.isbotVersion = exports.typesExpressVersion = exports.expressVersion = exports.autoprefixerVersion = exports.tailwindcssVersion = exports.postcssVersion = exports.tsLibVersion = exports.babelPluginStyledComponentsVersion = exports.eslintPluginReactHooksVersion = exports.eslintPluginReactVersion = exports.eslintPluginJsxA11yVersion = exports.eslintPluginImportVersion = exports.reactReduxVersion = exports.reduxjsToolkitVersion = exports.testingLibraryDomVersion = exports.testingLibraryReactVersion = exports.reactRouterIsBotVersion = exports.reactRouterVersion = exports.reactRouterDomVersion = exports.styledJsxVersion = exports.emotionBabelPlugin = exports.emotionReactVersion = exports.emotionStyledVersion = exports.typesStyledComponentsVersion = exports.styledComponentsVersion = exports.babelCoreVersion = exports.babelPresetReactVersion = exports.typesNodeVersion = exports.reactViteVersion = exports.typesReactIsVersion = exports.typesReactIsV18Version = exports.typesReactDomVersion = exports.typesReactDomV18Version = exports.typesReactVersion = exports.typesReactV18Version = exports.babelLoaderVersion = exports.swcLoaderVersion = exports.reactIsV18Version = exports.reactIsVersion = exports.reactDomV18Version = exports.reactDomVersion = exports.reactV18Version = exports.reactVersion = exports.nxVersion = void 0;
-exports.swcPluginStyledComponentsVersion = exports.swcPluginEmotionVersion = exports.swcPluginStyledJsxVersion = exports.svgrRollupVersion = exports.rollupPluginUrlVersion = void 0;
+exports.svgrRollupVersion = exports.rollupPluginUrlVersion = exports.sassVersion = exports.moduleFederationEnhancedVersion = exports.moduleFederationNodeVersion = exports.typesCorsVersion = exports.corsVersion = exports.isbotVersion = exports.typesExpressVersion = exports.expressVersion = exports.autoprefixerVersion = exports.postcssVersion = exports.tsLibVersion = exports.eslintPluginReactHooksVersion = exports.eslintPluginReactVersion = exports.eslintPluginJsxA11yVersion = exports.eslintPluginImportVersion = exports.reactReduxVersion = exports.reduxjsToolkitVersion = exports.testingLibraryDomVersion = exports.testingLibraryReactVersion = exports.reactRouterIsBotVersion = exports.reactRouterVersion = exports.reactRouterDomVersion = exports.babelCoreVersion = exports.babelPresetReactVersion = exports.typesNodeVersion = exports.reactViteVersion = exports.typesReactIsVersion = exports.typesReactIsV18Version = exports.typesReactDomVersion = exports.typesReactDomV18Version = exports.typesReactVersion = exports.typesReactV18Version = exports.swcLoaderVersion = exports.reactIsV18Version = exports.reactIsVersion = exports.reactDomV18Version = exports.reactDomVersion = exports.reactV18Version = exports.reactVersion = exports.nxVersion = void 0;
 exports.nxVersion = require('../../package.json').version;
 exports.reactVersion = '^19.0.0';
 exports.reactV18Version = '18.3.1';
@@ -10,7 +9,6 @@ exports.reactDomV18Version = '18.3.1';
 exports.reactIsVersion = '^19.0.0';
 exports.reactIsV18Version = '18.3.1';
 exports.swcLoaderVersion = '0.1.15';
-exports.babelLoaderVersion = '^9.1.2';
 exports.typesReactV18Version = '18.3.1';
 exports.typesReactVersion = '^19.0.0';
 exports.typesReactDomV18Version = '18.3.0';
@@ -22,13 +20,6 @@ exports.reactViteVersion = '^4.2.0';
 exports.typesNodeVersion = '^20.0.0';
 exports.babelPresetReactVersion = '^7.14.5';
 exports.babelCoreVersion = '^7.14.5';
-exports.styledComponentsVersion = '5.3.6';
-exports.typesStyledComponentsVersion = '5.1.26';
-exports.emotionStyledVersion = '11.14.1';
-exports.emotionReactVersion = '11.14.0';
-exports.emotionBabelPlugin = '11.13.5';
-// WARNING: This needs to be in sync with Next.js' dependency or else there might be issues.
-exports.styledJsxVersion = '5.1.2';
 exports.reactRouterDomVersion = '6.30.3';
 exports.reactRouterVersion = '^7.14.2';
 exports.reactRouterIsBotVersion = '^4.4.0';
@@ -40,10 +31,8 @@ exports.eslintPluginImportVersion = '2.31.0';
 exports.eslintPluginJsxA11yVersion = '6.10.1';
 exports.eslintPluginReactVersion = '7.35.0';
 exports.eslintPluginReactHooksVersion = '5.0.0';
-exports.babelPluginStyledComponentsVersion = '1.10.7';
 exports.tsLibVersion = '^2.3.0';
 exports.postcssVersion = '8.4.38';
-exports.tailwindcssVersion = '3.4.3';
 exports.autoprefixerVersion = '10.4.13';
 // SSR and Module Federation
 exports.expressVersion = '^4.21.2';
@@ -54,11 +43,7 @@ exports.typesCorsVersion = '~2.8.12';
 exports.moduleFederationNodeVersion = '^2.7.21';
 exports.moduleFederationEnhancedVersion = '^2.1.0';
 // style preprocessors
-exports.lessVersion = '3.12.2';
-exports.sassVersion = '^1.55.0';
+exports.sassVersion = '^1.97.2';
 // rollup plugins (if needed)
 exports.rollupPluginUrlVersion = '^8.0.2';
 exports.svgrRollupVersion = '^8.1.0';
-exports.swcPluginStyledJsxVersion = '^1.5.67';
-exports.swcPluginEmotionVersion = '^2.5.67';
-exports.swcPluginStyledComponentsVersion = '^1.5.67';

package/tailwind.d.ts

@@ -1,7 +1,6 @@
 /**
- * Generates a set of glob patterns based off the source root of the app and its dependencies
- * @param dirPath workspace relative directory path that will be used to infer the parent project and dependencies
- * @param fileGlobPattern pass a custom glob pattern to be used
+ * @deprecated `@nx/react/tailwind` will be removed in Nx 24. Migrate to Tailwind CSS v4 which no longer needs glob patterns.
+ * See: https://nx.dev/docs/technologies/react/guides/using-tailwind-css-in-react
  */
 export declare function createGlobPatternsForDependencies(dirPath: string, fileGlobPattern?: string): string[];
 //# sourceMappingURL=tailwind.d.ts.map

package/tailwind.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tailwind.d.ts","sourceRoot":"","sources":["../../../packages/react/tailwind.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,iCAAiC,CAC/C,OAAO,EAAE,MAAM,EACf,eAAe,GAAE,MAAwD,YAoB1E"}
+{"version":3,"file":"tailwind.d.ts","sourceRoot":"","sources":["../../../packages/react/tailwind.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,wBAAgB,iCAAiC,CAC/C,OAAO,EAAE,MAAM,EACf,eAAe,GAAE,MAAuD,YA4BzE"}