@storybook/vue3 11.0.0-alpha.7 → 11.0.0-alpha.9

package/dist/_node-chunks/{chunk-M5XXRPJZ.js → chunk-3QB6MEWK.js}

@@ -1,25 +1,29 @@
-import CJS_COMPAT_NODE_URL_6gh9awpayy7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_6gh9awpayy7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_6gh9awpayy7 from "node:module";
+import CJS_COMPAT_NODE_URL_q09ib7p78tl from 'node:url';
+import CJS_COMPAT_NODE_PATH_q09ib7p78tl from 'node:path';
+import CJS_COMPAT_NODE_MODULE_q09ib7p78tl from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_6gh9awpayy7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_6gh9awpayy7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_6gh9awpayy7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_q09ib7p78tl.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_q09ib7p78tl.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_q09ib7p78tl.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 
 // src/docgen/shared/render-primitives.ts
-import { types as t } from "storybook/internal/babel";
 import {
   buildImportStatements,
+  isStringLiteral as isStringLiteral2,
   unwrapExpression as unwrapExpression2
 } from "storybook/internal/csf-tools";
 
 // src/docgen/shared/classify-value.ts
-import { recast } from "storybook/internal/babel";
-import { unwrapExpression } from "storybook/internal/csf-tools";
+import {
+  textOf,
+  isStringLiteral,
+  unwrapExpression,
+  walk
+} from "storybook/internal/csf-tools";
 var RESOLVABLE_GLOBALS = /* @__PURE__ */ new Set([
   "Array",
   "BigInt",
@@ -59,7 +63,27 @@ function classifyValue(node) {
   return isUndefinedIdentifier(value) ? { kind: "unset" } : isFunctionExpression(value) || isEmptyString(value) ? { kind: "omit" } : isInlineLiteral(value) ? { kind: "inline" } : isResolvable(value) ? { kind: "hoist" } : { kind: "unrepresentable" };
 }
 function printValue(node) {
-  return recast.print(node, { tabWidth: 2 }).code;
+  let source = textOf(node), lines = source.split(`
+`);
+  if (lines.length === 1)
+    return source;
+  let { start } = node, quasis = [];
+  walk(node, (child) => {
+    if (child.type === "TemplateElement") {
+      let span = child;
+      quasis.push([span.start - start, span.end - start]);
+    }
+  });
+  let offset = 0, dedentable = lines.map((line, index) => {
+    let lineStart = offset;
+    return offset += line.length + 1, index > 0 && !quasis.some(([from, to]) => from < lineStart && lineStart <= to);
+  }), depth = Math.min(
+    ...lines.filter((line, index) => dedentable[index] && line.trim() !== "").map((line) => line.search(/\S/))
+  );
+  return Number.isFinite(depth) && depth > 0 ? lines.map(
+    (line, index) => dedentable[index] ? line.slice(Math.min(depth, line.search(/\S|$/))) : line
+  ).join(`
+`) : source;
 }
 function isFunctionExpression(node) {
   let unwrapped = unwrapExpression(node);
@@ -74,7 +98,7 @@ function isSelfContainedFunction(node) {
   if (fn.type !== "ArrowFunctionExpression" && fn.type !== "FunctionExpression")
     return !1;
   let locals = /* @__PURE__ */ new Set();
-  return fn.params.every((param) => collectPatternNames(param, locals)) ? fn.body.type !== "BlockStatement" ? isResolvable(fn.body, locals) : fn.body.body.every((statement) => statementIsResolvable(statement, locals)) : !1;
+  return !fn.params.every((param) => collectPatternNames(param, locals)) || !fn.body ? !1 : fn.body.type !== "BlockStatement" ? isResolvable(fn.body, locals) : fn.body.body.every((statement) => statementIsResolvable(statement, locals));
 }
 function statementIsResolvable(statement, locals) {
   switch (statement.type) {
@@ -110,17 +134,13 @@ function collectPatternNames(pattern, into) {
 }
 function isEmptyString(node) {
   let value = unwrapExpression(node);
-  return value.type === "StringLiteral" && value.value === "";
+  return isStringLiteral(value) && value.value === "";
 }
 function isInlineLiteral(node) {
   let value = unwrapExpression(node);
   switch (value.type) {
-    case "StringLiteral":
-    case "NumericLiteral":
-    case "BooleanLiteral":
-    case "NullLiteral":
-    case "BigIntLiteral":
-      return !0;
+    case "Literal":
+      return !("regex" in value && value.regex);
     case "UnaryExpression":
       return value.operator === "-" && isInlineLiteral(value.argument);
     default:
@@ -130,12 +150,7 @@ function isInlineLiteral(node) {
 function isResolvable(node, locals = NO_LOCALS) {
   let value = unwrapExpression(node), resolves = (child) => isResolvable(child, locals);
   switch (value.type) {
-    case "StringLiteral":
-    case "NumericLiteral":
-    case "BooleanLiteral":
-    case "NullLiteral":
-    case "BigIntLiteral":
-    case "RegExpLiteral":
+    case "Literal":
       return !0;
     case "Identifier":
       return locals.has(value.name) || RESOLVABLE_GLOBALS.has(value.name);
@@ -144,7 +159,7 @@ function isResolvable(node, locals = NO_LOCALS) {
     case "ArrayExpression":
       return value.elements.every((element) => !element || resolves(element));
     case "ObjectExpression":
-      return value.properties.every((property) => property.type !== "ObjectProperty" ? !1 : (!property.computed || resolves(property.key)) && resolves(property.value));
+      return value.properties.every((property) => property.type !== "Property" || property.method || property.kind !== "init" ? !1 : (!property.computed || resolves(property.key)) && resolves(property.value));
     case "CallExpression":
     case "NewExpression":
       return resolves(value.callee) && value.arguments.every(resolves);
@@ -198,7 +213,7 @@ function renderPropArg(arg, ctx) {
 }
 function renderPropValue(input, ctx) {
   let value = unwrapExpression2(input.value);
-  return input.plan.kind === "hoist" ? hoistedProp(input, ctx, printValue(value)) : value.type === "BooleanLiteral" ? value.value ? { attrName: input.attributeName } : { attrName: `:${input.attributeName}`, value: "false" } : value.type === "StringLiteral" ? quoteAttributeValue(value.value) === void 0 ? hoistedProp(input, ctx, printValue(value)) : { attrName: input.attributeName, value: value.value } : { attrName: `:${input.attributeName}`, value: printValue(value) };
+  return input.plan.kind === "hoist" ? hoistedProp(input, ctx, printValue(value)) : value.type === "Literal" && typeof value.value == "boolean" ? value.value ? { attrName: input.attributeName } : { attrName: `:${input.attributeName}`, value: "false" } : isStringLiteral2(value) ? quoteAttributeValue(value.value) === void 0 ? hoistedProp(input, ctx, printValue(value)) : { attrName: input.attributeName, value: value.value } : { attrName: `:${input.attributeName}`, value: printValue(value) };
 }
 function hoistedProp(input, ctx, source) {
   let existing = ctx.hoistedArgs.get(input.variableName);
@@ -229,15 +244,8 @@ function renderSlotContent(arg, plan, ctx) {
 }
 function inlinePrimitiveSource(node) {
   let value = unwrapExpression2(node);
-  switch (value.type) {
-    case "StringLiteral":
-      return value.value;
-    case "NumericLiteral":
-    case "BooleanLiteral":
-      return String(value.value);
-    default:
-      return;
-  }
+  if (value.type === "Literal")
+    return typeof value.value == "string" ? value.value : typeof value.value == "number" || typeof value.value == "boolean" ? String(value.value) : void 0;
 }
 function escapeTextContent(text) {
   return text.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll("{{", "&#123;&#123;");
@@ -256,11 +264,18 @@ ${sections.join(`
 </script>`;
 }
 function allocateBindingName(name, ctx) {
-  let baseName = t.toIdentifier(name), bindingName = baseName, suffix = 2;
+  let baseName = toIdentifier(name), bindingName = baseName, suffix = 2;
   for (; ctx.bindings.has(bindingName); )
     bindingName = `${baseName}${suffix}`, suffix += 1;
   return ctx.bindings.add(bindingName), bindingName;
 }
+var RESERVED_WORDS = new Set(
+  "break case catch class const continue debugger default delete do else enum export extends false finally for function if import in instanceof new null return super switch this throw true try typeof var void while with implements interface let package private protected public static yield await arguments eval".split(" ")
+);
+function toIdentifier(input) {
+  let name = [...input].map((char) => /[\p{ID_Continue}$\u200C\u200D]/u.test(char) ? char : "-").join("").replace(/^[-0-9]+/, "").replace(/[-\s]+(.)?/g, (_, next) => next ? next.toUpperCase() : "");
+  return name && !RESERVED_WORDS.has(name) ? name : `_${name}`;
+}
 function quoteAttributeValue(value) {
   if (!value.includes("&")) {
     if (!value.includes('"'))

package/dist/_node-chunks/{chunk-UZY53QU3.js → chunk-CCMORW36.js}

@@ -1,17 +1,20 @@
-import CJS_COMPAT_NODE_URL_6gh9awpayy7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_6gh9awpayy7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_6gh9awpayy7 from "node:module";
+import CJS_COMPAT_NODE_URL_q09ib7p78tl from 'node:url';
+import CJS_COMPAT_NODE_PATH_q09ib7p78tl from 'node:path';
+import CJS_COMPAT_NODE_MODULE_q09ib7p78tl from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_6gh9awpayy7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_6gh9awpayy7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_6gh9awpayy7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_q09ib7p78tl.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_q09ib7p78tl.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_q09ib7p78tl.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   indent
-} from "./chunk-M5XXRPJZ.js";
+} from "./chunk-3QB6MEWK.js";
+import {
+  collectComponentMetaSources
+} from "./chunk-JVUI6SZ7.js";
 
 // src/docgen/component-docgen/arg-types/extractArgTypes.ts
 import { convert, extractComponentProps, hasDocgen } from "storybook/internal/docs-tools";
@@ -325,8 +328,246 @@ function createNamedTypeDetailResolver({
   };
 }
 
+// src/docgen/component-docgen/build-docgen.ts
+import { readFile } from "node:fs/promises";
+import { join } from "node:path";
+import {
+  extractComponentDescription,
+  extractDescription,
+  loadCsf,
+  storyShapeError
+} from "storybook/internal/csf-tools";
+import {
+  extractDeclaredSubcomponents,
+  getComponentIdFromEntry,
+  getStoryImportPathFromEntry
+} from "storybook/internal/common";
+
+// src/docgen/component-docgen/resolve-component/follow-re-export.ts
+function followReExport(checker, filePath, exportName) {
+  let program = checker.getProgram(), sourceFile = program?.getSourceFile(filePath);
+  if (!program || !sourceFile)
+    return;
+  let typeChecker = program.getTypeChecker(), moduleSymbol = typeChecker.getSymbolAtLocation(sourceFile);
+  if (!moduleSymbol)
+    return;
+  let exported = typeChecker.getExportsOfModule(moduleSymbol).find((symbol) => symbol.name === exportName);
+  if (!exported)
+    return;
+  let target;
+  try {
+    target = typeChecker.getAliasedSymbol(exported);
+  } catch {
+    return;
+  }
+  let declaringPath = target.declarations?.[0]?.getSourceFile().fileName;
+  if (!(!declaringPath || declaringPath === filePath))
+    return { path: declaringPath, exportName: target.name };
+}
+
+// src/docgen/component-docgen/resolve-component/resolve-component.ts
+import { createMetaComponentResolver } from "storybook/internal/common";
+var resolveComponent = createMetaComponentResolver({ extensions: [".vue"] });
+function resolveMetaComponent(csf, storyPath, componentNode) {
+  let resolved = resolveComponent(csf, storyPath, componentNode);
+  if ("reason" in resolved)
+    return resolved;
+  let { localName, importId, path, exportName } = resolved.component;
+  return !importId || !path ? { reason: "no-component-import" } : { component: { localName, importId, path, exportName } };
+}
+
+// src/docgen/component-docgen/build-docgen.ts
+var META_COMPONENT_NAME = /^[A-Za-z_$][\w$]*(\.[A-Za-z_$][\w$]*)*$/, NON_COMPONENT_NAMES = /* @__PURE__ */ new Set([
+  "null",
+  "undefined",
+  "true",
+  "false",
+  "NaN",
+  "Infinity",
+  "this",
+  "import"
+]), UNRESOLVED_COMPONENT_MESSAGES = {
+  "no-meta-component": (subject) => ({
+    name: "No component found",
+    message: `We could not detect the component from ${subject}. Specify meta.component.`
+  }),
+  "no-component-import": (subject) => ({
+    name: "No component import found",
+    message: `No component file found for the component declared in ${subject}. Import it into the story file.`
+  }),
+  "unreadable-component-expression": (subject) => ({
+    name: "No component found",
+    message: `We could not follow ${subject} to a component. Storybook follows an imported name, a namespace-import property access, or a chain of property accesses and spreads through modules it can resolve.`
+  })
+};
+function unresolvedComponentError(reason, subject) {
+  return UNRESOLVED_COMPONENT_MESSAGES[reason](subject);
+}
+function componentNameFromTitle(title) {
+  return title.split("/").at(-1).replace(/\s+/g, "");
+}
+function getUsableComponentName(component) {
+  let name = component?.trim();
+  if (!(!name || NON_COMPONENT_NAMES.has(name.split(".")[0]) || !META_COMPONENT_NAME.test(name)))
+    return name;
+}
+async function extractVueComponentDocgen(context, resolvedComponent, { metaJsDoc, errorContext = "" } = {}) {
+  let checker = context.getChecker(resolvedComponent.path), declaredExport = followReExport(
+    checker,
+    resolvedComponent.path,
+    resolvedComponent.exportName
+  ) ?? {
+    path: resolvedComponent.path,
+    exportName: resolvedComponent.exportName
+  }, componentMeta = (await collectComponentMetaSources(
+    checker,
+    declaredExport.path,
+    context.typescript
+  )).find((meta) => meta.exportName === declaredExport.exportName);
+  if (!componentMeta)
+    return {
+      error: {
+        name: "No docgen found",
+        message: `vue-component-meta extracted no component metadata for the "${declaredExport.exportName}" export of ${declaredExport.path}${errorContext}.`
+      }
+    };
+  let { description, summary, jsDocTags } = extractComponentDescription(
+    metaJsDoc,
+    componentMeta.description,
+    componentMeta.jsDocTags
+  ), resolveNamedTypeDetail = createNamedTypeDetailResolver({
+    checker,
+    typescript: context.typescript,
+    componentPath: declaredExport.path
+  });
+  return {
+    path: declaredExport.path,
+    componentMeta,
+    description,
+    summary,
+    jsDocTags,
+    argTypes: extractArgTypes({ __docgenInfo: componentMeta }, resolveNamedTypeDetail) ?? void 0,
+    apiDescription: buildApiDescription(componentMeta)
+  };
+}
+async function buildSubcomponentDocgen(csf, storyPath, storyFilePath, declared, context) {
+  let failure = (error) => ({
+    name: declared.componentName,
+    path: storyFilePath,
+    jsDocTags: {},
+    error
+  });
+  try {
+    let resolved = resolveMetaComponent(csf, storyPath, declared.node);
+    if ("reason" in resolved)
+      return failure(
+        unresolvedComponentError(resolved.reason, `meta.subcomponents.${declared.name}`)
+      );
+    let extracted = await extractVueComponentDocgen(context, resolved.component, {
+      errorContext: ` (subcomponent "${declared.name}")`
+    });
+    return "error" in extracted ? failure(extracted.error) : {
+      name: declared.componentName,
+      path: extracted.path,
+      description: extracted.description,
+      summary: extracted.summary,
+      jsDocTags: extracted.jsDocTags,
+      argTypes: extracted.argTypes,
+      apiDescription: extracted.apiDescription,
+      renderer: "vue3"
+    };
+  } catch (error) {
+    return failure({
+      name: "Subcomponent extraction failed",
+      message: `Extracting docgen for the declared subcomponent "${declared.name}" failed: ${error instanceof Error ? error.message : String(error)}`
+    });
+  }
+}
+async function buildDocgenPayload(input, context) {
+  let storyFilePath = getStoryImportPathFromEntry(input.entry);
+  if (!storyFilePath)
+    return;
+  let storyPath = (context.resolvePath ?? ((importPath) => join(process.cwd(), importPath)))(storyFilePath), storyFile;
+  try {
+    storyFile = await readFile(storyPath, "utf8");
+  } catch (error) {
+    if (error.code === "ENOENT")
+      return;
+    throw error;
+  }
+  let fallbackName = componentNameFromTitle(input.entry.title), baseFor = (name) => ({
+    id: getComponentIdFromEntry(input.entry),
+    name,
+    path: storyFilePath,
+    jsDocTags: {}
+  }), csf;
+  try {
+    csf = loadCsf(storyFile, {
+      makeTitle: () => input.entry.title,
+      fileName: storyPath
+    }).parse();
+  } catch (error) {
+    return {
+      ...baseFor(fallbackName),
+      error: {
+        name: "Story file could not be parsed",
+        message: `${error instanceof Error ? error.message : String(error)}
+
+${input.entry.importPath}:
+${storyFile}`
+      }
+    };
+  }
+  let authoredComponentName = getUsableComponentName(csf._meta?.component), base = baseFor(authoredComponentName ?? fallbackName), resolved = resolveMetaComponent(csf, storyPath);
+  if ("reason" in resolved) {
+    let error = unresolvedComponentError(
+      resolved.reason,
+      resolved.reason === "no-meta-component" ? "your story file" : "meta.component"
+    );
+    return {
+      ...base,
+      error: {
+        name: error.name,
+        message: (csf._metaStatement ? storyShapeError(error.message, csf._metaStatement, csf.editor).message : error.message) + `
+
+${input.entry.importPath}:
+${storyFile}`
+      }
+    };
+  }
+  let { component } = resolved, metaJsDoc = extractDescription(csf._metaStatement, csf.editor) || void 0, [primaryDocgen, subcomponentEntries] = await Promise.all([
+    extractVueComponentDocgen(context, component, { metaJsDoc }),
+    Promise.all(
+      extractDeclaredSubcomponents(csf).map(
+        async (declaredSubcomponent) => [
+          declaredSubcomponent.name,
+          await buildSubcomponentDocgen(
+            csf,
+            storyPath,
+            storyFilePath,
+            declaredSubcomponent,
+            context
+          )
+        ]
+      )
+    ).then((entries) => Object.fromEntries(entries))
+  ]);
+  return "error" in primaryDocgen ? { ...base, error: primaryDocgen.error } : {
+    ...baseFor((authoredComponentName ?? primaryDocgen.componentMeta.displayName) || fallbackName),
+    description: primaryDocgen.description,
+    summary: primaryDocgen.summary,
+    jsDocTags: primaryDocgen.jsDocTags,
+    vueComponentMeta: primaryDocgen.componentMeta,
+    argTypes: primaryDocgen.argTypes,
+    apiDescription: primaryDocgen.apiDescription,
+    renderer: "vue3",
+    ...Object.keys(subcomponentEntries).length > 0 ? { subcomponents: subcomponentEntries } : {}
+  };
+}
+
 export {
   extractArgTypes,
   buildApiDescription,
-  createNamedTypeDetailResolver
+  createNamedTypeDetailResolver,
+  buildDocgenPayload
 };