fumadocs-openapi 10.5.0 → 10.6.0

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

@@ -1,92 +1,14 @@
 import { resolveRequestData } from "../../utils/url.js";
-import { getPreferredType, pickExample } from "../../utils/schema.js";
 import { MethodLabel } from "../components/method-label.js";
-import { encodeRequestData } from "../../requests/media/encode.js";
 import { I18nLabel } from "../client/i18n.js";
 import { AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger, Accordions } from "../components/accordion.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { sample } from "openapi-sampler";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "fumadocs-ui/components/tabs";
 //#region src/ui/operation/request-tabs.tsx
-function getExampleRequests(path, operation, ctx) {
-	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)) {
-			const data = getRequestData(path, operation, key, ctx);
-			result.push({
-				id: key,
-				name: value.summary || key,
-				description: value.description,
-				data,
-				encoded: encodeRequestData(data, ctx.mediaAdapters, operation.parameters ?? [])
-			});
-		}
-		if (result.length > 0) return result;
-	}
-	const data = getRequestData(path, operation, null, ctx);
-	return [{
-		id: "_default",
-		name: "Default",
-		description: typeof bodyOfType?.schema === "object" ? bodyOfType.schema.description : void 0,
-		data,
-		encoded: encodeRequestData(data, ctx.mediaAdapters, operation.parameters ?? [])
-	}];
-}
-function getRequestData(path, method, sampleKey, _ctx) {
-	const result = {
-		path: {},
-		cookie: {},
-		header: {},
-		query: {},
-		method: method.method
-	};
-	for (const param of method.parameters ?? []) {
-		let value = pickExample(param);
-		if (value === void 0 && param.required) {
-			if (param.schema) value = sample(param.schema);
-			else if (param.content) {
-				const type = getPreferredType(param.content);
-				const content = type ? param.content[type] : void 0;
-				if (!content || !content.schema) throw new Error(`Cannot find "${param.name}" parameter info for media type "${type}" in ${path} ${method.method}`);
-				value = sample(content.schema);
-			}
-		}
-		switch (param.in) {
-			case "cookie":
-				result.cookie[param.name] = value;
-				break;
-			case "header":
-				result.header[param.name] = value;
-				break;
-			case "query":
-				result.query[param.name] = value;
-				break;
-			default: result.path[param.name] = value;
-		}
-	}
-	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`);
-		result.bodyMediaType = type;
-		const bodyOfType = body[type];
-		if (bodyOfType.examples && sampleKey) result.body = bodyOfType.examples[sampleKey].value;
-		else if (bodyOfType.example) result.body = bodyOfType.example;
-		else result.body = sample(bodyOfType?.schema ?? {}, {
-			skipReadOnly: method.method !== "GET",
-			skipWriteOnly: method.method === "GET",
-			skipNonRequired: true
-		});
-	}
-	return result;
-}
-async function RequestTabs({ path, operation, ctx }) {
+function RequestTabs({ path, operation, examples, ctx }) {
 	if (!operation.requestBody) return null;
 	const { renderRequestTabs = renderRequestTabsDefault } = ctx.content ?? {};
-	return renderRequestTabs(getExampleRequests(path, operation, ctx), {
+	return renderRequestTabs(examples, {
 		...ctx,
 		route: path,
 		operation
@@ -153,6 +75,6 @@ function renderRequestTabsDefault(items, ctx) {
 	});
 }
 //#endregion
-export { RequestTabs, getExampleRequests };
+export { RequestTabs };
 
 //# sourceMappingURL=request-tabs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"request-tabs.js","names":[],"sources":["../../../src/ui/operation/request-tabs.tsx"],"sourcesContent":["import type { MethodInformation, RenderContext } from '@/types';\nimport { getPreferredType, type NoReference, pickExample } from '@/utils/schema';\nimport { I18nLabel } from '@/ui/client/i18n';\nimport {\n  AccordionContent,\n  AccordionHeader,\n  AccordionItem,\n  Accordions,\n  AccordionTrigger,\n} from '@/ui/components/accordion';\nimport { sample } from 'openapi-sampler';\nimport type { ReactNode } from 'react';\nimport type { RawRequestData, RequestData } from '@/requests/types';\nimport { encodeRequestData } from '@/requests/media/encode';\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from 'fumadocs-ui/components/tabs';\nimport { resolveRequestData } from '@/utils/url';\nimport { MethodLabel } from '../components/method-label';\n\nexport interface ExampleRequestItem {\n  id: string;\n  name: string;\n  description?: string;\n  data: RawRequestData;\n  encoded: RequestData;\n}\n\nexport function getExampleRequests(\n  path: string,\n  operation: NoReference<MethodInformation>,\n  ctx: RenderContext,\n): ExampleRequestItem[] {\n  const requestBody = operation.requestBody;\n  const media = requestBody?.content ? getPreferredType(requestBody.content) : null;\n  const bodyOfType = media ? requestBody!.content![media] : null;\n\n  if (bodyOfType?.examples) {\n    const result: ExampleRequestItem[] = [];\n\n    for (const [key, value] of Object.entries(bodyOfType.examples)) {\n      const data = getRequestData(path, operation, key, ctx);\n\n      result.push({\n        id: key,\n        name: value.summary || key,\n        description: value.description,\n        data,\n        encoded: encodeRequestData(data, ctx.mediaAdapters, operation.parameters ?? []),\n      });\n    }\n\n    if (result.length > 0) return result;\n  }\n\n  const data = getRequestData(path, operation, null, ctx);\n  return [\n    {\n      id: '_default',\n      name: 'Default',\n      description:\n        typeof bodyOfType?.schema === 'object' ? bodyOfType.schema.description : undefined,\n      data,\n      encoded: encodeRequestData(data, ctx.mediaAdapters, operation.parameters ?? []),\n    },\n  ];\n}\n\nfunction getRequestData(\n  path: string,\n  method: NoReference<MethodInformation>,\n  sampleKey: string | null,\n  _ctx: RenderContext,\n): RawRequestData {\n  const result: RawRequestData = {\n    path: {},\n    cookie: {},\n    header: {},\n    query: {},\n    method: method.method,\n  };\n\n  for (const param of method.parameters ?? []) {\n    let value = pickExample(param as never);\n\n    if (value === undefined && param.required) {\n      if (param.schema) {\n        value = sample(param.schema as object);\n      } else if (param.content) {\n        const type = getPreferredType(param.content);\n        const content = type ? param.content[type] : undefined;\n        if (!content || !content.schema)\n          throw new Error(\n            `Cannot find \"${param.name}\" parameter info for media type \"${type}\" in ${path} ${method.method}`,\n          );\n\n        value = sample(content.schema as object);\n      }\n    }\n\n    switch (param.in) {\n      case 'cookie':\n        result.cookie[param.name!] = value;\n        break;\n      case 'header':\n        result.header[param.name!] = value;\n        break;\n      case 'query':\n        result.query[param.name!] = value;\n        break;\n      default:\n        result.path[param.name!] = value;\n    }\n  }\n\n  if (method.requestBody?.content) {\n    const body = method.requestBody.content;\n    const type = getPreferredType(body);\n    if (!type)\n      throw new Error(`Cannot find body schema for ${path} ${method.method}: missing media type`);\n    result.bodyMediaType = type as RawRequestData['bodyMediaType'];\n    const bodyOfType = body[type];\n\n    if (bodyOfType.examples && sampleKey) {\n      result.body = bodyOfType.examples[sampleKey].value;\n    } else if (bodyOfType.example) {\n      result.body = bodyOfType.example;\n    } else {\n      result.body = sample((bodyOfType?.schema ?? {}) as object, {\n        skipReadOnly: method.method !== 'GET',\n        skipWriteOnly: method.method === 'GET',\n        skipNonRequired: true,\n      });\n    }\n  }\n\n  return result;\n}\n\nexport async function RequestTabs({\n  path,\n  operation,\n  ctx,\n}: {\n  path: string;\n  operation: NoReference<MethodInformation>;\n  ctx: RenderContext;\n}) {\n  if (!operation.requestBody) return null;\n  const { renderRequestTabs = renderRequestTabsDefault } = ctx.content ?? {};\n\n  return renderRequestTabs(getExampleRequests(path, operation, ctx), {\n    ...ctx,\n    route: path,\n    operation,\n  });\n}\n\nfunction renderRequestTabsDefault(\n  items: ExampleRequestItem[],\n  ctx: RenderContext & {\n    route: string;\n    operation: NoReference<MethodInformation>;\n  },\n) {\n  function renderItem(item: ExampleRequestItem) {\n    const requestData = item.data;\n    const displayNames: Partial<Record<keyof RawRequestData, ReactNode>> = {\n      body: (\n        <>\n          <I18nLabel label=\"titleRequestBody\" />\n          <code className=\"text-xs text-fd-muted-foreground ms-auto\">\n            {requestData.bodyMediaType}\n          </code>\n        </>\n      ),\n      cookie: <I18nLabel label=\"cookieParameters\" />,\n      header: <I18nLabel label=\"headerParameters\" />,\n      query: <I18nLabel label=\"queryParameters\" />,\n      path: <I18nLabel label=\"pathParameters\" />,\n    };\n\n    return (\n      <>\n        {item.description && ctx.renderMarkdown(item.description)}\n        <div className=\"flex flex-row gap-2 items-center justify-between\">\n          <MethodLabel>{requestData.method}</MethodLabel>\n          <code>{resolveRequestData(ctx.route, item.encoded)}</code>\n        </div>\n\n        <Accordions type=\"multiple\" className=\"mt-2\">\n          {Object.entries(displayNames).map(([k, v]) => {\n            const data = requestData[k as keyof RawRequestData];\n            if (!data || Object.keys(data).length === 0) return;\n\n            return (\n              <AccordionItem key={k} value={k}>\n                <AccordionHeader>\n                  <AccordionTrigger>{v}</AccordionTrigger>\n                </AccordionHeader>\n                <AccordionContent className=\"prose-no-margin\">\n                  {ctx.renderCodeBlock('json', JSON.stringify(data, null, 2))}\n                </AccordionContent>\n              </AccordionItem>\n            );\n          })}\n        </Accordions>\n      </>\n    );\n  }\n\n  let children: ReactNode;\n  if (items.length > 1) {\n    children = (\n      <Tabs defaultValue={items[0].id}>\n        <TabsList>\n          {items.map((item) => (\n            <TabsTrigger key={item.id} value={item.id}>\n              {item.id === '_default' ? <I18nLabel label=\"requestTabNameDefault\" /> : item.name}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n        {items.map((item) => (\n          <TabsContent key={item.id} value={item.id}>\n            {renderItem(item)}\n          </TabsContent>\n        ))}\n      </Tabs>\n    );\n  } else if (items.length === 1) {\n    children = renderItem(items[0]);\n  } else {\n    children = (\n      <p className=\"text-fd-muted-foreground text-xs\">\n        <I18nLabel label=\"empty\" />\n      </p>\n    );\n  }\n\n  return (\n    <div className=\"p-3 rounded-xl border prose-no-margin bg-fd-card text-fd-card-foreground shadow-md\">\n      <p className=\"font-semibold border-b pb-2\">\n        <I18nLabel label=\"titleRequestTabs\" />\n      </p>\n      {children}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"request-tabs.js","names":[],"sources":["../../../src/ui/operation/request-tabs.tsx"],"sourcesContent":["import type { MethodInformation, RenderContext } from '@/types';\nimport type { NoReference } from '@/utils/schema';\nimport { I18nLabel } from '@/ui/client/i18n';\nimport {\n  AccordionContent,\n  AccordionHeader,\n  AccordionItem,\n  Accordions,\n  AccordionTrigger,\n} from '@/ui/components/accordion';\nimport type { ReactNode } from 'react';\nimport type { RawRequestData } from '@/requests/types';\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from 'fumadocs-ui/components/tabs';\nimport { resolveRequestData } from '@/utils/url';\nimport { MethodLabel } from '../components/method-label';\nimport type { ExampleRequestItem } from './get-example-requests';\n\nexport function RequestTabs({\n  path,\n  operation,\n  examples,\n  ctx,\n}: {\n  path: string;\n  examples: ExampleRequestItem[];\n  operation: NoReference<MethodInformation>;\n  ctx: RenderContext;\n}) {\n  if (!operation.requestBody) return null;\n  const { renderRequestTabs = renderRequestTabsDefault } = ctx.content ?? {};\n\n  return renderRequestTabs(examples, {\n    ...ctx,\n    route: path,\n    operation,\n  });\n}\n\nfunction renderRequestTabsDefault(\n  items: ExampleRequestItem[],\n  ctx: RenderContext & {\n    route: string;\n    operation: NoReference<MethodInformation>;\n  },\n) {\n  function renderItem(item: ExampleRequestItem) {\n    const requestData = item.data;\n    const displayNames: Partial<Record<keyof RawRequestData, ReactNode>> = {\n      body: (\n        <>\n          <I18nLabel label=\"titleRequestBody\" />\n          <code className=\"text-xs text-fd-muted-foreground ms-auto\">\n            {requestData.bodyMediaType}\n          </code>\n        </>\n      ),\n      cookie: <I18nLabel label=\"cookieParameters\" />,\n      header: <I18nLabel label=\"headerParameters\" />,\n      query: <I18nLabel label=\"queryParameters\" />,\n      path: <I18nLabel label=\"pathParameters\" />,\n    };\n\n    return (\n      <>\n        {item.description && ctx.renderMarkdown(item.description)}\n        <div className=\"flex flex-row gap-2 items-center justify-between\">\n          <MethodLabel>{requestData.method}</MethodLabel>\n          <code>{resolveRequestData(ctx.route, item.encoded)}</code>\n        </div>\n\n        <Accordions type=\"multiple\" className=\"mt-2\">\n          {Object.entries(displayNames).map(([k, v]) => {\n            const data = requestData[k as keyof RawRequestData];\n            if (!data || Object.keys(data).length === 0) return;\n\n            return (\n              <AccordionItem key={k} value={k}>\n                <AccordionHeader>\n                  <AccordionTrigger>{v}</AccordionTrigger>\n                </AccordionHeader>\n                <AccordionContent className=\"prose-no-margin\">\n                  {ctx.renderCodeBlock('json', JSON.stringify(data, null, 2))}\n                </AccordionContent>\n              </AccordionItem>\n            );\n          })}\n        </Accordions>\n      </>\n    );\n  }\n\n  let children: ReactNode;\n  if (items.length > 1) {\n    children = (\n      <Tabs defaultValue={items[0].id}>\n        <TabsList>\n          {items.map((item) => (\n            <TabsTrigger key={item.id} value={item.id}>\n              {item.id === '_default' ? <I18nLabel label=\"requestTabNameDefault\" /> : item.name}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n        {items.map((item) => (\n          <TabsContent key={item.id} value={item.id}>\n            {renderItem(item)}\n          </TabsContent>\n        ))}\n      </Tabs>\n    );\n  } else if (items.length === 1) {\n    children = renderItem(items[0]);\n  } else {\n    children = (\n      <p className=\"text-fd-muted-foreground text-xs\">\n        <I18nLabel label=\"empty\" />\n      </p>\n    );\n  }\n\n  return (\n    <div className=\"p-3 rounded-xl border prose-no-margin bg-fd-card text-fd-card-foreground shadow-md\">\n      <p className=\"font-semibold border-b pb-2\">\n        <I18nLabel label=\"titleRequestTabs\" />\n      </p>\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAiBA,SAAgB,YAAY,EAC1B,MACA,WACA,UACA,OAMC;AACD,KAAI,CAAC,UAAU,YAAa,QAAO;CACnC,MAAM,EAAE,oBAAoB,6BAA6B,IAAI,WAAW,EAAE;AAE1E,QAAO,kBAAkB,UAAU;EACjC,GAAG;EACH,OAAO;EACP;EACD,CAAC;;AAGJ,SAAS,yBACP,OACA,KAIA;CACA,SAAS,WAAW,MAA0B;EAC5C,MAAM,cAAc,KAAK;EACzB,MAAM,eAAiE;GACrE,MACE,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,WAAD,EAAW,OAAM,oBAAqB,CAAA,EACtC,oBAAC,QAAD;IAAM,WAAU;cACb,YAAY;IACR,CAAA,CACN,EAAA,CAAA;GAEL,QAAQ,oBAAC,WAAD,EAAW,OAAM,oBAAqB,CAAA;GAC9C,QAAQ,oBAAC,WAAD,EAAW,OAAM,oBAAqB,CAAA;GAC9C,OAAO,oBAAC,WAAD,EAAW,OAAM,mBAAoB,CAAA;GAC5C,MAAM,oBAAC,WAAD,EAAW,OAAM,kBAAmB,CAAA;GAC3C;AAED,SACE,qBAAA,UAAA,EAAA,UAAA;GACG,KAAK,eAAe,IAAI,eAAe,KAAK,YAAY;GACzD,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,aAAD,EAAA,UAAc,YAAY,QAAqB,CAAA,EAC/C,oBAAC,QAAD,EAAA,UAAO,mBAAmB,IAAI,OAAO,KAAK,QAAQ,EAAQ,CAAA,CACtD;;GAEN,oBAAC,YAAD;IAAY,MAAK;IAAW,WAAU;cACnC,OAAO,QAAQ,aAAa,CAAC,KAAK,CAAC,GAAG,OAAO;KAC5C,MAAM,OAAO,YAAY;AACzB,SAAI,CAAC,QAAQ,OAAO,KAAK,KAAK,CAAC,WAAW,EAAG;AAE7C,YACE,qBAAC,eAAD;MAAuB,OAAO;gBAA9B,CACE,oBAAC,iBAAD,EAAA,UACE,oBAAC,kBAAD,EAAA,UAAmB,GAAqB,CAAA,EACxB,CAAA,EAClB,oBAAC,kBAAD;OAAkB,WAAU;iBACzB,IAAI,gBAAgB,QAAQ,KAAK,UAAU,MAAM,MAAM,EAAE,CAAC;OAC1C,CAAA,CACL;QAPI,EAOJ;MAElB;IACS,CAAA;GACZ,EAAA,CAAA;;CAIP,IAAI;AACJ,KAAI,MAAM,SAAS,EACjB,YACE,qBAAC,MAAD;EAAM,cAAc,MAAM,GAAG;YAA7B,CACE,oBAAC,UAAD,EAAA,UACG,MAAM,KAAK,SACV,oBAAC,aAAD;GAA2B,OAAO,KAAK;aACpC,KAAK,OAAO,aAAa,oBAAC,WAAD,EAAW,OAAM,yBAA0B,CAAA,GAAG,KAAK;GACjE,EAFI,KAAK,GAET,CACd,EACO,CAAA,EACV,MAAM,KAAK,SACV,oBAAC,aAAD;GAA2B,OAAO,KAAK;aACpC,WAAW,KAAK;GACL,EAFI,KAAK,GAET,CACd,CACG;;UAEA,MAAM,WAAW,EAC1B,YAAW,WAAW,MAAM,GAAG;KAE/B,YACE,oBAAC,KAAD;EAAG,WAAU;YACX,oBAAC,WAAD,EAAW,OAAM,SAAU,CAAA;EACzB,CAAA;AAIR,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,KAAD;GAAG,WAAU;aACX,oBAAC,WAAD,EAAW,OAAM,oBAAqB,CAAA;GACpC,CAAA,EACH,SACG"}

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

@@ -1,4 +1,4 @@
-import { NoReference } from "../../utils/schema.js";
+import { NoReference } from "../../utils/schema/index.js";
 import { ResponseObject } from "../../types.js";
 import { ReactNode } from "react";
 

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

@@ -1,73 +1,76 @@
-import { getPreferredType } from "../../utils/schema.js";
+import { getPreferredType } from "../../utils/schema/index.js";
 import { I18nLabel } from "../client/i18n.js";
 import { AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger, Accordions } from "../components/accordion.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { sample } from "openapi-sampler";
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 //#region src/ui/operation/response-tabs.tsx
 function ResponseTabs({ operation, ctx }) {
-	if (!operation.responses) return null;
-	const tabs = [];
-	for (const [code, response] of Object.entries(operation.responses)) {
-		const media = response.content ? getPreferredType(response.content) : null;
-		const responseOfType = media ? response.content?.[media] : null;
-		const tab = {
-			code,
-			response,
-			mediaType: media
-		};
-		if (responseOfType?.examples) {
-			tab.examples ??= [];
-			for (const [key, sample] of Object.entries(responseOfType.examples)) tab.examples.push({
-				label: sample?.summary ?? /* @__PURE__ */ jsx(I18nLabel, {
-					label: "responseTabName",
-					replacements: { key }
-				}),
-				sample: sample.value,
-				description: sample?.description
-			});
-		} else if (responseOfType?.example || responseOfType?.schema) {
-			tab.examples ??= [];
-			tab.examples.push({
-				label: /* @__PURE__ */ jsx(I18nLabel, { label: "responseTabNameDefault" }),
-				sample: responseOfType.example ?? sample(responseOfType.schema)
-			});
+	const tabs = useMemo(() => {
+		const tabs = [];
+		if (!operation.responses) return tabs;
+		for (const [code, response] of Object.entries(operation.responses)) {
+			const media = response.content ? getPreferredType(response.content) : null;
+			const responseOfType = media ? response.content?.[media] : null;
+			const tab = {
+				code,
+				response,
+				mediaType: media
+			};
+			if (responseOfType?.examples) {
+				tab.examples ??= [];
+				for (const [key, sample] of Object.entries(responseOfType.examples)) tab.examples.push({
+					label: sample?.summary ?? /* @__PURE__ */ jsx(I18nLabel, {
+						label: "responseTabName",
+						replacements: { key }
+					}),
+					sample: sample.value,
+					description: sample?.description
+				});
+			} else if (responseOfType?.example || responseOfType?.schema) {
+				tab.examples ??= [];
+				tab.examples.push({
+					label: /* @__PURE__ */ jsx(I18nLabel, { label: "responseTabNameDefault" }),
+					sample: responseOfType.example ?? sample(responseOfType.schema)
+				});
+			}
+			tabs.push(tab);
 		}
-		tabs.push(tab);
-	}
+		return tabs;
+	}, [operation.responses]);
+	if (tabs.length === 0) return null;
 	const { renderResponseTabs = renderResponseTabsDefault } = ctx.content ?? {};
 	return renderResponseTabs(tabs, ctx);
 }
 function renderResponseTabsDefault(tabs, ctx) {
 	function renderExampleContent(example) {
-		return /* @__PURE__ */ jsxs(Fragment, { children: [example.description && ctx.renderMarkdown(example.description), ctx.renderCodeBlock("json", JSON.stringify(example.sample, null, 2))] });
+		return /* @__PURE__ */ jsxs(Fragment$1, { children: [example.description && ctx.renderMarkdown(example.description), ctx.renderCodeBlock("json", JSON.stringify(example.sample, null, 2))] });
 	}
-	async function renderResponse(tab) {
-		const { examples = [] } = tab;
-		let slot = /* @__PURE__ */ jsx(I18nLabel, { label: "empty" });
-		if (examples.length > 1) slot = /* @__PURE__ */ jsx(Accordions, {
-			type: "single",
-			className: "pt-2",
-			defaultValue: "0",
-			children: examples.map((example, i) => /* @__PURE__ */ jsxs(AccordionItem, {
-				value: i.toString(),
-				children: [/* @__PURE__ */ jsx(AccordionHeader, { children: /* @__PURE__ */ jsx(AccordionTrigger, { children: example.label }) }), /* @__PURE__ */ jsx(AccordionContent, {
-					className: "prose-no-margin",
-					children: renderExampleContent(example)
-				})]
-			}, i))
-		});
-		else if (examples.length === 1) slot = renderExampleContent(examples[0]);
-		return /* @__PURE__ */ jsx(Tab, {
-			value: tab.code,
-			children: slot
-		});
-	}
-	if (tabs.length === 0) return null;
 	return /* @__PURE__ */ jsx(Tabs, {
 		groupId: "fumadocs_openapi_responses",
 		items: tabs.map((tab) => tab.code),
-		children: tabs.map(renderResponse)
+		children: tabs.map((tab) => {
+			const { examples = [] } = tab;
+			let slot = /* @__PURE__ */ jsx(I18nLabel, { label: "empty" });
+			if (examples.length > 1) slot = /* @__PURE__ */ jsx(Accordions, {
+				type: "single",
+				className: "pt-2",
+				defaultValue: "0",
+				children: examples.map((example, i) => /* @__PURE__ */ jsxs(AccordionItem, {
+					value: i.toString(),
+					children: [/* @__PURE__ */ jsx(AccordionHeader, { children: /* @__PURE__ */ jsx(AccordionTrigger, { children: example.label }) }), /* @__PURE__ */ jsx(AccordionContent, {
+						className: "prose-no-margin",
+						children: renderExampleContent(example)
+					})]
+				}, i))
+			});
+			else if (examples.length === 1) slot = renderExampleContent(examples[0]);
+			return /* @__PURE__ */ jsx(Tab, {
+				value: tab.code,
+				children: slot
+			}, tab.code);
+		})
 	});
 }
 //#endregion

package/dist/ui/operation/response-tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"response-tabs.js","names":[],"sources":["../../../src/ui/operation/response-tabs.tsx"],"sourcesContent":["import type { MethodInformation, RenderContext, ResponseObject } from '@/types';\nimport { getPreferredType, type NoReference } from '@/utils/schema';\nimport {\n  AccordionContent,\n  AccordionHeader,\n  AccordionItem,\n  Accordions,\n  AccordionTrigger,\n} from '@/ui/components/accordion';\nimport { Tab, Tabs } from 'fumadocs-ui/components/tabs';\nimport { sample } from 'openapi-sampler';\nimport type { ReactNode } from 'react';\nimport { I18nLabel } from '@/ui/client/i18n';\n\nexport interface ResponseTab {\n  /**\n   * HTTP response code\n   */\n  code: string;\n\n  response: NoReference<ResponseObject>;\n  /**\n   * media type of response\n   */\n  mediaType: string | null;\n\n  examples?: ResponseExample[];\n}\n\ninterface ResponseExample {\n  /**\n   * generated/defined example data\n   */\n  sample: unknown;\n\n  label: ReactNode;\n\n  /**\n   * description (in Markdown)\n   */\n  description?: string;\n}\n\nexport function ResponseTabs({\n  operation,\n  ctx,\n}: {\n  operation: NoReference<MethodInformation>;\n  ctx: RenderContext;\n}) {\n  if (!operation.responses) return null;\n  const tabs: ResponseTab[] = [];\n\n  for (const [code, response] of Object.entries(operation.responses)) {\n    const media = response.content ? getPreferredType(response.content) : null;\n    const responseOfType = media ? response.content?.[media] : null;\n\n    const tab: ResponseTab = {\n      code,\n      response,\n      mediaType: media as string | null,\n    };\n\n    if (responseOfType?.examples) {\n      tab.examples ??= [];\n\n      for (const [key, sample] of Object.entries(responseOfType.examples)) {\n        tab.examples.push({\n          label: sample?.summary ?? <I18nLabel label=\"responseTabName\" replacements={{ key }} />,\n          sample: sample.value,\n          description: sample?.description,\n        });\n      }\n    } else if (responseOfType?.example || responseOfType?.schema) {\n      tab.examples ??= [];\n      tab.examples.push({\n        label: <I18nLabel label=\"responseTabNameDefault\" />,\n        sample: responseOfType.example ?? sample(responseOfType.schema as object),\n      });\n    }\n\n    tabs.push(tab);\n  }\n  const { renderResponseTabs = renderResponseTabsDefault } = ctx.content ?? {};\n\n  return renderResponseTabs(tabs, ctx);\n}\n\nfunction renderResponseTabsDefault(\n  tabs: ResponseTab[],\n  ctx: RenderContext,\n): ReactNode | Promise<ReactNode> {\n  function renderExampleContent(example: ResponseExample) {\n    return (\n      <>\n        {example.description && ctx.renderMarkdown(example.description)}\n        {ctx.renderCodeBlock('json', JSON.stringify(example.sample, null, 2))}\n      </>\n    );\n  }\n\n  async function renderResponse(tab: ResponseTab) {\n    const { examples = [] } = tab;\n\n    let slot: ReactNode = <I18nLabel label=\"empty\" />;\n    if (examples.length > 1) {\n      slot = (\n        <Accordions type=\"single\" className=\"pt-2\" defaultValue=\"0\">\n          {examples.map((example, i) => (\n            <AccordionItem key={i} value={i.toString()}>\n              <AccordionHeader>\n                <AccordionTrigger>{example.label}</AccordionTrigger>\n              </AccordionHeader>\n              <AccordionContent className=\"prose-no-margin\">\n                {renderExampleContent(example)}\n              </AccordionContent>\n            </AccordionItem>\n          ))}\n        </Accordions>\n      );\n    } else if (examples.length === 1) {\n      slot = renderExampleContent(examples[0]);\n    }\n\n    return <Tab value={tab.code}>{slot}</Tab>;\n  }\n\n  if (tabs.length === 0) return null;\n\n  return (\n    <Tabs groupId=\"fumadocs_openapi_responses\" items={tabs.map((tab) => tab.code)}>\n      {tabs.map(renderResponse)}\n    </Tabs>\n  );\n}\n"],"mappings":";;;;;;;AA2CA,SAAgB,aAAa,EAC3B,WACA,OAIC;AACD,KAAI,CAAC,UAAU,UAAW,QAAO;CACjC,MAAM,OAAsB,EAAE;AAE9B,MAAK,MAAM,CAAC,MAAM,aAAa,OAAO,QAAQ,UAAU,UAAU,EAAE;EAClE,MAAM,QAAQ,SAAS,UAAU,iBAAiB,SAAS,QAAQ,GAAG;EACtE,MAAM,iBAAiB,QAAQ,SAAS,UAAU,SAAS;EAE3D,MAAM,MAAmB;GACvB;GACA;GACA,WAAW;GACZ;AAED,MAAI,gBAAgB,UAAU;AAC5B,OAAI,aAAa,EAAE;AAEnB,QAAK,MAAM,CAAC,KAAK,WAAW,OAAO,QAAQ,eAAe,SAAS,CACjE,KAAI,SAAS,KAAK;IAChB,OAAO,QAAQ,WAAW,oBAAC,WAAD;KAAW,OAAM;KAAkB,cAAc,EAAE,KAAK;KAAI,CAAA;IACtF,QAAQ,OAAO;IACf,aAAa,QAAQ;IACtB,CAAC;aAEK,gBAAgB,WAAW,gBAAgB,QAAQ;AAC5D,OAAI,aAAa,EAAE;AACnB,OAAI,SAAS,KAAK;IAChB,OAAO,oBAAC,WAAD,EAAW,OAAM,0BAA2B,CAAA;IACnD,QAAQ,eAAe,WAAW,OAAO,eAAe,OAAiB;IAC1E,CAAC;;AAGJ,OAAK,KAAK,IAAI;;CAEhB,MAAM,EAAE,qBAAqB,8BAA8B,IAAI,WAAW,EAAE;AAE5E,QAAO,mBAAmB,MAAM,IAAI;;AAGtC,SAAS,0BACP,MACA,KACgC;CAChC,SAAS,qBAAqB,SAA0B;AACtD,SACE,qBAAA,UAAA,EAAA,UAAA,CACG,QAAQ,eAAe,IAAI,eAAe,QAAQ,YAAY,EAC9D,IAAI,gBAAgB,QAAQ,KAAK,UAAU,QAAQ,QAAQ,MAAM,EAAE,CAAC,CACpE,EAAA,CAAA;;CAIP,eAAe,eAAe,KAAkB;EAC9C,MAAM,EAAE,WAAW,EAAE,KAAK;EAE1B,IAAI,OAAkB,oBAAC,WAAD,EAAW,OAAM,SAAU,CAAA;AACjD,MAAI,SAAS,SAAS,EACpB,QACE,oBAAC,YAAD;GAAY,MAAK;GAAS,WAAU;GAAO,cAAa;aACrD,SAAS,KAAK,SAAS,MACtB,qBAAC,eAAD;IAAuB,OAAO,EAAE,UAAU;cAA1C,CACE,oBAAC,iBAAD,EAAA,UACE,oBAAC,kBAAD,EAAA,UAAmB,QAAQ,OAAyB,CAAA,EACpC,CAAA,EAClB,oBAAC,kBAAD;KAAkB,WAAU;eACzB,qBAAqB,QAAQ;KACb,CAAA,CACL;MAPI,EAOJ,CAChB;GACS,CAAA;WAEN,SAAS,WAAW,EAC7B,QAAO,qBAAqB,SAAS,GAAG;AAG1C,SAAO,oBAAC,KAAD;GAAK,OAAO,IAAI;aAAO;GAAW,CAAA;;AAG3C,KAAI,KAAK,WAAW,EAAG,QAAO;AAE9B,QACE,oBAAC,MAAD;EAAM,SAAQ;EAA6B,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK;YAC1E,KAAK,IAAI,eAAe;EACpB,CAAA"}
+{"version":3,"file":"response-tabs.js","names":[],"sources":["../../../src/ui/operation/response-tabs.tsx"],"sourcesContent":["import type { MethodInformation, RenderContext, ResponseObject } from '@/types';\nimport { getPreferredType, type NoReference } from '@/utils/schema';\nimport {\n  AccordionContent,\n  AccordionHeader,\n  AccordionItem,\n  Accordions,\n  AccordionTrigger,\n} from '@/ui/components/accordion';\nimport { Tab, Tabs } from 'fumadocs-ui/components/tabs';\nimport { sample } from 'openapi-sampler';\nimport { useMemo, type ReactNode } from 'react';\nimport { I18nLabel } from '@/ui/client/i18n';\n\nexport interface ResponseTab {\n  /**\n   * HTTP response code\n   */\n  code: string;\n\n  response: NoReference<ResponseObject>;\n  /**\n   * media type of response\n   */\n  mediaType: string | null;\n\n  examples?: ResponseExample[];\n}\n\ninterface ResponseExample {\n  /**\n   * generated/defined example data\n   */\n  sample: unknown;\n\n  label: ReactNode;\n\n  /**\n   * description (in Markdown)\n   */\n  description?: string;\n}\n\nexport function ResponseTabs({\n  operation,\n  ctx,\n}: {\n  operation: NoReference<MethodInformation>;\n  ctx: RenderContext;\n}) {\n  const tabs = useMemo(() => {\n    const tabs: ResponseTab[] = [];\n    if (!operation.responses) return tabs;\n\n    for (const [code, response] of Object.entries(operation.responses)) {\n      const media = response.content ? getPreferredType(response.content) : null;\n      const responseOfType = media ? response.content?.[media] : null;\n\n      const tab: ResponseTab = {\n        code,\n        response,\n        mediaType: media as string | null,\n      };\n\n      if (responseOfType?.examples) {\n        tab.examples ??= [];\n\n        for (const [key, sample] of Object.entries(responseOfType.examples)) {\n          tab.examples.push({\n            label: sample?.summary ?? <I18nLabel label=\"responseTabName\" replacements={{ key }} />,\n            sample: sample.value,\n            description: sample?.description,\n          });\n        }\n      } else if (responseOfType?.example || responseOfType?.schema) {\n        tab.examples ??= [];\n        tab.examples.push({\n          label: <I18nLabel label=\"responseTabNameDefault\" />,\n          sample: responseOfType.example ?? sample(responseOfType.schema as object),\n        });\n      }\n\n      tabs.push(tab);\n    }\n\n    return tabs;\n  }, [operation.responses]);\n\n  if (tabs.length === 0) return null;\n\n  const { renderResponseTabs = renderResponseTabsDefault } = ctx.content ?? {};\n\n  return renderResponseTabs(tabs, ctx);\n}\n\nfunction renderResponseTabsDefault(tabs: ResponseTab[], ctx: RenderContext): ReactNode {\n  function renderExampleContent(example: ResponseExample) {\n    return (\n      <>\n        {example.description && ctx.renderMarkdown(example.description)}\n        {ctx.renderCodeBlock('json', JSON.stringify(example.sample, null, 2))}\n      </>\n    );\n  }\n\n  return (\n    <Tabs groupId=\"fumadocs_openapi_responses\" items={tabs.map((tab) => tab.code)}>\n      {tabs.map((tab) => {\n        const { examples = [] } = tab;\n\n        let slot: ReactNode = <I18nLabel label=\"empty\" />;\n        if (examples.length > 1) {\n          slot = (\n            <Accordions type=\"single\" className=\"pt-2\" defaultValue=\"0\">\n              {examples.map((example, i) => (\n                <AccordionItem key={i} value={i.toString()}>\n                  <AccordionHeader>\n                    <AccordionTrigger>{example.label}</AccordionTrigger>\n                  </AccordionHeader>\n                  <AccordionContent className=\"prose-no-margin\">\n                    {renderExampleContent(example)}\n                  </AccordionContent>\n                </AccordionItem>\n              ))}\n            </Accordions>\n          );\n        } else if (examples.length === 1) {\n          slot = renderExampleContent(examples[0]);\n        }\n\n        return (\n          <Tab key={tab.code} value={tab.code}>\n            {slot}\n          </Tab>\n        );\n      })}\n    </Tabs>\n  );\n}\n"],"mappings":";;;;;;;;AA2CA,SAAgB,aAAa,EAC3B,WACA,OAIC;CACD,MAAM,OAAO,cAAc;EACzB,MAAM,OAAsB,EAAE;AAC9B,MAAI,CAAC,UAAU,UAAW,QAAO;AAEjC,OAAK,MAAM,CAAC,MAAM,aAAa,OAAO,QAAQ,UAAU,UAAU,EAAE;GAClE,MAAM,QAAQ,SAAS,UAAU,iBAAiB,SAAS,QAAQ,GAAG;GACtE,MAAM,iBAAiB,QAAQ,SAAS,UAAU,SAAS;GAE3D,MAAM,MAAmB;IACvB;IACA;IACA,WAAW;IACZ;AAED,OAAI,gBAAgB,UAAU;AAC5B,QAAI,aAAa,EAAE;AAEnB,SAAK,MAAM,CAAC,KAAK,WAAW,OAAO,QAAQ,eAAe,SAAS,CACjE,KAAI,SAAS,KAAK;KAChB,OAAO,QAAQ,WAAW,oBAAC,WAAD;MAAW,OAAM;MAAkB,cAAc,EAAE,KAAK;MAAI,CAAA;KACtF,QAAQ,OAAO;KACf,aAAa,QAAQ;KACtB,CAAC;cAEK,gBAAgB,WAAW,gBAAgB,QAAQ;AAC5D,QAAI,aAAa,EAAE;AACnB,QAAI,SAAS,KAAK;KAChB,OAAO,oBAAC,WAAD,EAAW,OAAM,0BAA2B,CAAA;KACnD,QAAQ,eAAe,WAAW,OAAO,eAAe,OAAiB;KAC1E,CAAC;;AAGJ,QAAK,KAAK,IAAI;;AAGhB,SAAO;IACN,CAAC,UAAU,UAAU,CAAC;AAEzB,KAAI,KAAK,WAAW,EAAG,QAAO;CAE9B,MAAM,EAAE,qBAAqB,8BAA8B,IAAI,WAAW,EAAE;AAE5E,QAAO,mBAAmB,MAAM,IAAI;;AAGtC,SAAS,0BAA0B,MAAqB,KAA+B;CACrF,SAAS,qBAAqB,SAA0B;AACtD,SACE,qBAAA,YAAA,EAAA,UAAA,CACG,QAAQ,eAAe,IAAI,eAAe,QAAQ,YAAY,EAC9D,IAAI,gBAAgB,QAAQ,KAAK,UAAU,QAAQ,QAAQ,MAAM,EAAE,CAAC,CACpE,EAAA,CAAA;;AAIP,QACE,oBAAC,MAAD;EAAM,SAAQ;EAA6B,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK;YAC1E,KAAK,KAAK,QAAQ;GACjB,MAAM,EAAE,WAAW,EAAE,KAAK;GAE1B,IAAI,OAAkB,oBAAC,WAAD,EAAW,OAAM,SAAU,CAAA;AACjD,OAAI,SAAS,SAAS,EACpB,QACE,oBAAC,YAAD;IAAY,MAAK;IAAS,WAAU;IAAO,cAAa;cACrD,SAAS,KAAK,SAAS,MACtB,qBAAC,eAAD;KAAuB,OAAO,EAAE,UAAU;eAA1C,CACE,oBAAC,iBAAD,EAAA,UACE,oBAAC,kBAAD,EAAA,UAAmB,QAAQ,OAAyB,CAAA,EACpC,CAAA,EAClB,oBAAC,kBAAD;MAAkB,WAAU;gBACzB,qBAAqB,QAAQ;MACb,CAAA,CACL;OAPI,EAOJ,CAChB;IACS,CAAA;YAEN,SAAS,WAAW,EAC7B,QAAO,qBAAqB,SAAS,GAAG;AAG1C,UACE,oBAAC,KAAD;IAAoB,OAAO,IAAI;cAC5B;IACG,EAFI,IAAI,KAER;IAER;EACG,CAAA"}

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

@@ -1,55 +1,14 @@
 "use client";
 import { joinURL, resolveRequestData, resolveServerUrl, withBase } from "../../../utils/url.js";
-import { useApiContext, useServerSelectContext } from "../../contexts/api.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 { createContext, use, useEffect, useMemo, useRef, useState } from "react";
+import { useOperationContext } from "../client.js";
+import { useEffect, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/operation/usage-tabs/client.tsx
-const Context = createContext(null);
-function UsageTabsProvider({ route, examples, defaultExampleId, children }) {
-	const [example, setExample] = useState(() => defaultExampleId ?? examples.at(0)?.id);
-	const listeners = useRef([]);
-	return /* @__PURE__ */ jsx(Context, {
-		value: useMemo(() => ({
-			example,
-			route,
-			setExample(newKey) {
-				const example = examples.find((example) => example.id === newKey);
-				if (!example) return;
-				setExample(newKey);
-				for (const listener of listeners.current) listener(example.data, example.encoded);
-			},
-			examples,
-			setExampleData(data, encoded) {
-				for (const item of examples) if (item.id === example) {
-					item.data = data;
-					item.encoded = encoded;
-					break;
-				}
-				for (const listener of listeners.current) listener(data, encoded);
-			},
-			removeListener(listener) {
-				listeners.current = listeners.current.filter((item) => item !== listener);
-			},
-			addListener(listener) {
-				const active = examples.find((item) => item.id === example);
-				listener(active.data, active.encoded);
-				listeners.current.push(listener);
-			}
-		}), [
-			example,
-			route,
-			examples
-		]),
-		children
-	});
-}
-function useExampleRequests() {
-	return use(Context);
-}
 function UsageTabsSelector() {
-	const { example: key, setExample: setKey, examples } = useExampleRequests();
+	const { example: key, setExample: setKey, examples } = useOperationContext();
 	const { APIExampleSelector: Override } = useApiContext().client.operation ?? {};
 	if (Override) return /* @__PURE__ */ jsx(Override, {
 		items: examples,
@@ -84,8 +43,8 @@ function UsageTabsSelector() {
 }
 function UsageTab({ id, lang, _client }) {
 	const { mediaAdapters, codeUsages } = useApiContext();
-	const { examples, example: selectedExampleId, route, addListener, removeListener } = useExampleRequests();
-	const { server } = useServerSelectContext();
+	const { examples, example: selectedExampleId, route, addListener, removeListener } = useOperationContext();
+	const { server } = useServerContext();
 	const codegen = codeUsages.get(id);
 	const [data, setData] = useState(() => examples.find((example) => example.id === selectedExampleId)?.encoded);
 	useEffect(() => {
@@ -126,6 +85,6 @@ function UsageTab({ id, lang, _client }) {
 	});
 }
 //#endregion
-export { UsageTab, UsageTabsProvider, UsageTabsSelector, useExampleRequests };
+export { UsageTab, UsageTabsSelector };
 
 //# sourceMappingURL=client.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"client.js","names":[],"sources":["../../../../src/ui/operation/usage-tabs/client.tsx"],"sourcesContent":["'use client';\nimport { useApiContext, useServerSelectContext } from '@/ui/contexts/api';\nimport { joinURL, withBase, resolveServerUrl, resolveRequestData } from '@/utils/url';\nimport {\n  Select,\n  SelectTrigger,\n  SelectValue,\n  SelectContent,\n  SelectItem,\n} from '@/ui/components/select';\nimport { useState, useEffect, useMemo, createContext, ReactNode, useRef, use } from 'react';\nimport type { ExampleRequestItem } from '../request-tabs';\nimport type { RawRequestData, RequestData } from '@/requests/types';\nimport type { CodeUsageGenerator } from '@/requests/generators';\nimport { ClientCodeBlock } from '@/ui/components/codeblock';\n\nexport type ExampleUpdateListener = (data: RawRequestData, encoded: RequestData) => void;\n\nconst Context = createContext<{\n  route: string;\n  examples: ExampleRequestItem[];\n  example: string | undefined;\n  setExample: (id: string) => void;\n  setExampleData: (data: RawRequestData, encoded: RequestData) => void;\n\n  addListener: (listener: ExampleUpdateListener) => void;\n  removeListener: (listener: ExampleUpdateListener) => void;\n} | null>(null);\n\nexport function UsageTabsProvider({\n  route,\n  examples,\n  defaultExampleId,\n  children,\n}: {\n  route: string;\n  examples: ExampleRequestItem[];\n  defaultExampleId?: string;\n  children: ReactNode;\n}) {\n  const [example, setExample] = useState(() => defaultExampleId ?? examples.at(0)?.id);\n  const listeners = useRef<ExampleUpdateListener[]>([]);\n\n  return (\n    <Context\n      value={useMemo(\n        () => ({\n          example,\n          route,\n          setExample(newKey: string) {\n            const example = examples.find((example) => example.id === newKey);\n            if (!example) return;\n\n            setExample(newKey);\n            for (const listener of listeners.current) {\n              listener(example.data, example.encoded);\n            }\n          },\n          examples,\n          setExampleData(data, encoded) {\n            for (const item of examples) {\n              if (item.id === example) {\n                // persistent changes\n                item.data = data;\n                item.encoded = encoded;\n                break;\n              }\n            }\n\n            for (const listener of listeners.current) {\n              listener(data, encoded);\n            }\n          },\n          removeListener(listener) {\n            listeners.current = listeners.current.filter((item) => item !== listener);\n          },\n          addListener(listener) {\n            // initial call to listeners to ensure their data is the latest\n            // this is necessary to avoid race conditions between `useEffect()`\n            const active = examples.find((item) => item.id === example)!;\n\n            listener(active.data, active.encoded);\n            listeners.current.push(listener);\n          },\n        }),\n        [example, route, examples],\n      )}\n    >\n      {children}\n    </Context>\n  );\n}\n\nexport function useExampleRequests() {\n  return use(Context)!;\n}\n\nexport function UsageTabsSelector() {\n  const { example: key, setExample: setKey, examples } = useExampleRequests();\n  const { APIExampleSelector: Override } = useApiContext().client.operation ?? {};\n\n  if (Override) {\n    return <Override items={examples} value={key} onValueChange={setKey} />;\n  }\n\n  function renderItem(item: ExampleRequestItem) {\n    return (\n      <div>\n        <span className=\"font-medium text-sm\">{item.name}</span>\n        <span className=\"text-fd-muted-foreground\">{item.description}</span>\n      </div>\n    );\n  }\n\n  if (examples.length === 1) return null;\n  const selected = examples.find((item) => item.id === key);\n  return (\n    <Select value={key} onValueChange={setKey}>\n      <SelectTrigger className=\"not-prose mb-2\">\n        {selected && <SelectValue asChild>{renderItem(selected)}</SelectValue>}\n      </SelectTrigger>\n      <SelectContent>\n        {examples.map((item) => (\n          <SelectItem key={item.id} value={item.id}>\n            {renderItem(item)}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n}\n\nexport function UsageTab({\n  id,\n  lang,\n  _client,\n}: Pick<CodeUsageGenerator, 'lang' | '_client'> & { id: string }) {\n  const { mediaAdapters, codeUsages } = useApiContext();\n  const {\n    examples,\n    example: selectedExampleId,\n    route,\n    addListener,\n    removeListener,\n  } = useExampleRequests();\n  const { server } = useServerSelectContext();\n  const codegen = codeUsages.get(id);\n  const [data, setData] = useState(\n    () => examples.find((example) => example.id === selectedExampleId)?.encoded,\n  );\n\n  useEffect(() => {\n    const listener: ExampleUpdateListener = (_, encoded) => setData(encoded);\n\n    addListener(listener);\n    return () => {\n      removeListener(listener);\n    };\n  }, [addListener, removeListener]);\n\n  const code = useMemo(() => {\n    if (!data) return;\n    const url = joinURL(\n      withBase(\n        server ? resolveServerUrl(server.url, server.variables) : '/',\n        typeof window !== 'undefined' ? window.location.origin : 'https://loading',\n      ),\n      resolveRequestData(route, data),\n    );\n\n    if (_client) {\n      const { generate, serverContext } = _client;\n      if (typeof generate === 'string') return generate;\n      return generate(url, data, {\n        mediaAdapters,\n        server: serverContext,\n      });\n    }\n\n    if (!codegen) return;\n    return codegen.generate(url, data, {\n      mediaAdapters,\n      server: null,\n    });\n  }, [data, server, route, _client, codegen, mediaAdapters]);\n\n  if (!code) return null;\n\n  return <ClientCodeBlock lang={lang} code={code} />;\n}\n"],"mappings":"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"}
+{"version":3,"file":"client.js","names":[],"sources":["../../../../src/ui/operation/usage-tabs/client.tsx"],"sourcesContent":["'use client';\nimport { useApiContext, useServerContext } from '@/ui/contexts/api';\nimport { joinURL, withBase, resolveServerUrl, resolveRequestData } from '@/utils/url';\nimport {\n  Select,\n  SelectTrigger,\n  SelectValue,\n  SelectContent,\n  SelectItem,\n} from '@/ui/components/select';\nimport { useState, useEffect, useMemo } from 'react';\nimport type { CodeUsageGenerator } from '@/requests/generators';\nimport { ClientCodeBlock } from '@/ui/components/codeblock';\nimport { type ExampleUpdateListener, useOperationContext } from '../client';\nimport type { ExampleRequestItem } from '../get-example-requests';\n\nexport function UsageTabsSelector() {\n  const { example: key, setExample: setKey, examples } = useOperationContext();\n  const { APIExampleSelector: Override } = useApiContext().client.operation ?? {};\n\n  if (Override) {\n    return <Override items={examples} value={key} onValueChange={setKey} />;\n  }\n\n  function renderItem(item: ExampleRequestItem) {\n    return (\n      <div>\n        <span className=\"font-medium text-sm\">{item.name}</span>\n        <span className=\"text-fd-muted-foreground\">{item.description}</span>\n      </div>\n    );\n  }\n\n  if (examples.length === 1) return null;\n  const selected = examples.find((item) => item.id === key);\n  return (\n    <Select value={key} onValueChange={setKey}>\n      <SelectTrigger className=\"not-prose mb-2\">\n        {selected && <SelectValue asChild>{renderItem(selected)}</SelectValue>}\n      </SelectTrigger>\n      <SelectContent>\n        {examples.map((item) => (\n          <SelectItem key={item.id} value={item.id}>\n            {renderItem(item)}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n}\n\nexport function UsageTab({\n  id,\n  lang,\n  _client,\n}: Pick<CodeUsageGenerator, 'lang' | '_client'> & { id: string }) {\n  const { mediaAdapters, codeUsages } = useApiContext();\n  const {\n    examples,\n    example: selectedExampleId,\n    route,\n    addListener,\n    removeListener,\n  } = useOperationContext();\n  const { server } = useServerContext();\n  const codegen = codeUsages.get(id);\n  const [data, setData] = useState(\n    () => examples.find((example) => example.id === selectedExampleId)?.encoded,\n  );\n\n  useEffect(() => {\n    const listener: ExampleUpdateListener = (_, encoded) => setData(encoded);\n\n    addListener(listener);\n    return () => {\n      removeListener(listener);\n    };\n  }, [addListener, removeListener]);\n\n  const code = useMemo(() => {\n    if (!data) return;\n    const url = joinURL(\n      withBase(\n        server ? resolveServerUrl(server.url, server.variables) : '/',\n        typeof window !== 'undefined' ? window.location.origin : 'https://loading',\n      ),\n      resolveRequestData(route, data),\n    );\n\n    if (_client) {\n      const { generate, serverContext } = _client;\n      if (typeof generate === 'string') return generate;\n      return generate(url, data, {\n        mediaAdapters,\n        server: serverContext,\n      });\n    }\n\n    if (!codegen) return;\n    return codegen.generate(url, data, {\n      mediaAdapters,\n      server: null,\n    });\n  }, [data, server, route, _client, codegen, mediaAdapters]);\n\n  if (!code) return null;\n\n  return <ClientCodeBlock lang={lang} code={code} />;\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAgB,oBAAoB;CAClC,MAAM,EAAE,SAAS,KAAK,YAAY,QAAQ,aAAa,qBAAqB;CAC5E,MAAM,EAAE,oBAAoB,aAAa,eAAe,CAAC,OAAO,aAAa,EAAE;AAE/E,KAAI,SACF,QAAO,oBAAC,UAAD;EAAU,OAAO;EAAU,OAAO;EAAK,eAAe;EAAU,CAAA;CAGzE,SAAS,WAAW,MAA0B;AAC5C,SACE,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,QAAD;GAAM,WAAU;aAAuB,KAAK;GAAY,CAAA,EACxD,oBAAC,QAAD;GAAM,WAAU;aAA4B,KAAK;GAAmB,CAAA,CAChE,EAAA,CAAA;;AAIV,KAAI,SAAS,WAAW,EAAG,QAAO;CAClC,MAAM,WAAW,SAAS,MAAM,SAAS,KAAK,OAAO,IAAI;AACzD,QACE,qBAAC,QAAD;EAAQ,OAAO;EAAK,eAAe;YAAnC,CACE,oBAAC,eAAD;GAAe,WAAU;aACtB,YAAY,oBAAC,aAAD;IAAa,SAAA;cAAS,WAAW,SAAS;IAAe,CAAA;GACxD,CAAA,EAChB,oBAAC,eAAD,EAAA,UACG,SAAS,KAAK,SACb,oBAAC,YAAD;GAA0B,OAAO,KAAK;aACnC,WAAW,KAAK;GACN,EAFI,KAAK,GAET,CACb,EACY,CAAA,CACT;;;AAIb,SAAgB,SAAS,EACvB,IACA,MACA,WACgE;CAChE,MAAM,EAAE,eAAe,eAAe,eAAe;CACrD,MAAM,EACJ,UACA,SAAS,mBACT,OACA,aACA,mBACE,qBAAqB;CACzB,MAAM,EAAE,WAAW,kBAAkB;CACrC,MAAM,UAAU,WAAW,IAAI,GAAG;CAClC,MAAM,CAAC,MAAM,WAAW,eAChB,SAAS,MAAM,YAAY,QAAQ,OAAO,kBAAkB,EAAE,QACrE;AAED,iBAAgB;EACd,MAAM,YAAmC,GAAG,YAAY,QAAQ,QAAQ;AAExE,cAAY,SAAS;AACrB,eAAa;AACX,kBAAe,SAAS;;IAEzB,CAAC,aAAa,eAAe,CAAC;CAEjC,MAAM,OAAO,cAAc;AACzB,MAAI,CAAC,KAAM;EACX,MAAM,MAAM,QACV,SACE,SAAS,iBAAiB,OAAO,KAAK,OAAO,UAAU,GAAG,KAC1D,OAAO,WAAW,cAAc,OAAO,SAAS,SAAS,kBAC1D,EACD,mBAAmB,OAAO,KAAK,CAChC;AAED,MAAI,SAAS;GACX,MAAM,EAAE,UAAU,kBAAkB;AACpC,OAAI,OAAO,aAAa,SAAU,QAAO;AACzC,UAAO,SAAS,KAAK,MAAM;IACzB;IACA,QAAQ;IACT,CAAC;;AAGJ,MAAI,CAAC,QAAS;AACd,SAAO,QAAQ,SAAS,KAAK,MAAM;GACjC;GACA,QAAQ;GACT,CAAC;IACD;EAAC;EAAM;EAAQ;EAAO;EAAS;EAAS;EAAc,CAAC;AAE1D,KAAI,CAAC,KAAM,QAAO;AAElB,QAAO,oBAAC,iBAAD;EAAuB;EAAY;EAAQ,CAAA"}

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

@@ -2,10 +2,11 @@ import { createCodeUsageGeneratorRegistry } from "../../../requests/generators/i
 import { registerDefault } from "../../../requests/generators/all.js";
 import { UsageTabLazy, UsageTabsSelectorLazy } from "./lazy.js";
 import { ResponseTabs } from "../response-tabs.js";
+import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger } from "fumadocs-ui/components/codeblock";
 //#region src/ui/operation/usage-tabs/index.tsx
-async function UsageTabs({ method, ctx }) {
+function UsageTabs({ method, ctx }) {
 	let { renderAPIExampleUsageTabs, renderAPIExampleLayout } = ctx.content ?? {};
 	renderAPIExampleLayout ??= (slots) => {
 		return /* @__PURE__ */ jsxs("div", {
@@ -36,17 +37,20 @@ async function UsageTabs({ method, ctx }) {
 			}, id))]
 		});
 	};
-	let registry;
-	if (ctx.codeUsages) registry = createCodeUsageGeneratorRegistry(ctx.codeUsages);
-	else {
-		registry = createCodeUsageGeneratorRegistry();
-		registerDefault(registry);
-	}
-	for (const gen of await ctx.generateCodeSamples?.(method) ?? []) registry.addInline(gen);
-	if (method["x-codeSamples"]) for (const sample of method["x-codeSamples"]) registry.addInline(sample);
+	const registry = useMemo(() => {
+		let registry;
+		if (ctx.codeUsages) registry = createCodeUsageGeneratorRegistry(ctx.codeUsages);
+		else {
+			registry = createCodeUsageGeneratorRegistry();
+			registerDefault(registry);
+		}
+		for (const gen of ctx.generateCodeSamples?.(method) ?? []) registry.addInline(gen);
+		if (method["x-codeSamples"]) for (const sample of method["x-codeSamples"]) registry.addInline(sample);
+		return registry;
+	}, [ctx, method]);
 	return renderAPIExampleLayout({
 		selector: method["x-exclusiveCodeSample"] ? null : /* @__PURE__ */ jsx(UsageTabsSelectorLazy, {}),
-		usageTabs: await renderAPIExampleUsageTabs(registry, ctx),
+		usageTabs: renderAPIExampleUsageTabs(registry, ctx),
 		responseTabs: /* @__PURE__ */ jsx(ResponseTabs, {
 			operation: method,
 			ctx

package/dist/ui/operation/usage-tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/ui/operation/usage-tabs/index.tsx"],"sourcesContent":["import type { MethodInformation, RenderContext } from '@/types';\nimport type { CodeUsageGeneratorFn } from '@/requests/generators';\nimport {\n  type CodeUsageGeneratorRegistry,\n  createCodeUsageGeneratorRegistry,\n} from '@/requests/generators';\nimport {\n  CodeBlockTab,\n  CodeBlockTabs,\n  CodeBlockTabsList,\n  CodeBlockTabsTrigger,\n} from 'fumadocs-ui/components/codeblock';\nimport { UsageTabsSelectorLazy, UsageTabLazy } from './lazy';\nimport { ResponseTabs } from '../response-tabs';\nimport { registerDefault } from '@/requests/generators/all';\n\n/**\n * Generate code example for given programming language\n */\nexport interface CodeUsageGenerator<T = unknown> {\n  id: string;\n  lang: string;\n  label?: string;\n  /**\n   * either:\n   * - code\n   * - a function imported from a file with \"use client\" directive\n   * - false (disabled)\n   */\n  source?: string | CodeUsageGeneratorFn<T> | false;\n\n  /**\n   * Pass extra context to client-side source generator\n   */\n  serverContext?: T;\n}\n\nexport async function UsageTabs({\n  method,\n  ctx,\n}: {\n  method: MethodInformation;\n  ctx: RenderContext;\n}) {\n  let { renderAPIExampleUsageTabs, renderAPIExampleLayout } = ctx.content ?? {};\n\n  renderAPIExampleLayout ??= (slots) => {\n    return (\n      <div className=\"prose-no-margin\">\n        {slots.selector}\n        {slots.usageTabs}\n        {slots.responseTabs}\n      </div>\n    );\n  };\n\n  renderAPIExampleUsageTabs ??= (registry) => {\n    const map = Array.from(registry.map().entries());\n    if (map.length === 0) return null;\n\n    return (\n      <CodeBlockTabs groupId=\"fumadocs_openapi_requests\" defaultValue={map[0][0]}>\n        <CodeBlockTabsList>\n          {map.map(([id, item]) => (\n            <CodeBlockTabsTrigger key={id} value={id}>\n              {item.label ?? item.lang}\n            </CodeBlockTabsTrigger>\n          ))}\n        </CodeBlockTabsList>\n        {map.map(([id, item]) => (\n          <CodeBlockTab key={id} value={id}>\n            <UsageTabLazy id={id} lang={item.lang} _client={item._client} />\n          </CodeBlockTab>\n        ))}\n      </CodeBlockTabs>\n    );\n  };\n\n  let registry: CodeUsageGeneratorRegistry;\n  if (ctx.codeUsages) {\n    registry = createCodeUsageGeneratorRegistry(ctx.codeUsages);\n  } else {\n    registry = createCodeUsageGeneratorRegistry();\n    registerDefault(registry);\n  }\n\n  for (const gen of (await ctx.generateCodeSamples?.(method)) ?? []) {\n    registry.addInline(gen);\n  }\n\n  if (method['x-codeSamples']) {\n    for (const sample of method['x-codeSamples']) {\n      registry.addInline(sample);\n    }\n  }\n\n  return renderAPIExampleLayout(\n    {\n      selector: method['x-exclusiveCodeSample'] ? null : <UsageTabsSelectorLazy />,\n      usageTabs: await renderAPIExampleUsageTabs(registry, ctx),\n      responseTabs: <ResponseTabs operation={method} ctx={ctx} />,\n    },\n    ctx,\n  );\n}\n"],"mappings":";;;;;;;AAqCA,eAAsB,UAAU,EAC9B,QACA,OAIC;CACD,IAAI,EAAE,2BAA2B,2BAA2B,IAAI,WAAW,EAAE;AAE7E,6BAA4B,UAAU;AACpC,SACE,qBAAC,OAAD;GAAK,WAAU;aAAf;IACG,MAAM;IACN,MAAM;IACN,MAAM;IACH;;;AAIV,gCAA+B,aAAa;EAC1C,MAAM,MAAM,MAAM,KAAK,SAAS,KAAK,CAAC,SAAS,CAAC;AAChD,MAAI,IAAI,WAAW,EAAG,QAAO;AAE7B,SACE,qBAAC,eAAD;GAAe,SAAQ;GAA4B,cAAc,IAAI,GAAG;aAAxE,CACE,oBAAC,mBAAD,EAAA,UACG,IAAI,KAAK,CAAC,IAAI,UACb,oBAAC,sBAAD;IAA+B,OAAO;cACnC,KAAK,SAAS,KAAK;IACC,EAFI,GAEJ,CACvB,EACgB,CAAA,EACnB,IAAI,KAAK,CAAC,IAAI,UACb,oBAAC,cAAD;IAAuB,OAAO;cAC5B,oBAAC,cAAD;KAAkB;KAAI,MAAM,KAAK;KAAM,SAAS,KAAK;KAAW,CAAA;IACnD,EAFI,GAEJ,CACf,CACY;;;CAIpB,IAAI;AACJ,KAAI,IAAI,WACN,YAAW,iCAAiC,IAAI,WAAW;MACtD;AACL,aAAW,kCAAkC;AAC7C,kBAAgB,SAAS;;AAG3B,MAAK,MAAM,OAAQ,MAAM,IAAI,sBAAsB,OAAO,IAAK,EAAE,CAC/D,UAAS,UAAU,IAAI;AAGzB,KAAI,OAAO,iBACT,MAAK,MAAM,UAAU,OAAO,iBAC1B,UAAS,UAAU,OAAO;AAI9B,QAAO,uBACL;EACE,UAAU,OAAO,2BAA2B,OAAO,oBAAC,uBAAD,EAAyB,CAAA;EAC5E,WAAW,MAAM,0BAA0B,UAAU,IAAI;EACzD,cAAc,oBAAC,cAAD;GAAc,WAAW;GAAa;GAAO,CAAA;EAC5D,EACD,IACD"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/ui/operation/usage-tabs/index.tsx"],"sourcesContent":["import type { MethodInformation, RenderContext } from '@/types';\nimport {\n  type CodeUsageGeneratorRegistry,\n  createCodeUsageGeneratorRegistry,\n} from '@/requests/generators';\nimport {\n  CodeBlockTab,\n  CodeBlockTabs,\n  CodeBlockTabsList,\n  CodeBlockTabsTrigger,\n} from 'fumadocs-ui/components/codeblock';\nimport { UsageTabsSelectorLazy, UsageTabLazy } from './lazy';\nimport { ResponseTabs } from '../response-tabs';\nimport { registerDefault } from '@/requests/generators/all';\nimport { useMemo } from 'react';\n\nexport function UsageTabs({ method, ctx }: { method: MethodInformation; ctx: RenderContext }) {\n  let { renderAPIExampleUsageTabs, renderAPIExampleLayout } = ctx.content ?? {};\n\n  renderAPIExampleLayout ??= (slots) => {\n    return (\n      <div className=\"prose-no-margin\">\n        {slots.selector}\n        {slots.usageTabs}\n        {slots.responseTabs}\n      </div>\n    );\n  };\n\n  renderAPIExampleUsageTabs ??= (registry) => {\n    const map = Array.from(registry.map().entries());\n    if (map.length === 0) return null;\n\n    return (\n      <CodeBlockTabs groupId=\"fumadocs_openapi_requests\" defaultValue={map[0][0]}>\n        <CodeBlockTabsList>\n          {map.map(([id, item]) => (\n            <CodeBlockTabsTrigger key={id} value={id}>\n              {item.label ?? item.lang}\n            </CodeBlockTabsTrigger>\n          ))}\n        </CodeBlockTabsList>\n        {map.map(([id, item]) => (\n          <CodeBlockTab key={id} value={id}>\n            <UsageTabLazy id={id} lang={item.lang} _client={item._client} />\n          </CodeBlockTab>\n        ))}\n      </CodeBlockTabs>\n    );\n  };\n\n  const registry = useMemo(() => {\n    let registry: CodeUsageGeneratorRegistry;\n\n    if (ctx.codeUsages) {\n      registry = createCodeUsageGeneratorRegistry(ctx.codeUsages);\n    } else {\n      registry = createCodeUsageGeneratorRegistry();\n      registerDefault(registry);\n    }\n\n    for (const gen of ctx.generateCodeSamples?.(method) ?? []) {\n      registry.addInline(gen);\n    }\n\n    if (method['x-codeSamples']) {\n      for (const sample of method['x-codeSamples']) {\n        registry.addInline(sample);\n      }\n    }\n\n    return registry;\n  }, [ctx, method]);\n\n  return renderAPIExampleLayout(\n    {\n      selector: method['x-exclusiveCodeSample'] ? null : <UsageTabsSelectorLazy />,\n      usageTabs: renderAPIExampleUsageTabs(registry, ctx),\n      responseTabs: <ResponseTabs operation={method} ctx={ctx} />,\n    },\n    ctx,\n  );\n}\n"],"mappings":";;;;;;;;AAgBA,SAAgB,UAAU,EAAE,QAAQ,OAA0D;CAC5F,IAAI,EAAE,2BAA2B,2BAA2B,IAAI,WAAW,EAAE;AAE7E,6BAA4B,UAAU;AACpC,SACE,qBAAC,OAAD;GAAK,WAAU;aAAf;IACG,MAAM;IACN,MAAM;IACN,MAAM;IACH;;;AAIV,gCAA+B,aAAa;EAC1C,MAAM,MAAM,MAAM,KAAK,SAAS,KAAK,CAAC,SAAS,CAAC;AAChD,MAAI,IAAI,WAAW,EAAG,QAAO;AAE7B,SACE,qBAAC,eAAD;GAAe,SAAQ;GAA4B,cAAc,IAAI,GAAG;aAAxE,CACE,oBAAC,mBAAD,EAAA,UACG,IAAI,KAAK,CAAC,IAAI,UACb,oBAAC,sBAAD;IAA+B,OAAO;cACnC,KAAK,SAAS,KAAK;IACC,EAFI,GAEJ,CACvB,EACgB,CAAA,EACnB,IAAI,KAAK,CAAC,IAAI,UACb,oBAAC,cAAD;IAAuB,OAAO;cAC5B,oBAAC,cAAD;KAAkB;KAAI,MAAM,KAAK;KAAM,SAAS,KAAK;KAAW,CAAA;IACnD,EAFI,GAEJ,CACf,CACY;;;CAIpB,MAAM,WAAW,cAAc;EAC7B,IAAI;AAEJ,MAAI,IAAI,WACN,YAAW,iCAAiC,IAAI,WAAW;OACtD;AACL,cAAW,kCAAkC;AAC7C,mBAAgB,SAAS;;AAG3B,OAAK,MAAM,OAAO,IAAI,sBAAsB,OAAO,IAAI,EAAE,CACvD,UAAS,UAAU,IAAI;AAGzB,MAAI,OAAO,iBACT,MAAK,MAAM,UAAU,OAAO,iBAC1B,UAAS,UAAU,OAAO;AAI9B,SAAO;IACN,CAAC,KAAK,OAAO,CAAC;AAEjB,QAAO,uBACL;EACE,UAAU,OAAO,2BAA2B,OAAO,oBAAC,uBAAD,EAAyB,CAAA;EAC5E,WAAW,0BAA0B,UAAU,IAAI;EACnD,cAAc,oBAAC,cAAD;GAAc,WAAW;GAAa;GAAO,CAAA;EAC5D,EACD,IACD"}

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

@@ -3,8 +3,7 @@ import { wrapLazy } from "../../../utils/lazy.js";
 //#region src/ui/operation/usage-tabs/lazy.tsx
 const UsageTabsSelectorLazy = wrapLazy(() => import("./client.js").then((mod) => ({ default: mod.UsageTabsSelector })));
 const UsageTabLazy = wrapLazy(() => import("./client.js").then((mod) => ({ default: mod.UsageTab })));
-const UsageTabsProviderLazy = wrapLazy(() => import("./client.js").then((mod) => ({ default: mod.UsageTabsProvider })));
 //#endregion
-export { UsageTabLazy, UsageTabsProviderLazy, UsageTabsSelectorLazy };
+export { UsageTabLazy, UsageTabsSelectorLazy };
 
 //# sourceMappingURL=lazy.js.map

package/dist/ui/operation/usage-tabs/lazy.js.map

@@ -1 +1 @@
-{"version":3,"file":"lazy.js","names":[],"sources":["../../../../src/ui/operation/usage-tabs/lazy.tsx"],"sourcesContent":["'use client';\nimport { wrapLazy } from '../../../utils/lazy';\n\nexport const UsageTabsSelectorLazy = wrapLazy(() =>\n  import('./client').then((mod) => ({ default: mod.UsageTabsSelector })),\n);\n\nexport const UsageTabLazy = wrapLazy(() =>\n  import('./client').then((mod) => ({ default: mod.UsageTab })),\n);\n\nexport const UsageTabsProviderLazy = wrapLazy(() =>\n  import('./client').then((mod) => ({ default: mod.UsageTabsProvider })),\n);\n"],"mappings":";;;AAGA,MAAa,wBAAwB,eACnC,OAAO,eAAY,MAAM,SAAS,EAAE,SAAS,IAAI,mBAAmB,EAAE,CACvE;AAED,MAAa,eAAe,eAC1B,OAAO,eAAY,MAAM,SAAS,EAAE,SAAS,IAAI,UAAU,EAAE,CAC9D;AAED,MAAa,wBAAwB,eACnC,OAAO,eAAY,MAAM,SAAS,EAAE,SAAS,IAAI,mBAAmB,EAAE,CACvE"}
+{"version":3,"file":"lazy.js","names":[],"sources":["../../../../src/ui/operation/usage-tabs/lazy.tsx"],"sourcesContent":["'use client';\nimport { wrapLazy } from '../../../utils/lazy';\n\nexport const UsageTabsSelectorLazy = wrapLazy(() =>\n  import('./client').then((mod) => ({ default: mod.UsageTabsSelector })),\n);\n\nexport const UsageTabLazy = wrapLazy(() =>\n  import('./client').then((mod) => ({ default: mod.UsageTab })),\n);\n"],"mappings":";;;AAGA,MAAa,wBAAwB,eACnC,OAAO,eAAY,MAAM,SAAS,EAAE,SAAS,IAAI,mBAAmB,EAAE,CACvE;AAED,MAAa,eAAe,eAC1B,OAAO,eAAY,MAAM,SAAS,EAAE,SAAS,IAAI,UAAU,EAAE,CAC9D"}

package/dist/ui/schema/index.d.ts

@@ -1,4 +1,4 @@
-import { ResolvedSchema } from "../../utils/schema.js";
+import { ResolvedSchema } from "../../utils/schema/index.js";
 import { SchemaUIProps } from "./client.js";
 import { ReactNode } from "react";
 

package/dist/ui/schema/index.js

@@ -1,14 +1,16 @@
 import { mergeAllOf } from "../../utils/merge-schema.js";
-import { FormatFlags, schemaToString } from "../../utils/schema-to-string.js";
+import { FormatFlags, schemaToString } from "../../utils/schema/to-string.js";
 import { I18nLabel } from "../client/i18n.js";
 import { SchemaUILazy } from "./lazy.js";
+import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/schema/index.tsx
 function Schema({ ctx, ...options }) {
 	if (ctx.schemaUI?.render) return ctx.schemaUI.render(options, ctx);
+	const generated = useMemo(() => generateSchemaUI(options, ctx), [ctx, options]);
 	return /* @__PURE__ */ jsx(SchemaUILazy, {
 		...options.client,
-		generated: generateSchemaUI(options, ctx)
+		generated
 	});
 }
 function generateSchemaUI({ root, readOnly, writeOnly }, ctx) {