@apiboost/omnispec 1.0.0

package/dist/esm/chunks/OpenApiSpec-Cy-oW6jA.js

@@ -0,0 +1,3153 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useState, useCallback, useRef, useEffect, useMemo, useId, memo } from 'react';
+import { css, cx } from '@emotion/css';
+import { j as useConfig, I as Icon, a as useSpecFetcher, m as mq, B as Button, S as SpecType, r as resolveSchemaStyle, T as ThemeProvider, L as LoadingScreen, b as SpecStatusScreen, E as ErrorMessage, N as NavTree, h as buildSidebar, C as ConfigProvider, e as DocLayout } from './useSpecFetcher-CZvAnU7Z.js';
+import { M as MarkdownRenderer, T as Tabs, x as generateExample, f as MethodBar, t as SchemaTree, A as schemaToNodes, J as buildConstraints, C as CodeBlock, d as ExpandableCard, a as Collapsible, D as useHashScroll, w as flattenNavItemIds, G as useScrollSpy, u as SearchBar, H as ExpandProvider, v as SpecToolbar, z as resolveDownloadLink } from './Collapsible-DA6-nS46.js';
+import { f as authStyles, e as SecretInput, u as useAuth, O as OAuth2AuthManual, a as OpenIdConnectManual, h as ApiKeyAuth, M as Modal, l as loadTryItState, i as saveTryItState, g as sendProxiedRequest, s as sendDirectRequest, C as CodeSamples, c as ResponseViewer, j as clearTryItState, L as LinkableHeading, E as ExampleSelector, k as getNamedExamples, R as ReferenceLayout, S as SamplesPanel, b as ReferenceOperationDetail, d as ResponsiveColumns, A as AuthProvider } from './OpenIdConnectManual-COfITasf.js';
+import { r as resolveRefs, p as parse } from './ref-resolver-BIrHJOjz.js';
+import { E as ErrorBoundary } from './ErrorBoundary-posRNrbt.js';
+
+const AUTH_SCHEME_LABELS = {
+  apiKey: "API Key",
+  "http-basic": "Basic Auth",
+  "http-bearer": "Bearer Token",
+  oauth2: "OAuth2",
+  openIdConnect: "OpenID Connect"
+};
+function authSchemeLabel(type) {
+  return AUTH_SCHEME_LABELS[type];
+}
+
+function BearerAuth({ scheme, onApply, onRemove, applied, appliedValue }) {
+  const [token, setToken] = useState(appliedValue?.input?.token ?? "");
+  const handleApply = () => {
+    if (!token.trim()) return;
+    onApply({
+      schemeId: scheme.id,
+      headerName: "Authorization",
+      headerValue: `Bearer ${token}`,
+      input: { token }
+    });
+  };
+  const handleRemove = () => {
+    setToken("");
+    onRemove(scheme.id);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: authStyles.section, children: [
+    /* @__PURE__ */ jsxs("div", { className: authStyles.label, children: [
+      scheme.displayName,
+      /* @__PURE__ */ jsx("span", { className: authStyles.hint, children: "(Bearer Token)" })
+    ] }),
+    scheme.description && /* @__PURE__ */ jsx(MarkdownRenderer, { content: scheme.description, className: authStyles.description }),
+    /* @__PURE__ */ jsxs("div", { className: authStyles.inputRow, children: [
+      /* @__PURE__ */ jsx(
+        SecretInput,
+        {
+          value: token,
+          onChange: setToken,
+          placeholder: "Enter bearer token",
+          className: authStyles.input,
+          "aria-label": `${scheme.displayName} bearer token`
+        }
+      ),
+      applied ? /* @__PURE__ */ jsx("button", { type: "button", onClick: handleRemove, className: authStyles.removeBtn, children: "Remove" }) : /* @__PURE__ */ jsx("button", { type: "button", onClick: handleApply, className: authStyles.applyBtn, children: "Apply" })
+    ] })
+  ] });
+}
+
+const fieldColumnStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "8px"
+});
+function BasicAuth({ scheme, onApply, onRemove, applied, appliedValue }) {
+  const [username, setUsername] = useState(appliedValue?.input?.username ?? "");
+  const [password, setPassword] = useState(appliedValue?.input?.password ?? "");
+  const handleApply = () => {
+    if (!username.trim()) return;
+    const encoded = btoa(`${username}:${password}`);
+    onApply({
+      schemeId: scheme.id,
+      headerName: "Authorization",
+      headerValue: `Basic ${encoded}`,
+      input: { username, password }
+    });
+  };
+  const handleRemove = () => {
+    setUsername("");
+    setPassword("");
+    onRemove(scheme.id);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: authStyles.section, children: [
+    /* @__PURE__ */ jsxs("div", { className: authStyles.label, children: [
+      scheme.displayName,
+      /* @__PURE__ */ jsx("span", { className: authStyles.hint, children: "(HTTP Basic)" })
+    ] }),
+    scheme.description && /* @__PURE__ */ jsx(MarkdownRenderer, { content: scheme.description, className: authStyles.description }),
+    /* @__PURE__ */ jsxs("div", { className: fieldColumnStyle, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: username,
+          onChange: (e) => setUsername(e.target.value),
+          placeholder: "Username",
+          className: authStyles.input,
+          autoComplete: "username"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        SecretInput,
+        {
+          value: password,
+          onChange: setPassword,
+          placeholder: "Password",
+          className: authStyles.input,
+          autoComplete: "current-password",
+          "aria-label": `${scheme.displayName} password`
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: authStyles.inputRow, children: applied ? /* @__PURE__ */ jsx("button", { type: "button", onClick: handleRemove, className: authStyles.removeBtn, children: "Remove" }) : /* @__PURE__ */ jsx("button", { type: "button", onClick: handleApply, className: authStyles.applyBtn, children: "Apply" }) })
+    ] })
+  ] });
+}
+
+function renderSchemeForm(props, Oauth2Component, OpenIdConnectComponent) {
+  const key = props.scheme.id;
+  switch (props.scheme.type) {
+    case "apiKey":
+      return /* @__PURE__ */ jsx(ApiKeyAuth, { ...props }, key);
+    case "http-bearer":
+      return /* @__PURE__ */ jsx(BearerAuth, { ...props }, key);
+    case "http-basic":
+      return /* @__PURE__ */ jsx(BasicAuth, { ...props }, key);
+    case "oauth2":
+      return /* @__PURE__ */ jsx(Oauth2Component, { ...props }, key);
+    case "openIdConnect":
+      return /* @__PURE__ */ jsx(OpenIdConnectComponent, { ...props }, key);
+    default:
+      return null;
+  }
+}
+function AuthPanel({ schemes, serverUrl }) {
+  const { appliedAuth, applyAuth, removeAuth } = useAuth();
+  const { interactiveAuth, interactiveOAuth } = useConfig();
+  if (schemes.length === 0) return null;
+  const useInteractive = interactiveOAuth !== false;
+  const Oauth2Component = useInteractive && interactiveAuth?.oauth2 || OAuth2AuthManual;
+  const OpenIdConnectComponent = useInteractive && interactiveAuth?.openIdConnect || OpenIdConnectManual;
+  const buildProps = (scheme) => ({
+    scheme,
+    onApply: applyAuth,
+    onRemove: removeAuth,
+    applied: appliedAuth.has(scheme.id),
+    // Restored credential (if any) so the input can be prefilled.
+    appliedValue: appliedAuth.get(scheme.id),
+    serverUrl
+  });
+  const renderable = schemes.map((scheme) => ({ scheme, form: renderSchemeForm(buildProps(scheme), Oauth2Component, OpenIdConnectComponent) })).filter((entry) => entry.form !== null);
+  if (renderable.length === 0) return null;
+  if (renderable.length === 1) {
+    return /* @__PURE__ */ jsx("div", { className: `omnispec-auth-panel ${panelContainerStyle}`, children: renderable[0].form });
+  }
+  const typeCounts = renderable.reduce((acc, { scheme }) => {
+    acc[scheme.type] = (acc[scheme.type] ?? 0) + 1;
+    return acc;
+  }, {});
+  const tabLabel = (scheme) => {
+    const label = authSchemeLabel(scheme.type);
+    return typeCounts[scheme.type] > 1 ? `${label} (${scheme.id})` : label;
+  };
+  const tabs = renderable.map(({ scheme, form }) => ({
+    id: scheme.id,
+    label: /* @__PURE__ */ jsxs("span", { className: tabLabelStyle, children: [
+      tabLabel(scheme),
+      appliedAuth.has(scheme.id) && /* @__PURE__ */ jsx("span", { className: appliedIconStyle, title: "Authorized", role: "img", "aria-label": "Authorized", children: /* @__PURE__ */ jsx(Icon, { name: "shield-check", size: "0.875rem" }) })
+    ] }),
+    content: form
+  }));
+  const defaultTab = renderable.find(({ scheme }) => appliedAuth.has(scheme.id))?.scheme.id ?? renderable[0].scheme.id;
+  return /* @__PURE__ */ jsx("div", { className: `omnispec-auth-panel ${panelContainerStyle}`, children: /* @__PURE__ */ jsx(Tabs, { tabs, defaultTab, flush: true }) });
+}
+const panelContainerStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "1rem"
+});
+const tabLabelStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "0.375rem"
+});
+const appliedIconStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  color: "var(--omnispec-color-success)",
+  flexShrink: 0
+});
+
+function AuthPanelModal({ serverUrl } = {}) {
+  const { schemes, authPanelOpen, closeAuthPanel } = useAuth();
+  if (schemes.length === 0) return null;
+  return /* @__PURE__ */ jsx(Modal, { open: authPanelOpen, onClose: closeAuthPanel, title: "Authorization", children: /* @__PURE__ */ jsx(AuthPanel, { schemes, serverUrl }) });
+}
+
+async function parseOpenApiSpec(specInput, refOptions) {
+  const raw = typeof specInput === "string" ? parseSpecString(specInput) : specInput;
+  const api = await resolveRefs(raw, refOptions);
+  const isSwagger2 = !!api.swagger;
+  const specVersion = api.openapi ?? api.swagger ?? "unknown";
+  const servers = extractServers(api, isSwagger2);
+  const securitySchemes = extractSecuritySchemes(api, isSwagger2);
+  const tags = extractTaggedOperations(api, isSwagger2);
+  const components = extractComponents(api, isSwagger2);
+  const webhooks = extractWebhooks(api, isSwagger2);
+  const root = api;
+  return {
+    title: api.info.title,
+    description: api.info.description,
+    version: api.info.version,
+    specVersion,
+    servers,
+    tags,
+    tagGroups: root["x-tagGroups"],
+    securitySchemes,
+    components,
+    externalDocs: api.externalDocs,
+    contact: api.info.contact,
+    license: api.info.license,
+    termsOfService: api.info.termsOfService,
+    logo: api.info["x-logo"],
+    webhooks
+  };
+}
+function extractWebhooks(api, isSwagger2) {
+  if (!api.webhooks) return void 0;
+  const methods = ["get", "post", "put", "delete", "patch", "options", "head"];
+  const operations = [];
+  for (const [name, pathItem] of Object.entries(api.webhooks)) {
+    const pathLevelParams = pathItem.parameters;
+    for (const method of methods) {
+      const operation = pathItem[method];
+      if (!operation) continue;
+      const op = convertOperation(method, name, operation, isSwagger2, pathLevelParams);
+      if (op.xInternal) continue;
+      operations.push(op);
+    }
+  }
+  return operations.length > 0 ? operations : void 0;
+}
+function extractServers(api, isSwagger2) {
+  if (!isSwagger2 && api.servers) {
+    return api.servers.map((s) => ({
+      url: s.url,
+      description: s.description,
+      variables: s.variables
+    }));
+  }
+  if (isSwagger2 && api.host) {
+    const schemes = api.schemes ?? ["https"];
+    return schemes.map((scheme) => ({
+      url: `${scheme}://${api.host}${api.basePath ?? ""}`
+    }));
+  }
+  return [{ url: "/" }];
+}
+function collectNoAuthSchemeIds(api, isSwagger2) {
+  const defs = isSwagger2 ? api.securityDefinitions : api.components?.securitySchemes;
+  const ids = /* @__PURE__ */ new Set();
+  if (defs) {
+    for (const [id, def] of Object.entries(defs)) {
+      if (def.type === "http" && def.scheme === "noauth") ids.add(id);
+    }
+  }
+  return ids;
+}
+function extractSecuritySchemes(api, isSwagger2) {
+  const schemes = [];
+  const defs = isSwagger2 ? api.securityDefinitions : api.components?.securitySchemes;
+  if (!defs) return schemes;
+  for (const [id, def] of Object.entries(defs)) {
+    const scheme = convertSecurityScheme(id, def);
+    if (scheme) schemes.push(scheme);
+  }
+  return schemes;
+}
+function pickXExtensions(obj) {
+  const out = {};
+  for (const [key, value] of Object.entries(obj)) {
+    if (key.startsWith("x-")) out[key] = value;
+  }
+  return Object.keys(out).length ? out : void 0;
+}
+function convertSecurityScheme(id, def) {
+  if (def.type === "http" && def.scheme === "noauth") {
+    return null;
+  }
+  switch (def.type) {
+    case "apiKey":
+      return {
+        id,
+        type: "apiKey",
+        displayName: id,
+        description: def.description,
+        in: def.in,
+        name: def.name
+      };
+    case "http":
+      return {
+        id,
+        type: def.scheme === "basic" ? "http-basic" : "http-bearer",
+        displayName: id,
+        description: def.description,
+        scheme: def.scheme
+      };
+    case "oauth2":
+      return {
+        id,
+        type: "oauth2",
+        displayName: id,
+        description: def.description,
+        // Raw scheme-level x-* passthrough (Pro interprets; free core does not).
+        extensions: pickXExtensions(def),
+        flows: def.flows ? Object.fromEntries(
+          Object.entries(def.flows).map(([flowType, flow]) => [
+            flowType,
+            {
+              authorizationUrl: flow.authorizationUrl,
+              tokenUrl: flow.tokenUrl,
+              refreshUrl: flow.refreshUrl,
+              scopes: flow.scopes ?? {},
+              // Raw flow-level x-* passthrough (Pro interprets; free core does not).
+              extensions: pickXExtensions(flow)
+            }
+          ])
+        ) : void 0
+      };
+    case "openIdConnect":
+      return {
+        id,
+        type: "openIdConnect",
+        displayName: id,
+        description: def.description,
+        openIdConnectUrl: def.openIdConnectUrl
+      };
+    case "basic":
+      return {
+        id,
+        type: "http-basic",
+        displayName: id,
+        description: def.description,
+        scheme: "basic"
+      };
+    default:
+      return null;
+  }
+}
+function extractTaggedOperations(api, isSwagger2) {
+  const tagMap = /* @__PURE__ */ new Map();
+  const definedTags = /* @__PURE__ */ new Map();
+  if (api.tags) {
+    for (const tag of api.tags) {
+      const raw = tag;
+      definedTags.set(tag.name, {
+        description: tag.description,
+        displayName: raw["x-displayName"],
+        externalDocs: raw.externalDocs,
+        xInternal: raw["x-internal"]
+      });
+      tagMap.set(tag.name, []);
+    }
+  }
+  const noAuthSchemeIds = collectNoAuthSchemeIds(api, isSwagger2);
+  const globalSecurity = api.security?.map(
+    (s) => Object.keys(s).filter((name) => !noAuthSchemeIds.has(name))
+  );
+  for (const [path, pathItem] of Object.entries(api.paths)) {
+    const pathLevelParams = pathItem.parameters;
+    const methods = ["get", "post", "put", "delete", "patch", "options", "head"];
+    for (const method of methods) {
+      const operation = pathItem[method];
+      if (!operation) continue;
+      const op = convertOperation(method, path, operation, isSwagger2, pathLevelParams, globalSecurity, noAuthSchemeIds);
+      if (op.xInternal) continue;
+      const opTags = op.tags.length > 0 ? op.tags : ["default"];
+      for (const tagName of opTags) {
+        if (!tagMap.has(tagName)) {
+          tagMap.set(tagName, []);
+        }
+        tagMap.get(tagName).push(op);
+      }
+    }
+  }
+  return Array.from(tagMap.entries()).filter(([name, ops]) => ops.length > 0 && !definedTags.get(name)?.xInternal).map(([name, operations]) => ({
+    name,
+    displayName: definedTags.get(name)?.displayName,
+    description: definedTags.get(name)?.description,
+    externalDocs: definedTags.get(name)?.externalDocs,
+    operations
+  }));
+}
+function convertOperation(method, path, op, isSwagger2, pathLevelParams, globalSecurity, noAuthSchemeIds) {
+  const mergedRawParams = mergeParameters(pathLevelParams, op.parameters);
+  const parameters = mergedRawParams.map((p) => ({
+    name: p.name,
+    in: p.in,
+    required: p.required ?? p.in === "path",
+    description: p.description,
+    deprecated: p.deprecated,
+    schema: p.schema ?? (isSwagger2 ? { type: p.type, format: p.format, enum: p.enum } : void 0),
+    example: p.example,
+    examples: p.examples,
+    style: p.style,
+    explode: p.explode
+  }));
+  let requestBody;
+  if (op.requestBody) {
+    requestBody = {
+      description: op.requestBody.description,
+      required: op.requestBody.required,
+      content: op.requestBody.content
+    };
+  }
+  const responses = op.responses ? Object.entries(op.responses).map(([code, resp]) => ({
+    statusCode: code,
+    description: resp.description ?? "",
+    content: resp.content,
+    headers: resp.headers
+  })) : [];
+  const rawSecurity = op.security ? op.security.map((s) => Object.keys(s)) : globalSecurity;
+  const security = noAuthSchemeIds ? rawSecurity?.map((group) => group.filter((name) => !noAuthSchemeIds.has(name))) : rawSecurity;
+  return {
+    operationId: op.operationId,
+    summary: op.summary,
+    description: op.description,
+    method,
+    path,
+    tags: op.tags ?? [],
+    deprecated: op.deprecated,
+    parameters,
+    requestBody,
+    responses,
+    security: security?.flat() ? security.map((s) => s) : void 0,
+    callbacks: op.callbacks,
+    externalDocs: op.externalDocs,
+    xCodeSamples: op["x-codeSamples"] ?? op["x-code-samples"],
+    xBadges: op["x-badges"],
+    xInternal: op["x-internal"]
+  };
+}
+function extractComponents(api, isSwagger2) {
+  if (!isSwagger2 && api.components) {
+    return {
+      schemas: api.components.schemas ?? {},
+      responses: api.components.responses,
+      parameters: api.components.parameters,
+      requestBodies: api.components.requestBodies
+    };
+  }
+  const rawApi = api;
+  return {
+    schemas: rawApi.definitions ?? {}
+  };
+}
+function mergeParameters(pathLevel, operationLevel) {
+  if (!pathLevel?.length) return operationLevel ?? [];
+  if (!operationLevel?.length) return pathLevel;
+  const opKeys = new Set(operationLevel.map((p) => `${p.in}:${p.name}`));
+  const inherited = pathLevel.filter((p) => !opKeys.has(`${p.in}:${p.name}`));
+  return [...operationLevel, ...inherited];
+}
+function parseSpecString(input) {
+  const trimmed = input.trim();
+  if (trimmed.startsWith("{")) {
+    try {
+      return JSON.parse(trimmed);
+    } catch {
+    }
+  }
+  return parse(trimmed);
+}
+
+function useOpenApiSpec(spec, refOptions) {
+  const parser = useCallback(async (raw) => {
+    return parseOpenApiSpec(raw, refOptions);
+  }, [refOptions]);
+  return useSpecFetcher(spec, parser);
+}
+
+function ApiVersionBadge({ version }) {
+  return /* @__PURE__ */ jsxs("span", { className: versionBadgeMobileStyle, children: [
+    "v",
+    version
+  ] });
+}
+function ApiOverview({ spec }) {
+  return /* @__PURE__ */ jsxs("div", { className: `omnispec-api-overview ${containerStyle$4}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: titleRowStyle$1, children: [
+      /* @__PURE__ */ jsx("h1", { className: titleStyle$4, children: spec.title }),
+      /* @__PURE__ */ jsxs("span", { className: versionBadgeStyle, children: [
+        "v",
+        spec.version
+      ] })
+    ] }),
+    spec.description && /* @__PURE__ */ jsx("div", { className: descriptionStyle$2, children: /* @__PURE__ */ jsx(MarkdownRenderer, { content: spec.description }) }),
+    (spec.contact || spec.license || spec.termsOfService || spec.externalDocs) && /* @__PURE__ */ jsxs("div", { className: metaRowStyle, children: [
+      spec.contact?.name && /* @__PURE__ */ jsxs("span", { className: metaItemStyle, children: [
+        spec.contact.email ? /* @__PURE__ */ jsx("a", { href: `mailto:${spec.contact.email}`, className: linkStyle, children: spec.contact.name }) : spec.contact.name,
+        spec.contact.url && /* @__PURE__ */ jsxs(Fragment, { children: [
+          " \xB7 ",
+          /* @__PURE__ */ jsx("a", { href: spec.contact.url, target: "_blank", rel: "noopener noreferrer", className: linkStyle, children: spec.contact.url })
+        ] })
+      ] }),
+      spec.license && /* @__PURE__ */ jsx("span", { className: metaItemStyle, children: 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.termsOfService && /* @__PURE__ */ jsx("span", { className: metaItemStyle, children: /* @__PURE__ */ jsx("a", { href: spec.termsOfService, target: "_blank", rel: "noopener noreferrer", className: linkStyle, children: "Terms of Service" }) }),
+      spec.externalDocs && /* @__PURE__ */ jsx("span", { className: metaItemStyle, children: /* @__PURE__ */ jsx("a", { href: spec.externalDocs.url, target: "_blank", rel: "noopener noreferrer", className: linkStyle, children: spec.externalDocs.description ?? "Docs" }) })
+    ] })
+  ] });
+}
+const containerStyle$4 = css({
+  marginBottom: 0,
+  minWidth: 0,
+  overflow: "hidden"
+});
+const titleRowStyle$1 = css({
+  display: "flex",
+  gap: "0.75rem",
+  marginBottom: "0.25rem",
+  flexWrap: "wrap",
+  flexDirection: "column"
+});
+const titleStyle$4 = css({
+  margin: 0,
+  fontSize: "var(--omnispec-h1-font-size)",
+  color: "var(--omnispec-h1-color)",
+  fontWeight: "var(--omnispec-h1-font-weight)",
+  letterSpacing: "-0.02em",
+  lineHeight: 1.2,
+  wordBreak: "break-word"
+});
+const versionBadgeStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)",
+  fontFamily: "var(--omnispec-font-mono)",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "0.125rem 0.5rem",
+  borderRadius: "0.25rem",
+  alignSelf: "baseline",
+  fontWeight: 500,
+  [mq.mobile]: {
+    display: "none"
+  }
+});
+const descriptionStyle$2 = css({
+  marginTop: "0.75rem"
+});
+const metaRowStyle = css({
+  display: "flex",
+  gap: "1rem",
+  marginTop: "0.75rem",
+  flexWrap: "wrap"
+});
+const metaItemStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)"
+});
+const versionBadgeMobileStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)",
+  fontFamily: "var(--omnispec-font-mono)",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "0.125rem 0.5rem",
+  borderRadius: "0.25rem",
+  fontWeight: 500
+});
+const linkStyle = css({
+  color: "var(--omnispec-fg-link)",
+  textDecoration: "none",
+  "&:hover": {
+    textDecoration: "underline"
+  }
+});
+
+function ServerSelector({ servers, selectedUrl, onSelect }) {
+  const [variables, setVariables] = useState({});
+  const hasUsableServers = servers.length > 0 && servers.some(
+    (s) => s.url && s.url !== "/"
+  );
+  if (!hasUsableServers) return null;
+  const resolveUrl = (server, vars) => {
+    let resolved = server.url;
+    if (server.variables) {
+      for (const [key, variable] of Object.entries(server.variables)) {
+        resolved = resolved.replace(`{${key}}`, vars[key] ?? variable.default ?? "");
+      }
+    }
+    return resolved;
+  };
+  const serverIndex = servers.findIndex((s) => selectedUrl.startsWith(s.url.split("{")[0]));
+  const currentIndex = serverIndex >= 0 ? serverIndex : 0;
+  const currentServer = servers[currentIndex];
+  const resolvedUrl = resolveUrl(currentServer, variables);
+  const handleServerChange = (newIndex) => {
+    setVariables({});
+    onSelect(resolveUrl(servers[newIndex], {}));
+  };
+  const handleVariableChange = (name, value) => {
+    const newVars = { ...variables, [name]: value };
+    setVariables(newVars);
+    onSelect(resolveUrl(currentServer, newVars));
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `omnispec-server-selector ${serverContainerStyle}`, children: [
+    /* @__PURE__ */ jsx("label", { className: serverLabelStyle, children: "Server" }),
+    /* @__PURE__ */ jsx("div", { className: serverRowStyle, children: servers.length === 1 ? /* @__PURE__ */ jsx("code", { className: serverUrlStyle, children: resolvedUrl }) : /* @__PURE__ */ jsx(
+      "select",
+      {
+        value: currentIndex,
+        onChange: (e) => handleServerChange(Number(e.target.value)),
+        className: serverSelectStyle,
+        children: servers.map((server, idx) => /* @__PURE__ */ jsxs("option", { value: idx, children: [
+          server.url,
+          server.description ? ` - ${server.description}` : ""
+        ] }, idx))
+      }
+    ) }),
+    currentServer?.variables && Object.entries(currentServer.variables).length > 0 && /* @__PURE__ */ jsx("div", { className: serverVariablesStyle, children: Object.entries(currentServer.variables).map(([name, variable]) => /* @__PURE__ */ jsxs("div", { className: serverVarRowStyle, children: [
+      /* @__PURE__ */ jsx("label", { className: serverVarLabelStyle, children: name }),
+      variable.enum ? /* @__PURE__ */ jsx(
+        "select",
+        {
+          value: variables[name] ?? variable.default,
+          onChange: (e) => handleVariableChange(name, e.target.value),
+          className: serverVarInputStyle,
+          children: variable.enum.map((val) => /* @__PURE__ */ jsx("option", { value: val, children: val }, val))
+        }
+      ) : /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: variables[name] ?? variable.default,
+          onChange: (e) => handleVariableChange(name, e.target.value),
+          className: serverVarInputStyle
+        }
+      ),
+      variable.description && /* @__PURE__ */ jsx("span", { className: serverVarDescStyle, children: variable.description })
+    ] }, name)) })
+  ] });
+}
+const serverContainerStyle = css({
+  marginBottom: "1rem",
+  padding: "0.75rem",
+  backgroundColor: "var(--omnispec-bg-secondary)",
+  borderRadius: "var(--omnispec-border-radius)",
+  border: "1px solid var(--omnispec-border-color)",
+  overflow: "hidden"
+});
+const serverLabelStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-muted)",
+  textTransform: "uppercase",
+  letterSpacing: "0.5px",
+  marginBottom: "6px",
+  display: "block"
+});
+const serverRowStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "8px"
+});
+const serverUrlStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-code)",
+  overflowX: "auto",
+  whiteSpace: "nowrap",
+  minWidth: 0,
+  maxWidth: "100%",
+  display: "block",
+  scrollbarWidth: "thin"
+});
+const serverSelectStyle = css({
+  flex: 1,
+  minWidth: 0,
+  maxWidth: "100%",
+  padding: "0.375rem 0.625rem",
+  border: "1px solid var(--omnispec-input-border)",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "var(--omnispec-input-bg)",
+  color: "var(--omnispec-fg-primary)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontFamily: "var(--omnispec-font-mono)",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+});
+const serverVariablesStyle = css({
+  marginTop: "8px",
+  display: "flex",
+  flexDirection: "column",
+  gap: "6px"
+});
+const serverVarRowStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "0.5rem",
+  flexWrap: "wrap"
+});
+const serverVarLabelStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-secondary)",
+  fontWeight: 600,
+  minWidth: "80px"
+});
+const serverVarInputStyle = css({
+  flex: 1,
+  minWidth: 0,
+  padding: "0.25rem 0.5rem",
+  border: "1px solid var(--omnispec-input-border)",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "var(--omnispec-input-bg)",
+  color: "var(--omnispec-fg-primary)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const serverVarDescStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)"
+});
+
+const MULTI_VALUE_DELIMITER = ",";
+const sectionStyle$3 = css({
+  marginBottom: "16px"
+});
+const sectionTitleStyle$2 = css({
+  margin: "0 0 8px",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-muted)",
+  fontWeight: 600,
+  textTransform: "uppercase",
+  letterSpacing: "0.5px"
+});
+const fieldStyle = css({
+  marginBottom: "14px"
+});
+const labelStyle$1 = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "2px",
+  marginBottom: "6px"
+});
+const nameStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-primary)"
+});
+const requiredStyle = css({
+  color: "var(--omnispec-color-error)",
+  fontWeight: 600
+});
+const descriptionStyle$1 = css({
+  margin: "4px 0 0",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)"
+});
+const inputStyle = css({
+  width: "100%",
+  padding: "8px 12px",
+  border: "1px solid var(--omnispec-input-border)",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "var(--omnispec-input-bg)",
+  color: "var(--omnispec-fg-primary)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  boxSizing: "border-box",
+  "&:focus": {
+    borderColor: "var(--omnispec-color-primary)",
+    outline: "none"
+  }
+});
+function ParameterForm({ parameters, values, onChange }) {
+  const grouped = groupByLocation(parameters);
+  return /* @__PURE__ */ jsx("div", { className: "adr-parameter-form", children: ["path", "query", "header", "cookie"].map((location) => {
+    const params = grouped[location];
+    if (!params || params.length === 0) return null;
+    return /* @__PURE__ */ jsxs("div", { className: sectionStyle$3, children: [
+      /* @__PURE__ */ jsx("h4", { className: sectionTitleStyle$2, children: locationLabels[location] }),
+      params.map((param) => /* @__PURE__ */ jsx(
+        ParameterInput,
+        {
+          param,
+          value: values[param.name] ?? "",
+          onChange
+        },
+        param.name
+      ))
+    ] }, location);
+  }) });
+}
+const locationLabels = {
+  path: "Path Parameters",
+  query: "Query Parameters",
+  header: "Header Parameters",
+  cookie: "Cookie Parameters"
+};
+function ParameterInput({ param, value, onChange }) {
+  const handleChange = useCallback((e) => {
+    onChange(param.name, e.target.value);
+  }, [param.name, onChange]);
+  const placeholder = param.example ?? param.default ?? `Filter by ${param.name}`;
+  return /* @__PURE__ */ jsxs("div", { className: fieldStyle, children: [
+    /* @__PURE__ */ jsxs("label", { className: labelStyle$1, htmlFor: `tryit-param-${param.name}`, children: [
+      /* @__PURE__ */ jsx("span", { className: nameStyle, children: param.name }),
+      param.required && /* @__PURE__ */ jsx("span", { className: requiredStyle, children: "*" })
+    ] }),
+    param.itemsEnum ? /* @__PURE__ */ jsx(
+      MultiEnumSelect,
+      {
+        param,
+        value,
+        onChange
+      }
+    ) : param.enum ? /* @__PURE__ */ jsxs("select", { id: `tryit-param-${param.name}`, value, onChange: handleChange, className: inputStyle, children: [
+      /* @__PURE__ */ jsx("option", { value: "", children: "Select..." }),
+      param.enum.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, opt))
+    ] }) : /* @__PURE__ */ jsx(
+      "input",
+      {
+        id: `tryit-param-${param.name}`,
+        type: "text",
+        value,
+        onChange: handleChange,
+        placeholder,
+        className: inputStyle
+      }
+    ),
+    param.description && /* @__PURE__ */ jsx("p", { className: descriptionStyle$1, children: param.description })
+  ] });
+}
+function MultiEnumSelect({
+  param,
+  value,
+  onChange
+}) {
+  const selected = new Set(value ? value.split(MULTI_VALUE_DELIMITER) : []);
+  const toggle = (option) => {
+    const next = new Set(selected);
+    if (next.has(option)) {
+      next.delete(option);
+    } else {
+      next.add(option);
+    }
+    onChange(param.name, Array.from(next).join(MULTI_VALUE_DELIMITER));
+  };
+  return /* @__PURE__ */ jsx("div", { className: multiSelectStyle, role: "group", "aria-label": `${param.name} values`, children: (param.itemsEnum ?? []).map((option) => /* @__PURE__ */ jsxs("label", { className: multiOptionStyle, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "checkbox",
+        checked: selected.has(option),
+        onChange: () => toggle(option)
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: multiOptionLabelStyle, children: option })
+  ] }, option)) });
+}
+const multiSelectStyle = css({
+  display: "flex",
+  flexWrap: "wrap",
+  gap: "0.375rem"
+});
+const multiOptionStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "0.25rem",
+  padding: "0.25rem 0.5rem",
+  border: "1px solid var(--omnispec-input-border)",
+  borderRadius: "1rem",
+  backgroundColor: "var(--omnispec-input-bg)",
+  cursor: "pointer",
+  fontSize: "var(--omnispec-font-size-xs)",
+  "&:hover": {
+    backgroundColor: "var(--omnispec-bg-secondary)"
+  }
+});
+const multiOptionLabelStyle = css({
+  color: "var(--omnispec-fg-primary)",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+function groupByLocation(params) {
+  const grouped = {};
+  for (const param of params) {
+    if (!grouped[param.in]) grouped[param.in] = [];
+    grouped[param.in].push(param);
+  }
+  return grouped;
+}
+
+function getMultipartProps(schema) {
+  const properties = schema?.properties;
+  if (!properties) return [];
+  const required = schema?.required ?? [];
+  return Object.entries(properties).map(([name, prop]) => ({
+    name,
+    // `type: string, format: binary` (OAS 3.0) or `contentEncoding` (3.1)
+    // marks a file part; arrays of binary items also count.
+    isFile: prop.format === "binary" || prop.contentEncoding !== void 0 || prop.items?.format === "binary",
+    required: required.includes(name),
+    description: prop.description
+  }));
+}
+const containerStyle$3 = css({
+  marginBottom: "12px",
+  display: "flex",
+  flexDirection: "column"
+});
+const headerStyle = css({
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  marginBottom: "8px"
+});
+const labelStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-secondary)",
+  textTransform: "uppercase",
+  letterSpacing: "0.5px"
+});
+const contentTypeSelectStyle = css({
+  padding: "4px 8px",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "var(--omnispec-input-bg)",
+  color: "var(--omnispec-fg-primary)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const textareaStyle = css({
+  width: "100%",
+  minHeight: "120px",
+  padding: "10px",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "var(--omnispec-bg-code)",
+  color: "var(--omnispec-fg-code)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontFamily: "var(--omnispec-font-mono)",
+  resize: "vertical",
+  boxSizing: "border-box",
+  lineHeight: 1.5
+});
+function RequestBodyEditor({
+  value,
+  onChange,
+  contentType,
+  onContentTypeChange,
+  availableContentTypes = ["application/json"],
+  schema,
+  multipartFields = {},
+  onMultipartFieldChange
+}) {
+  const textareaRef = useRef(null);
+  const autoResize = useCallback(() => {
+    const el = textareaRef.current;
+    if (!el) return;
+    el.style.height = "auto";
+    el.style.height = `${el.scrollHeight}px`;
+  }, []);
+  useEffect(() => {
+    autoResize();
+  }, [value, autoResize]);
+  const isMultipart = contentType.includes("multipart/form-data");
+  const isUrlEncoded = contentType.includes("application/x-www-form-urlencoded");
+  const multipartProps = isMultipart || isUrlEncoded ? getMultipartProps(schema) : [];
+  const showMultipartForm = (isMultipart || isUrlEncoded) && multipartProps.length > 0 && onMultipartFieldChange;
+  return /* @__PURE__ */ jsxs("div", { className: `adr-request-body ${containerStyle$3}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: headerStyle, children: [
+      /* @__PURE__ */ jsx("span", { className: labelStyle, children: "Request Body" }),
+      availableContentTypes.length > 1 && onContentTypeChange && /* @__PURE__ */ jsx(
+        "select",
+        {
+          value: contentType,
+          onChange: (e) => onContentTypeChange(e.target.value),
+          className: contentTypeSelectStyle,
+          children: availableContentTypes.map((ct) => /* @__PURE__ */ jsx("option", { value: ct, children: ct }, ct))
+        }
+      )
+    ] }),
+    showMultipartForm ? /* @__PURE__ */ jsx("div", { className: multipartListStyle, children: multipartProps.map((prop) => {
+      const fieldValue = multipartFields[prop.name];
+      return /* @__PURE__ */ jsxs("div", { className: multipartFieldStyle, children: [
+        /* @__PURE__ */ jsxs("label", { className: multipartLabelStyle, children: [
+          /* @__PURE__ */ jsx("span", { className: multipartNameStyle, children: prop.name }),
+          prop.required && /* @__PURE__ */ jsx("span", { className: multipartRequiredStyle, children: "*" })
+        ] }),
+        prop.isFile && isMultipart ? /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "file",
+            onChange: (e) => onMultipartFieldChange(prop.name, e.target.files?.[0] ?? null),
+            className: multipartFileInputStyle
+          }
+        ) : /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "text",
+            value: typeof fieldValue === "string" ? fieldValue : "",
+            onChange: (e) => onMultipartFieldChange(prop.name, e.target.value),
+            placeholder: prop.description ?? prop.name,
+            className: multipartTextInputStyle
+          }
+        )
+      ] }, prop.name);
+    }) }) : /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref: textareaRef,
+        name: "request-body",
+        value,
+        onChange: (e) => onChange(e.target.value),
+        placeholder: getPlaceholder(contentType),
+        className: textareaStyle,
+        spellCheck: false
+      }
+    )
+  ] });
+}
+const multipartListStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.625rem"
+});
+const multipartFieldStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.25rem"
+});
+const multipartLabelStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "0.125rem"
+});
+const multipartNameStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-primary)",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const multipartRequiredStyle = css({
+  color: "var(--omnispec-color-error)",
+  fontWeight: 600
+});
+const multipartTextInputStyle = css({
+  width: "100%",
+  padding: "0.5rem 0.625rem",
+  borderRadius: "var(--omnispec-border-radius)",
+  border: "1px solid var(--omnispec-input-border)",
+  backgroundColor: "var(--omnispec-input-bg)",
+  color: "var(--omnispec-fg-primary)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontFamily: "var(--omnispec-font-mono)",
+  boxSizing: "border-box"
+});
+const multipartFileInputStyle = css({
+  width: "100%",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)",
+  "&::file-selector-button": {
+    padding: "0.375rem 0.75rem",
+    marginRight: "0.5rem",
+    borderRadius: "var(--omnispec-border-radius)",
+    border: "1px solid var(--omnispec-input-border)",
+    backgroundColor: "var(--omnispec-bg-secondary)",
+    color: "var(--omnispec-fg-primary)",
+    fontSize: "var(--omnispec-font-size-xs)",
+    cursor: "pointer"
+  }
+});
+function getPlaceholder(contentType) {
+  if (contentType.includes("json")) return '{\n  "key": "value"\n}';
+  if (contentType.includes("xml")) return "<root>\n  <element>value</element>\n</root>";
+  return "Enter request body...";
+}
+
+function CustomHeaders({ headers, onChange }) {
+  const updateRow = (index, patch) => {
+    onChange(headers.map((h, i) => i === index ? { ...h, ...patch } : h));
+  };
+  const removeRow = (index) => {
+    onChange(headers.filter((_, i) => i !== index));
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `omnispec-custom-headers ${sectionStyle$2}`, children: [
+    headers.length > 0 && /* @__PURE__ */ jsx("span", { className: sectionTitleStyle$1, children: "Custom Headers" }),
+    headers.map((header, idx) => /* @__PURE__ */ jsxs("div", { className: rowStyle, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: header.name,
+          onChange: (e) => updateRow(idx, { name: e.target.value }),
+          placeholder: "Header name",
+          "aria-label": `Custom header ${idx + 1} name`,
+          className: nameInputStyle
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: header.value,
+          onChange: (e) => updateRow(idx, { value: e.target.value }),
+          placeholder: "Value",
+          "aria-label": `Custom header ${idx + 1} value`,
+          className: valueInputStyle
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => removeRow(idx),
+          "aria-label": `Remove custom header ${idx + 1}`,
+          className: removeBtnStyle,
+          children: /* @__PURE__ */ jsx(Icon, { name: "xmark", size: "0.875rem" })
+        }
+      )
+    ] }, idx)),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => onChange([...headers, { name: "", value: "" }]),
+        className: addBtnStyle,
+        children: "+ Add header"
+      }
+    )
+  ] });
+}
+const sectionStyle$2 = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.5rem",
+  marginBottom: "0.75rem"
+});
+const sectionTitleStyle$1 = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-muted)",
+  textTransform: "uppercase",
+  letterSpacing: "0.5px"
+});
+const rowStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "0.375rem"
+});
+const inputBase = {
+  padding: "0.375rem 0.5rem",
+  borderRadius: "var(--omnispec-border-radius)",
+  border: "1px solid var(--omnispec-input-border)",
+  backgroundColor: "var(--omnispec-input-bg)",
+  color: "var(--omnispec-fg-primary)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontFamily: "var(--omnispec-font-mono)",
+  minWidth: 0
+};
+const nameInputStyle = css({
+  ...inputBase,
+  flex: 1
+});
+const valueInputStyle = css({
+  ...inputBase,
+  flex: 1.4
+});
+const removeBtnStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: "0.25rem",
+  backgroundColor: "transparent",
+  border: "none",
+  color: "var(--omnispec-fg-muted)",
+  cursor: "pointer",
+  "&:hover": {
+    color: "var(--omnispec-color-error)"
+  }
+});
+const addBtnStyle = css({
+  alignSelf: "flex-start",
+  padding: "0.25rem 0.625rem",
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontFamily: "var(--omnispec-font-sans)",
+  fontWeight: 500,
+  color: "var(--omnispec-fg-link)",
+  backgroundColor: "transparent",
+  border: "1px solid var(--omnispec-border-color)",
+  borderRadius: "1rem",
+  cursor: "pointer",
+  "&:hover": {
+    backgroundColor: "var(--omnispec-bg-secondary)"
+  }
+});
+
+function TryItPanel({
+  method,
+  path,
+  serverUrl,
+  parameters = [],
+  requestBodyContentTypes,
+  defaultRequestBody,
+  requestBodySchema,
+  requestBodySchemas,
+  security,
+  xCodeSamples,
+  docked = true,
+  onRequest,
+  onResponse
+}) {
+  const { allowTryIt, proxyUrl, proxyHeaders, specKey, tryItPersistTtl } = useConfig();
+  const { getAuthHeaders, appliedAuth, openAuthPanel, hasAuth, clearAuth } = useAuth();
+  const authorized = appliedAuth.size > 0;
+  const persistenceDisabled = tryItPersistTtl === 0;
+  const operationKey = `${method.toUpperCase()} ${path}`;
+  const persisted = useMemo(
+    () => loadTryItState(specKey, operationKey, tryItPersistTtl),
+    [specKey, operationKey, tryItPersistTtl]
+  );
+  const defaultParamValues = () => {
+    const initial = {};
+    for (const param of parameters) {
+      const val = param.example ?? param.default;
+      if (val !== void 0) initial[param.name] = val;
+    }
+    return initial;
+  };
+  const [paramValues, setParamValues] = useState(() => ({
+    ...defaultParamValues(),
+    ...persisted?.paramValues
+  }));
+  const [body, setBody] = useState(persisted?.body ?? defaultRequestBody ?? "");
+  const [contentType, setContentType] = useState(
+    persisted?.contentType ?? requestBodyContentTypes?.[0] ?? "application/json"
+  );
+  const [multipartFields, setMultipartFields] = useState(
+    () => ({ ...persisted?.formFields })
+  );
+  const [customHeaders, setCustomHeaders] = useState(
+    () => persisted?.customHeaders ?? []
+  );
+  const [response, setResponse] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState();
+  const [codeLang, setCodeLang] = useState("curl");
+  const touchedParams = useRef(new Set(Object.keys(persisted?.paramValues ?? {})));
+  useEffect(() => {
+    if (!specKey || persistenceDisabled) return;
+    const formFields = {};
+    for (const [name, value] of Object.entries(multipartFields)) {
+      if (typeof value === "string" && value !== "") formFields[name] = value;
+    }
+    saveTryItState(specKey, operationKey, {
+      paramValues,
+      body,
+      contentType,
+      formFields,
+      customHeaders
+    });
+  }, [specKey, operationKey, persistenceDisabled, paramValues, body, contentType, multipartFields, customHeaders]);
+  const missingRequiredParams = useMemo(() => {
+    const missing = [];
+    for (const param of parameters) {
+      if (!param.required) continue;
+      if (param.in !== "path" && param.in !== "query") continue;
+      if (!paramValues[param.name]?.trim()) missing.push(`${param.name} (${param.in})`);
+    }
+    return missing;
+  }, [parameters, paramValues]);
+  const authSatisfied = useMemo(() => {
+    if (!security || security.length === 0) return true;
+    return security.some((group) => group.length === 0 || group.every((name) => appliedAuth.has(name)));
+  }, [security, appliedAuth]);
+  const authMismatch = !authSatisfied && appliedAuth.size > 0;
+  const authBlocked = !authSatisfied && appliedAuth.size === 0;
+  const declaredSchemes = useMemo(
+    () => Array.from(new Set((security ?? []).flat())),
+    [security]
+  );
+  const sendBlocked = missingRequiredParams.length > 0 || authBlocked;
+  const handleReset = () => {
+    clearTryItState(specKey, operationKey);
+    touchedParams.current = /* @__PURE__ */ new Set();
+    setParamValues(defaultParamValues());
+    setBody(defaultRequestBody ?? "");
+    setContentType(requestBodyContentTypes?.[0] ?? "application/json");
+    setMultipartFields({});
+    setCustomHeaders([]);
+    clearAuth();
+  };
+  const handleParamChange = useCallback((name, value) => {
+    touchedParams.current.add(name);
+    setParamValues((prev) => ({ ...prev, [name]: value }));
+  }, []);
+  const exampleSignature = parameters.map((p) => `${p.name}=${p.example ?? ""}`).join("|");
+  useEffect(() => {
+    setParamValues((prev) => {
+      let changed = false;
+      const next = { ...prev };
+      for (const param of parameters) {
+        if (param.example === void 0) continue;
+        if (touchedParams.current.has(param.name)) continue;
+        if (next[param.name] !== param.example) {
+          next[param.name] = param.example;
+          changed = true;
+        }
+      }
+      return changed ? next : prev;
+    });
+  }, [exampleSignature]);
+  const buildRequest = useCallback(() => {
+    const authHeaders = getAuthHeaders();
+    const headers = { ...authHeaders };
+    for (const param of parameters) {
+      if (param.in === "header" && paramValues[param.name]) {
+        headers[param.name] = paramValues[param.name];
+      }
+    }
+    for (const header of customHeaders) {
+      const name = header.name.trim();
+      if (name) headers[name] = header.value;
+    }
+    const bodyCapable = ["post", "put", "patch"].includes(method.toLowerCase());
+    const isMultipart = contentType.includes("multipart/form-data");
+    const isUrlEncoded = contentType.includes("application/x-www-form-urlencoded");
+    const hasFormFieldValues = Object.values(multipartFields).some((v) => v !== null && v !== "");
+    const pathParams = {};
+    const queryParams = {};
+    for (const param of parameters) {
+      const val = paramValues[param.name];
+      if (!val) continue;
+      if (param.in === "path") pathParams[param.name] = val;
+      if (param.in === "query") {
+        if (param.itemsEnum) {
+          const values = val.split(MULTI_VALUE_DELIMITER).filter(Boolean);
+          queryParams[param.name] = param.explode === false ? values.join(",") : values;
+        } else {
+          queryParams[param.name] = val;
+        }
+      }
+    }
+    let encodedBody;
+    if (bodyCapable && isMultipart) {
+      const formData = new FormData();
+      let hasEntries = false;
+      for (const [name, value] of Object.entries(multipartFields)) {
+        if (value === null || value === "") continue;
+        formData.append(name, value);
+        hasEntries = true;
+      }
+      if (hasEntries) encodedBody = formData;
+    } else if (bodyCapable && isUrlEncoded && hasFormFieldValues) {
+      headers["Content-Type"] = contentType;
+      const params = new URLSearchParams();
+      for (const [name, value] of Object.entries(multipartFields)) {
+        if (value === null || value === "" || typeof value !== "string") continue;
+        params.set(name, value);
+      }
+      encodedBody = params.toString();
+    } else if (bodyCapable && body) {
+      headers["Content-Type"] = contentType;
+      encodedBody = body;
+      if (isUrlEncoded) {
+        try {
+          const parsed = JSON.parse(body);
+          const params = new URLSearchParams();
+          for (const [key, value] of Object.entries(parsed)) {
+            params.set(key, String(value));
+          }
+          encodedBody = params.toString();
+        } catch {
+          encodedBody = body;
+        }
+      }
+    }
+    return {
+      url: path,
+      method: method.toUpperCase(),
+      headers,
+      pathParams,
+      queryParams,
+      body: encodedBody,
+      bodyType: contentType
+    };
+  }, [parameters, paramValues, body, contentType, multipartFields, customHeaders, method, path, getAuthHeaders]);
+  const handleSend = useCallback(async () => {
+    setLoading(true);
+    setError(void 0);
+    setResponse(null);
+    const request2 = buildRequest();
+    onRequest?.(request2);
+    const fullRequest = {
+      ...request2,
+      url: serverUrl + request2.url
+    };
+    try {
+      const res = proxyUrl ? await sendProxiedRequest(proxyUrl, fullRequest, proxyHeaders) : await sendDirectRequest(fullRequest);
+      setResponse(res);
+      onResponse?.(res);
+    } catch (err) {
+      const message = err instanceof Error ? err.message : "Request failed";
+      if (!proxyUrl && message.includes("Failed to fetch")) {
+        const isHttpTarget = /^http:\/\//i.test(fullRequest.url);
+        const hint = isHttpTarget ? "The spec's server URL uses http://, which browsers block from an https page and often can't follow to https (the redirect carries no CORS headers). Use an https:// server URL, or route requests through a proxyUrl." : "This is usually a CORS restriction \u2014 the API does not allow browser cross-origin requests. Configure a proxyUrl to route requests through your backend.";
+        setError(`${message}. ${hint}`);
+      } else {
+        setError(message);
+      }
+    } finally {
+      setLoading(false);
+    }
+  }, [proxyUrl, proxyHeaders, buildRequest, serverUrl, onRequest, onResponse]);
+  const schemaBody = useMemo(() => {
+    if (!requestBodySchema) return void 0;
+    return JSON.stringify(generateExample(requestBodySchema), null, 2);
+  }, [requestBodySchema]);
+  if (!allowTryIt) return null;
+  const request = buildRequest();
+  const hasBodyMethods = ["post", "put", "patch"].includes(method.toLowerCase());
+  const codeSampleRequest = useMemo(() => {
+    const r = { ...request };
+    if (hasBodyMethods && !r.body && schemaBody) {
+      r.body = schemaBody;
+      if (!r.headers["Content-Type"]) {
+        r.headers = { ...r.headers, "Content-Type": contentType };
+      }
+    }
+    return r;
+  }, [request, hasBodyMethods, schemaBody, contentType]);
+  return /* @__PURE__ */ jsxs("div", { className: cx("omnispec-tryit", docked && dockedContainerStyle), children: [
+    /* @__PURE__ */ jsxs("div", { className: titleRowStyle, children: [
+      /* @__PURE__ */ jsx("h4", { className: titleStyle$3, children: "Try it" }),
+      /* @__PURE__ */ jsx("div", { className: statusRowStyle, children: /* @__PURE__ */ jsxs("div", { className: headerActionsStyle, children: [
+        hasAuth && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: openAuthPanel,
+            className: headerBtnStyle,
+            title: authorized ? "Update authorization credentials" : "Set authorization credentials",
+            children: [
+              /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  name: authorized ? "lock-keyhole" : "lock-keyhole-open",
+                  size: "0.875rem",
+                  color: authorized ? "var(--omnispec-color-success)" : void 0
+                }
+              ),
+              authorized ? "Authorized" : "Authorize"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: handleReset,
+            className: headerBtnStyle,
+            title: "Reset Try-It inputs for this operation and clear all applied authorization",
+            children: [
+              /* @__PURE__ */ jsx(Icon, { name: "rotate-ccw", size: "0.875rem" }),
+              "Reset"
+            ]
+          }
+        )
+      ] }) })
+    ] }),
+    parameters.length > 0 && /* @__PURE__ */ jsx(
+      ParameterForm,
+      {
+        parameters,
+        values: paramValues,
+        onChange: handleParamChange
+      }
+    ),
+    /* @__PURE__ */ jsx(CustomHeaders, { headers: customHeaders, onChange: setCustomHeaders }),
+    hasBodyMethods && requestBodyContentTypes && /* @__PURE__ */ jsx(
+      RequestBodyEditor,
+      {
+        value: body,
+        onChange: setBody,
+        contentType,
+        onContentTypeChange: setContentType,
+        availableContentTypes: requestBodyContentTypes,
+        schema: requestBodySchemas?.[contentType] ?? requestBodySchema,
+        multipartFields,
+        onMultipartFieldChange: (name, value) => setMultipartFields((prev) => ({ ...prev, [name]: value }))
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: actionsStyle, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "primary",
+        onClick: handleSend,
+        disabled: loading || sendBlocked,
+        className: fullWidthBtnStyle,
+        children: loading ? "Sending..." : "Send"
+      }
+    ) }),
+    (sendBlocked || authMismatch) && /* @__PURE__ */ jsxs("div", { className: validationMsgStyle, role: "status", children: [
+      missingRequiredParams.length > 0 && /* @__PURE__ */ jsxs("span", { children: [
+        "Required: ",
+        missingRequiredParams.join(", ")
+      ] }),
+      authBlocked && /* @__PURE__ */ jsx("span", { children: "Authorization required \u2014 apply credentials in the Authorization panel." }),
+      authMismatch && /* @__PURE__ */ jsxs("span", { children: [
+        "This operation declares ",
+        declaredSchemes.join(", "),
+        " \u2014 your applied credentials will be sent with the request."
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      CodeSamples,
+      {
+        request: codeSampleRequest,
+        serverUrl,
+        selectedLanguage: codeLang,
+        onLanguageChange: setCodeLang,
+        xCodeSamples
+      }
+    ),
+    /* @__PURE__ */ jsx(ResponseViewer, { response, loading, error })
+  ] });
+}
+const dockedContainerStyle = css({
+  position: "sticky",
+  top: "calc(var(--omnispec-offset-top, 0px) + 1.25rem)",
+  [mq.desktop]: {
+    // When the panel is taller than the viewport, a sticky element would pin
+    // its top and push its bottom off-screen with no way to reach it (the page
+    // scroll tracks the taller left column). Cap it to the viewport and let the
+    // panel scroll its own overflow so every control stays reachable.
+    maxHeight: "calc(100vh - var(--omnispec-offset-top, 0px) - 2.5rem)",
+    overflowY: "auto",
+    // Keep the internal scrollbar off the content edge.
+    paddingRight: "0.25rem"
+  }
+});
+const titleRowStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "8px",
+  marginBottom: "12px"
+});
+const titleStyle$3 = css({
+  margin: 0,
+  fontSize: "var(--omnispec-font-size-base)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-primary)"
+});
+const actionsStyle = css({
+  display: "flex",
+  gap: "8px",
+  marginBottom: "12px"
+});
+const fullWidthBtnStyle = css({
+  width: "100%"
+});
+const statusRowStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "6px",
+  fontSize: "var(--omnispec-font-size-xs)",
+  flex: 1
+});
+const validationMsgStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.25rem",
+  marginBottom: "0.75rem",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-color-warning)",
+  lineHeight: 1.4
+});
+const headerActionsStyle = css({
+  marginLeft: "auto",
+  display: "flex",
+  alignItems: "center",
+  gap: "6px"
+});
+const headerBtnStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "0.375rem",
+  padding: "0.25rem 0.625rem",
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontFamily: "var(--omnispec-font-sans)",
+  color: "var(--omnispec-fg-muted)",
+  backgroundColor: "transparent",
+  border: "1px solid var(--omnispec-border-color)",
+  borderRadius: "var(--omnispec-border-radius)",
+  cursor: "pointer",
+  "&:hover": {
+    color: "var(--omnispec-fg-primary)",
+    backgroundColor: "var(--omnispec-bg-secondary)"
+  }
+});
+
+function InlineTryIt(props) {
+  const [open, setOpen] = useState(false);
+  const regionId = useId();
+  const regionRef = useRef(null);
+  useEffect(() => {
+    if (open) {
+      regionRef.current?.scrollIntoView({ block: "nearest" });
+    }
+  }, [open]);
+  return /* @__PURE__ */ jsxs("div", { className: wrapperStyle, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: triggerStyle,
+        onClick: () => setOpen((prev) => !prev),
+        "aria-expanded": open,
+        "aria-controls": regionId,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: "0.875rem", className: cx(chevronStyle$1, open && chevronOpenStyle) }),
+          /* @__PURE__ */ jsx("span", { children: open ? "Hide Try it" : "Try it" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { id: regionId, ref: regionRef, hidden: !open, className: regionStyle, children: /* @__PURE__ */ jsx(TryItPanel, { ...props, docked: false }) })
+  ] });
+}
+const wrapperStyle = css({
+  marginTop: "1rem"
+});
+const triggerStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "0.5rem",
+  width: "100%",
+  padding: "0.625rem 1rem",
+  background: "var(--omnispec-bg-secondary)",
+  color: "var(--omnispec-fg-primary)",
+  border: "none",
+  borderRadius: "var(--omnispec-border-radius)",
+  boxShadow: "var(--omnispec-btn-secondary-shadow)",
+  cursor: "pointer",
+  fontSize: "var(--omnispec-font-size-base)",
+  fontWeight: 600,
+  textAlign: "left",
+  "&:hover": {
+    background: "var(--omnispec-btn-secondary-bg-hover)"
+  }
+});
+const chevronStyle$1 = css({
+  display: "inline-flex",
+  flexShrink: 0,
+  transition: "transform 0.2s ease"
+});
+const chevronOpenStyle = css({
+  transform: "rotate(90deg)"
+});
+const regionStyle = css({
+  paddingTop: "0.75rem"
+});
+
+const HTTP_METHODS = ["get", "post", "put", "delete", "patch", "options", "head"];
+function parseCallbacks(callbacks) {
+  const result = [];
+  for (const [name, callbackValue] of Object.entries(callbacks)) {
+    if (!callbackValue || typeof callbackValue !== "object") continue;
+    const pathItemMap = callbackValue;
+    for (const [urlExpression, pathItem] of Object.entries(pathItemMap)) {
+      if (!pathItem || typeof pathItem !== "object") continue;
+      const pathItemObj = pathItem;
+      for (const method of HTTP_METHODS) {
+        const operation = pathItemObj[method];
+        if (!operation || typeof operation !== "object") continue;
+        const op = operation;
+        let requestBodySchema;
+        const requestBody = op.requestBody;
+        if (requestBody?.content && typeof requestBody.content === "object") {
+          const content = requestBody.content;
+          const firstMedia = Object.values(content)[0];
+          if (firstMedia?.schema && typeof firstMedia.schema === "object") {
+            requestBodySchema = firstMedia.schema;
+          }
+        }
+        const responseStatuses = [];
+        const responses = op.responses;
+        if (responses && typeof responses === "object") {
+          for (const [code, responseValue] of Object.entries(responses)) {
+            const response = responseValue;
+            responseStatuses.push({
+              code,
+              description: typeof response?.description === "string" ? response.description : ""
+            });
+          }
+        }
+        result.push({
+          name,
+          urlExpression,
+          method,
+          summary: typeof op.summary === "string" ? op.summary : void 0,
+          description: typeof op.description === "string" ? op.description : void 0,
+          requestBodySchema,
+          responseStatuses
+        });
+      }
+    }
+  }
+  return result;
+}
+function CallbackCard({ callback }) {
+  const [expanded, setExpanded] = useState(false);
+  const method = callback.method;
+  return /* @__PURE__ */ jsxs("div", { className: cardStyle, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: cardHeaderStyle,
+        onClick: () => setExpanded((prev) => !prev),
+        "aria-expanded": expanded,
+        children: [
+          /* @__PURE__ */ jsx("span", { className: cx(chevronStyle, expanded && chevronExpandedStyle), children: /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: "0.75rem" }) }),
+          /* @__PURE__ */ jsx("span", { className: callbackNameStyle, children: callback.name }),
+          /* @__PURE__ */ jsx("code", { className: urlExpressionStyle, children: callback.urlExpression })
+        ]
+      }
+    ),
+    expanded && /* @__PURE__ */ jsxs("div", { className: cardBodyStyle, children: [
+      /* @__PURE__ */ jsx(
+        MethodBar,
+        {
+          label: callback.method.toUpperCase(),
+          path: callback.urlExpression,
+          method
+        }
+      ),
+      callback.summary && /* @__PURE__ */ jsx("p", { className: summaryStyle$1, children: callback.summary }),
+      callback.description && /* @__PURE__ */ jsx("p", { className: descriptionStyle, children: callback.description }),
+      callback.requestBodySchema && /* @__PURE__ */ jsxs("div", { className: sectionStyle$1, children: [
+        /* @__PURE__ */ jsx("span", { className: sectionLabelStyle, children: "Request Body" }),
+        /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(callback.requestBodySchema), context: "request" })
+      ] }),
+      callback.responseStatuses.length > 0 && /* @__PURE__ */ jsxs("div", { className: sectionStyle$1, children: [
+        /* @__PURE__ */ jsx("span", { className: sectionLabelStyle, children: "Responses" }),
+        /* @__PURE__ */ jsx("div", { className: responseListStyle$1, children: callback.responseStatuses.map(({ code, description }) => /* @__PURE__ */ jsxs("div", { className: responseRowStyle, children: [
+          /* @__PURE__ */ jsx("span", { className: cx(statusBadgeStyle$1, css({
+            backgroundColor: getStatusBg$1(code),
+            color: getStatusColor$1(code)
+          })), children: code }),
+          description && /* @__PURE__ */ jsx("span", { className: responseDescStyle$1, children: description })
+        ] }, code)) })
+      ] })
+    ] })
+  ] });
+}
+function CallbacksSection({ callbacks }) {
+  const parsed = parseCallbacks(callbacks);
+  if (parsed.length === 0) return null;
+  return /* @__PURE__ */ jsxs("div", { className: containerStyle$2, children: [
+    /* @__PURE__ */ jsx("h4", { className: titleStyle$2, children: "Callbacks" }),
+    /* @__PURE__ */ jsx("div", { className: cardListStyle, children: parsed.map((cb, idx) => /* @__PURE__ */ jsx(CallbackCard, { callback: cb }, `${cb.name}-${cb.method}-${idx}`)) })
+  ] });
+}
+function getStatusColor$1(code) {
+  const num = parseInt(code, 10);
+  if (num >= 200 && num < 300) return "var(--omnispec-color-success)";
+  if (num >= 300 && num < 400) return "var(--omnispec-color-info)";
+  if (num >= 400 && num < 500) return "var(--omnispec-color-warning)";
+  if (num >= 500) return "var(--omnispec-color-error)";
+  return "var(--omnispec-fg-primary)";
+}
+function getStatusBg$1(code) {
+  const num = parseInt(code, 10);
+  if (num >= 200 && num < 300) return "rgba(26, 127, 55, 0.1)";
+  if (num >= 300 && num < 400) return "rgba(5, 80, 174, 0.1)";
+  if (num >= 400 && num < 500) return "rgba(191, 135, 0, 0.1)";
+  if (num >= 500) return "rgba(207, 34, 46, 0.1)";
+  return "var(--omnispec-bg-tertiary)";
+}
+const containerStyle$2 = css({
+  marginBottom: "1.5rem"
+});
+const titleStyle$2 = css({
+  margin: "0 0 0.75rem",
+  fontSize: "var(--omnispec-font-size-md)",
+  fontWeight: 700,
+  color: "var(--omnispec-fg-primary)",
+  letterSpacing: "0.02em"
+});
+const cardListStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.5rem"
+});
+const cardStyle = css({
+  borderRadius: "0.375rem",
+  border: "1px dashed var(--omnispec-border-color)",
+  overflow: "hidden"
+});
+const cardHeaderStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "0.625rem",
+  width: "100%",
+  padding: "0.625rem 0.75rem",
+  background: "var(--omnispec-bg-secondary)",
+  border: "none",
+  cursor: "pointer",
+  textAlign: "left",
+  flexWrap: "wrap",
+  [mq.desktop]: {
+    flexWrap: "nowrap",
+    gap: "0.75rem",
+    padding: "0.625rem 1rem"
+  }
+});
+const chevronStyle = css({
+  color: "var(--omnispec-fg-muted)",
+  flexShrink: 0,
+  transition: "transform 0.2s ease"
+});
+const chevronExpandedStyle = css({
+  transform: "rotate(90deg)"
+});
+const callbackNameStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-primary)",
+  flexShrink: 0
+});
+const urlExpressionStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontFamily: "var(--omnispec-font-mono)",
+  color: "var(--omnispec-fg-muted)",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "0.125rem 0.375rem",
+  borderRadius: "0.25rem",
+  minWidth: 0,
+  wordBreak: "break-all",
+  [mq.desktop]: {
+    wordBreak: "normal"
+  }
+});
+const cardBodyStyle = css({
+  padding: "0",
+  borderTop: "1px solid var(--omnispec-border-color)"
+});
+const summaryStyle$1 = css({
+  margin: "0.75rem 1rem 0",
+  fontSize: "var(--omnispec-font-size-base)",
+  color: "var(--omnispec-fg-secondary)",
+  lineHeight: 1.5
+});
+const descriptionStyle = css({
+  margin: "0.5rem 1rem 0",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)",
+  lineHeight: 1.5
+});
+const sectionStyle$1 = css({
+  padding: "0.75rem 1rem",
+  borderTop: "1px solid color-mix(in srgb, var(--omnispec-border-color) 60%, transparent)"
+});
+const sectionLabelStyle = css({
+  display: "block",
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-muted)",
+  textTransform: "uppercase",
+  letterSpacing: "0.05em",
+  marginBottom: "0.5rem"
+});
+const responseListStyle$1 = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.375rem"
+});
+const responseRowStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "0.625rem"
+});
+const statusBadgeStyle$1 = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontWeight: 700,
+  fontSize: "var(--omnispec-font-size-sm)",
+  padding: "0.125rem 0.5rem",
+  borderRadius: "0.25rem",
+  flexShrink: 0
+});
+const responseDescStyle$1 = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)"
+});
+
+function ExampleBlock({ media }) {
+  const namedExamples = getNamedExamples(media);
+  const [selectedExample, setSelectedExample] = useState(namedExamples[0]?.name ?? "");
+  const activeExample = namedExamples.find((ex) => ex.name === selectedExample);
+  const exampleValue = activeExample?.value;
+  const displayCode = exampleValue !== void 0 ? typeof exampleValue === "string" ? exampleValue : JSON.stringify(exampleValue, null, 2) : media.schema ? JSON.stringify(generateExample(media.schema), null, 2) : "{}";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      ExampleSelector,
+      {
+        examples: namedExamples,
+        selectedName: selectedExample,
+        onSelect: setSelectedExample
+      }
+    ),
+    /* @__PURE__ */ jsx(CodeBlock, { code: displayCode, language: "json" })
+  ] });
+}
+function OperationDetail({
+  operation,
+  paramExampleSelections,
+  onParamExampleSelect
+}) {
+  const opId = operation.operationId ?? `${operation.method}-${operation.path}`;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    operation.deprecated && /* @__PURE__ */ jsxs("div", { className: deprecatedBannerStyle, role: "alert", children: [
+      /* @__PURE__ */ jsx(Icon, { name: "warning", size: "1rem" }),
+      /* @__PURE__ */ jsx("span", { children: "This operation is deprecated and may be removed in a future release. Avoid using it in new integrations." })
+    ] }),
+    operation.summary && /* @__PURE__ */ jsx("p", { className: summaryStyle, children: operation.summary }),
+    operation.externalDocs && /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: operation.externalDocs.url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: externalDocsLinkStyle,
+        children: [
+          operation.externalDocs.description ?? "External docs",
+          /* @__PURE__ */ jsx("span", { className: externalDocsArrowStyle$1, children: "\u2197" })
+        ]
+      }
+    ),
+    operation.description && /* @__PURE__ */ jsx("div", { className: sectionStyle, children: /* @__PURE__ */ jsx(MarkdownRenderer, { content: operation.description }) }),
+    operation.security && operation.security.length > 0 && /* @__PURE__ */ jsxs("div", { className: sectionStyle, children: [
+      /* @__PURE__ */ jsx(LinkableHeading, { id: `${opId}-security`, as: "h4", className: sectionTitleStyle, children: "Security" }),
+      /* @__PURE__ */ jsx("div", { className: securitySchemesList, children: operation.security.map((schemes, idx) => /* @__PURE__ */ jsxs("div", { className: securitySchemesRow, children: [
+        schemes.map((scheme) => /* @__PURE__ */ jsxs("span", { className: securitySchemeBadge, children: [
+          /* @__PURE__ */ jsx(Icon, { name: "lock", size: "0.625rem", strokeWidth: 2.5 }),
+          scheme
+        ] }, scheme)),
+        idx < operation.security.length - 1 && /* @__PURE__ */ jsx("span", { className: securityOrLabel, children: "or" })
+      ] }, idx)) })
+    ] }),
+    operation.parameters.length > 0 && /* @__PURE__ */ jsxs("div", { className: sectionStyle, children: [
+      /* @__PURE__ */ jsx(LinkableHeading, { id: `${opId}-parameters`, as: "h4", className: sectionTitleStyle, children: "Parameters" }),
+      /* @__PURE__ */ jsx("div", { className: paramListStyle, children: operation.parameters.map((param) => {
+        const paramKey = `${param.in}-${param.name}`;
+        const paramSchema = param.schema ?? {};
+        const constraintBadges = buildConstraints(paramSchema);
+        const paramFormat = paramSchema.format;
+        const paramEnum = paramSchema.enum;
+        const namedExamples = param.examples ? Object.entries(param.examples).map(([name, ex]) => ({
+          name,
+          summary: ex.summary,
+          value: ex.value
+        })) : [];
+        const selectedName = paramExampleSelections?.[paramKey] ?? namedExamples[0]?.name ?? "";
+        const activeExample = namedExamples.find((ex) => ex.name === selectedName);
+        return /* @__PURE__ */ jsxs("div", { className: paramRowStyle, children: [
+          /* @__PURE__ */ jsxs("div", { className: paramHeaderStyle, children: [
+            /* @__PURE__ */ jsx("span", { className: paramNameStyle, children: param.name }),
+            /* @__PURE__ */ jsx("pre", { className: typeBadgeStyle, children: param.schema?.type ?? "any" }),
+            param.required && /* @__PURE__ */ jsx("span", { className: requiredBadgeStyle, children: "Required" }),
+            /* @__PURE__ */ jsx("span", { className: inBadgeStyle, children: param.in })
+          ] }),
+          (paramFormat || constraintBadges.length > 0 || paramEnum && paramEnum.length > 0) && /* @__PURE__ */ jsxs("div", { className: paramConstraintsStyle, children: [
+            paramFormat && /* @__PURE__ */ jsx("span", { className: paramConstraintBadgeStyle, children: paramFormat }),
+            constraintBadges.map((c) => /* @__PURE__ */ jsx("span", { className: paramConstraintBadgeStyle, children: c }, c)),
+            paramEnum && paramEnum.length > 0 && /* @__PURE__ */ jsxs("span", { className: paramEnumBadgeStyle, children: [
+              "enum: ",
+              paramEnum.map(String).join(" | ")
+            ] })
+          ] }),
+          param.description && /* @__PURE__ */ jsx("p", { className: paramDescStyle, children: param.description }),
+          namedExamples.length > 1 && /* @__PURE__ */ jsx(
+            ExampleSelector,
+            {
+              examples: namedExamples,
+              selectedName,
+              onSelect: (name) => onParamExampleSelect?.(paramKey, name)
+            }
+          ),
+          activeExample?.value !== void 0 && /* @__PURE__ */ jsx("code", { className: paramExampleValueStyle, children: typeof activeExample.value === "string" ? activeExample.value : JSON.stringify(activeExample.value) })
+        ] }, paramKey);
+      }) })
+    ] }),
+    operation.requestBody && /* @__PURE__ */ jsxs("div", { className: sectionStyle, children: [
+      /* @__PURE__ */ jsxs(LinkableHeading, { id: `${opId}-request-body`, as: "h4", className: sectionTitleStyle, children: [
+        "Request Body",
+        operation.requestBody.required && /* @__PURE__ */ jsx("span", { className: requiredBadgeStyle, children: " Required" })
+      ] }),
+      operation.requestBody.description && /* @__PURE__ */ jsx("p", { className: paramDescStyle, children: operation.requestBody.description }),
+      Object.entries(operation.requestBody.content).map(([contentType, media]) => /* @__PURE__ */ jsxs("div", { className: mediaTypeStyle, children: [
+        /* @__PURE__ */ jsx("code", { className: contentTypeBadgeStyle, children: contentType }),
+        media.schema && /* @__PURE__ */ jsx(
+          Tabs,
+          {
+            tabs: [
+              {
+                id: "schema",
+                label: "Schema",
+                content: /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(media.schema), context: "request" })
+              },
+              {
+                id: "example",
+                label: "Example",
+                content: /* @__PURE__ */ jsx(ExampleBlock, { media })
+              }
+            ]
+          }
+        )
+      ] }, contentType))
+    ] }),
+    operation.responses.length > 0 && /* @__PURE__ */ jsxs("div", { className: sectionStyle, children: [
+      /* @__PURE__ */ jsx(LinkableHeading, { id: `${opId}-responses`, as: "h4", className: sectionTitleStyle, children: "Responses" }),
+      /* @__PURE__ */ jsx("div", { className: responseListStyle, children: operation.responses.map((response) => /* @__PURE__ */ jsxs("div", { className: responseCardStyle, children: [
+        /* @__PURE__ */ jsxs("div", { className: responseHeaderStyle, children: [
+          /* @__PURE__ */ jsx("span", { className: cx(statusBadgeStyle, css({
+            backgroundColor: getStatusBg(response.statusCode),
+            color: getStatusColor(response.statusCode)
+          })), children: response.statusCode }),
+          /* @__PURE__ */ jsx("span", { className: responseDescStyle, children: response.description })
+        ] }),
+        response.headers && Object.keys(response.headers).length > 0 && /* @__PURE__ */ jsxs("div", { className: responseHeadersSection, children: [
+          /* @__PURE__ */ jsx("span", { className: responseHeadersLabel, children: "Headers" }),
+          /* @__PURE__ */ jsx("div", { className: responseHeadersList, children: Object.entries(response.headers).map(([headerName, header]) => /* @__PURE__ */ jsxs("div", { className: responseHeaderWrapper, children: [
+            /* @__PURE__ */ jsxs("div", { className: responseHeaderRow, children: [
+              /* @__PURE__ */ jsx("span", { className: responseHeaderName, children: headerName }),
+              header.schema && /* @__PURE__ */ jsx("pre", { className: typeBadgeStyle, children: header.schema.type ?? "string" })
+            ] }),
+            header.description && /* @__PURE__ */ jsx("div", { className: responseHeaderDesc, children: header.description })
+          ] }, headerName)) })
+        ] }),
+        response.content && Object.entries(response.content).map(([contentType, media]) => {
+          const hasNamedExamples = getNamedExamples(media).length > 0;
+          const hasSchema = !!media.schema;
+          const hasExample = hasNamedExamples;
+          if (!hasSchema && !hasExample) return null;
+          const tabs = [];
+          if (hasSchema) {
+            tabs.push({
+              id: `schema-${response.statusCode}-${contentType}`,
+              label: "Schema",
+              content: /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(media.schema), context: "response" })
+            });
+          }
+          if (hasExample || hasSchema) {
+            tabs.push({
+              id: `example-${response.statusCode}-${contentType}`,
+              label: "Example",
+              content: /* @__PURE__ */ jsx(ExampleBlock, { media })
+            });
+          }
+          return /* @__PURE__ */ jsxs("div", { className: mediaTypeStyle, children: [
+            /* @__PURE__ */ jsx("code", { className: contentTypeLabel, children: contentType }),
+            /* @__PURE__ */ jsx(Tabs, { tabs, defaultTab: hasExample && !hasSchema ? tabs[0]?.id : void 0 })
+          ] }, contentType);
+        })
+      ] }, response.statusCode)) })
+    ] }),
+    operation.callbacks && Object.keys(operation.callbacks).length > 0 && /* @__PURE__ */ jsx("div", { className: sectionStyle, children: /* @__PURE__ */ jsx(CallbacksSection, { callbacks: operation.callbacks }) })
+  ] });
+}
+function getStatusColor(code) {
+  const num = parseInt(code, 10);
+  if (num >= 200 && num < 300) return "var(--omnispec-color-success)";
+  if (num >= 300 && num < 400) return "var(--omnispec-color-info)";
+  if (num >= 400 && num < 500) return "var(--omnispec-color-warning)";
+  if (num >= 500) return "var(--omnispec-color-error)";
+  return "var(--omnispec-fg-primary)";
+}
+function getStatusBg(code) {
+  const num = parseInt(code, 10);
+  if (num >= 200 && num < 300) return "rgba(26, 127, 55, 0.1)";
+  if (num >= 300 && num < 400) return "rgba(5, 80, 174, 0.1)";
+  if (num >= 400 && num < 500) return "rgba(191, 135, 0, 0.1)";
+  if (num >= 500) return "rgba(207, 34, 46, 0.1)";
+  return "var(--omnispec-bg-tertiary)";
+}
+const summaryStyle = css({
+  margin: "0 0 16px",
+  fontSize: "var(--omnispec-font-size-base)",
+  color: "var(--omnispec-fg-secondary)",
+  lineHeight: 1.5
+});
+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 requiredBadgeStyle = css({
+  fontSize: "var(--omnispec-font-size-xxs)",
+  fontWeight: 600,
+  color: "var(--omnispec-color-error)",
+  textTransform: "uppercase",
+  letterSpacing: "0.05em"
+});
+const inBadgeStyle = css({
+  fontSize: "var(--omnispec-font-size-xxs)",
+  color: "var(--omnispec-fg-muted)",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "1px 6px",
+  borderRadius: "3px",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const paramDescStyle = css({
+  margin: "4px 0 0",
+  fontSize: "var(--omnispec-font-size-base)",
+  color: "var(--omnispec-fg-secondary)",
+  lineHeight: 1.5
+});
+const deprecatedBannerStyle = css({
+  display: "flex",
+  alignItems: "flex-start",
+  gap: "0.5rem",
+  padding: "0.625rem 0.75rem",
+  marginBottom: "1rem",
+  borderRadius: "var(--omnispec-border-radius)",
+  backgroundColor: "color-mix(in srgb, var(--omnispec-color-warning) 12%, transparent)",
+  color: "var(--omnispec-color-warning)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  lineHeight: 1.4
+});
+const paramConstraintsStyle = css({
+  display: "flex",
+  flexWrap: "wrap",
+  gap: "0.375rem",
+  marginTop: "0.375rem"
+});
+const paramConstraintBadgeStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)",
+  backgroundColor: "var(--omnispec-bg-secondary)",
+  padding: "0.0625rem 0.375rem",
+  borderRadius: "var(--omnispec-border-radius)"
+});
+const paramEnumBadgeStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-color-info)",
+  backgroundColor: "var(--omnispec-bg-secondary)",
+  padding: "0.0625rem 0.375rem",
+  borderRadius: "var(--omnispec-border-radius)",
+  wordBreak: "break-word"
+});
+const paramExampleValueStyle = css({
+  display: "block",
+  marginTop: "0.375rem",
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-code)",
+  wordBreak: "break-all"
+});
+const mediaTypeStyle = css({
+  marginTop: "1rem",
+  overflow: "hidden",
+  minWidth: 0
+});
+const contentTypeLabel = css({
+  display: "inline-block",
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)",
+  marginBottom: "4px"
+});
+const contentTypeBadgeStyle = css({
+  marginBottom: "8px",
+  fontSize: "var(--omnispec-font-size-sm)"
+});
+const responseListStyle = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "8px"
+});
+const responseCardStyle = css({
+  minWidth: 0,
+  [mq.desktop]: {
+    padding: "0.625rem 1rem",
+    borderRadius: "var(--omnispec-border-radius)",
+    border: "1px solid color-mix(in srgb, var(--omnispec-border-color) 80%, transparent)"
+  }
+});
+const responseHeaderStyle = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "10px"
+});
+const statusBadgeStyle = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontWeight: 700,
+  fontSize: "var(--omnispec-font-size-sm)",
+  padding: "2px 8px",
+  borderRadius: "4px"
+});
+const responseDescStyle = css({
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)"
+});
+const securitySchemesList = css({
+  display: "flex",
+  gap: "8px"
+});
+const securitySchemesRow = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "6px",
+  flexWrap: "wrap"
+});
+const securitySchemeBadge = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "5px",
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontFamily: "var(--omnispec-font-mono)",
+  color: "var(--omnispec-fg-primary)",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "3px 10px",
+  borderRadius: "4px",
+  fontWeight: 500
+});
+const securityOrLabel = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-muted)",
+  fontStyle: "italic"
+});
+const externalDocsLinkStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "4px",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-link)",
+  textDecoration: "none",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "3px 10px",
+  borderRadius: "12px",
+  fontWeight: 500,
+  marginBottom: "12px",
+  "&:hover": {
+    textDecoration: "underline"
+  }
+});
+const externalDocsArrowStyle$1 = css({
+  fontSize: "11px"
+});
+const responseHeadersSection = css({
+  marginTop: "8px",
+  paddingTop: "8px",
+  borderTop: "1px dashed var(--omnispec-border-color)"
+});
+const responseHeadersLabel = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-muted)",
+  textTransform: "uppercase",
+  letterSpacing: "0.05em",
+  display: "block",
+  marginBottom: "10px"
+});
+const responseHeadersList = css({
+  display: "flex",
+  flexDirection: "column",
+  gap: "10px"
+});
+const responseHeaderWrapper = css({
+  display: "flex",
+  flexDirection: "column"
+});
+const responseHeaderRow = css({
+  display: "flex",
+  alignItems: "center",
+  gap: "8px",
+  padding: "4px 0"
+});
+const responseHeaderName = css({
+  fontFamily: "var(--omnispec-font-mono)",
+  fontSize: "var(--omnispec-font-size-sm)",
+  fontWeight: 600,
+  color: "var(--omnispec-fg-primary)",
+  backgroundColor: "transparent",
+  padding: 0
+});
+const responseHeaderDesc = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-secondary)"
+});
+
+function EndpointCard({ operation, serverUrl, id, expandAll, expandGeneration }) {
+  const { allowTryIt, displayMode, tryItLayout } = useConfig();
+  const title = operation.summary || operation.operationId || operation.path;
+  const paramCount = operation.parameters.length + (operation.requestBody ? 1 : 0);
+  const rightLabel = paramCount > 0 ? `${paramCount} param${paramCount !== 1 ? "s" : ""}` : void 0;
+  const [paramExampleSelections, setParamExampleSelections] = useState({});
+  const tryItParams = operation.parameters.map((p) => {
+    const schema = p.schema;
+    const items = schema?.items;
+    const itemsEnum = schema?.type === "array" && Array.isArray(items?.enum) ? items.enum.map(String) : void 0;
+    const exampleValue = resolveParamExampleValue(p, paramExampleSelections[`${p.in}-${p.name}`]);
+    return {
+      name: p.name,
+      in: p.in,
+      required: p.required,
+      description: p.description,
+      type: schema?.type,
+      format: schema?.format,
+      enum: schema?.enum,
+      itemsEnum,
+      explode: p.explode,
+      example: exampleValue !== null && exampleValue !== void 0 ? String(exampleValue) : void 0,
+      default: schema?.default !== null && schema?.default !== void 0 ? String(schema.default) : void 0
+    };
+  });
+  const requestBodyContentTypes = operation.requestBody?.content ? Object.keys(operation.requestBody.content) : void 0;
+  const defaultContentType = requestBodyContentTypes?.[0];
+  const defaultBodySchema = defaultContentType ? operation.requestBody?.content[defaultContentType]?.schema : void 0;
+  const requestBodySchemas = operation.requestBody?.content ? Object.fromEntries(
+    Object.entries(operation.requestBody.content).map(([ct, media]) => [
+      ct,
+      media.schema
+    ])
+  ) : void 0;
+  const defaultBodyExample = defaultBodySchema ? JSON.stringify(generateExample(defaultBodySchema), null, 2) : void 0;
+  const tryItPanelProps = {
+    method: operation.method,
+    path: operation.path,
+    serverUrl,
+    parameters: tryItParams,
+    requestBodyContentTypes,
+    defaultRequestBody: defaultBodyExample,
+    requestBodySchema: defaultBodySchema,
+    requestBodySchemas,
+    security: operation.security,
+    xCodeSamples: operation.xCodeSamples
+  };
+  return /* @__PURE__ */ jsxs(
+    ExpandableCard,
+    {
+      id,
+      title,
+      rightLabel,
+      deprecated: operation.deprecated,
+      badges: operation.xBadges,
+      expandAll,
+      expandGeneration,
+      children: [
+        /* @__PURE__ */ jsx(
+          MethodBar,
+          {
+            label: operation.method,
+            path: operation.path,
+            method: operation.method
+          }
+        ),
+        displayMode === "reference" ? /* @__PURE__ */ jsx(
+          ReferenceLayout,
+          {
+            operationId: id ?? `${operation.method}-${operation.path}`,
+            schema: /* @__PURE__ */ jsx(
+              ReferenceOperationDetail,
+              {
+                operationId: id ?? `${operation.method}-${operation.path}`,
+                description: operation.description,
+                parameters: operation.parameters,
+                requestBody: operation.requestBody,
+                responses: operation.responses,
+                security: operation.security
+              }
+            ),
+            samples: /* @__PURE__ */ jsx(
+              SamplesPanel,
+              {
+                method: operation.method,
+                path: operation.path,
+                serverUrl,
+                operationId: id ?? `${operation.method}-${operation.path}`,
+                requestBodySchema: defaultBodySchema,
+                requestBodyContentType: defaultContentType,
+                responses: operation.responses
+              }
+            ),
+            tryIt: allowTryIt ? /* @__PURE__ */ jsx(TryItPanel, { ...tryItPanelProps }) : /* @__PURE__ */ jsx("div", {})
+          }
+        ) : tryItLayout === "inline" ? (
+          // Inline (compact only): operation detail spans full width, with the
+          // Try-It console in a collapsed-by-default disclosure below it.
+          /* @__PURE__ */ jsxs("div", { className: inlineWrapperStyle, children: [
+            /* @__PURE__ */ jsx(
+              OperationDetail,
+              {
+                operation,
+                paramExampleSelections,
+                onParamExampleSelect: (key, name) => setParamExampleSelections((prev) => ({ ...prev, [key]: name }))
+              }
+            ),
+            allowTryIt && /* @__PURE__ */ jsx(InlineTryIt, { ...tryItPanelProps })
+          ] })
+        ) : /* @__PURE__ */ jsx(
+          ResponsiveColumns,
+          {
+            left: /* @__PURE__ */ jsx(
+              OperationDetail,
+              {
+                operation,
+                paramExampleSelections,
+                onParamExampleSelect: (key, name) => setParamExampleSelections((prev) => ({ ...prev, [key]: name }))
+              }
+            ),
+            right: allowTryIt ? /* @__PURE__ */ jsx(TryItPanel, { ...tryItPanelProps }) : void 0,
+            rightLabel: "Try It"
+          }
+        )
+      ]
+    }
+  );
+}
+const inlineWrapperStyle = css({
+  padding: "0.75rem 0",
+  minWidth: 0,
+  [mq.desktop]: {
+    padding: "1rem 1.25rem"
+  }
+});
+function resolveParamExampleValue(param, selectedName) {
+  if (param.examples && Object.keys(param.examples).length > 0) {
+    if (selectedName && param.examples[selectedName]) {
+      return param.examples[selectedName].value;
+    }
+    const first = Object.values(param.examples)[0];
+    return first?.value;
+  }
+  return param.example;
+}
+
+const TagGroup = memo(function TagGroup2({ tag, serverUrl, expandAll, expandGeneration }) {
+  const title = /* @__PURE__ */ jsxs("span", { className: tagTitleStyle, children: [
+    tag.displayName ?? tag.name,
+    /* @__PURE__ */ jsx("span", { className: tagCountStyle, children: tag.operations.length })
+  ] });
+  return /* @__PURE__ */ jsx("div", { className: `omnispec-tag-group ${tagContainerStyle}`, id: `tag-${tag.name}`, children: /* @__PURE__ */ jsxs(Collapsible, { title, defaultOpen: true, headerStyle: tagHeaderStyleObj, children: [
+    tag.description && /* @__PURE__ */ jsx("div", { className: tagDescriptionStyle, children: /* @__PURE__ */ jsx(MarkdownRenderer, { content: tag.description }) }),
+    tag.externalDocs && /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: tag.externalDocs.url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: externalDocsStyle,
+        children: [
+          tag.externalDocs.description ?? "External docs",
+          /* @__PURE__ */ jsx("span", { className: externalDocsArrowStyle, children: "\u2197" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: tagOperationsStyle, children: tag.operations.map((op, idx) => /* @__PURE__ */ jsx(
+      EndpointCard,
+      {
+        id: op.operationId ?? `${op.method}-${op.path}`,
+        operation: op,
+        serverUrl,
+        expandAll,
+        expandGeneration
+      },
+      op.operationId ?? `${op.method}-${op.path}-${idx}`
+    )) })
+  ] }) });
+});
+const tagContainerStyle = css({
+  marginBottom: "32px"
+});
+const tagHeaderStyleObj = {
+  paddingBottom: "8px",
+  borderBottom: "2px solid var(--omnispec-border-color)",
+  marginBottom: "12px"
+};
+const tagTitleStyle = css({
+  fontSize: "18px",
+  fontWeight: 800,
+  color: "var(--omnispec-fg-primary)",
+  display: "flex",
+  alignItems: "center",
+  gap: "10px",
+  letterSpacing: "-0.01em"
+});
+const tagCountStyle = css({
+  fontSize: "11px",
+  fontWeight: 500,
+  color: "var(--omnispec-fg-muted)",
+  backgroundColor: "var(--omnispec-bg-tertiary)",
+  padding: "2px 8px",
+  borderRadius: "10px",
+  fontFamily: "var(--omnispec-font-mono)"
+});
+const tagDescriptionStyle = css({
+  marginBottom: "16px",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-secondary)",
+  lineHeight: 1.6
+});
+const externalDocsStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "0.25rem",
+  fontSize: "var(--omnispec-font-size-xs)",
+  color: "var(--omnispec-fg-link)",
+  textDecoration: "none",
+  marginBottom: "1rem",
+  "&:hover": {
+    textDecoration: "underline"
+  }
+});
+const externalDocsArrowStyle = css({
+  fontSize: "0.75em"
+});
+const tagOperationsStyle = css({
+  display: "flex",
+  flexDirection: "column"
+});
+
+function ComponentsSection({ components, expandAll, expandGeneration }) {
+  const schemas = Object.entries(components.schemas);
+  if (schemas.length === 0) return null;
+  return /* @__PURE__ */ jsxs("div", { className: `omnispec-components ${containerStyle$1}`, children: [
+    /* @__PURE__ */ jsx(LinkableHeading, { id: "schemas", as: "h2", className: titleStyle$1, 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("span", { className: schemaNameStyle, children: name }),
+        defaultOpen: false,
+        expandAll,
+        expandGeneration,
+        children: /* @__PURE__ */ jsx(SchemaTree, { nodes: schemaToNodes(schema) })
+      }
+    ) }, name)) })
+  ] });
+}
+const containerStyle$1 = css({
+  marginTop: "2rem",
+  paddingTop: "1.5rem",
+  borderTop: "1px solid var(--omnispec-border-color)",
+  [mq.mobile]: {
+    borderTop: "none",
+    marginTop: "1.5rem",
+    paddingTop: "1rem"
+  }
+});
+const titleStyle$1 = 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: "0.5rem",
+  padding: "1.5rem 1rem",
+  minWidth: 0
+});
+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)",
+  overflowWrap: "break-word",
+  wordBreak: "break-all",
+  "&:hover": {
+    textDecoration: "none"
+  }
+});
+
+function parseHash() {
+  const hash = window.location.hash.slice(1);
+  if (!hash || hash === "/") {
+    return { view: "overview", operationId: null };
+  }
+  return { view: "operation", operationId: hash };
+}
+function useSegmentedRouter() {
+  const [route, setRoute] = useState(parseHash);
+  useEffect(() => {
+    const onHashChange = () => setRoute(parseHash());
+    window.addEventListener("hashchange", onHashChange);
+    return () => window.removeEventListener("hashchange", onHashChange);
+  }, []);
+  const navigateToOperation = useCallback((operationId) => {
+    window.location.hash = operationId;
+  }, []);
+  const navigateToOverview = useCallback(() => {
+    window.history.replaceState(null, "", window.location.pathname);
+    setRoute({ view: "overview", operationId: null });
+  }, []);
+  return { route, navigateToOperation, navigateToOverview };
+}
+
+function OperationView({ operation, serverUrl, onBack, tagName }) {
+  const { allowTryIt, displayMode, tryItLayout } = useConfig();
+  const title = operation.summary || operation.operationId || operation.path;
+  const tryItParams = operation.parameters.map((p) => {
+    const schema = p.schema;
+    return {
+      name: p.name,
+      in: p.in,
+      required: p.required,
+      description: p.description,
+      type: schema?.type,
+      format: schema?.format,
+      enum: schema?.enum,
+      example: p.example !== null && p.example !== void 0 ? String(p.example) : void 0,
+      default: schema?.default !== null && schema?.default !== void 0 ? String(schema.default) : void 0
+    };
+  });
+  const requestBodyContentTypes = operation.requestBody?.content ? Object.keys(operation.requestBody.content) : void 0;
+  const defaultContentType = requestBodyContentTypes?.[0];
+  const defaultBodySchema = defaultContentType ? operation.requestBody?.content[defaultContentType]?.schema : void 0;
+  const defaultBodyExample = defaultBodySchema ? JSON.stringify(generateExample(defaultBodySchema), null, 2) : void 0;
+  const tryItPanelProps = {
+    method: operation.method,
+    path: operation.path,
+    serverUrl,
+    parameters: tryItParams,
+    requestBodyContentTypes,
+    defaultRequestBody: defaultBodyExample,
+    requestBodySchema: defaultBodySchema,
+    xCodeSamples: operation.xCodeSamples
+  };
+  return /* @__PURE__ */ jsxs("div", { className: containerStyle, children: [
+    /* @__PURE__ */ jsxs("button", { type: "button", onClick: onBack, className: backBtnStyle, children: [
+      "\u2190 ",
+      tagName ?? "All Operations"
+    ] }),
+    /* @__PURE__ */ jsx("h2", { className: titleStyle, children: title }),
+    /* @__PURE__ */ jsx(
+      MethodBar,
+      {
+        label: operation.method,
+        path: operation.path,
+        method: operation.method
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: contentStyle, children: displayMode === "reference" ? /* @__PURE__ */ jsx(
+      ReferenceLayout,
+      {
+        operationId: operation.operationId ?? `${operation.method}-${operation.path}`,
+        schema: /* @__PURE__ */ jsx(
+          ReferenceOperationDetail,
+          {
+            operationId: operation.operationId ?? `${operation.method}-${operation.path}`,
+            description: operation.description,
+            parameters: operation.parameters,
+            requestBody: operation.requestBody,
+            responses: operation.responses,
+            security: operation.security
+          }
+        ),
+        samples: /* @__PURE__ */ jsx(
+          SamplesPanel,
+          {
+            method: operation.method,
+            path: operation.path,
+            serverUrl,
+            operationId: operation.operationId ?? `${operation.method}-${operation.path}`,
+            requestBodySchema: defaultBodySchema,
+            requestBodyContentType: defaultContentType,
+            responses: operation.responses
+          }
+        ),
+        tryIt: allowTryIt ? /* @__PURE__ */ jsx(TryItPanel, { ...tryItPanelProps }) : /* @__PURE__ */ jsx("div", {})
+      }
+    ) : tryItLayout === "inline" ? (
+      // Inline (compact only): operation detail full-width, Try-It console in
+      // a collapsed-by-default disclosure below it.
+      /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(OperationDetail, { operation }),
+        allowTryIt && /* @__PURE__ */ jsx(InlineTryIt, { ...tryItPanelProps })
+      ] })
+    ) : /* @__PURE__ */ jsx(
+      ResponsiveColumns,
+      {
+        left: /* @__PURE__ */ jsx(OperationDetail, { operation }),
+        right: allowTryIt ? /* @__PURE__ */ jsx(TryItPanel, { ...tryItPanelProps }) : void 0,
+        rightLabel: "Try It"
+      }
+    ) })
+  ] });
+}
+const containerStyle = css({
+  padding: 0
+});
+const backBtnStyle = css({
+  display: "inline-flex",
+  alignItems: "center",
+  gap: "0.25rem",
+  background: "none",
+  border: "none",
+  cursor: "pointer",
+  fontSize: "var(--omnispec-font-size-sm)",
+  color: "var(--omnispec-fg-link)",
+  padding: "0 0 0.75rem",
+  fontWeight: 500,
+  "&:hover": {
+    textDecoration: "underline"
+  }
+});
+const titleStyle = css({
+  fontSize: "var(--omnispec-h2-font-size)",
+  fontWeight: "var(--omnispec-h2-font-weight)",
+  color: "var(--omnispec-h2-color)",
+  margin: "0 0 0.75rem"
+});
+const contentStyle = css({
+  marginTop: "1rem"
+});
+
+function SegmentedContent({
+  route,
+  parsedSpec,
+  serverUrl,
+  onBack,
+  overviewContent
+}) {
+  if (route.view === "overview" || !route.operationId) {
+    return /* @__PURE__ */ jsx(Fragment, { children: overviewContent });
+  }
+  for (const tag of parsedSpec.tags) {
+    for (const op of tag.operations) {
+      const opId = op.operationId ?? `${op.method}-${op.path}`;
+      if (opId === route.operationId) {
+        return /* @__PURE__ */ jsx(
+          OperationView,
+          {
+            operation: op,
+            serverUrl,
+            onBack,
+            tagName: tag.displayName ?? tag.name
+          }
+        );
+      }
+    }
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: overviewContent });
+}
+
+function operationMatchesSearch(op, lowercasedQuery) {
+  return op.path.toLowerCase().includes(lowercasedQuery) || (op.summary?.toLowerCase().includes(lowercasedQuery) ?? false) || (op.description?.toLowerCase().includes(lowercasedQuery) ?? false) || (op.operationId?.toLowerCase().includes(lowercasedQuery) ?? false) || op.method.toLowerCase().includes(lowercasedQuery);
+}
+
+const OVERVIEW_NAV_ID = "__apidoc_overview__";
+let warnedTryItLayoutIgnored = false;
+function OpenApiSpec({
+  spec,
+  theme,
+  proxyUrl,
+  proxyHeaders,
+  oauth,
+  interactiveOAuth = true,
+  allowTryIt = true,
+  downloadLink,
+  layout = "sidebar",
+  sidebarPosition = "left",
+  // Default `panel` (docked side column). Non-breaking: the prop was dead until
+  // inline was implemented, so `panel` matches every consumer's current Try-It.
+  tryItLayout = "panel",
+  defaultExpandOperations = false,
+  displayMode,
+  schemaStyle,
+  externalRefOrigins,
+  serverUrl: serverUrlOverride,
+  servers: serversOverride,
+  tryItPersistTtl,
+  navigationMode,
+  pro,
+  sidebarNav,
+  slots = {},
+  onSpecLoaded,
+  onTryItRequest: _onTryItRequest,
+  onTryItResponse: _onTryItResponse,
+  className
+}) {
+  const refOptions = useMemo(() => ({
+    specUrl: typeof spec === "string" ? spec : void 0,
+    externalRefOrigins
+  }), [spec, externalRefOrigins]);
+  const { data: parsedSpec, state } = useOpenApiSpec(spec, refOptions);
+  const [selectedServer, setSelectedServer] = useState("");
+  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) {
+      onSpecLoaded({
+        title: parsedSpec.title,
+        version: parsedSpec.version,
+        type: parsedSpec.specVersion.startsWith("2") ? SpecType.OPENAPI_2 : SpecType.OPENAPI_3
+      });
+    }
+  }, [parsedSpec, onSpecLoaded]);
+  const specOrigin = useMemo(() => {
+    if (typeof spec !== "string") return "";
+    try {
+      const parsed = new URL(spec, window.location.origin);
+      return parsed.origin;
+    } catch {
+      return "";
+    }
+  }, [spec]);
+  const resolveServerUrl = useCallback((url) => {
+    if (url.startsWith("/") && specOrigin) {
+      return specOrigin + url;
+    }
+    return url;
+  }, [specOrigin]);
+  const effectiveServers = useMemo(() => {
+    if (serverUrlOverride) return [{ url: serverUrlOverride }];
+    if (serversOverride?.length) {
+      return serversOverride.map((s) => ({ url: s.url, description: s.description }));
+    }
+    return parsedSpec?.servers ?? [];
+  }, [serverUrlOverride, serversOverride, parsedSpec]);
+  const serverUrl = useMemo(() => {
+    if (serverUrlOverride) return resolveServerUrl(serverUrlOverride);
+    if (selectedServer) return resolveServerUrl(selectedServer);
+    const first = effectiveServers[0];
+    if (!first) return specOrigin || (typeof window !== "undefined" ? window.location.origin : "");
+    let url = first.url;
+    if (first.variables) {
+      for (const [key, variable] of Object.entries(first.variables)) {
+        if (variable.default) {
+          url = url.replace(`{${key}}`, variable.default);
+        }
+      }
+    }
+    return resolveServerUrl(url);
+  }, [serverUrlOverride, selectedServer, effectiveServers, specOrigin, resolveServerUrl]);
+  const navItems = useMemo(() => {
+    if (!parsedSpec) return [];
+    const tagItemMap = /* @__PURE__ */ new Map();
+    for (const tag of parsedSpec.tags) {
+      tagItemMap.set(tag.name, {
+        id: `tag-${tag.name}`,
+        label: tag.displayName ?? tag.name,
+        children: tag.operations.map((op) => ({
+          id: op.operationId ?? `${op.method}-${op.path}`,
+          label: op.summary ?? `${op.method.toUpperCase()} ${op.path}`,
+          badge: op.method.toUpperCase(),
+          badgeColor: `var(--omnispec-color-${op.method})`
+        }))
+      });
+    }
+    let items;
+    if (parsedSpec.tagGroups?.length) {
+      items = parsedSpec.tagGroups.map((group) => ({
+        id: `group-${group.name}`,
+        label: group.name,
+        children: group.tags.map((tagName) => tagItemMap.get(tagName)).filter(Boolean)
+      }));
+    } else {
+      items = Array.from(tagItemMap.values());
+    }
+    if (parsedSpec.webhooks?.length) {
+      items.push({
+        id: "tag-Webhooks",
+        label: "Webhooks",
+        children: parsedSpec.webhooks.map((op) => ({
+          id: op.operationId ?? `${op.method}-${op.path}`,
+          label: op.summary ?? `${op.method.toUpperCase()} ${op.path}`,
+          badge: op.method.toUpperCase(),
+          badgeColor: `var(--omnispec-color-${op.method})`
+        }))
+      });
+    }
+    if (parsedSpec.components && 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 filteredTags = useMemo(() => {
+    if (!parsedSpec || !searchQuery.trim()) return parsedSpec?.tags ?? [];
+    const q = searchQuery.toLowerCase();
+    return parsedSpec.tags.map((tag) => ({
+      ...tag,
+      operations: tag.operations.filter((op) => operationMatchesSearch(op, q))
+    })).filter((tag) => tag.operations.length > 0);
+  }, [parsedSpec, searchQuery]);
+  const webhooksTag = useMemo(() => {
+    if (!parsedSpec?.webhooks?.length) return null;
+    const q = searchQuery.trim().toLowerCase();
+    const operations = q ? parsedSpec.webhooks.filter((op) => operationMatchesSearch(op, q)) : parsedSpec.webhooks;
+    if (operations.length === 0) return null;
+    return {
+      name: "Webhooks",
+      description: "Webhooks the API sends to registered subscribers.",
+      operations
+    };
+  }, [parsedSpec, searchQuery]);
+  const operationCount = useMemo(
+    () => parsedSpec?.tags.reduce((sum, tag) => sum + tag.operations.length, 0) ?? 0,
+    [parsedSpec]
+  );
+  const SEGMENTED_THRESHOLD = 50;
+  const resolvedMode = useMemo(() => {
+    if (navigationMode) return navigationMode;
+    return operationCount > SEGMENTED_THRESHOLD ? "segmented" : "grouped";
+  }, [navigationMode, operationCount]);
+  const isSegmented = resolvedMode === "segmented";
+  const resolvedDisplayMode = displayMode ?? "compact";
+  const resolvedSchemaStyle = resolveSchemaStyle(schemaStyle, pro?.advancedSchemaStyles ?? false);
+  useEffect(() => {
+    if (process.env.NODE_ENV !== "production" && resolvedDisplayMode === "reference" && tryItLayout === "inline" && !warnedTryItLayoutIgnored) {
+      warnedTryItLayoutIgnored = true;
+      console.warn(
+        "[omnispec] `tryItLayout: 'inline'` is ignored in reference display mode \u2014 reference mode renders Try-It as its own right-column tab."
+      );
+    }
+  }, [resolvedDisplayMode, tryItLayout]);
+  const { route, navigateToOperation, navigateToOverview } = useSegmentedRouter();
+  const { navigateTo } = useHashScroll(operationCount);
+  const handleNavSelect = navigateTo;
+  const handleSegmentedSelect = useCallback(
+    (id) => {
+      if (id === OVERVIEW_NAV_ID) {
+        navigateToOverview();
+      } else {
+        navigateToOperation(id);
+      }
+    },
+    [navigateToOverview, navigateToOperation]
+  );
+  const segmentedNavItems = useMemo(() => {
+    if (!isSegmented) return navItems;
+    return [
+      { id: OVERVIEW_NAV_ID, label: "Overview", icon: /* @__PURE__ */ jsx(Icon, { name: "home", size: "1rem" }) },
+      ...navItems
+    ];
+  }, [isSegmented, navItems]);
+  const navSectionIds = useMemo(() => flattenNavItemIds(navItems), [navItems]);
+  const activeSection = useScrollSpy(navSectionIds);
+  if (state.status === "loading") {
+    return /* @__PURE__ */ jsx(ThemeProvider, { theme, children: /* @__PURE__ */ jsx("div", { className: cx("omnispec-openapi", className), children: /* @__PURE__ */ jsx(LoadingScreen, {}) }) });
+  }
+  if (state.status === "error") {
+    return /* @__PURE__ */ jsx(
+      SpecStatusScreen,
+      {
+        theme,
+        layout,
+        sidebarPosition,
+        slots,
+        sidebarNav,
+        premiumThemingEnabled: pro?.premiumThemingEnabled ?? false,
+        className: cx("omnispec-openapi", 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("div", { className: headingStyle, children: "Operations" }),
+    /* @__PURE__ */ jsx(
+      SearchBar,
+      {
+        placeholder: "Filter endpoints...",
+        onSearch: setSearchQuery
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      NavTree,
+      {
+        items: segmentedNavItems,
+        activeId: isSegmented ? route.operationId ?? OVERVIEW_NAV_ID : activeSection,
+        onSelect: isSegmented ? handleSegmentedSelect : handleNavSelect,
+        parentToggleOnly: isSegmented
+      }
+    )
+  ] });
+  const sidebar = buildSidebar(sidebarNav, specNav);
+  const resolvedDownloadLink = resolveDownloadLink(downloadLink, spec);
+  return /* @__PURE__ */ jsx(ConfigProvider, { config: { proxyUrl, proxyHeaders, oauth, allowTryIt, layout, sidebarPosition, tryItLayout, defaultExpandOperations, displayMode: resolvedDisplayMode, schemaStyle: resolvedSchemaStyle, slots, proRenderers: pro?.renderers ?? /* @__PURE__ */ new Map(), premiumThemingEnabled: pro?.premiumThemingEnabled ?? false, interactiveAuth: pro?.interactiveAuth, interactiveOAuth, specKey: `${parsedSpec.title}@${parsedSpec.version}`, tryItPersistTtl }, children: /* @__PURE__ */ jsx(ExpandProvider, { expandAll: allExpanded, expandGeneration, children: /* @__PURE__ */ jsx(ThemeProvider, { theme, children: /* @__PURE__ */ jsx(AuthProvider, { schemes: parsedSpec.securitySchemes, children: /* @__PURE__ */ jsxs("div", { className: `omnispec-openapi ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsx(AuthPanelModal, { serverUrl }),
+    /* @__PURE__ */ jsx(ErrorBoundary, { title: "Failed to render this API reference", children: /* @__PURE__ */ jsx(
+      DocLayout,
+      {
+        layout,
+        sidebarPosition,
+        sidebar,
+        sidebarHeader: slots.sidebarHeader ?? (parsedSpec.logo ? /* @__PURE__ */ jsx("a", { href: parsedSpec.logo.href ?? "#", className: logoLinkStyle, children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: parsedSpec.logo.url,
+            alt: parsedSpec.logo.altText ?? "Logo",
+            className: logoImgStyle,
+            style: parsedSpec.logo.backgroundColor ? { backgroundColor: parsedSpec.logo.backgroundColor } : void 0
+          }
+        ) }) : void 0),
+        sidebarFooter: slots.sidebarFooter,
+        header: slots.header,
+        contentHeader: slots.contentHeader,
+        footer: slots.footer,
+        children: isSegmented ? /* @__PURE__ */ jsx(
+          SegmentedContent,
+          {
+            route,
+            parsedSpec,
+            serverUrl,
+            onBack: navigateToOverview,
+            overviewContent: /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                SpecToolbar,
+                {
+                  overview: /* @__PURE__ */ jsx(ApiOverview, { spec: parsedSpec }),
+                  versionBadge: /* @__PURE__ */ jsx(ApiVersionBadge, { version: parsedSpec.version }),
+                  expandLabel: "schemas",
+                  allExpanded,
+                  onToggleExpand: handleToggleExpand,
+                  downloadLink: resolvedDownloadLink
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ServerSelector,
+                {
+                  servers: effectiveServers,
+                  selectedUrl: serverUrl,
+                  onSelect: setSelectedServer
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ComponentsSection,
+                {
+                  components: parsedSpec.components,
+                  expandAll: allExpanded,
+                  expandGeneration
+                }
+              )
+            ] })
+          }
+        ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            SpecToolbar,
+            {
+              overview: /* @__PURE__ */ jsx(ApiOverview, { spec: parsedSpec }),
+              versionBadge: /* @__PURE__ */ jsx(ApiVersionBadge, { version: parsedSpec.version }),
+              expandLabel: "operations",
+              allExpanded,
+              onToggleExpand: handleToggleExpand,
+              downloadLink: resolvedDownloadLink
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ServerSelector,
+            {
+              servers: effectiveServers,
+              selectedUrl: serverUrl,
+              onSelect: setSelectedServer
+            }
+          ),
+          filteredTags.map((tag) => /* @__PURE__ */ jsx(
+            TagGroup,
+            {
+              tag,
+              serverUrl,
+              expandAll: allExpanded,
+              expandGeneration
+            },
+            tag.name
+          )),
+          webhooksTag && /* @__PURE__ */ jsx(
+            TagGroup,
+            {
+              tag: webhooksTag,
+              serverUrl,
+              expandAll: allExpanded,
+              expandGeneration
+            },
+            "__webhooks__"
+          ),
+          /* @__PURE__ */ jsx(
+            ComponentsSection,
+            {
+              components: parsedSpec.components,
+              expandAll: allExpanded,
+              expandGeneration
+            }
+          )
+        ] })
+      }
+    ) })
+  ] }) }) }) }) });
+}
+const headingStyle = css({
+  fontSize: "var(--omnispec-font-size-xs)",
+  fontWeight: 700,
+  textTransform: "uppercase",
+  letterSpacing: "0.08em",
+  color: "var(--omnispec-nav-heading-color)",
+  padding: "1rem 0.75rem 0.25rem"
+});
+const logoLinkStyle = css({
+  display: "block",
+  padding: "0.75rem",
+  textDecoration: "none"
+});
+const logoImgStyle = css({
+  maxWidth: "100%",
+  maxHeight: "4rem",
+  objectFit: "contain"
+});
+
+var OpenApiSpec$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  OpenApiSpec: OpenApiSpec
+});
+
+export { OpenApiSpec as O, authSchemeLabel as a, OpenApiSpec$1 as b };
+//# sourceMappingURL=OpenApiSpec-Cy-oW6jA.js.map