@nx/storybook 22.1.0-canary.20251029-4a07faf → 22.1.0-canary.20251106-e9146c7

package/generators.json

@@ -31,6 +31,12 @@
       "schema": "./src/generators/migrate-9/schema.json",
       "description": "Migrate to Storybook version 9.",
       "hidden": false
+    },
+    "migrate-10": {
+      "factory": "./src/generators/migrate-10/migrate-10",
+      "schema": "./src/generators/migrate-10/schema.json",
+      "description": "Migrate to Storybook version 10.",
+      "hidden": false
     }
   }
 }

package/migrations.json

@@ -11,6 +11,15 @@
       "version": "21.2.0-beta.3",
       "description": "Remove deprecated Storybook addon dependencies",
       "implementation": "./src/migrations/update-21-2-0/remove-addon-dependencies"
+    },
+    "update-22-1-0-migrate-storybook-v10": {
+      "cli": "nx",
+      "version": "22.1.0-beta.3",
+      "requires": {
+        "storybook": ">=10.0.0"
+      },
+      "description": "Update workspce to use Storybok v10",
+      "implementation": "./src/migrations/update-22-1-0/migrate-to-storybook-10"
     }
   },
   "packageJsonUpdates": {
@@ -529,7 +538,7 @@
       }
     },
     "21.1.0": {
-      "version": "21.2.0-beta.3",
+      "version": "22.1.0-beta.3",
       "packages": {
         "@storybook/angular": {
           "version": "^9.0.5",
@@ -624,6 +633,108 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "22.1.0": {
+      "version": "22.1.0-beta.6",
+      "x-prompt": "Do you want to update Storybook to version 10?",
+      "implementation": "./src/migrations/update-21-2-0/migrate-to-storybook-10",
+      "requires": {
+        "storybook": ">=9.0.0 <10.0.0"
+      },
+      "packages": {
+        "@storybook/angular": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/react": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "storybook": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": true
+        },
+        "@storybook/addon-onboarding": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/addon-themes": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/builder-webpack5": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/core-webpack": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/html": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/html-vite": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/nextjs": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/preact": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/preact-vite": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/react-vite": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/react-webpack5": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/server": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/server-webpack5": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/svelte": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/svelte-vite": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/sveltekit": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/vue3": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/vue3-vite": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/web-components": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/web-components-vite": {
+          "version": "^10.0.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/storybook",
-  "version": "22.1.0-canary.20251029-4a07faf",
+  "version": "22.1.0-canary.20251106-e9146c7",
   "private": false,
   "description": "The Nx Plugin for Storybook contains executors and generators for allowing your workspace to use the powerful Storybook integration testing & documenting capabilities.",
   "repository": {
@@ -33,19 +33,19 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@nx/devkit": "22.1.0-canary.20251029-4a07faf",
+    "@nx/devkit": "22.1.0-canary.20251106-e9146c7",
     "@phenomnomnominal/tsquery": "~5.0.1",
     "semver": "^7.6.3",
     "tslib": "^2.3.0",
-    "@nx/cypress": "22.1.0-canary.20251029-4a07faf",
-    "@nx/js": "22.1.0-canary.20251029-4a07faf",
-    "@nx/eslint": "22.1.0-canary.20251029-4a07faf"
+    "@nx/cypress": "22.1.0-canary.20251106-e9146c7",
+    "@nx/js": "22.1.0-canary.20251106-e9146c7",
+    "@nx/eslint": "22.1.0-canary.20251106-e9146c7"
   },
   "devDependencies": {
-    "nx": "22.1.0-canary.20251029-4a07faf"
+    "nx": "22.1.0-canary.20251106-e9146c7"
   },
   "peerDependencies": {
-    "storybook": ">=7.0.0 <10.0.0"
+    "storybook": ">=7.0.0 <11.0.0"
   },
   "publishConfig": {
     "access": "public"

package/src/executors/build-storybook/build-storybook.impl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"build-storybook.impl.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/executors/build-storybook/build-storybook.impl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAU,MAAM,YAAY,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAS3D,wBAA8B,sBAAsB,CAClD,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,eAAe;;GAkBzB"}
+{"version":3,"file":"build-storybook.impl.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/executors/build-storybook/build-storybook.impl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAU,MAAM,YAAY,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAS3D,wBAA8B,sBAAsB,CAClD,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,eAAe;;GAczB"}

package/src/executors/build-storybook/build-storybook.impl.js

@@ -7,12 +7,9 @@ const semver_1 = require("semver");
 async function buildStorybookExecutor(options, context) {
     (0, utilities_1.storybookConfigExistsCheck)(options.configDir, context.projectName);
     const storybookMajor = (0, utilities_1.storybookMajorVersion)();
-    if (storybookMajor > 0 && storybookMajor <= 6) {
+    if (storybookMajor > 0 && storybookMajor <= 7) {
         throw (0, utilities_1.pleaseUpgrade)();
     }
-    else if (storybookMajor === 7) {
-        devkit_1.logger.warn(`Support for Storybook 7 is deprecated. Please upgrade to Storybook 8. See https://nx.dev/nx-api/storybook/generators/migrate-8 for more details.`);
-    }
     const buildOptions = options;
     devkit_1.logger.info(`NX Storybook builder starting ...`);
     await runInstance(buildOptions);

package/src/executors/build-storybook/schema.json

@@ -42,14 +42,6 @@
       "description": "Build a documentation-only site using addon-docs.",
       "default": false
     },
-    "staticDir": {
-      "type": "array",
-      "description": "Directory where to load static files from, array of strings.",
-      "items": {
-        "type": "string"
-      },
-      "x-deprecated": "In Storybook 6.4 the `--static-dir` CLI flag has been replaced with the the `staticDirs` field in `.storybook/main.js`. It will be removed completely in Storybook 7.0."
-    },
     "configDir": {
       "type": "string",
       "description": "Directory where to load Storybook configurations from.",

package/src/executors/storybook/schema.json

@@ -26,14 +26,6 @@
       "type": "string",
       "description": "Host to listen on."
     },
-    "staticDir": {
-      "type": "array",
-      "description": "Directory where to load static files from, array of strings.",
-      "items": {
-        "type": "string"
-      },
-      "x-deprecated": "In Storybook 6.4 the `--static-dir` CLI flag has been replaced with the the `staticDirs` field in `.storybook/main.js`. It will be removed completely in Storybook 7.0."
-    },
     "configDir": {
       "type": "string",
       "description": "Directory where to load Storybook configurations from.",

package/src/executors/storybook/storybook.impl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"storybook.impl.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/executors/storybook/storybook.impl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAU,MAAM,YAAY,CAAC;AAOrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAG3D,wBAA+B,iBAAiB,CAC9C,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,eAAe,GACvB,cAAc,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3C,CAAC,CAuBD"}
+{"version":3,"file":"storybook.impl.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/executors/storybook/storybook.impl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAU,MAAM,YAAY,CAAC;AAOrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAG3D,wBAA+B,iBAAiB,CAC9C,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,eAAe,GACvB,cAAc,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3C,CAAC,CAmBD"}

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

@@ -1,17 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = storybookExecutor;
-const devkit_1 = require("@nx/devkit");
 const utilities_1 = require("../../utils/utilities");
 const semver_1 = require("semver");
 async function* storybookExecutor(options, context) {
     const storybookMajor = (0, utilities_1.storybookMajorVersion)();
-    if (storybookMajor > 0 && storybookMajor <= 6) {
+    if (storybookMajor > 0 && storybookMajor <= 7) {
         throw (0, utilities_1.pleaseUpgrade)();
     }
-    else if (storybookMajor === 7) {
-        devkit_1.logger.warn(`Support for Storybook 7 is deprecated. Please upgrade to Storybook 8. See https://nx.dev/nx-api/storybook/generators/migrate-8 for more details.`);
-    }
     (0, utilities_1.storybookConfigExistsCheck)(options.configDir, context.projectName);
     const buildOptions = options;
     const result = await runInstance(buildOptions);

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

@@ -1 +1 @@
-{"version":3,"file":"configuration.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/generators/configuration/configuration.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAKjB,IAAI,EACL,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAC;AAsCpD,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,wBAAwB,8BAGjC;AAED,wBAAsB,8BAA8B,CAClD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,wBAAwB,8BA4KpC;AAwBD,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"configuration.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/generators/configuration/configuration.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAKjB,IAAI,EACL,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAC;AAuCpD,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,wBAAwB,8BAGjC;AAED,wBAAsB,8BAA8B,CAClD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,wBAAwB,8BA4KpC;AAwBD,eAAe,sBAAsB,CAAC"}

package/src/generators/configuration/configuration.js

@@ -15,7 +15,7 @@ function configurationGenerator(tree, schema) {
     return configurationGeneratorInternal(tree, { addPlugin: false, ...schema });
 }
 async function configurationGeneratorInternal(tree, rawSchema) {
-    const storybookMajor = (0, utilities_1.storybookMajorVersion)();
+    const storybookMajor = (0, utilities_1.storybookMajorVersion)(tree);
     if (storybookMajor > 0 && storybookMajor === 7) {
         throw new Error((0, utilities_1.pleaseUpgrade)());
     }
@@ -93,7 +93,7 @@ async function configurationGeneratorInternal(tree, rawSchema) {
         }
     }
     else {
-        devDeps['storybook'] = versions_1.storybookVersion;
+        devDeps['storybook'] = (0, utilities_1.getStorybookVersionToInstall)(tree);
     }
     if (schema.tsConfiguration) {
         devDeps['ts-node'] = versions_1.tsNodeVersion;

package/src/generators/configuration/files/v10/project-files/.storybook/main.js__tmpl__

@@ -0,0 +1,93 @@
+import { fileURLToPath } from "node:url";
+import { dirname } from "node:path";
+
+<% if (usesVite && !viteConfigFilePath) { %>
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { mergeConfig } from 'vite';
+<% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %>
+
+const config = {
+  stories: [
+    <% if((uiFramework === '@storybook/angular' && projectType === 'library') || uiFramework === '@storybook/nextjs') { %>
+    '../**/*.@(mdx|stories.@(js|jsx|ts|tsx))' <% } else { %>
+    '../<%= projectDirectory %>/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'
+  <% } %>],
+  addons: [<% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
+  framework: {
+    name: <% if(uiFramework !== '@storybook/angular') { %>getAbsolutePath(<% } %>'<%= uiFramework %>'<% if(uiFramework !== '@storybook/angular') { %>)<% } %>,
+    options: {
+     <% if (usesVite && viteConfigFilePath && hasPlugin) { %>
+      builder: {
+        viteConfigPath: '<%= viteConfigFileName %>',
+      },
+      <% } %>
+      <% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
+      builder: {
+        viteConfigPath: '<%= viteConfigFilePath %>',
+      },
+      <% } %>
+    },
+  },
+  <% if (usesReactNative && uiFramework === '@storybook/react-webpack5') { %>webpackFinal: async (config) => {
+    if (config.resolve) {
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        'react-native$': 'react-native-web',
+      };
+      config.resolve.extensions = [
+        '.web.tsx',
+        '.web.ts',
+        '.web.jsx',
+        '.web.js',
+        ...(config.resolve.extensions ?? []),
+      ];
+    }
+    return config;
+  },<% } %><% if (usesVite && !viteConfigFilePath) { %>
+  viteFinal: async (config) =>
+    mergeConfig(config, {
+      <% if (usesReactNative) { %>define: {
+        global: 'window',
+      },
+      resolve: {
+        extensions: [
+          '.mjs',
+          '.web.tsx',
+          '.tsx',
+          '.web.ts',
+          '.ts',
+          '.web.jsx',
+          '.jsx',
+          '.web.js',
+          '.js',
+          '.css',
+          '.json',
+          ...(config.resolve?.extensions ?? []),
+        ],
+        alias: {
+          'react-native': 'react-native-web',
+        },
+      },<% } %>
+      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %>nxViteTsPaths()],
+    }),
+  <% } %>
+};
+<% if(uiFramework !== '@storybook/angular') { %>
+function getAbsolutePath(value: string): any {
+  return dirname(fileURLToPath(import.meta.resolve(`${value}/package.json`)));
+}
+<% } %>
+
+export default config;
+
+<% if(!usesVite) { %>
+// To customize your webpack configuration you can use the webpackFinal field.
+// Check https://storybook.js.org/docs/react/builders/webpack#extending-storybooks-webpack-config
+// and https://nx.dev/recipes/storybook/custom-builder-configs
+<% } %>
+
+<% if(usesVite) { %>
+// To customize your Vite configuration you can use the viteFinal field.
+// Check https://storybook.js.org/docs/react/builders/vite#configuration
+// and https://nx.dev/recipes/storybook/custom-builder-configs
+<% } %>

package/src/generators/configuration/files/v10/project-files-ts/.storybook/main.ts__tmpl__

@@ -0,0 +1,94 @@
+import { fileURLToPath } from "node:url";
+import { dirname } from "node:path";
+
+import type { StorybookConfig } from '<%= uiFramework %>';
+<% if (usesVite && !viteConfigFilePath) { %>
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { mergeConfig } from 'vite';
+<% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %><% if (uiFramework === '@storybook/react-vite' && !viteConfigFilePath) { %>import react from '@vitejs/plugin-react'<% } %>
+
+const config: StorybookConfig = {
+  stories: [
+    <% if((uiFramework === '@storybook/angular' && projectType === 'library') || uiFramework === '@storybook/nextjs') { %>
+    '../**/*.@(mdx|stories.@(js|jsx|ts|tsx))' <% } else { %>
+    '../<%= projectDirectory %>/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'
+  <% } %>],
+  addons: [<% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
+  framework: {
+    name: <% if(uiFramework !== '@storybook/angular') { %>getAbsolutePath(<% } %>'<%= uiFramework %>'<% if(uiFramework !== '@storybook/angular') { %>)<% } %>,
+    options: {
+      <% if (usesVite && viteConfigFilePath && hasPlugin) { %>
+      builder: {
+        viteConfigPath: '<%= viteConfigFileName %>',
+      },
+      <% } %><% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
+      builder: {
+        viteConfigPath: '<%= viteConfigFilePath %>',
+      },
+      <% } %>
+    },
+  },
+  <% if (usesReactNative && uiFramework === '@storybook/react-webpack5') { %>webpackFinal: async (config) => {
+    if (config.resolve) {
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        'react-native$': 'react-native-web',
+      };
+      config.resolve.extensions = [
+        '.web.tsx',
+        '.web.ts',
+        '.web.jsx',
+        '.web.js',
+        ...(config.resolve.extensions ?? []),
+      ];
+    }
+    return config;
+  },<% } %><% if (usesVite && !viteConfigFilePath) { %>
+  viteFinal: async (config) =>
+    mergeConfig(config, {
+      <% if (usesReactNative) { %>define: {
+        global: 'window',
+      },
+      resolve: {
+        extensions: [
+          '.mjs',
+          '.web.tsx',
+          '.tsx',
+          '.web.ts',
+          '.ts',
+          '.web.jsx',
+          '.jsx',
+          '.web.js',
+          '.js',
+          '.css',
+          '.json',
+          ...(config.resolve?.extensions ?? []),
+        ],
+        alias: {
+          'react-native': 'react-native-web',
+        },
+      },<% } %>
+      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if(uiFramework === '@storybook/react-vite') { %>react(), <% } %>nxViteTsPaths()],
+    }),
+  <% } %>
+};
+
+<% if(uiFramework !== '@storybook/angular') { %>
+function getAbsolutePath(value: string): any {
+  return dirname(fileURLToPath(import.meta.resolve(`${value}/package.json`)));
+}
+<% } %>
+
+export default config;
+
+<% if(!usesVite) { %>
+// To customize your webpack configuration you can use the webpackFinal field.
+// Check https://storybook.js.org/docs/react/builders/webpack#extending-storybooks-webpack-config
+// and https://nx.dev/recipes/storybook/custom-builder-configs
+<% } %>
+
+<% if(usesVite) { %>
+// To customize your Vite configuration you can use the viteFinal field.
+// Check https://storybook.js.org/docs/react/builders/vite#configuration
+// and https://nx.dev/recipes/storybook/custom-builder-configs
+<% } %>

package/src/generators/configuration/files/v9/project-files/.storybook/tsconfig.json__tmpl__

@@ -0,0 +1,15 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "emitDecoratorMetadata": true
+  },
+  "exclude": ["../**/*.spec.ts"],
+  "include": [
+    "../src/**/*.stories.ts",
+    "../src/**/*.stories.js",
+    "../src/**/*.stories.jsx",
+    "../src/**/*.stories.tsx",
+    "../src/**/*.stories.mdx",
+    "*.js"
+    ]
+}

package/src/generators/configuration/files/v9/project-files-ts/.storybook/tsconfig.json__tmpl__

@@ -0,0 +1,16 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "emitDecoratorMetadata": true
+  },
+  "exclude": ["../**/*.spec.ts"],
+  "include": [
+    "../src/**/*.stories.ts",
+    "../src/**/*.stories.js",
+    "../src/**/*.stories.jsx",
+    "../src/**/*.stories.tsx",
+    "../src/**/*.stories.mdx",
+    "*.js", 
+    "*.ts"
+    ]
+}

package/src/generators/configuration/lib/edit-root-tsconfig.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"edit-root-tsconfig.d.ts","sourceRoot":"","sources":["../../../../../../../packages/storybook/src/generators/configuration/lib/edit-root-tsconfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,IAAI,EAAE,MAAM,YAAY,CAAC;AAG7D;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,IAAI,QAyB1C"}
+{"version":3,"file":"edit-root-tsconfig.d.ts","sourceRoot":"","sources":["../../../../../../../packages/storybook/src/generators/configuration/lib/edit-root-tsconfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,IAAI,EAAE,MAAM,YAAY,CAAC;AAI7D;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,IAAI,QA8B1C"}

package/src/generators/configuration/lib/edit-root-tsconfig.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.editRootTsConfig = editRootTsConfig;
 const devkit_1 = require("@nx/devkit");
 const js_1 = require("@nx/js");
+const utilities_1 = require("../../../utils/utilities");
 /**
  * This is a temporary fix for Storybook to support TypeScript configuration files.
  * The issue is that if there is a root tsconfig.json file, Storybook will use it, and
@@ -13,6 +14,10 @@ function editRootTsConfig(tree) {
     if (!tree.exists('tsconfig.json')) {
         return;
     }
+    if ((0, utilities_1.storybookMajorVersion)(tree) >= 10) {
+        // This is not needed from storybook 10+
+        return;
+    }
     (0, devkit_1.updateJson)(tree, 'tsconfig.json', (json) => {
         json['ts-node'] ??= {};
         json['ts-node'].compilerOptions ??= {};

package/src/generators/configuration/lib/ensure-dependencies.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ensure-dependencies.d.ts","sourceRoot":"","sources":["../../../../../../../packages/storybook/src/generators/configuration/lib/ensure-dependencies.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,IAAI,EACV,MAAM,YAAY,CAAC;AAYpB,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AAE1D,MAAM,MAAM,yBAAyB,GAAG;IACtC,WAAW,CAAC,EAAE,wBAAwB,CAAC,aAAa,CAAC,CAAC;CACvD,CAAC;AAEF,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,yBAAyB,0CA+FnC"}
+{"version":3,"file":"ensure-dependencies.d.ts","sourceRoot":"","sources":["../../../../../../../packages/storybook/src/generators/configuration/lib/ensure-dependencies.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,IAAI,EACV,MAAM,YAAY,CAAC;AAYpB,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AAE1D,MAAM,MAAM,yBAAyB,GAAG;IACtC,WAAW,CAAC,EAAE,wBAAwB,CAAC,aAAa,CAAC,CAAC;CACvD,CAAC;AAEF,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,yBAAyB,0CAuFnC"}

package/src/generators/configuration/lib/ensure-dependencies.js

@@ -6,13 +6,8 @@ const semver_1 = require("semver");
 const utilities_1 = require("../../../utils/utilities");
 const versions_1 = require("../../../utils/versions");
 function ensureDependencies(tree, options) {
-    let storybookVersionToInstall = versions_1.storybookVersion;
-    const installedStorybookMajorVersion = (0, utilities_1.storybookMajorVersion)();
-    if (installedStorybookMajorVersion >= 7 &&
-        (0, utilities_1.getInstalledStorybookVersion)() &&
-        (0, semver_1.gte)((0, utilities_1.getInstalledStorybookVersion)(), '7.0.0')) {
-        storybookVersionToInstall = (0, utilities_1.getInstalledStorybookVersion)();
-    }
+    const storybookVersionToInstall = (0, utilities_1.getInstalledStorybookVersion)(tree);
+    const installedStorybookMajorVersion = (0, utilities_1.storybookMajorVersion)(tree);
     const dependencies = {};
     const devDependencies = installedStorybookMajorVersion < 9
         ? {

package/src/generators/configuration/lib/util-functions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"util-functions.d.ts","sourceRoot":"","sources":["../../../../../../../packages/storybook/src/generators/configuration/lib/util-functions.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"util-functions.d.ts","sourceRoot":"","sources":["../../../../../../../packages/storybook/src/generators/configuration/lib/util-functions.ts"],"names":[],"mappings":"AAAA,OAAO,EAWL,IAAI,EAML,MAAM,YAAY,CAAC;AASpB,OAAO,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAYpD,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,EACnB,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,OAAO,QAwC1B;AAED,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,EACnB,gBAAgB,EAAE,OAAO,QAmD1B;AAED,wBAAsB,eAAe,CACnC,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,wBAAwB,iBAqB/B;AAED,wBAAgB,2BAA2B,CACzC,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,EACnB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,OAAO,EACtB,OAAO,EAAE,YAAY,GAAG,KAAK,QAuH9B;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,IAAI,QAe9C;AAED,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,wBAAwB,QAoCjC;AAED,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,wBAAwB,QAqCjC;AAED;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,wBAAwB,QAqE5E;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,wBAAwB,GAC/B,wBAAwB,CAU1B;AAED,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,IAAI,QAoCnD;AAED,wBAAgB,4BAA4B,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,UAAO,QA8CvE;AAED,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,EACnB,WAAW,EAAE,WAAW,EACxB,EAAE,EAAE,OAAO,EACX,eAAe,EAAE,OAAO,EACxB,IAAI,EAAE,MAAM,EACZ,WAAW,EAAE,MAAM,EACnB,yCAAyC,EAAE,OAAO,EAClD,gBAAgB,EAAE,OAAO,EACzB,OAAO,CAAC,EAAE,MAAM,EAChB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,OAAO,EACjB,QAAQ,CAAC,EAAE,OAAO,EAClB,kBAAkB,CAAC,EAAE,MAAM,EAC3B,SAAS,CAAC,EAAE,OAAO,EACnB,kBAAkB,CAAC,EAAE,MAAM,EAC3B,eAAe,CAAC,EAAE,OAAO,QAmE1B;AAED,wBAAgB,eAAe,CAC7B,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,EACnB,IAAI,CAAC,EAAE,MAAM,GACZ,MAAM,CAUR;AAED,wBAAgB,sCAAsC,CAAC,IAAI,EAAE,IAAI,QAehE;AAED,wBAAgB,yCAAyC,CAAC,WAAW,EAAE,MAAM,WAE5E;AAED,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,IAAI,WAEjD;AAED,wBAAgB,YAAY,CAC1B,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,MAAM,EACpB,eAAe,EAAE,OAAO,GACvB,OAAO,CAkBT;AAED,wBAAgB,cAAc,CAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,GAClB;IACD,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;CACxC,CAYA;AAED,wBAAgB,cAAc,CAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,MAAM,GAClB,MAAM,GAAG,SAAS,CASpB;AAED,wBAAgB,kBAAkB,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAS/D;AAED,wBAAgB,wBAAwB,CACtC,WAAW,EAAE,MAAM,EACnB,yBAAyB,EAAE,MAAM,EACjC,IAAI,EAAE,IAAI,QAmEX"}

package/src/generators/configuration/lib/util-functions.js

@@ -124,6 +124,7 @@ async function addStaticTarget(tree, opts) {
     (0, devkit_1.updateProjectConfiguration)(tree, opts.project, projectConfig);
 }
 function createStorybookTsconfigFile(tree, projectRoot, uiFramework, isRootProject, mainDir) {
+    const storybookMajorVersion = (0, utilities_1.storybookMajorVersion)(tree);
     const offset = (0, devkit_1.offsetFromRoot)(projectRoot);
     const useTsSolution = (0, ts_solution_setup_1.isUsingTsSolutionSetup)(tree);
     // First let's check if old configuration file exists
@@ -156,8 +157,8 @@ function createStorybookTsconfigFile(tree, projectRoot, uiFramework, isRootProje
                     uiFramework === '@storybook/react-vite'
                     ? ''
                     : undefined,
-            module: useTsSolution ? 'esnext' : undefined,
-            moduleResolution: useTsSolution ? 'bundler' : undefined,
+            module: storybookMajorVersion === 10 || useTsSolution ? 'esnext' : undefined,
+            moduleResolution: storybookMajorVersion === 10 || useTsSolution ? 'bundler' : undefined,
             jsx: useTsSolution && uiFramework !== '@storybook/angular'
                 ? 'preserve'
                 : undefined,
@@ -415,7 +416,8 @@ function createProjectStorybookDir(tree, projectName, uiFramework, js, tsConfigu
         devkit_1.logger.warn(`Storybook configuration files already exist for ${projectName}!`);
         return;
     }
-    const templatePath = (0, path_1.join)(__dirname, `../project-files${tsConfiguration ? '-ts' : ''}`);
+    const storybookMajor = ((0, utilities_1.storybookMajorVersion)(tree) ?? 10) <= 9 ? 9 : 10;
+    const templatePath = (0, path_1.join)(__dirname, `../files/v${storybookMajor}/project-files${tsConfiguration ? '-ts' : ''}`);
     (0, devkit_1.generateFiles)(tree, templatePath, root, {
         tmpl: '',
         uiFramework,

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

@@ -1 +1 @@
-{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/generators/init/init.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,iBAAiB,EAIjB,IAAI,EAGL,MAAM,YAAY,CAAC;AASpB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAqElC,wBAAgB,aAAa,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,8BAEvD;AAED,wBAAsB,qBAAqB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,8BAiErE;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/generators/init/init.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,iBAAiB,EAIjB,IAAI,EAGL,MAAM,YAAY,CAAC;AAUpB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AA8DlC,wBAAgB,aAAa,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,8BAEvD;AAED,wBAAsB,qBAAqB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,8BAiErE;AAED,eAAe,aAAa,CAAC"}

package/src/generators/init/init.js

@@ -4,7 +4,6 @@ exports.initGenerator = initGenerator;
 exports.initGeneratorInternal = initGeneratorInternal;
 const devkit_1 = require("@nx/devkit");
 const add_plugin_1 = require("@nx/devkit/src/utils/add-plugin");
-const semver_1 = require("semver");
 const plugin_1 = require("../../plugins/plugin");
 const utilities_1 = require("../../utils/utilities");
 const versions_1 = require("../../utils/versions");
@@ -14,12 +13,7 @@ function checkDependenciesInstalled(host, schema) {
         '@nx/storybook': versions_1.nxVersion,
         '@nx/web': versions_1.nxVersion,
     };
-    let storybookVersionToInstall = versions_1.storybookVersion;
-    if ((0, utilities_1.storybookMajorVersion)() >= 7 &&
-        (0, utilities_1.getInstalledStorybookVersion)() &&
-        (0, semver_1.gte)((0, utilities_1.getInstalledStorybookVersion)(), '7.0.0')) {
-        storybookVersionToInstall = (0, utilities_1.getInstalledStorybookVersion)();
-    }
+    const storybookVersionToInstall = (0, utilities_1.getStorybookVersionToInstall)(host);
     devDependencies['storybook'] = storybookVersionToInstall;
     return (0, devkit_1.addDependenciesToPackageJson)(host, {}, devDependencies, undefined, schema.keepExistingVersions);
 }

package/src/generators/migrate-10/calling-storybook-cli.d.ts

@@ -0,0 +1,4 @@
+import { Schema } from './schema';
+export declare function callUpgrade(schema: Schema): 1 | Buffer;
+export declare function checkStorybookInstalled(packageJson: Record<string, any>): boolean;
+//# sourceMappingURL=calling-storybook-cli.d.ts.map

package/src/generators/migrate-10/calling-storybook-cli.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calling-storybook-cli.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/generators/migrate-10/calling-storybook-cli.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,GAAG,MAAM,CA4CtD;AAED,wBAAgB,uBAAuB,CACrC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAC/B,OAAO,CAOT"}

package/src/generators/migrate-10/calling-storybook-cli.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.callUpgrade = callUpgrade;
+exports.checkStorybookInstalled = checkStorybookInstalled;
+const devkit_1 = require("@nx/devkit");
+const child_process_1 = require("child_process");
+function callUpgrade(schema) {
+    const packageManager = (0, devkit_1.detectPackageManager)();
+    const pm = (0, devkit_1.getPackageManagerCommand)(packageManager);
+    try {
+        devkit_1.output.log({
+            title: `Calling sb upgrade`,
+            bodyLines: [
+                `ℹ️ Nx will call the Storybook CLI to upgrade your @storybook/* packages to the latest version.`,
+                `📖 You can read more about the Storybook upgrade command here: https://storybook.js.org/docs/react/configure/upgrading`,
+            ],
+            color: 'blue',
+        });
+        (0, child_process_1.execSync)(`${pm.dlx} ${packageManager === 'yarn' ? 'storybook' : 'storybook@latest'} upgrade ${schema.autoAcceptAllPrompts ? '--yes' : ''}`, {
+            stdio: [0, 1, 2],
+            windowsHide: false,
+        });
+        devkit_1.output.log({
+            title: `Storybook packages upgraded.`,
+            bodyLines: [
+                `☑️ The upgrade command was successful.`,
+                `Your Storybook packages are now at the latest version.`,
+            ],
+            color: 'green',
+        });
+    }
+    catch (e) {
+        devkit_1.output.log({
+            title: 'Migration failed',
+            bodyLines: [
+                `🚨 The Storybook CLI failed to upgrade your @storybook/* packages to the latest version.`,
+                `Please try running the sb upgrade command manually:`,
+                `${pm.exec} storybook@latest upgrade`,
+            ],
+            color: 'red',
+        });
+        console.log(e);
+        return 1;
+    }
+}
+function checkStorybookInstalled(packageJson) {
+    return ((packageJson.dependencies['storybook'] ||
+        packageJson.devDependencies['storybook']) &&
+        (packageJson.dependencies['@nx/storybook'] ||
+            packageJson.devDependencies['@nx/storybook']));
+}

package/src/generators/migrate-10/migrate-10.d.ts

@@ -0,0 +1,5 @@
+import { Tree } from '@nx/devkit';
+import { Schema } from './schema';
+export declare function migrate10Generator(tree: Tree, schema: Schema): Promise<void>;
+export default migrate10Generator;
+//# sourceMappingURL=migrate-10.d.ts.map

package/src/generators/migrate-10/migrate-10.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"migrate-10.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/generators/migrate-10/migrate-10.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,IAAI,EAAE,MAAM,YAAY,CAAC;AAIzD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,wBAAsB,kBAAkB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,iBAgBlE;AAED,eAAe,kBAAkB,CAAC"}

package/src/generators/migrate-10/migrate-10.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrate10Generator = migrate10Generator;
+const devkit_1 = require("@nx/devkit");
+const output_1 = require("nx/src/utils/output");
+const calling_storybook_cli_1 = require("./calling-storybook-cli");
+async function migrate10Generator(tree, schema) {
+    const packageJson = (0, devkit_1.readJson)(tree, 'package.json');
+    if (!(0, calling_storybook_cli_1.checkStorybookInstalled)(packageJson)) {
+        output_1.output.error({
+            title: 'No Storybook packages installed',
+            bodyLines: [
+                `🚨 Nx did not find any Storybook packages installed in your workspace.`,
+                `So no migration is necessary.`,
+            ],
+        });
+        return;
+    }
+    (0, calling_storybook_cli_1.callUpgrade)(schema);
+    await (0, devkit_1.formatFiles)(tree);
+}
+exports.default = migrate10Generator;

package/src/generators/migrate-10/schema.d.ts

@@ -0,0 +1,4 @@
+export interface Schema {
+  autoAcceptAllPrompts?: boolean;
+  configDirs?: string[];
+}

package/src/generators/migrate-10/schema.json

@@ -0,0 +1,19 @@
+{
+  "cli": "nx",
+  "title": "Migrate Storybook to version 10.",
+  "description": "Migrate Storybook to version 10.",
+  "$id": "migrate-10",
+  "type": "object",
+  "properties": {
+    "autoAcceptAllPrompts": {
+      "type": "boolean",
+      "description": "Say yes to all the prompts from the Storybook CLI migration scripts.",
+      "default": false
+    },
+    "configDir": {
+      "type": "array",
+      "description": "Directory(ies) where to load Storybook configurations from. Use this if you want to customize the Storybook projects you'd like to migrate.",
+      "default": []
+    }
+  }
+}

package/src/migrations/update-22-1-0/files/ai-instructions-for-cjs-esm.md

@@ -0,0 +1,175 @@
+# Instructions for LLM: Transform Storybook Config Files from CommonJS to ESM
+
+## Task Overview
+
+Find all .storybook/main.ts and .storybook/main.js files in the workspace and transform
+any CommonJS (CJS) configurations to ES Modules (ESM).
+
+### Step 1: Find All Storybook Config Files
+
+Use glob patterns to locate all Storybook main configuration files:
+**/.storybook/main.js
+**/.storybook/main.ts
+
+### Step 2: Identify CommonJS vs ESM
+
+For each file found, read its contents and determine if it uses CommonJS syntax by
+checking for:
+
+CommonJS indicators:
+
+- `module.exports =` or `module.exports.`
+- `exports.`
+- `require()` function calls
+
+ESM indicators (already correct):
+
+- export default
+- export const/export function
+- import statements
+
+### Step 3: Transform CJS to ESM
+
+For each file identified as CommonJS, perform the following transformations:
+
+A. Convert `module.exports`
+
+// FROM (CJS):
+
+```
+module.exports = {
+    stories: ['../src/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
+    addons: ['@storybook/addon-essentials']
+};
+```
+
+// TO (ESM):
+
+```
+export default {
+    stories: ['../src/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
+    addons: ['@storybook/addon-essentials']
+};
+```
+
+B. Convert `require()` to import
+
+// FROM (CJS):
+
+```
+const { nxViteTsPaths } = require('@nx/vite/plugins/nx-tsconfig-paths.plugin');
+const { mergeConfig } = require('vite');
+```
+
+// TO (ESM):
+
+```
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { mergeConfig } from 'vite';
+```
+
+C. Handle `path.join()` patterns
+
+// FROM (CJS):
+
+```
+const path = require('path');
+const rootMain = require(path.join(__dirname, '../../.storybook/main'));
+```
+
+// TO (ESM):
+
+```
+import { join } from 'path';
+import rootMain from '../../.storybook/main';
+```
+
+D. Handle Dynamic Requires in Config Functions
+
+// FROM (CJS):
+
+```
+module.exports = {
+    viteFinal: async (config) => {
+        const { mergeConfig } = require('vite');
+        return mergeConfig(config, {});
+    }
+};
+```
+
+// TO (ESM):
+
+```
+import { mergeConfig } from 'vite';
+
+export default {
+    viteFinal: async (config) => {
+        return mergeConfig(config, {});
+    }
+};
+```
+
+### Step 4: Validation Checks
+
+After transformation, verify:
+
+1. All require() calls have been converted to import statements at the top of the file
+2. All module.exports have been converted to export default or named exports
+3. Imports are at the top of the file (before the export)
+4. The file maintains proper TypeScript typing if it's a .ts file
+
+### Step 5: Report Results
+
+Provide a summary of:
+
+- Total files found
+- Files that were already ESM (no changes needed)
+- Files that were transformed from CJS to ESM
+- List the specific files that were modified
+
+### Example Complete Transformation
+
+Before (CJS):
+
+```
+const path = require('path');
+const { mergeConfig } = require('vite');
+
+module.exports = {
+    stories: ['../src/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
+    addons: ['@storybook/addon-essentials'],
+    viteFinal: async (config) => {
+        return mergeConfig(config, {
+            resolve: {
+                alias: {}
+            }
+        });
+    }
+};
+```
+
+After (ESM):
+
+```
+import { join } from 'path';
+import { mergeConfig } from 'vite';
+
+export default {
+    stories: ['../src/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
+    addons: ['@storybook/addon-essentials'],
+    viteFinal: async (config) => {
+        return mergeConfig(config, {
+            resolve: {
+                alias: {}
+            }
+        });
+    }
+};
+```
+
+## Important Notes
+
+- Preserve all comments in the original files
+- Maintain the same indentation and formatting style
+- For TypeScript files (.ts), ensure type imports use import type when appropriate
+- Test that the transformations don't break the Storybook configuration

package/src/migrations/update-22-1-0/migrate-to-storybook-10.d.ts

@@ -0,0 +1,3 @@
+import { Tree } from '@nx/devkit';
+export default function migrateToStorybook10(tree: Tree): Promise<string[]>;
+//# sourceMappingURL=migrate-to-storybook-10.d.ts.map

package/src/migrations/update-22-1-0/migrate-to-storybook-10.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"migrate-to-storybook-10.d.ts","sourceRoot":"","sources":["../../../../../../packages/storybook/src/migrations/update-22-1-0/migrate-to-storybook-10.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAOlC,wBAA8B,oBAAoB,CAAC,IAAI,EAAE,IAAI,qBA6B5D"}

package/src/migrations/update-22-1-0/migrate-to-storybook-10.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = migrateToStorybook10;
+const output_1 = require("nx/src/utils/output");
+const migrate_10_1 = require("../../generators/migrate-10/migrate-10");
+const path_1 = require("path");
+const fs_1 = require("fs");
+async function migrateToStorybook10(tree) {
+    output_1.output.log({
+        title: 'Migrating Storybook to v10',
+        bodyLines: [
+            `🚀 This migration will update your Storybook configuration to v10.`,
+            `It will call the @nx/storybook:migrate-10 generator for you.`,
+            `You can read more about the migration and how this generator works here:`,
+            `https://nx.dev/nx-api/storybook/generators/migrate-10`,
+        ],
+    });
+    await (0, migrate_10_1.default)(tree, {
+        autoAcceptAllPrompts: true,
+    });
+    const pathToAiInstructions = (0, path_1.join)(__dirname, 'files', 'ai-instructions-for-cjs-esm.md');
+    if (!(0, fs_1.existsSync)(pathToAiInstructions)) {
+        return;
+    }
+    const contents = (0, fs_1.readFileSync)(pathToAiInstructions);
+    tree.write('MIGRATE_STORYBOOK_10.md', contents);
+    return [
+        `Storybook 10 requires Storybook Configs to use ESM.`,
+        `We created 'MIGRATE_STORYBOOK_10.md' with instructions for an AI Agent to convert CJS Storybook Configs to ESM in your workspace.`,
+    ];
+}

package/src/utils/utilities.d.ts

@@ -11,8 +11,9 @@ export declare const Constants: {
     coreAddonPrefix: string;
     uiFrameworks7: string[];
 };
-export declare function storybookMajorVersion(): number | undefined;
-export declare function getInstalledStorybookVersion(): string | undefined;
+export declare function getStorybookVersionToInstall(tree: Tree): string;
+export declare function storybookMajorVersion(tree?: Tree): number | undefined;
+export declare function getInstalledStorybookVersion(tree?: Tree): string | undefined;
 export declare function safeFileDelete(tree: Tree, path: string): boolean;
 export type TsConfig = {
     extends: string;

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

@@ -1 +1 @@
-{"version":3,"file":"utilities.d.ts","sourceRoot":"","sources":["../../../../../packages/storybook/src/utils/utilities.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAG7C,OAAO,EAAE,GAAG,QAAQ,YAAY,CAAC,CAAC;AAIlC,eAAO,MAAM,SAAS;;;;;;;;;CA0BrB,CAAC;AAGF,wBAAgB,qBAAqB,IAAI,MAAM,GAAG,SAAS,CAU1D;AAED,wBAAgB,4BAA4B,IAAI,MAAM,GAAG,SAAS,CAUjE;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAOhE;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,eAAe,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CACtC,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,GAClB,IAAI,CAYN;AAED,wBAAgB,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,YAEnC;AAED,wBAAgB,uCAAuC,CAAC,OAAO,EAAE;IAC/D,CAAC,UAAU,EAAE,MAAM,GAAG,mBAAmB,CAAC;CAC3C,GAAG;IACF,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CA2EA;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CA4CjE;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,EAAE,CAAC,UAAU,CAcvE;AAED,wBAAgB,aAAa,IAAI,MAAM,CAQtC"}
+{"version":3,"file":"utilities.d.ts","sourceRoot":"","sources":["../../../../../packages/storybook/src/utils/utilities.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,mBAAmB,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAG7C,OAAO,EAAE,GAAG,QAAQ,YAAY,CAAC,CAAC;AAKlC,eAAO,MAAM,SAAS;;;;;;;;;CA0BrB,CAAC;AAGF,wBAAgB,4BAA4B,CAAC,IAAI,EAAE,IAAI,UAYtD;AAED,wBAAgB,qBAAqB,CAAC,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAwBrE;AAED,wBAAgB,4BAA4B,CAAC,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAsB5E;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAOhE;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,eAAe,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CACtC,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,GAClB,IAAI,CAYN;AAED,wBAAgB,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,YAEnC;AAED,wBAAgB,uCAAuC,CAAC,OAAO,EAAE;IAC/D,CAAC,UAAU,EAAE,MAAM,GAAG,mBAAmB,CAAC;CAC3C,GAAG;IACF,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CA2EA;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CA4CjE;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,EAAE,CAAC,UAAU,CAcvE;AAED,wBAAgB,aAAa,IAAI,MAAM,CAQtC"}

package/src/utils/utilities.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Constants = void 0;
+exports.getStorybookVersionToInstall = getStorybookVersionToInstall;
 exports.storybookMajorVersion = storybookMajorVersion;
 exports.getInstalledStorybookVersion = getInstalledStorybookVersion;
 exports.safeFileDelete = safeFileDelete;
@@ -10,11 +11,13 @@ exports.findStorybookAndBuildTargetsAndCompiler = findStorybookAndBuildTargetsAn
 exports.isTheFileAStory = isTheFileAStory;
 exports.getTsSourceFile = getTsSourceFile;
 exports.pleaseUpgrade = pleaseUpgrade;
+const devkit_1 = require("@nx/devkit");
 const fs_1 = require("fs");
 const js_1 = require("@nx/js");
 const ts = require("typescript");
 const semver_1 = require("semver");
 const path_1 = require("path");
+const versions_1 = require("./versions");
 exports.Constants = {
     addonDependencies: ['@storybook/addons'],
     tsConfigExclusions: ['stories', '**/*.stories.ts'],
@@ -42,7 +45,33 @@ exports.Constants = {
         '@storybook/web-components-vite',
     ],
 };
-function storybookMajorVersion() {
+function getStorybookVersionToInstall(tree) {
+    let storybookVersionToInstall = versions_1.storybookVersion;
+    const installedStorybookMajorVersion = storybookMajorVersion(tree);
+    const installedStorybookVersion = getInstalledStorybookVersion(tree);
+    if (installedStorybookMajorVersion >= 7 &&
+        installedStorybookVersion &&
+        (0, semver_1.gte)(installedStorybookVersion, '7.0.0')) {
+        storybookVersionToInstall = installedStorybookVersion;
+    }
+    return storybookVersionToInstall;
+}
+function storybookMajorVersion(tree) {
+    let foundStorybookPackageVersion;
+    if (tree) {
+        const rootPkgJson = (0, devkit_1.readJson)(tree, 'package.json');
+        foundStorybookPackageVersion =
+            rootPkgJson?.dependencies?.['storybook'] ||
+                rootPkgJson?.devDependencies?.['storybook'];
+    }
+    if (foundStorybookPackageVersion) {
+        try {
+            return (0, semver_1.major)(foundStorybookPackageVersion);
+        }
+        catch {
+            // unable to parse, fallback to requiring version from disk
+        }
+    }
     try {
         const storybookPackageVersion = require((0, path_1.join)('storybook', 'package.json')).version;
         return (0, semver_1.major)(storybookPackageVersion);
@@ -51,7 +80,18 @@ function storybookMajorVersion() {
         return undefined;
     }
 }
-function getInstalledStorybookVersion() {
+function getInstalledStorybookVersion(tree) {
+    let foundStorybookPackageVersion;
+    if (tree) {
+        const rootPkgJson = (0, devkit_1.readJson)(tree, 'package.json');
+        foundStorybookPackageVersion =
+            rootPkgJson?.dependencies?.['storybook'] ||
+                rootPkgJson?.devDependencies?.['storybook'];
+    }
+    if (foundStorybookPackageVersion) {
+        return foundStorybookPackageVersion;
+    }
+    // unable to find in root packageJson, fallback to requiring version from disk
     try {
         const storybookPackageVersion = require((0, path_1.join)('storybook', 'package.json')).version;
         return storybookPackageVersion;

package/src/utils/versions.d.ts

@@ -2,7 +2,7 @@ export declare const nxVersion: any;
 export declare const litVersion = "^2.6.1";
 export declare const tsNodeVersion = "10.9.1";
 export declare const tsLibVersion = "^2.3.0";
-export declare const storybookVersion = "^9.0.5";
+export declare const storybookVersion = "^10.0.0";
 export declare const reactVersion = "^18.2.0";
 export declare const viteVersion = "^6.0.0";
 export declare const coreJsVersion = "^3.36.1";

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

@@ -1 +1 @@
-{"version":3,"file":"versions.d.ts","sourceRoot":"","sources":["../../../../../packages/storybook/src/utils/versions.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,KAAwC,CAAC;AAC/D,eAAO,MAAM,UAAU,WAAW,CAAC;AACnC,eAAO,MAAM,aAAa,WAAW,CAAC;AACtC,eAAO,MAAM,YAAY,WAAW,CAAC;AAErC,eAAO,MAAM,gBAAgB,WAAW,CAAC;AACzC,eAAO,MAAM,YAAY,YAAY,CAAC;AACtC,eAAO,MAAM,WAAW,WAAW,CAAC;AAEpC,eAAO,MAAM,aAAa,YAAY,CAAC"}
+{"version":3,"file":"versions.d.ts","sourceRoot":"","sources":["../../../../../packages/storybook/src/utils/versions.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,KAAwC,CAAC;AAC/D,eAAO,MAAM,UAAU,WAAW,CAAC;AACnC,eAAO,MAAM,aAAa,WAAW,CAAC;AACtC,eAAO,MAAM,YAAY,WAAW,CAAC;AAErC,eAAO,MAAM,gBAAgB,YAAY,CAAC;AAC1C,eAAO,MAAM,YAAY,YAAY,CAAC;AACtC,eAAO,MAAM,WAAW,WAAW,CAAC;AAEpC,eAAO,MAAM,aAAa,YAAY,CAAC"}

package/src/utils/versions.js

@@ -5,7 +5,7 @@ exports.nxVersion = require('../../package.json').version;
 exports.litVersion = '^2.6.1';
 exports.tsNodeVersion = '10.9.1';
 exports.tsLibVersion = '^2.3.0';
-exports.storybookVersion = '^9.0.5';
+exports.storybookVersion = '^10.0.0';
 exports.reactVersion = '^18.2.0';
 exports.viteVersion = '^6.0.0';
 exports.coreJsVersion = '^3.36.1';