@storybook/web-components 11.0.0-alpha.6 → 11.0.0-alpha.8

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

@@ -0,0 +1,76 @@
+import CJS_COMPAT_NODE_URL_f6rwsm0jxpo from 'node:url';
+import CJS_COMPAT_NODE_PATH_f6rwsm0jxpo from 'node:path';
+import CJS_COMPAT_NODE_MODULE_f6rwsm0jxpo from "node:module";
+
+var __filename = CJS_COMPAT_NODE_URL_f6rwsm0jxpo.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_f6rwsm0jxpo.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_f6rwsm0jxpo.createRequire(import.meta.url);
+
+// ------------------------------------------------------------
+// end of CJS compatibility banner, injected by Storybook's esbuild configuration
+// ------------------------------------------------------------
+
+// src/docgen/component-docgen/resolve-component/resolve-component.ts
+import {
+  isStringLiteral,
+  loadCsf,
+  oneLineTextOf,
+  resolveBindingMembers,
+  resolveObjectMembers,
+  unwrapExpression
+} from "storybook/internal/csf-tools";
+import { readFileSync } from "node:fs";
+function parseStoryFile(storyFilePath, title) {
+  try {
+    let source = readFileSync(storyFilePath, "utf8");
+    return loadCsf(source, { makeTitle: () => title, fileName: storyFilePath }).parse();
+  } catch {
+    return;
+  }
+}
+function tagFromNode(csf, node) {
+  let unwrapped = unwrapExpression(node);
+  if (isStringLiteral(unwrapped) && unwrapped.value !== "")
+    return { tag: unwrapped.value };
+  if (unwrapped.type === "TemplateLiteral" && unwrapped.expressions.length === 0) {
+    let tag = unwrapped.quasis[0]?.value.cooked;
+    if (tag)
+      return { tag };
+  }
+  return { reason: "component-not-a-tag", expression: csf.editor.source(node) };
+}
+function resolveStoryComponent(csf) {
+  if (!csf._metaNode)
+    return { reason: "no-meta-component" };
+  let ctx = { editor: csf.editor, filePath: csf._options.fileName ?? "" }, members = resolveObjectMembers(csf._metaNode, ctx);
+  return componentIn(csf, members, csf._metaNode, ctx, /* @__PURE__ */ new Set()) ?? { reason: "no-meta-component" };
+}
+function componentIn(csf, members, object, ctx, visited) {
+  let component = members.properties.component;
+  if (component && !members.shadowed.includes("component"))
+    return tagFromNode(csf, component);
+  let unreadable = object.properties.filter((property) => property.type === "SpreadElement").filter((spread) => members.unresolved.includes(oneLineTextOf(spread))).reverse();
+  for (let spread of unreadable) {
+    let found = spreadComponent(csf, spread, ctx, visited);
+    if (found || component)
+      return found ?? { reason: "unresolvable-meta-spread", spread: oneLineTextOf(spread) };
+  }
+  return component && tagFromNode(csf, component);
+}
+function spreadComponent(csf, spread, ctx, visited) {
+  let local = localObject(unwrapExpression(spread.argument), ctx);
+  return !local || visited.has(local.object) ? { reason: "unresolvable-meta-spread", spread: oneLineTextOf(spread) } : componentIn(csf, local.members, local.object, ctx, new Set(visited).add(local.object));
+}
+function localObject(argument, ctx) {
+  if (argument.type === "ObjectExpression")
+    return { object: argument, members: resolveObjectMembers(argument, ctx) };
+  if (argument.type !== "Identifier")
+    return;
+  let declarator = ctx.editor.scopes.program.bindings.get(argument.name)?.node, init = declarator?.type === "VariableDeclarator" && declarator.init ? unwrapExpression(declarator.init) : void 0, members = resolveBindingMembers(ctx, argument.name);
+  return init?.type === "ObjectExpression" && members ? { object: init, members } : void 0;
+}
+
+export {
+  parseStoryFile,
+  resolveStoryComponent
+};

package/dist/docgen/docgen-worker.js

@@ -1,18 +1,18 @@
-import CJS_COMPAT_NODE_URL_3ov4ld79bt3 from 'node:url';
-import CJS_COMPAT_NODE_PATH_3ov4ld79bt3 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_3ov4ld79bt3 from "node:module";
+import CJS_COMPAT_NODE_URL_f6rwsm0jxpo from 'node:url';
+import CJS_COMPAT_NODE_PATH_f6rwsm0jxpo from 'node:path';
+import CJS_COMPAT_NODE_MODULE_f6rwsm0jxpo from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_3ov4ld79bt3.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_3ov4ld79bt3.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_3ov4ld79bt3.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_f6rwsm0jxpo.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_f6rwsm0jxpo.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_f6rwsm0jxpo.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   createDocgenProvider
-} from "../_node-chunks/chunk-X7F7EONQ.js";
-import "../_node-chunks/chunk-GDY64HEP.js";
+} from "../_node-chunks/chunk-7DGX2RHV.js";
+import "../_node-chunks/chunk-A2ZEEPU6.js";
 export {
   createDocgenProvider
 };

package/dist/docgen/index.d.ts

@@ -11,18 +11,20 @@ interface CemTag {
   manifestPath: string;
   warning?: string;
 }
-interface CemSnapshot {
-  /** First manifest in configuration order wins a tag. */
-  tags: ReadonlyMap<string, CemTag>;
-  /** Manifests that contribute nothing: missing or invalid with no last valid version. */
-  errors: DocgenError[];
-  paths: string[];
+//#endregion
+//#region code/renderers/web-components/.dts-emit/code/renderers/web-components/src/docgen/component-docgen/tag-resolver.d.ts
+interface TagLookup {
+  storyFilePath: string;
+}
+interface TagResolver {
+  find(tag: string, lookup: TagLookup): Promise<CemTag | DocgenError>;
 }
 //#endregion
 //#region code/renderers/web-components/.dts-emit/code/renderers/web-components/src/docgen/component-docgen/build-docgen.d.ts
 interface WebComponentsDocgenOptions {
   manifestPaths: string[];
-  typeProperty: string;
+  /** Also searched for element registrations when generating from sources. */
+  previewFilePath?: string;
 }
 type WebComponentsDocgenPayload = DocgenPayload & {
   /** Set while the manifest is served from its last valid version after a failed reload. */warning?: string;
@@ -32,18 +34,14 @@ type WebComponentsDocgenPayload = DocgenPayload & {
   };
 };
 interface BuildDocgenContext {
-  cem: CemSnapshot;
-  typeProperty: string;
+  resolver: TagResolver;
 }
-declare function buildDocgenPayload(input: DocgenProviderInput, context: BuildDocgenContext): WebComponentsDocgenPayload | undefined;
+declare function buildDocgenPayload(input: DocgenProviderInput, context: BuildDocgenContext): Promise<WebComponentsDocgenPayload | undefined>;
 //#endregion
 //#region code/renderers/web-components/.dts-emit/code/renderers/web-components/src/docgen/docgen-worker.d.ts
 declare const createDocgenProvider: ({
   manifestPaths,
-  typeProperty
+  previewFilePath
 }: WebComponentsDocgenOptions) => DocgenMiddleware;
 //#endregion
-//#region code/renderers/web-components/.dts-emit/code/renderers/web-components/src/docgen/component-docgen/arg-types/alt-type.d.ts
-declare const DEFAULT_TYPE_PROPERTY = "parsedType";
-//#endregion
-export { DEFAULT_TYPE_PROPERTY, type WebComponentsDocgenOptions, type WebComponentsDocgenPayload, buildDocgenPayload, createDocgenProvider };
+export { type WebComponentsDocgenOptions, type WebComponentsDocgenPayload, buildDocgenPayload, createDocgenProvider };

package/dist/docgen/index.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_3ov4ld79bt3 from 'node:url';
-import CJS_COMPAT_NODE_PATH_3ov4ld79bt3 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_3ov4ld79bt3 from "node:module";
+import CJS_COMPAT_NODE_URL_f6rwsm0jxpo from 'node:url';
+import CJS_COMPAT_NODE_PATH_f6rwsm0jxpo from 'node:path';
+import CJS_COMPAT_NODE_MODULE_f6rwsm0jxpo from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_3ov4ld79bt3.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_3ov4ld79bt3.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_3ov4ld79bt3.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_f6rwsm0jxpo.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_f6rwsm0jxpo.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_f6rwsm0jxpo.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -12,12 +12,9 @@ var require = CJS_COMPAT_NODE_MODULE_3ov4ld79bt3.createRequire(import.meta.url);
 import {
   buildDocgenPayload,
   createDocgenProvider
-} from "../_node-chunks/chunk-X7F7EONQ.js";
-import {
-  DEFAULT_TYPE_PROPERTY
-} from "../_node-chunks/chunk-GDY64HEP.js";
+} from "../_node-chunks/chunk-7DGX2RHV.js";
+import "../_node-chunks/chunk-A2ZEEPU6.js";
 export {
-  DEFAULT_TYPE_PROPERTY,
   buildDocgenPayload,
   createDocgenProvider
 };

package/dist/entry-preview-argtypes.js

@@ -2,8 +2,8 @@ import {
   getCustomElements,
   isValidComponent,
   isValidMetaData
-} from "./_browser-chunks/chunk-TXUT6K6E.js";
-import "./_browser-chunks/chunk-BNL7LBNI.js";
+} from "./_browser-chunks/chunk-4CVRUPXU.js";
+import "./_browser-chunks/chunk-XOX44XZE.js";
 import "./_browser-chunks/chunk-EGBR6PF2.js";
 import "./_browser-chunks/chunk-4BE7D4DS.js";
 
@@ -11,7 +11,7 @@ import "./_browser-chunks/chunk-4BE7D4DS.js";
 import { enhanceArgTypes } from "storybook/internal/docs-tools";
 
 // src/docs/custom-elements.ts
-import { logger } from "storybook/internal/client-logger";
+import { deprecate, logger } from "storybook/internal/client-logger";
 
 // ../../../node_modules/es-toolkit/dist/string/capitalize.mjs
 function capitalize(str) {
@@ -111,7 +111,9 @@ var getMetaDataExperimental = (tagName, customElements) => {
       declaration.tagName === tagName && (metadata = declaration);
     });
   }), metadata || logger.warn(`Component not found in custom-elements.json: ${tagName}`), metadata;
-}, getMetaData = (tagName, manifest) => manifest?.version === "experimental" ? getMetaDataExperimental(tagName, manifest) : getMetaDataV1(tagName, manifest), extractArgTypesFromElements = (tagName, customElements) => {
+}, getMetaData = (tagName, manifest) => manifest?.version === "experimental" ? (deprecate(
+  "The web-component-analyzer Custom Elements Manifest shape is deprecated and will be removed in Storybook 12. Generate a Custom Elements Manifest with @custom-elements-manifest/analyzer instead."
+), getMetaDataExperimental(tagName, manifest)) : getMetaDataV1(tagName, manifest), extractArgTypesFromElements = (tagName, customElements) => {
   let metaData = getMetaData(tagName, customElements);
   return metaData && mapArgTypes(metaData);
 }, extractArgTypes = (tagName) => {
@@ -123,7 +125,7 @@ var getMetaDataExperimental = (tagName, customElements) => {
 };
 
 // src/entry-preview-argtypes.ts
-var parameters = {
+var useServiceArgTypes = "FEATURES" in globalThis && globalThis.FEATURES?.docgenServer, parameters = useServiceArgTypes ? {} : {
   docs: {
     extractArgTypes,
     extractComponentDescription

package/dist/entry-preview.js

@@ -2,7 +2,7 @@ import {
   parameters,
   render,
   renderToCanvas
-} from "./_browser-chunks/chunk-BNL7LBNI.js";
+} from "./_browser-chunks/chunk-XOX44XZE.js";
 import "./_browser-chunks/chunk-4BE7D4DS.js";
 export {
   parameters,

package/dist/index.d.ts

@@ -8,14 +8,11 @@ type WebComponentsFrameworkOptions = {
    * Paths to Custom Elements Manifest files, relative to the Storybook config directory.
    *
    * When omitted, Storybook reads `customElements` from the nearest `package.json`.
-   * When neither is available, server-side docgen is skipped and the runtime `setCustomElementsManifest` path keeps working as before.
+   * Tags no manifest declares are generated from the project's sources.
    *
-   * Please note that the runtime `setCustomElementsManifest` path is deprecated and will be removed in next major.
+   * Please note that the runtime `setCustomElementsManifest` path is deprecated and will be removed in Storybook 12.
    */
   customElementsManifest?: string | string[];
-  docgen?: {
-    /** Manifest key that holds analyzer-resolved type text; defaults to `parsedType`. */typeProperty?: string;
-  };
 };
 type StoryFnHtmlReturnType = string | Node | DocumentFragment | TemplateResult | SVGTemplateResult;
 interface WebComponentsRenderer extends WebRenderer {
@@ -49,11 +46,15 @@ type StoryContext<TArgs = StrictArgs$1> = StoryContext$1<WebComponentsRenderer,
 type Preview = ProjectAnnotations<WebComponentsRenderer>;
 //#endregion
 //#region code/renderers/web-components/.dts-emit/code/renderers/web-components/src/framework-api.d.ts
+/** @deprecated Use framework.options.customElementsManifest with features.docgenServer instead. This runtime manifest helper will be removed in Storybook 12. */
 declare function isValidComponent(tagName: string): boolean;
+/** @deprecated Use framework.options.customElementsManifest with features.docgenServer instead. This runtime manifest helper will be removed in Storybook 12. */
 declare function isValidMetaData(customElements: any): boolean;
-/** @param customElements `any` for now as spec is not super stable yet */
+/** @deprecated Use framework.options.customElementsManifest with features.docgenServer instead. This runtime manifest setter will be removed in Storybook 12. */
 declare function setCustomElements(customElements: any): void;
+/** @deprecated Use framework.options.customElementsManifest with features.docgenServer instead. This runtime manifest setter will be removed in Storybook 12. */
 declare function setCustomElementsManifest(customElements: any): void;
+/** @deprecated Use framework.options.customElementsManifest with features.docgenServer instead. This runtime manifest getter will be removed in Storybook 12. */
 declare function getCustomElements(): any;
 //#endregion
 //#region code/renderers/web-components/.dts-emit/code/renderers/web-components/src/portable-stories.d.ts

package/dist/index.js

@@ -6,8 +6,8 @@ import {
   setCustomElements,
   setCustomElementsManifest,
   setProjectAnnotations
-} from "./_browser-chunks/chunk-TXUT6K6E.js";
-import "./_browser-chunks/chunk-BNL7LBNI.js";
+} from "./_browser-chunks/chunk-4CVRUPXU.js";
+import "./_browser-chunks/chunk-XOX44XZE.js";
 import "./_browser-chunks/chunk-EGBR6PF2.js";
 import "./_browser-chunks/chunk-4BE7D4DS.js";
 export {