fumadocs-openapi 7.0.0 → 7.0.2

package/dist/playground/client.d.ts

@@ -61,6 +61,6 @@ export type DynamicField = {
     schema: RequestSchema | ReferenceSchema;
 };
 export declare function useSchemaContext(): SchemaContextType;
-export declare function Client({ route, method, authorization, parameters, body, fields, references, proxyUrl, components: { ResultDisplay }, ...props }: ClientProps): import("react/jsx-runtime").JSX.Element;
+export declare function Client({ route, method, authorization, parameters, body, fields, references, proxyUrl, components: { ResultDisplay }, ...rest }: ClientProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# 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":"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"}
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/playground/client.tsx"],"names":[],"mappings":"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"}

package/dist/playground/client.js

@@ -12,7 +12,7 @@ import { MethodLabel } from '../ui/components/method-label.js';
 import { useQuery } from '../utils/use-query.js';
 import ServerSelect from '../ui/server-select.js';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from 'fumadocs-ui/components/ui/collapsible';
-import { ChevronDown } from 'lucide-react';
+import { ChevronDown, Loader2 } from 'lucide-react';
 import { OauthDialog, OauthDialogTrigger, } from '../playground/auth/oauth-dialog.js';
 import { useRequestData } from '../ui/contexts/code-example.js';
 import { useEffectEvent } from 'fumadocs-core/utils/use-effect-event';
@@ -34,17 +34,8 @@ function toRequestData(method, mediaType, value) {
         query: value.query,
     };
 }
-export function Client({ route, method = 'GET', authorization, parameters = [], body, fields = {}, references, proxyUrl, components: { ResultDisplay = DefaultResultDisplay } = {}, ...props }) {
-    const { servers } = useApiContext();
-    const { server, setServer, setServerVariables } = useServerSelectContext();
-    const params = useMemo(() => {
-        return {
-            headers: parameters.filter((v) => v.in === 'header'),
-            cookies: parameters.filter((v) => v.in === 'cookie'),
-            queries: parameters.filter((v) => v.in === 'query'),
-            paths: parameters.filter((v) => v.in === 'path'),
-        };
-    }, [parameters]);
+export function Client({ route, method = 'GET', authorization, parameters, body, fields, references, proxyUrl, components: { ResultDisplay = DefaultResultDisplay } = {}, ...rest }) {
+    const { server } = useServerSelectContext();
     const dynamicRef = useRef(new Map());
     const requestData = useRequestData();
     const authInfo = usePersistentAuthInfo(authorization);
@@ -90,13 +81,34 @@ export function Client({ route, method = 'GET', authorization, parameters = [],
     const onSubmit = form.handleSubmit((value) => {
         testQuery.start(value);
     });
-    function renderCustomField(fieldName, info, field, key) {
-        if (field) {
-            return (_jsx(Controller, { control: form.control, render: (props) => field.render({ ...props, info }), name: fieldName }, key));
-        }
-        return (_jsx(FieldSet, { name: info.name, fieldName: fieldName, field: info }, key));
-    }
-    return (_jsx(FormProvider, { ...form, children: _jsx(SchemaContext.Provider, { value: useMemo(() => ({ references: references, dynamic: dynamicRef }), [references]), children: _jsx(AuthProvider, { authorization: authorization, children: _jsxs("form", { ...props, className: cn('not-prose flex flex-col gap-2 rounded-xl border p-3 shadow-md', props.className), onSubmit: onSubmit, children: [_jsx(FormHeader, { method: method, route: route, isLoading: testQuery.isLoading }), servers.length > 1 ? (_jsx(CollapsiblePanel, { title: "Server URL", children: _jsx(ServerSelect, { server: server, onServerChanged: setServer, onVariablesChanged: setServerVariables }) })) : null, params.headers.length > 0 || authorization ? (_jsxs(CollapsiblePanel, { title: "Headers", children: [authorization ? (_jsx(AuthField, { authorization: authorization })) : null, params.headers.map((field) => renderCustomField(`header.${field.name}`, field, fields.parameter, field.name))] })) : null, params.paths.length > 0 ? (_jsx(CollapsiblePanel, { title: "Path", children: params.paths.map((field) => renderCustomField(`path.${field.name}`, field, fields.parameter, field.name)) })) : null, params.queries.length > 0 ? (_jsx(CollapsiblePanel, { title: "Query", children: params.queries.map((field) => renderCustomField(`query.${field.name}`, field, fields.parameter, field.name)) })) : null, params.cookies.length > 0 ? (_jsx(CollapsiblePanel, { title: "Cookies", children: params.cookies.map((field) => renderCustomField(`cookie.${field.name}`, field, fields.parameter, field.name)) })) : null, body ? (_jsx(CollapsiblePanel, { title: "Body", children: body.type === 'object' && !fields.body ? (_jsx(ObjectInput, { field: body, fieldName: "body" })) : (renderCustomField('body', body, fields.body)) })) : null, testQuery.data ? _jsx(ResultDisplay, { data: testQuery.data }) : null] }) }) }) }));
+    return (_jsx(FormProvider, { ...form, children: _jsx(SchemaContext.Provider, { value: useMemo(() => ({ references: references, dynamic: dynamicRef }), [references]), children: _jsx(AuthProvider, { authorization: authorization, children: _jsxs("form", { ...rest, className: cn('not-prose flex flex-col rounded-xl border p-3 gap-3 shadow-md overflow-hidden', rest.className), onSubmit: onSubmit, children: [_jsxs("div", { className: "flex flex-row items-center gap-2 text-sm", 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(Loader2, { className: "size-4 animate-spin" })) : ('Send') })] }), _jsx(FormBody, { body: body, fields: fields, parameters: parameters, authorization: authorization }), testQuery.data ? _jsx(ResultDisplay, { data: testQuery.data }) : null] }) }) }) }));
+}
+const paramNames = ['Headers', 'Cookies', 'Query', 'Path'];
+const paramTypes = ['header', 'cookie', 'query', 'path'];
+function FormBody({ authorization, parameters = [], body, fields = {}, }) {
+    const { servers } = useApiContext();
+    const { server, setServer, setServerVariables } = useServerSelectContext();
+    const params = useMemo(() => {
+        return paramTypes.map((param) => parameters.filter((v) => v.in === param));
+    }, [parameters]);
+    return (_jsxs(_Fragment, { children: [servers.length > 1 ? (_jsx(CollapsiblePanel, { title: "Server URL", children: _jsx(ServerSelect, { server: server, onServerChanged: setServer, onVariablesChanged: setServerVariables }) })) : null, params.map((param, i) => {
+                const name = paramNames[i];
+                const type = paramTypes[i];
+                if ((param.length === 0 && type !== 'header') || !authorization)
+                    return;
+                return (_jsxs(CollapsiblePanel, { title: name, children: [type === 'header' && authorization ? (_jsx(AuthField, { authorization: authorization })) : null, param.map((field) => {
+                            const fieldName = `${type}.${field.name}`;
+                            if (!fields?.parameter) {
+                                return (_jsx(FieldSet, { name: field.name, fieldName: fieldName, field: field }, fieldName));
+                            }
+                            return renderCustomField(fieldName, field, fields.parameter, field.name);
+                        })] }, name));
+            }), body ? (_jsx(CollapsiblePanel, { title: "Body", children: fields.body ? (renderCustomField('body', body, fields.body)) : body.type === 'object' ? (_jsx(ObjectInput, { field: body, fieldName: "body" })) : (_jsx(FieldSet, { field: body, fieldName: "body" })) })) : null] }));
+}
+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));
 }
 function AuthProvider({ authorization, children, }) {
     const form = useFormContext();
@@ -134,9 +146,6 @@ function Route({ route, ...props }) {
     const segments = route.split('/').filter((part) => part.length > 0);
     return (_jsx("div", { ...props, className: cn('flex flex-row items-center gap-0.5 overflow-auto text-nowrap', props.className), children: segments.map((part, index) => (_jsxs(Fragment, { children: [_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))) }));
 }
-function FormHeader({ route, method, isLoading, }) {
-    return (_jsxs("div", { className: "flex flex-row items-center gap-2 text-sm", 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: isLoading, children: "Send" })] }));
-}
 function DefaultResultDisplay({ data }) {
     const statusInfo = useMemo(() => getStatusInfo(data.status), [data.status]);
     const { shikiOptions } = useApiContext();
@@ -144,7 +153,7 @@ function DefaultResultDisplay({ data }) {
                     ? 'text'
                     : data.type, code: typeof data.data === 'string'
                     ? data.data
-                    : JSON.stringify(data.data, null, 2), ...shikiOptions })) : null] }));
+                    : JSON.stringify(data.data, null, 2), options: shikiOptions })) : null] }));
 }
 function usePersistentAuthInfo(authorization) {
     const key = authorization
@@ -179,7 +188,7 @@ function usePersistentAuthInfo(authorization) {
     };
 }
 function CollapsiblePanel({ title, children, ...props }) {
-    return (_jsxs(Collapsible, { ...props, className: "border rounded-xl bg-fd-card text-fd-card-foreground overflow-hidden", children: [_jsxs(CollapsibleTrigger, { className: "group w-full inline-flex items-center gap-2 justify-between p-3 text-sm font-medium hover:bg-fd-accent", children: [title, _jsx(ChevronDown, { className: "size-4 group-data-[state=open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col gap-4 p-3", children: children }) })] }));
+    return (_jsxs(Collapsible, { ...props, className: "rounded-xl bg-fd-card border text-fd-card-foreground", children: [_jsxs(CollapsibleTrigger, { className: "group w-full inline-flex items-center gap-2 p-3 text-sm font-medium", children: [title, _jsx(ChevronDown, { className: "ms-auto size-4 text-fd-muted-foreground group-data-[state=open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col gap-3 p-3", children: children }) })] }));
 }
 function writeAuthHeader(authorization, input, header, query, cookie) {
     if (authorization.type === 'apiKey') {

package/dist/playground/inputs.d.ts

@@ -14,7 +14,7 @@ export declare function FieldInput({ field, fieldName, ...props }: HTMLAttribute
     fieldName: string;
 }): import("react/jsx-runtime").JSX.Element | null;
 export declare function FieldSet({ field, fieldName, toolbar, name, ...props }: HTMLAttributes<HTMLElement> & {
-    name?: string;
+    name?: ReactNode;
     field: RequestSchema;
     fieldName: string;
     toolbar?: ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"inputs.d.ts","sourceRoot":"","sources":["../../src/playground/inputs.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAMxD,KAAK,WAAW,CAAC,IAAI,IAAI,OAAO,CAAC,aAAa,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AA6BhE,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE;IACD,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,2CAqBjC;AA+ID,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,KAAK,EAAE,OAAO,CAAC,aAAa,EAAE;QAAE,IAAI,EAAE,UAAU,CAAA;KAAE,CAAC,CAAC;IACpD,SAAS,EAAE,MAAM,CAAC;CACnB,kDAmGA;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,kDAgGA"}
+{"version":3,"file":"inputs.d.ts","sourceRoot":"","sources":["../../src/playground/inputs.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAMxD,KAAK,WAAW,CAAC,IAAI,IAAI,OAAO,CAAC,aAAa,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AA6BhE,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE;IACD,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,2CAqBjC;AA+ID,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,KAAK,EAAE,OAAO,CAAC,aAAa,EAAE;QAAE,IAAI,EAAE,UAAU,CAAA;KAAE,CAAC,CAAC;IACpD,SAAS,EAAE,MAAM,CAAC;CACnB,kDAmGA;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,kDAgGA"}

package/dist/playground/inputs.js

@@ -102,10 +102,10 @@ export function FieldInput({ field, fieldName, ...props }) {
     if (field.type === 'null')
         return null;
     if (field.type === 'object') {
-        return (_jsx(ObjectInput, { field: field, fieldName: fieldName, ...props, className: cn('rounded-lg border border-fd-primary/20 bg-fd-card p-3 shadow-sm', props.className) }));
+        return (_jsx(ObjectInput, { field: field, fieldName: fieldName, ...props, className: cn('rounded-lg border border-fd-primary/20 bg-fd-background/50 p-3 shadow-sm', props.className) }));
     }
     if (field.type === 'array') {
-        return (_jsx(ArrayInput, { fieldName: fieldName, field: field, ...props, className: cn('rounded-lg border border-fd-primary/20 bg-fd-background p-3 shadow-sm', props.className) }));
+        return (_jsx(ArrayInput, { fieldName: fieldName, field: field, ...props, className: cn('rounded-lg border border-fd-primary/20 bg-fd-background/50 p-3 shadow-sm', props.className) }));
     }
     if (field.type === 'file') {
         return (_jsx(Controller, { control: control, name: fieldName, render: ({ field: { value: _, onChange, ...restField } }) => (_jsx("input", { id: fieldName, type: "file", multiple: false, onChange: (e) => {
@@ -172,7 +172,7 @@ function ArrayInput({ fieldName, field, ...props }) {
     const { fields, append, remove } = useFieldArray({
         name: fieldName,
     });
-    return (_jsxs("div", { ...props, className: cn('flex flex-col gap-2', props.className), children: [fields.map((item, index) => (_jsx(FieldSet, { name: `${fieldName.split('.').at(-1)}[${index}]`, field: items, fieldName: `${fieldName}.${index}`, toolbar: _jsx("button", { type: "button", "aria-label": "Remove Item", className: cn(buttonVariants({
+    return (_jsxs("div", { ...props, className: cn('flex flex-col gap-2', props.className), children: [fields.map((item, index) => (_jsx(FieldSet, { name: _jsxs("span", { className: "text-fd-muted-foreground", children: [fieldName.split('.').at(-1), "[", index, "]"] }), field: items, fieldName: `${fieldName}.${index}`, toolbar: _jsx("button", { type: "button", "aria-label": "Remove Item", className: cn(buttonVariants({
                         color: 'secondary',
                         size: 'sm',
                     })), onClick: () => {

package/dist/render/codeblock.d.ts

@@ -3,7 +3,7 @@ import type { RenderContext } from '../types.js';
 export type CodeBlockProps = HTMLAttributes<HTMLPreElement> & {
     code: string;
     lang: string;
-    options?: RenderContext['shikiOptions'];
+    ctx: RenderContext;
 };
-export declare function CodeBlock({ code, lang, options, ...rest }: CodeBlockProps): Promise<React.ReactElement>;
+export declare function CodeBlock({ code, lang, ctx, ...rest }: CodeBlockProps): Promise<React.ReactElement>;
 //# sourceMappingURL=codeblock.d.ts.map

package/dist/render/codeblock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/render/codeblock.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAG7C,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;CACzC,CAAC;AAEF,wBAAsB,SAAS,CAAC,EAC9B,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,GAAG,IAAI,EACR,EAAE,cAAc,GAAG,OAAO,CAAC,KAAK,CAAC,YAAY,CAAC,CAU9C"}
+{"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/render/codeblock.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAG7C,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,aAAa,CAAC;CACpB,CAAC;AAEF,wBAAsB,SAAS,CAAC,EAC9B,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,GAAG,IAAI,EACR,EAAE,cAAc,GAAG,OAAO,CAAC,KAAK,CAAC,YAAY,CAAC,CAU9C"}

package/dist/render/codeblock.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as Base from 'fumadocs-ui/components/codeblock';
 import { highlight } from 'fumadocs-core/highlight';
-export async function CodeBlock({ code, lang, options, ...rest }) {
+export async function CodeBlock({ code, lang, ctx, ...rest }) {
     const rendered = await highlight(code, {
         lang,
-        ...options,
+        ...ctx.shikiOptions,
         components: {
             pre: (props) => _jsx(Base.Pre, { ...props, ...rest }),
         },

package/dist/render/operation/api-example.js

@@ -85,7 +85,8 @@ function dedupe(samples) {
     }
     return out;
 }
-function ResponseTabs({ operation, ctx: { renderer, generateTypeScriptSchema, schema }, }) {
+function ResponseTabs({ operation, ctx, }) {
+    const { renderer, generateTypeScriptSchema, schema } = ctx;
     if (!operation.responses)
         return null;
     async function renderResponse(code) {
@@ -111,14 +112,14 @@ function ResponseTabs({ operation, ctx: { renderer, generateTypeScriptSchema, sc
             exampleSlot = Object.entries(responseOfType.examples).map(([key, sample], i) => {
                 const title = sample?.summary ?? `Example ${i + 1}`;
                 values.push(title);
-                return (_jsxs(renderer.ResponseType, { label: title, children: [sample?.description ? (_jsx(Markdown, { text: sample.description })) : null, _jsx(CodeBlock, { lang: "json", code: JSON.stringify(sample.value, null, 2) })] }, key));
+                return (_jsxs(renderer.ResponseType, { label: title, children: [sample?.description ? (_jsx(Markdown, { text: sample.description })) : null, _jsx(CodeBlock, { lang: "json", code: JSON.stringify(sample.value, null, 2), ctx: ctx })] }, key));
             });
         }
         else if (responseOfType?.example || responseOfType?.schema) {
             values.push('Response');
-            exampleSlot = (_jsx(renderer.ResponseType, { label: "Response", children: _jsx(CodeBlock, { lang: "json", code: JSON.stringify(responseOfType.example ?? sample(responseOfType.schema), null, 2) }) }));
+            exampleSlot = (_jsx(renderer.ResponseType, { label: "Response", children: _jsx(CodeBlock, { lang: "json", code: JSON.stringify(responseOfType.example ?? sample(responseOfType.schema), null, 2), ctx: ctx }) }));
         }
-        return (_jsxs(renderer.Response, { value: code, children: [description ? _jsx(Markdown, { text: description }) : null, exampleSlot ? (_jsxs(renderer.ResponseTypes, { defaultValue: values[0], children: [exampleSlot, ts ? (_jsx(renderer.ResponseType, { label: "TypeScript", children: _jsx(CodeBlock, { code: ts, lang: "ts" }) })) : null] })) : null] }));
+        return (_jsxs(renderer.Response, { value: code, children: [description ? _jsx(Markdown, { text: description }) : null, exampleSlot ? (_jsxs(renderer.ResponseTypes, { defaultValue: values[0], children: [exampleSlot, ts ? (_jsx(renderer.ResponseType, { label: "TypeScript", children: _jsx(CodeBlock, { lang: "ts", code: ts, ctx: ctx }) })) : null] })) : null] }));
     }
     const codes = Object.keys(operation.responses);
     if (codes.length === 0)

package/dist/ui/components/input.js

@@ -2,9 +2,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { cn } from 'fumadocs-ui/components/api';
 import { cva } from 'class-variance-authority';
-export const labelVariants = cva('text-[13px] font-medium text-fd-card-foreground peer-disabled:cursor-not-allowed peer-disabled:opacity-70');
+export const labelVariants = cva('text-[13px] text-fd-card-foreground peer-disabled:cursor-not-allowed peer-disabled:opacity-70');
 const Input = React.forwardRef(({ className, type, ...props }, ref) => {
-    return (_jsx("input", { type: type, className: cn('flex h-9 w-full rounded-md border bg-transparent px-2 py-1.5 text-[13px] text-fd-foreground transition-colors placeholder:text-fd-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className), ref: ref, ...props }));
+    return (_jsx("input", { type: type, className: cn('flex h-9 w-full rounded-md border bg-fd-secondary px-2 py-1.5 text-[13px] text-fd-secondary-foreground transition-colors placeholder:text-fd-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className), ref: ref, ...props }));
 });
 Input.displayName = 'Input';
 export { Input };

package/dist/ui/components/select.js

@@ -6,7 +6,7 @@ import { cn } from 'fumadocs-ui/components/api';
 const Select = SelectPrimitive.Root;
 const SelectGroup = SelectPrimitive.Group;
 const SelectValue = SelectPrimitive.Value;
-const SelectTrigger = forwardRef(({ className, children, ...props }, ref) => (_jsxs(SelectPrimitive.Trigger, { ref: ref, className: cn('flex min-h-10 items-center w-full rounded-md border px-3 py-2 text-start text-[13px] text-fd-foreground hover:bg-fd-accent focus:outline-none focus:ring-2 focus:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDown, { className: "ms-auto size-4 text-fd-muted-foreground" }) })] })));
+const SelectTrigger = forwardRef(({ className, children, ...props }, ref) => (_jsxs(SelectPrimitive.Trigger, { ref: ref, className: cn('flex min-h-10 items-center w-full rounded-md border px-3 py-2 text-start text-[13px] text-fd-secondary-foreground bg-fd-secondary hover:bg-fd-accent focus:outline-none focus:ring focus:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDown, { className: "ms-auto size-4 text-fd-muted-foreground" }) })] })));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
 const SelectScrollUpButton = forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.ScrollUpButton, { ref: ref, className: cn('flex items-center justify-center py-1', className), ...props, children: _jsx(ChevronUp, { className: "size-4" }) })));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;

package/dist/ui/server-select.js

@@ -11,7 +11,7 @@ export default function ServerSelect({ server, onServerChanged, onVariablesChang
     const schema = server
         ? servers.find((item) => item.url === server.url)
         : null;
-    return (_jsxs("div", { ...props, className: cn('flex flex-col gap-4', props.className), children: [_jsxs(Select, { value: server?.url, onValueChange: onServerChanged, children: [_jsx(SelectTrigger, { className: "h-auto break-all", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: servers.map((item) => (_jsxs(SelectItem, { value: item.url, children: [item.url, _jsx("p", { className: "text-start text-fd-muted-foreground", children: item.description })] }, item.url))) })] }), Object.entries(schema?.variables ?? {}).map(([key, variable]) => {
+    return (_jsxs("div", { ...props, className: cn('flex flex-col gap-4', props.className), children: [_jsxs(Select, { value: server?.url, onValueChange: onServerChanged, children: [_jsx(SelectTrigger, { className: "break-all", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: servers.map((item) => (_jsxs(SelectItem, { value: item.url, children: [item.url, _jsx("p", { className: "text-start text-fd-muted-foreground", children: item.description })] }, item.url))) })] }), Object.entries(schema?.variables ?? {}).map(([key, variable]) => {
                 if (!server)
                     return;
                 const id = `fd_server_select_${key}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-openapi",
-  "version": "7.0.0",
+  "version": "7.0.2",
   "description": "Generate MDX docs for your OpenAPI spec",
   "keywords": [
     "NextJs",
@@ -47,7 +47,7 @@
     "@radix-ui/react-dialog": "^1.1.6",
     "@radix-ui/react-select": "^2.1.6",
     "@radix-ui/react-slot": "^1.1.2",
-    "@scalar/openapi-parser": "0.10.9",
+    "@scalar/openapi-parser": "0.10.10",
     "ajv-draft-04": "^1.0.0",
     "class-variance-authority": "^0.7.1",
     "fast-glob": "^3.3.3",
@@ -55,25 +55,25 @@
     "hast-util-to-jsx-runtime": "^2.3.6",
     "js-yaml": "^4.1.0",
     "lucide-react": "^0.479.0",
-    "next-themes": "^0.4.4",
+    "next-themes": "^0.4.6",
     "openapi-sampler": "^1.6.1",
     "react-hook-form": "^7.54.2",
     "remark": "^15.0.1",
     "remark-rehype": "^11.1.1",
-    "shiki": "^3.1.0",
+    "shiki": "^3.2.1",
     "xml-js": "^1.6.11",
-    "fumadocs-core": "15.0.16",
-    "fumadocs-ui": "15.0.16"
+    "fumadocs-core": "15.0.18",
+    "fumadocs-ui": "15.0.18"
   },
   "devDependencies": {
-    "@scalar/api-client-react": "^1.1.42",
+    "@scalar/api-client-react": "^1.2.1",
     "@types/js-yaml": "^4.0.9",
     "@types/node": "22.13.10",
     "@types/openapi-sampler": "^1.0.3",
     "@types/react": "^19.0.10",
-    "next": "15.2.1",
+    "next": "15.2.2",
     "openapi-types": "^12.1.3",
-    "tailwindcss": "^4.0.12",
+    "tailwindcss": "^4.0.14",
     "tsc-alias": "^1.8.11",
     "eslint-config-custom": "0.0.0",
     "tsconfig": "0.0.0"