fumadocs-openapi 4.1.0 → 4.2.0

package/dist/{chunk-BYW6XCQ2.js → chunk-55ZG37EE.js}

@@ -43,6 +43,7 @@ function getDefaultValue(item, references) {
       resolve(Object.values(item.items)[0], references),
       references
     );
+  if (item.type === "file") return void 0;
   return String(item.defaultValue);
 }
 function getDefaultValues(field, context) {

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { OpenAPIV3 } from 'openapi-types';
-import { A as APIPlaygroundProps } from './playground-D8pYn13F.js';
-export { P as PrimitiveRequestField, a as ReferenceSchema, R as RequestSchema } from './playground-D8pYn13F.js';
+import { A as APIPlaygroundProps } from './playground-vSsfCaVw.js';
+export { P as PrimitiveRequestField, a as ReferenceSchema, R as RequestSchema } from './playground-vSsfCaVw.js';
 
 interface ResponsesProps {
     items: string[];

package/dist/index.js

@@ -140,9 +140,12 @@ function noRef(v) {
   return v;
 }
 function getPreferredMedia(body) {
-  if (Object.keys(body).length === 0) return void 0;
-  if ("application/json" in body) return body["application/json"];
-  return Object.values(body)[0];
+  const type = getPreferredType(body);
+  if (type) return body[type];
+}
+function getPreferredType(body) {
+  if ("application/json" in body) return "application/json";
+  return Object.keys(body)[0];
 }
 function toSampleInput(value) {
   return typeof value === "string" ? value : JSON.stringify(value, null, 2);
@@ -296,22 +299,25 @@ function getScheme(requirement, document) {
 // src/render/playground.ts
 function renderPlayground(path, method, ctx) {
   let currentId = 0;
+  const bodyContent = noRef(method.requestBody)?.content;
+  const mediaType = bodyContent ? getPreferredType(bodyContent) : void 0;
   const context = {
+    allowFile: mediaType === "multipart/form-data",
     schema: {},
     nextId() {
       return String(currentId++);
     },
     registered: /* @__PURE__ */ new WeakMap()
   };
-  const body = method.requestBody ? getPreferredMedia(noRef(method.requestBody).content) : void 0;
   return ctx.renderer.APIPlayground({
     authorization: getAuthorizationField(method, ctx),
     method: method.method,
     route: path,
+    bodyType: mediaType === "multipart/form-data" ? "form-data" : "json",
     path: method.parameters.filter((v) => v.in === "path").map((v) => parameterToField(v, context)),
     query: method.parameters.filter((v) => v.in === "query").map((v) => parameterToField(v, context)),
     header: method.parameters.filter((v) => v.in === "header").map((v) => parameterToField(v, context)),
-    body: body?.schema ? toSchema(noRef(body.schema), true, context) : void 0,
+    body: bodyContent && mediaType && bodyContent[mediaType].schema ? toSchema(noRef(bodyContent[mediaType].schema), true, context) : void 0,
     schemas: context.schema
   });
 }
@@ -424,6 +430,13 @@ function toSchema(schema, required, ctx) {
       isRequired: false
     };
   }
+  if (ctx.allowFile && schema.type === "string" && schema.format === "binary") {
+    return {
+      type: "file",
+      isRequired: required,
+      description: schema.description ?? schema.title
+    };
+  }
   return {
     type: schema.type === "integer" ? "number" : schema.type,
     defaultValue: schema.example ?? "",
@@ -550,7 +563,7 @@ function render(name, schema, ctx) {
   return renderer.Property(
     {
       name,
-      type: getSchemaType(schema),
+      type: getSchemaType(schema, ctx),
       required: ctx.required,
       deprecated: schema.deprecated
     },
@@ -583,22 +596,24 @@ function isComplexType(schema) {
   if (schema.anyOf ?? schema.oneOf ?? schema.allOf) return true;
   return isObject(schema) || schema.type === "array";
 }
-function getSchemaType(schema) {
+function getSchemaType(schema, ctx) {
   if (schema.nullable) {
-    const type = getSchemaType({ ...schema, nullable: false });
+    const type = getSchemaType({ ...schema, nullable: false }, ctx);
     return type === "unknown" ? "null" : `${type} | null`;
   }
   if (schema.title) return schema.title;
   if (schema.type === "array")
-    return `array<${getSchemaType(noRef(schema.items))}>`;
+    return `array<${getSchemaType(noRef(schema.items), ctx)}>`;
   if (schema.oneOf)
-    return schema.oneOf.map((one) => getSchemaType(noRef(one))).join(" | ");
+    return schema.oneOf.map((one) => getSchemaType(noRef(one), ctx)).join(" | ");
   if (schema.allOf)
-    return schema.allOf.map((one) => getSchemaType(noRef(one))).join(" & ");
-  if (schema.not) return `not ${getSchemaType(noRef(schema.not))}`;
+    return schema.allOf.map((one) => getSchemaType(noRef(one), ctx)).join(" & ");
+  if (schema.not) return `not ${getSchemaType(noRef(schema.not), ctx)}`;
   if (schema.anyOf) {
-    return `Any properties in ${schema.anyOf.map((one) => getSchemaType(noRef(one))).join(", ")}`;
+    return `Any properties in ${schema.anyOf.map((one) => getSchemaType(noRef(one), ctx)).join(", ")}`;
   }
+  if (schema.type === "string" && schema.format === "binary" && ctx.allowFile)
+    return "File";
   if (schema.type) return schema.type;
   if (isObject(schema)) return "object";
   return "unknown";
@@ -627,17 +642,19 @@ async function renderOperation(path, method, ctx, noTitle = false) {
     info.push(getAuthSection(security, ctx));
   }
   if (body) {
-    const bodySchema = getPreferredMedia(body.content)?.schema;
-    if (!bodySchema) throw new Error();
+    const type = getPreferredType(body.content);
+    if (!type)
+      throw new Error(`No supported media type for body content: ${path}`);
     info.push(
       heading(level, `Request Body ${!body.required ? "(Optional)" : ""}`),
       p(body.description),
-      schemaElement("body", noRef(bodySchema), {
+      schemaElement("body", noRef(body.content[type].schema ?? {}), {
         parseObject: true,
         readOnly: method.method === "GET",
         writeOnly: method.method !== "GET",
         required: body.required ?? false,
-        render: ctx
+        render: ctx,
+        allowFile: type === "multipart/form-data"
       })
     );
   }
@@ -660,7 +677,8 @@ async function renderOperation(path, method, ctx, noTitle = false) {
         readOnly: method.method === "GET",
         writeOnly: method.method !== "GET",
         required: param.required ?? false,
-        render: ctx
+        render: ctx,
+        allowFile: false
       }
     );
     const groupName = {

package/dist/{playground-EVJUDTB3.js → playground-TN274MLB.js}

@@ -5,7 +5,7 @@ import {
   resolve,
   useApiContext,
   useSchemaContext
-} from "./chunk-BYW6XCQ2.js";
+} from "./chunk-55ZG37EE.js";
 
 // src/ui/playground.tsx
 import {
@@ -108,8 +108,30 @@ FormDescription.displayName = "FormDescription";
 
 // src/ui/fetcher.ts
 import { CircleCheckIcon, CircleXIcon } from "lucide-react";
-function createBodyFromValue(value, schema, references, dynamic) {
-  return convertValue("body", value, schema, references, dynamic);
+function createBodyFromValue(type, value, schema, references, dynamic) {
+  const result = convertValue("body", value, schema, references, dynamic);
+  if (type === "json") {
+    return JSON.stringify(result);
+  }
+  const formData = new FormData();
+  if (typeof result !== "object" || !result) {
+    throw new Error(
+      `Unsupported body type: ${typeof result}, expected: object`
+    );
+  }
+  for (const key of Object.keys(result)) {
+    const prop = result[key];
+    if (typeof prop === "object" && prop instanceof File) {
+      formData.set(key, prop);
+    }
+    if (Array.isArray(prop) && prop.every((item) => item instanceof File)) {
+      for (const item of prop) {
+        formData.append(key, item);
+      }
+    }
+    formData.set(key, JSON.stringify(prop));
+  }
+  return formData;
 }
 function convertValue(fieldName, value, schema, references, dynamic) {
   const isEmpty = value === "" || value === void 0 || value === null;
@@ -162,6 +184,8 @@ function convertValue(fieldName, value, schema, references, dynamic) {
       return Number(value);
     case "boolean":
       return value === "null" ? void 0 : value === "true";
+    case "file":
+      return value;
     default:
       return String(value);
   }
@@ -679,6 +703,30 @@ function NormalInput({
   ...props
 }) {
   const { control } = useFormContext2();
+  if (field.type === "file") {
+    return /* @__PURE__ */ jsx4(
+      FormField,
+      {
+        control,
+        name: fieldName,
+        render: ({ field: { value: _value, onChange, ...restField } }) => /* @__PURE__ */ jsxs2(FormItem, { ...props, children: [
+          header,
+          /* @__PURE__ */ jsx4(FormControl, { children: /* @__PURE__ */ jsx4(
+            "input",
+            {
+              type: "file",
+              multiple: false,
+              onChange: (e) => {
+                if (!e.target.files) return;
+                onChange(e.target.files.item(0));
+              },
+              ...restField
+            }
+          ) })
+        ] })
+      }
+    );
+  }
   if (field.type === "boolean") {
     return /* @__PURE__ */ jsx4(
       FormField,
@@ -814,6 +862,7 @@ import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 function APIPlayground({
   route,
   method = "GET",
+  bodyType,
   authorization,
   path = [],
   header = [],
@@ -835,7 +884,7 @@ function APIPlayground({
     }
   });
   const testQuery = useSWRImmutable(
-    input ? [baseUrl, route, method, input] : null,
+    input ? [baseUrl, route, method, input, bodyType] : null,
     async () => {
       if (!input) return;
       let pathname = route;
@@ -844,7 +893,7 @@ function APIPlayground({
         if (typeof paramValue === "string")
           pathname = pathname.replace(`{${key}}`, paramValue);
       });
-      const url = new URL(pathname, baseUrl ?? window.location.origin);
+      const url = new URL(`${baseUrl ?? window.location.origin}${pathname}`);
       Object.keys(input.query).forEach((key) => {
         const paramValue = input.query[key];
         if (typeof paramValue === "string")
@@ -860,11 +909,17 @@ function APIPlayground({
         const paramValue = input.header[key];
         if (typeof paramValue === "string") headers.append(key, paramValue);
       });
-      const bodyValue = body && input.body && Object.keys(input.body).length > 0 ? createBodyFromValue(input.body, body, schemas, dynamicRef.current) : void 0;
+      const bodyValue = body && input.body && Object.keys(input.body).length > 0 ? createBodyFromValue(
+        bodyType,
+        input.body,
+        body,
+        schemas,
+        dynamicRef.current
+      ) : void 0;
       const response = await fetch(url, {
         method,
         headers,
-        body: bodyValue ? JSON.stringify(bodyValue) : void 0
+        body: bodyValue
       });
       const data = await response.json().catch(() => void 0);
       return { status: response.status, data };

package/dist/{playground-D8pYn13F.d.ts → playground-vSsfCaVw.d.ts}

@@ -22,6 +22,9 @@ interface ArraySchema extends BaseSchema {
      */
     items: string | RequestSchema;
 }
+interface FileSchema extends BaseSchema {
+    type: 'file';
+}
 interface ObjectSchema extends BaseSchema {
     type: 'object';
     properties: Record<string, ReferenceSchema>;
@@ -37,10 +40,11 @@ interface SwitcherSchema extends BaseSchema {
 interface NullSchema extends BaseSchema {
     type: 'null';
 }
-type RequestSchema = PrimitiveSchema | ArraySchema | ObjectSchema | SwitcherSchema | NullSchema;
+type RequestSchema = PrimitiveSchema | ArraySchema | ObjectSchema | SwitcherSchema | NullSchema | FileSchema;
 interface APIPlaygroundProps {
     route: string;
     method: string;
+    bodyType: 'json' | 'form-data';
     authorization?: PrimitiveRequestField;
     path?: PrimitiveRequestField[];
     query?: PrimitiveRequestField[];

package/dist/ui/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ReactElement, HTMLAttributes, ReactNode, MutableRefObject } from 'react';
 import { FieldPath, ControllerRenderProps, ControllerFieldState, UseFormStateReturn } from 'react-hook-form';
-import { R as RequestSchema, a as ReferenceSchema, A as APIPlaygroundProps, P as PrimitiveRequestField } from '../playground-D8pYn13F.js';
+import { R as RequestSchema, a as ReferenceSchema, A as APIPlaygroundProps, P as PrimitiveRequestField } from '../playground-vSsfCaVw.js';
 import { Tabs, Tab } from 'fumadocs-ui/components/tabs';
 
 interface FormValues {

package/dist/ui/index.js

@@ -5,7 +5,7 @@ import {
   getBadgeColor,
   useApiContext,
   useSchemaContext
-} from "../chunk-BYW6XCQ2.js";
+} from "../chunk-55ZG37EE.js";
 
 // src/ui/index.ts
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
@@ -174,7 +174,7 @@ function CopyRouteButton({
 
 // src/ui/index.ts
 var APIPlayground = dynamic(
-  () => import("../playground-EVJUDTB3.js").then((mod) => mod.APIPlayground)
+  () => import("../playground-TN274MLB.js").then((mod) => mod.APIPlayground)
 );
 var Responses = Tabs;
 var Response = Tab;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-openapi",
-  "version": "4.1.0",
+  "version": "4.2.0",
   "description": "Generate MDX docs for your OpenAPI spec",
   "keywords": [
     "NextJs",
@@ -49,8 +49,8 @@
     "react-hook-form": "^7.52.1",
     "shiki": "^1.11.1",
     "swr": "^2.2.5",
-    "fumadocs-core": "13.0.0",
-    "fumadocs-ui": "13.0.0"
+    "fumadocs-core": "13.0.1",
+    "fumadocs-ui": "13.0.1"
   },
   "devDependencies": {
     "@types/js-yaml": "^4.0.9",