docusaurus-theme-openapi-docs 4.5.0 → 4.6.0

package/lib/theme/ApiExplorer/Body/index.js

@@ -12,22 +12,21 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const json2xml_1 = __importDefault(require("@theme/ApiExplorer/Body/json2xml"));
 const FormFileUpload_1 = __importDefault(
   require("@theme/ApiExplorer/FormFileUpload")
 );
 const FormItem_1 = __importDefault(require("@theme/ApiExplorer/FormItem"));
-const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
-const FormTextInput_1 = __importDefault(
-  require("@theme/ApiExplorer/FormTextInput")
-);
 const LiveEditor_1 = __importDefault(require("@theme/ApiExplorer/LiveEditor"));
 const hooks_1 = require("@theme/ApiItem/hooks");
 const Markdown_1 = __importDefault(require("@theme/Markdown"));
 const SchemaTabs_1 = __importDefault(require("@theme/SchemaTabs"));
 const TabItem_1 = __importDefault(require("@theme/TabItem"));
+const translationIds_1 = require("@theme/translationIds");
 const xml_formatter_1 = __importDefault(require("xml-formatter"));
 const slice_1 = require("./slice");
+const FormBodyItem_1 = __importDefault(require("./FormBodyItem"));
 function BodyWrap({
   requestBodyMetadata,
   jsonRequestBodyExample,
@@ -80,12 +79,19 @@ function Body({
   const schema = requestBodyMetadata?.content?.[contentType]?.schema;
   const example = requestBodyMetadata?.content?.[contentType]?.example;
   const examples = requestBodyMetadata?.content?.[contentType]?.examples;
+  // OpenAPI 3.1 / JSON Schema: schema.examples is an array of example values
+  const schemaExamples = schema?.examples;
   if (schema?.format === "binary") {
     return react_1.default.createElement(
       FormItem_1.default,
       null,
       react_1.default.createElement(FormFileUpload_1.default, {
-        placeholder: schema.description || "Body",
+        placeholder:
+          schema.description ||
+          (0, Translate_1.translate)({
+            id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
+            message: "Body",
+          }),
         onChange: (file) => {
           if (file === undefined) {
             dispatch((0, slice_1.clearRawBody)());
@@ -109,94 +115,22 @@ function Body({
     return react_1.default.createElement(
       FormItem_1.default,
       { className: "openapi-explorer__form-item-body-container" },
-      react_1.default.createElement(
-        "div",
-        null,
-        Object.entries(schema.properties ?? {}).map(([key, val]) => {
-          if (val.format === "binary") {
-            return react_1.default.createElement(
-              FormItem_1.default,
-              {
-                key: key,
-                label: key,
-                required:
-                  Array.isArray(schema.required) &&
-                  schema.required.includes(key),
-              },
-              react_1.default.createElement(FormFileUpload_1.default, {
-                placeholder: val.description || key,
-                onChange: (file) => {
-                  if (file === undefined) {
-                    dispatch((0, slice_1.clearFormBodyKey)(key));
-                    return;
-                  }
-                  dispatch(
-                    (0, slice_1.setFileFormBody)({
-                      key: key,
-                      value: {
-                        src: `/path/to/${file.name}`,
-                        content: file,
-                      },
-                    })
-                  );
-                },
-              })
-            );
-          }
-          if (val.enum) {
-            return react_1.default.createElement(
-              FormItem_1.default,
-              {
-                key: key,
-                label: key,
-                required:
-                  Array.isArray(schema.required) &&
-                  schema.required.includes(key),
-              },
-              react_1.default.createElement(FormSelect_1.default, {
-                options: ["---", ...val.enum],
-                onChange: (e) => {
-                  const val = e.target.value;
-                  if (val === "---") {
-                    dispatch((0, slice_1.clearFormBodyKey)(key));
-                  } else {
-                    dispatch(
-                      (0, slice_1.setStringFormBody)({
-                        key: key,
-                        value: val,
-                      })
-                    );
-                  }
-                },
-              })
-            );
-          }
-          // TODO: support all the other types.
-          return react_1.default.createElement(
-            FormItem_1.default,
-            {
-              key: key,
-              label: key,
-              required:
-                Array.isArray(schema.required) && schema.required.includes(key),
-            },
-            react_1.default.createElement(FormTextInput_1.default, {
-              paramName: key,
-              isRequired:
-                Array.isArray(schema.required) && schema.required.includes(key),
-              placeholder: val.description || key,
-              onChange: (e) => {
-                dispatch(
-                  (0, slice_1.setStringFormBody)({
-                    key: key,
-                    value: e.target.value,
-                  })
-                );
-              },
-            })
-          );
-        })
-      )
+      Object.entries(schema.properties ?? {}).map(([key, val]) => {
+        return react_1.default.createElement(
+          FormItem_1.default,
+          {
+            key: key,
+            label: key,
+            required:
+              Array.isArray(schema.required) && schema.required.includes(key),
+          },
+          react_1.default.createElement(FormBodyItem_1.default, {
+            schemaObject: val,
+            id: key,
+            schema: schema,
+          })
+        );
+      })
     );
   }
   let language = "plaintext";
@@ -229,6 +163,17 @@ function Body({
         });
       }
     }
+    // OpenAPI 3.1: schema.examples is an array of example values
+    if (schemaExamples && Array.isArray(schemaExamples)) {
+      schemaExamples.forEach((schemaExample, index) => {
+        const body = JSON.stringify(schemaExample, null, 2);
+        examplesBodies.push({
+          label: `Example ${index + 1}`,
+          body,
+          summary: undefined,
+        });
+      });
+    }
     language = "json";
   }
   if (contentType === "application/xml" || contentType.endsWith("+xml")) {
@@ -279,6 +224,29 @@ function Body({
         });
       }
     }
+    // OpenAPI 3.1: schema.examples is an array of example values
+    if (schemaExamples && Array.isArray(schemaExamples)) {
+      schemaExamples.forEach((schemaExample, index) => {
+        let formattedXmlBody;
+        try {
+          formattedXmlBody = (0, xml_formatter_1.default)(
+            (0, json2xml_1.default)(schemaExample, ""),
+            {
+              indentation: "  ",
+              lineSeparator: "\n",
+              collapseContent: true,
+            }
+          );
+        } catch {
+          formattedXmlBody = (0, json2xml_1.default)(schemaExample);
+        }
+        examplesBodies.push({
+          label: `Example ${index + 1}`,
+          body: formattedXmlBody,
+          summary: undefined,
+        });
+      });
+    }
     language = "xml";
   }
   if (exampleBody) {
@@ -291,13 +259,20 @@ function Body({
         react_1.default.createElement(
           TabItem_1.default,
           {
-            label: "Example (from schema)",
+            label: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_BODY.EXAMPLE_FROM_SCHEMA,
+              message: "Example (from schema)",
+            }),
             value: "Example (from schema)",
             default: true,
           },
           react_1.default.createElement(
             LiveEditor_1.default,
-            { action: dispatch, language: language, required: required },
+            {
+              action: (code) => dispatch((0, slice_1.setStringRawBody)(code)),
+              language: language,
+              required: required,
+            },
             defaultBody
           )
         ),
@@ -313,7 +288,11 @@ function Body({
           exampleBody &&
             react_1.default.createElement(
               LiveEditor_1.default,
-              { action: dispatch, language: language, required: required },
+              {
+                action: (code) => dispatch((0, slice_1.setStringRawBody)(code)),
+                language: language,
+                required: required,
+              },
               exampleBody
             )
         )
@@ -330,13 +309,20 @@ function Body({
         react_1.default.createElement(
           TabItem_1.default,
           {
-            label: "Example (from schema)",
+            label: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_BODY.EXAMPLE_FROM_SCHEMA,
+              message: "Example (from schema)",
+            }),
             value: "Example (from schema)",
             default: true,
           },
           react_1.default.createElement(
             LiveEditor_1.default,
-            { action: dispatch, language: language, required: required },
+            {
+              action: (code) => dispatch((0, slice_1.setStringRawBody)(code)),
+              language: language,
+              required: required,
+            },
             defaultBody
           )
         ),
@@ -359,7 +345,11 @@ function Body({
               example.body &&
                 react_1.default.createElement(
                   LiveEditor_1.default,
-                  { action: dispatch, language: language },
+                  {
+                    action: (code) =>
+                      dispatch((0, slice_1.setStringRawBody)(code)),
+                    language: language,
+                  },
                   example.body
                 )
             )
@@ -373,7 +363,11 @@ function Body({
     null,
     react_1.default.createElement(
       LiveEditor_1.default,
-      { action: dispatch, language: language, required: required },
+      {
+        action: (code) => dispatch((0, slice_1.setStringRawBody)(code)),
+        language: language,
+        required: required,
+      },
       defaultBody
     )
   );