docusaurus-theme-openapi-docs 4.7.0 → 5.0.0

package/lib/theme/OperationTabs/index.js

@@ -214,21 +214,20 @@ function TabContent({ lazy, children, selectedValue }) {
   return react_1.default.createElement(
     "div",
     { className: "margin-top--md" },
-    childTabs.map((tabItem, i) =>
-      (0, react_1.cloneElement)(tabItem, {
-        key: i,
-        hidden: tabItem.props.value !== selectedValue,
-      })
-    )
+    childTabs
   );
 }
 function TabsComponent(props) {
-  const tabs = (0, internal_1.useTabs)(props);
+  const tabs = (0, internal_1.useTabsContextValue)(props);
   return react_1.default.createElement(
-    "div",
-    { className: "tabs-container" },
-    react_1.default.createElement(TabList, { ...props, ...tabs }),
-    react_1.default.createElement(TabContent, { ...props, ...tabs })
+    internal_1.TabsProvider,
+    { value: tabs },
+    react_1.default.createElement(
+      "div",
+      { className: "tabs-container" },
+      react_1.default.createElement(TabList, { ...props, ...tabs }),
+      react_1.default.createElement(TabContent, { ...props, ...tabs })
+    )
   );
 }
 function OperationTabs(props) {

package/lib/theme/ParamsDetails/index.js

@@ -12,12 +12,12 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
-const Translate_1 = require("@docusaurus/Translate");
-const translationIds_1 = require("@theme/translationIds");
 const BrowserOnly_1 = __importDefault(require("@docusaurus/BrowserOnly"));
+const Translate_1 = require("@docusaurus/Translate");
 const Details_1 = __importDefault(require("@theme/Details"));
 const ParamsItem_1 = __importDefault(require("@theme/ParamsItem"));
 const SkeletonLoader_1 = __importDefault(require("@theme/SkeletonLoader"));
+const translationIds_1 = require("@theme/translationIds");
 const ParamsDetailsComponent = ({ parameters }) => {
   const types = ["path", "query", "header", "cookie"];
   return react_1.default.createElement(

package/lib/theme/ParamsItem/index.js

@@ -88,11 +88,37 @@ function ParamsItem({ param, ...rest }) {
       })
     )
   );
+  const constValue = schema?.const;
   const renderQualifier = (0, utils_1.guard)(
     (0, schema_1.getQualifierMessage)(schema),
     (qualifier) =>
       react_1.default.createElement(Markdown_1.default, null, qualifier)
   );
+  function renderConstValue() {
+    if (constValue === undefined) {
+      return undefined;
+    }
+    const label = (0, Translate_1.translate)({
+      id: translationIds_1.OPENAPI_SCHEMA_ITEM.CONSTANT_VALUE,
+      message: "Constant value:",
+    });
+    return react_1.default.createElement(
+      "div",
+      null,
+      react_1.default.createElement("strong", null, label, " "),
+      react_1.default.createElement(
+        "span",
+        null,
+        react_1.default.createElement(
+          "code",
+          null,
+          typeof constValue === "string"
+            ? constValue
+            : JSON.stringify(constValue)
+        )
+      )
+    );
+  }
   const renderDescription = (0, utils_1.guard)(description, (description) =>
     react_1.default.createElement(Markdown_1.default, null, description)
   );
@@ -177,6 +203,7 @@ function ParamsItem({ param, ...rest }) {
       renderDeprecated
     ),
     renderQualifier,
+    renderConstValue(),
     renderDescription,
     renderEnumDescriptions,
     renderDefaultValue(),

package/lib/theme/RequestSchema/index.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { MediaTypeObject } from "docusaurus-plugin-openapi-docs/lib/openapi/types";
+import type { MediaTypeObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
 interface Props {
     style?: React.CSSProperties;
     title: string;

package/lib/theme/RequestSchema/index.js

@@ -12,15 +12,17 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
-const Translate_1 = require("@docusaurus/Translate");
-const translationIds_1 = require("@theme/translationIds");
 const BrowserOnly_1 = __importDefault(require("@docusaurus/BrowserOnly"));
+const Translate_1 = require("@docusaurus/Translate");
 const Details_1 = __importDefault(require("@theme/Details"));
 const Markdown_1 = __importDefault(require("@theme/Markdown"));
 const MimeTabs_1 = __importDefault(require("@theme/MimeTabs")); // Assume these components exist
+const ResponseExamples_1 = require("@theme/ResponseExamples");
 const Schema_1 = __importDefault(require("@theme/Schema"));
+const SchemaTabs_1 = __importDefault(require("@theme/SchemaTabs"));
 const SkeletonLoader_1 = __importDefault(require("@theme/SkeletonLoader"));
 const TabItem_1 = __importDefault(require("@theme/TabItem"));
+const translationIds_1 = require("@theme/translationIds");
 const RequestSchemaComponent = ({ title, body, style }) => {
   if (
     body === undefined ||
@@ -36,7 +38,10 @@ const RequestSchemaComponent = ({ title, body, style }) => {
       MimeTabs_1.default,
       { className: "openapi-tabs__mime", schemaType: "request", lazy: true },
       mimeTypes.map((mimeType) => {
-        const firstBody = body.content[mimeType].schema;
+        const mediaTypeObject = body.content[mimeType];
+        const firstBody = mediaTypeObject?.schema;
+        const requestExamples = mediaTypeObject?.examples;
+        const requestExample = mediaTypeObject?.example;
         if (
           firstBody === undefined ||
           (firstBody.properties &&
@@ -50,68 +55,96 @@ const RequestSchemaComponent = ({ title, body, style }) => {
             TabItem_1.default,
             { key: mimeType, label: mimeType, value: mimeType },
             react_1.default.createElement(
-              "div",
-              { style: { marginTop: "1rem" } },
+              SchemaTabs_1.default,
+              { className: "openapi-tabs__schema" },
               react_1.default.createElement(
-                Details_1.default,
-                {
-                  className: "openapi-markdown__details mime",
-                  "data-collapsed": false,
-                  open: true,
-                  style: style,
-                  summary: react_1.default.createElement(
-                    react_1.default.Fragment,
-                    null,
-                    react_1.default.createElement(
-                      "summary",
-                      null,
-                      react_1.default.createElement(
-                        "h3",
-                        {
-                          className:
-                            "openapi-markdown__details-summary-header-body",
-                        },
-                        (0, Translate_1.translate)({
-                          id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
-                          message: title,
-                        }),
-                        body.required === true &&
+                TabItem_1.default,
+                { key: title, label: title, value: title },
+                react_1.default.createElement(
+                  "div",
+                  { style: { marginTop: "1rem" } },
+                  react_1.default.createElement(
+                    Details_1.default,
+                    {
+                      className: "openapi-markdown__details mime",
+                      "data-collapsed": false,
+                      open: true,
+                      style: style,
+                      summary: react_1.default.createElement(
+                        react_1.default.Fragment,
+                        null,
+                        react_1.default.createElement(
+                          "summary",
+                          null,
                           react_1.default.createElement(
-                            "span",
-                            { className: "openapi-schema__required" },
+                            "h3",
+                            {
+                              className:
+                                "openapi-markdown__details-summary-header-body",
+                            },
                             (0, Translate_1.translate)({
-                              id: translationIds_1.OPENAPI_SCHEMA_ITEM.REQUIRED,
-                              message: "required",
-                            })
+                              id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
+                              message: title,
+                            }),
+                            body.required === true &&
+                              react_1.default.createElement(
+                                "span",
+                                { className: "openapi-schema__required" },
+                                (0, Translate_1.translate)({
+                                  id: translationIds_1.OPENAPI_SCHEMA_ITEM
+                                    .REQUIRED,
+                                  message: "required",
+                                })
+                              )
                           )
-                      )
-                    )
-                  ),
-                },
-                react_1.default.createElement(
-                  "div",
-                  { style: { textAlign: "left", marginLeft: "1rem" } },
-                  body.description &&
+                        )
+                      ),
+                    },
                     react_1.default.createElement(
                       "div",
-                      { style: { marginTop: "1rem", marginBottom: "1rem" } },
-                      react_1.default.createElement(
-                        Markdown_1.default,
-                        null,
-                        body.description
-                      )
+                      { style: { textAlign: "left", marginLeft: "1rem" } },
+                      body.description &&
+                        react_1.default.createElement(
+                          "div",
+                          {
+                            style: { marginTop: "1rem", marginBottom: "1rem" },
+                          },
+                          react_1.default.createElement(
+                            Markdown_1.default,
+                            null,
+                            body.description
+                          )
+                        )
+                    ),
+                    react_1.default.createElement(
+                      "ul",
+                      { style: { marginLeft: "1rem" } },
+                      react_1.default.createElement(Schema_1.default, {
+                        schema: firstBody,
+                        schemaType: "request",
+                        schemaPath: "requestBody",
+                      })
                     )
-                ),
-                react_1.default.createElement(
-                  "ul",
-                  { style: { marginLeft: "1rem" } },
-                  react_1.default.createElement(Schema_1.default, {
-                    schema: firstBody,
-                    schemaType: "request",
-                    schemaPath: "requestBody",
-                  })
+                  )
                 )
-              )
+              ),
+              firstBody &&
+                !requestExample &&
+                !requestExamples &&
+                (0, ResponseExamples_1.ExampleFromSchema)({
+                  schema: firstBody,
+                  mimeType: mimeType,
+                }),
+              requestExamples &&
+                (0, ResponseExamples_1.ResponseExamples)({
+                  responseExamples: requestExamples,
+                  mimeType,
+                }),
+              requestExample &&
+                (0, ResponseExamples_1.ResponseExample)({
+                  responseExample: requestExample,
+                  mimeType,
+                })
             )
           )
         );
@@ -119,8 +152,10 @@ const RequestSchemaComponent = ({ title, body, style }) => {
     );
   }
   const randomFirstKey = mimeTypes[0];
-  const firstBody =
-    body.content[randomFirstKey].schema ?? body.content[randomFirstKey];
+  const mediaTypeObject = body.content[randomFirstKey];
+  const firstBody = mediaTypeObject?.schema ?? body.content[randomFirstKey];
+  const requestExamples = mediaTypeObject?.examples;
+  const requestExample = mediaTypeObject?.example;
   if (firstBody === undefined) {
     return null;
   }
@@ -131,67 +166,95 @@ const RequestSchemaComponent = ({ title, body, style }) => {
       TabItem_1.default,
       { label: randomFirstKey, value: `${randomFirstKey}-schema` },
       react_1.default.createElement(
-        Details_1.default,
-        {
-          className: "openapi-markdown__details mime",
-          "data-collapsed": false,
-          open: true,
-          style: style,
-          summary: react_1.default.createElement(
-            react_1.default.Fragment,
-            null,
-            react_1.default.createElement(
-              "summary",
-              null,
-              react_1.default.createElement(
-                "h3",
-                { className: "openapi-markdown__details-summary-header-body" },
-                (0, Translate_1.translate)({
-                  id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
-                  message: title,
-                }),
-                firstBody.type === "array" &&
-                  react_1.default.createElement(
-                    "span",
-                    { style: { opacity: "0.6" } },
-                    " array"
-                  ),
-                body.required &&
+        SchemaTabs_1.default,
+        { className: "openapi-tabs__schema" },
+        react_1.default.createElement(
+          TabItem_1.default,
+          { key: title, label: title, value: title },
+          react_1.default.createElement(
+            Details_1.default,
+            {
+              className: "openapi-markdown__details mime",
+              "data-collapsed": false,
+              open: true,
+              style: style,
+              summary: react_1.default.createElement(
+                react_1.default.Fragment,
+                null,
+                react_1.default.createElement(
+                  "summary",
+                  null,
                   react_1.default.createElement(
-                    "strong",
-                    { className: "openapi-schema__required" },
+                    "h3",
+                    {
+                      className:
+                        "openapi-markdown__details-summary-header-body",
+                    },
                     (0, Translate_1.translate)({
-                      id: translationIds_1.OPENAPI_SCHEMA_ITEM.REQUIRED,
-                      message: "required",
-                    })
+                      id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
+                      message: title,
+                    }),
+                    firstBody.type === "array" &&
+                      react_1.default.createElement(
+                        "span",
+                        { style: { opacity: "0.6" } },
+                        " array"
+                      ),
+                    body.required &&
+                      react_1.default.createElement(
+                        "strong",
+                        { className: "openapi-schema__required" },
+                        (0, Translate_1.translate)({
+                          id: translationIds_1.OPENAPI_SCHEMA_ITEM.REQUIRED,
+                          message: "required",
+                        })
+                      )
                   )
-              )
-            )
-          ),
-        },
-        react_1.default.createElement(
-          "div",
-          { style: { textAlign: "left", marginLeft: "1rem" } },
-          body.description &&
+                )
+              ),
+            },
             react_1.default.createElement(
               "div",
-              { style: { marginTop: "1rem", marginBottom: "1rem" } },
-              react_1.default.createElement(
-                Markdown_1.default,
-                null,
-                body.description
-              )
+              { style: { textAlign: "left", marginLeft: "1rem" } },
+              body.description &&
+                react_1.default.createElement(
+                  "div",
+                  { style: { marginTop: "1rem", marginBottom: "1rem" } },
+                  react_1.default.createElement(
+                    Markdown_1.default,
+                    null,
+                    body.description
+                  )
+                )
+            ),
+            react_1.default.createElement(
+              "ul",
+              { style: { marginLeft: "1rem" } },
+              react_1.default.createElement(Schema_1.default, {
+                schema: firstBody,
+                schemaType: "request",
+                schemaPath: "requestBody",
+              })
             )
+          )
         ),
-        react_1.default.createElement(
-          "ul",
-          { style: { marginLeft: "1rem" } },
-          react_1.default.createElement(Schema_1.default, {
+        firstBody &&
+          !requestExample &&
+          !requestExamples &&
+          (0, ResponseExamples_1.ExampleFromSchema)({
             schema: firstBody,
-            schemaType: "request",
-            schemaPath: "requestBody",
+            mimeType: randomFirstKey,
+          }),
+        requestExamples &&
+          (0, ResponseExamples_1.ResponseExamples)({
+            responseExamples: requestExamples,
+            mimeType: randomFirstKey,
+          }),
+        requestExample &&
+          (0, ResponseExamples_1.ResponseExample)({
+            responseExample: requestExample,
+            mimeType: randomFirstKey,
           })
-        )
       )
     )
   );

package/lib/theme/ResponseHeaders/index.js

@@ -27,7 +27,6 @@ const ResponseHeaders = ({ responseHeaders }) => {
         name: name,
         collapsible: false,
         schemaName: (0, schema_1.getSchemaName)(schema),
-        qualifierMessage: (0, schema_1.getQualifierMessage)(schema),
         schema: schema,
         discriminator: false,
         children: null,

package/lib/theme/ResponseSchema/index.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { MediaTypeObject } from "docusaurus-plugin-openapi-docs/lib/openapi/types";
+import type { MediaTypeObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
 interface Props {
     style?: React.CSSProperties;
     title: string;

package/lib/theme/Schema/index.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { SchemaObject } from "docusaurus-plugin-openapi-docs/lib/openapi/types";
+import type { SchemaObject } from "../../types.d";
 interface SchemaProps {
     schema: SchemaObject;
     schemaType: "request" | "response";