fumadocs-openapi 9.7.3 → 10.0.1

package/dist/generate-file.d.ts

@@ -1,5 +1,5 @@
 import { type PagesToTextOptions } from './utils/pages/to-text.js';
-import { type ProcessedDocument } from './utils/process-document.js';
+import type { ProcessedDocument } from './utils/process-document.js';
 import type { OpenAPIServer } from './server/index.js';
 import { type SchemaToPagesOptions } from './utils/pages/preset-auto.js';
 export interface OutputFile {
@@ -31,11 +31,10 @@ interface IndexItem {
     only?: (string | OutputFile)[];
 }
 interface GenerateFilesConfig extends PagesToTextOptions {
-    cwd?: string;
     /**
-     * Schema files, or the OpenAPI server object
+     * the OpenAPI server object
      */
-    input: string[] | string | OpenAPIServer;
+    input: OpenAPIServer;
     /**
      * Output directory
      */

package/dist/generate-file.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generate-file.d.ts","sourceRoot":"","sources":["../src/generate-file.ts"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,kBAAkB,EAExB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAG9C,OAAO,EAEL,KAAK,oBAAoB,EAC1B,MAAM,2BAA2B,CAAC;AAInC,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,WAAW;IACnB,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,WAAW,KAAK,SAAS,EAAE,CAAC,CAAC;IAEzD;;OAEG;IACH,GAAG,EACC,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,CAAC,GAC9B;QACE,OAAO,EAAE,MAAM,CAAC;QAChB;;WAEG;QACH,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;CACP;AAED,UAAU,SAAS;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,UAAU,CAAC,EAAE,CAAC;CAChC;AAED,UAAU,mBAAoB,SAAQ,kBAAkB;IACtD,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,GAAG,aAAa,CAAC;IAEzC;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IAEpB;;QAEI;IACJ,WAAW,CAAC,EAAE,CACZ,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,UAAU,EAAE,KAChB,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,MAAM,GAAG,oBAAoB,GAAG,mBAAmB,CAAC;AAEhE,UAAU,WAAW;IACnB,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,CAAC,CAAC;IACjD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;CACvD;AAED,wBAAsB,aAAa,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAclE;AAED,wBAAsB,iBAAiB,CACrC,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,GAClE,OAAO,CAAC,UAAU,EAAE,CAAC,CA+DvB"}
+{"version":3,"file":"generate-file.d.ts","sourceRoot":"","sources":["../src/generate-file.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,kBAAkB,EAExB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAG9C,OAAO,EAEL,KAAK,oBAAoB,EAC1B,MAAM,2BAA2B,CAAC;AAGnC,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,WAAW;IACnB,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,WAAW,KAAK,SAAS,EAAE,CAAC,CAAC;IAEzD;;OAEG;IACH,GAAG,EACC,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,CAAC,GAC9B;QACE,OAAO,EAAE,MAAM,CAAC;QAChB;;WAEG;QACH,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;CACP;AAED,UAAU,SAAS;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,UAAU,CAAC,EAAE,CAAC;CAChC;AAED,UAAU,mBAAoB,SAAQ,kBAAkB;IACtD;;OAEG;IACH,KAAK,EAAE,aAAa,CAAC;IAErB;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IAEpB;;QAEI;IACJ,WAAW,CAAC,EAAE,CACZ,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,UAAU,EAAE,KAChB,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,MAAM,GAAG,oBAAoB,GAAG,mBAAmB,CAAC;AAEhE,UAAU,WAAW;IACnB,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,CAAC,CAAC;IACjD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;CACvD;AAED,wBAAsB,aAAa,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAalE;AAED,wBAAsB,iBAAiB,CACrC,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,GAClE,OAAO,CAAC,UAAU,EAAE,CAAC,CAiCvB"}

package/dist/generate-file.js

@@ -1,53 +1,23 @@
 import { mkdir, writeFile } from 'node:fs/promises';
 import * as path from 'node:path';
-import { glob } from 'tinyglobby';
 import { generateDocument, toText, } from './utils/pages/to-text.js';
-import { processDocumentCached, } from './utils/process-document.js';
 import { createGetUrl, getSlugs } from 'fumadocs-core/source';
 import matter from 'gray-matter';
 import { createAutoPreset, } from './utils/pages/preset-auto.js';
-import { isUrl } from './utils/url.js';
 import { fromSchema } from './utils/pages/builder.js';
 export async function generateFiles(options) {
     const files = await generateFilesOnly(options);
-    const { output, cwd = process.cwd() } = options;
-    const baseDir = path.join(cwd, output);
+    const { output } = options;
     await Promise.all(files.map(async (file) => {
-        const filePath = path.join(baseDir, file.path);
+        const filePath = path.join(output, file.path);
         await mkdir(path.dirname(filePath), { recursive: true });
         await writeFile(filePath, file.content);
         console.log(`Generated: ${filePath}`);
     }));
 }
 export async function generateFilesOnly(options) {
-    const { cwd = process.cwd(), beforeWrite } = options;
-    const input = typeof options.input === 'string' ? [options.input] : options.input;
-    let schemas = {};
-    async function resolveInput(item) {
-        if (isUrl(item)) {
-            schemas[item] = await processDocumentCached(item);
-            return;
-        }
-        const resolved = await glob(item, { cwd, absolute: true });
-        if (resolved.length > 1) {
-            console.warn('glob patterns in `input` are deprecated, please specify your schemas explicitly.');
-            for (let i = 0; i < resolved.length; i++) {
-                schemas[`${item}[${i}]`] = await processDocumentCached(item);
-            }
-        }
-        else if (resolved.length === 1) {
-            schemas[item] = await processDocumentCached(resolved[0]);
-        }
-        else {
-            throw new Error(`input not found: ${item}`);
-        }
-    }
-    if (Array.isArray(input)) {
-        await Promise.all(input.map(resolveInput));
-    }
-    else {
-        schemas = await input.getSchemas();
-    }
+    const { beforeWrite } = options;
+    const schemas = await options.input.getSchemas();
     const generated = {};
     const files = [];
     const entries = Object.entries(schemas);

package/dist/playground/client.d.ts

@@ -1,28 +1,20 @@
-import { type FC, type HTMLAttributes, type ReactElement } from 'react';
-import type { ControllerFieldState, ControllerRenderProps, FieldPath, UseFormStateReturn } from 'react-hook-form';
+import { type FC, type HTMLAttributes, type ReactNode } from 'react';
+import type { FieldPath, UseControllerProps, UseControllerReturn } from 'react-hook-form';
 import type { FetchResult } from '../playground/fetcher.js';
 import type { ParameterField, RequestSchema, SecurityEntry } from '../playground/index.js';
 import type { RequestData } from '../requests/types.js';
-interface FormValues {
+export interface FormValues {
     path: Record<string, unknown>;
     query: Record<string, unknown>;
     header: Record<string, unknown>;
     cookie: Record<string, unknown>;
     body: unknown;
+    /**
+     * Store the cached encoded request data, do not modify it.
+     */
     _encoded?: RequestData;
 }
-export interface CustomField<TName extends FieldPath<FormValues>, Info> {
-    render: (props: {
-        /**
-         * Field Info
-         */
-        info: Info;
-        field: ControllerRenderProps<FormValues, TName>;
-        fieldState: ControllerFieldState;
-        formState: UseFormStateReturn<FormValues>;
-    }) => ReactElement;
-}
-export interface ClientProps extends HTMLAttributes<HTMLFormElement> {
+export interface PlaygroundClientProps extends HTMLAttributes<HTMLFormElement> {
     route: string;
     method: string;
     parameters?: ParameterField[];
@@ -36,21 +28,50 @@ export interface ClientProps extends HTMLAttributes<HTMLFormElement> {
      */
     references: Record<string, RequestSchema>;
     proxyUrl?: string;
+}
+export interface PlaygroundClientOptions {
+    /**
+     * transform fields for auth-specific parameters (e.g. header)
+     */
+    transformAuthInputs?: (fields: AuthField[]) => AuthField[];
     /**
      * Request timeout in seconds (default: 10s)
      */
     requestTimeout?: number;
-    fields?: {
-        parameter?: CustomField<`${ParameterField['in']}.${string}`, ParameterField>;
-        auth?: CustomField<FieldPath<FormValues>, RequestSchema>;
-        body?: CustomField<'body', RequestSchema>;
-    };
     components?: Partial<{
         ResultDisplay: FC<{
             data: FetchResult;
         }>;
     }>;
+    /**
+     * render the paremeter inputs of API endpoint.
+     *
+     * It uses `react-hook-form`, you can use either:
+     * - the library itself, with types from `fumadocs-openapi/playground/client`.
+     * - the `Custom.useController()` from `fumadocs-openapi/playground/client`.
+     *
+     * Recommended types packages: `json-schema-typed`, `openapi-types`.
+     */
+    renderParameterField?: (fieldName: FieldPath<FormValues>, param: ParameterField) => ReactNode;
+    /**
+     * render the input for API endpoint body.
+     *
+     * @see renderParameterField for customisation tips
+     */
+    renderBodyField?: (fieldName: 'body', info: {
+        schema: RequestSchema;
+        mediaType: string;
+    }) => ReactNode;
+}
+export default function PlaygroundClient({ route, method, securities, parameters, body, references, proxyUrl, ...rest }: PlaygroundClientProps): import("react/jsx-runtime").JSX.Element;
+export interface AuthField {
+    fieldName: string;
+    defaultValue: unknown;
+    original?: SecurityEntry;
+    children: ReactNode;
+    mapOutput?: (values: unknown) => unknown;
 }
-export default function Client({ route, method, securities, parameters, body, fields, references, proxyUrl, components: { ResultDisplay }, requestTimeout, ...rest }: ClientProps): import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const Custom: {
+    useController<TName extends FieldPath<FormValues> = "path" | "query" | "header" | "cookie" | "body" | "_encoded" | `path.${string}` | `query.${string}` | `header.${string}` | `cookie.${string}` | "_encoded.method" | "_encoded.path" | "_encoded.query" | "_encoded.header" | "_encoded.cookie" | "_encoded.body" | "_encoded.bodyMediaType" | `_encoded.path.${string}` | `_encoded.query.${string}` | `_encoded.header.${string}` | `_encoded.cookie.${string}`, TTransformedValues = FormValues>(props: UseControllerProps<FormValues, TName, TTransformedValues>): UseControllerReturn<FormValues, TName>;
+};
 //# sourceMappingURL=client.d.ts.map

package/dist/playground/client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/playground/client.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,EAAE,EAEP,KAAK,cAAc,EAEnB,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,oBAAoB,EACpB,qBAAqB,EACrB,SAAS,EACT,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAUzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EACb,aAAa,EACd,MAAM,oBAAoB,CAAC;AAuC5B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,UAAU,UAAU;IAClB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,WAAW,CAAC;CACxB;AAED,MAAM,WAAW,WAAW,CAAC,KAAK,SAAS,SAAS,CAAC,UAAU,CAAC,EAAE,IAAI;IACpE,MAAM,EAAE,CAAC,KAAK,EAAE;QACd;;WAEG;QACH,IAAI,EAAE,IAAI,CAAC;QACX,KAAK,EAAE,qBAAqB,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;QAChD,UAAU,EAAE,oBAAoB,CAAC;QACjC,SAAS,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;KAC3C,KAAK,YAAY,CAAC;CACpB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,eAAe,CAAC;IAClE,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,cAAc,EAAE,CAAC;IAC9B,UAAU,EAAE,aAAa,EAAE,EAAE,CAAC;IAC9B,IAAI,CAAC,EAAE;QACL,MAAM,EAAE,aAAa,CAAC;QACtB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;IAC1C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,WAAW,CACrB,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,MAAM,EAAE,EACnC,cAAc,CACf,CAAC;QACF,IAAI,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,UAAU,CAAC,EAAE,aAAa,CAAC,CAAC;QACzD,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;KAC3C,CAAC;IAEF,UAAU,CAAC,EAAE,OAAO,CAAC;QACnB,aAAa,EAAE,EAAE,CAAC;YAAE,IAAI,EAAE,WAAW,CAAA;SAAE,CAAC,CAAC;KAC1C,CAAC,CAAC;CACJ;AAgBD,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,KAAK,EACL,MAAc,EACd,UAAU,EACV,UAAe,EACf,IAAI,EACJ,MAAM,EACN,UAAU,EACV,QAAQ,EACR,UAAU,EAAE,EAAE,aAAoC,EAAO,EACzD,cAAmB,EACnB,GAAG,IAAI,EACR,EAAE,WAAW,2CAyKb"}
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/playground/client.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,EAAE,EAEP,KAAK,cAAc,EAEnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,SAAS,EACT,kBAAkB,EAClB,mBAAmB,EACpB,MAAM,iBAAiB,CAAC;AAUzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAOxD,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EACb,aAAa,EACd,MAAM,oBAAoB,CAAC;AAmC5B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAIpD,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,IAAI,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;CACxB;AAED,MAAM,WAAW,qBAAsB,SAAQ,cAAc,CAAC,eAAe,CAAC;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,cAAc,EAAE,CAAC;IAC9B,UAAU,EAAE,aAAa,EAAE,EAAE,CAAC;IAC9B,IAAI,CAAC,EAAE;QACL,MAAM,EAAE,aAAa,CAAC;QACtB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;IAC1C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,mBAAmB,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,SAAS,EAAE,CAAC;IAE3D;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,UAAU,CAAC,EAAE,OAAO,CAAC;QACnB,aAAa,EAAE,EAAE,CAAC;YAAE,IAAI,EAAE,WAAW,CAAA;SAAE,CAAC,CAAC;KAC1C,CAAC,CAAC;IAEH;;;;;;;;OAQG;IACH,oBAAoB,CAAC,EAAE,CACrB,SAAS,EAAE,SAAS,CAAC,UAAU,CAAC,EAChC,KAAK,EAAE,cAAc,KAClB,SAAS,CAAC;IAEf;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAChB,SAAS,EAAE,MAAM,EACjB,IAAI,EAAE;QACJ,MAAM,EAAE,aAAa,CAAC;QACtB,SAAS,EAAE,MAAM,CAAC;KACnB,KACE,SAAS,CAAC;CAChB;AAaD,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,MAAc,EACd,UAAU,EACV,UAAe,EACf,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,qBAAqB,2CA8LvB;AA8LD,MAAM,WAAW,SAAS;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,OAAO,CAAC;IAEtB,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;IAEpB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;CAC1C;AAoQD,eAAO,MAAM,MAAM;kBAEf,KAAK,SAAS,SAAS,CAAC,UAAU,CAAC,qZACnC,kBAAkB,sBAEX,kBAAkB,CAAC,UAAU,EAAE,KAAK,EAAE,kBAAkB,CAAC,GAC/D,mBAAmB,CAAC,UAAU,EAAE,KAAK,CAAC;CAG1C,CAAC"}

package/dist/playground/client.js

@@ -1,9 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Fragment, lazy, useEffect, useMemo, useState, } from 'react';
-import { Controller, FormProvider, get, set, useForm, useFormContext, } from 'react-hook-form';
-import { useApiContext, useServerSelectContext } from '../ui/contexts/api.js';
-import { FieldInput, FieldSet, JsonInput, ObjectInput } from './inputs.js';
+import { Fragment, lazy, useEffect, useMemo, useState, useEffectEvent, } from 'react';
+import { FormProvider, get, set, useController, useForm, useFormContext, } from 'react-hook-form';
+import { useApiContext } from '../ui/contexts/api.js';
+import { FieldInput, FieldSet, JsonInput, ObjectInput, } from './components/inputs.js';
 import { getStatusInfo } from './status-info.js';
 import { joinURL, resolveRequestData, resolveServerUrl, withBase, } from '../utils/url.js';
 import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
@@ -15,40 +15,44 @@ import { encodeRequestData } from '../requests/media/encode.js';
 import { buttonVariants } from 'fumadocs-ui/components/ui/button';
 import { cn } from 'fumadocs-ui/utils/cn';
 import { SchemaProvider, useResolvedSchema, } from '../playground/schema.js';
-import { useRequestDataUpdater, useRequestInitialData, } from '../ui/contexts/code-example.js';
-import { useEffectEvent } from 'fumadocs-core/utils/use-effect-event';
+import { useOperationContext } from '../ui/contexts/operation.js';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../ui/components/select.js';
 import { labelVariants } from '../ui/components/input.js';
-const AuthPrefix = '__fumadocs_auth';
-const ServerSelect = lazy(() => import('../ui/server-select.js'));
-const OauthDialog = lazy(() => import('./auth/oauth-dialog.js').then((mod) => ({
+import ServerSelect from './components/server-select.js';
+import { useStorageKey } from '../ui/client/storage-key.js';
+const OauthDialog = lazy(() => import('./components/oauth-dialog.js').then((mod) => ({
     default: mod.OauthDialog,
 })));
-const OauthDialogTrigger = lazy(() => import('./auth/oauth-dialog.js').then((mod) => ({
+const OauthDialogTrigger = lazy(() => import('./components/oauth-dialog.js').then((mod) => ({
     default: mod.OauthDialogTrigger,
 })));
-export default function Client({ route, method = 'GET', securities, parameters = [], body, fields, references, proxyUrl, components: { ResultDisplay = DefaultResultDisplay } = {}, requestTimeout = 10, ...rest }) {
-    const { server } = useServerSelectContext();
-    const { key: requestDataKey, data: requestData } = useRequestInitialData();
-    const updater = useRequestDataUpdater();
+export default function PlaygroundClient({ route, method = 'GET', securities, parameters = [], body, references, proxyUrl, ...rest }) {
+    const { example: exampleId, examples, setExampleData, } = useOperationContext();
+    const storageKeys = useStorageKey();
     const fieldInfoMap = useMemo(() => new Map(), []);
-    const { mediaAdapters } = useApiContext();
+    const { mediaAdapters, serverRef, client: { playground: { components: { ResultDisplay = DefaultResultDisplay } = {}, requestTimeout = 10, transformAuthInputs, } = {}, }, } = useApiContext();
     const [securityId, setSecurityId] = useState(0);
-    const { inputs, mapInputs } = useAuthInputs(securities[securityId]);
-    const defaultValues = useMemo(() => ({
-        path: requestData.path,
-        query: requestData.query,
-        header: requestData.header,
-        body: requestData.body,
-        cookie: requestData.cookie,
-    }), [requestData]);
+    const { inputs, mapInputs, initAuthValues } = useAuthInputs(securities[securityId], transformAuthInputs);
+    const defaultValues = useMemo(() => {
+        const requestData = examples.find((example) => example.id === exampleId)?.data;
+        return {
+            path: requestData?.path ?? {},
+            query: requestData?.query ?? {},
+            header: requestData?.header ?? {},
+            body: requestData?.body ?? {},
+            cookie: requestData?.cookie ?? {},
+        };
+    }, [examples, exampleId]);
     const form = useForm({
         defaultValues,
     });
     const testQuery = useQuery(async (input) => {
+        const targetServer = serverRef.current;
         const fetcher = await import('./fetcher.js').then((mod) => mod.createBrowserFetcher(mediaAdapters, requestTimeout));
         input._encoded ?? (input._encoded = encodeRequestData({ ...mapInputs(input), method, bodyMediaType: body?.mediaType }, mediaAdapters, parameters));
-        return fetcher.fetch(joinURL(withBase(server ? resolveServerUrl(server.url, server.variables) : '/', window.location.origin), resolveRequestData(route, input._encoded)), {
+        return fetcher.fetch(joinURL(withBase(targetServer
+            ? resolveServerUrl(targetServer.url, targetServer.variables)
+            : '/', window.location.origin), resolveRequestData(route, input._encoded)), {
             proxyUrl,
             ...input._encoded,
         });
@@ -57,7 +61,7 @@ export default function Client({ route, method = 'GET', securities, parameters =
         for (const item of inputs) {
             const value = get(values, item.fieldName);
             if (value) {
-                localStorage.setItem(AuthPrefix + item.original.id, JSON.stringify(value));
+                localStorage.setItem(storageKeys.AuthField(item), JSON.stringify(value));
             }
         }
         const data = {
@@ -66,7 +70,7 @@ export default function Client({ route, method = 'GET', securities, parameters =
             bodyMediaType: body?.mediaType,
         };
         values._encoded ?? (values._encoded = encodeRequestData(data, mediaAdapters, parameters));
-        updater.setData(data, values._encoded);
+        setExampleData(data, values._encoded);
     });
     useEffect(() => {
         let timer = null;
@@ -86,7 +90,12 @@ export default function Client({ route, method = 'GET', securities, parameters =
         // eslint-disable-next-line react-hooks/exhaustive-deps -- mounted once only
     }, []);
     useEffect(() => {
-        form.reset((values) => initAuthValues(values, inputs));
+        form.reset(initAuthValues(defaultValues));
+        return () => fieldInfoMap.clear();
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- ignore other parts
+    }, [defaultValues]);
+    useEffect(() => {
+        form.reset((values) => initAuthValues(values));
         return () => {
             form.reset((values) => {
                 for (const item of inputs) {
@@ -95,19 +104,12 @@ export default function Client({ route, method = 'GET', securities, parameters =
                 return values;
             });
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps -- mounted once only
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- ignore other parts
     }, [inputs]);
-    useEffect(() => {
-        return () => {
-            fieldInfoMap.clear();
-            form.reset(initAuthValues(defaultValues, inputs));
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps -- for on change
-    }, [requestDataKey]);
     const onSubmit = form.handleSubmit((value) => {
         testQuery.start(mapInputs(value));
     });
-    return (_jsx(FormProvider, { ...form, children: _jsx(SchemaProvider, { fieldInfoMap: fieldInfoMap, references: references, children: _jsxs("form", { ...rest, className: cn('not-prose flex flex-col rounded-xl border shadow-md overflow-hidden bg-fd-card text-fd-card-foreground', rest.className), onSubmit: onSubmit, children: [_jsx(ServerSelect, {}), _jsxs("div", { className: "flex flex-row items-center gap-2 text-sm p-3 pb-0", children: [_jsx(MethodLabel, { children: method }), _jsx(Route, { route: route, className: "flex-1" }), _jsx("button", { type: "submit", className: cn(buttonVariants({ color: 'primary', size: 'sm' }), 'px-3 py-1.5'), disabled: testQuery.isLoading, children: testQuery.isLoading ? (_jsx(LoaderCircle, { className: "size-4 animate-spin" })) : ('Send') })] }), securities.length > 0 && (_jsx(SecurityTabs, { securities: securities, securityId: securityId, setSecurityId: setSecurityId, children: inputs.map((input) => (_jsx(Fragment, { children: input.children }, input.fieldName))) })), _jsx(FormBody, { body: body, fields: fields, parameters: parameters }), testQuery.data ? _jsx(ResultDisplay, { data: testQuery.data }) : null] }) }) }));
+    return (_jsx(FormProvider, { ...form, children: _jsx(SchemaProvider, { fieldInfoMap: fieldInfoMap, references: references, children: _jsxs("form", { ...rest, className: cn('not-prose flex flex-col rounded-xl border shadow-md overflow-hidden bg-fd-card text-fd-card-foreground', rest.className), onSubmit: onSubmit, children: [_jsx(ServerSelect, {}), _jsxs("div", { className: "flex flex-row items-center gap-2 text-sm p-3 not-last:pb-0", children: [_jsx(MethodLabel, { children: method }), _jsx(Route, { route: route, className: "flex-1" }), _jsx("button", { type: "submit", className: cn(buttonVariants({ color: 'primary', size: 'sm' }), 'px-3 py-1.5'), disabled: testQuery.isLoading, children: testQuery.isLoading ? (_jsx(LoaderCircle, { className: "size-4 animate-spin" })) : ('Send') })] }), securities.length > 0 && (_jsx(SecurityTabs, { securities: securities, securityId: securityId, setSecurityId: setSecurityId, children: inputs.map((input) => (_jsx(Fragment, { children: input.children }, input.fieldName))) })), _jsx(FormBody, { body: body, parameters: parameters }), testQuery.data ? _jsx(ResultDisplay, { data: testQuery.data }) : null] }) }) }));
 }
 function SecurityTabs({ securities, setSecurityId, securityId, children, }) {
     const [open, setOpen] = useState(false);
@@ -129,7 +131,8 @@ function SecurityTabs({ securities, setSecurityId, securityId, children, }) {
     return result;
 }
 const ParamTypes = ['path', 'header', 'cookie', 'query'];
-function FormBody({ parameters = [], fields = {}, body, }) {
+function FormBody({ parameters = [], body, }) {
+    const { renderParameterField, renderBodyField } = useApiContext().client.playground ?? {};
     const panels = useMemo(() => {
         return ParamTypes.map((type) => {
             const items = parameters.filter((v) => v.in === type);
@@ -142,17 +145,17 @@ function FormBody({ parameters = [], fields = {}, body, }) {
                     path: 'Path',
                 }[type], children: items.map((field) => {
                     const fieldName = `${type}.${field.name}`;
+                    if (renderParameterField) {
+                        return renderParameterField(fieldName, field);
+                    }
                     const schema = (field.content
                         ? field.content[Object.keys(field.content)[0]].schema
                         : field.schema);
-                    if (fields?.parameter) {
-                        return renderCustomField(fieldName, schema, fields.parameter, field.name);
-                    }
                     return (_jsx(FieldSet, { name: field.name, fieldName: fieldName, field: schema }, fieldName));
                 }) }, type));
         });
-    }, [fields.parameter, parameters]);
-    return (_jsxs(_Fragment, { children: [panels, body && (_jsx(CollapsiblePanel, { title: "Body", children: fields.body ? (renderCustomField('body', body.schema, fields.body)) : (_jsx(BodyInput, { field: body.schema })) }))] }));
+    }, [parameters, renderParameterField]);
+    return (_jsxs(_Fragment, { children: [panels, body && (_jsx(CollapsiblePanel, { title: "Body", children: renderBodyField ? (renderBodyField('body', body)) : (_jsx(BodyInput, { field: body.schema })) }))] }));
 }
 function BodyInput({ field: _field }) {
     const field = useResolvedSchema(_field);
@@ -171,7 +174,8 @@ function BodyInput({ field: _field }) {
                 className: 'p-2',
             })), onClick: () => setIsJson(true), children: "Open JSON Editor" }) }));
 }
-function useAuthInputs(securities) {
+function useAuthInputs(securities, transform) {
+    const storageKeys = useStorageKey();
     const inputs = useMemo(() => {
         const result = [];
         if (!securities)
@@ -254,8 +258,8 @@ function useAuthInputs(securities) {
                 });
             }
         }
-        return result;
-    }, [securities]);
+        return transform ? transform(result) : result;
+    }, [securities, transform]);
     const mapInputs = (values) => {
         const cloned = structuredClone(values);
         for (const item of inputs) {
@@ -265,26 +269,21 @@ function useAuthInputs(securities) {
         }
         return cloned;
     };
-    return { inputs, mapInputs };
-}
-function initAuthValues(values, inputs) {
-    for (const item of inputs) {
-        const stored = localStorage.getItem(AuthPrefix + item.original.id);
-        if (stored) {
-            const parsed = JSON.parse(stored);
-            if (typeof parsed === typeof item.defaultValue) {
-                set(values, item.fieldName, parsed);
-                continue;
+    const initAuthValues = (values) => {
+        for (const item of inputs) {
+            const stored = localStorage.getItem(storageKeys.AuthField(item));
+            if (stored) {
+                const parsed = JSON.parse(stored);
+                if (typeof parsed === typeof item.defaultValue) {
+                    set(values, item.fieldName, parsed);
+                    continue;
+                }
             }
+            set(values, item.fieldName, item.defaultValue);
         }
-        set(values, item.fieldName, item.defaultValue);
-    }
-    return values;
-}
-function renderCustomField(fieldName, info, field, key) {
-    return (_jsx(Controller, { 
-        // @ts-expect-error we use string here
-        render: (props) => field.render({ ...props, info }), name: fieldName }, key));
+        return values;
+    };
+    return { inputs, mapInputs, initAuthValues };
 }
 function Route({ route, ...props }) {
     return (_jsx("div", { ...props, className: cn('flex flex-row items-center gap-0.5 overflow-auto text-nowrap', props.className), children: route.split('/').map((part, index) => (_jsxs(Fragment, { children: [index > 0 && _jsx("span", { className: "text-fd-muted-foreground", children: "/" }), part.startsWith('{') && part.endsWith('}') ? (_jsx("code", { className: "bg-fd-primary/10 text-fd-primary", children: part })) : (_jsx("code", { className: "text-fd-foreground", children: part }))] }, index))) }));
@@ -301,3 +300,9 @@ function DefaultResultDisplay({ data }) {
 function CollapsiblePanel({ title, children, ...props }) {
     return (_jsxs(Collapsible, { ...props, className: "border-b last:border-b-0", children: [_jsxs(CollapsibleTrigger, { className: "group w-full flex items-center gap-2 p-3 text-sm font-medium", children: [title, _jsx(ChevronDown, { className: "ms-auto size-3.5 text-fd-muted-foreground group-data-[state=open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col gap-3 p-3 pt-1", children: children }) })] }));
 }
+// exports for customisations
+export const Custom = {
+    useController(props) {
+        return useController(props);
+    },
+};

package/dist/playground/{inputs.d.ts → components/inputs.d.ts}

@@ -1,5 +1,5 @@
 import { type ComponentProps, type HTMLAttributes, type ReactNode } from 'react';
-import type { RequestSchema } from '../playground/index.js';
+import type { RequestSchema } from '../../playground/index.js';
 export declare function ObjectInput({ field: _field, fieldName, ...props }: {
     field: Exclude<RequestSchema, boolean>;
     fieldName: string;

package/dist/playground/components/inputs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"inputs.d.ts","sourceRoot":"","sources":["../../../src/playground/components/inputs.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAef,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAkDxD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EAAE,MAAM,EACb,SAAS,EACT,GAAG,KAAK,EACT,EAAE;IACD,KAAK,EAAE,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;IACvC,SAAS,EAAE,MAAM,CAAC;CACnB,GAAG,cAAc,CAAC,KAAK,CAAC,uDAwCxB;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,2CA8B7D;AA6FD,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,SAAS,EACT,UAAU,EACV,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,KAAK,EAAE,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;CACnB,uDAoGA;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EAAE,MAAM,EACb,SAAS,EACT,OAAO,EACP,IAAI,EACJ,UAAU,EACV,KAAS,EACT,QAAQ,EACR,WAAkB,EAClB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,kDA4KA"}

package/dist/playground/{inputs.js → components/inputs.js}

@@ -1,16 +1,16 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useMemo, useState, } from 'react';
-import { ChevronDown, Plus, Trash2, X } from '../icons.js';
+import { ChevronDown, Plus, Trash2, X } from '../../icons.js';
 import { set, useController, useFieldArray, useFormContext, } from 'react-hook-form';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../ui/components/select.js';
-import { Input, labelVariants } from '../ui/components/input.js';
-import { getDefaultValue } from './get-default-values.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../ui/components/select.js';
+import { Input, labelVariants } from '../../ui/components/input.js';
+import { getDefaultValue } from '../get-default-values.js';
 import { cn } from 'fumadocs-ui/utils/cn';
 import { buttonVariants } from 'fumadocs-ui/components/ui/button';
-import { combineSchema } from '../utils/combine-schema.js';
-import { FormatFlags, schemaToString } from '../utils/schema-to-string.js';
-import { anyFields, useFieldInfo, useResolvedSchema, } from '../playground/schema.js';
+import { combineSchema } from '../../utils/combine-schema.js';
+import { FormatFlags, schemaToString } from '../../utils/schema-to-string.js';
+import { anyFields, useFieldInfo, useResolvedSchema, } from '../../playground/schema.js';
 function FieldLabel(props) {
     return (_jsx("label", { ...props, className: cn('w-full inline-flex items-center gap-0.5', props.className), children: props.children }));
 }

package/dist/playground/components/oauth-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"oauth-dialog.d.ts","sourceRoot":"","sources":["../../../src/playground/components/oauth-dialog.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAIjD,OAAO,EAAE,KAAK,SAAS,EAAuB,MAAM,OAAO,CAAC;AAa5D,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,WAAW,CAAC,oBAAoB,CAAC;IACzC,MAAM,EAAE,MAAM,EAAE,CAAC;IAEjB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAuCD,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,OAAO,GACR,EAAE,eAAe,2CAwSjB;AAED,eAAO,MAAM,kBAAkB,mJAAgB,CAAC"}

package/dist/playground/components/server-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"server-select.d.ts","sourceRoot":"","sources":["../../../src/playground/components/server-select.tsx"],"names":[],"mappings":"AAUA,OAAO,EACL,KAAK,cAAc,EAIpB,MAAM,OAAO,CAAC;AAef,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,uDAwDzE"}

package/dist/{ui → playground/components}/server-select.js

@@ -1,14 +1,13 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useApiContext, useServerSelectContext } from '../ui/contexts/api.js';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../ui/components/select.js';
-import { Input, labelVariants } from '../ui/components/input.js';
-import { useEffect, useState } from 'react';
+import { useApiContext, useServerSelectContext } from '../../ui/contexts/api.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../ui/components/select.js';
+import { Input, labelVariants } from '../../ui/components/input.js';
+import { useEffect, useState, useEffectEvent, } from 'react';
 import { cn } from 'fumadocs-ui/utils/cn';
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger, } from '../ui/components/dialog.js';
-import { resolveServerUrl, withBase } from '../utils/url.js';
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger, } from '../../ui/components/dialog.js';
+import { resolveServerUrl, withBase } from '../../utils/url.js';
 import { FormProvider, useController, useForm } from 'react-hook-form';
-import { useEffectEvent } from 'fumadocs-core/utils/use-effect-event';
 export default function ServerSelect(props) {
     const { servers } = useApiContext();
     const { server, setServer, setServerVariables } = useServerSelectContext();

package/dist/playground/index.d.ts

@@ -1,6 +1,5 @@
 import type { MethodInformation, ParameterObject, RenderContext, SecuritySchemeObject } from '../types.js';
 import { type NoReference, type ParsedSchema } from '../utils/schema.js';
-import { type ClientProps } from './client.js';
 export type ParameterField = NoReference<ParameterObject> & {
     schema: ParsedSchema;
     in: 'cookie' | 'header' | 'query' | 'path';
@@ -10,12 +9,10 @@ export interface APIPlaygroundProps {
     path: string;
     method: MethodInformation;
     ctx: RenderContext;
-    client?: Partial<ClientProps>;
 }
-export type { ClientProps, CustomField } from './client.js';
 export type SecurityEntry = SecuritySchemeObject & {
     scopes: string[];
     id: string;
 };
-export declare function APIPlayground({ path, method, ctx, client, }: APIPlaygroundProps): Promise<import("react/jsx-runtime").JSX.Element>;
+export declare function APIPlayground({ path, method, ctx }: APIPlaygroundProps): Promise<string | number | bigint | boolean | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined>;
 //# sourceMappingURL=index.d.ts.map

package/dist/playground/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/playground/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EACjB,eAAe,EACf,aAAa,EACb,oBAAoB,EACrB,MAAM,SAAS,CAAC;AACjB,OAAO,EAEL,KAAK,WAAW,EAChB,KAAK,YAAY,EAClB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,MAAM,MAAM,cAAc,GAAG,WAAW,CAAC,eAAe,CAAC,GAAG;IAC1D,MAAM,EAAE,YAAY,CAAC;IACrB,EAAE,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC;AAQzC,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,iBAAiB,CAAC;IAC1B,GAAG,EAAE,aAAa,CAAC;IAEnB,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC/B;AAED,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEzD,MAAM,MAAM,aAAa,GAAG,oBAAoB,GAAG;IACjD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,wBAAsB,aAAa,CAAC,EAClC,IAAI,EACJ,MAAM,EACN,GAAG,EACH,MAAM,GACP,EAAE,kBAAkB,oDAkCpB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/playground/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EACjB,eAAe,EACf,aAAa,EACb,oBAAoB,EACrB,MAAM,SAAS,CAAC;AACjB,OAAO,EAEL,KAAK,WAAW,EAChB,KAAK,YAAY,EAClB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,MAAM,cAAc,GAAG,WAAW,CAAC,eAAe,CAAC,GAAG;IAC1D,MAAM,EAAE,YAAY,CAAC;IACrB,EAAE,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC;AAQzC,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,iBAAiB,CAAC;IAC1B,GAAG,EAAE,aAAa,CAAC;CACpB;AAED,MAAM,MAAM,aAAa,GAAG,oBAAoB,GAAG;IACjD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,wBAAsB,aAAa,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,kBAAkB,kJAqC5E"}

package/dist/playground/index.js

@@ -1,7 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { getPreferredType, } from '../utils/schema.js';
-import { ClientLazy } from '../ui/lazy.js';
-export async function APIPlayground({ path, method, ctx, client, }) {
+import { ClientLazy } from './lazy.js';
+export async function APIPlayground({ path, method, ctx }) {
+    if (ctx.playground?.render) {
+        return ctx.playground.render({ path, method, ctx });
+    }
     let currentId = 0;
     const bodyContent = method.requestBody?.content;
     const mediaType = bodyContent ? getPreferredType(bodyContent) : undefined;
@@ -25,7 +28,6 @@ export async function APIPlayground({ path, method, ctx, client, }) {
             : undefined,
         references: context.references,
         proxyUrl: ctx.proxyUrl,
-        ...client,
     };
     return _jsx(ClientLazy, { ...props });
 }

package/dist/playground/lazy.d.ts

@@ -0,0 +1,2 @@
+export declare const ClientLazy: typeof import("./client.js").default;
+//# sourceMappingURL=lazy.d.ts.map

package/dist/playground/lazy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"lazy.d.ts","sourceRoot":"","sources":["../../src/playground/lazy.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU,mCAAqC,CAAC"}

package/dist/playground/lazy.js

@@ -0,0 +1,3 @@
+'use client';
+import { wrapLazy } from '../utils/lazy.js';
+export const ClientLazy = wrapLazy(() => import('./client.js'));

package/dist/requests/generators/index.d.ts

@@ -1,3 +1,3 @@
-import type { CodeSample } from '../../render/operation/index.js';
-export declare const defaultSamples: CodeSample[];
+import type { CodeUsageGenerator } from '../../ui/operation/example-panel/index.js';
+export declare const defaultSamples: CodeUsageGenerator[];
 //# sourceMappingURL=index.d.ts.map

package/dist/requests/generators/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/requests/generators/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAQrD,eAAO,MAAM,cAAc,EAAE,UAAU,EA+BtC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/requests/generators/index.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAEvE,eAAO,MAAM,cAAc,EAAE,kBAAkB,EAqC9C,CAAC"}

package/dist/requests/generators/index.js

@@ -6,31 +6,37 @@ import * as Java from './java.js';
 import * as CSharp from './csharp.js';
 export const defaultSamples = [
     {
+        id: 'curl',
         label: 'cURL',
         source: CURL.generator,
         lang: 'bash',
     },
     {
+        id: 'js',
         label: 'JavaScript',
         source: JS.generator,
         lang: 'js',
     },
     {
+        id: 'go',
         label: 'Go',
         source: Go.generator,
         lang: 'go',
     },
     {
+        id: 'python',
         label: 'Python',
         source: Python.generator,
         lang: 'python',
     },
     {
+        id: 'java',
         label: 'Java',
         source: Java.generator,
         lang: 'java',
     },
     {
+        id: 'csharp',
         label: 'C#',
         source: CSharp.generator,
         lang: 'csharp',