fumadocs-openapi 10.3.4 → 10.3.6

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { MediaAdapter } from "./requests/media/adapter.js";
 import { OperationOutput, OutputEntry, OutputGroup, PagesBuilder, PagesBuilderConfig, TagOutput, WebhookOutput, fromSchema, fromServer } from "./utils/pages/builder.js";
 import { SchemaToPagesOptions, createAutoPreset } from "./utils/pages/preset-auto.js";
-import { Awaitable, CallbackObject, DistributiveOmit, Document, MethodInformation, OperationObject, ParameterObject, PathItemObject, ReferenceObject, RenderContext, ResponseObject, SecuritySchemeObject, ServerObject, ServerVariableObject, TagObject } from "./types.js";
+import { Awaitable, CallbackObject, DistributiveOmit, Document, ExampleObject, HttpMethods, MediaTypeObject, MethodInformation, OAuth2SecurityScheme, OperationObject, ParameterObject, PathItemObject, ReferenceObject, RenderContext, RequestBodyObject, ResponseObject, SecuritySchemeObject, ServerObject, ServerVariableObject, TagObject } from "./types.js";
 import { Config, OutputFile, generateFiles, generateFilesOnly } from "./generate-file.js";
-export { Awaitable, CallbackObject, Config, DistributiveOmit, Document, type MediaAdapter, MethodInformation, OperationObject, OperationOutput, OutputEntry, OutputFile, OutputGroup, PagesBuilder, PagesBuilderConfig, ParameterObject, PathItemObject, ReferenceObject, RenderContext, ResponseObject, SchemaToPagesOptions, SecuritySchemeObject, ServerObject, ServerVariableObject, TagObject, TagOutput, WebhookOutput, createAutoPreset, fromSchema, fromServer, generateFiles, generateFilesOnly };
+export { Awaitable, CallbackObject, Config, DistributiveOmit, Document, ExampleObject, HttpMethods, type MediaAdapter, MediaTypeObject, MethodInformation, OAuth2SecurityScheme, OperationObject, OperationOutput, OutputEntry, OutputFile, OutputGroup, PagesBuilder, PagesBuilderConfig, ParameterObject, PathItemObject, ReferenceObject, RenderContext, RequestBodyObject, ResponseObject, SchemaToPagesOptions, SecuritySchemeObject, ServerObject, ServerVariableObject, TagObject, TagOutput, WebhookOutput, createAutoPreset, fromSchema, fromServer, generateFiles, generateFilesOnly };

package/dist/playground/client.js

@@ -2,7 +2,7 @@
 
 import { joinURL, resolveRequestData, resolveServerUrl, withBase } from "../utils/url.js";
 import { useStorageKey } from "../ui/client/storage-key.js";
-import { useApiContext } from "../ui/contexts/api.js";
+import { useApiContext, useServerContext } from "../ui/contexts/api.js";
 import { getStatusInfo } from "./status-info.js";
 import { cn } from "../utils/cn.js";
 import { MethodLabel } from "../ui/components/method-label.js";
@@ -29,7 +29,8 @@ const OauthDialogTrigger = lazy(() => import("./components/oauth-dialog.js").the
 function PlaygroundClient({ route, method = "GET", securities, parameters = [], body, references, proxyUrl, writeOnly, readOnly, ...rest }) {
 	const { example: exampleId, examples, setExampleData } = useExampleRequests();
 	const storageKeys = useStorageKey();
-	const { mediaAdapters, serverRef, client: { playground: { components: { ResultDisplay = DefaultResultDisplay } = {}, requestTimeout = 10, transformAuthInputs } = {} } } = useApiContext();
+	const { mediaAdapters, client: { playground: { components: { ResultDisplay = DefaultResultDisplay } = {}, requestTimeout = 10, transformAuthInputs } = {} } } = useApiContext();
+	const { serverRef } = useServerContext();
 	const [securityId, setSecurityId] = useState(0);
 	const { inputs, mapInputs, initAuthValues } = useAuthInputs(securities[securityId], transformAuthInputs);
 	const defaultValues = useMemo(() => {
@@ -97,7 +98,7 @@ function PlaygroundClient({ route, method = "GET", securities, parameters = [],
 					e.preventDefault();
 				},
 				children: [
-					/* @__PURE__ */ jsx(ServerSelect, {}),
+					/* @__PURE__ */ jsx(ServerSelect, { className: "border-b" }),
 					/* @__PURE__ */ jsxs("div", {
 						className: "flex flex-row items-center gap-2 text-sm p-3 not-last:pb-0",
 						children: [

package/dist/playground/components/oauth-dialog.js

@@ -12,25 +12,35 @@ import { useForm } from "react-hook-form";
 const FlowTypes = {
 	password: {
 		name: "Resource Owner Password Flow",
-		description: "Authenticate using username and password."
+		description: "Authenticate using username and password.",
+		supported: true
 	},
 	clientCredentials: {
 		name: "Client Credentials",
-		description: "Intended for the server-to-server authentication."
+		description: "Intended for the server-to-server authentication.",
+		supported: true
 	},
 	authorizationCode: {
 		name: "Authorization code",
-		description: "Authenticate with 3rd party services"
+		description: "Authenticate with 3rd party services",
+		supported: true
 	},
 	implicit: {
 		name: "Implicit",
-		description: "Retrieve the access token directly."
+		description: "Retrieve the access token directly.",
+		supported: true
+	},
+	deviceAuthorization: {
+		name: "Device Authorization",
+		description: "Authenticate with device.",
+		supported: false
 	}
 };
 function OauthDialog({ scheme, scopes, setToken, children, open, setOpen }) {
 	const [type, setType] = useState(() => {
 		return Object.keys(scheme.flows)[0];
 	});
+	const { supported } = FlowTypes[type];
 	const form = useForm({ defaultValues: {
 		clientId: "",
 		clientSecret: "",
@@ -252,15 +262,17 @@ function OauthDialog({ scheme, scopes, setToken, children, open, setOpen }) {
 						...form.register("password", { required: true })
 					})]
 				})] }),
-				error ? /* @__PURE__ */ jsx("p", {
+				supported ? /* @__PURE__ */ jsxs(Fragment$1, { children: [error ? /* @__PURE__ */ jsx("p", {
 					className: "text-red-400 font-medium text-sm",
 					children: String(error)
-				}) : null,
-				/* @__PURE__ */ jsx("button", {
+				}) : null, /* @__PURE__ */ jsx("button", {
 					type: "submit",
 					disabled: isLoading,
 					className: cn(buttonVariants({ color: "primary" })),
 					children: authCodeCallback.isLoading ? "Fetching token..." : "Submit"
+				})] }) : /* @__PURE__ */ jsx("p", {
+					className: "text-fd-muted-foreground bg-fd-muted p-2 rounded-lg border",
+					children: "Unsupported"
 				})
 			]
 		})] })]

package/dist/playground/components/server-select.js

@@ -1,18 +1,19 @@
 'use client';
 
 import { resolveServerUrl, withBase } from "../../utils/url.js";
-import { useApiContext, useServerSelectContext } from "../../ui/contexts/api.js";
+import { useServerContext, useServerSelectContext } from "../../ui/contexts/api.js";
 import { cn } from "../../utils/cn.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../ui/components/select.js";
 import { Input, labelVariants } from "../../ui/components/input.js";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "../../ui/components/dialog.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { EditIcon } from "lucide-react";
 import { StfProvider, useFieldValue, useListener, useStf } from "@fumari/stf";
 
 //#region src/playground/components/server-select.tsx
 function ServerSelect(props) {
-	const { servers } = useApiContext();
+	const { servers } = useServerContext();
 	const { server, setServer, setServerVariables } = useServerSelectContext();
 	const [open, setOpen] = useState(false);
 	const [isMounted, setIsMounted] = useState(false);
@@ -24,34 +25,42 @@ function ServerSelect(props) {
 	return /* @__PURE__ */ jsxs(Dialog, {
 		open,
 		onOpenChange: setOpen,
-		children: [/* @__PURE__ */ jsx(DialogTrigger, {
-			className: "text-xs p-3 py-2 bg-fd-muted text-fd-muted-foreground transition-colors truncate hover:bg-fd-accent hover:text-fd-accent-foreground focus-visible:outline-none",
-			children: isMounted ? withBase(server ? resolveServerUrl(server.url, server.variables) : "/", window.location.origin) : "loading..."
-		}), /* @__PURE__ */ jsxs(DialogContent, {
+		children: [/* @__PURE__ */ jsxs(DialogTrigger, {
 			...props,
+			className: cn("flex items-center gap-2 text-sm text-start px-3 py-2 bg-fd-muted text-fd-muted-foreground transition-colors hover:bg-fd-accent hover:text-fd-accent-foreground", props.className),
 			children: [
-				/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Server URL" }), /* @__PURE__ */ jsx(DialogDescription, { children: "The base URL of your API endpoint." })] }),
-				/* @__PURE__ */ jsxs(Select, {
-					value: server?.url,
-					onValueChange: setServer,
-					children: [/* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }), /* @__PURE__ */ jsx(SelectContent, { children: servers.map((item) => /* @__PURE__ */ jsxs(SelectItem, {
-						value: item.url,
-						children: [/* @__PURE__ */ jsx("code", {
-							className: "text-[0.8125rem]",
-							children: item.url
-						}), /* @__PURE__ */ jsx("p", {
-							className: "text-fd-muted-foreground",
-							children: item.description
-						})]
-					}, item.url)) })]
+				/* @__PURE__ */ jsx("span", {
+					className: "px-2 py-0.5 -ms-2 font-medium rounded-lg border bg-fd-secondary text-fd-secondary-foreground shadow-sm",
+					children: server?.name ?? "Server URL"
 				}),
-				server?.variables && serverSchema?.variables && /* @__PURE__ */ jsx(ServerSelectContent, {
-					defaultValues: server.variables,
-					schema: serverSchema.variables,
-					onChange: setServerVariables
-				}, server.url)
+				/* @__PURE__ */ jsx("code", {
+					className: "truncate min-w-0 flex-1",
+					children: isMounted ? withBase(server ? resolveServerUrl(server.url, server.variables) : "/", window.location.origin) : "loading..."
+				}),
+				/* @__PURE__ */ jsx(EditIcon, { className: "size-4" })
 			]
-		})]
+		}), /* @__PURE__ */ jsxs(DialogContent, { children: [
+			/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Server URL" }), /* @__PURE__ */ jsx(DialogDescription, { children: "The base URL of your API endpoint." })] }),
+			/* @__PURE__ */ jsxs(Select, {
+				value: server?.url,
+				onValueChange: setServer,
+				children: [/* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }), /* @__PURE__ */ jsx(SelectContent, { children: servers.map((item) => /* @__PURE__ */ jsxs(SelectItem, {
+					value: item.url,
+					children: [/* @__PURE__ */ jsx("code", {
+						className: "text-[0.8125rem]",
+						children: item.url
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-fd-muted-foreground",
+						children: item.description
+					})]
+				}, item.url)) })]
+			}),
+			server?.variables && serverSchema?.variables && /* @__PURE__ */ jsx(ServerSelectContent, {
+				defaultValues: server.variables,
+				schema: serverSchema.variables,
+				onChange: setServerVariables
+			}, server.url)
+		] })]
 	});
 }
 function ServerSelectContent({ defaultValues, onChange, schema }) {
@@ -102,7 +111,7 @@ function Field({ fieldName, variable }) {
 			id: fieldName,
 			children: /* @__PURE__ */ jsx(SelectValue, {})
 		}), /* @__PURE__ */ jsx(SelectContent, { children: variable.enum.map((value) => /* @__PURE__ */ jsx(SelectItem, {
-			value,
+			value: String(value),
 			children: value
 		}, value)) })]
 	});

package/dist/requests/media/encode.js

@@ -5,7 +5,7 @@ import "./adapter.js";
 /**
 * serialize parameters, see https://swagger.io/docs/specification/v3_0/serialization.
 */
-function encodeRequestData(from, adapters, parameters) {
+function encodeRequestData(from, adapters, parameters = []) {
 	const result = {
 		method: from.method,
 		body: from.body,
@@ -92,35 +92,32 @@ function serializePathParameter(field, value, output) {
 	}
 }
 function serializeQueryParameter(field, value, output) {
-	const { explode = true } = field;
-	switch (field.style) {
-		case "spaceDelimited": if (!explode && Array.isArray(value)) {
-			output[field.name] = { values: [value.join(" ")] };
-			break;
-		}
-		case "pipeDelimited": if (!explode && Array.isArray(value)) {
-			output[field.name] = { values: [value.join("|")] };
-			break;
-		}
-		case "deepObject": if (!Array.isArray(value) && typeof value === "object") {
-			for (const [k, v] of Object.entries(value)) output[`${field.name}[${k}]`] = { values: Array.isArray(v) ? v : [String(v)] };
-			break;
-		}
-		default:
-			if (Array.isArray(value)) {
-				output[field.name] = { values: explode ? value : [value.join(",")] };
-				break;
-			}
-			if (typeof value === "object" && explode) {
-				for (const [k, v] of Object.entries(value)) output[k] = { values: [String(v)] };
-				break;
-			}
-			if (typeof value === "object") {
-				output[field.name] = { values: [Object.entries(value).flat().join(",")] };
-				break;
-			}
-			output[field.name] = { values: [String(value)] };
+	const { style, explode = true } = field;
+	if (style === "spaceDelimited" && !explode && Array.isArray(value)) {
+		output[field.name] = { values: [value.join(" ")] };
+		return;
+	}
+	if (style === "pipeDelimited" && !explode && Array.isArray(value)) {
+		output[field.name] = { values: [value.join("|")] };
+		return;
+	}
+	if (style === "deepObject" && !Array.isArray(value) && typeof value === "object") {
+		for (const [k, v] of Object.entries(value)) output[`${field.name}[${k}]`] = { values: Array.isArray(v) ? v : [String(v)] };
+		return;
+	}
+	if (Array.isArray(value)) {
+		output[field.name] = { values: explode ? value : [value.join(",")] };
+		return;
+	}
+	if (typeof value === "object" && explode) {
+		for (const [k, v] of Object.entries(value)) output[k] = { values: [String(v)] };
+		return;
+	}
+	if (typeof value === "object") {
+		output[field.name] = { values: [Object.entries(value).flat().join(",")] };
+		return;
 	}
+	output[field.name] = { values: [String(value)] };
 }
 function serializeCookieParameter(field, value, output) {
 	const { explode = true } = field;

package/dist/server/create.d.ts

@@ -1,13 +1,13 @@
 import { createProxy } from "./proxy.js";
 import { CodeUsageGenerator } from "../ui/operation/usage-tabs/index.js";
+import { Document } from "../types.js";
 import { ProcessedDocument } from "../utils/process-document.js";
-import { OpenAPIV3, OpenAPIV3_1 } from "openapi-types";
 
 //#region src/server/create.d.ts
 /**
  * schema id -> file path, URL, or downloaded schema object
  */
-type SchemaMap = Record<string, string | OpenAPIV3_1.Document | OpenAPIV3.Document>;
+type SchemaMap = Record<string, string | Document>;
 type ProcessedSchemaMap = Record<string, ProcessedDocument>;
 interface OpenAPIOptions {
   /**

package/dist/types.d.ts

@@ -1,3 +1,4 @@
+import { OpenAPIV3, OpenAPIV3_2 } from "./_openapi/types.js";
 import { NoReference } from "./utils/schema.js";
 import { MediaAdapter } from "./requests/media/adapter.js";
 import { CodeUsageGenerator } from "./ui/operation/usage-tabs/index.js";
@@ -7,20 +8,24 @@ import { CreateAPIPageOptions } from "./ui/base.js";
 import { ProcessedDocument } from "./utils/process-document.js";
 import Slugger from "github-slugger";
 import { HTMLAttributes, ReactNode } from "react";
-import { OpenAPIV3_1 } from "openapi-types";
 
 //#region src/types.d.ts
-type Document = OpenAPIV3_1.Document;
-type OperationObject = OpenAPIV3_1.OperationObject;
-type ParameterObject = OpenAPIV3_1.ParameterObject;
-type SecuritySchemeObject = OpenAPIV3_1.SecuritySchemeObject;
-type ReferenceObject = OpenAPIV3_1.ReferenceObject;
-type PathItemObject = OpenAPIV3_1.PathItemObject;
-type TagObject = OpenAPIV3_1.TagObject;
-type ServerObject = OpenAPIV3_1.ServerObject;
-type CallbackObject = OpenAPIV3_1.CallbackObject;
-type ServerVariableObject = OpenAPIV3_1.ServerVariableObject;
-type ResponseObject = OpenAPIV3_1.ResponseObject;
+type Document = OpenAPIV3_2.Document;
+type OperationObject = OpenAPIV3_2.OperationObject;
+type ParameterObject = OpenAPIV3_2.ParameterObject;
+type SecuritySchemeObject = OpenAPIV3_2.SecuritySchemeObject;
+type ReferenceObject = OpenAPIV3_2.ReferenceObject;
+type PathItemObject = OpenAPIV3_2.PathItemObject;
+type TagObject = OpenAPIV3_2.TagObject;
+type ServerObject = OpenAPIV3_2.ServerObject;
+type CallbackObject = OpenAPIV3_2.CallbackObject;
+type ServerVariableObject = OpenAPIV3.ServerVariableObject;
+type ResponseObject = OpenAPIV3_2.ResponseObject;
+type OAuth2SecurityScheme = OpenAPIV3_2.OAuth2SecurityScheme;
+type HttpMethods = OpenAPIV3_2.HttpMethods;
+type ExampleObject = OpenAPIV3_2.ExampleObject;
+type MediaTypeObject = OpenAPIV3_2.MediaTypeObject;
+type RequestBodyObject = OpenAPIV3_2.RequestBodyObject;
 type MethodInformation = NoReference<OperationObject> & {
   method: string;
   'x-codeSamples'?: Omit<CodeUsageGenerator, 'id'>[];
@@ -28,7 +33,6 @@ type MethodInformation = NoReference<OperationObject> & {
   'x-exclusiveCodeSample'?: string;
 };
 interface RenderContext extends Pick<OpenAPIOptions, 'proxyUrl'>, Omit<CreateAPIPageOptions, 'renderMarkdown'> {
-  servers: NoReference<ServerObject>[];
   slugger: Slugger;
   /**
    * dereferenced schema
@@ -42,4 +46,4 @@ interface RenderContext extends Pick<OpenAPIOptions, 'proxyUrl'>, Omit<CreateAPI
 type DistributiveOmit<T, K extends PropertyKey> = T extends unknown ? Omit<T, K> : never;
 type Awaitable<T> = T | Promise<T>;
 //#endregion
-export { Awaitable, CallbackObject, DistributiveOmit, Document, MethodInformation, OperationObject, ParameterObject, PathItemObject, ReferenceObject, RenderContext, ResponseObject, SecuritySchemeObject, ServerObject, ServerVariableObject, TagObject };
+export { Awaitable, CallbackObject, DistributiveOmit, Document, ExampleObject, HttpMethods, MediaTypeObject, MethodInformation, OAuth2SecurityScheme, OperationObject, ParameterObject, PathItemObject, ReferenceObject, RenderContext, RequestBodyObject, ResponseObject, SecuritySchemeObject, ServerObject, ServerVariableObject, TagObject };

package/dist/ui/api-page.d.ts

@@ -1,7 +1,6 @@
-import "../types.js";
+import { HttpMethods } from "../types.js";
 import { ProcessedDocument } from "../utils/process-document.js";
 import "react/jsx-runtime";
-import { OpenAPIV3_1 } from "openapi-types";
 
 //#region src/ui/api-page.d.ts
 interface ApiPageProps {
@@ -19,7 +18,7 @@ interface WebhookItem {
    * webhook name in `webhooks`
    */
   name: string;
-  method: OpenAPIV3_1.HttpMethods;
+  method: HttpMethods;
 }
 interface OperationItem {
   /**
@@ -29,7 +28,7 @@ interface OperationItem {
   /**
    * the HTTP method of operation
    */
-  method: OpenAPIV3_1.HttpMethods;
+  method: HttpMethods;
 }
 //#endregion
 export { ApiPageProps, OperationItem, WebhookItem };

package/dist/ui/api-page.js

@@ -1,6 +1,6 @@
 import { createMethod } from "../utils/schema.js";
+import { ApiProviderLazy, ServerProviderLazy } from "./contexts/api.lazy.js";
 import { Operation } from "./operation/index.js";
-import { ApiProviderLazy } from "./contexts/api.lazy.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/ui/api-page.tsx
@@ -46,11 +46,15 @@ async function APIPage({ showTitle: hasHead = false, showDescription, operations
 			};
 		})
 	}, ctx);
+	let servers = ctx.schema.dereferenced.servers;
+	if (!servers || servers.length === 0) servers = [{ url: "/" }];
 	return /* @__PURE__ */ jsx(ApiProviderLazy, {
-		servers: ctx.servers,
 		shikiOptions: ctx.shikiOptions,
 		client: ctx.client ?? {},
-		children: content
+		children: /* @__PURE__ */ jsx(ServerProviderLazy, {
+			servers,
+			children: content
+		})
 	});
 }
 

package/dist/ui/base.js

@@ -36,14 +36,11 @@ function createAPIPage(server, options) {
 		let processed;
 		if (typeof document === "string") processed = await server.getSchema(document);
 		else processed = await document;
-		const { dereferenced } = processed;
-		const servers = dereferenced.servers && dereferenced.servers.length > 0 ? dereferenced.servers : [{ url: "/" }];
 		const slugger = new Slugger();
 		const ctx = {
 			schema: processed,
 			proxyUrl: server.options.proxyUrl,
 			...options,
-			servers,
 			mediaAdapters: {
 				...defaultAdapters,
 				...options.mediaAdapters

package/dist/ui/contexts/api.js

@@ -6,6 +6,7 @@ import { createContext, use, useEffect, useMemo, useRef, useState } from "react"
 import { jsx } from "react/jsx-runtime";
 
 //#region src/ui/contexts/api.tsx
+const ServerContext = createContext(null);
 const ApiContext = createContext(null);
 const ServerSelectContext = createContext(null);
 function useApiContext() {
@@ -13,28 +14,34 @@ function useApiContext() {
 	if (!ctx) throw new Error("Component must be used under <ApiProvider />");
 	return ctx;
 }
+function useServerContext() {
+	return use(ServerContext);
+}
 function useServerSelectContext() {
 	const ctx = use(ServerSelectContext);
 	if (!ctx) throw new Error("Component must be used under <ApiProvider />");
 	return ctx;
 }
-function ApiProvider({ defaultBaseUrl, children, servers, shikiOptions, client }) {
-	const serverRef = useRef(null);
+function ApiProvider({ children, shikiOptions, client }) {
 	return /* @__PURE__ */ jsx(ApiContext, {
 		value: useMemo(() => ({
-			serverRef,
 			shikiOptions,
 			client,
 			mediaAdapters: {
 				...defaultAdapters,
 				...client.mediaAdapters
-			},
-			servers
-		}), [
+			}
+		}), [client, shikiOptions]),
+		children
+	});
+}
+function ServerProvider({ servers, defaultBaseUrl, children }) {
+	const serverRef = useRef(null);
+	return /* @__PURE__ */ jsx(ServerContext, {
+		value: useMemo(() => ({
 			servers,
-			client,
-			shikiOptions
-		]),
+			serverRef
+		}), [servers]),
 		children: /* @__PURE__ */ jsx(ServerSelectProvider, {
 			defaultBaseUrl,
 			children
@@ -42,11 +49,12 @@ function ApiProvider({ defaultBaseUrl, children, servers, shikiOptions, client }
 	});
 }
 function ServerSelectProvider({ defaultBaseUrl, children }) {
-	const { servers, serverRef } = useApiContext();
+	const { servers, serverRef } = use(ServerContext);
 	const storageKeys = useStorageKey();
 	const [server, setServer] = useState(() => {
 		const defaultItem = defaultBaseUrl ? servers.find((item) => item.url === defaultBaseUrl) : servers[0];
 		return defaultItem ? {
+			name: defaultItem.name,
 			url: defaultItem.url,
 			variables: getDefaultValues(defaultItem)
 		} : null;
@@ -57,8 +65,7 @@ function ServerSelectProvider({ defaultBaseUrl, children }) {
 		if (!cached) return;
 		try {
 			const obj = JSON.parse(cached);
-			if (!obj || typeof obj !== "object") return;
-			setServer(obj);
+			if (typeof obj === "object" && obj !== null && "url" in obj && typeof obj.url === "string" && "variables" in obj && typeof obj.variables === "object" && obj.variables !== null) setServer(obj);
 		} catch {}
 	}, [storageKeys]);
 	return /* @__PURE__ */ jsx(ServerSelectContext, {
@@ -79,6 +86,7 @@ function ServerSelectProvider({ defaultBaseUrl, children }) {
 				const obj = servers.find((item) => item.url === value);
 				if (!obj) return;
 				const result = {
+					name: obj.name,
 					url: value,
 					variables: getDefaultValues(obj)
 				};
@@ -96,9 +104,9 @@ function ServerSelectProvider({ defaultBaseUrl, children }) {
 function getDefaultValues(server) {
 	const out = {};
 	if (!server.variables) return out;
-	for (const [k, v] of Object.entries(server.variables)) out[k] = v.default;
+	for (const [k, v] of Object.entries(server.variables)) if (v.default !== void 0) out[k] = String(v.default);
 	return out;
 }
 
 //#endregion
-export { ApiProvider, useApiContext, useServerSelectContext };
+export { ApiProvider, ServerProvider, useApiContext, useServerContext, useServerSelectContext };

package/dist/ui/contexts/api.lazy.js

@@ -4,6 +4,7 @@ import { wrapLazy } from "../../utils/lazy.js";
 
 //#region src/ui/contexts/api.lazy.ts
 const ApiProviderLazy = wrapLazy(() => import("./api.js").then((mod) => ({ default: mod.ApiProvider })));
+const ServerProviderLazy = wrapLazy(() => import("./api.js").then((mod) => ({ default: mod.ServerProvider })));
 
 //#endregion
-export { ApiProviderLazy };
+export { ApiProviderLazy, ServerProviderLazy };

package/dist/ui/operation/index.js

@@ -11,6 +11,7 @@ import { AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger, Acc
 import { UsageTabs } from "./usage-tabs/index.js";
 import { CopyResponseTypeScript, SelectTab, SelectTabTrigger, SelectTabs } from "./client.js";
 import { RequestTabs, getExampleRequests } from "./request-tabs.js";
+import { ServerProviderLazy } from "../contexts/api.lazy.js";
 import { Fragment } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
@@ -35,7 +36,7 @@ async function Operation({ type = "operation", path, method, ctx, showTitle, sho
 		headNode = ctx.renderHeading(headingLevel, title);
 		headingLevel++;
 	}
-	const contentTypes = body ? Object.entries(body.content) : null;
+	const contentTypes = body?.content ? Object.entries(body.content) : null;
 	if (body && contentTypes && contentTypes.length > 0) {
 		const items = contentTypes.map(([key]) => ({
 			label: /* @__PURE__ */ jsx("code", {
@@ -99,11 +100,11 @@ async function Operation({ type = "operation", path, method, ctx, showTitle, sho
 					name: param.name,
 					required: param.required
 				},
-				root: {
+				root: typeof param.schema === "object" ? {
 					...param.schema,
 					description: param.description ?? param.schema?.description,
 					deprecated: (param.deprecated ?? false) || (param.schema?.deprecated ?? false)
-				},
+				} : param.schema,
 				readOnly: method.method === "GET",
 				writeOnly: method.method !== "GET",
 				ctx
@@ -211,7 +212,7 @@ async function Operation({ type = "operation", path, method, ctx, showTitle, sho
 			});
 		};
 		const playgroundEnabled = ctx.playground?.enabled ?? true;
-		const content = await renderOperationLayout({
+		let content = await renderOperationLayout({
 			header: headNode,
 			description: descriptionNode,
 			authSchemes: authNode,
@@ -238,12 +239,17 @@ async function Operation({ type = "operation", path, method, ctx, showTitle, sho
 				ctx
 			})
 		}, ctx, method);
-		return /* @__PURE__ */ jsx(UsageTabsProviderLazy, {
+		content = /* @__PURE__ */ jsx(UsageTabsProviderLazy, {
 			defaultExampleId: method["x-exclusiveCodeSample"] ?? method["x-selectedCodeSample"],
 			route: path,
 			examples: getExampleRequests(path, method, ctx),
 			children: content
 		});
+		if (method.servers) content = /* @__PURE__ */ jsx(ServerProviderLazy, {
+			servers: method.servers,
+			children: content
+		});
+		return content;
 	} else {
 		renderWebhookLayout ??= (slots) => /* @__PURE__ */ jsxs("div", {
 			className: "flex flex-col-reverse gap-x-6 gap-y-4 @4xl:flex-row @4xl:items-start",

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

@@ -9,8 +9,9 @@ import { sample } from "openapi-sampler";
 
 //#region src/ui/operation/request-tabs.tsx
 function getExampleRequests(path, operation, ctx) {
-	const media = operation.requestBody ? getPreferredType(operation.requestBody.content) : null;
-	const bodyOfType = media ? operation.requestBody?.content[media] : null;
+	const requestBody = operation.requestBody;
+	const media = requestBody?.content ? getPreferredType(requestBody.content) : null;
+	const bodyOfType = media ? requestBody.content[media] : null;
 	if (bodyOfType?.examples) {
 		const result = [];
 		for (const [key, value] of Object.entries(bodyOfType.examples)) {
@@ -29,7 +30,7 @@ function getExampleRequests(path, operation, ctx) {
 	return [{
 		id: "_default",
 		name: "Default",
-		description: bodyOfType?.schema?.description,
+		description: typeof bodyOfType?.schema === "object" ? bodyOfType.schema.description : void 0,
 		data,
 		encoded: encodeRequestData(data, ctx.mediaAdapters, operation.parameters ?? [])
 	}];
@@ -66,7 +67,7 @@ function getRequestData(path, method, sampleKey, _ctx) {
 			default: result.path[param.name] = value;
 		}
 	}
-	if (method.requestBody) {
+	if (method.requestBody?.content) {
 		const body = method.requestBody.content;
 		const type = getPreferredType(body);
 		if (!type) throw new Error(`Cannot find body schema for ${path} ${method.method}: missing media type`);

package/dist/utils/pages/preset-auto.js

@@ -52,8 +52,8 @@ function createAutoPreset(options) {
 				schemaId: builder.id,
 				path: "",
 				info: {
-					title: dereferenced.info.title,
-					description: dereferenced.info.description
+					title: dereferenced.info?.title ?? "Unknown",
+					description: dereferenced.info?.description
 				},
 				...items
 			};

package/dist/utils/process-document.d.ts

@@ -1,9 +1,8 @@
 import { NoReference } from "./schema.js";
 import { Document } from "../types.js";
-import { OpenAPIV3, OpenAPIV3_1 } from "openapi-types";
 
 //#region src/utils/process-document.d.ts
-type ProcessedDocument = {
+interface ProcessedDocument {
   /**
    * dereferenced document
    */
@@ -14,6 +13,6 @@ type ProcessedDocument = {
    */
   getRawRef: (obj: object) => string | undefined;
   bundled: Document;
-};
+}
 //#endregion
 export { ProcessedDocument };