@storybook/react 10.3.0-alpha.1 → 10.3.0-alpha.10

package/dist/preset.js

@@ -1,19 +1,42 @@
-import CJS_COMPAT_NODE_URL_e6zxtcry2es from 'node:url';
-import CJS_COMPAT_NODE_PATH_e6zxtcry2es from 'node:path';
-import CJS_COMPAT_NODE_MODULE_e6zxtcry2es from "node:module";
+import CJS_COMPAT_NODE_URL_l0oslscxdg9 from 'node:url';
+import CJS_COMPAT_NODE_PATH_l0oslscxdg9 from 'node:path';
+import CJS_COMPAT_NODE_MODULE_l0oslscxdg9 from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_e6zxtcry2es.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_e6zxtcry2es.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_e6zxtcry2es.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_l0oslscxdg9.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_l0oslscxdg9.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_l0oslscxdg9.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
-import {
-  __commonJS,
-  __require,
-  __toESM
-} from "./_node-chunks/chunk-HJSZYG4F.js";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __require = /* @__PURE__ */ ((x) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(x, {
+  get: (a, b) => (typeof require < "u" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require < "u") return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+var __commonJS = (cb, mod) => function() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
+  mod
+));
 
 // ../../../node_modules/estraverse/estraverse.js
 var require_estraverse = __commonJS({
@@ -3129,8 +3152,8 @@ var require_acorn = __commonJS({
       }, Parser2.parse = function(input, options) {
         return new this(options, input).parse();
       }, Parser2.parseExpressionAt = function(input, pos, options) {
-        var parser = new this(options, input, pos);
-        return parser.nextToken(), parser.parseExpression();
+        var parser2 = new this(options, input, pos);
+        return parser2.nextToken(), parser2.parseExpression();
       }, Parser2.tokenizer = function(input, options) {
         return new this(options, input);
       }, Object.defineProperties(Parser2.prototype, prototypeAccessors);
@@ -4097,8 +4120,8 @@ var require_acorn = __commonJS({
             return scope;
         }
       };
-      var Node = function(parser, pos, loc) {
-        this.type = "", this.start = pos, this.end = 0, parser.options.locations && (this.loc = new SourceLocation(parser, loc)), parser.options.directSourceFile && (this.sourceFile = parser.options.directSourceFile), parser.options.ranges && (this.range = [pos, 0]);
+      var Node = function(parser2, pos, loc) {
+        this.type = "", this.start = pos, this.end = 0, parser2.options.locations && (this.loc = new SourceLocation(parser2, loc)), parser2.options.directSourceFile && (this.sourceFile = parser2.options.directSourceFile), parser2.options.ranges && (this.range = [pos, 0]);
       }, pp$6 = Parser2.prototype;
       pp$6.startNode = function() {
         return new Node(this, this.start, this.startLoc);
@@ -4193,8 +4216,8 @@ var require_acorn = __commonJS({
         d.nonBinary.Script_Extensions = d.nonBinary.Script, d.nonBinary.gc = d.nonBinary.General_Category, d.nonBinary.sc = d.nonBinary.Script, d.nonBinary.scx = d.nonBinary.Script_Extensions;
       }
       buildUnicodeData(9), buildUnicodeData(10), buildUnicodeData(11);
-      var pp$8 = Parser2.prototype, RegExpValidationState = function(parser) {
-        this.parser = parser, this.validFlags = "gim" + (parser.options.ecmaVersion >= 6 ? "uy" : "") + (parser.options.ecmaVersion >= 9 ? "s" : ""), this.unicodeProperties = data[parser.options.ecmaVersion >= 11 ? 11 : parser.options.ecmaVersion], this.source = "", this.flags = "", this.start = 0, this.switchU = !1, this.switchN = !1, this.pos = 0, this.lastIntValue = 0, this.lastStringValue = "", this.lastAssertionIsQuantifiable = !1, this.numCapturingParens = 0, this.maxBackReference = 0, this.groupNames = [], this.backReferenceNames = [];
+      var pp$8 = Parser2.prototype, RegExpValidationState = function(parser2) {
+        this.parser = parser2, this.validFlags = "gim" + (parser2.options.ecmaVersion >= 6 ? "uy" : "") + (parser2.options.ecmaVersion >= 9 ? "s" : ""), this.unicodeProperties = data[parser2.options.ecmaVersion >= 11 ? 11 : parser2.options.ecmaVersion], this.source = "", this.flags = "", this.start = 0, this.switchU = !1, this.switchN = !1, this.pos = 0, this.lastIntValue = 0, this.lastStringValue = "", this.lastAssertionIsQuantifiable = !1, this.numCapturingParens = 0, this.maxBackReference = 0, this.groupNames = [], this.backReferenceNames = [];
       };
       RegExpValidationState.prototype.reset = function(start, pattern, flags) {
         var unicode = flags.indexOf("u") !== -1;
@@ -10432,42 +10455,12 @@ var extractArgTypes = (component) => {
 };
 
 // src/componentManifest/reactDocgen.ts
+var import_ts_dedent2 = __toESM(require_dist(), 1), TsconfigPaths = __toESM(require_lib2(), 1);
 import { existsSync as existsSync2 } from "node:fs";
 import { dirname as dirname3, sep as sep2 } from "node:path";
 import { babelParse, types as t } from "storybook/internal/babel";
-import { getProjectRoot, supportedExtensions as supportedExtensions2 } from "storybook/internal/common";
+import { supportedExtensions as supportedExtensions2 } from "storybook/internal/common";
 import { logger as logger2 } from "storybook/internal/node-logger";
-
-// ../../../node_modules/empathic/find.mjs
-import { join as join3 } from "node:path";
-import { existsSync, statSync } from "node:fs";
-
-// ../../../node_modules/empathic/walk.mjs
-import { dirname as dirname2 } from "node:path";
-
-// ../../../node_modules/empathic/resolve.mjs
-import { isAbsolute as isAbsolute2, join as join2, resolve as resolve2 } from "node:path";
-function absolute(input, root) {
-  return isAbsolute2(input) ? input : resolve2(root || ".", input);
-}
-
-// ../../../node_modules/empathic/walk.mjs
-function up(base2, options) {
-  let { last: last2, cwd: cwd2 } = options || {}, tmp = absolute(base2, cwd2), root = absolute(last2 || "/", cwd2), prev, arr = [];
-  for (; prev !== root && (arr.push(tmp), tmp = dirname2(prev = tmp), tmp !== prev); )
-    ;
-  return arr;
-}
-
-// ../../../node_modules/empathic/find.mjs
-function up2(name, options) {
-  let dir, tmp, start = options && options.cwd || "";
-  for (dir of up(start, options))
-    if (tmp = join3(dir, name), existsSync(tmp)) return tmp;
-}
-
-// src/componentManifest/reactDocgen.ts
-var import_ts_dedent2 = __toESM(require_dist(), 1), TsconfigPaths = __toESM(require_lib2(), 1);
 import {
   builtinHandlers as docgenHandlers,
   builtinResolvers as docgenResolver,
@@ -10698,11 +10691,11 @@ function getParser4({ startLine = 0, fence = "```", spacing = "compact", markers
 }
 
 // ../../../node_modules/comment-parser/es6/stringifier/index.js
-function join4(tokens) {
+function join2(tokens) {
   return tokens.start + tokens.delimiter + tokens.postDelimiter + tokens.tag + tokens.postTag + tokens.type + tokens.postType + tokens.name + tokens.postName + tokens.description + tokens.end + tokens.lineEnd;
 }
 function getStringifier() {
-  return (block) => block.source.map(({ tokens }) => join4(tokens)).join(`
+  return (block) => block.source.map(({ tokens }) => join2(tokens)).join(`
 `);
 }
 
@@ -10732,8 +10725,38 @@ var stringify = getStringifier();
 
 // src/componentManifest/utils.ts
 import { readFileSync } from "node:fs";
-import { resolveImport } from "storybook/internal/common";
+import { getProjectRoot, resolveImport } from "storybook/internal/common";
 import { logger } from "storybook/internal/node-logger";
+
+// ../../../node_modules/empathic/find.mjs
+import { join as join4 } from "node:path";
+import { existsSync, statSync } from "node:fs";
+
+// ../../../node_modules/empathic/walk.mjs
+import { dirname as dirname2 } from "node:path";
+
+// ../../../node_modules/empathic/resolve.mjs
+import { isAbsolute as isAbsolute2, join as join3, resolve as resolve2 } from "node:path";
+function absolute(input, root) {
+  return isAbsolute2(input) ? input : resolve2(root || ".", input);
+}
+
+// ../../../node_modules/empathic/walk.mjs
+function up(base2, options) {
+  let { last: last2, cwd: cwd2 } = options || {}, tmp = absolute(base2, cwd2), root = absolute(last2 || "/", cwd2), prev, arr = [];
+  for (; prev !== root && (arr.push(tmp), tmp = dirname2(prev = tmp), tmp !== prev); )
+    ;
+  return arr;
+}
+
+// ../../../node_modules/empathic/find.mjs
+function up2(name, options) {
+  let dir, tmp, start = options && options.cwd || "";
+  for (dir of up(start, options))
+    if (tmp = join4(dir, name), existsSync(tmp)) return tmp;
+}
+
+// src/componentManifest/utils.ts
 var groupBy = (items, keySelector) => items.reduce((acc = {}, item, index) => {
   let key = keySelector(item, index);
   return Array.isArray(acc[key]) || (acc[key] = []), acc[key].push(item), acc;
@@ -10759,7 +10782,10 @@ var memoStore = /* @__PURE__ */ new WeakMap(), cached = (fn, opts = {}) => {
   };
 }, invalidateCache = () => {
   memoStore = /* @__PURE__ */ new WeakMap();
-}, cachedReadFileSync = cached(readFileSync, { name: "cachedReadFile" }), cachedFindUp = cached(up2, { name: "findUp" }), cachedResolveImport = cached(resolveImport, { name: "resolveImport" });
+}, cachedReadFileSync = cached(readFileSync, { name: "cachedReadFile" }), cachedFindUp = cached(up2, { name: "findUp" }), cachedResolveImport = cached(resolveImport, { name: "resolveImport" }), findTsconfigPath = cached(
+  (cwd2) => up2("tsconfig.json", { cwd: cwd2, last: getProjectRoot() }),
+  { name: "findTsconfigPath" }
+);
 
 // src/componentManifest/jsdocTags.ts
 function extractJSDocInfo(jsdocComment) {
@@ -10945,7 +10971,7 @@ function matchPath(id, basedir) {
 }
 var getTsConfig = cached(
   (cwd2) => {
-    let tsconfigPath = up2("tsconfig.json", { cwd: cwd2, last: getProjectRoot() });
+    let tsconfigPath = findTsconfigPath(cwd2);
     return TsconfigPaths.loadConfig(tsconfigPath);
   },
   { name: "getTsConfig" }
@@ -11176,11 +11202,11 @@ var REACT_NODE_TYPES = /* @__PURE__ */ new Set([
 ]);
 var getTsConfig2 = async () => {
   try {
-    let ts = await import("typescript"), tsconfigPath = ts.findConfigFile(process.cwd(), ts.sys.fileExists);
+    let ts2 = await import("typescript"), tsconfigPath = ts2.findConfigFile(process.cwd(), ts2.sys.fileExists);
     if (console.log({ tsconfigPath }), tsconfigPath === void 0)
       return {};
-    let basePath = dirname4(tsconfigPath), { config, error } = ts.readConfigFile(tsconfigPath, ts.sys.readFile);
-    return error ? {} : ts.parseJsonConfigFileContent(config, ts.sys, basePath, {}, tsconfigPath).options;
+    let basePath = dirname4(tsconfigPath), { config, error } = ts2.readConfigFile(tsconfigPath, ts2.sys.readFile);
+    return error ? {} : ts2.parseJsonConfigFileContent(config, ts2.sys, basePath, {}, tsconfigPath).options;
   } catch {
     return {};
   }
@@ -11193,7 +11219,7 @@ var extractArgTypesFromDocgenTypescript = async ({
   reactDocgenTypescriptOptions
 }) => {
   try {
-    let { withCompilerOptions } = (await import("./_node-chunks/lib-T3P6OPTA.js")).default, defaultOptions = {
+    let { withCompilerOptions: withCompilerOptions2 } = (await import("react-docgen-typescript")).default, defaultOptions = {
       shouldExtractLiteralValuesFromEnum: !0,
       shouldRemoveUndefinedFromOptional: !0,
       propFilter: (prop) => prop.parent ? !/node_modules/.test(prop.parent.fileName) : !0,
@@ -11204,7 +11230,7 @@ var extractArgTypesFromDocgenTypescript = async ({
       ...reactDocgenTypescriptOptions,
       // Always ensure savePropValueAsString is true for consistency
       savePropValueAsString: !0
-    }, docgens = withCompilerOptions(
+    }, docgens = withCompilerOptions2(
       { ...tsConfig, noErrorTruncation: !0, strict: !0 },
       mergedOptions
     ).parse(componentFilePath);
@@ -11231,8 +11257,8 @@ var extractArgTypesFromDocgenTypescript = async ({
 // src/componentManifest/generator.ts
 import { recast as recast2 } from "storybook/internal/babel";
 import { Tag } from "storybook/internal/core-server";
+import { storyNameFromExport } from "storybook/internal/csf";
 import { extractDescription, loadCsf } from "storybook/internal/csf-tools";
-import { logger as logger6 } from "storybook/internal/node-logger";
 
 // ../../../node_modules/es-toolkit/dist/array/uniqBy.mjs
 function uniqBy(arr, mapper) {
@@ -11515,16 +11541,135 @@ function pathForNode(program, target) {
 }
 
 // src/componentManifest/getComponentImports.ts
-import { dirname as dirname5 } from "node:path";
+import { dirname as dirname6 } from "node:path";
 import { babelParse as babelParse2, recast, types as t3 } from "storybook/internal/babel";
 import { logger as logger5 } from "storybook/internal/node-logger";
+
+// src/componentManifest/reactDocgenTypescript.ts
+import { dirname as dirname5 } from "node:path";
+import {
+  withCompilerOptions
+} from "react-docgen-typescript";
+import ts from "typescript";
+var LARGE_NON_USER_SOURCE_THRESHOLD = 30, getPropSource = (prop) => prop.parent?.fileName ?? prop.declarations?.[0]?.fileName, getLargeNonUserPropSources = (props) => {
+  let countBySource = /* @__PURE__ */ new Map();
+  for (let prop of Object.values(props)) {
+    let source = getPropSource(prop);
+    (source?.includes("node_modules") || source?.endsWith(".d.ts")) && countBySource.set(source, (countBySource.get(source) ?? 0) + 1);
+  }
+  let largeNonUserSources = /* @__PURE__ */ new Set();
+  for (let [source, count] of countBySource)
+    count > LARGE_NON_USER_SOURCE_THRESHOLD && largeNonUserSources.add(source);
+  return largeNonUserSources;
+};
+function findDisplayNameAssignment(sourceFile, identifierName) {
+  for (let statement of sourceFile.statements) {
+    if (!ts.isExpressionStatement(statement))
+      continue;
+    let expr = statement.expression;
+    if (ts.isBinaryExpression(expr) && expr.operatorToken.kind === ts.SyntaxKind.EqualsToken && ts.isPropertyAccessExpression(expr.left) && expr.left.name.text === "displayName" && ts.isIdentifier(expr.left.expression) && expr.left.expression.text === identifierName && ts.isStringLiteral(expr.right))
+      return expr.right.text;
+  }
+}
+function getExportNameMap(checker, sourceFile) {
+  let moduleSymbol = checker.getSymbolAtLocation(sourceFile);
+  if (!moduleSymbol)
+    return /* @__PURE__ */ new Map();
+  let result = /* @__PURE__ */ new Map(), fileName = sourceFile.fileName.replace(/.*\//, "").replace(/\.[^.]+$/, "");
+  for (let exportSymbol of checker.getExportsOfModule(moduleSymbol)) {
+    let resolved = exportSymbol.flags & ts.SymbolFlags.Alias ? checker.getAliasedSymbol(exportSymbol) : exportSymbol, declaration = resolved.valueDeclaration ?? resolved.getDeclarations()?.[0];
+    if (!declaration)
+      continue;
+    let type = checker.getTypeOfSymbolAtLocation(resolved, declaration), isStateless = type.getCallSignatures().some((sig) => {
+      let params = sig.getParameters();
+      return params.length === 1 || params.length > 0 && params[0].getName() === "props";
+    }), isStateful = type.getConstructSignatures().some(
+      (sig) => sig.getReturnType().getProperty("props") !== void 0
+    );
+    if (isStateless || isStateful) {
+      let exportName = exportSymbol.getName(), resolvedName = resolved.getName();
+      result.set(resolvedName, exportName), exportName === "default" && result.set(fileName, "default");
+      let displayNameValue = findDisplayNameAssignment(sourceFile, resolvedName);
+      displayNameValue && result.set(displayNameValue, exportName);
+    }
+  }
+  return result;
+}
+var cachedCompilerOptions, cachedFileNames, previousProgram, parser, cachedParserOptionsKey;
+function invalidateParser() {
+  parser = void 0, cachedCompilerOptions = void 0, cachedFileNames = void 0;
+}
+function getParser5(userOptions) {
+  let optionsKey = JSON.stringify(userOptions ?? {});
+  if (parser && cachedParserOptionsKey !== optionsKey && (parser = void 0), !parser) {
+    let configPath = findTsconfigPath(process.cwd());
+    if (cachedCompilerOptions = { noErrorTruncation: !0, strict: !0 }, configPath) {
+      let { config } = ts.readConfigFile(configPath, ts.sys.readFile), parsed = ts.parseJsonConfigFileContent(config, ts.sys, dirname5(configPath));
+      cachedCompilerOptions = { ...parsed.options, noErrorTruncation: !0 }, cachedFileNames = parsed.fileNames;
+    }
+    let program = ts.createProgram(
+      cachedFileNames ?? [],
+      cachedCompilerOptions,
+      void 0,
+      previousProgram
+    );
+    previousProgram = program;
+    let parserOptions = {
+      shouldExtractLiteralValuesFromEnum: !0,
+      shouldRemoveUndefinedFromOptional: !0,
+      ...userOptions,
+      // Always force savePropValueAsString so default values are in a consistent format
+      savePropValueAsString: !0
+    };
+    parser = {
+      program,
+      fileParser: withCompilerOptions(cachedCompilerOptions, parserOptions)
+    }, cachedParserOptionsKey = optionsKey;
+  }
+  return parser;
+}
+function matchComponentDoc(docs, {
+  importName,
+  localImportName,
+  componentName
+}) {
+  if (docs.length !== 0)
+    return docs.length === 1 ? docs[0] : docs.find(
+      (doc) => doc.exportName === importName || doc.exportName === localImportName || doc.displayName === importName || doc.displayName === localImportName || doc.displayName === componentName
+    );
+}
+var parseWithReactDocgenTypescript = cached(
+  (filePath, userOptions) => {
+    let { program, fileParser } = getParser5(userOptions), checker = program.getTypeChecker(), sourceFile = program.getSourceFile(filePath), docs = fileParser.parseWithProgramProvider(filePath, () => program), exportNameMap = sourceFile ? getExportNameMap(checker, sourceFile) : /* @__PURE__ */ new Map();
+    return docs.map((doc) => {
+      let largeNonUserSources = getLargeNonUserPropSources(doc.props);
+      return {
+        ...doc,
+        // Use name-based lookup: displayName is the resolved symbol name, so look it up in the
+        // export map to get the public export name. Falls back to displayName when not aliased.
+        exportName: exportNameMap.get(doc.displayName) ?? doc.displayName,
+        // Filter out bulk props from non-user sources (React built-ins, DOM, CSS-in-JS system props)
+        props: Object.fromEntries(
+          Object.entries(doc.props).filter(([, prop]) => {
+            let source = getPropSource(prop);
+            return !source || !largeNonUserSources.has(source);
+          })
+        )
+      };
+    });
+  },
+  { name: "parseWithReactDocgenTypescript" }
+);
+
+// src/componentManifest/getComponentImports.ts
 var baseIdentifier = (component) => component.split(".")[0] ?? component, isTypeSpecifier = (s) => t3.isImportSpecifier(s) && s.importKind === "type", importedName = (im) => t3.isIdentifier(im) ? im.name : im.value, addUniqueBy = (arr, item, eq2) => {
   arr.find(eq2) || arr.push(item);
 }, getComponents = ({
   csf,
-  storyFilePath
+  storyFilePath,
+  typescriptOptions
 }) => {
-  let program = csf._file.path, componentSet = /* @__PURE__ */ new Set(), localToImport = /* @__PURE__ */ new Map();
+  let { reactDocgen = "react-docgen", reactDocgenTypescriptOptions } = typescriptOptions, reactDocgenConfig = reactDocgen || "react-docgen", program = csf._file.path, componentSet = /* @__PURE__ */ new Set(), localToImport = /* @__PURE__ */ new Map();
   program.traverse({
     JSXOpeningElement(p) {
       let n = p.node.name;
@@ -11595,25 +11740,51 @@ var baseIdentifier = (component) => component.split(".")[0] ?? component, isType
   }).map((component) => {
     let path3, isPackage = !1;
     try {
-      component.importId && storyFilePath && (path3 = cachedResolveImport(matchPath(component.importId, dirname5(storyFilePath)), {
-        basedir: dirname5(storyFilePath)
+      component.importId && storyFilePath && (path3 = cachedResolveImport(matchPath(component.importId, dirname6(storyFilePath)), {
+        basedir: dirname6(storyFilePath)
       }));
     } catch (e) {
       logger5.debug(e);
     }
     try {
-      component.importId && !component.importId.startsWith(".") && storyFilePath && (cachedResolveImport(component.importId, { basedir: dirname5(storyFilePath) }), isPackage = !0);
+      component.importId && !component.importId.startsWith(".") && storyFilePath && (cachedResolveImport(component.importId, { basedir: dirname6(storyFilePath) }), isPackage = !0);
     } catch {
     }
     let componentWithPackage = { ...component, isPackage };
     if (path3) {
-      let reactDocgen = getReactDocgen(path3, componentWithPackage);
-      return {
-        ...componentWithPackage,
-        path: path3,
-        reactDocgen,
-        importOverride: reactDocgen.type === "success" ? getImportTag(reactDocgen.data) : void 0
-      };
+      if (reactDocgenConfig === "react-docgen-typescript") {
+        let reactDocgenTypescript, reactDocgenTypescriptError;
+        try {
+          reactDocgenTypescript = matchComponentDoc(
+            parseWithReactDocgenTypescript(path3, reactDocgenTypescriptOptions),
+            component
+          );
+        } catch (e) {
+          let message = e instanceof Error ? e.message : String(e);
+          logger5.debug(`react-docgen-typescript failed for ${path3}: ${message}`), reactDocgenTypescriptError = {
+            name: "react-docgen-typescript parse error",
+            message: `File: ${path3}
+${message}`
+          };
+        }
+        let importOverride = reactDocgenTypescript ? getImportTag(reactDocgenTypescript) : void 0;
+        return {
+          ...componentWithPackage,
+          path: path3,
+          ...reactDocgenTypescript ? { reactDocgenTypescript } : {},
+          ...reactDocgenTypescriptError ? { reactDocgenTypescriptError } : {},
+          importOverride
+        };
+      }
+      if (reactDocgenConfig === "react-docgen") {
+        let reactDocgen2 = getReactDocgen(path3, componentWithPackage);
+        return {
+          ...componentWithPackage,
+          path: path3,
+          reactDocgen: reactDocgen2,
+          importOverride: reactDocgen2.type === "success" ? getImportTag(reactDocgen2.data) : void 0
+        };
+      }
     }
     return componentWithPackage;
   }).sort((a, b) => a.componentName.localeCompare(b.componentName));
@@ -11781,18 +11952,20 @@ function extractStories(csf, componentName, manifestEntries) {
       // Only include stories that are in the list of entries already filtered for the 'manifest' tag
       manifestEntryIds.has(story.id)
     )
-  ).map(([storyName]) => {
+  ).map(([storyExport, story]) => {
     try {
-      let jsdocComment = extractDescription(csf._storyStatements[storyName]), { tags = {}, description } = jsdocComment ? extractJSDocInfo(jsdocComment) : {}, finalDescription = (tags?.describe?.[0] || tags?.desc?.[0]) ?? description;
+      let jsdocComment = extractDescription(csf._storyStatements[storyExport]), { tags = {}, description } = jsdocComment ? extractJSDocInfo(jsdocComment) : {}, finalDescription = (tags?.describe?.[0] || tags?.desc?.[0]) ?? description;
       return {
-        name: storyName,
-        snippet: recast2.print(getCodeSnippet(csf, storyName, componentName)).code,
+        id: story.id,
+        name: story.name ?? storyNameFromExport(storyExport),
+        snippet: recast2.print(getCodeSnippet(csf, storyExport, componentName)).code,
         description: finalDescription?.trim(),
         summary: tags.summary?.[0]
       };
     } catch (e) {
       return invariant(e instanceof Error), {
-        name: storyName,
+        id: story.id,
+        name: story.name ?? storyNameFromExport(storyExport),
         error: { name: e.name, message: e.message }
       };
     }
@@ -11806,9 +11979,10 @@ function extractComponentDescription(csf, docgen) {
     jsDocTags: tags
   };
 }
-var manifests = async (existingManifests = {}, { manifestEntries }) => {
-  invalidateCache();
-  let startPerformance = performance.now(), components = uniqBy(
+var manifests = async (existingManifests = {}, options) => {
+  let { manifestEntries, presets } = options, typescriptOptions = await presets?.apply("typescript", {}) ?? {};
+  invalidateCache(), invalidateParser();
+  let startTime = performance.now(), components = uniqBy(
     manifestEntries.filter(
       (entry) => entry.type === "story" && entry.subtype === "story" || // addon-docs will add docs entries to these manifest entries afterwards
       // Docs entries have importPath pointing to MDX file, but storiesImports[0] points to the story file
@@ -11819,7 +11993,11 @@ var manifests = async (existingManifests = {}, { manifestEntries }) => {
     let storyFilePath = entry.type === "story" ? entry.importPath : (
       // For attached docs entries, storiesImports[0] points to the stories file being attached to
       entry.storiesImports[0]
-    ), absoluteImportPath = path.join(process.cwd(), storyFilePath), storyFile = cachedReadFileSync(absoluteImportPath, "utf-8"), csf = loadCsf(storyFile, { makeTitle: (title2) => title2 ?? "No title" }).parse(), componentName = csf._meta?.component, id = entry.id.split("--")[0], title = entry.title.split("/").at(-1).replace(/\s+/g, ""), allComponents = getComponents({ csf, storyFilePath: absoluteImportPath }), component = findMatchingComponent(
+    ), absoluteImportPath = path.join(process.cwd(), storyFilePath), storyFile = cachedReadFileSync(absoluteImportPath, "utf-8"), csf = loadCsf(storyFile, { makeTitle: () => entry.title }).parse(), componentName = csf._meta?.component, id = entry.id.split("--")[0], title = entry.title.split("/").at(-1).replace(/\s+/g, ""), allComponents = getComponents({
+      csf,
+      storyFilePath: absoluteImportPath,
+      typescriptOptions
+    }), component = findMatchingComponent(
       allComponents,
       componentName,
       entry.title.replace(/\s+/g, "")
@@ -11832,7 +12010,7 @@ var manifests = async (existingManifests = {}, { manifestEntries }) => {
       import: imports,
       jsDocTags: {}
     };
-    if (!component?.reactDocgen) {
+    if (!(component?.reactDocgen || component?.reactDocgenTypescript)) {
       let error = csf._meta?.component ? {
         name: "No component import found",
         message: `No component file found for the "${csf.meta.component}" component.`
@@ -11851,22 +12029,30 @@ ${storyFile}`
         }
       };
     }
-    let docgenResult = component.reactDocgen, docgen = docgenResult.type === "success" ? docgenResult.data : void 0, { description, summary, jsDocTags } = extractComponentDescription(csf, docgen);
+    let docgenResult = component.reactDocgen, docgen = docgenResult?.type === "success" ? docgenResult.data : void 0, reactDocgenTypescriptDoc = component.reactDocgenTypescript, docgenDescription = docgen?.description ?? reactDocgenTypescriptDoc?.description, { description, summary, jsDocTags } = extractComponentDescription(
+      csf,
+      docgenDescription ? { description: docgenDescription } : void 0
+    );
     return {
       ...base2,
       description,
       summary,
       import: imports,
-      reactDocgen: docgen,
+      ...docgen ? { reactDocgen: docgen } : {},
+      ...reactDocgenTypescriptDoc ? { reactDocgenTypescript: reactDocgenTypescriptDoc } : {},
       jsDocTags,
-      error: docgenResult.type === "error" ? docgenResult.error : void 0
+      error: (docgenResult?.type === "error" ? docgenResult.error : void 0) ?? component.reactDocgenTypescriptError
     };
-  }).filter((component) => component !== void 0);
-  return logger6.verbose(`Component manifest generation took ${performance.now() - startPerformance}ms`), {
+  }).filter((component) => component !== void 0), durationMs = Math.round(performance.now() - startTime);
+  return {
     ...existingManifests,
     components: {
       v: 0,
-      components: Object.fromEntries(components.map((component) => [component.id, component]))
+      components: Object.fromEntries(components.map((component) => [component.id, component])),
+      meta: {
+        docgen: typescriptOptions.reactDocgen ?? "react-docgen",
+        durationMs
+      }
     }
   };
 };
@@ -11994,11 +12180,13 @@ async function internal_getArgTypesData(_input, options) {
     componentExportName
   }), argTypesData;
 }
+var optimizeViteDeps = ["react-dom/test-utils"];
 export {
   addons,
   enrichCsf as experimental_enrichCsf,
   manifests as experimental_manifests,
   internal_getArgTypesData,
+  optimizeViteDeps,
   previewAnnotations,
   resolvedReact
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "10.3.0-alpha.1",
+  "version": "10.3.0-alpha.10",
   "description": "Storybook React renderer",
   "keywords": [
     "storybook"
@@ -23,6 +23,7 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
+      "code": "./src/index.ts",
       "default": "./dist/index.js"
     },
     "./entry-preview": "./dist/entry-preview.js",
@@ -31,12 +32,14 @@
     "./entry-preview-rsc": "./dist/entry-preview-rsc.js",
     "./experimental-playwright": {
       "types": "./dist/playwright.d.ts",
+      "code": "./src/playwright.ts",
       "default": "./dist/playwright.js"
     },
     "./package.json": "./package.json",
     "./preset": "./dist/preset.js",
     "./preview": {
       "types": "./dist/preview.d.ts",
+      "code": "./src/preview.tsx",
       "default": "./dist/preview.js"
     }
   },
@@ -50,8 +53,9 @@
   ],
   "dependencies": {
     "@storybook/global": "^5.0.0",
-    "@storybook/react-dom-shim": "10.3.0-alpha.1",
-    "react-docgen": "^8.0.2"
+    "@storybook/react-dom-shim": "10.3.0-alpha.10",
+    "react-docgen": "^8.0.2",
+    "react-docgen-typescript": "^2.2.2"
   },
   "devDependencies": {
     "@types/babel-plugin-react-docgen": "^4.2.3",
@@ -77,7 +81,7 @@
   "peerDependencies": {
     "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.3.0-alpha.1",
+    "storybook": "^10.3.0-alpha.10",
     "typescript": ">= 4.9.x"
   },
   "peerDependenciesMeta": {

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

@@ -1,45 +0,0 @@
-import CJS_COMPAT_NODE_URL_e6zxtcry2es from 'node:url';
-import CJS_COMPAT_NODE_PATH_e6zxtcry2es from 'node:path';
-import CJS_COMPAT_NODE_MODULE_e6zxtcry2es from "node:module";
-
-var __filename = CJS_COMPAT_NODE_URL_e6zxtcry2es.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_e6zxtcry2es.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_e6zxtcry2es.createRequire(import.meta.url);
-
-// ------------------------------------------------------------
-// end of CJS compatibility banner, injected by Storybook's esbuild configuration
-// ------------------------------------------------------------
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
-var __require = /* @__PURE__ */ ((x) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(x, {
-  get: (a, b) => (typeof require < "u" ? require : a)[b]
-}) : x)(function(x) {
-  if (typeof require < "u") return require.apply(this, arguments);
-  throw Error('Dynamic require of "' + x + '" is not supported');
-});
-var __commonJS = (cb, mod) => function() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from == "object" || typeof from == "function")
-    for (let key of __getOwnPropNames(from))
-      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
-  mod
-));
-
-export {
-  __require,
-  __commonJS,
-  __toESM
-};