fumadocs-openapi 4.4.2 → 5.0.1

package/dist/ui/client-client-CMzXLiVt.js

@@ -0,0 +1,93 @@
+'use client';
+import { useContext, createContext, useState, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { Check, Copy } from 'lucide-react';
+import { cn, useCopyButton, buttonVariants } from 'fumadocs-ui/components/api';
+import dynamic from 'next/dynamic';
+
+const ApiContext = /*#__PURE__*/ createContext({
+    baseUrl: undefined,
+    setBaseUrl: ()=>undefined,
+    highlighter: null
+});
+function useApiContext() {
+    return useContext(ApiContext);
+}
+async function initHighlighter() {
+    const { createHighlighterCore } = await import('shiki/core');
+    const getWasm = await import('shiki/wasm');
+    return createHighlighterCore({
+        themes: [
+            import('shiki/themes/github-light.mjs'),
+            import('shiki/themes/github-dark.mjs')
+        ],
+        langs: [
+            import('shiki/langs/json.mjs')
+        ],
+        loadWasm: getWasm
+    });
+}
+function ApiProvider({ defaultBaseUrl, children }) {
+    const [highlighter, setHighlighter] = useState(null);
+    const [baseUrl, setBaseUrl] = useState(defaultBaseUrl);
+    useEffect(()=>{
+        setBaseUrl((prev)=>localStorage.getItem('apiBaseUrl') ?? prev);
+        void initHighlighter().then((res)=>{
+            setHighlighter(res);
+        });
+    }, []);
+    useEffect(()=>{
+        if (baseUrl) localStorage.setItem('apiBaseUrl', baseUrl);
+    }, [
+        baseUrl
+    ]);
+    return /*#__PURE__*/ jsx(ApiContext.Provider, {
+        value: {
+            baseUrl,
+            setBaseUrl,
+            highlighter
+        },
+        children: children
+    });
+}
+
+const SchemaContext = /*#__PURE__*/ createContext(undefined);
+function useSchemaContext() {
+    const ctx = useContext(SchemaContext);
+    if (!ctx) throw new Error('Missing provider');
+    return ctx;
+}
+
+const APIPlayground = dynamic(()=>import('./playground-client-Cn3a3hra.js').then((mod)=>mod.APIPlayground));
+function Root({ children, baseUrl, className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn('flex flex-col gap-24 text-sm text-fd-muted-foreground', className),
+        ...props,
+        children: /*#__PURE__*/ jsx(ApiProvider, {
+            defaultBaseUrl: baseUrl,
+            children: children
+        })
+    });
+}
+function CopyRouteButton({ className, route, ...props }) {
+    const { baseUrl } = useApiContext();
+    const [checked, onCopy] = useCopyButton(()=>{
+        void navigator.clipboard.writeText(`${baseUrl ?? ''}${route}`);
+    });
+    return /*#__PURE__*/ jsx("button", {
+        type: "button",
+        className: cn(buttonVariants({
+            color: 'ghost',
+            className
+        })),
+        onClick: onCopy,
+        ...props,
+        children: checked ? /*#__PURE__*/ jsx(Check, {
+            className: "size-3"
+        }) : /*#__PURE__*/ jsx(Copy, {
+            className: "size-3"
+        })
+    });
+}
+
+export { APIPlayground as A, CopyRouteButton as C, Root as R, SchemaContext as S, useApiContext as a, useSchemaContext as u };

package/dist/ui/index.d.ts

@@ -1,8 +1,78 @@
 import * as react from 'react';
-import { ReactElement, HTMLAttributes, ReactNode, MutableRefObject } from 'react';
+import { ReactNode, ReactElement, MutableRefObject, HTMLAttributes } 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-vSsfCaVw.js';
-import { Tabs, Tab } from 'fumadocs-ui/components/tabs';
+
+interface BaseRequestField {
+    name: string;
+    description?: string;
+}
+interface BaseSchema {
+    description?: string;
+    isRequired: boolean;
+}
+type PrimitiveRequestField = BaseRequestField & PrimitiveSchema;
+interface PrimitiveSchema extends BaseSchema {
+    type: 'boolean' | 'string' | 'number';
+    defaultValue: string;
+}
+interface ReferenceSchema extends BaseSchema {
+    type: 'ref';
+    schema: string;
+}
+interface ArraySchema extends BaseSchema {
+    type: 'array';
+    /**
+     * Reference to item schema or the schema
+     */
+    items: string | RequestSchema;
+}
+interface FileSchema extends BaseSchema {
+    type: 'file';
+}
+interface ObjectSchema extends BaseSchema {
+    type: 'object';
+    properties: Record<string, ReferenceSchema>;
+    /**
+     * Reference to schema, or true if it's `any`
+     */
+    additionalProperties?: boolean | string;
+}
+interface SwitcherSchema extends BaseSchema {
+    type: 'switcher';
+    items: Record<string, ReferenceSchema | RequestSchema>;
+}
+interface NullSchema extends BaseSchema {
+    type: 'null';
+}
+type RequestSchema = PrimitiveSchema | ArraySchema | ObjectSchema | SwitcherSchema | NullSchema | FileSchema;
+interface APIPlaygroundProps {
+    route: string;
+    method: string;
+    bodyType: 'json' | 'form-data';
+    authorization?: PrimitiveRequestField;
+    path?: PrimitiveRequestField[];
+    query?: PrimitiveRequestField[];
+    header?: PrimitiveRequestField[];
+    body?: RequestSchema;
+    schemas: Record<string, RequestSchema>;
+}
+
+interface APIInfoProps {
+    method: string;
+    route: string;
+    children: ReactNode;
+}
+interface PropertyProps {
+    name: string;
+    type: string;
+    required?: boolean;
+    deprecated?: boolean;
+    children?: ReactNode;
+}
+interface RootProps {
+    baseUrl?: string;
+    children: ReactNode;
+}
 
 interface FormValues {
     authorization: string;
@@ -23,40 +93,6 @@ interface CustomField<TName extends FieldPath<FormValues>, Info> {
     }) => ReactElement;
 }
 
-interface RootProps extends HTMLAttributes<HTMLDivElement> {
-    baseUrl?: string;
-}
-declare function Root({ children, baseUrl, className, ...props }: RootProps): React.ReactElement;
-declare function API({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
-interface APIInfoProps extends HTMLAttributes<HTMLDivElement> {
-    route: string;
-    method?: string;
-    badgeClassName?: string;
-}
-declare function APIInfo({ children, className, route, badgeClassName, method, ...props }: APIInfoProps): React.ReactElement;
-interface PropertyProps {
-    name: string;
-    type: string;
-    required: boolean;
-    deprecated: boolean;
-    children: ReactNode;
-}
-declare function Property({ name, type, required, deprecated, children, }: PropertyProps): React.ReactElement;
-declare function APIExample({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
-declare function ResponseTypes(props: {
-    children: ReactNode;
-}): React.ReactElement;
-declare function ExampleResponse(props: {
-    children: ReactNode;
-}): React.ReactElement;
-declare function TypeScriptResponse(props: {
-    children: ReactNode;
-}): React.ReactElement;
-declare function ObjectCollapsible(props: {
-    name: string;
-    children: ReactNode;
-}): React.ReactElement;
-
 interface SchemaContextType {
     references: Record<string, RequestSchema>;
     dynamic: MutableRefObject<Map<string, DynamicField>>;
@@ -78,10 +114,18 @@ declare const APIPlayground: react.ComponentType<APIPlaygroundProps & {
         header?: CustomField<`header.${string}`, PrimitiveRequestField>;
         body?: CustomField<"body", RequestSchema>;
     };
-} & react.HTMLAttributes<HTMLFormElement>>;
-declare const Responses: typeof Tabs;
-declare const Response: typeof Tab;
-declare const Requests: typeof Tabs;
-declare const Request: typeof Tab;
+} & HTMLAttributes<HTMLFormElement>>;
+declare function Root({ children, baseUrl, className, ...props }: RootProps & HTMLAttributes<HTMLDivElement>): React.ReactElement;
+
+declare function APIInfo({ children, className, route, badgeClassname, method, ...props }: APIInfoProps & HTMLAttributes<HTMLDivElement> & {
+    badgeClassname?: string;
+}): React.ReactElement;
+declare function API({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
+declare function Property({ name, type, required, deprecated, children, }: PropertyProps): React.ReactElement;
+declare function APIExample({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
+declare function ObjectCollapsible(props: {
+    name: string;
+    children: ReactNode;
+}): React.ReactElement;
 
-export { API, APIExample, APIInfo, type APIInfoProps, APIPlayground, ExampleResponse, ObjectCollapsible, Property, Request, Requests, Response, ResponseTypes, Responses, Root, type RootProps, TypeScriptResponse, useSchemaContext };
+export { API, APIExample, APIInfo, APIPlayground, ObjectCollapsible, Property, Root, useSchemaContext };

package/dist/ui/index.js

@@ -1,201 +1,142 @@
-"use client";
-import {
-  ApiProvider,
-  useApiContext,
-  useSchemaContext
-} from "../chunk-N4P4W4VJ.js";
-import {
-  badgeVariants,
-  getBadgeColor
-} from "../chunk-UG2WFM5D.js";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { cn } from 'fumadocs-ui/components/api';
+import { Fragment } from 'react';
+import { Accordions, Accordion } from 'fumadocs-ui/components/accordion';
+import { cva } from 'class-variance-authority';
+import { C as CopyRouteButton } from './client-client-CMzXLiVt.js';
+export { A as APIPlayground, R as Root, u as useSchemaContext } from './client-client-CMzXLiVt.js';
 
-// src/ui/index.ts
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-import dynamic from "next/dynamic";
-
-// src/ui/components.tsx
-import {
-  Fragment
-} from "react";
-import { Check, Copy } from "lucide-react";
-import { Accordion, Accordions } from "fumadocs-ui/components/accordion";
-import { cn, useCopyButton, buttonVariants } from "fumadocs-ui/components/api";
-import { jsx, jsxs } from "react/jsx-runtime";
-function Root({
-  children,
-  baseUrl,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn(
-        "flex flex-col gap-24 text-sm text-fd-muted-foreground",
-        className
-      ),
-      ...props,
-      children: /* @__PURE__ */ jsx(ApiProvider, { defaultBaseUrl: baseUrl, children })
+const badgeVariants = cva('rounded border px-1.5 py-1 text-xs font-medium leading-[12px]', {
+    variants: {
+        color: {
+            green: 'border-green-400/50 bg-green-400/20 text-green-600 dark:text-green-400',
+            yellow: 'border-yellow-400/50 bg-yellow-400/20 text-yellow-600 dark:text-yellow-400',
+            red: 'border-red-400/50 bg-red-400/20 text-red-600 dark:text-red-400',
+            blue: 'border-blue-400/50 bg-blue-400/20 text-blue-600 dark:text-blue-400',
+            orange: 'border-orange-400/50 bg-orange-400/20 text-orange-600 dark:text-orange-400'
+        }
     }
-  );
-}
-function API({
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn(
-        "flex flex-col gap-x-6 gap-y-2 xl:flex-row xl:items-start",
-        className
-      ),
-      ...props,
-      children
+});
+function getBadgeColor(method) {
+    switch(method){
+        case 'PUT':
+            return 'yellow';
+        case 'PATCH':
+            return 'orange';
+        case 'POST':
+            return 'blue';
+        case 'DELETE':
+            return 'red';
+        default:
+            return 'green';
     }
-  );
 }
+
 function Route({ route }) {
-  const segments = route.split("/").filter((part) => part.length > 0);
-  return /* @__PURE__ */ jsx("div", { className: "flex flex-row flex-wrap items-center gap-1 text-sm", children: segments.map((part, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("span", { className: "text-fd-muted-foreground", children: "/" }),
-    part.startsWith("{") && part.endsWith("}") ? /* @__PURE__ */ jsx("code", { className: "text-fd-primary", children: part }) : /* @__PURE__ */ jsx("span", { className: "text-fd-foreground", children: part })
-  ] }, index)) });
+    const segments = route.split('/').filter((part)=>part.length > 0);
+    return /*#__PURE__*/ jsx("div", {
+        className: "flex flex-row flex-wrap items-center gap-1 text-sm",
+        children: segments.map((part, index)=>/*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        className: "text-fd-muted-foreground",
+                        children: "/"
+                    }),
+                    part.startsWith('{') && part.endsWith('}') ? /*#__PURE__*/ jsx("code", {
+                        className: "text-fd-primary",
+                        children: part
+                    }) : /*#__PURE__*/ jsx("span", {
+                        className: "text-fd-foreground",
+                        children: part
+                    })
+                ]
+            }, index))
+    });
 }
-function APIInfo({
-  children,
-  className,
-  route,
-  badgeClassName,
-  method = "GET",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("min-w-0 flex-1", className), ...props, children: [
-    /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "sticky top-24 z-[2] mb-4 flex flex-row items-center gap-2 rounded-lg border bg-fd-card p-3 md:top-10"
-        ),
+function APIInfo({ children, className, route, badgeClassname, method = 'GET', ...props }) {
+    return /*#__PURE__*/ jsxs("div", {
+        className: cn('min-w-0 flex-1', className),
+        ...props,
         children: [
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: cn(
-                badgeVariants({ color: getBadgeColor(method) }),
-                badgeClassName
-              ),
-              children: method
-            }
-          ),
-          /* @__PURE__ */ jsx(Route, { route }),
-          /* @__PURE__ */ jsx(CopyRouteButton, { className: "ms-auto size-6 p-1", route })
+            /*#__PURE__*/ jsxs("div", {
+                className: cn('sticky top-24 z-[2] mb-4 flex flex-row items-center gap-2 rounded-lg border bg-fd-card p-3 md:top-10'),
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        className: cn(badgeVariants({
+                            color: getBadgeColor(method)
+                        }), badgeClassname),
+                        children: method
+                    }),
+                    /*#__PURE__*/ jsx(Route, {
+                        route: route
+                    }),
+                    /*#__PURE__*/ jsx(CopyRouteButton, {
+                        className: "ms-auto size-6 p-1",
+                        route: route
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "prose-no-margin",
+                children: children
+            })
         ]
-      }
-    ),
-    /* @__PURE__ */ jsx("div", { className: "prose-no-margin", children })
-  ] });
+    });
 }
-function Property({
-  name,
-  type,
-  required,
-  deprecated,
-  children
-}) {
-  return /* @__PURE__ */ jsxs("div", { className: "mb-4 flex flex-col rounded-lg border bg-fd-card p-3 prose-no-margin", children: [
-    /* @__PURE__ */ jsxs("h4", { className: "inline-flex items-center gap-4", children: [
-      /* @__PURE__ */ jsx("code", { children: name }),
-      required ? /* @__PURE__ */ jsx("div", { className: cn(badgeVariants({ color: "red" })), children: "Required" }) : null,
-      deprecated ? /* @__PURE__ */ jsx("div", { className: cn(badgeVariants({ color: "yellow" })), children: "Deprecated" }) : null,
-      /* @__PURE__ */ jsx("span", { className: "ms-auto font-mono text-[13px] text-fd-muted-foreground", children: type })
-    ] }),
-    children
-  ] });
+function API({ className, children, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn('flex flex-col gap-x-6 gap-y-2 xl:flex-row xl:items-start', className),
+        ...props,
+        children: children
+    });
 }
-function APIExample({
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn("sticky top-10 prose-no-margin xl:w-[400px]", className),
-      ...props,
-      children
-    }
-  );
-}
-function ResponseTypes(props) {
-  return /* @__PURE__ */ jsx(
-    Accordions,
-    {
-      type: "single",
-      className: "!-m-4 border-none pt-2",
-      defaultValue: "Response",
-      children: props.children
-    }
-  );
-}
-function ExampleResponse(props) {
-  return /* @__PURE__ */ jsx(Accordion, { title: "Response", children: props.children });
+function Property({ name, type, required, deprecated, children }) {
+    return /*#__PURE__*/ jsxs("div", {
+        className: "mb-4 flex flex-col rounded-lg border bg-fd-card p-3 prose-no-margin",
+        children: [
+            /*#__PURE__*/ jsxs("h4", {
+                className: "inline-flex items-center gap-4",
+                children: [
+                    /*#__PURE__*/ jsx("code", {
+                        children: name
+                    }),
+                    required ? /*#__PURE__*/ jsx("div", {
+                        className: cn(badgeVariants({
+                            color: 'red'
+                        })),
+                        children: "Required"
+                    }) : null,
+                    deprecated ? /*#__PURE__*/ jsx("div", {
+                        className: cn(badgeVariants({
+                            color: 'yellow'
+                        })),
+                        children: "Deprecated"
+                    }) : null,
+                    /*#__PURE__*/ jsx("span", {
+                        className: "ms-auto font-mono text-[13px] text-fd-muted-foreground",
+                        children: type
+                    })
+                ]
+            }),
+            children
+        ]
+    });
 }
-function TypeScriptResponse(props) {
-  return /* @__PURE__ */ jsx(Accordion, { title: "Typescript", children: props.children });
+function APIExample({ children, className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn('sticky top-10 prose-no-margin xl:w-[400px]', className),
+        ...props,
+        children: children
+    });
 }
 function ObjectCollapsible(props) {
-  return /* @__PURE__ */ jsx(Accordions, { type: "single", children: /* @__PURE__ */ jsx(Accordion, { title: props.name, children: props.children }) });
-}
-function CopyRouteButton({
-  className,
-  route,
-  ...props
-}) {
-  const { baseUrl } = useApiContext();
-  const [checked, onCopy] = useCopyButton(() => {
-    void navigator.clipboard.writeText(`${baseUrl ?? ""}${route}`);
-  });
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      className: cn(
-        buttonVariants({
-          color: "ghost",
-          className
+    return /*#__PURE__*/ jsx(Accordions, {
+        type: "single",
+        children: /*#__PURE__*/ jsx(Accordion, {
+            title: props.name,
+            children: props.children
         })
-      ),
-      onClick: onCopy,
-      ...props,
-      children: checked ? /* @__PURE__ */ jsx(Check, { className: "size-3" }) : /* @__PURE__ */ jsx(Copy, { className: "size-3" })
-    }
-  );
+    });
 }
 
-// src/ui/index.ts
-var APIPlayground = dynamic(
-  () => import("../playground-GIGTWHCL.js").then((mod) => mod.APIPlayground)
-);
-var Responses = Tabs;
-var Response = Tab;
-var Requests = Tabs;
-var Request = Tab;
-export {
-  API,
-  APIExample,
-  APIInfo,
-  APIPlayground,
-  ExampleResponse,
-  ObjectCollapsible,
-  Property,
-  Request,
-  Requests,
-  Response,
-  ResponseTypes,
-  Responses,
-  Root,
-  TypeScriptResponse,
-  useSchemaContext
-};
+export { API, APIExample, APIInfo, ObjectCollapsible, Property };