@apiboost/omnispec 1.0.0

package/dist/esm/chunks/AsyncApiSpec-C3lsUpZk.js

@@ -0,0 +1,817 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useCallback, useState, useMemo } from 'react';
+import { css, cx } from '@emotion/css';
+import { a as useSpecFetcher, m as mq, r as resolveSchemaStyle, S as SpecType, T as ThemeProvider, L as LoadingScreen, b as SpecStatusScreen, E as ErrorMessage, h as buildSidebar, C as ConfigProvider, e as DocLayout, N as NavTree } from './useSpecFetcher-CZvAnU7Z.js';
+import { M as MarkdownRenderer, d as ExpandableCard, f as MethodBar, T as Tabs, t as SchemaTree, A as schemaToNodes, C as CodeBlock, x as generateExample, a as Collapsible, w as flattenNavItemIds, G as useScrollSpy, H as ExpandProvider, v as SpecToolbar, z as resolveDownloadLink, u as SearchBar } from './Collapsible-DA6-nS46.js';
+import { E as ErrorBoundary } from './ErrorBoundary-posRNrbt.js';
+import { r as resolveRefs, p as parse } from './ref-resolver-BIrHJOjz.js';
+import '@emotion/styled';
+import './ssrf-guard-CsZoYdEq.js';
+
+async function parseAsyncApiSpec(specInput) {
+  const raw = typeof specInput === "string" ? parseSpecString(specInput) : specInput;
+  const api = await resolveRefs(raw);
+  const majorVersion = parseInt(api.asyncapi.split(".")[0], 10);
+  const isV3 = majorVersion >= 3;
+  const servers = extractServers(api);
+  const channels = isV3 ? extractChannelsV3(api) : extractChannelsV2(api);
+  const components = extractComponents(api);
+  const root = api;
+  const tags = api.tags?.map((tag) => {
+    const raw2 = tag;
+    return {
+      name: tag.name,
+      description: tag.description,
+      displayName: raw2["x-displayName"],
+      externalDocs: raw2.externalDocs
+    };
+  })?.filter((tag) => !tag["x-internal"]);
+  return {
+    title: api.info.title,
+    description: api.info.description,
+    version: api.info.version,
+    specVersion: api.asyncapi,
+    servers,
+    channels: channels.filter((ch) => !ch.xInternal),
+    components,
+    tags,
+    tagGroups: root["x-tagGroups"],
+    externalDocs: api.externalDocs,
+    contact: api.info.contact,
+    license: api.info.license,
+    termsOfService: api.info.termsOfService,
+    logo: api.info["x-logo"]
+  };
+}
+function extractServers(api) {
+  if (!api.servers) return [];
+  if (Array.isArray(api.servers)) {
+    return api.servers.map((s, idx) => ({
+      name: s.name ?? `server-${idx}`,
+      url: s.host ? `${s.protocol}://${s.host}${s.pathname ?? ""}` : s.url ?? "",
+      protocol: s.protocol,
+      protocolVersion: s.protocolVersion,
+      description: s.description,
+      variables: s.variables,
+      security: s.security
+    }));
+  }
+  return Object.entries(api.servers).map(([name, s]) => ({
+    name,
+    url: s.host ? `${s.protocol}://${s.host}${s.pathname ?? ""}` : s.url ?? "",
+    protocol: s.protocol,
+    protocolVersion: s.protocolVersion,
+    description: s.description,
+    variables: s.variables,
+    security: s.security
+  }));
+}
+function extractChannelsV2(api) {
+  if (!api.channels) return [];
+  return Object.entries(api.channels).map(([channelName, ch]) => {
+    const operations = [];
+    if (ch.publish) {
+      operations.push(convertOperationV2("publish", ch.publish));
+    }
+    if (ch.subscribe) {
+      operations.push(convertOperationV2("subscribe", ch.subscribe));
+    }
+    const raw = ch;
+    return {
+      name: channelName,
+      address: channelName,
+      description: ch.description,
+      operations: operations.filter((op) => !op.xInternal),
+      parameters: ch.parameters,
+      bindings: ch.bindings,
+      xInternal: raw["x-internal"]
+    };
+  });
+}
+function convertOperationV2(action, op) {
+  let message;
+  if (op.message) {
+    if ("oneOf" in op.message) {
+      message = convertMessage(op.message.oneOf[0]);
+    } else {
+      message = convertMessage(op.message);
+    }
+  }
+  const raw = op;
+  return {
+    action,
+    operationId: op.operationId,
+    summary: op.summary,
+    description: op.description,
+    message,
+    tags: op.tags,
+    bindings: op.bindings,
+    xBadges: raw["x-badges"],
+    xInternal: raw["x-internal"]
+  };
+}
+function extractChannelsV3(api) {
+  if (!api.channels) return [];
+  const channelMap = /* @__PURE__ */ new Map();
+  for (const [channelName, ch] of Object.entries(api.channels)) {
+    const raw = ch;
+    channelMap.set(channelName, {
+      name: channelName,
+      address: ch.address ?? channelName,
+      description: ch.description,
+      operations: [],
+      parameters: ch.parameters,
+      bindings: ch.bindings,
+      xInternal: raw["x-internal"]
+    });
+  }
+  if (api.operations) {
+    for (const [, op] of Object.entries(api.operations)) {
+      const channelRef = op.channel;
+      let channelName;
+      if (channelRef && "$ref" in channelRef && typeof channelRef.$ref === "string") {
+        channelName = channelRef.$ref.split("/").pop();
+      }
+      const messages = [];
+      if (op.messages) {
+        for (const msg of op.messages) {
+          if ("$ref" in msg) continue;
+          messages.push(convertMessage(msg));
+        }
+      }
+      const raw = op;
+      const operation = {
+        action: op.action,
+        summary: op.summary,
+        description: op.description,
+        message: messages[0],
+        tags: op.tags,
+        bindings: op.bindings,
+        xBadges: raw["x-badges"],
+        xInternal: raw["x-internal"]
+      };
+      if (operation.xInternal) continue;
+      if (channelName && channelMap.has(channelName)) {
+        channelMap.get(channelName).operations.push(operation);
+      }
+    }
+  }
+  return Array.from(channelMap.values());
+}
+function convertMessage(msg) {
+  return {
+    name: msg.name,
+    title: msg.title,
+    summary: msg.summary,
+    description: msg.description,
+    contentType: msg.contentType,
+    payload: msg.payload,
+    headers: msg.headers,
+    correlationId: msg.correlationId,
+    tags: msg.tags,
+    examples: msg.examples,
+    bindings: msg.bindings
+  };
+}
+function extractComponents(api) {
+  return {
+    schemas: api.components?.schemas ?? {},
+    messages: api.components?.messages ?? {}
+  };
+}
+function parseSpecString(input) {
+  const trimmed = input.trim();
+  if (trimmed.startsWith("{")) {
+    try {
+      return JSON.parse(trimmed);
+    } catch {
+    }
+  }
+  return parse(trimmed);
+}
+
+function useAsyncApiSpec(spec) {
+  const parser = useCallback(async (raw) => {
+    return parseAsyncApiSpec(raw);
+  }, []);
+  return useSpecFetcher(spec, parser);
+}
+
+const containerStyle$2 = css({
+  marginBottom: "32px",
+  paddingBottom: "24px",
+  borderBottom: "1px solid var(--omnispec-border-color)"
+});
+const titleStyle$2 = css({
+  margin: "0 0 4px",
+  fontSize: "var(--omnispec-h2-font-size)",
+  color: "var(--omnispec-h2-color)",
+  fontWeight: 700,
+  display: "inline"
+});
+const versionStyle$1 = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-muted)",
+  marginLeft: "12px",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const specBadgeStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-color-primary)",
+  border: "1px solid var(--omnispec-color-primary)",
+  borderRadius: "4px",
+  padding: "1px 6px",
+  marginLeft: "8px",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const metaStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)",
+  marginTop: "4px"
+});
+const linkStyle = css({
+  color: "var(--omnispec-fg-link)",
+  textDecoration: "none",
+  "&:hover": {
+    textDecoration: "underline"
+  }
+});
+function AsyncOverview({ spec }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx("omnispec-async-overview", containerStyle$2), children: [
+    /* @__PURE__ */ jsx("h1", { className: titleStyle$2, children: spec.title }),
+    /* @__PURE__ */ jsxs("span", { className: versionStyle$1, children: [
+      "v",
+      spec.version
+    ] }),
+    /* @__PURE__ */ jsxs("span", { className: specBadgeStyle, children: [
+      "AsyncAPI ",
+      spec.specVersion
+    ] }),
+    spec.description && /* @__PURE__ */ jsx(MarkdownRenderer, { content: spec.description }),
+    spec.contact && /* @__PURE__ */ jsxs("div", { className: metaStyle, children: [
+      spec.contact.name && /* @__PURE__ */ jsxs("span", { children: [
+        "Contact: ",
+        spec.contact.name
+      ] }),
+      spec.contact.email && /* @__PURE__ */ jsxs("span", { children: [
+        " <",
+        /* @__PURE__ */ jsx("a", { href: `mailto:${spec.contact.email}`, className: linkStyle, children: spec.contact.email }),
+        ">"
+      ] }),
+      spec.contact.url && /* @__PURE__ */ jsxs("span", { children: [
+        " \xB7 ",
+        /* @__PURE__ */ jsx("a", { href: spec.contact.url, target: "_blank", rel: "noopener noreferrer", className: linkStyle, children: spec.contact.url })
+      ] })
+    ] }),
+    spec.license && /* @__PURE__ */ jsxs("div", { className: metaStyle, children: [
+      "License: ",
+      spec.license.url ? /* @__PURE__ */ jsx("a", { href: spec.license.url, target: "_blank", rel: "noopener noreferrer", className: linkStyle, children: spec.license.name }) : spec.license.name
+    ] }),
+    spec.externalDocs && /* @__PURE__ */ jsx("div", { className: metaStyle, children: /* @__PURE__ */ jsx("a", { href: spec.externalDocs.url, target: "_blank", rel: "noopener noreferrer", className: linkStyle, children: spec.externalDocs.description ?? "External Documentation" }) })
+  ] });
+}
+
+const protocolColors = {
+  kafka: "#231F20",
+  "kafka-secure": "#231F20",
+  mqtt: "#660066",
+  "mqtt5": "#660066",
+  amqp: "#FF6600",
+  "amqp1": "#FF6600",
+  ws: "#4A90D9",
+  wss: "#4A90D9",
+  http: "var(--omnispec-color-get)",
+  https: "var(--omnispec-color-get)",
+  nats: "#27AAE1",
+  redis: "#DC382D",
+  sns: "#FF9900",
+  sqs: "#FF9900",
+  stomp: "#6DB33F",
+  mercure: "#1D1D1D"
+};
+const badgeBase = css({
+  display: "inline-block",
+  padding: "2px 8px",
+  borderRadius: "4px",
+  fontSize: "10px",
+  fontWeight: 700,
+  fontFamily: "var(--omnispec-font-mono)",
+  color: "#ffffff",
+  letterSpacing: "0.5px"
+});
+const versionStyle = css({
+  fontWeight: 400,
+  opacity: 0.8
+});
+function ProtocolBadge({ protocol, version }) {
+  const color = protocolColors[protocol.toLowerCase()] ?? "var(--omnispec-fg-muted)";
+  return /* @__PURE__ */ jsxs("span", { className: cx(badgeBase, css({ backgroundColor: color })), children: [
+    protocol.toUpperCase(),
+    version && /* @__PURE__ */ jsxs("span", { className: versionStyle, children: [
+      " ",
+      version
+    ] })
+  ] });
+}
+
+const containerStyle$1 = css({
+  marginBottom: "24px"
+});
+const titleStyle$1 = css({
+  margin: "0 0 12px",
+  fontSize: "var(--omnispec-h3-font-size)",
+  color: "var(--omnispec-h3-color)",
+  fontWeight: 600
+});
+const gridStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "8px"
+});
+const cardStyle = css({
+  padding: "12px",
+  border: "1px solid var(--omnispec-border-color)",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "var(--omnispec-bg-secondary)",
+  "&:hover": {
+    borderColor: "var(--omnispec-color-primary)"
+  }
+});
+const cardHeaderStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "8px",
+  marginBottom: "6px"
+});
+const serverNameStyle = css({
+  fontWeight: 600,
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-primary)"
+});
+const urlStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-code)",
+  display: "block",
+  marginBottom: "4px"
+});
+const descriptionStyle = css({
+  margin: "4px 0 0",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-secondary)"
+});
+const variablesStyle = css({
+  marginTop: "8px",
+  fontSize: "var(--omnispec-font-size-xs)"
+});
+const varRowStyle = css({
+  display: "flex",
+  gap: "6px",
+  marginBottom: "2px"
+});
+const varNameStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  color: "var(--omnispec-fg-primary)",
+  fontWeight: 600
+});
+const varDefaultStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  color: "var(--omnispec-fg-muted)"
+});
+const varDescStyle = css({
+  color: "var(--omnispec-fg-secondary)"
+});
+function ServerList({ servers }) {
+  if (servers.length === 0) return null;
+  return /* @__PURE__ */ jsxs("div", { className: cx("omnispec-async-servers", containerStyle$1), children: [
+    /* @__PURE__ */ jsx("h3", { className: titleStyle$1, children: "Servers" }),
+    /* @__PURE__ */ jsx("div", { className: gridStyle, children: servers.map((server) => /* @__PURE__ */ jsxs("div", { className: cardStyle, children: [
+      /* @__PURE__ */ jsxs("div", { className: cardHeaderStyle, children: [
+        /* @__PURE__ */ jsx("span", { className: serverNameStyle, children: server.name }),
+        /* @__PURE__ */ jsx(ProtocolBadge, { protocol: server.protocol, version: server.protocolVersion })
+      ] }),
+      /* @__PURE__ */ jsx("code", { className: urlStyle, children: server.url }),
+      server.description && /* @__PURE__ */ jsx("p", { className: descriptionStyle, children: server.description }),
+      server.variables && Object.entries(server.variables).length > 0 && /* @__PURE__ */ jsx("div", { className: variablesStyle, children: Object.entries(server.variables).map(([name, variable]) => /* @__PURE__ */ jsxs("div", { className: varRowStyle, children: [
+        /* @__PURE__ */ jsx("code", { className: varNameStyle, children: name }),
+        variable.default && /* @__PURE__ */ jsxs("span", { className: varDefaultStyle, children: [
+          "= ",
+          variable.default
+        ] }),
+        variable.description && /* @__PURE__ */ jsx("span", { className: varDescStyle, children: variable.description })
+      ] }, name)) })
+    ] }, server.name)) })
+  ] });
+}
+
+const actionLabels = {
+  publish: "PUB",
+  subscribe: "SUB",
+  send: "SEND",
+  receive: "RECV"
+};
+const actionColors = {
+  publish: "var(--omnispec-color-publish)",
+  subscribe: "var(--omnispec-color-subscribe)",
+  send: "var(--omnispec-color-publish)",
+  receive: "var(--omnispec-color-subscribe)"
+};
+function ChannelDetail({ channel, id, expandAll, expandGeneration }) {
+  const primaryAction = channel.operations[0]?.action;
+  const primaryLabel = actionLabels[primaryAction] ?? primaryAction?.toUpperCase() ?? "";
+  const primaryColor = actionColors[primaryAction] ?? "var(--omnispec-fg-muted)";
+  return /* @__PURE__ */ jsxs(
+    ExpandableCard,
+    {
+      id,
+      title: channel.address,
+      rightLabel: `${channel.operations.length} ${channel.operations.length === 1 ? "operation" : "operations"}`,
+      expandAll,
+      expandGeneration,
+      children: [
+        /* @__PURE__ */ jsx(MethodBar, { label: primaryLabel, path: channel.address, color: primaryColor }),
+        /* @__PURE__ */ jsxs("div", { className: bodyStyle, children: [
+          channel.description && /* @__PURE__ */ jsx("div", { className: sectionStyle, children: /* @__PURE__ */ jsx(MarkdownRenderer, { content: channel.description }) }),
+          channel.parameters && Object.keys(channel.parameters).length > 0 && /* @__PURE__ */ jsxs("div", { className: sectionStyle, children: [
+            /* @__PURE__ */ jsx("h4", { className: sectionTitleStyle, children: "Parameters" }),
+            /* @__PURE__ */ jsx("div", { className: paramListStyle, children: Object.entries(channel.parameters).map(([name, param]) => {
+              const paramType = param.schema?.type;
+              return /* @__PURE__ */ jsxs("div", { className: paramRowStyle, children: [
+                /* @__PURE__ */ jsxs("div", { className: paramHeaderStyle, children: [
+                  /* @__PURE__ */ jsx("span", { className: paramNameStyle, children: name }),
+                  paramType && /* @__PURE__ */ jsx("pre", { className: typeBadgeStyle, children: paramType })
+                ] }),
+                param.description && /* @__PURE__ */ jsx("p", { className: paramDescStyle, children: param.description })
+              ] }, name);
+            }) })
+          ] }),
+          channel.operations.map((op, idx) => /* @__PURE__ */ jsxs("div", { className: operationStyle, children: [
+            /* @__PURE__ */ jsxs("div", { className: opHeaderStyle, children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cx(actionBadgeBase, css({
+                    backgroundColor: actionColors[op.action] ?? "var(--omnispec-fg-muted)"
+                  })),
+                  children: actionLabels[op.action] ?? op.action.toUpperCase()
+                }
+              ),
+              op.operationId && /* @__PURE__ */ jsx("span", { className: opIdStyle, children: op.operationId }),
+              op.summary && /* @__PURE__ */ jsx("span", { className: opSummaryStyle, children: op.summary })
+            ] }),
+            op.description && /* @__PURE__ */ jsx("div", { className: sectionStyle, children: /* @__PURE__ */ jsx(MarkdownRenderer, { content: op.description }) }),
+            op.message && /* @__PURE__ */ jsxs("div", { className: sectionStyle, children: [
+              /* @__PURE__ */ jsxs("h4", { className: sectionTitleStyle, children: [
+                "Message",
+                op.message.title && /* @__PURE__ */ jsxs("span", { className: messageTitleStyle, children: [
+                  " \u2014 ",
+                  op.message.title
+                ] })
+              ] }),
+              op.message.summary && /* @__PURE__ */ jsx("p", { className: messageSummaryStyle, children: op.message.summary }),
+              op.message.contentType && /* @__PURE__ */ jsx("code", { className: contentTypeStyle, children: op.message.contentType }),
+              op.message.payload && /* @__PURE__ */ jsx(
+                Tabs,
+                {
+                  tabs: [
+                    {
+                      id: `schema-${idx}`,
+                      label: "Payload Schema",
+                      content: /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(op.message.payload) })
+                    },
+                    {
+                      id: `example-${idx}`,
+                      label: "Example",
+                      content: /* @__PURE__ */ jsx(
+                        CodeBlock,
+                        {
+                          code: JSON.stringify(generateExample(op.message.payload), null, 2),
+                          language: "json"
+                        }
+                      )
+                    }
+                  ]
+                }
+              ),
+              op.message.headers && /* @__PURE__ */ jsxs("div", { className: headersWrapStyle, children: [
+                /* @__PURE__ */ jsx("h4", { className: sectionTitleStyle, children: "Headers" }),
+                /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(op.message.headers) })
+              ] })
+            ] })
+          ] }, idx))
+        ] })
+      ]
+    }
+  );
+}
+const bodyStyle = css({
+  padding: "0.75rem 1rem",
+  [mq.desktop]: {
+    padding: "1rem 1.25rem"
+  }
+});
+const sectionStyle = css({
+  marginBottom: "24px"
+});
+const sectionTitleStyle = css({
+  margin: "0 0 12px",
+  fontSize: "var(--omnispec-font-size-md)",
+  fontWeight: 700,
+  color: "var(--omnispec-fg-primary)",
+  letterSpacing: "0.02em"
+});
+const paramListStyle = css({
+  display: "flex",
+  flexDirection: "column"
+});
+const paramRowStyle = css({
+  padding: "12px 0"
+});
+const paramHeaderStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "8px",
+  flexWrap: "wrap"
+});
+const paramNameStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 700,
+  backgroundColor: "transparent",
+  padding: 0
+});
+const typeBadgeStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontWeight: 400
+});
+const paramDescStyle = css({
+  margin: "4px 0 0",
+  fontSize: "var(--omnispec-font-size-base)",
+  color: "var(--omnispec-fg-secondary)",
+  lineHeight: 1.5
+});
+const operationStyle = css({
+  padding: "12px 0",
+  borderTop: "1px solid var(--omnispec-border-color)"
+});
+const opHeaderStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "8px",
+  marginBottom: "8px"
+});
+const actionBadgeBase = css({
+  display: "inline-block",
+  padding: "2px 6px",
+  borderRadius: "3px",
+  fontSize: "9px",
+  fontWeight: 700,
+  fontFamily: "var(--omnispec-font-mono)",
+  color: "#ffffff",
+  letterSpacing: "0.5px"
+});
+const opIdStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 700,
+  backgroundColor: "transparent",
+  padding: 0
+});
+const opSummaryStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)"
+});
+const messageTitleStyle = css({
+  fontWeight: 400,
+  color: "var(--omnispec-fg-primary)"
+});
+const messageSummaryStyle = css({
+  margin: "0 0 8px",
+  fontSize: "var(--omnispec-font-size-base)",
+  color: "var(--omnispec-fg-secondary)"
+});
+const contentTypeStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)",
+  display: "block",
+  marginBottom: "8px",
+  backgroundColor: "transparent",
+  padding: 0
+});
+const headersWrapStyle = css({
+  marginTop: "16px"
+});
+
+function ComponentsSection({ components }) {
+  const schemas = Object.entries(components.schemas);
+  if (schemas.length === 0) return null;
+  return /* @__PURE__ */ jsxs("div", { className: `omnispec-async-components ${containerStyle}`, id: "schemas", children: [
+    /* @__PURE__ */ jsx("h2", { className: titleStyle, children: "Schemas" }),
+    /* @__PURE__ */ jsx("div", { className: schemaWrapperStyle, children: schemas.map(([name, schema]) => /* @__PURE__ */ jsx("div", { className: schemaStyle, id: `schema-${name}`, children: /* @__PURE__ */ jsx(
+      Collapsible,
+      {
+        title: /* @__PURE__ */ jsx("code", { className: schemaNameStyle, children: name }),
+        defaultOpen: false,
+        children: /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(schema) })
+      }
+    ) }, name)) })
+  ] });
+}
+const containerStyle = css({
+  marginTop: "2rem",
+  paddingTop: "1.5rem",
+  borderTop: "1px solid var(--omnispec-border-color)",
+  [mq.mobile]: {
+    borderTop: "none",
+    marginTop: "1.5rem",
+    paddingTop: "1rem"
+  }
+});
+const titleStyle = css({
+  margin: "0 0 16px",
+  fontSize: "var(--omnispec-h2-font-size)",
+  color: "var(--omnispec-h2-color)",
+  fontWeight: 700
+});
+const schemaWrapperStyle = css({
+  border: "1px solid var(--omnispec-border-color)",
+  borderRadius: "8px",
+  padding: "1.5rem 1rem"
+});
+const schemaStyle = css({
+  marginBottom: "8px"
+});
+const schemaNameStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-base)",
+  fontWeight: 600,
+  color: "var(--omnispec-color-primary)",
+  backgroundColor: "transparent",
+  padding: 0,
+  "&:hover": {
+    textDecoration: "underline"
+  }
+});
+
+function AsyncApiSpec({
+  spec,
+  theme,
+  layout = "sidebar",
+  sidebarPosition = "left",
+  defaultExpandOperations = false,
+  downloadLink,
+  sidebarNav,
+  slots = {},
+  schemaStyle,
+  pro,
+  onSpecLoaded,
+  className
+}) {
+  const resolvedSchemaStyle = resolveSchemaStyle(schemaStyle, pro?.advancedSchemaStyles ?? false);
+  const { data: parsedSpec, state } = useAsyncApiSpec(spec);
+  const [searchQuery, setSearchQuery] = useState("");
+  const [allExpanded, setAllExpanded] = useState(defaultExpandOperations);
+  const [expandGeneration, setExpandGeneration] = useState(0);
+  const handleToggleExpand = useCallback(() => {
+    setAllExpanded((prev) => !prev);
+    setExpandGeneration((prev) => prev + 1);
+  }, []);
+  useMemo(() => {
+    if (parsedSpec && onSpecLoaded) {
+      const major = parseInt(parsedSpec.specVersion.split(".")[0], 10);
+      onSpecLoaded({
+        title: parsedSpec.title,
+        version: parsedSpec.version,
+        type: major >= 3 ? SpecType.ASYNCAPI_3 : SpecType.ASYNCAPI_2
+      });
+    }
+  }, [parsedSpec, onSpecLoaded]);
+  const navItems = useMemo(() => {
+    if (!parsedSpec) return [];
+    const channelItems = parsedSpec.channels.map((ch) => {
+      const actionLabels = ch.operations.map(
+        (op) => op.action.toUpperCase()
+      ).join("/");
+      return {
+        id: `channel-${ch.name}`,
+        label: ch.address,
+        badge: actionLabels || void 0,
+        badgeColor: ch.operations[0]?.action === "subscribe" || ch.operations[0]?.action === "receive" ? "var(--omnispec-color-subscribe)" : "var(--omnispec-color-publish)"
+      };
+    });
+    const items = [];
+    if (parsedSpec.servers.length > 0) {
+      items.push({ id: "servers", label: "Servers" });
+    }
+    items.push({
+      id: "channels",
+      label: "Channels",
+      children: channelItems
+    });
+    if (Object.keys(parsedSpec.components.schemas).length > 0) {
+      items.push({
+        id: "schemas",
+        label: "Schemas",
+        children: Object.keys(parsedSpec.components.schemas).map((name) => ({
+          id: `schema-${name}`,
+          label: name
+        }))
+      });
+    }
+    return items;
+  }, [parsedSpec]);
+  const filteredChannels = useMemo(() => {
+    if (!parsedSpec || !searchQuery.trim()) return parsedSpec?.channels ?? [];
+    const q = searchQuery.toLowerCase();
+    return parsedSpec.channels.filter(
+      (ch) => ch.address.toLowerCase().includes(q) || ch.description?.toLowerCase().includes(q) || ch.operations.some(
+        (op) => op.operationId?.toLowerCase().includes(q) || op.summary?.toLowerCase().includes(q)
+      )
+    );
+  }, [parsedSpec, searchQuery]);
+  const handleNavSelect = useCallback((id) => {
+    const el = document.getElementById(id);
+    el?.scrollIntoView({ behavior: "smooth", block: "start" });
+  }, []);
+  const navSectionIds = useMemo(() => flattenNavItemIds(navItems), [navItems]);
+  const activeSection = useScrollSpy(navSectionIds);
+  if (state.status === "loading") {
+    return /* @__PURE__ */ jsx(ThemeProvider, { theme, children: /* @__PURE__ */ jsx("div", { className: `omnispec-asyncapi ${className ?? ""}`, children: /* @__PURE__ */ jsx(LoadingScreen, {}) }) });
+  }
+  if (state.status === "error") {
+    return /* @__PURE__ */ jsx(
+      SpecStatusScreen,
+      {
+        theme,
+        layout,
+        sidebarPosition,
+        slots,
+        sidebarNav,
+        premiumThemingEnabled: pro?.premiumThemingEnabled ?? false,
+        className: `omnispec-asyncapi ${className ?? ""}`,
+        children: /* @__PURE__ */ jsx(ErrorMessage, { title: "Failed to load specification", message: state.error })
+      }
+    );
+  }
+  if (!parsedSpec) return null;
+  const specNav = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SearchBar,
+      {
+        placeholder: "Filter channels...",
+        onSearch: setSearchQuery
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      NavTree,
+      {
+        items: navItems,
+        activeId: activeSection,
+        onSelect: handleNavSelect
+      }
+    )
+  ] });
+  const sidebar = buildSidebar(sidebarNav, specNav);
+  const resolvedDownloadLink = resolveDownloadLink(downloadLink, spec);
+  return /* @__PURE__ */ jsx(ConfigProvider, { config: { allowTryIt: false, layout, sidebarPosition, defaultExpandOperations, schemaStyle: resolvedSchemaStyle, slots, proRenderers: pro?.renderers ?? /* @__PURE__ */ new Map(), premiumThemingEnabled: pro?.premiumThemingEnabled ?? false }, children: /* @__PURE__ */ jsx(ExpandProvider, { expandAll: allExpanded, expandGeneration, children: /* @__PURE__ */ jsx(ThemeProvider, { theme, children: /* @__PURE__ */ jsx("div", { className: `omnispec-asyncapi ${className ?? ""}`, children: /* @__PURE__ */ jsx(ErrorBoundary, { title: "Failed to render this API reference", children: /* @__PURE__ */ jsxs(
+    DocLayout,
+    {
+      layout,
+      sidebarPosition,
+      sidebar,
+      sidebarHeader: slots.sidebarHeader,
+      sidebarFooter: slots.sidebarFooter,
+      header: slots.header,
+      footer: slots.footer,
+      children: [
+        /* @__PURE__ */ jsx(
+          SpecToolbar,
+          {
+            overview: /* @__PURE__ */ jsx(AsyncOverview, { spec: parsedSpec }),
+            expandLabel: "channels",
+            allExpanded,
+            onToggleExpand: handleToggleExpand,
+            downloadLink: resolvedDownloadLink
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { id: "servers", children: /* @__PURE__ */ jsx(ServerList, { servers: parsedSpec.servers }) }),
+        /* @__PURE__ */ jsxs("div", { id: "channels", children: [
+          /* @__PURE__ */ jsx("h2", { className: css({ margin: "0 0 16px", fontSize: "var(--omnispec-h2-font-size)", fontWeight: "var(--omnispec-h2-font-weight)", color: "var(--omnispec-h2-color)" }), children: "Channels" }),
+          filteredChannels.map((channel) => /* @__PURE__ */ jsx(
+            ChannelDetail,
+            {
+              id: `channel-${channel.name}`,
+              channel,
+              expandAll: allExpanded,
+              expandGeneration
+            },
+            channel.name
+          ))
+        ] }),
+        /* @__PURE__ */ jsx(ComponentsSection, { components: parsedSpec.components })
+      ]
+    }
+  ) }) }) }) }) });
+}
+
+export { AsyncApiSpec };
+//# sourceMappingURL=AsyncApiSpec-C3lsUpZk.js.map