fumadocs-openapi 3.2.0 → 4.0.0

package/dist/ui/index.d.ts

@@ -0,0 +1,46 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+import { A as APIPlaygroundProps } from '../playground-D8pYn13F.js';
+import { Tabs, Tab } from 'fumadocs-ui/components/tabs';
+
+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;
+
+declare const APIPlayground: react.ComponentType<APIPlaygroundProps & react.HTMLAttributes<HTMLFormElement>>;
+declare const Responses: typeof Tabs;
+declare const Response: typeof Tab;
+declare const Requests: typeof Tabs;
+declare const Request: typeof Tab;
+
+export { API, APIExample, APIInfo, type APIInfoProps, APIPlayground, ExampleResponse, ObjectCollapsible, Property, Request, Requests, Response, ResponseTypes, Responses, Root, type RootProps, TypeScriptResponse };

package/dist/ui/index.js

@@ -0,0 +1,197 @@
+"use client";
+import {
+  ApiProvider,
+  badgeVariants,
+  getBadgeColor,
+  useApiContext
+} from "../chunk-RSFOKBAM.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-muted-foreground",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(ApiProvider, { defaultBaseUrl: baseUrl, 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
+    }
+  );
+}
+function Route({ route }) {
+  const segments = route.split("/").filter((part) => part.length > 0);
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-row items-center gap-1 text-sm", children: segments.map((part, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "/" }),
+    /* @__PURE__ */ jsx("span", { className: "text-foreground", children: part })
+  ] }, index)) });
+}
+function APIInfo({
+  children,
+  className,
+  route,
+  badgeClassName,
+  method = "GET",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("min-w-0 flex-1 prose-no-margin", className), ...props, children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "sticky top-24 z-10 flex flex-row items-center gap-2 rounded-lg border bg-card p-3 md:top-10"
+        ),
+        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 })
+        ]
+      }
+    ),
+    children
+  ] });
+}
+function Property({
+  name,
+  type,
+  required,
+  deprecated,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "mb-4 flex flex-col rounded-lg border bg-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-muted-foreground", children: type })
+    ] }),
+    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 TypeScriptResponse(props) {
+  return /* @__PURE__ */ jsx(Accordion, { title: "Typescript", children: props.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
+        })
+      ),
+      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-XE3Y6DRJ.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
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-openapi",
-  "version": "3.2.0",
+  "version": "4.0.0",
   "description": "Generate MDX docs for your OpenAPI spec",
   "keywords": [
     "NextJs",
@@ -11,26 +11,61 @@
   "license": "MIT",
   "author": "Fuma Nama",
   "type": "module",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./ui": {
+      "import": "./dist/ui/index.js",
+      "types": "./dist/ui/index.d.ts"
+    }
+  },
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      ".": [
+        "./dist/index.d.ts"
+      ],
+      "ui": [
+        "./dist/ui/index.d.ts"
+      ]
+    }
+  },
   "files": [
     "dist"
   ],
   "dependencies": {
     "@apidevtools/json-schema-ref-parser": "^11.6.4",
+    "@radix-ui/react-select": "^2.1.1",
+    "@radix-ui/react-slot": "^1.1.0",
+    "class-variance-authority": "^0.7.0",
     "fast-glob": "^3.3.1",
     "js-yaml": "^4.1.0",
-    "json-schema-to-typescript": "^14.0.5",
-    "openapi-sampler": "^1.5.1"
+    "json-schema-to-typescript": "^14.1.0",
+    "lucide-react": "^0.408.0",
+    "openapi-sampler": "^1.5.1",
+    "react-hook-form": "^7.52.1",
+    "shiki": "^1.10.3",
+    "swr": "^2.2.5",
+    "fumadocs-ui": "12.5.0"
   },
   "devDependencies": {
     "@types/js-yaml": "^4.0.9",
-    "@types/node": "18.17.5",
+    "@types/node": "20.14.10",
     "@types/openapi-sampler": "^1.0.3",
+    "@types/react": "^18.3.3",
+    "next": "^14.2.5",
     "openapi-types": "^12.1.3",
     "eslint-config-custom": "0.0.0",
     "tsconfig": "0.0.0"
   },
+  "peerDependencies": {
+    "next": ">= 14.1.0",
+    "react": ">= 18",
+    "react-dom": ">= 18"
+  },
   "publishConfig": {
     "access": "public"
   },