@storybook/addon-docs 10.5.0-alpha.7 → 10.5.0-alpha.8

package/dist/manager.js

@@ -8,19 +8,23 @@ import React, { useEffect, useState } from "react";
 import { AddonPanel } from "storybook/internal/components";
 import { addons, types, useChannel, useParameter } from "storybook/manager-api";
 import { ignoreSsrWarning, styled, useTheme } from "storybook/theming";
-
-// ../../core/src/docs-tools/shared.ts
-var ADDON_ID = "storybook/docs", PANEL_ID = `${ADDON_ID}/panel`, PARAM_KEY = "docs", SNIPPET_RENDERED = `${ADDON_ID}/snippet-rendered`;
-
-// src/manager.tsx
+import {
+  ADDON_ID,
+  PANEL_ID,
+  PARAM_KEY,
+  shouldWaitForServiceSnippet,
+  SNIPPET_RENDERED
+} from "storybook/internal/docs-tools";
 var CodePanel = ({
   active,
   lastEvent,
-  currentStoryId
+  currentStoryId,
+  storyParameters,
+  storyPrepared
 }) => {
-  let [codeSnippet, setSourceCode] = useState({
-    source: lastEvent?.source,
-    format: lastEvent?.format ?? void 0
+  let lastEventMatchesCurrentStory = lastEvent?.id === currentStoryId, [codeSnippet, setSourceCode] = useState({
+    source: lastEventMatchesCurrentStory ? lastEvent?.source : void 0,
+    format: lastEventMatchesCurrentStory ? lastEvent?.format ?? void 0 : void 0
   }), parameter = useParameter(PARAM_KEY, {
     source: { code: "" },
     theme: "dark"
@@ -30,21 +34,16 @@ var CodePanel = ({
       source: void 0,
       format: void 0
     });
-  }, [currentStoryId]), useChannel({
-    [SNIPPET_RENDERED]: ({ source, format }) => {
-      setSourceCode({ source, format });
-    }
-  });
-  let isDark = useTheme().base !== "light";
-  return React.createElement(AddonPanel, { active: !!active }, React.createElement(SourceStyles, null, React.createElement(
-    Source,
+  }, [currentStoryId]), useChannel(
     {
-      ...parameter.source,
-      code: parameter.source?.code || codeSnippet.source || parameter.source?.originalSource,
-      format: codeSnippet.format,
-      dark: isDark
-    }
-  )));
+      [SNIPPET_RENDERED]: ({ id, source, format }) => {
+        id !== void 0 && id !== currentStoryId || setSourceCode({ source, format });
+      }
+    },
+    [currentStoryId]
+  );
+  let isDark = useTheme().base !== "light", awaitingServiceSnippet = shouldWaitForServiceSnippet(storyParameters, storyPrepared), code = parameter.source?.code || codeSnippet.source || (awaitingServiceSnippet ? "" : parameter.source?.originalSource);
+  return React.createElement(AddonPanel, { active: !!active }, React.createElement(SourceStyles, null, React.createElement(Source, { ...parameter.source, code, format: codeSnippet.format, dark: isDark })));
 };
 addons.register(ADDON_ID, (api) => {
   addons.add(PANEL_ID, {
@@ -68,7 +67,16 @@ addons.register(ADDON_ID, (api) => {
     match: ({ viewMode }) => viewMode === "story",
     render: ({ active }) => {
       let channel = api.getChannel(), currentStory = api.getCurrentStoryData(), lastEvent = channel?.last(SNIPPET_RENDERED)?.[0];
-      return React.createElement(CodePanel, { currentStoryId: currentStory?.id, lastEvent, active });
+      return React.createElement(
+        CodePanel,
+        {
+          currentStoryId: currentStory?.id,
+          storyParameters: currentStory?.parameters,
+          storyPrepared: currentStory?.prepared,
+          lastEvent,
+          active
+        }
+      );
     }
   });
 });

package/dist/mdx-loader.js

@@ -1,20 +1,20 @@
-import CJS_COMPAT_NODE_URL_6gmdae9o5xc from 'node:url';
-import CJS_COMPAT_NODE_PATH_6gmdae9o5xc from 'node:path';
-import CJS_COMPAT_NODE_MODULE_6gmdae9o5xc from "node:module";
+import CJS_COMPAT_NODE_URL_3yfiy933z03 from 'node:url';
+import CJS_COMPAT_NODE_PATH_3yfiy933z03 from 'node:path';
+import CJS_COMPAT_NODE_MODULE_3yfiy933z03 from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_6gmdae9o5xc.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_6gmdae9o5xc.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_6gmdae9o5xc.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_3yfiy933z03.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_3yfiy933z03.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_3yfiy933z03.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   compile
-} from "./_node-chunks/chunk-2WTY7RHL.js";
-import "./_node-chunks/chunk-BS47STAB.js";
-import "./_node-chunks/chunk-ZM6M6OKB.js";
-import "./_node-chunks/chunk-AR7B7DGI.js";
+} from "./_node-chunks/chunk-Q33Y654V.js";
+import "./_node-chunks/chunk-NDIMOQRQ.js";
+import "./_node-chunks/chunk-RDCEJST6.js";
+import "./_node-chunks/chunk-X327Z4QW.js";
 
 // src/mdx-loader.ts
 var DEFAULT_RENDERER = `

package/dist/preset.js

@@ -1,15 +1,15 @@
-import CJS_COMPAT_NODE_URL_6gmdae9o5xc from 'node:url';
-import CJS_COMPAT_NODE_PATH_6gmdae9o5xc from 'node:path';
-import CJS_COMPAT_NODE_MODULE_6gmdae9o5xc from "node:module";
+import CJS_COMPAT_NODE_URL_3yfiy933z03 from 'node:url';
+import CJS_COMPAT_NODE_PATH_3yfiy933z03 from 'node:path';
+import CJS_COMPAT_NODE_MODULE_3yfiy933z03 from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_6gmdae9o5xc.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_6gmdae9o5xc.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_6gmdae9o5xc.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_3yfiy933z03.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_3yfiy933z03.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_3yfiy933z03.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
-import "./_node-chunks/chunk-AR7B7DGI.js";
+import "./_node-chunks/chunk-X327Z4QW.js";
 
 // src/preset.ts
 import { isAbsolute as isAbsolute2 } from "node:path";
@@ -218,23 +218,46 @@ var importMetaResolve = (...args) => typeof import.meta.resolve != "function" &&
   }
 };
 
+// src/mdx-service/server.ts
+import { getComponentIdFromEntry as getComponentIdFromEntry2, groupBy as groupBy2, registerService } from "storybook/internal/common";
+import { Tag as Tag2 } from "storybook/internal/core-server";
+
 // src/manifest.ts
 import * as fs from "node:fs/promises";
 import * as path2 from "node:path";
-import { groupBy } from "storybook/internal/common";
-import { Tag, analyzeMdx } from "storybook/internal/core-server";
+import { getComponentIdFromEntry, groupBy } from "storybook/internal/common";
+import {
+  Tag,
+  analyzeMdx,
+  mdxManifestRef
+} from "storybook/internal/core-server";
 import { logger } from "storybook/internal/node-logger";
+
+// src/extract-docs-summary.ts
+function extractDocsSummary(content) {
+  let result = content;
+  result = result.replace(/^\s*import\s+(?:[\s\S]*?from\s+)?['"][^'"]+['"];?\s*$/gm, "");
+  let prevResult = "";
+  for (; prevResult !== result; )
+    prevResult = result, result = result.replace(/\{[^{}]*\}/g, "");
+  for (result = result.replace(/<[^>]+\/>/g, ""), prevResult = ""; prevResult !== result; )
+    prevResult = result, result = result.replace(/<(\w+)[^>]*>([\s\S]*?)<\/\1>/g, "$2");
+  if (result = result.replace(/<[^>]+>/g, ""), result = result.replace(/\s+/g, " ").trim(), !!result)
+    return result.length > 90 ? `${result.slice(0, 90)}...` : result;
+}
+
+// src/manifest.ts
 async function createDocsManifestEntry(entry) {
   let absolutePath = path2.join(process.cwd(), entry.importPath);
   try {
-    let content = await fs.readFile(absolutePath, "utf-8"), { summary } = await analyzeMdx(content);
+    let content = await fs.readFile(absolutePath, "utf-8"), { summary } = await analyzeMdx(content), derivedSummary = summary ?? extractDocsSummary(content);
     return {
       id: entry.id,
       name: entry.name,
       path: entry.importPath,
       title: entry.title,
       content,
-      ...summary && { summary }
+      ...derivedSummary !== void 0 && { summary: derivedSummary }
     };
   } catch (err) {
     return {
@@ -249,24 +272,39 @@ async function createDocsManifestEntry(entry) {
     };
   }
 }
-async function extractUnattachedDocsEntries(entries) {
-  if (entries.length === 0)
-    return {};
-  let entriesWithContent = await Promise.all(entries.map(createDocsManifestEntry));
-  return Object.fromEntries(entriesWithContent.map((entry) => [entry.id, entry]));
+function createDocsManifestRefEntry(entry, componentId) {
+  return {
+    id: entry.id,
+    name: entry.name,
+    mdx: { $ref: mdxManifestRef(componentId, entry.id) }
+  };
+}
+async function buildUnattachedDocs(entries, build) {
+  let docs2 = await Promise.all(
+    entries.map(async (entry) => [entry.id, await build(entry, entry.id)])
+  );
+  return Object.fromEntries(docs2);
 }
-async function extractAttachedDocsEntries(entries, existingComponents) {
+async function applyAttachedDocs(entries, existingComponents, build) {
   if (!existingComponents || entries.length === 0)
     return existingComponents;
-  let entriesWithContent = await Promise.all(entries.map(createDocsManifestEntry));
-  for (let docsEntry of entriesWithContent) {
-    let componentId = docsEntry.id.split("--")[0], component = existingComponents.components[componentId];
-    component && (component.docs || (component.docs = {}), component.docs[docsEntry.id] = docsEntry);
+  let docs2 = await Promise.all(
+    entries.map(async (entry) => {
+      let componentId = getComponentIdFromEntry(entry);
+      return { componentId, doc: await build(entry, componentId) };
+    })
+  ), components = { ...existingComponents.components };
+  for (let { componentId, doc } of docs2) {
+    let component = components[componentId] ?? { id: componentId, name: componentId };
+    components[componentId] = {
+      ...component,
+      docs: { ...component.docs, [doc.id]: doc }
+    };
   }
-  return existingComponents;
+  return { ...existingComponents, components };
 }
-var manifests = async (existingManifests = {}, { manifestEntries }) => {
-  let startPerformance = performance.now(), docsEntries = manifestEntries.filter(
+var manifests = async (existingManifests = {}, { manifestEntries, presets }) => {
+  let startPerformance = performance.now(), features = await presets?.apply?.("features"), useMdxService = features?.experimentalDocgenServer === !0 && features?.componentsManifest === !0, docsEntries = manifestEntries.filter(
     (entry) => entry.type === "docs"
   );
   if (docsEntries.length === 0)
@@ -283,20 +321,398 @@ var manifests = async (existingManifests = {}, { manifestEntries }) => {
   });
   if (unattachedEntries.length === 0 && attachedEntries.length === 0)
     return existingManifests;
-  let existingManifestsWithDocs = existingManifests, [unattachedDocs, updatedComponents] = await Promise.all([
-    extractUnattachedDocsEntries(unattachedEntries),
-    extractAttachedDocsEntries(attachedEntries, existingManifestsWithDocs.components)
+  let existingManifestsWithDocs = existingManifests, build = useMdxService ? createDocsManifestRefEntry : createDocsManifestEntry, [unattachedDocs, updatedComponents] = await Promise.all([
+    buildUnattachedDocs(unattachedEntries, build),
+    applyAttachedDocs(attachedEntries, existingManifestsWithDocs.components, build)
   ]), processedCount = unattachedEntries.length + attachedEntries.length;
   logger.verbose(
     `Docs manifest generation took ${performance.now() - startPerformance}ms for ${processedCount} entries (${unattachedEntries.length} unattached, ${attachedEntries.length} attached)`
   );
   let result = { ...existingManifestsWithDocs };
   return Object.keys(unattachedDocs).length > 0 && (result.docs = {
-    v: 0,
+    v: useMdxService ? 1 : 0,
     docs: unattachedDocs
   }), updatedComponents && (result.components = updatedComponents), result;
 };
 
+// src/mdx-service/definition.ts
+import {
+  MDX_SERVICE_ID,
+  mdxQueryStaticPath
+} from "storybook/internal/core-server";
+
+// ../../../node_modules/valibot/dist/index.mjs
+var store$4, DEFAULT_CONFIG = {
+  lang: void 0,
+  message: void 0,
+  abortEarly: void 0,
+  abortPipeEarly: void 0
+};
+function getGlobalConfig(config$1) {
+  return !config$1 && !store$4 ? DEFAULT_CONFIG : {
+    lang: config$1?.lang ?? store$4?.lang,
+    message: config$1?.message,
+    abortEarly: config$1?.abortEarly ?? store$4?.abortEarly,
+    abortPipeEarly: config$1?.abortPipeEarly ?? store$4?.abortPipeEarly
+  };
+}
+var store$3;
+function getGlobalMessage(lang) {
+  return store$3?.get(lang);
+}
+var store$2;
+function getSchemaMessage(lang) {
+  return store$2?.get(lang);
+}
+var store$1;
+function getSpecificMessage(reference, lang) {
+  return store$1?.get(reference)?.get(lang);
+}
+function _stringify(input) {
+  let type = typeof input;
+  return type === "string" ? `"${input}"` : type === "number" || type === "bigint" || type === "boolean" ? `${input}` : type === "object" || type === "function" ? (input && Object.getPrototypeOf(input)?.constructor?.name) ?? "null" : type;
+}
+function _addIssue(context, label, dataset, config$1, other) {
+  let input = other && "input" in other ? other.input : dataset.value, expected = other?.expected ?? context.expects ?? null, received = other?.received ?? _stringify(input), issue = {
+    kind: context.kind,
+    type: context.type,
+    input,
+    expected,
+    received,
+    message: `Invalid ${label}: ${expected ? `Expected ${expected} but r` : "R"}eceived ${received}`,
+    requirement: context.requirement,
+    path: other?.path,
+    issues: other?.issues,
+    lang: config$1.lang,
+    abortEarly: config$1.abortEarly,
+    abortPipeEarly: config$1.abortPipeEarly
+  }, isSchema = context.kind === "schema", message$1 = other?.message ?? context.message ?? getSpecificMessage(context.reference, issue.lang) ?? (isSchema ? getSchemaMessage(issue.lang) : null) ?? config$1.message ?? getGlobalMessage(issue.lang);
+  message$1 !== void 0 && (issue.message = typeof message$1 == "function" ? message$1(issue) : message$1), isSchema && (dataset.typed = !1), dataset.issues ? dataset.issues.push(issue) : dataset.issues = [issue];
+}
+var _standardCache = /* @__PURE__ */ new WeakMap();
+function _getStandardProps(context) {
+  let cached = _standardCache.get(context);
+  return cached || (cached = {
+    version: 1,
+    vendor: "valibot",
+    validate(value$1) {
+      return context["~run"]({ value: value$1 }, getGlobalConfig());
+    }
+  }, _standardCache.set(context, cached)), cached;
+}
+function _isValidObjectKey(object$1, key) {
+  return Object.prototype.hasOwnProperty.call(object$1, key) && key !== "__proto__" && key !== "prototype" && key !== "constructor";
+}
+var EMOJI_REGEX = new RegExp("^(?:[\\u{1F1E6}-\\u{1F1FF}]{2}|\\u{1F3F4}[\\u{E0061}-\\u{E007A}]{2}[\\u{E0030}-\\u{E0039}\\u{E0061}-\\u{E007A}]{1,3}\\u{E007F}|(?:\\p{Emoji}\\uFE0F\\u20E3?|\\p{Emoji_Modifier_Base}\\p{Emoji_Modifier}?|(?![\\p{Emoji_Modifier_Base}\\u{1F1E6}-\\u{1F1FF}])\\p{Emoji_Presentation})(?:\\u200D(?:\\p{Emoji}\\uFE0F\\u20E3?|\\p{Emoji_Modifier_Base}\\p{Emoji_Modifier}?|(?![\\p{Emoji_Modifier_Base}\\u{1F1E6}-\\u{1F1FF}])\\p{Emoji_Presentation}))*)+$", "u");
+function getFallback(schema, dataset, config$1) {
+  return typeof schema.fallback == "function" ? schema.fallback(dataset, config$1) : schema.fallback;
+}
+function getDefault(schema, dataset, config$1) {
+  return typeof schema.default == "function" ? schema.default(dataset, config$1) : schema.default;
+}
+function object(entries$1, message$1) {
+  return {
+    kind: "schema",
+    type: "object",
+    reference: object,
+    expects: "Object",
+    async: !1,
+    entries: entries$1,
+    message: message$1,
+    get "~standard"() {
+      return _getStandardProps(this);
+    },
+    "~run"(dataset, config$1) {
+      let input = dataset.value;
+      if (input && typeof input == "object") {
+        dataset.typed = !0, dataset.value = {};
+        for (let key in this.entries) {
+          let valueSchema = this.entries[key];
+          if (key in input || (valueSchema.type === "exact_optional" || valueSchema.type === "optional" || valueSchema.type === "nullish") && valueSchema.default !== void 0) {
+            let value$1 = key in input ? input[key] : getDefault(valueSchema), valueDataset = valueSchema["~run"]({ value: value$1 }, config$1);
+            if (valueDataset.issues) {
+              let pathItem = {
+                type: "object",
+                origin: "value",
+                input,
+                key,
+                value: value$1
+              };
+              for (let issue of valueDataset.issues)
+                issue.path ? issue.path.unshift(pathItem) : issue.path = [pathItem], dataset.issues?.push(issue);
+              if (dataset.issues || (dataset.issues = valueDataset.issues), config$1.abortEarly) {
+                dataset.typed = !1;
+                break;
+              }
+            }
+            valueDataset.typed || (dataset.typed = !1), dataset.value[key] = valueDataset.value;
+          } else if (valueSchema.fallback !== void 0) dataset.value[key] = getFallback(valueSchema);
+          else if (valueSchema.type !== "exact_optional" && valueSchema.type !== "optional" && valueSchema.type !== "nullish" && (_addIssue(this, "key", dataset, config$1, {
+            input: void 0,
+            expected: `"${key}"`,
+            path: [{
+              type: "object",
+              origin: "key",
+              input,
+              key,
+              value: input[key]
+            }]
+          }), config$1.abortEarly))
+            break;
+        }
+      } else _addIssue(this, "type", dataset, config$1);
+      return dataset;
+    }
+  };
+}
+function optional(wrapped, default_) {
+  return {
+    kind: "schema",
+    type: "optional",
+    reference: optional,
+    expects: `(${wrapped.expects} | undefined)`,
+    async: !1,
+    wrapped,
+    default: default_,
+    get "~standard"() {
+      return _getStandardProps(this);
+    },
+    "~run"(dataset, config$1) {
+      return dataset.value === void 0 && (this.default !== void 0 && (dataset.value = getDefault(this, dataset, config$1)), dataset.value === void 0) ? (dataset.typed = !0, dataset) : this.wrapped["~run"](dataset, config$1);
+    }
+  };
+}
+function record(key, value$1, message$1) {
+  return {
+    kind: "schema",
+    type: "record",
+    reference: record,
+    expects: "Object",
+    async: !1,
+    key,
+    value: value$1,
+    message: message$1,
+    get "~standard"() {
+      return _getStandardProps(this);
+    },
+    "~run"(dataset, config$1) {
+      let input = dataset.value;
+      if (input && typeof input == "object") {
+        dataset.typed = !0, dataset.value = {};
+        for (let entryKey in input) if (_isValidObjectKey(input, entryKey)) {
+          let entryValue = input[entryKey], keyDataset = this.key["~run"]({ value: entryKey }, config$1);
+          if (keyDataset.issues) {
+            let pathItem = {
+              type: "object",
+              origin: "key",
+              input,
+              key: entryKey,
+              value: entryValue
+            };
+            for (let issue of keyDataset.issues)
+              issue.path = [pathItem], dataset.issues?.push(issue);
+            if (dataset.issues || (dataset.issues = keyDataset.issues), config$1.abortEarly) {
+              dataset.typed = !1;
+              break;
+            }
+          }
+          let valueDataset = this.value["~run"]({ value: entryValue }, config$1);
+          if (valueDataset.issues) {
+            let pathItem = {
+              type: "object",
+              origin: "value",
+              input,
+              key: entryKey,
+              value: entryValue
+            };
+            for (let issue of valueDataset.issues)
+              issue.path ? issue.path.unshift(pathItem) : issue.path = [pathItem], dataset.issues?.push(issue);
+            if (dataset.issues || (dataset.issues = valueDataset.issues), config$1.abortEarly) {
+              dataset.typed = !1;
+              break;
+            }
+          }
+          (!keyDataset.typed || !valueDataset.typed) && (dataset.typed = !1), keyDataset.typed && (dataset.value[keyDataset.value] = valueDataset.value);
+        }
+      } else _addIssue(this, "type", dataset, config$1);
+      return dataset;
+    }
+  };
+}
+function string(message$1) {
+  return {
+    kind: "schema",
+    type: "string",
+    reference: string,
+    expects: "string",
+    async: !1,
+    message: message$1,
+    get "~standard"() {
+      return _getStandardProps(this);
+    },
+    "~run"(dataset, config$1) {
+      return typeof dataset.value == "string" ? dataset.typed = !0 : _addIssue(this, "type", dataset, config$1), dataset;
+    }
+  };
+}
+function undefined_(message$1) {
+  return {
+    kind: "schema",
+    type: "undefined",
+    reference: undefined_,
+    expects: "undefined",
+    async: !1,
+    message: message$1,
+    get "~standard"() {
+      return _getStandardProps(this);
+    },
+    "~run"(dataset, config$1) {
+      return dataset.value === void 0 ? dataset.typed = !0 : _addIssue(this, "type", dataset, config$1), dataset;
+    }
+  };
+}
+function void_(message$1) {
+  return {
+    kind: "schema",
+    type: "void",
+    reference: void_,
+    expects: "void",
+    async: !1,
+    message: message$1,
+    get "~standard"() {
+      return _getStandardProps(this);
+    },
+    "~run"(dataset, config$1) {
+      return dataset.value === void 0 ? dataset.typed = !0 : _addIssue(this, "type", dataset, config$1), dataset;
+    }
+  };
+}
+
+// src/mdx-service/definition.ts
+import { defineService } from "storybook/open-service";
+var mdxInputSchema = object({ id: string() }), mdxErrorSchema = object({
+  name: string(),
+  message: string()
+}), mdxDocPayloadSchema = object({
+  id: string(),
+  name: string(),
+  path: string(),
+  title: string(),
+  content: optional(string()),
+  summary: optional(string()),
+  error: optional(mdxErrorSchema)
+}), mdxPayloadSchema = object({
+  id: string(),
+  name: string(),
+  docs: record(string(), mdxDocPayloadSchema)
+}), mdxOutputSchema = optional(mdxPayloadSchema), mdxServiceDef = defineService({
+  id: MDX_SERVICE_ID,
+  internal: !0,
+  // this service really only ensures that the MDX docs are available in manifests, so there is no need to expose it to the public API
+  initialState: { components: {} },
+  queries: {
+    mdxForComponent: {
+      input: mdxInputSchema,
+      output: mdxOutputSchema,
+      handler: (input, ctx) => ctx.self.state.components[input.id],
+      load: async (input, ctx) => {
+        await ctx.self.commands._extractMdxForComponent(input);
+      },
+      staticPath: (input) => mdxQueryStaticPath(input.id)
+    },
+    mdxForAllComponents: {
+      input: void_(),
+      output: record(string(), mdxPayloadSchema),
+      handler: (_input, ctx) => ctx.self.state.components,
+      load: async (_input, ctx) => {
+        await ctx.self.commands._extractAllMdx(void 0);
+      }
+    }
+  },
+  commands: {
+    _extractMdxForComponent: {
+      internal: !0,
+      input: mdxInputSchema,
+      output: mdxOutputSchema
+    },
+    _extractAllMdx: {
+      internal: !0,
+      input: undefined_(),
+      output: void_()
+    }
+  }
+});
+
+// src/mdx-service/server.ts
+function groupMdxEntriesByComponent(index) {
+  return groupBy2(
+    Object.values(index.entries).filter(
+      (entry) => entry.type === "docs" && ((entry.tags?.includes(Tag2.ATTACHED_MDX) ?? !1) || (entry.tags?.includes(Tag2.UNATTACHED_MDX) ?? !1))
+    ),
+    (entry) => entry.tags?.includes(Tag2.ATTACHED_MDX) ? getComponentIdFromEntry2(entry) : entry.id
+  );
+}
+var defaultMdxProvider = async ({ componentId, entries }) => {
+  if (entries.length === 0)
+    return;
+  let docs2 = await Promise.all(entries.map(createDocsManifestEntry));
+  return {
+    id: componentId,
+    name: componentId,
+    docs: Object.fromEntries(docs2.map((doc) => [doc.id, doc]))
+  };
+};
+function registerMdxService({
+  getIndex,
+  provider = defaultMdxProvider
+}) {
+  return registerService(mdxServiceDef, {
+    queries: {
+      mdxForComponent: {
+        staticInputs: async () => {
+          let index = await getIndex(), grouped = groupMdxEntriesByComponent(index);
+          return Object.keys(grouped).map((id) => ({ id }));
+        }
+      }
+    },
+    commands: {
+      _extractMdxForComponent: {
+        handler: async (input, ctx) => {
+          let index = await getIndex(), entries = groupMdxEntriesByComponent(index)[input.id] ?? [];
+          if (entries.length === 0)
+            return;
+          let payload = await provider({
+            componentId: input.id,
+            entries
+          });
+          if (payload)
+            return ctx.self.setState((state) => {
+              state.components[input.id] = payload;
+            }), payload;
+        }
+      },
+      _extractAllMdx: {
+        handler: async (_input, ctx) => {
+          let index = await getIndex(), grouped = groupMdxEntriesByComponent(index), extracted = await Promise.all(
+            Object.entries(grouped).map(async ([id, entries]) => {
+              let payload = await provider({ componentId: id, entries });
+              return payload ? [id, payload] : void 0;
+            })
+          );
+          ctx.self.setState((state) => {
+            for (let result of extracted) {
+              if (!result)
+                continue;
+              let [id, payload] = result;
+              state.components[id] = payload;
+            }
+          });
+        }
+      }
+    }
+  });
+}
+
 // src/docgen.ts
 var experimental_docgenProvider = async (nextDocgen) => async (input) => {
   let downstream = await nextDocgen(input);
@@ -322,7 +738,7 @@ var getResolvedReact = async (options) => {
   };
 };
 async function webpack(webpackConfig = {}, options) {
-  let { module = {} } = webpackConfig, { csfPluginOptions = {}, mdxPluginOptions = {} } = options, enrichCsf = await options.presets.apply("experimental_enrichCsf"), rehypeSlug = (await import("./_node-chunks/rehype-slug-EPMUVHIS.js")).default, rehypeExternalLinks = (await import("./_node-chunks/rehype-external-links-QE2YWBRR.js")).default, mdxLoaderOptions = await options.presets.apply("mdxLoaderOptions", {
+  let { module = {} } = webpackConfig, { csfPluginOptions = {}, mdxPluginOptions = {} } = options, enrichCsf = await options.presets.apply("experimental_enrichCsf"), rehypeSlug = (await import("./_node-chunks/rehype-slug-D2I7KZ4I.js")).default, rehypeExternalLinks = (await import("./_node-chunks/rehype-external-links-2RDYL6C3.js")).default, mdxLoaderOptions = await options.presets.apply("mdxLoaderOptions", {
     ...mdxPluginOptions,
     mdxCompileOptions: {
       providerImportSource: fileURLToPath2(
@@ -400,7 +816,7 @@ var docs = (input = {}, options) => {
 }, addons = [
   import.meta.resolve("@storybook/react-dom-shim/preset")
 ], viteFinal = async (config, options) => {
-  let { plugins = [] } = config, { mdxPlugin } = await import("./_node-chunks/mdx-plugin-R2MYDMMD.js"), { react, reactDom, mdx } = await getResolvedReact(options), packageDeduplicationPlugin = {
+  let { plugins = [] } = config, { mdxPlugin } = await import("./_node-chunks/mdx-plugin-XDOSSZCW.js"), { react, reactDom, mdx } = await getResolvedReact(options), packageDeduplicationPlugin = {
     name: "storybook:package-deduplication",
     enforce: "pre",
     config: () => ({
@@ -423,7 +839,15 @@ var docs = (input = {}, options) => {
   react: existing?.react ?? resolvePackageDir("react"),
   reactDom: existing?.reactDom ?? resolvePackageDir("react-dom"),
   mdx: existing?.mdx ?? fileURLToPath2(import.meta.resolve("@mdx-js/react"))
-}), optimizeViteDeps = [
+}), services = async (_value, options) => {
+  let features = await options.presets.apply("features");
+  if (features?.experimentalDocgenServer && features?.componentsManifest && !options.ignorePreview) {
+    let generator = await options.presets.apply("storyIndexGenerator");
+    registerMdxService({
+      getIndex: () => generator.getIndex()
+    });
+  }
+}, optimizeViteDeps = [
   "@storybook/addon-docs",
   "@storybook/addon-docs/blocks",
   "@storybook/addon-docs > @mdx-js/react",
@@ -439,6 +863,7 @@ export {
   manifests as experimental_manifests,
   optimizeViteDeps,
   resolvedReact,
+  services,
   viteFinal,
   webpackX as webpack
 };