@storybook/nextjs 10.0.0-beta.0 → 10.0.0-beta.10

package/dist/node/index.js

@@ -1,17 +1,17 @@
-import CJS_COMPAT_NODE_URL_e3twfmexlgl from 'node:url';
-import CJS_COMPAT_NODE_PATH_e3twfmexlgl from 'node:path';
-import CJS_COMPAT_NODE_MODULE_e3twfmexlgl from "node:module";
+import CJS_COMPAT_NODE_URL_ccrtjqfxrkc from 'node:url';
+import CJS_COMPAT_NODE_PATH_ccrtjqfxrkc from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ccrtjqfxrkc from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_e3twfmexlgl.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_e3twfmexlgl.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_e3twfmexlgl.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_ccrtjqfxrkc.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ccrtjqfxrkc.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ccrtjqfxrkc.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   __name
-} from "../_node-chunks/chunk-WCSGFZKZ.js";
+} from "../_node-chunks/chunk-36CC7SQ7.js";
 
 // src/node/index.ts
 function defineMain(config) {

package/dist/preset.js

@@ -1,22 +1,23 @@
-import CJS_COMPAT_NODE_URL_e3twfmexlgl from 'node:url';
-import CJS_COMPAT_NODE_PATH_e3twfmexlgl from 'node:path';
-import CJS_COMPAT_NODE_MODULE_e3twfmexlgl from "node:module";
+import CJS_COMPAT_NODE_URL_ccrtjqfxrkc from 'node:url';
+import CJS_COMPAT_NODE_PATH_ccrtjqfxrkc from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ccrtjqfxrkc from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_e3twfmexlgl.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_e3twfmexlgl.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_e3twfmexlgl.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_ccrtjqfxrkc.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ccrtjqfxrkc.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ccrtjqfxrkc.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   addScopedAlias,
+  getNextjsVersion,
   resolveNextConfig
-} from "./_node-chunks/chunk-EZEBG77A.js";
-import "./_node-chunks/chunk-YMVPQWBH.js";
+} from "./_node-chunks/chunk-3GULY6EP.js";
+import "./_node-chunks/chunk-4S33U2ZV.js";
 import {
   __name
-} from "./_node-chunks/chunk-WCSGFZKZ.js";
+} from "./_node-chunks/chunk-36CC7SQ7.js";
 
 // src/preset.ts
 import { existsSync } from "node:fs";
@@ -25,7 +26,7 @@ import { fileURLToPath as fileURLToPath2 } from "node:url";
 import { getProjectRoot } from "storybook/internal/common";
 import { logger } from "storybook/internal/node-logger";
 import { loadPartialConfig } from "@babel/core";
-import semver from "semver";
+import semver2 from "semver";
 
 // src/babel/preset.ts
 import { createRequire } from "node:module";
@@ -456,6 +457,9 @@ var preset_default = /* @__PURE__ */ __name((api, options = {}) => {
 
 // src/config/webpack.ts
 import { fileURLToPath } from "node:url";
+import semver from "semver";
+var nextjsVersion = getNextjsVersion();
+var isNext16orNewer = semver.gte(nextjsVersion, "16.0.0");
 var tryResolve = /* @__PURE__ */ __name((path) => {
   try {
     return fileURLToPath(import.meta.resolve(path)) || false;
@@ -468,7 +472,9 @@ var configureConfig = /* @__PURE__ */ __name(async ({
   nextConfigPath
 }) => {
   const nextConfig = await resolveNextConfig({ nextConfigPath });
-  addScopedAlias(baseConfig, "next/config");
+  if (!isNext16orNewer) {
+    addScopedAlias(baseConfig, "next/config");
+  }
   if (baseConfig.resolve?.alias?.["react-dom"]) {
     delete baseConfig.resolve.alias?.["react-dom"];
   }
@@ -491,14 +497,13 @@ var configureConfig = /* @__PURE__ */ __name(async ({
   return nextConfig;
 }, "configureConfig");
 var setupRuntimeConfig = /* @__PURE__ */ __name(async (baseConfig, nextConfig) => {
-  const definePluginConfig = {
-    // this mimics what nextjs does client side
-    // https://github.com/vercel/next.js/blob/57702cb2a9a9dba4b552e0007c16449cf36cfb44/packages/next/client/index.tsx#L101
-    "process.env.__NEXT_RUNTIME_CONFIG": JSON.stringify({
+  const definePluginConfig = {};
+  if (!isNext16orNewer) {
+    definePluginConfig["process.env.__NEXT_RUNTIME_CONFIG"] = JSON.stringify({
       serverRuntimeConfig: {},
       publicRuntimeConfig: nextConfig.publicRuntimeConfig
-    })
-  };
+    });
+  }
   const newNextLinkBehavior = nextConfig.experimental?.newNextLinkBehavior;
   definePluginConfig["process.env.__NEXT_NEW_LINK_BEHAVIOR"] = newNextLinkBehavior;
   baseConfig.plugins?.push(new (await import("webpack")).default.DefinePlugin(definePluginConfig));
@@ -713,8 +718,13 @@ var core = /* @__PURE__ */ __name(async (config, options) => {
   };
 }, "core");
 var previewAnnotations = /* @__PURE__ */ __name((entry = []) => {
-  const result = [...entry, fileURLToPath2(import.meta.resolve("@storybook/nextjs/preview"))];
-  return result;
+  const annotations = [...entry, fileURLToPath2(import.meta.resolve("@storybook/nextjs/preview"))];
+  const nextjsVersion2 = getNextjsVersion();
+  const isNext16orNewer2 = semver2.gte(nextjsVersion2, "16.0.0");
+  if (!isNext16orNewer2) {
+    annotations.push(fileURLToPath2(import.meta.resolve("@storybook/nextjs/config/preview")));
+  }
+  return annotations;
 }, "previewAnnotations");
 var babel = /* @__PURE__ */ __name(async (baseConfig) => {
   const configPartial = loadPartialConfig({
@@ -779,24 +789,24 @@ var webpackFinal = /* @__PURE__ */ __name(async (baseConfig, options) => {
     baseConfig,
     nextConfigPath
   });
-  const { configureNextFont } = await import("./_node-chunks/configureNextFont-HBRWHAUG.js");
-  const { configureRuntimeNextjsVersionResolution, getNextjsVersion } = await import("./_node-chunks/utils-4LRBHVQD.js");
-  const { configureImports } = await import("./_node-chunks/webpack-6HAXGE7X.js");
-  const { configureCss } = await import("./_node-chunks/webpack-SWQY6JJY.js");
-  const { configureImages } = await import("./_node-chunks/webpack-AGNCA7HZ.js");
-  const { configureStyledJsx } = await import("./_node-chunks/webpack-EWT6TRQB.js");
-  const { configureNodePolyfills } = await import("./_node-chunks/webpack-CXSD35E6.js");
-  const { configureAliases } = await import("./_node-chunks/webpack-PD7PIB6X.js");
-  const { configureFastRefresh } = await import("./_node-chunks/webpack-K2R3GUFU.js");
-  const { configureRSC } = await import("./_node-chunks/webpack-QFTZE3CE.js");
-  const { configureSWCLoader } = await import("./_node-chunks/loader-Z4IXWF5M.js");
-  const { configureBabelLoader } = await import("./_node-chunks/loader-KXTZ5PJ5.js");
+  const { configureNextFont } = await import("./_node-chunks/configureNextFont-TR6FXSGG.js");
+  const { configureRuntimeNextjsVersionResolution, getNextjsVersion: getNextjsVersion2 } = await import("./_node-chunks/utils-VATWGGB7.js");
+  const { configureImports } = await import("./_node-chunks/webpack-5MBM2JQ5.js");
+  const { configureCss } = await import("./_node-chunks/webpack-MFR56R4E.js");
+  const { configureImages } = await import("./_node-chunks/webpack-SSDUEAPT.js");
+  const { configureStyledJsx } = await import("./_node-chunks/webpack-VFMODTJY.js");
+  const { configureNodePolyfills } = await import("./_node-chunks/webpack-GNWQXRPK.js");
+  const { configureAliases } = await import("./_node-chunks/webpack-KBFNFK3Q.js");
+  const { configureFastRefresh } = await import("./_node-chunks/webpack-UIT3HSQ4.js");
+  const { configureRSC } = await import("./_node-chunks/webpack-7ATFWREA.js");
+  const { configureSWCLoader } = await import("./_node-chunks/loader-DAH237CQ.js");
+  const { configureBabelLoader } = await import("./_node-chunks/loader-EDIU27IE.js");
   const babelRCPath = join(getProjectRoot(), ".babelrc");
   const babelConfigPath = join(getProjectRoot(), "babel.config.js");
   const hasBabelConfig = existsSync(babelRCPath) || existsSync(babelConfigPath);
-  const nextjsVersion = getNextjsVersion();
+  const nextjsVersion2 = getNextjsVersion2();
   const isDevelopment = options.configType !== "PRODUCTION";
-  const isNext14orNewer = semver.gte(nextjsVersion, "14.0.0");
+  const isNext14orNewer = semver2.gte(nextjsVersion2, "14.0.0");
   const useSWC = isNext14orNewer && (nextConfig.experimental?.forceSwcTransforms || !hasBabelConfig);
   configureNextFont(baseConfig, useSWC);
   configureRuntimeNextjsVersionResolution(baseConfig);

package/dist/preview.d.ts

@@ -1,3 +1,18 @@
-// auto generated file from file:///home/runner/work/storybook/storybook/scripts/build/utils/generate-type-mappers.ts, do not edit
-export * from '../src/preview.tsx';
-export type * from '../src/preview.tsx';
+import { Addon_DecoratorFunction, Addon_LoaderFunction } from 'storybook/internal/types';
+
+declare const decorators: Addon_DecoratorFunction<any>[];
+declare const loaders: Addon_LoaderFunction;
+declare const parameters: {
+    docs: {
+        source: {
+            excludeDecorators: boolean;
+        };
+    };
+    react: {
+        rootOptions: {
+            onCaughtError(error: unknown): void;
+        };
+    };
+};
+
+export { decorators, loaders, parameters };

package/dist/preview.js

@@ -2,7 +2,7 @@ import {
   decorators,
   loaders,
   parameters
-} from "./_browser-chunks/chunk-JOMP7DUK.js";
+} from "./_browser-chunks/chunk-KX5HHFXV.js";
 import "./_browser-chunks/chunk-L5NVL7MD.js";
 export {
   decorators,

package/dist/swc/next-swc-loader-patch.js

@@ -1,17 +1,17 @@
-import CJS_COMPAT_NODE_URL_e3twfmexlgl from 'node:url';
-import CJS_COMPAT_NODE_PATH_e3twfmexlgl from 'node:path';
-import CJS_COMPAT_NODE_MODULE_e3twfmexlgl from "node:module";
+import CJS_COMPAT_NODE_URL_ccrtjqfxrkc from 'node:url';
+import CJS_COMPAT_NODE_PATH_ccrtjqfxrkc from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ccrtjqfxrkc from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_e3twfmexlgl.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_e3twfmexlgl.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_e3twfmexlgl.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_ccrtjqfxrkc.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ccrtjqfxrkc.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ccrtjqfxrkc.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   __name
-} from "../_node-chunks/chunk-WCSGFZKZ.js";
+} from "../_node-chunks/chunk-36CC7SQ7.js";
 
 // src/swc/next-swc-loader-patch.ts
 import { isAbsolute, relative } from "node:path";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/nextjs",
-  "version": "10.0.0-beta.0",
+  "version": "10.0.0-beta.10",
   "description": "Storybook for Next.js: Develop, document, and test UI components in isolation",
   "keywords": [
     "storybook",
@@ -35,6 +35,7 @@
       "default": "./dist/export-mocks/cache/index.js"
     },
     "./compatibility/draft-mode.compat": "./dist/compatibility/draft-mode.compat.js",
+    "./config/preview": "./dist/config/preview.js",
     "./export-mocks": "./dist/export-mocks/index.js",
     "./headers.mock": {
       "types": "./dist/export-mocks/headers/index.d.ts",
@@ -93,9 +94,9 @@
     "@babel/preset-typescript": "^7.24.1",
     "@babel/runtime": "^7.24.4",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.11",
-    "@storybook/builder-webpack5": "10.0.0-beta.0",
-    "@storybook/preset-react-webpack": "10.0.0-beta.0",
-    "@storybook/react": "10.0.0-beta.0",
+    "@storybook/builder-webpack5": "10.0.0-beta.10",
+    "@storybook/preset-react-webpack": "10.0.0-beta.10",
+    "@storybook/react": "10.0.0-beta.10",
     "@types/semver": "^7.3.4",
     "babel-loader": "^9.1.3",
     "css-loader": "^6.7.3",
@@ -129,7 +130,7 @@
     "next": "^14.1.0 || ^15.0.0",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-    "storybook": "^10.0.0-beta.0",
+    "storybook": "^10.0.0-beta.10",
     "webpack": "^5.0.0"
   },
   "peerDependenciesMeta": {

package/template/cli/js/Button.stories.js

@@ -16,7 +16,7 @@ export default {
   argTypes: {
     backgroundColor: { control: 'color' },
   },
-  // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#action-args
+  // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#story-args
   args: { onClick: fn() },
 };
 

package/template/cli/ts/Button.stories.ts

@@ -18,7 +18,7 @@ const meta = {
   argTypes: {
     backgroundColor: { control: 'color' },
   },
-  // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#action-args
+  // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#story-args
   args: { onClick: fn() },
 } satisfies Meta<typeof Button>;
 

package/dist/_node-chunks/chunk-YMVPQWBH.js

@@ -1,167 +0,0 @@
-import CJS_COMPAT_NODE_URL_e3twfmexlgl from 'node:url';
-import CJS_COMPAT_NODE_PATH_e3twfmexlgl from 'node:path';
-import CJS_COMPAT_NODE_MODULE_e3twfmexlgl from "node:module";
-
-var __filename = CJS_COMPAT_NODE_URL_e3twfmexlgl.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_e3twfmexlgl.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_e3twfmexlgl.createRequire(import.meta.url);
-
-// ------------------------------------------------------------
-// end of CJS compatibility banner, injected by Storybook's esbuild configuration
-// ------------------------------------------------------------
-import {
-  __name
-} from "./chunk-WCSGFZKZ.js";
-
-// ../../core/src/shared/utils/module.ts
-import { fileURLToPath, pathToFileURL } from "node:url";
-
-// ../../node_modules/pathe/dist/shared/pathe.ff20891b.mjs
-var _DRIVE_LETTER_START_RE = /^[A-Za-z]:\//;
-function normalizeWindowsPath(input = "") {
-  if (!input) {
-    return input;
-  }
-  return input.replace(/\\/g, "/").replace(_DRIVE_LETTER_START_RE, (r) => r.toUpperCase());
-}
-__name(normalizeWindowsPath, "normalizeWindowsPath");
-var _UNC_REGEX = /^[/\\]{2}/;
-var _IS_ABSOLUTE_RE = /^[/\\](?![/\\])|^[/\\]{2}(?!\.)|^[A-Za-z]:[/\\]/;
-var _DRIVE_LETTER_RE = /^[A-Za-z]:$/;
-var normalize = /* @__PURE__ */ __name(function(path2) {
-  if (path2.length === 0) {
-    return ".";
-  }
-  path2 = normalizeWindowsPath(path2);
-  const isUNCPath = path2.match(_UNC_REGEX);
-  const isPathAbsolute = isAbsolute(path2);
-  const trailingSeparator = path2[path2.length - 1] === "/";
-  path2 = normalizeString(path2, !isPathAbsolute);
-  if (path2.length === 0) {
-    if (isPathAbsolute) {
-      return "/";
-    }
-    return trailingSeparator ? "./" : ".";
-  }
-  if (trailingSeparator) {
-    path2 += "/";
-  }
-  if (_DRIVE_LETTER_RE.test(path2)) {
-    path2 += "/";
-  }
-  if (isUNCPath) {
-    if (!isPathAbsolute) {
-      return `//./${path2}`;
-    }
-    return `//${path2}`;
-  }
-  return isPathAbsolute && !isAbsolute(path2) ? `/${path2}` : path2;
-}, "normalize");
-var join = /* @__PURE__ */ __name(function(...arguments_) {
-  if (arguments_.length === 0) {
-    return ".";
-  }
-  let joined;
-  for (const argument of arguments_) {
-    if (argument && argument.length > 0) {
-      if (joined === void 0) {
-        joined = argument;
-      } else {
-        joined += `/${argument}`;
-      }
-    }
-  }
-  if (joined === void 0) {
-    return ".";
-  }
-  return normalize(joined.replace(/\/\/+/g, "/"));
-}, "join");
-function normalizeString(path2, allowAboveRoot) {
-  let res = "";
-  let lastSegmentLength = 0;
-  let lastSlash = -1;
-  let dots = 0;
-  let char = null;
-  for (let index = 0; index <= path2.length; ++index) {
-    if (index < path2.length) {
-      char = path2[index];
-    } else if (char === "/") {
-      break;
-    } else {
-      char = "/";
-    }
-    if (char === "/") {
-      if (lastSlash === index - 1 || dots === 1) ;
-      else if (dots === 2) {
-        if (res.length < 2 || lastSegmentLength !== 2 || res[res.length - 1] !== "." || res[res.length - 2] !== ".") {
-          if (res.length > 2) {
-            const lastSlashIndex = res.lastIndexOf("/");
-            if (lastSlashIndex === -1) {
-              res = "";
-              lastSegmentLength = 0;
-            } else {
-              res = res.slice(0, lastSlashIndex);
-              lastSegmentLength = res.length - 1 - res.lastIndexOf("/");
-            }
-            lastSlash = index;
-            dots = 0;
-            continue;
-          } else if (res.length > 0) {
-            res = "";
-            lastSegmentLength = 0;
-            lastSlash = index;
-            dots = 0;
-            continue;
-          }
-        }
-        if (allowAboveRoot) {
-          res += res.length > 0 ? "/.." : "..";
-          lastSegmentLength = 2;
-        }
-      } else {
-        if (res.length > 0) {
-          res += `/${path2.slice(lastSlash + 1, index)}`;
-        } else {
-          res = path2.slice(lastSlash + 1, index);
-        }
-        lastSegmentLength = index - lastSlash - 1;
-      }
-      lastSlash = index;
-      dots = 0;
-    } else if (char === "." && dots !== -1) {
-      ++dots;
-    } else {
-      dots = -1;
-    }
-  }
-  return res;
-}
-__name(normalizeString, "normalizeString");
-var isAbsolute = /* @__PURE__ */ __name(function(p) {
-  return _IS_ABSOLUTE_RE.test(p);
-}, "isAbsolute");
-var dirname = /* @__PURE__ */ __name(function(p) {
-  const segments = normalizeWindowsPath(p).replace(/\/$/, "").split("/").slice(0, -1);
-  if (segments.length === 1 && _DRIVE_LETTER_RE.test(segments[0])) {
-    segments[0] += "/";
-  }
-  return segments.join("/") || (isAbsolute(p) ? "/" : ".");
-}, "dirname");
-
-// ../../core/src/shared/utils/module.ts
-var importMetaResolve = /* @__PURE__ */ __name((...args) => {
-  if (typeof import.meta.resolve !== "function" && process.env.VITEST === "true") {
-    console.warn(
-      "importMetaResolve from within Storybook is being used in a Vitest test, but it shouldn't be. Please report this at https://github.com/storybookjs/storybook/issues/new?template=bug_report.yml"
-    );
-    return pathToFileURL(args[0]).href;
-  }
-  return import.meta.resolve(...args);
-}, "importMetaResolve");
-var resolvePackageDir = /* @__PURE__ */ __name((pkg, parent) => {
-  return dirname(fileURLToPath(importMetaResolve(join(pkg, "package.json"), parent)));
-}, "resolvePackageDir");
-
-export {
-  resolvePackageDir
-};

package/dist/preview.d.tsx

@@ -1,18 +0,0 @@
-import { Addon_DecoratorFunction, Addon_LoaderFunction } from 'storybook/internal/types';
-
-declare const decorators: Addon_DecoratorFunction<any>[];
-declare const loaders: Addon_LoaderFunction;
-declare const parameters: {
-    docs: {
-        source: {
-            excludeDecorators: boolean;
-        };
-    };
-    react: {
-        rootOptions: {
-            onCaughtError(error: unknown): void;
-        };
-    };
-};
-
-export { decorators, loaders, parameters };