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

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

@@ -5,31 +5,112 @@
  * 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"));
-function FormSelect({ value, options, onChange }) {
+const react_1 = __importStar(require("react"));
+const FormLabel_1 = __importDefault(require("@theme/ApiExplorer/FormLabel"));
+function FormSelect({
+  value,
+  options,
+  onChange,
+  label,
+  type,
+  required,
+  ariaLabelledBy,
+  ariaLabel,
+}) {
+  const id = (0, react_1.useId)();
   if (!Array.isArray(options) || options.length === 0) {
     return null;
   }
   return react_1.default.createElement(
-    "select",
-    {
-      className: "openapi-explorer__select-input",
-      value: value,
-      onChange: onChange,
-    },
-    options.map((option) => {
-      return react_1.default.createElement(
-        "option",
-        { key: option, value: option },
-        option
-      );
-    })
+    react_1.default.Fragment,
+    null,
+    label &&
+      react_1.default.createElement(FormLabel_1.default, {
+        htmlFor: id,
+        label: label,
+        type: type,
+        required: required,
+      }),
+    react_1.default.createElement(
+      "select",
+      {
+        id: label ? id : undefined,
+        className: "openapi-explorer__select-input",
+        value: value,
+        onChange: onChange,
+        "aria-labelledby": !label ? ariaLabelledBy : undefined,
+        "aria-label": !label && !ariaLabelledBy ? ariaLabel : undefined,
+      },
+      options.map((option) => {
+        return react_1.default.createElement(
+          "option",
+          { key: option, value: option },
+          option
+        );
+      })
+    )
   );
 }
 exports.default = FormSelect;

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

@@ -6,6 +6,9 @@ export interface Props {
     onChange?: React.ChangeEventHandler<HTMLInputElement>;
     paramName?: string;
     isRequired?: boolean;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-declare function FormTextInput({ isRequired, value, placeholder, password, onChange, paramName, }: Props): React.JSX.Element;
+declare function FormTextInput({ isRequired, value, placeholder, password, onChange, paramName, label, type, required, }: Props): React.JSX.Element;
 export default FormTextInput;

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

@@ -5,6 +5,62 @@
  * 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) {
@@ -12,9 +68,10 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 // @ts-nocheck
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
+const FormLabel_1 = __importDefault(require("@theme/ApiExplorer/FormLabel"));
 const translationIds_1 = require("@theme/translationIds");
 const clsx_1 = __importDefault(require("clsx"));
 const react_hook_form_1 = require("react-hook-form");
@@ -25,7 +82,11 @@ function FormTextInput({
   password,
   onChange,
   paramName,
+  label,
+  type,
+  required,
 }) {
+  const id = (0, react_1.useId)();
   placeholder = placeholder?.split("\n")[0];
   const {
     register,
@@ -35,6 +96,13 @@ function FormTextInput({
   return react_1.default.createElement(
     react_1.default.Fragment,
     null,
+    label &&
+      react_1.default.createElement(FormLabel_1.default, {
+        htmlFor: id,
+        label: label,
+        type: type,
+        required: required,
+      }),
     paramName
       ? react_1.default.createElement("input", {
           ...register(paramName, {
@@ -45,6 +113,7 @@ function FormTextInput({
                 })
               : false,
           }),
+          id: label ? id : undefined,
           className: (0, clsx_1.default)("openapi-explorer__form-item-input", {
             error: showErrorMessage,
           }),
@@ -56,6 +125,7 @@ function FormTextInput({
           autoComplete: "off",
         })
       : react_1.default.createElement("input", {
+          id: label ? id : undefined,
           className: "openapi-explorer__form-item-input",
           type: password ? "password" : "text",
           placeholder: placeholder,

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamArrayFormItem.d.ts

@@ -2,5 +2,8 @@ import React from "react";
 import { Param } from "@theme/ApiExplorer/ParamOptions/slice";
 export interface ParamProps {
     param: Param;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-export default function ParamArrayFormItem({ param }: ParamProps): React.JSX.Element;
+export default function ParamArrayFormItem({ param, label, type, required, }: ParamProps): React.JSX.Element;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamArrayFormItem.js

@@ -72,6 +72,7 @@ const react_1 = __importStar(require("react"));
 const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
 const toolkit_1 = require("@reduxjs/toolkit");
+const FormLabel_1 = __importDefault(require("@theme/ApiExplorer/FormLabel"));
 const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
 const FormTextInput_1 = __importDefault(
   require("@theme/ApiExplorer/FormTextInput")
@@ -84,6 +85,7 @@ function ArrayItem({ param, onChange, initialValue }) {
   const [value, setValue] = (0, react_1.useState)(initialValue || "");
   if (param.schema?.items?.type === "boolean") {
     return react_1.default.createElement(FormSelect_1.default, {
+      ariaLabel: param.description || param.name,
       options: ["---", "true", "false"],
       onChange: (e) => {
         const val = e.target.value;
@@ -100,7 +102,7 @@ function ArrayItem({ param, onChange, initialValue }) {
     },
   });
 }
-function ParamArrayFormItem({ param }) {
+function ParamArrayFormItem({ param, label, type, required }) {
   const [items, setItems] = (0, react_1.useState)([]);
   const dispatch = (0, hooks_1.useTypedDispatch)();
   const {
@@ -158,6 +160,12 @@ function ParamArrayFormItem({ param }) {
   return react_1.default.createElement(
     react_1.default.Fragment,
     null,
+    label &&
+      react_1.default.createElement(FormLabel_1.default, {
+        label: label,
+        type: type,
+        required: required,
+      }),
     react_1.default.createElement(react_hook_form_1.Controller, {
       control: control,
       rules: {
@@ -187,6 +195,7 @@ function ParamArrayFormItem({ param }) {
                 {
                   className: "openapi-explorer__delete-btn",
                   onClick: handleDeleteItem(item),
+                  "aria-label": "Delete",
                 },
                 react_1.default.createElement(
                   "svg",
@@ -202,8 +211,7 @@ function ParamArrayFormItem({ param }) {
                   },
                   react_1.default.createElement("path", {
                     d: "M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4 14.6 16 8 22.6 9.4 24 16 17.4 22.6 24 24 22.6 17.4 16 24 9.4z",
-                  }),
-                  react_1.default.createElement("title", null, "Delete")
+                  })
                 )
               )
             )

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamBooleanFormItem.d.ts

@@ -2,5 +2,8 @@ import React from "react";
 import { Param } from "@theme/ApiExplorer/ParamOptions/slice";
 export interface ParamProps {
     param: Param;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-export default function ParamBooleanFormItem({ param }: ParamProps): React.JSX.Element;
+export default function ParamBooleanFormItem({ param, label, type, required, }: ParamProps): React.JSX.Element;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamBooleanFormItem.js

@@ -20,7 +20,7 @@ const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
 const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
-function ParamBooleanFormItem({ param }) {
+function ParamBooleanFormItem({ param, label, type, required }) {
   const dispatch = (0, hooks_1.useTypedDispatch)();
   const {
     control,
@@ -43,6 +43,9 @@ function ParamBooleanFormItem({ param }) {
       name: "paramBoolean",
       render: ({ field: { onChange } }) =>
         react_1.default.createElement(FormSelect_1.default, {
+          label: label,
+          type: type,
+          required: required,
           options: ["---", "true", "false"],
           onChange: (e) => {
             const val = e.target.value;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamMultiSelectFormItem.d.ts

@@ -2,5 +2,8 @@ import React from "react";
 import { Param } from "@theme/ApiExplorer/ParamOptions/slice";
 export interface ParamProps {
     param: Param;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-export default function ParamMultiSelectFormItem({ param }: ParamProps): React.JSX.Element;
+export default function ParamMultiSelectFormItem({ param, label, type, required, }: ParamProps): React.JSX.Element;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamMultiSelectFormItem.js

@@ -23,7 +23,7 @@ const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
 const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
-function ParamMultiSelectFormItem({ param }) {
+function ParamMultiSelectFormItem({ param, label, type, required }) {
   const {
     control,
     formState: { errors },
@@ -78,6 +78,9 @@ function ParamMultiSelectFormItem({ param }) {
       name: "paramMultiSelect",
       render: ({ field: { onChange } }) =>
         react_1.default.createElement(FormMultiSelect_1.default, {
+          label: label,
+          type: type,
+          required: required,
           options: options,
           onChange: (e) => handleChange(e, onChange),
           showErrors: !!showErrorMessage,

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamSelectFormItem.d.ts

@@ -2,5 +2,8 @@ import React from "react";
 import { Param } from "@theme/ApiExplorer/ParamOptions/slice";
 export interface ParamProps {
     param: Param;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-export default function ParamSelectFormItem({ param }: ParamProps): React.JSX.Element;
+export default function ParamSelectFormItem({ param, label, type, required, }: ParamProps): React.JSX.Element;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamSelectFormItem.js

@@ -21,7 +21,7 @@ const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
 const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
-function ParamSelectFormItem({ param }) {
+function ParamSelectFormItem({ param, label, type, required }) {
   const {
     control,
     formState: { errors },
@@ -45,6 +45,9 @@ function ParamSelectFormItem({ param }) {
       name: "paramSelect",
       render: ({ field: { onChange } }) =>
         react_1.default.createElement(FormSelect_1.default, {
+          label: label,
+          type: type,
+          required: required,
           options: ["---", ...options],
           onChange: (e) => {
             const val = e.target.value;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamTextFormItem.d.ts

@@ -2,5 +2,8 @@ import React from "react";
 import { Param } from "@theme/ApiExplorer/ParamOptions/slice";
 export interface ParamProps {
     param: Param;
+    label?: string;
+    type?: string;
+    required?: boolean;
 }
-export default function ParamTextFormItem({ param }: ParamProps): React.JSX.Element;
+export default function ParamTextFormItem({ param, label, type, required, }: ParamProps): React.JSX.Element;

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamTextFormItem.js

@@ -18,9 +18,12 @@ const FormTextInput_1 = __importDefault(
 );
 const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
-function ParamTextFormItem({ param }) {
+function ParamTextFormItem({ param, label, type, required }) {
   const dispatch = (0, hooks_1.useTypedDispatch)();
   return react_1.default.createElement(FormTextInput_1.default, {
+    label: label,
+    type: type,
+    required: required,
     isRequired: param.required,
     paramName: param.name,
     placeholder: param.description || param.name,

package/lib/theme/ApiExplorer/ParamOptions/_ParamOptions.scss

@@ -63,15 +63,10 @@
   margin-top: calc(var(--ifm-pre-padding) / 2);
   background-color: var(--openapi-input-background);
   border: none;
-  outline: none;
   color: var(--ifm-pre-color);
   border-radius: 4px;
   margin-left: 4px;
 
-  &:focus {
-    outline: 0;
-  }
-
   &:active {
     box-shadow: inset 0px 0px 0px 2px var(--openapi-input-border);
   }
@@ -102,10 +97,6 @@
     background-color: var(--openapi-input-border);
   }
 
-  &:focus {
-    outline: 0;
-  }
-
   &:active {
     box-shadow:
       inset 0 0 0 1px var(--openapi-input-border),

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

@@ -1,5 +1,10 @@
 import React from "react";
 import { Param } from "./slice";
+export interface LabelProps {
+    label?: string;
+    type?: string;
+    required?: boolean;
+}
 export interface ParamProps {
     param: Param;
 }

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

@@ -107,44 +107,65 @@ function getSchemaEnum(schema) {
   }
   return undefined;
 }
-function ParamOption({ param }) {
+function ParamOption({ param, label, type, required }) {
   const schemaEnum = getSchemaEnum(param.schema);
   const itemsEnum = getSchemaEnum(param.schema?.items);
   if (param.schema?.type === "array" && itemsEnum) {
     return react_1.default.createElement(ParamMultiSelectFormItem_1.default, {
       param: param,
+      label: label,
+      type: type,
+      required: required,
     });
   }
   if (param.schema?.type === "array") {
     return react_1.default.createElement(ParamArrayFormItem_1.default, {
       param: param,
+      label: label,
+      type: type,
+      required: required,
     });
   }
   if (schemaEnum) {
     return react_1.default.createElement(ParamSelectFormItem_1.default, {
       param: param,
+      label: label,
+      type: type,
+      required: required,
     });
   }
   if (param.schema?.type === "boolean") {
     return react_1.default.createElement(ParamBooleanFormItem_1.default, {
       param: param,
+      label: label,
+      type: type,
+      required: required,
     });
   }
   // integer, number, string, int32, int64, float, double, object, byte, binary,
   // date-time, date, password
   return react_1.default.createElement(ParamTextFormItem_1.default, {
     param: param,
+    label: label,
+    type: type,
+    required: required,
   });
 }
 function ParamOptionWrapper({ param }) {
   return react_1.default.createElement(
     FormItem_1.default,
-    { label: param.name, type: param.in, required: param.required },
-    react_1.default.createElement(ParamOption, { param: param })
+    null,
+    react_1.default.createElement(ParamOption, {
+      param: param,
+      label: param.name,
+      type: param.in,
+      required: param.required,
+    })
   );
 }
 function ParamOptions() {
   const [showOptional, setShowOptional] = (0, react_1.useState)(false);
+  const optionalId = (0, react_1.useId)();
   const pathParams = (0, hooks_1.useTypedSelector)(
     (state) => state.params.path
   );
@@ -183,6 +204,8 @@ function ParamOptions() {
           {
             type: "button",
             className: "openapi-explorer__show-more-btn",
+            "aria-expanded": showOptional,
+            "aria-controls": optionalId,
             onClick: () => setShowOptional((prev) => !prev),
           },
           react_1.default.createElement(
@@ -241,6 +264,7 @@ function ParamOptions() {
             className: showOptional
               ? "openapi-explorer__show-options"
               : "openapi-explorer__hide-options",
+            id: optionalId,
           },
           optionalParams.map((param) =>
             react_1.default.createElement(ParamOptionWrapper, {

package/lib/theme/ApiExplorer/Request/_Request.scss

@@ -48,6 +48,17 @@
 }
 
 .openapi-explorer__expand-details-btn {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  padding: 0;
+  cursor: pointer;
+  border: 0px solid transparent;
+  background-color: transparent;
+  text-transform: inherit;
+  font-weight: inherit;
+  font-size: inherit;
+
   &:hover {
     cursor: pointer;
   }

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

@@ -140,6 +140,7 @@ function Request({ item }) {
   const [expandBody, setExpandBody] = (0, react_1.useState)(true);
   const [expandParams, setExpandParams] = (0, react_1.useState)(true);
   const [expandServer, setExpandServer] = (0, react_1.useState)(true);
+  const serverLabelId = (0, react_1.useId)();
   const allParams = [
     ...pathParams,
     ...queryParams,
@@ -313,8 +314,9 @@ function Request({ item }) {
         ),
         allDetailsExpanded
           ? react_1.default.createElement(
-              "span",
+              "button",
               {
+                type: "button",
                 className: "openapi-explorer__expand-details-btn",
                 onClick: collapseAllDetails,
               },
@@ -324,8 +326,9 @@ function Request({ item }) {
               })
             )
           : react_1.default.createElement(
-              "span",
+              "button",
               {
+                type: "button",
                 className: "openapi-explorer__expand-details-btn",
                 onClick: expandAllDetails,
               },
@@ -349,6 +352,7 @@ function Request({ item }) {
             react_1.default.createElement(
               "summary",
               {
+                id: serverLabelId,
                 className: "openapi-explorer__details-summary",
                 onClick: (e) => {
                   e.preventDefault();
@@ -360,7 +364,9 @@ function Request({ item }) {
                 message: "Base URL",
               })
             ),
-            react_1.default.createElement(Server_1.default, null)
+            react_1.default.createElement(Server_1.default, {
+              labelId: serverLabelId,
+            })
           ),
         showAuth &&
           react_1.default.createElement(

package/lib/theme/ApiExplorer/Response/_Response.scss

@@ -43,6 +43,17 @@
 }
 
 .openapi-explorer__response-clear-btn {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  padding: 0;
+  cursor: pointer;
+  border: 0px solid transparent;
+  background-color: transparent;
+  text-transform: inherit;
+  font-weight: inherit;
+  font-size: inherit;
+
   &:hover {
     cursor: pointer;
   }

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

@@ -152,8 +152,9 @@ function Response({ item }) {
         })
       ),
       react_1.default.createElement(
-        "span",
+        "button",
         {
+          type: "button",
           className: "openapi-explorer__response-clear-btn",
           onClick: () => {
             dispatch((0, slice_1.clearResponse)());

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

@@ -1,3 +1,6 @@
 import React from "react";
-declare function Server(): React.JSX.Element | null;
+interface ServerProps {
+    labelId?: string;
+}
+declare function Server({ labelId }: ServerProps): React.JSX.Element | null;
 export default Server;