fumadocs-openapi 10.6.5 → 10.6.7

package/dist/requests/generators/curl.js

@@ -1,24 +1,24 @@
-import { escapeString, indent, inputToString } from "../string-utils.js";
+import { doubleQuote, indent, inputToString, singleQuote } from "../string-utils.js";
 //#region src/requests/generators/curl.ts
 const curl = {
 	label: "cURL",
 	lang: "bash",
 	generate(url, data) {
 		const s = [];
-		s.push(`curl -X ${data.method} "${url}"`);
+		s.push(`curl -X ${data.method.toUpperCase()} "${url}"`);
 		for (const header in data.header) {
 			const value = `${header}: ${data.header[header].value}`;
 			s.push(`-H "${value}"`);
 		}
 		for (const k in data.cookie) {
 			const param = data.cookie[k];
-			s.push(`--cookie ${JSON.stringify(`${k}=${param.value}`)}`);
+			s.push(`--cookie ${doubleQuote(`${k}=${param.value}`)}`);
 		}
 		if (data.body && data.bodyMediaType === "multipart/form-data") {
 			if (typeof data.body !== "object") throw new Error("[CURL] request body must be an object.");
-			for (const [key, value] of Object.entries(data.body)) s.push(`-F ${key}=${JSON.stringify(inputToString(value))}`);
+			for (const [key, value] of Object.entries(data.body)) s.push(`-F ${key}=${doubleQuote(inputToString(value))}`);
 		} else if (data.body && data.bodyMediaType) {
-			const escaped = escapeString(inputToString(data.body, data.bodyMediaType), "'");
+			const escaped = singleQuote(inputToString(data.body, data.bodyMediaType));
 			s.push(`-H "Content-Type: ${data.bodyMediaType}"`);
 			s.push(`-d ${escaped}`);
 		}

package/dist/requests/generators/go.js

@@ -1,4 +1,4 @@
-import { indent } from "../string-utils.js";
+import { doubleQuote, indent } from "../string-utils.js";
 import { resolveMediaAdapter } from "../media/resolve-adapter.js";
 import "../media/adapter.js";
 //#region src/requests/generators/go.ts
@@ -13,10 +13,10 @@ const go = {
 		];
 		const headers = /* @__PURE__ */ new Map();
 		const variables = /* @__PURE__ */ new Map();
-		variables.set("url", JSON.stringify(url));
-		for (const header in data.header) headers.set(header, JSON.stringify(data.header[header].value));
+		variables.set("url", doubleQuote(url));
+		for (const header in data.header) headers.set(header, doubleQuote(data.header[header].value));
 		const cookies = Object.entries(data.cookie);
-		if (cookies.length > 0) headers.set("Cookie", JSON.stringify(cookies.map(([k, param]) => `${k}=${param.value}`).join("; ")));
+		if (cookies.length > 0) headers.set("Cookie", doubleQuote(cookies.map(([k, param]) => `${k}=${param.value}`).join("; ")));
 		let body;
 		if (data.body && data.bodyMediaType) {
 			const adapter = resolveMediaAdapter(data.bodyMediaType, mediaAdapters);
@@ -37,7 +37,7 @@ ${indent(imports.map((v) => `"${v}"`).join("\n"))}
 func main() {
 ${Array.from(variables.entries()).map(([k, v]) => indent(`${k} := ${v}`)).join("\n")}
 ${body ? indent(body) : ""}
-  req, _ := http.NewRequest("${data.method}", url, ${body ? "body" : "nil"})
+  req, _ := http.NewRequest("${data.method.toUpperCase()}", url, ${body ? "body" : "nil"})
 ${indent(Array.from(headers.entries()).map(([key, value]) => `req.Header.Add("${key}", ${value})`).join("\n"))}
   res, _ := http.DefaultClient.Do(req)
   defer res.Body.Close()

package/dist/requests/generators/java.js

@@ -1,4 +1,4 @@
-import { indent } from "../string-utils.js";
+import { doubleQuote, indent } from "../string-utils.js";
 import { resolveMediaAdapter } from "../media/resolve-adapter.js";
 import "../media/adapter.js";
 //#region src/requests/generators/java.ts
@@ -31,13 +31,13 @@ const java = {
 		s.push(indent(".build();"));
 		s.push("");
 		s.push("HttpRequest.Builder requestBuilder = HttpRequest.newBuilder()");
-		s.push(indent(`.uri(URI.create(${JSON.stringify(url)}))`));
-		for (const [key, param] of Object.entries(headers)) s.push(indent(`.header(${JSON.stringify(key)}, ${JSON.stringify(param.value)})`));
+		s.push(indent(`.uri(URI.create(${doubleQuote(url)}))`));
+		for (const [key, param] of Object.entries(headers)) s.push(indent(`.header(${doubleQuote(key)}, ${doubleQuote(param.value)})`));
 		if (data.bodyMediaType) s.push(indent(`.header("Content-Type", "${data.bodyMediaType}")`));
 		const cookies = Object.entries(data.cookie);
 		if (cookies.length > 0) {
 			const cookieString = cookies.map(([key, param]) => `${key}=${param.value}`).join("; ");
-			s.push(indent(`.header("Cookie", ${JSON.stringify(cookieString)})`));
+			s.push(indent(`.header("Cookie", ${doubleQuote(cookieString)})`));
 		}
 		const arg = body ? "body" : "";
 		s.push(indent(`.${data.method.toUpperCase()}(${arg})`));

package/dist/requests/generators/javascript.js

@@ -1,4 +1,4 @@
-import { indent } from "../string-utils.js";
+import { doubleQuote, indent } from "../string-utils.js";
 import { resolveMediaAdapter } from "../media/resolve-adapter.js";
 import "../media/adapter.js";
 //#region src/requests/generators/javascript.ts
@@ -9,7 +9,7 @@ const javascript = {
 		const s = [];
 		const options = /* @__PURE__ */ new Map();
 		const headers = {};
-		options.set("method", JSON.stringify(data.method));
+		options.set("method", `"${data.method.toUpperCase()}"`);
 		if (data.bodyMediaType) headers["Content-Type"] = data.bodyMediaType;
 		for (const [k, v] of Object.entries(data.header)) headers[k] = v.value;
 		const cookies = Object.entries(data.cookie);
@@ -26,7 +26,7 @@ const javascript = {
 			s.push(body);
 			options.set("body", "body");
 		}
-		const params = [JSON.stringify(url)];
+		const params = [doubleQuote(url)];
 		if (options.size > 0) {
 			const str = Array.from(options.entries()).map(([k, v]) => indent(k === v ? k : `${k}: ${v}`)).join(",\n");
 			params.push(`{\n${str}\n}`);

package/dist/requests/generators/python.js

@@ -1,3 +1,4 @@
+import { doubleQuote } from "../string-utils.js";
 import { resolveMediaAdapter } from "../media/resolve-adapter.js";
 import "../media/adapter.js";
 //#region src/requests/generators/python.ts
@@ -7,7 +8,7 @@ const python = {
 	generate(url, data, { mediaAdapters }) {
 		const headers = {};
 		const imports = /* @__PURE__ */ new Set();
-		const params = [`"${data.method}"`, "url"];
+		const params = [`"${data.method.toUpperCase()}"`, "url"];
 		let body;
 		imports.add("requests");
 		if (data.body && data.bodyMediaType) {
@@ -26,7 +27,7 @@ const python = {
 		}
 		return `${Array.from(imports).map((name) => "import " + name).join("\n")}
 
-url = ${JSON.stringify(url)}
+url = ${doubleQuote(url)}
 ${body ?? ""}
 response = requests.request(${params.join(", ")})
 
@@ -36,13 +37,13 @@ print(response.text)`;
 function generatePythonObject(v, imports) {
 	if (v === null) return "None";
 	else if (typeof v === "boolean") return v ? "True" : "False";
-	else if (typeof v === "string") return JSON.stringify(v);
+	else if (typeof v === "string") return doubleQuote(v);
 	else if (typeof v === "number") return v.toString();
 	else if (Array.isArray(v)) return `[${v.map((item) => generatePythonObject(item, imports)).join(", ")}]`;
 	else if (v instanceof Date) {
 		imports.add("datetime");
 		return `datetime.datetime(${v.getFullYear()}, ${v.getMonth() + 1}, ${v.getDate()}, ${v.getHours()}, ${v.getMinutes()}, ${v.getSeconds()}, ${v.getMilliseconds()})`;
-	} else if (typeof v === "object") return `{\n${Object.entries(v).map(([key, value]) => `  ${JSON.stringify(key)}: ${generatePythonObject(value, imports)}`).join(", \n")}\n}`;
+	} else if (typeof v === "object") return `{\n${Object.entries(v).map(([key, value]) => `  ${doubleQuote(key)}: ${generatePythonObject(value, imports)}`).join(", \n")}\n}`;
 	else throw new Error(`Unsupported type: ${typeof v}`);
 }
 //#endregion

package/dist/requests/media/adapter.js

@@ -1,4 +1,4 @@
-import { escapeString, inputToString } from "../string-utils.js";
+import { backtickQuote, inputToString, tripleDoubleQuote } from "../string-utils.js";
 import "./resolve-adapter.js";
 import js2xml from "xml-js/lib/js2xml.js";
 //#region src/requests/media/adapter.ts
@@ -80,7 +80,7 @@ const defaultAdapters = {
 				s.push("mp := multipart.NewWriter(payload)");
 				for (const [key, value] of Object.entries(data.body)) {
 					if (!value) continue;
-					const escaped = escapeString(inputToString(value, "application/json"), "`");
+					const escaped = backtickQuote(inputToString(value, "application/json"));
 					s.push(`mp.WriteField("${key}", ${escaped})`);
 				}
 			}
@@ -103,20 +103,20 @@ const defaultAdapters = {
 function str(init, mediaType, ctx) {
 	if (ctx.lang === "js") {
 		if (mediaType === "application/json") return `const body = JSON.stringify(${JSON.stringify(init, null, 2)})`;
-		return `const body = ${escapeString(inputToString(init, mediaType), "`")}`;
+		return `const body = ${backtickQuote(inputToString(init, mediaType))}`;
 	}
-	if (ctx.lang === "python") return `body = ${escapeString(inputToString(init, mediaType), "\"\"\"")}`;
+	if (ctx.lang === "python") return `body = ${tripleDoubleQuote(inputToString(init, mediaType))}`;
 	if (ctx.lang === "go") {
 		const { addImport } = ctx;
 		addImport("strings");
-		return `body := strings.NewReader(${escapeString(inputToString(init, mediaType), "`")})`;
+		return `body := strings.NewReader(${backtickQuote(inputToString(init, mediaType))})`;
 	}
 	if (ctx.lang === "java") {
 		const { addImport } = ctx;
 		addImport("java.net.http.HttpRequest.BodyPublishers");
-		return `var body = BodyPublishers.ofString(${escapeString(inputToString(init, mediaType), "\"\"\"")});`;
+		return `var body = BodyPublishers.ofString(${tripleDoubleQuote(inputToString(init, mediaType))});`;
 	}
-	if (ctx.lang === "csharp") return `var body = new StringContent(${escapeString(`\n${inputToString(init, mediaType)}\n`, "\"\"\"")}, Encoding.UTF8, "${mediaType}");`;
+	if (ctx.lang === "csharp") return `var body = new StringContent(${tripleDoubleQuote(`\n${inputToString(init, mediaType)}\n`)}, Encoding.UTF8, "${mediaType}");`;
 }
 //#endregion
 export { defaultAdapters };

package/dist/requests/string-utils.js

@@ -18,13 +18,34 @@ function inputToString(value, format = "application/json") {
 		spaces: 2
 	});
 }
-function escapeString(str, delimit) {
-	if (!delimit) return JSON.stringify(str);
-	return `${delimit}${str.replaceAll(delimit, `\\${delimit}`)}${delimit}`;
+/**
+* Returns the input string wrapped in single quotes, escaping internal single quotes and backslashes.
+*/
+function singleQuote(str) {
+	return `'${str.replace(/\\/g, "\\\\").replace(/'/g, "\\'")}'`;
+}
+/**
+* Returns the input string wrapped in double quotes, escaping internal double quotes and backslashes.
+*/
+function doubleQuote(str) {
+	return `"${str.replace(/\\/g, "\\\\").replace(/"/g, "\\\"")}"`;
+}
+/**
+* Returns the input string wrapped in Python triple double-quotes,
+* escaping embedded triple quotes and backslashes.
+*/
+function tripleDoubleQuote(str) {
+	return `"""${str.replace(/\\/g, "\\\\").replace(/"""/g, "\\\"\\\"\\\"")}"""`;
+}
+/**
+* Returns the input string wrapped in backticks, escaping internal backticks and backslashes.
+*/
+function backtickQuote(str) {
+	return `\`${str.replace(/\\/g, "\\\\").replace(/`/g, "\\`")}\``;
 }
 function indent(code, tab = 1) {
 	const p = "  ".repeat(tab);
 	return code.split("\n").map((v) => v.length === 0 ? v : p + v).join("\n");
 }
 //#endregion
-export { escapeString, indent, inputToString };
+export { backtickQuote, doubleQuote, indent, inputToString, singleQuote, tripleDoubleQuote };

package/dist/requests/types.d.ts

@@ -1,8 +1,9 @@
 import { EncodedParameter, EncodedParameterMultiple } from "./media/encode.js";
+import { HttpMethods } from "../types.js";
 
 //#region src/requests/types.d.ts
 interface RawRequestData {
-  method: string;
+  method: HttpMethods;
   path: Record<string, unknown>;
   query: Record<string, unknown>;
   header: Record<string, unknown>;
@@ -11,7 +12,7 @@ interface RawRequestData {
   bodyMediaType?: string;
 }
 interface RequestData {
-  method: string;
+  method: HttpMethods;
   path: Record<string, EncodedParameter>;
   query: Record<string, EncodedParameterMultiple>;
   header: Record<string, EncodedParameter>;

package/dist/ui/api-page.js

@@ -9,7 +9,7 @@ function APIPage({ showTitle: hasHead = false, showDescription, operations, webh
 		className: "flex flex-col gap-24 text-sm @container",
 		children: [slots.operations?.map((op) => op.children), slots.webhooks?.map((op) => op.children)]
 	});
-	const content = renderPageLayout({
+	let content = renderPageLayout({
 		operations: operations?.map((item) => {
 			const pathItem = dereferenced.paths?.[item.path];
 			if (!pathItem) throw new Error(`[Fumadocs OpenAPI] Path not found in OpenAPI schema: ${item.path}`);
@@ -44,7 +44,9 @@ function APIPage({ showTitle: hasHead = false, showDescription, operations, webh
 			};
 		})
 	}, ctx);
+	if (ctx.playground?.enabled !== false && ctx.playground?.provider) content = ctx.playground.provider({ children: content });
 	return /* @__PURE__ */ jsx(ctx.clientBoundary.ApiProvider, {
+		schemes: dereferenced.components?.securitySchemes ?? {},
 		shikiOptions: ctx.shikiOptions,
 		client: ctx.client ?? {},
 		children: /* @__PURE__ */ jsx(ctx.clientBoundary.ServerProvider, {

package/dist/ui/base.d.ts

@@ -6,6 +6,7 @@ import { SchemaUIOptions } from "./schema/index.js";
 import { OpenAPIServer } from "../server/create.js";
 import { ApiPageProps, OperationItem, WebhookItem } from "./api-page.js";
 import { ResponseTab } from "./operation/response-tabs.js";
+import { RequestTabsRenderContext } from "./operation/request-tabs.js";
 import { ClientCodeBlockProvider } from "./components/codeblock.js";
 import { Awaitable, MethodInformation, RenderContext } from "../types.js";
 import { NoReference } from "../utils/schema/index.js";
@@ -74,10 +75,7 @@ interface CreateAPIPageOptions {
    */
   content?: {
     renderResponseTabs?: (tabs: ResponseTab[], ctx: RenderContext) => ReactNode;
-    renderRequestTabs?: (items: ExampleRequestItem[], ctx: RenderContext & {
-      route: string;
-      operation: NoReference<MethodInformation>;
-    }) => ReactNode;
+    renderRequestTabs?: (items: ExampleRequestItem[], ctx: RequestTabsRenderContext) => ReactNode;
     renderAPIExampleLayout?: (slots: {
       selector: ReactNode;
       usageTabs: ReactNode;
@@ -142,6 +140,12 @@ interface CreateAPIPageOptions {
      * @defaultValue true
      */
     enabled?: boolean;
+    /**
+     * render a page-level provider (useful for handling auth)
+     */
+    provider?: (props: {
+      children: ReactNode;
+    }) => ReactNode;
     /**
      * replace the server-side renderer
      */

package/dist/ui/base.js

@@ -1,9 +1,10 @@
 import { parseSecurities } from "../utils/schema/index.js";
 import { defaultAdapters } from "../requests/media/adapter.js";
-import { encodeInternalRef } from "../utils/schema/ref.js";
 import { ClientCodeBlockProvider } from "./components/codeblock.js";
+import { encodeInternalRef } from "../utils/schema/ref.js";
 import { APIPage } from "./api-page.js";
 import { pickSchema } from "../utils/schema/pick.js";
+import { PlaygroundAuthProvider } from "./client/boundary.lazy.js";
 import Slugger from "github-slugger";
 import * as JsxRuntime from "react/jsx-runtime";
 import { jsx } from "react/jsx-runtime";
@@ -38,6 +39,9 @@ function createAPIPage(server, options) {
 			...options.shikiOptions
 		}).use(rehypeReact);
 	}
+	function renderPlaygroundProviderDefault({ children }) {
+		return /* @__PURE__ */ jsx(PlaygroundAuthProvider, { children });
+	}
 	function renderPlaygroundDefault({ path, method, ctx }) {
 		return /* @__PURE__ */ jsx(ctx.clientBoundary.PlaygroundClient, {
 			route: path,
@@ -77,6 +81,7 @@ function createAPIPage(server, options) {
 			},
 			playground: {
 				...options.playground,
+				provider: options.playground?.provider ?? renderPlaygroundProviderDefault,
 				render: options.playground?.render ?? renderPlaygroundDefault
 			},
 			renderHeading(depth, text, props) {

package/dist/ui/client/boundary.lazy.js

@@ -8,6 +8,7 @@ const UsageTabsSelector = wrapLazy(() => import("../operation/usage-tabs/client.
 const UsageTab = wrapLazy(() => import("../operation/usage-tabs/client.js").then((mod) => ({ default: mod.UsageTab })));
 const SchemaUI = wrapLazy(() => import("../schema/client.js").then((mod) => ({ default: mod.SchemaUI })));
 const PlaygroundClient = wrapLazy(() => import("../../playground/client.js"));
+const PlaygroundAuthProvider = wrapLazy(() => import("../../playground/auth.js").then((mod) => ({ default: mod.AuthProvider })));
 function wrapLazy(load) {
 	const V = lazy(load);
 	return function wrapper(props) {
@@ -15,4 +16,4 @@ function wrapLazy(load) {
 	};
 }
 //#endregion
-export { ApiProvider, PlaygroundClient, SchemaUI, ServerProvider, UsageTab, UsageTabsSelector };
+export { ApiProvider, PlaygroundAuthProvider, PlaygroundClient, SchemaUI, ServerProvider, UsageTab, UsageTabsSelector };

package/dist/ui/client/i18n.js

@@ -9,9 +9,11 @@ function useTranslations() {
 * Renders a translated string. Use in server components so the label is resolved on the client from the current locale.
 */
 function I18nLabel({ label, replacements = {} }) {
-	let value = useTranslations()[label];
-	for (const [k, v] of Object.entries(replacements)) value = value.replaceAll(`{${k}}`, v);
-	return value;
+	return withReplacements(useTranslations()[label], replacements);
+}
+function withReplacements(t, replacements) {
+	for (const [k, v] of Object.entries(replacements)) t = t.replaceAll(`{${k}}`, v);
+	return t;
 }
 //#endregion
-export { I18nLabel, useTranslations };
+export { I18nLabel, useTranslations, withReplacements };

package/dist/ui/client/storage-key.js

@@ -5,7 +5,7 @@ function useStorageKey() {
 	const { storageKeyPrefix } = useApiContext().client;
 	return useMemo(() => ({
 		of: (name) => getStorageKey(storageKeyPrefix, name),
-		AuthField: (field) => getStorageKey(storageKeyPrefix, `auth-${field.original?.id ?? field.fieldName}`)
+		AuthField: (schemeId) => getStorageKey(storageKeyPrefix, `auth-${schemeId}`)
 	}), [storageKeyPrefix]);
 }
 function getStorageKey(prefix = "fumadocs-openapi-", name) {

package/dist/ui/components/dialog.js

@@ -1,6 +1,6 @@
 "use client";
-import { cn } from "../../utils/cn.js";
 import { useTranslations } from "../client/i18n.js";
+import { cn } from "../../utils/cn.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { X } from "lucide-react";

package/dist/ui/contexts/api.d.ts

@@ -1,5 +1,5 @@
 import { APIPageClientOptions } from "../client/index.js";
-import { RenderContext, ServerObject } from "../../types.js";
+import { RenderContext, SecuritySchemeObject, ServerObject } from "../../types.js";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -7,11 +7,14 @@ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 interface InheritFromContext extends Pick<RenderContext, 'shikiOptions'> {
   client: APIPageClientOptions;
 }
-type ApiProviderProps = InheritFromContext;
+interface ApiProviderProps extends InheritFromContext {
+  schemes: Record<string, SecuritySchemeObject>;
+}
 declare function ApiProvider({
   children,
   shikiOptions,
-  client
+  client,
+  schemes
 }: ApiProviderProps & {
   children: ReactNode;
 }): _$react_jsx_runtime0.JSX.Element;

package/dist/ui/contexts/api.js

@@ -18,7 +18,7 @@ function useServerContext() {
 	if (!ctx) throw new Error("Component must be used under <ApiProvider />");
 	return ctx;
 }
-function ApiProvider({ children, shikiOptions, client }) {
+function ApiProvider({ children, shikiOptions, client, schemes }) {
 	return /* @__PURE__ */ jsx(ApiContext, {
 		value: useMemo(() => {
 			let codeUsages;
@@ -31,12 +31,17 @@ function ApiProvider({ children, shikiOptions, client }) {
 				shikiOptions,
 				client,
 				codeUsages,
+				schemes,
 				mediaAdapters: {
 					...defaultAdapters,
 					...client.mediaAdapters
 				}
 			};
-		}, [client, shikiOptions]),
+		}, [
+			client,
+			schemes,
+			shikiOptions
+		]),
 		children
 	});
 }

package/dist/ui/create-client.js

@@ -1,6 +1,7 @@
 import { parseSecurities } from "../utils/schema/index.js";
 import { defaultAdapters } from "../requests/media/adapter.js";
 import { ClientCodeBlock, ClientCodeBlockProvider } from "./components/codeblock.js";
+import { AuthProvider } from "../playground/auth.js";
 import { dereferenceDocument } from "../utils/document/dereference.js";
 import { APIPage } from "./api-page.js";
 import { boundary_exports } from "./client/boundary.js";
@@ -66,6 +67,9 @@ function createClientAPIPage({ shiki = defaultShikiFactory, shikiOptions = { the
 			readOnly: false
 		});
 	}
+	function renderPlaygroundProviderDefault({ children }) {
+		return /* @__PURE__ */ jsx(AuthProvider, { children });
+	}
 	return function ClientAPIPage({ payload, ...props }) {
 		const processed = useMemo(() => dereferenceDocument(payload.bundled), [payload.bundled]);
 		const ctx = useMemo(() => ({
@@ -82,6 +86,7 @@ function createClientAPIPage({ shiki = defaultShikiFactory, shikiOptions = { the
 			},
 			playground: {
 				...options.playground,
+				provider: options.playground?.provider ?? renderPlaygroundProviderDefault,
 				render: options.playground?.render ?? renderPlaygroundDefault
 			},
 			renderHeading(depth, text, props) {

package/dist/ui/operation/client.js

@@ -1,6 +1,6 @@
 "use client";
-import { cn } from "../../utils/cn.js";
 import { useTranslations } from "../client/i18n.js";
+import { cn } from "../../utils/cn.js";
 import { createContext, use, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Check, Copy } from "lucide-react";

package/dist/ui/operation/index.js

@@ -2,9 +2,9 @@ import { idToTitle } from "../../utils/id-to-title.js";
 import { createMethod, methodKeys } from "../../utils/schema/index.js";
 import { isMediaTypeSupported } from "../../requests/media/resolve-adapter.js";
 import "../../requests/media/adapter.js";
+import { I18nLabel } from "../client/i18n.js";
 import { cn } from "../../utils/cn.js";
 import { Badge, MethodLabel } from "../components/method-label.js";
-import { I18nLabel } from "../client/i18n.js";
 import { CopyTypeScriptPanel, OperationProvider } from "./client.js";
 import { Schema } from "../schema/index.js";
 import { AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger, Accordions } from "../components/accordion.js";

package/dist/ui/operation/request-tabs.d.ts

@@ -0,0 +1,10 @@
+import { MethodInformation, RenderContext } from "../../types.js";
+import { NoReference } from "../../utils/schema/index.js";
+import { ReactNode } from "react";
+//#region src/ui/operation/request-tabs.d.ts
+interface RequestTabsRenderContext extends RenderContext {
+  route: string;
+  operation: NoReference<MethodInformation>;
+}
+//#endregion
+export { RequestTabsRenderContext };

package/dist/ui/operation/request-tabs.js

@@ -1,6 +1,6 @@
 import { resolveRequestData } from "../../utils/url.js";
-import { MethodLabel } from "../components/method-label.js";
 import { I18nLabel } from "../client/i18n.js";
+import { MethodLabel } from "../components/method-label.js";
 import { AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger, Accordions } from "../components/accordion.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "fumadocs-ui/components/tabs";
@@ -15,41 +15,6 @@ function RequestTabs({ path, operation, examples, ctx }) {
 	});
 }
 function renderRequestTabsDefault(items, ctx) {
-	function renderItem(item) {
-		const requestData = item.data;
-		const displayNames = {
-			body: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(I18nLabel, { label: "titleRequestBody" }), /* @__PURE__ */ jsx("code", {
-				className: "text-xs text-fd-muted-foreground ms-auto",
-				children: requestData.bodyMediaType
-			})] }),
-			cookie: /* @__PURE__ */ jsx(I18nLabel, { label: "cookieParameters" }),
-			header: /* @__PURE__ */ jsx(I18nLabel, { label: "headerParameters" }),
-			query: /* @__PURE__ */ jsx(I18nLabel, { label: "queryParameters" }),
-			path: /* @__PURE__ */ jsx(I18nLabel, { label: "pathParameters" })
-		};
-		return /* @__PURE__ */ jsxs(Fragment, { children: [
-			item.description && ctx.renderMarkdown(item.description),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex flex-row gap-2 items-center justify-between",
-				children: [/* @__PURE__ */ jsx(MethodLabel, { children: requestData.method }), /* @__PURE__ */ jsx("code", { children: resolveRequestData(ctx.route, item.encoded) })]
-			}),
-			/* @__PURE__ */ jsx(Accordions, {
-				type: "multiple",
-				className: "mt-2",
-				children: Object.entries(displayNames).map(([k, v]) => {
-					const data = requestData[k];
-					if (!data || Object.keys(data).length === 0) return;
-					return /* @__PURE__ */ jsxs(AccordionItem, {
-						value: k,
-						children: [/* @__PURE__ */ jsx(AccordionHeader, { children: /* @__PURE__ */ jsx(AccordionTrigger, { children: v }) }), /* @__PURE__ */ jsx(AccordionContent, {
-							className: "prose-no-margin",
-							children: ctx.renderCodeBlock("json", JSON.stringify(data, null, 2))
-						})]
-					}, k);
-				})
-			})
-		] });
-	}
 	let children;
 	if (items.length > 1) children = /* @__PURE__ */ jsxs(Tabs, {
 		defaultValue: items[0].id,
@@ -58,10 +23,16 @@ function renderRequestTabsDefault(items, ctx) {
 			children: item.id === "_default" ? /* @__PURE__ */ jsx(I18nLabel, { label: "requestTabNameDefault" }) : item.name
 		}, item.id)) }), items.map((item) => /* @__PURE__ */ jsx(TabsContent, {
 			value: item.id,
-			children: renderItem(item)
+			children: /* @__PURE__ */ jsx(RequestTabsItem, {
+				item,
+				ctx
+			})
 		}, item.id))]
 	});
-	else if (items.length === 1) children = renderItem(items[0]);
+	else if (items.length === 1) children = /* @__PURE__ */ jsx(RequestTabsItem, {
+		item: items[0],
+		ctx
+	});
 	else children = /* @__PURE__ */ jsx("p", {
 		className: "text-fd-muted-foreground text-xs",
 		children: /* @__PURE__ */ jsx(I18nLabel, { label: "empty" })
@@ -74,5 +45,40 @@ function renderRequestTabsDefault(items, ctx) {
 		}), children]
 	});
 }
+function RequestTabsItem({ item, ctx }) {
+	const requestData = item.data;
+	const displayNames = {
+		body: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(I18nLabel, { label: "titleRequestBody" }), /* @__PURE__ */ jsx("code", {
+			className: "text-xs text-fd-muted-foreground ms-auto",
+			children: requestData.bodyMediaType
+		})] }),
+		cookie: /* @__PURE__ */ jsx(I18nLabel, { label: "cookieParameters" }),
+		header: /* @__PURE__ */ jsx(I18nLabel, { label: "headerParameters" }),
+		query: /* @__PURE__ */ jsx(I18nLabel, { label: "queryParameters" }),
+		path: /* @__PURE__ */ jsx(I18nLabel, { label: "pathParameters" })
+	};
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		item.description && ctx.renderMarkdown(item.description),
+		/* @__PURE__ */ jsxs("div", {
+			className: "flex flex-row gap-2 items-center justify-between",
+			children: [/* @__PURE__ */ jsx(MethodLabel, { children: requestData.method }), /* @__PURE__ */ jsx("code", { children: resolveRequestData(ctx.route, item.encoded) })]
+		}),
+		/* @__PURE__ */ jsx(Accordions, {
+			type: "multiple",
+			className: "mt-2",
+			children: Object.entries(displayNames).map(([k, v]) => {
+				const data = requestData[k];
+				if (!data || Object.keys(data).length === 0) return;
+				return /* @__PURE__ */ jsxs(AccordionItem, {
+					value: k,
+					children: [/* @__PURE__ */ jsx(AccordionHeader, { children: /* @__PURE__ */ jsx(AccordionTrigger, { children: v }) }), /* @__PURE__ */ jsx(AccordionContent, {
+						className: "prose-no-margin",
+						children: ctx.renderCodeBlock("json", JSON.stringify(data, null, 2))
+					})]
+				}, k);
+			})
+		})
+	] });
+}
 //#endregion
 export { RequestTabs };

package/dist/ui/operation/usage-tabs/client.js

@@ -1,8 +1,8 @@
 "use client";
 import { joinURL, resolveRequestData, resolveServerUrl, withBase } from "../../../utils/url.js";
 import { useApiContext, useServerContext } from "../../contexts/api.js";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../components/select.js";
 import { ClientCodeBlock } from "../../components/codeblock.js";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../components/select.js";
 import { useOperationContext } from "../client.js";
 import { useEffect, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/ui/schema/client.js

@@ -1,13 +1,13 @@
 "use client";
+import { useTranslations } from "../client/i18n.js";
 import { cn } from "../../utils/cn.js";
 import { Badge } from "../components/method-label.js";
-import { useTranslations } from "../client/i18n.js";
 import { Fragment, Suspense, createContext, use, useCallback, useDeferredValue, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown, FilterIcon } from "lucide-react";
+import { buttonVariants } from "fumadocs-ui/components/ui/button";
 import { cva } from "class-variance-authority";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "fumadocs-ui/components/ui/collapsible";
-import { buttonVariants } from "fumadocs-ui/components/ui/button";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "fumadocs-ui/components/tabs";
 import { Popover, PopoverContent, PopoverTrigger } from "fumadocs-ui/components/ui/popover";
 //#region src/ui/schema/client.tsx

package/dist/ui/schema/index.js

@@ -1,6 +1,6 @@
+import { I18nLabel } from "../client/i18n.js";
 import { mergeAllOf } from "../../utils/schema/merge.js";
 import { FormatFlags, schemaToString } from "../../utils/schema/to-string.js";
-import { I18nLabel } from "../client/i18n.js";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/schema/index.tsx