docusaurus-theme-openapi-docs 3.0.0-beta.9 → 3.0.1

package/lib/theme/ApiExplorer/Body/slice.d.ts

@@ -26,18 +26,18 @@ export interface EmptyBody {
 }
 export type Body = EmptyBody | FormBody | RawBody;
 export type State = Body;
-export declare const slice: import("@reduxjs/toolkit").Slice<EmptyBody | FormBody | RawBody, {
-    clearRawBody: (_state: import("immer/dist/internal").WritableDraft<EmptyBody> | import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody>) => {
+export declare const slice: import("@reduxjs/toolkit").Slice<FormBody | RawBody | EmptyBody, {
+    clearRawBody: (_state: import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody> | import("immer/dist/internal").WritableDraft<EmptyBody>) => {
         type: "empty";
     };
-    setStringRawBody: (_state: import("immer/dist/internal").WritableDraft<EmptyBody> | import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody>, action: PayloadAction<string>) => {
+    setStringRawBody: (_state: import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody> | import("immer/dist/internal").WritableDraft<EmptyBody>, action: PayloadAction<string>) => {
         type: "raw";
         content: {
             type: "string";
             value: string;
         };
     };
-    setFileRawBody: (_state: import("immer/dist/internal").WritableDraft<EmptyBody> | import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody>, action: PayloadAction<FileContent["value"]>) => {
+    setFileRawBody: (_state: import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody> | import("immer/dist/internal").WritableDraft<EmptyBody>, action: PayloadAction<FileContent["value"]>) => {
         type: "raw";
         content: {
             type: "file";
@@ -47,12 +47,12 @@ export declare const slice: import("@reduxjs/toolkit").Slice<EmptyBody | FormBod
             };
         };
     };
-    clearFormBodyKey: (state: import("immer/dist/internal").WritableDraft<EmptyBody> | import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody>, action: PayloadAction<string>) => void;
-    setStringFormBody: (state: import("immer/dist/internal").WritableDraft<EmptyBody> | import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody>, action: PayloadAction<{
+    clearFormBodyKey: (state: import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody> | import("immer/dist/internal").WritableDraft<EmptyBody>, action: PayloadAction<string>) => void;
+    setStringFormBody: (state: import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody> | import("immer/dist/internal").WritableDraft<EmptyBody>, action: PayloadAction<{
         key: string;
         value: string;
     }>) => import("immer/dist/internal").WritableDraft<FormBody>;
-    setFileFormBody: (state: import("immer/dist/internal").WritableDraft<EmptyBody> | import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody>, action: PayloadAction<{
+    setFileFormBody: (state: import("immer/dist/internal").WritableDraft<FormBody> | import("immer/dist/internal").WritableDraft<RawBody> | import("immer/dist/internal").WritableDraft<EmptyBody>, action: PayloadAction<{
         key: string;
         value: FileContent["value"];
     }>) => import("immer/dist/internal").WritableDraft<FormBody> | {
@@ -78,5 +78,5 @@ export declare const clearRawBody: import("@reduxjs/toolkit").ActionCreatorWitho
     key: string;
     value: FileContent["value"];
 }, "body/setFileFormBody">;
-declare const _default: import("redux").Reducer<EmptyBody | FormBody | RawBody, import("redux").AnyAction>;
+declare const _default: import("redux").Reducer<FormBody | RawBody | EmptyBody, import("redux").AnyAction>;
 export default _default;

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

@@ -1,5 +1,5 @@
 import React from "react";
-import sdk from "@paloaltonetworks/postman-collection";
+import sdk from "postman-collection";
 import { CodeSample, Language } from "./code-snippets-types";
 export declare const languageSet: Language[];
 export interface Props {

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

@@ -56,13 +56,16 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.languageSet = void 0;
+/* ============================================================================
+ * 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.
+ * ========================================================================== */
 const react_1 = __importStar(require("react"));
 const useDocusaurusContext_1 = __importDefault(
   require("@docusaurus/useDocusaurusContext")
 );
-const postman_code_generators_1 = __importDefault(
-  require("@paloaltonetworks/postman-code-generators")
-);
 const ApiCodeBlock_1 = __importDefault(
   require("@theme/ApiExplorer/ApiCodeBlock")
 );
@@ -71,7 +74,9 @@ const buildPostmanRequest_1 = __importDefault(
 );
 const CodeTabs_1 = __importDefault(require("@theme/ApiExplorer/CodeTabs"));
 const hooks_1 = require("@theme/ApiItem/hooks");
-const merge_1 = __importDefault(require("lodash/merge"));
+const postman_code_generators_1 = __importDefault(
+  require("postman-code-generators")
+);
 const languages_1 = require("./languages");
 exports.languageSet = [
   {
@@ -193,7 +198,6 @@ function CodeTab({ children, hidden, className }) {
   );
 }
 function CodeSnippets({ postman, codeSamples }) {
-  // TODO: match theme for vscode.
   const { siteConfig } = (0, useDocusaurusContext_1.default)();
   const contentType = (0, hooks_1.useTypedSelector)(
     (state) => state.contentType.value
@@ -216,18 +220,20 @@ function CodeSnippets({ postman, codeSamples }) {
   const auth = (0, hooks_1.useTypedSelector)((state) => state.auth);
   // User-defined languages array
   // Can override languageSet, change order of langs, override options and variants
-  const langs = [
-    ...(siteConfig?.themeConfig?.languageTabs ?? exports.languageSet),
-  ];
+  const userDefinedLanguageSet =
+    siteConfig?.themeConfig?.languageTabs ?? exports.languageSet;
   // Filter languageSet by user-defined langs
   const filteredLanguageSet = exports.languageSet.filter((ls) => {
-    return langs.some((lang) => {
+    return userDefinedLanguageSet?.some((lang) => {
       return lang.language === ls.language;
     });
   });
   // Merge user-defined langs into languageSet
   const mergedLangs = (0, languages_1.mergeCodeSampleLanguage)(
-    (0, merge_1.default)(filteredLanguageSet, langs),
+    (0, languages_1.mergeArraysbyLanguage)(
+      userDefinedLanguageSet,
+      filteredLanguageSet
+    ),
     codeSamples
   );
   // Read defaultLang from localStorage

package/lib/theme/ApiExplorer/CodeSnippets/languages.d.ts

@@ -1,3 +1,4 @@
 import { CodeSample, Language } from "./code-snippets-types";
 export declare function mergeCodeSampleLanguage(languages: Language[], codeSamples: CodeSample[]): Language[];
+export declare const mergeArraysbyLanguage: (arr1: any, arr2: any) => any[];
 export declare function getCodeSampleSourceFromLanguage(language: Language): string;

package/lib/theme/ApiExplorer/CodeSnippets/languages.js

@@ -5,9 +5,20 @@
  * 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 });
-exports.getCodeSampleSourceFromLanguage = exports.mergeCodeSampleLanguage =
-  void 0;
+exports.getCodeSampleSourceFromLanguage =
+  exports.mergeArraysbyLanguage =
+  exports.mergeCodeSampleLanguage =
+    void 0;
+const find_1 = __importDefault(require("lodash/find"));
+const isArray_1 = __importDefault(require("lodash/isArray"));
+const mergeWith_1 = __importDefault(require("lodash/mergeWith"));
+const unionBy_1 = __importDefault(require("lodash/unionBy"));
 function mergeCodeSampleLanguage(languages, codeSamples) {
   return languages.map((language) => {
     const languageCodeSamples = codeSamples.filter(
@@ -31,6 +42,22 @@ function mergeCodeSampleLanguage(languages, codeSamples) {
   });
 }
 exports.mergeCodeSampleLanguage = mergeCodeSampleLanguage;
+const mergeArraysbyLanguage = (arr1, arr2) => {
+  const mergedArray = (0, unionBy_1.default)(arr1, arr2, "language");
+  return mergedArray.map((item) => {
+    const matchingItems = [
+      (0, find_1.default)(arr1, ["language", item["language"]]),
+      (0, find_1.default)(arr2, ["language", item["language"]]),
+    ];
+    return (0, mergeWith_1.default)({}, ...matchingItems, (objValue) => {
+      if ((0, isArray_1.default)(objValue)) {
+        return objValue;
+      }
+      return undefined;
+    });
+  });
+};
+exports.mergeArraysbyLanguage = mergeArraysbyLanguage;
 function getCodeSampleSourceFromLanguage(language) {
   if (
     language &&

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

@@ -58,9 +58,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // @ts-nocheck
 const react_1 = __importStar(require("react"));
 const internal_1 = require("@docusaurus/theme-common/internal");
-const postman_collection_1 = __importDefault(
-  require("@paloaltonetworks/postman-collection")
-);
 const Accept_1 = __importDefault(require("@theme/ApiExplorer/Accept"));
 const Authorization_1 = __importDefault(
   require("@theme/ApiExplorer/Authorization")
@@ -78,6 +75,7 @@ const ParamOptions_1 = __importDefault(
 const slice_1 = require("@theme/ApiExplorer/Response/slice");
 const Server_1 = __importDefault(require("@theme/ApiExplorer/Server"));
 const hooks_1 = require("@theme/ApiItem/hooks");
+const postman_collection_1 = __importDefault(require("postman-collection"));
 const react_hook_form_1 = require("react-hook-form");
 const makeRequest_1 = __importDefault(require("./makeRequest"));
 function Request({ item }) {

package/lib/theme/ApiExplorer/Request/makeRequest.d.ts

@@ -1,4 +1,4 @@
-import sdk from "@paloaltonetworks/postman-collection";
 import { Body } from "@theme/ApiExplorer/Body/slice";
+import sdk from "postman-collection";
 declare function makeRequest(request: sdk.Request, proxy: string | undefined, _body: Body): Promise<any>;
 export default makeRequest;

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

@@ -101,7 +101,10 @@ function Response({ item }) {
       "div",
       {
         style: {
-          backgroundColor: prismTheme.plain.backgroundColor,
+          backgroundColor:
+            code && prettyResponse !== "Fetching..."
+              ? prismTheme.plain.backgroundColor
+              : "transparent",
           paddingLeft: "1rem",
           paddingTop: "1rem",
           ...((prettyResponse === "Fetching..." || !code) && {

package/lib/theme/ApiExplorer/buildPostmanRequest.d.ts

@@ -1,7 +1,7 @@
-import sdk from "@paloaltonetworks/postman-collection";
 import { AuthState } from "@theme/ApiExplorer/Authorization/slice";
 import { Body } from "@theme/ApiExplorer/Body/slice";
 import { ParameterObject, ServerObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
+import sdk from "postman-collection";
 type Param = {
     value?: string | string[];
 } & ParameterObject;

package/lib/theme/ApiExplorer/buildPostmanRequest.js

@@ -11,10 +11,8 @@ var __importDefault =
     return mod && mod.__esModule ? mod : { default: mod };
   };
 Object.defineProperty(exports, "__esModule", { value: true });
-const postman_collection_1 = __importDefault(
-  require("@paloaltonetworks/postman-collection")
-);
 const cloneDeep_1 = __importDefault(require("lodash/cloneDeep"));
+const postman_collection_1 = __importDefault(require("postman-collection"));
 function setQueryParams(postman, queryParams) {
   postman.url.query.clear();
   const qp = queryParams

package/lib/theme/ApiExplorer/index.js

@@ -12,14 +12,12 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
-const postman_collection_1 = __importDefault(
-  require("@paloaltonetworks/postman-collection")
-);
 const CodeSnippets_1 = __importDefault(
   require("@theme/ApiExplorer/CodeSnippets")
 );
 const Request_1 = __importDefault(require("@theme/ApiExplorer/Request"));
 const Response_1 = __importDefault(require("@theme/ApiExplorer/Response"));
+const postman_collection_1 = __importDefault(require("postman-collection"));
 function ApiExplorer({ item, infoPath }) {
   const postman = new postman_collection_1.default.Request(item.postman);
   return react_1.default.createElement(

package/lib/theme/ApiExplorer/persistanceMiddleware.js

@@ -32,12 +32,12 @@ function createPersistanceMiddleware(options) {
       }
     }
     // TODO: determine way to rehydrate without flashing
-    // if (action.type === "contentType/setContentType") {
-    //   storage.setItem("contentType", action.payload);
-    // }
-    // if (action.type === "accept/setAccept") {
-    //   storage.setItem("accept", action.payload);
-    // }
+    if (action.type === "contentType/setContentType") {
+      storage.setItem("contentType", action.payload);
+    }
+    if (action.type === "accept/setAccept") {
+      storage.setItem("accept", action.payload);
+    }
     if (action.type === "server/setServer") {
       storage.setItem("server", action.payload);
     }

package/lib/theme/ApiItem/Layout/index.js

@@ -77,16 +77,29 @@ function DocItemLayout({ children }) {
           react_1.default.createElement(Content_1.default, null, children),
           react_1.default.createElement(
             "div",
-            {
-              className: (0, clsx_1.default)("col", api ? "col--7" : "col--12"),
-            },
-            react_1.default.createElement(Footer_1.default, null)
+            { className: "row" },
+            react_1.default.createElement(
+              "div",
+              {
+                className: (0, clsx_1.default)(
+                  "col",
+                  api ? "col--7" : "col--12"
+                ),
+              },
+              react_1.default.createElement(Footer_1.default, null)
+            )
           )
         ),
         react_1.default.createElement(
           "div",
-          { className: (0, clsx_1.default)("col", api ? "col--7" : "col--12") },
-          react_1.default.createElement(Paginator_1.default, null)
+          { className: "row" },
+          react_1.default.createElement(
+            "div",
+            {
+              className: (0, clsx_1.default)("col", api ? "col--7" : "col--12"),
+            },
+            react_1.default.createElement(Paginator_1.default, null)
+          )
         )
       )
     ),

package/lib/theme/ApiItem/index.js

@@ -44,9 +44,11 @@ function ApiItem(props) {
   const { schema } = frontMatter;
   // decompress and parse
   if (api) {
-    api = JSON.parse(
-      zlib_1.default.inflateSync(Buffer.from(api, "base64")).toString()
-    );
+    try {
+      api = JSON.parse(
+        zlib_1.default.inflateSync(Buffer.from(api, "base64")).toString()
+      );
+    } catch {}
   }
   const { siteConfig } = (0, useDocusaurusContext_1.default)();
   const themeConfig = siteConfig.themeConfig;
@@ -205,7 +207,7 @@ function ApiItem(props) {
           { className: "row" },
           react_1.default.createElement(
             "div",
-            { className: "col col--12" },
+            { className: "col col--12 markdown" },
             react_1.default.createElement(MDXComponent, null)
           )
         )

package/lib/theme/ApiTabs/_ApiTabs.scss

@@ -87,6 +87,7 @@
   overflow-y: hidden;
   overflow-x: scroll;
   scroll-behavior: smooth;
+  scrollbar-width: none;
 }
 
 .openapi-tabs__response-list-container::-webkit-scrollbar {

package/lib/theme/DiscriminatorTabs/_DiscriminatorTabs.scss

@@ -59,6 +59,7 @@
   overflow-y: hidden;
   overflow-x: scroll;
   scroll-behavior: smooth;
+  scrollbar-width: none;
 }
 
 .openapi-tabs__discriminator-list-container::-webkit-scrollbar {

package/lib/theme/MimeTabs/_MimeTabs.scss

@@ -45,6 +45,7 @@
   overflow-y: hidden;
   overflow-x: scroll;
   scroll-behavior: smooth;
+  scrollbar-width: none;
 
   &::-webkit-scrollbar {
     display: none;

package/lib/theme/MimeTabs/index.js

@@ -58,7 +58,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const internal_1 = require("@docusaurus/theme-common/internal");
 const useIsBrowser_1 = __importDefault(require("@docusaurus/useIsBrowser"));
-const slice_1 = __importDefault(require("@theme/ApiExplorer/Accept/slice"));
+const slice_1 = require("@theme/ApiExplorer/Accept/slice");
 const slice_2 = require("@theme/ApiExplorer/ContentType/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
 const clsx_1 = __importDefault(require("clsx"));
@@ -105,7 +105,7 @@ function TabList({
       if (isRequestSchema) {
         dispatch((0, slice_2.setContentType)(newTabValue));
       } else {
-        dispatch((0, slice_1.default)(newTabValue));
+        dispatch((0, slice_1.setAccept)(newTabValue));
       }
       blockElementScrollPositionUntilNextRender(newTab);
       selectValue(newTabValue);

package/lib/theme/OperationTabs/_OperationTabs.scss

@@ -47,6 +47,7 @@
   overflow-y: hidden;
   overflow-x: scroll;
   scroll-behavior: smooth;
+  scrollbar-width: none;
 
   &::-webkit-scrollbar {
     display: none;

package/lib/theme/SchemaTabs/_SchemaTabs.scss

@@ -38,6 +38,7 @@
   overflow-y: hidden;
   overflow-x: scroll;
   scroll-behavior: smooth;
+  scrollbar-width: none;
 
   &::-webkit-scrollbar {
     display: none;

package/lib/theme/SchemaTabs/index.js

@@ -114,11 +114,17 @@ function TabList({ className, block, selectedValue, selectValue, tabValues }) {
       resizeObserver.disconnect();
     };
   }, []);
-  const handleRightClick = () => {
-    tabItemListContainerRef.current.scrollLeft += 90;
+  const handleRightClick = (e) => {
+    e.preventDefault();
+    if (tabItemListContainerRef.current) {
+      tabItemListContainerRef.current.scrollLeft += 90;
+    }
   };
-  const handleLeftClick = () => {
-    tabItemListContainerRef.current.scrollLeft -= 90;
+  const handleLeftClick = (e) => {
+    e.preventDefault();
+    if (tabItemListContainerRef.current) {
+      tabItemListContainerRef.current.scrollLeft -= 90;
+    }
   };
   return react_1.default.createElement(
     "div",

package/lib/theme/styles.scss

@@ -130,22 +130,22 @@
 
 /* Version button */
 
-// .version-button div {
-//   display: block;
-// }
+.version-button div {
+  display: block;
+}
 
-// .version-button div > button > span::after {
-//   border-color: currentcolor transparent;
-//   border-style: solid;
-//   border-width: 0.4em 0.4em 0;
-//   content: "";
-//   margin-left: 0.3em;
-//   position: relative;
-//   transform: translateY(-50%);
-//   display: inline-block;
-//   font-size: 0.8rem;
-//   top: 1px;
-// }
+.version-button div > button > span::after {
+  border-color: currentcolor transparent;
+  border-style: solid;
+  border-width: 0.4em 0.4em 0;
+  content: "";
+  margin-left: 0.3em;
+  position: relative;
+  transform: translateY(-50%);
+  display: inline-block;
+  font-size: 0.8rem;
+  top: 1px;
+}
 
 .openapi__logo {
   width: 250px;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "docusaurus-theme-openapi-docs",
   "description": "OpenAPI theme for Docusaurus.",
-  "version": "3.0.0-beta.9",
+  "version": "3.0.1",
   "license": "MIT",
   "keywords": [
     "openapi",
@@ -38,17 +38,17 @@
   "dependencies": {
     "@docusaurus/theme-common": "^3.0.1",
     "@hookform/error-message": "^2.0.1",
-    "@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": "^3.0.0-beta.9",
+    "docusaurus-plugin-openapi-docs": "^3.0.1",
     "docusaurus-plugin-sass": "^0.2.3",
     "file-saver": "^2.0.5",
     "lodash": "^4.17.20",
     "node-polyfill-webpack-plugin": "^2.0.1",
+    "postman-code-generators": "^1.10.1",
+    "postman-collection": "^4.4.0",
     "prism-react-renderer": "^2.3.0",
     "react-hook-form": "^7.43.8",
     "react-live": "^4.0.0",
@@ -69,5 +69,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "ab5f392ee23f45e99e78121f7d799128fe950ae3"
+  "gitHead": "5f6e43a2b1fcc1c266941879cb73365eb3d68e5a"
 }

package/src/postman-code-generators.d.ts

@@ -6,4 +6,4 @@
  * ========================================================================== */
 
 // TODO: Remove this when https://github.com/facebook/docusaurus/issues/6087 is resolved.
-declare module "@paloaltonetworks/postman-code-generators";
+declare module "postman-code-generators";

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

@@ -5,20 +5,27 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
+/* ============================================================================
+ * 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.
+ * ========================================================================== */
+
 import React, { useState, useEffect } from "react";
 
 import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
-import codegen from "@paloaltonetworks/postman-code-generators";
-import sdk from "@paloaltonetworks/postman-collection";
 import ApiCodeBlock from "@theme/ApiExplorer/ApiCodeBlock";
 import buildPostmanRequest from "@theme/ApiExplorer/buildPostmanRequest";
 import CodeTabs from "@theme/ApiExplorer/CodeTabs";
 import { useTypedSelector } from "@theme/ApiItem/hooks";
-import merge from "lodash/merge";
+import codegen from "postman-code-generators";
+import sdk from "postman-collection";
 
 import { CodeSample, Language } from "./code-snippets-types";
 import {
   getCodeSampleSourceFromLanguage,
+  mergeArraysbyLanguage,
   mergeCodeSampleLanguage,
 } from "./languages";
 
@@ -149,8 +156,6 @@ function CodeTab({ children, hidden, className }: any): JSX.Element {
 }
 
 function CodeSnippets({ postman, codeSamples }: Props) {
-  // TODO: match theme for vscode.
-
   const { siteConfig } = useDocusaurusContext();
 
   const contentType = useTypedSelector((state: any) => state.contentType.value);
@@ -167,21 +172,20 @@ function CodeSnippets({ postman, codeSamples }: Props) {
 
   // User-defined languages array
   // Can override languageSet, change order of langs, override options and variants
-  const langs = [
-    ...((siteConfig?.themeConfig?.languageTabs as Language[] | undefined) ??
-      languageSet),
-  ];
+  const userDefinedLanguageSet =
+    (siteConfig?.themeConfig?.languageTabs as Language[] | undefined) ??
+    languageSet;
 
   // Filter languageSet by user-defined langs
   const filteredLanguageSet = languageSet.filter((ls) => {
-    return langs.some((lang) => {
+    return userDefinedLanguageSet?.some((lang) => {
       return lang.language === ls.language;
     });
   });
 
   // Merge user-defined langs into languageSet
   const mergedLangs = mergeCodeSampleLanguage(
-    merge(filteredLanguageSet, langs),
+    mergeArraysbyLanguage(userDefinedLanguageSet, filteredLanguageSet),
     codeSamples
   );
 

package/src/theme/ApiExplorer/CodeSnippets/languages.ts

@@ -5,6 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
+import find from "lodash/find";
+import isArray from "lodash/isArray";
+import mergeWith from "lodash/mergeWith";
+import unionBy from "lodash/unionBy";
+
 import { CodeSample, Language } from "./code-snippets-types";
 
 export function mergeCodeSampleLanguage(
@@ -36,6 +41,23 @@ export function mergeCodeSampleLanguage(
   });
 }
 
+export const mergeArraysbyLanguage = (arr1: any, arr2: any) => {
+  const mergedArray = unionBy(arr1, arr2, "language");
+
+  return mergedArray.map((item: any) => {
+    const matchingItems = [
+      find(arr1, ["language", item["language"]]),
+      find(arr2, ["language", item["language"]]),
+    ];
+    return mergeWith({}, ...matchingItems, (objValue: any) => {
+      if (isArray(objValue)) {
+        return objValue;
+      }
+      return undefined;
+    });
+  });
+};
+
 export function getCodeSampleSourceFromLanguage(language: Language) {
   if (
     language &&

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

@@ -9,7 +9,6 @@
 import React, { useState } from "react";
 
 import { useDoc } from "@docusaurus/theme-common/internal";
-import sdk from "@paloaltonetworks/postman-collection";
 import Accept from "@theme/ApiExplorer/Accept";
 import Authorization from "@theme/ApiExplorer/Authorization";
 import Body from "@theme/ApiExplorer/Body";
@@ -27,6 +26,7 @@ import Server from "@theme/ApiExplorer/Server";
 import { useTypedDispatch, useTypedSelector } from "@theme/ApiItem/hooks";
 import { ParameterObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
 import { ApiItem } from "docusaurus-plugin-openapi-docs/src/types";
+import sdk from "postman-collection";
 import { FormProvider, useForm } from "react-hook-form";
 
 import makeRequest from "./makeRequest";

package/src/theme/ApiExplorer/Request/makeRequest.ts

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
-import sdk from "@paloaltonetworks/postman-collection";
 import { Body } from "@theme/ApiExplorer/Body/slice";
+import sdk from "postman-collection";
 
 function fetchWithtimeout(
   url: string,

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

@@ -88,7 +88,10 @@ function Response({ item }: { item: NonNullable<ApiItem> }) {
       </div>
       <div
         style={{
-          backgroundColor: prismTheme.plain.backgroundColor,
+          backgroundColor:
+            code && prettyResponse !== "Fetching..."
+              ? prismTheme.plain.backgroundColor
+              : "transparent",
           paddingLeft: "1rem",
           paddingTop: "1rem",
           ...((prettyResponse === "Fetching..." || !code) && {