docusaurus-theme-openapi-docs 2.0.0-beta.4 → 2.0.0

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

@@ -202,7 +202,10 @@ function Body({
   let defaultBody = ""; //"body content";
   let exampleBody;
   let examplesBodies = [];
-  if (contentType === "application/json" || contentType.endsWith("+json")) {
+  if (
+    contentType.includes("application/json") ||
+    contentType.endsWith("+json")
+  ) {
     if (jsonRequestBodyExample) {
       defaultBody = JSON.stringify(jsonRequestBodyExample, null, 2);
     }

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

@@ -66,15 +66,16 @@ function MethodEndpoint({ method, path }) {
       react_1.default.createElement(
         "span",
         { className: "badge badge--" + colorForMethod(method) },
-        method.toUpperCase()
+        method === "event" ? "Webhook" : method.toUpperCase()
       ),
       " ",
-      react_1.default.createElement(
-        "h2",
-        { className: "openapi__method-endpoint-path" },
-        renderServerUrl(),
-        `${path.replace(/{([a-z0-9-_]+)}/gi, ":$1")}`
-      )
+      method !== "event" &&
+        react_1.default.createElement(
+          "h2",
+          { className: "openapi__method-endpoint-path" },
+          renderServerUrl(),
+          `${path.replace(/{([a-z0-9-_]+)}/gi, ":$1")}`
+        )
     ),
     react_1.default.createElement("div", { className: "openapi__divider" })
   );

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

@@ -235,6 +235,7 @@ function Request({ item }) {
         "div",
         { className: "openapi-explorer__details-outer-container" },
         showServerOptions &&
+          item.method !== "event" &&
           react_1.default.createElement(
             "details",
             {
@@ -351,6 +352,7 @@ function Request({ item }) {
             react_1.default.createElement(Accept_1.default, null)
           ),
         showRequestButton &&
+          item.method !== "event" &&
           react_1.default.createElement(
             "button",
             { className: "openapi-explorer__request-btn", type: "submit" },

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

@@ -79,3 +79,41 @@
 .openapi-response__status-headers {
   margin-left: -1rem;
 }
+
+/* loading spinner */
+.openapi-response__lds-ring {
+  display: inline-block;
+  position: relative;
+  width: 80px;
+  height: 80px;
+}
+.openapi-response__lds-ring div {
+  box-sizing: border-box;
+  display: block;
+  position: absolute;
+  width: 64px;
+  height: 64px;
+  margin: 8px;
+  border: 5px solid #dfc;
+  border-radius: 50%;
+  animation: openapi-response__lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1)
+    infinite;
+  border-color: var(--ifm-color-primary) transparent transparent transparent;
+}
+.openapi-response__lds-ring div:nth-child(1) {
+  animation-delay: -0.45s;
+}
+.openapi-response__lds-ring div:nth-child(2) {
+  animation-delay: -0.3s;
+}
+.openapi-response__lds-ring div:nth-child(3) {
+  animation-delay: -0.15s;
+}
+@keyframes openapi-response__lds-ring {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}

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

@@ -14,7 +14,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const theme_common_1 = require("@docusaurus/theme-common");
 const internal_1 = require("@docusaurus/theme-common/internal");
-const react_2 = require("@nextui-org/react");
 const ApiCodeBlock_1 = __importDefault(
   require("@theme/ApiExplorer/ApiCodeBlock")
 );
@@ -169,7 +168,14 @@ function Response({ item }) {
         ? react_1.default.createElement(
             "div",
             { className: "openapi-explorer__loading-container" },
-            react_1.default.createElement(react_2.Loading, { color: "success" })
+            react_1.default.createElement(
+              "div",
+              { className: "openapi-response__lds-ring" },
+              react_1.default.createElement("div", null),
+              react_1.default.createElement("div", null),
+              react_1.default.createElement("div", null),
+              react_1.default.createElement("div", null)
+            )
           )
         : react_1.default.createElement(
             "p",

package/lib/theme/ApiExplorer/index.js

@@ -25,10 +25,11 @@ function ApiExplorer({ item, infoPath }) {
   return react_1.default.createElement(
     react_1.default.Fragment,
     null,
-    react_1.default.createElement(CodeSnippets_1.default, {
-      postman: postman,
-      codeSamples: item["x-code-samples"] ?? [],
-    }),
+    item.method !== "event" &&
+      react_1.default.createElement(CodeSnippets_1.default, {
+        postman: postman,
+        codeSamples: item["x-code-samples"] ?? [],
+      }),
     react_1.default.createElement(Request_1.default, { item: item }),
     react_1.default.createElement(Response_1.default, { item: item })
   );

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "docusaurus-theme-openapi-docs",
   "description": "OpenAPI theme for Docusaurus.",
-  "version": "2.0.0-beta.4",
+  "version": "2.0.0",
   "license": "MIT",
   "keywords": [
     "openapi",
@@ -28,23 +28,22 @@
     "watch": "concurrently --names \"lib,lib-next,tsc\" --kill-others \"yarn babel:lib --watch\" \"yarn babel:lib-next --watch\" \"yarn tsc --watch\""
   },
   "devDependencies": {
-    "@docusaurus/types": ">=2.3.0 <2.5.0",
+    "@docusaurus/types": ">=2.4.1 <=2.4.3",
     "@types/crypto-js": "^4.1.0",
     "@types/file-saver": "^2.0.5",
     "@types/lodash": "^4.14.176",
     "concurrently": "^5.2.0"
   },
   "dependencies": {
-    "@docusaurus/theme-common": ">=2.3.0 <2.5.0",
+    "@docusaurus/theme-common": ">=2.4.1 <=2.4.3",
     "@hookform/error-message": "^2.0.1",
-    "@nextui-org/react": "^1.0.0-beta.12",
     "@paloaltonetworks/postman-code-generators": "1.1.15-patch.2",
     "@paloaltonetworks/postman-collection": "^4.1.0",
     "@reduxjs/toolkit": "^1.7.1",
     "clsx": "^1.1.1",
     "copy-text-to-clipboard": "^3.1.0",
     "crypto-js": "^4.1.1",
-    "docusaurus-plugin-openapi-docs": "^2.0.0-beta.4",
+    "docusaurus-plugin-openapi-docs": "^2.0.0",
     "docusaurus-plugin-sass": "^0.2.3",
     "file-saver": "^2.0.5",
     "lodash": "^4.17.20",
@@ -58,15 +57,16 @@
     "react-redux": "^7.2.0",
     "rehype-raw": "^6.1.1",
     "sass": "^1.58.1",
+    "sass-loader": "^13.3.2",
     "webpack": "^5.61.0",
     "xml-formatter": "^2.6.1"
   },
   "peerDependencies": {
-    "react": "^16.8.4 || ^17.0.0",
-    "react-dom": "^16.8.4 || ^17.0.0"
+    "react": "^16.8.4 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^16.8.4 || ^17.0.0 || ^18.0.0"
   },
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "d7c1319c7977c3e7c54827b3950e5c9b66106e30"
+  "gitHead": "ec57fe9cac964cff00f5433fb829ce2d6219da7e"
 }

package/src/theme/ApiExplorer/Body/index.tsx

@@ -114,7 +114,6 @@ function Body({
       </FormItem>
     );
   }
-
   if (
     (contentType === "multipart/form-data" ||
       contentType === "application/x-www-form-urlencoded") &&
@@ -221,7 +220,10 @@ function Body({
   let exampleBody;
   let examplesBodies = [] as any;
 
-  if (contentType === "application/json" || contentType.endsWith("+json")) {
+  if (
+    contentType.includes("application/json") ||
+    contentType.endsWith("+json")
+  ) {
     if (jsonRequestBodyExample) {
       defaultBody = JSON.stringify(jsonRequestBodyExample, null, 2);
     }

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

@@ -70,12 +70,14 @@ function MethodEndpoint({ method, path }: Props) {
     <>
       <pre className="openapi__method-endpoint">
         <span className={"badge badge--" + colorForMethod(method)}>
-          {method.toUpperCase()}
+          {method === "event" ? "Webhook" : method.toUpperCase()}
         </span>{" "}
-        <h2 className="openapi__method-endpoint-path">
-          {renderServerUrl()}
-          {`${path.replace(/{([a-z0-9-_]+)}/gi, ":$1")}`}
-        </h2>
+        {method !== "event" && (
+          <h2 className="openapi__method-endpoint-path">
+            {renderServerUrl()}
+            {`${path.replace(/{([a-z0-9-_]+)}/gi, ":$1")}`}
+          </h2>
+        )}
       </pre>
       <div className="openapi__divider" />
     </>

package/src/theme/ApiExplorer/Request/index.tsx

@@ -173,7 +173,7 @@ function Request({ item }: { item: NonNullable<ApiItem> }) {
           )}
         </div>
         <div className="openapi-explorer__details-outer-container">
-          {showServerOptions && (
+          {showServerOptions && item.method !== "event" && (
             <details
               open={expandServer}
               className="openapi-explorer__details-container"
@@ -272,7 +272,7 @@ function Request({ item }: { item: NonNullable<ApiItem> }) {
               <Accept />
             </details>
           )}
-          {showRequestButton && (
+          {showRequestButton && item.method !== "event" && (
             <button className="openapi-explorer__request-btn" type="submit">
               Send API Request
             </button>

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

@@ -79,3 +79,41 @@
 .openapi-response__status-headers {
   margin-left: -1rem;
 }
+
+/* loading spinner */
+.openapi-response__lds-ring {
+  display: inline-block;
+  position: relative;
+  width: 80px;
+  height: 80px;
+}
+.openapi-response__lds-ring div {
+  box-sizing: border-box;
+  display: block;
+  position: absolute;
+  width: 64px;
+  height: 64px;
+  margin: 8px;
+  border: 5px solid #dfc;
+  border-radius: 50%;
+  animation: openapi-response__lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1)
+    infinite;
+  border-color: var(--ifm-color-primary) transparent transparent transparent;
+}
+.openapi-response__lds-ring div:nth-child(1) {
+  animation-delay: -0.45s;
+}
+.openapi-response__lds-ring div:nth-child(2) {
+  animation-delay: -0.3s;
+}
+.openapi-response__lds-ring div:nth-child(3) {
+  animation-delay: -0.15s;
+}
+@keyframes openapi-response__lds-ring {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}

package/src/theme/ApiExplorer/Response/index.tsx

@@ -9,7 +9,6 @@ import React from "react";
 
 import { usePrismTheme } from "@docusaurus/theme-common";
 import { useDoc } from "@docusaurus/theme-common/internal";
-import { Loading } from "@nextui-org/react";
 import ApiCodeBlock from "@theme/ApiExplorer/ApiCodeBlock";
 import { useTypedDispatch, useTypedSelector } from "@theme/ApiItem/hooks";
 import SchemaTabs from "@theme/SchemaTabs";
@@ -134,7 +133,12 @@ function Response({ item }: { item: NonNullable<ApiItem> }) {
           </SchemaTabs>
         ) : prettyResponse === "Fetching..." ? (
           <div className="openapi-explorer__loading-container">
-            <Loading color="success" />
+            <div className="openapi-response__lds-ring">
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+            </div>
           </div>
         ) : (
           <p className="openapi-explorer__response-placeholder-message">

package/src/theme/ApiExplorer/index.tsx

@@ -24,10 +24,12 @@ function ApiExplorer({
 
   return (
     <>
-      <CodeSnippets
-        postman={postman}
-        codeSamples={(item as any)["x-code-samples"] ?? []}
-      />
+      {item.method !== "event" && (
+        <CodeSnippets
+          postman={postman}
+          codeSamples={(item as any)["x-code-samples"] ?? []}
+        />
+      )}
       <Request item={item} />
       <Response item={item} />
     </>