docusaurus-theme-openapi-docs 0.0.0-1109 → 0.0.0-1130

package/lib/index.js

@@ -38,6 +38,7 @@ function docusaurusThemeOpenAPI() {
                     resolve: {
                         fallback: {
                             buffer: require.resolve("buffer/"),
+                            path: require.resolve("path-browserify"),
                         },
                     },
                     plugins: [
@@ -67,6 +68,7 @@ function docusaurusThemeOpenAPI() {
                 resolve: {
                     fallback: {
                         buffer: require.resolve("buffer/"),
+                        path: require.resolve("path-browserify"),
                     },
                 },
                 plugins: [

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

@@ -27,8 +27,9 @@ function Accept() {
   }
   return react_1.default.createElement(
     FormItem_1.default,
-    { label: "Accept" },
+    null,
     react_1.default.createElement(FormSelect_1.default, {
+      label: "Accept",
       value: value,
       options: options,
       onChange: (e) => dispatch((0, slice_1.setAccept)(e.target.value)),

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

@@ -39,13 +39,12 @@ function Authorization() {
     optionKeys.length > 1 &&
       react_1.default.createElement(
         FormItem_1.default,
-        {
+        null,
+        react_1.default.createElement(FormSelect_1.default, {
           label: (0, Translate_1.translate)({
             id: translationIds_1.OPENAPI_AUTH.SECURITY_SCHEME,
             message: "Security Scheme",
           }),
-        },
-        react_1.default.createElement(FormSelect_1.default, {
           options: optionKeys,
           value: selected,
           onChange: (e) => {
@@ -57,14 +56,12 @@ function Authorization() {
       if (a.type === "http" && a.scheme === "bearer") {
         return react_1.default.createElement(
           FormItem_1.default,
-          {
+          { key: a.key + "-bearer" },
+          react_1.default.createElement(FormTextInput_1.default, {
             label: (0, Translate_1.translate)({
               id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
               message: "Bearer Token",
             }),
-            key: a.key + "-bearer",
-          },
-          react_1.default.createElement(FormTextInput_1.default, {
             placeholder: (0, Translate_1.translate)({
               id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
               message: "Bearer Token",
@@ -87,14 +84,12 @@ function Authorization() {
       if (a.type === "oauth2") {
         return react_1.default.createElement(
           FormItem_1.default,
-          {
+          { key: a.key + "-oauth2" },
+          react_1.default.createElement(FormTextInput_1.default, {
             label: (0, Translate_1.translate)({
               id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
               message: "Bearer Token",
             }),
-            key: a.key + "-oauth2",
-          },
-          react_1.default.createElement(FormTextInput_1.default, {
             placeholder: (0, Translate_1.translate)({
               id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
               message: "Bearer Token",
@@ -120,13 +115,12 @@ function Authorization() {
           { key: a.key + "-basic" },
           react_1.default.createElement(
             FormItem_1.default,
-            {
+            null,
+            react_1.default.createElement(FormTextInput_1.default, {
               label: (0, Translate_1.translate)({
                 id: translationIds_1.OPENAPI_AUTH.USERNAME,
                 message: "Username",
               }),
-            },
-            react_1.default.createElement(FormTextInput_1.default, {
               placeholder: (0, Translate_1.translate)({
                 id: translationIds_1.OPENAPI_AUTH.USERNAME,
                 message: "Username",
@@ -146,13 +140,12 @@ function Authorization() {
           ),
           react_1.default.createElement(
             FormItem_1.default,
-            {
+            null,
+            react_1.default.createElement(FormTextInput_1.default, {
               label: (0, Translate_1.translate)({
                 id: translationIds_1.OPENAPI_AUTH.PASSWORD,
                 message: "Password",
               }),
-            },
-            react_1.default.createElement(FormTextInput_1.default, {
               placeholder: (0, Translate_1.translate)({
                 id: translationIds_1.OPENAPI_AUTH.PASSWORD,
                 message: "Password",
@@ -176,8 +169,9 @@ function Authorization() {
       if (a.type === "apiKey") {
         return react_1.default.createElement(
           FormItem_1.default,
-          { label: `${a.key}`, key: a.key + "-apikey" },
+          { key: a.key + "-apikey" },
           react_1.default.createElement(FormTextInput_1.default, {
+            label: `${a.key}`,
             placeholder: `${a.key}`,
             password: true,
             value: data[a.key].apiKey ?? "",

package/lib/theme/ApiExplorer/Body/FormBodyItem/index.d.ts

@@ -4,6 +4,8 @@ interface FormBodyItemProps {
     schemaObject: SchemaObject;
     id: string;
     schema: SchemaObject;
+    label?: string;
+    required?: boolean;
 }
-export default function FormBodyItem({ schemaObject, id, schema, }: FormBodyItemProps): React.JSX.Element;
+export default function FormBodyItem({ schemaObject, id, schema, label, required, }: FormBodyItemProps): React.JSX.Element;
 export {};

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

@@ -16,6 +16,7 @@ const react_1 = __importDefault(require("react"));
 const FormFileUpload_1 = __importDefault(
   require("@theme/ApiExplorer/FormFileUpload")
 );
+const FormLabel_1 = __importDefault(require("@theme/ApiExplorer/FormLabel"));
 const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
 const FormTextInput_1 = __importDefault(
   require("@theme/ApiExplorer/FormTextInput")
@@ -26,36 +27,54 @@ const FileArrayFormBodyItem_1 = __importDefault(
   require("../FileArrayFormBodyItem")
 );
 const slice_1 = require("../slice");
-function FormBodyItem({ schemaObject, id, schema }) {
+function FormBodyItem({ schemaObject, id, schema, label, required }) {
   const dispatch = (0, hooks_1.useTypedDispatch)();
   if (
     schemaObject.type === "array" &&
     schemaObject.items?.format === "binary"
   ) {
-    return react_1.default.createElement(FileArrayFormBodyItem_1.default, {
-      id: id,
-      description: schemaObject.description,
-    });
+    return react_1.default.createElement(
+      react_1.default.Fragment,
+      null,
+      label &&
+        react_1.default.createElement(FormLabel_1.default, {
+          label: label,
+          required: required,
+        }),
+      react_1.default.createElement(FileArrayFormBodyItem_1.default, {
+        id: id,
+        description: schemaObject.description,
+      })
+    );
   }
   if (schemaObject.format === "binary") {
-    return react_1.default.createElement(FormFileUpload_1.default, {
-      placeholder: schemaObject.description || id,
-      onChange: (file) => {
-        if (file === undefined) {
-          dispatch((0, slice_1.clearFormBodyKey)(id));
-          return;
-        }
-        dispatch(
-          (0, slice_1.setFileFormBody)({
-            key: id,
-            value: {
-              src: `/path/to/${file.name}`,
-              content: file,
-            },
-          })
-        );
-      },
-    });
+    return react_1.default.createElement(
+      react_1.default.Fragment,
+      null,
+      label &&
+        react_1.default.createElement(FormLabel_1.default, {
+          label: label,
+          required: required,
+        }),
+      react_1.default.createElement(FormFileUpload_1.default, {
+        placeholder: schemaObject.description || id,
+        onChange: (file) => {
+          if (file === undefined) {
+            dispatch((0, slice_1.clearFormBodyKey)(id));
+            return;
+          }
+          dispatch(
+            (0, slice_1.setFileFormBody)({
+              key: id,
+              value: {
+                src: `/path/to/${file.name}`,
+                content: file,
+              },
+            })
+          );
+        },
+      })
+    );
   }
   if (
     schemaObject.type === "object" &&
@@ -67,12 +86,21 @@ function FormBodyItem({ schemaObject, id, schema }) {
       2
     );
     return react_1.default.createElement(
-      LiveEditor_1.default,
-      {
-        action: (code) =>
-          dispatch((0, slice_1.setStringFormBody)({ key: id, value: code })),
-      },
-      objectExample
+      react_1.default.Fragment,
+      null,
+      label &&
+        react_1.default.createElement(FormLabel_1.default, {
+          label: label,
+          required: required,
+        }),
+      react_1.default.createElement(
+        LiveEditor_1.default,
+        {
+          action: (code) =>
+            dispatch((0, slice_1.setStringFormBody)({ key: id, value: code })),
+        },
+        objectExample
+      )
     );
   }
   if (
@@ -80,6 +108,8 @@ function FormBodyItem({ schemaObject, id, schema }) {
     schemaObject.enum.every((value) => typeof value === "string")
   ) {
     return react_1.default.createElement(FormSelect_1.default, {
+      label: label,
+      required: required,
       options: ["---", ...schemaObject.enum],
       onChange: (e) => {
         const val = e.target.value;
@@ -98,6 +128,8 @@ function FormBodyItem({ schemaObject, id, schema }) {
   }
   // TODO: support all the other types.
   return react_1.default.createElement(FormTextInput_1.default, {
+    label: label,
+    required: required,
     paramName: id,
     isRequired: Array.isArray(schema.required) && schema.required.includes(id),
     placeholder: schemaObject.description || id,

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

@@ -368,16 +368,14 @@ function Body({
       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),
-          },
+          { key: key },
           react_1.default.createElement(FormBodyItem_1.default, {
             schemaObject: val,
             id: key,
             schema: schema,
+            label: key,
+            required:
+              Array.isArray(schema.required) && schema.required.includes(key),
           })
         );
       })

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

@@ -29,8 +29,9 @@ function ContentType() {
   }
   return react_1.default.createElement(
     FormItem_1.default,
-    { label: "Content-Type" },
+    null,
     react_1.default.createElement(FormSelect_1.default, {
+      label: "Content-Type",
       value: value,
       options: options,
       onChange: (e) => dispatch((0, slice_1.setContentType)(e.target.value)),

package/lib/theme/ApiExplorer/FormItem/_FormItem.scss

@@ -14,8 +14,3 @@
 .openapi-explorer__form-item-body-container {
   padding: 0;
 }
-
-.openapi-explorer__form-item-label {
-  font-family: var(--ifm-font-family-monospace);
-  font-weight: bold;
-}

package/lib/theme/ApiExplorer/FormItem/index.d.ts

@@ -1,10 +1,7 @@
 import React from "react";
 export interface Props {
-    label?: string;
-    type?: string;
-    required?: boolean | undefined;
     children?: React.ReactNode;
     className?: string;
 }
-declare function FormItem({ label, type, required, children, className }: Props): React.JSX.Element;
+declare function FormItem({ children, className }: Props): React.JSX.Element;
 export default FormItem;

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

@@ -12,38 +12,14 @@ 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 clsx_1 = __importDefault(require("clsx"));
-function FormItem({ label, type, required, children, className }) {
+function FormItem({ children, className }) {
   return react_1.default.createElement(
     "div",
     {
       className: (0, clsx_1.default)("openapi-explorer__form-item", className),
     },
-    label &&
-      react_1.default.createElement(
-        "label",
-        { className: "openapi-explorer__form-item-label" },
-        label
-      ),
-    type &&
-      react_1.default.createElement(
-        "span",
-        { style: { opacity: 0.6 } },
-        " \u2014 ",
-        type
-      ),
-    required &&
-      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", null, children)
+    children
   );
 }
 exports.default = FormItem;

package/lib/theme/ApiExplorer/FormLabel/_FormLabel.scss

@@ -0,0 +1,4 @@
+.openapi-explorer__form-item-label {
+  font-family: var(--ifm-font-family-monospace);
+  font-weight: bold;
+}

package/lib/theme/ApiExplorer/FormLabel/index.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export interface Props {
+    htmlFor?: string;
+    label: string;
+    type?: string;
+    required?: boolean;
+}
+declare function FormLabel({ htmlFor, label, type, required }: Props): React.JSX.Element;
+export default FormLabel;

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

@@ -0,0 +1,50 @@
+"use strict";
+/* ============================================================================
+ * Copyright (c) Palo Alto Networks
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ * ========================================================================== */
+var __importDefault =
+  (this && this.__importDefault) ||
+  function (mod) {
+    return mod && mod.__esModule ? mod : { default: mod };
+  };
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
+const translationIds_1 = require("@theme/translationIds");
+function FormLabel({ htmlFor, label, type, required }) {
+  return react_1.default.createElement(
+    react_1.default.Fragment,
+    null,
+    htmlFor
+      ? react_1.default.createElement(
+          "label",
+          { className: "openapi-explorer__form-item-label", htmlFor: htmlFor },
+          label
+        )
+      : react_1.default.createElement(
+          "span",
+          { className: "openapi-explorer__form-item-label" },
+          label
+        ),
+    type &&
+      react_1.default.createElement(
+        "span",
+        { style: { opacity: 0.6 } },
+        " \u2014 ",
+        type
+      ),
+    required &&
+      react_1.default.createElement(
+        "span",
+        { className: "openapi-schema__required" },
+        (0, Translate_1.translate)({
+          id: translationIds_1.OPENAPI_SCHEMA_ITEM.REQUIRED,
+          message: "required",
+        })
+      )
+  );
+}
+exports.default = FormLabel;

package/lib/theme/ApiExplorer/FormMultiSelect/index.d.ts

@@ -4,6 +4,9 @@ export interface Props {
     options: string[];
     onChange?: React.ChangeEventHandler<HTMLSelectElement>;
     showErrors?: boolean;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-declare function FormMultiSelect({ value, options, onChange, showErrors }: Props): React.JSX.Element | null;
+declare function FormMultiSelect({ value, options, onChange, showErrors, label, type, required, }: Props): React.JSX.Element | null;
 export default FormMultiSelect;

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

@@ -5,15 +5,81 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        var desc = Object.getOwnPropertyDescriptor(m, k);
+        if (
+          !desc ||
+          ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)
+        ) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k];
+            },
+          };
+        }
+        Object.defineProperty(o, k2, desc);
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        o[k2] = m[k];
+      });
+var __setModuleDefault =
+  (this && this.__setModuleDefault) ||
+  (Object.create
+    ? function (o, v) {
+        Object.defineProperty(o, "default", { enumerable: true, value: v });
+      }
+    : function (o, v) {
+        o["default"] = v;
+      });
+var __importStar =
+  (this && this.__importStar) ||
+  (function () {
+    var ownKeys = function (o) {
+      ownKeys =
+        Object.getOwnPropertyNames ||
+        function (o) {
+          var ar = [];
+          for (var k in o)
+            if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+          return ar;
+        };
+      return ownKeys(o);
+    };
+    return function (mod) {
+      if (mod && mod.__esModule) return mod;
+      var result = {};
+      if (mod != null)
+        for (var k = ownKeys(mod), i = 0; i < k.length; i++)
+          if (k[i] !== "default") __createBinding(result, mod, k[i]);
+      __setModuleDefault(result, mod);
+      return result;
+    };
+  })();
 var __importDefault =
   (this && this.__importDefault) ||
   function (mod) {
     return mod && mod.__esModule ? mod : { default: mod };
   };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
+const FormLabel_1 = __importDefault(require("@theme/ApiExplorer/FormLabel"));
 const clsx_1 = __importDefault(require("clsx"));
-function FormMultiSelect({ value, options, onChange, showErrors }) {
+function FormMultiSelect({
+  value,
+  options,
+  onChange,
+  showErrors,
+  label,
+  type,
+  required,
+}) {
+  const id = (0, react_1.useId)();
   if (options.length === 0) {
     return null;
   }
@@ -28,24 +94,36 @@ function FormMultiSelect({ value, options, onChange, showErrors }) {
       rawHeight + innerMargins + outerMargins + selectPadding + mysteryScroll;
   }
   return react_1.default.createElement(
-    "select",
-    {
-      style: { height: height },
-      className: (0, clsx_1.default)("openapi-explorer__multi-select-input", {
-        error: showErrors,
+    react_1.default.Fragment,
+    null,
+    label &&
+      react_1.default.createElement(FormLabel_1.default, {
+        htmlFor: id,
+        label: label,
+        type: type,
+        required: required,
       }),
-      value: value,
-      onChange: onChange,
-      size: Math.min(6, options.length + 1),
-      multiple: true,
-    },
-    options.map((option) => {
-      return react_1.default.createElement(
-        "option",
-        { key: option, value: option },
-        option
-      );
-    })
+    react_1.default.createElement(
+      "select",
+      {
+        id: label ? id : undefined,
+        style: { height: height },
+        className: (0, clsx_1.default)("openapi-explorer__multi-select-input", {
+          error: showErrors,
+        }),
+        value: value,
+        onChange: onChange,
+        size: Math.min(6, options.length + 1),
+        multiple: true,
+      },
+      options.map((option) => {
+        return react_1.default.createElement(
+          "option",
+          { key: option, value: option },
+          option
+        );
+      })
+    )
   );
 }
 exports.default = FormMultiSelect;

package/lib/theme/ApiExplorer/FormSelect/index.d.ts

@@ -3,6 +3,11 @@ export interface Props {
     value?: string;
     options?: string[];
     onChange?: React.ChangeEventHandler<HTMLSelectElement>;
+    label?: string;
+    type?: string;
+    required?: boolean;
+    ariaLabelledBy?: string;
+    ariaLabel?: string;
 }
-declare function FormSelect({ value, options, onChange }: Props): React.JSX.Element | null;
+declare function FormSelect({ value, options, onChange, label, type, required, ariaLabelledBy, ariaLabel, }: Props): React.JSX.Element | null;
 export default FormSelect;