docusaurus-theme-openapi-docs 1.0.2 → 1.0.3

package/lib/theme/ApiDemoPanel/MethodEndpoint/index.js

@@ -24,18 +24,21 @@ function colorForMethod(method) {
     case "get":
       return "primary";
 
-    case "put":
-      return "warning";
-
-    case "patch":
-      return "warning";
-
     case "post":
       return "success";
 
     case "delete":
       return "danger";
 
+    case "put":
+      return "info";
+
+    case "patch":
+      return "warning";
+
+    case "head":
+      return "secondary";
+
     default:
       return undefined;
   }

package/lib/theme/ApiDemoPanel/SecuritySchemes/index.js

@@ -7,6 +7,8 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+var _Link = _interopRequireDefault(require("@docusaurus/Link"));
+
 var _hooks = require("../hooks");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -17,9 +19,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
-function SecuritySchemes() {
+function SecuritySchemes(props) {
   const options = (0, _hooks.useTypedSelector)(state => state.auth.options);
   const selected = (0, _hooks.useTypedSelector)(state => state.auth.selected);
+  const infoAuthPath = `/${props.infoPath}#authentication`;
   if (selected === undefined) return null;
   const selectedAuth = options[selected];
   return <div style={{
@@ -32,7 +35,9 @@ function SecuritySchemes() {
 
       if (isApiKey || isBearer) {
         return <_react.default.Fragment key={selected}>
-              <b>Authorization: {auth.key}</b>
+              <b>
+                Authorization: <_Link.default to={infoAuthPath}>{auth.key}</_Link.default>
+              </b>
               <pre style={{
             display: "flex",
             flexDirection: "column",

package/lib/theme/ApiDemoPanel/index.js

@@ -46,7 +46,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 function ApiDemoPanel({
-  item
+  item,
+  infoPath
 }) {
   var _item$responses, _item$requestBody$con, _item$requestBody, _item$servers, _item$parameters, _xCodeSamples;
 
@@ -110,19 +111,14 @@ function ApiDemoPanel({
   return <_reactRedux.Provider store={store2}>
       <div className={_stylesModule.default.apiDemoPanelContainer}>
         <_MethodEndpoint.default method={method} path={path} />
-
-        <_SecuritySchemes.default />
-
+        <_SecuritySchemes.default infoPath={infoPath} />
         <div className={_stylesModule.default.optionsPanel}>
           <_ParamOptions.default />
           <_Body.default jsonRequestBodyExample={item.jsonRequestBodyExample} requestBodyMetadata={item.requestBody} />
           <_Accept.default />
         </div>
-
         <_Server.default />
-
         <_Curl.default postman={postman} codeSamples={(_xCodeSamples = item["x-code-samples"]) !== null && _xCodeSamples !== void 0 ? _xCodeSamples : []} />
-
         <_Response.default />
       </div>
     </_reactRedux.Provider>;

package/lib/theme/ApiItem/index.js

@@ -85,6 +85,7 @@ function DocItemContent(props) {
     frontMatter
   } = DocContent;
   const {
+    info_path: infoPath,
     hide_title: hideTitle,
     hide_table_of_contents: hideTableOfContents,
     toc_min_heading_level: tocMinHeadingLevel,
@@ -131,7 +132,7 @@ function DocItemContent(props) {
                     <DocContent />
                   </div>
                   {api && <div className="col col--5">
-                      <ApiDemoPanel item={api} />
+                      <ApiDemoPanel item={api} infoPath={infoPath} />
                     </div>}
                 </div>
               </_MDXContent.default>

package/lib-next/theme/ApiDemoPanel/MethodEndpoint/index.js

@@ -14,18 +14,21 @@ function colorForMethod(method) {
     case "get":
       return "primary";
 
-    case "put":
-      return "warning";
-
-    case "patch":
-      return "warning";
-
     case "post":
       return "success";
 
     case "delete":
       return "danger";
 
+    case "put":
+      return "info";
+
+    case "patch":
+      return "warning";
+
+    case "head":
+      return "secondary";
+
     default:
       return undefined;
   }

package/lib-next/theme/ApiDemoPanel/SecuritySchemes/index.js

@@ -5,11 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 import React from "react";
+import Link from "@docusaurus/Link";
 import { useTypedSelector } from "../hooks";
 
-function SecuritySchemes() {
+function SecuritySchemes(props) {
   const options = useTypedSelector((state) => state.auth.options);
   const selected = useTypedSelector((state) => state.auth.selected);
+  const infoAuthPath = `/${props.infoPath}#authentication`;
   if (selected === undefined) return null;
   const selectedAuth = options[selected];
   return (
@@ -27,7 +29,9 @@ function SecuritySchemes() {
         if (isApiKey || isBearer) {
           return (
             <React.Fragment key={selected}>
-              <b>Authorization: {auth.key}</b>
+              <b>
+                Authorization: <Link to={infoAuthPath}>{auth.key}</Link>
+              </b>
               <pre
                 style={{
                   display: "flex",

package/lib-next/theme/ApiDemoPanel/index.js

@@ -21,7 +21,7 @@ import Server from "./Server";
 import { createStoreWithState } from "./store";
 import styles from "./styles.module.css";
 
-function ApiDemoPanel({ item }) {
+function ApiDemoPanel({ item, infoPath }) {
   const { siteConfig } = useDocusaurusContext();
   const themeConfig = siteConfig.themeConfig;
   const options = themeConfig.api;
@@ -83,9 +83,7 @@ function ApiDemoPanel({ item }) {
     <Provider store={store2}>
       <div className={styles.apiDemoPanelContainer}>
         <MethodEndpoint method={method} path={path} />
-
-        <SecuritySchemes />
-
+        <SecuritySchemes infoPath={infoPath} />
         <div className={styles.optionsPanel}>
           <ParamOptions />
           <Body
@@ -94,11 +92,8 @@ function ApiDemoPanel({ item }) {
           />
           <Accept />
         </div>
-
         <Server />
-
         <Curl postman={postman} codeSamples={item["x-code-samples"] ?? []} />
-
         <Response />
       </div>
     </Provider>

package/lib-next/theme/ApiItem/index.js

@@ -58,6 +58,7 @@ function DocItemContent(props) {
   const { content: DocContent } = props;
   const { metadata, frontMatter } = DocContent;
   const {
+    info_path: infoPath,
     hide_title: hideTitle,
     hide_table_of_contents: hideTableOfContents,
     toc_min_heading_level: tocMinHeadingLevel,
@@ -121,7 +122,7 @@ function DocItemContent(props) {
                   </div>
                   {api && (
                     <div className="col col--5">
-                      <ApiDemoPanel item={api} />
+                      <ApiDemoPanel item={api} infoPath={infoPath} />
                     </div>
                   )}
                 </div>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "docusaurus-theme-openapi-docs",
   "description": "OpenAPI theme for Docusaurus.",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "license": "MIT",
   "keywords": [
     "openapi",
@@ -31,8 +31,8 @@
     "format:lib-next": "prettier --config ../../.prettierrc.json --write \"lib-next/**/*.{js,ts,jsx,tsc}\""
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "2.0.0-beta.18",
-    "@docusaurus/types": "2.0.0-beta.18",
+    "@docusaurus/module-type-aliases": "2.0.0-beta.21",
+    "@docusaurus/types": "2.0.0-beta.21",
     "@types/concurrently": "^6.3.0",
     "@types/crypto-js": "^4.1.0",
     "@types/fs-extra": "^9.0.13",
@@ -42,7 +42,7 @@
     "concurrently": "^5.2.0"
   },
   "dependencies": {
-    "@docusaurus/theme-common": "2.0.0-beta.18",
+    "@docusaurus/theme-common": "2.0.0-beta.21",
     "@mdx-js/react": "^1.6.21",
     "@monaco-editor/react": "^4.3.1",
     "@paloaltonetworks/postman-code-generators": "1.1.5-hotfix.5",
@@ -51,7 +51,7 @@
     "buffer": "^6.0.3",
     "clsx": "^1.1.1",
     "crypto-js": "^4.1.1",
-    "docusaurus-plugin-openapi-docs": "^1.0.2",
+    "docusaurus-plugin-openapi-docs": "^1.0.3",
     "immer": "^9.0.7",
     "lodash": "^4.17.20",
     "monaco-editor": "^0.31.1",
@@ -70,5 +70,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "526f2d10bc187bc7095ac70d5b1453b9b92c114f"
+  "gitHead": "618a438ec42148f525fb92cb11d291ce50d2ad06"
 }

package/src/theme/ApiDemoPanel/MethodEndpoint/index.tsx

@@ -15,14 +15,16 @@ function colorForMethod(method: string) {
   switch (method.toLowerCase()) {
     case "get":
       return "primary";
-    case "put":
-      return "warning";
-    case "patch":
-      return "warning";
     case "post":
       return "success";
     case "delete":
       return "danger";
+    case "put":
+      return "info";
+    case "patch":
+      return "warning";
+    case "head":
+      return "secondary";
     default:
       return undefined;
   }

package/src/theme/ApiDemoPanel/SecuritySchemes/index.tsx

@@ -7,11 +7,14 @@
 
 import React from "react";
 
+import Link from "@docusaurus/Link";
+
 import { useTypedSelector } from "../hooks";
 
-function SecuritySchemes() {
+function SecuritySchemes(props: any) {
   const options = useTypedSelector((state) => state.auth.options);
   const selected = useTypedSelector((state) => state.auth.selected);
+  const infoAuthPath = `/${props.infoPath}#authentication`;
 
   if (selected === undefined) return null;
 
@@ -28,7 +31,9 @@ function SecuritySchemes() {
         if (isApiKey || isBearer) {
           return (
             <React.Fragment key={selected}>
-              <b>Authorization: {auth.key}</b>
+              <b>
+                Authorization: <Link to={infoAuthPath}>{auth.key}</Link>
+              </b>
               <pre
                 style={{
                   display: "flex",

package/src/theme/ApiDemoPanel/index.tsx

@@ -27,7 +27,13 @@ import Server from "./Server";
 import { createStoreWithState } from "./store";
 import styles from "./styles.module.css";
 
-function ApiDemoPanel({ item }: { item: NonNullable<ApiItem> }) {
+function ApiDemoPanel({
+  item,
+  infoPath,
+}: {
+  item: NonNullable<ApiItem>;
+  infoPath: string;
+}) {
   const { siteConfig } = useDocusaurusContext();
   const themeConfig = siteConfig.themeConfig as ThemeConfig;
   const options = themeConfig.api;
@@ -89,9 +95,7 @@ function ApiDemoPanel({ item }: { item: NonNullable<ApiItem> }) {
     <Provider store={store2}>
       <div className={styles.apiDemoPanelContainer}>
         <MethodEndpoint method={method} path={path} />
-
-        <SecuritySchemes />
-
+        <SecuritySchemes infoPath={infoPath} />
         <div className={styles.optionsPanel}>
           <ParamOptions />
           <Body
@@ -100,14 +104,11 @@ function ApiDemoPanel({ item }: { item: NonNullable<ApiItem> }) {
           />
           <Accept />
         </div>
-
         <Server />
-
         <Curl
           postman={postman}
           codeSamples={(item as any)["x-code-samples"] ?? []}
         />
-
         <Response />
       </div>
     </Provider>

package/src/theme/ApiItem/index.tsx

@@ -15,7 +15,7 @@ import {
   useWindowSize,
 } from "@docusaurus/theme-common";
 import DocBreadcrumbs from "@theme/DocBreadcrumbs";
-import type { Props, FrontMatter } from "@theme/DocItem";
+import type { Props } from "@theme/DocItem";
 import DocItemFooter from "@theme/DocItemFooter";
 import DocPaginator from "@theme/DocPaginator";
 import DocVersionBadge from "@theme/DocVersionBadge";
@@ -27,14 +27,17 @@ import TOCCollapsible from "@theme/TOCCollapsible";
 import clsx from "clsx";
 import type { ApiItem as ApiItemType } from "docusaurus-plugin-openapi-docs/lib/types";
 
+import { DocFrontMatter } from "../../types";
 import styles from "./styles.module.css";
 
-let ApiDemoPanel = (_: { item: any }) => <div style={{ marginTop: "3.5em" }} />;
+let ApiDemoPanel = (_: { item: any; infoPath: any }) => (
+  <div style={{ marginTop: "3.5em" }} />
+);
 if (ExecutionEnvironment.canUseDOM) {
   ApiDemoPanel = require("@theme/ApiDemoPanel").default;
 }
 
-interface ApiFrontMatter extends FrontMatter {
+interface ApiFrontMatter extends DocFrontMatter {
   readonly api?: ApiItemType;
 }
 
@@ -52,11 +55,12 @@ function DocItemContent(props: Props): JSX.Element {
   const { content: DocContent } = props;
   const { metadata, frontMatter } = DocContent;
   const {
+    info_path: infoPath,
     hide_title: hideTitle,
     hide_table_of_contents: hideTableOfContents,
     toc_min_heading_level: tocMinHeadingLevel,
     toc_max_heading_level: tocMaxHeadingLevel,
-  } = frontMatter;
+  } = frontMatter as DocFrontMatter;
   const { title } = metadata;
 
   const { api } = frontMatter as ApiFrontMatter;
@@ -121,7 +125,7 @@ function DocItemContent(props: Props): JSX.Element {
                   </div>
                   {api && (
                     <div className="col col--5">
-                      <ApiDemoPanel item={api} />
+                      <ApiDemoPanel item={api} infoPath={infoPath} />
                     </div>
                   )}
                 </div>

package/src/types.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
+import type { FrontMatterTag } from "@docusaurus/utils";
 import type { JSONSchema4, JSONSchema6, JSONSchema7 } from "json-schema";
 
 export interface ThemeConfig {
@@ -68,3 +69,114 @@ export interface ExternalDocumentationObject {
   description?: string;
   url: string;
 }
+
+export type FileChange = {
+  author?: string;
+  /** Date can be any
+   * [parsable date string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse).
+   */
+  date?: Date | string;
+};
+
+export type DocFrontMatter = {
+  /**
+   * The last part of the doc ID (will be refactored in the future to be the
+   * full ID instead)
+   * @see {@link DocMetadata.id}
+   */
+  id?: string;
+  /**
+   * Will override the default title collected from h1 heading.
+   * @see {@link DocMetadata.title}
+   */
+  title?: string;
+  /**
+   * Front matter tags, unnormalized.
+   * @see {@link DocMetadata.tags}
+   */
+  tags?: FrontMatterTag[];
+  /**
+   * If there isn't a Markdown h1 heading (which, if there is, we don't
+   * remove), this front matter will cause the front matter title to not be
+   * displayed in the doc page.
+   */
+  hide_title?: boolean;
+  /** Hide the TOC on the right. */
+  hide_table_of_contents?: boolean;
+  /** Used in the head meta. */
+  keywords?: string[];
+  /** Used in the head meta. Should use `assets.image` in priority. */
+  image?: string;
+  /**
+   * Will override the default excerpt.
+   * @see {@link DocMetadata.description}
+   */
+  description?: string;
+  /**
+   * Custom slug appended after /<baseUrl>/<routeBasePath>/<versionPath>
+   * @see {@link DocMetadata.slug}
+   */
+  slug?: string;
+  /** Customizes the sidebar label for this doc. Will default to its title. */
+  sidebar_label?: string;
+  /**
+   * Controls the position of a doc inside the generated sidebar slice when
+   * using autogenerated sidebar items.
+   *
+   * @see https://docusaurus.io/docs/sidebar#autogenerated-sidebar-metadata
+   */
+  sidebar_position?: number;
+  /**
+   * Gives the corresponding sidebar label a special class name when using
+   * autogenerated sidebars.
+   */
+  sidebar_class_name?: string;
+  /**
+   * Will be propagated to the final sidebars data structure. Useful if you
+   * have swizzled sidebar-related code or simply querying doc data through
+   * sidebars.
+   */
+  sidebar_custom_props?: { [key: string]: unknown };
+  /**
+   * Changes the sidebar association of the current doc. Use `null` to make
+   * the current doc not associated to any sidebar.
+   */
+  displayed_sidebar?: string | null;
+  /**
+   * Customizes the pagination label for this doc. Will default to the sidebar
+   * label.
+   */
+  pagination_label?: string;
+  /** Overrides the default URL computed for this doc. */
+  custom_edit_url?: string | null;
+  /**
+   * Whether number prefix parsing is disabled on this doc.
+   * @see https://docusaurus.io/docs/sidebar#using-number-prefixes
+   */
+  parse_number_prefixes?: boolean;
+  /**
+   * Minimum TOC heading level. Must be between 2 and 6 and lower or equal to
+   * the max value.
+   */
+  toc_min_heading_level?: number;
+  /** Maximum TOC heading level. Must be between 2 and 6. */
+  toc_max_heading_level?: number;
+  /**
+   * The ID of the documentation you want the "Next" pagination to link to.
+   * Use `null` to disable showing "Next" for this page.
+   * @see {@link DocMetadata.next}
+   */
+  pagination_next?: string | null;
+  /**
+   * The ID of the documentation you want the "Previous" pagination to link
+   * to. Use `null` to disable showing "Previous" for this page.
+   * @see {@link DocMetadata.prev}
+   */
+  pagination_prev?: string | null;
+  /** Should this doc be excluded from production builds? */
+  draft?: boolean;
+  /** Allows overriding the last updated author and/or date. */
+  last_update?: FileChange;
+  /** Provides OpenAPI Docs with a reference path to their respective Info Doc */
+  info_path?: string;
+};