docusaurus-theme-openapi-docs 0.0.0-619 → 0.0.0-685

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

@@ -1,292 +0,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.
- * ========================================================================== */
-
-import React, { useState, useEffect } from "react";
-import { nanoid } from "@reduxjs/toolkit";
-import FormItem from "@theme/ApiDemoPanel/FormItem";
-import FormMultiSelect from "@theme/ApiDemoPanel/FormMultiSelect";
-import FormSelect from "@theme/ApiDemoPanel/FormSelect";
-import FormTextInput from "@theme/ApiDemoPanel/FormTextInput";
-import { useTypedDispatch, useTypedSelector } from "@theme/ApiItem/hooks";
-import { setParam } from "./slice";
-import styles from "./styles.module.css";
-function ParamOption({ param }) {
-  if (param.schema?.type === "array" && param.schema.items?.enum) {
-    return <ParamMultiSelectFormItem param={param} />;
-  }
-  if (param.schema?.type === "array") {
-    return <ParamArrayFormItem param={param} />;
-  }
-  if (param.schema?.enum) {
-    return <ParamSelectFormItem param={param} />;
-  }
-  if (param.schema?.type === "boolean") {
-    return <ParamBooleanFormItem param={param} />;
-  }
-
-  // integer, number, string, int32, int64, float, double, object, byte, binary,
-  // date-time, date, password
-  return <ParamTextFormItem param={param} />;
-}
-function ParamOptionWrapper({ param }) {
-  return (
-    <FormItem label={param.name} type={param.in} required={param.required}>
-      <ParamOption param={param} />
-    </FormItem>
-  );
-}
-function ParamOptions() {
-  const [showOptional, setShowOptional] = useState(false);
-  const pathParams = useTypedSelector((state) => state.params.path);
-  const queryParams = useTypedSelector((state) => state.params.query);
-  const cookieParams = useTypedSelector((state) => state.params.cookie);
-  const headerParams = useTypedSelector((state) => state.params.header);
-  const allParams = [
-    ...pathParams,
-    ...queryParams,
-    ...cookieParams,
-    ...headerParams,
-  ];
-  const requiredParams = allParams.filter((p) => p.required);
-  const optionalParams = allParams.filter((p) => !p.required);
-  return (
-    <>
-      {/* Required Parameters */}
-      {requiredParams.map((param) => (
-        <ParamOptionWrapper key={`${param.in}-${param.name}`} param={param} />
-      ))}
-
-      {/* Optional Parameters */}
-      {optionalParams.length > 0 && (
-        <>
-          <button
-            className={styles.showMoreButton}
-            onClick={() => setShowOptional((prev) => !prev)}
-          >
-            <span
-              style={{
-                width: "1.5em",
-                display: "inline-block",
-                textAlign: "center",
-              }}
-            >
-              <span
-                className={showOptional ? styles.plusExpanded : styles.plus}
-              >
-                <div>
-                  <svg
-                    style={{
-                      fill: "currentColor",
-                      width: "10px",
-                      height: "10px",
-                    }}
-                    height="16"
-                    viewBox="0 0 16 16"
-                    width="16"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M9 7h6a1 1 0 0 1 0 2H9v6a1 1 0 0 1-2 0V9H1a1 1 0 1 1 0-2h6V1a1 1 0 1 1 2 0z"
-                      fillRule="evenodd"
-                    ></path>
-                  </svg>
-                </div>
-              </span>
-            </span>
-            {showOptional
-              ? "Hide optional parameters"
-              : "Show optional parameters"}
-          </button>
-
-          <div
-            className={showOptional ? styles.showOptions : styles.hideOptions}
-          >
-            {optionalParams.map((param) => (
-              <ParamOptionWrapper
-                key={`${param.in}-${param.name}`}
-                param={param}
-              />
-            ))}
-          </div>
-        </>
-      )}
-    </>
-  );
-}
-function ArrayItem({ param, onChange }) {
-  if (param.schema?.items?.type === "boolean") {
-    return (
-      <FormSelect
-        options={["---", "true", "false"]}
-        onChange={(e) => {
-          const val = e.target.value;
-          onChange(val === "---" ? undefined : val);
-        }}
-      />
-    );
-  }
-  return (
-    <FormTextInput
-      placeholder={param.description || param.name}
-      onChange={(e) => {
-        onChange(e.target.value);
-      }}
-    />
-  );
-}
-function ParamArrayFormItem({ param }) {
-  const [items, setItems] = useState([]);
-  const dispatch = useTypedDispatch();
-  function handleAddItem() {
-    setItems((i) => [
-      ...i,
-      {
-        id: nanoid(),
-      },
-    ]);
-  }
-  useEffect(() => {
-    const values = items.map((item) => item.value).filter((item) => !!item);
-    dispatch(
-      setParam({
-        ...param,
-        value: values.length > 0 ? values : undefined,
-      })
-    );
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [items]);
-  function handleDeleteItem(itemToDelete) {
-    return () => {
-      const newItems = items.filter((i) => i.id !== itemToDelete.id);
-      setItems(newItems);
-    };
-  }
-  function handleChangeItem(itemToUpdate) {
-    return (value) => {
-      const newItems = items.map((i) => {
-        if (i.id === itemToUpdate.id) {
-          return {
-            ...i,
-            value: value,
-          };
-        }
-        return i;
-      });
-      setItems(newItems);
-    };
-  }
-  return (
-    <>
-      {items.map((item) => (
-        <div
-          key={item.id}
-          style={{
-            display: "flex",
-          }}
-        >
-          <ArrayItem param={param} onChange={handleChangeItem(item)} />
-          <button
-            className={styles.buttonDelete}
-            onClick={handleDeleteItem(item)}
-          >
-            <svg
-              focusable="false"
-              preserveAspectRatio="xMidYMid meet"
-              xmlns="http://www.w3.org/2000/svg"
-              fill="currentColor"
-              width="16"
-              height="16"
-              viewBox="0 0 32 32"
-              aria-hidden="true"
-            >
-              <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"></path>
-              <title>Delete</title>
-            </svg>
-          </button>
-        </div>
-      ))}
-      <button className={styles.buttonThin} onClick={handleAddItem}>
-        Add item
-      </button>
-    </>
-  );
-}
-function ParamSelectFormItem({ param }) {
-  const dispatch = useTypedDispatch();
-  const options = param.schema?.enum ?? [];
-  return (
-    <FormSelect
-      options={["---", ...options]}
-      onChange={(e) => {
-        const val = e.target.value;
-        dispatch(
-          setParam({
-            ...param,
-            value: val === "---" ? undefined : val,
-          })
-        );
-      }}
-    />
-  );
-}
-function ParamBooleanFormItem({ param }) {
-  const dispatch = useTypedDispatch();
-  return (
-    <FormSelect
-      options={["---", "true", "false"]}
-      onChange={(e) => {
-        const val = e.target.value;
-        dispatch(
-          setParam({
-            ...param,
-            value: val === "---" ? undefined : val,
-          })
-        );
-      }}
-    />
-  );
-}
-function ParamMultiSelectFormItem({ param }) {
-  const dispatch = useTypedDispatch();
-  const options = param.schema?.items?.enum ?? [];
-  return (
-    <FormMultiSelect
-      options={options}
-      onChange={(e) => {
-        const values = Array.prototype.filter
-          .call(e.target.options, (o) => o.selected)
-          .map((o) => o.value);
-        dispatch(
-          setParam({
-            ...param,
-            value: values.length > 0 ? values : undefined,
-          })
-        );
-      }}
-    />
-  );
-}
-function ParamTextFormItem({ param }) {
-  const dispatch = useTypedDispatch();
-  return (
-    <FormTextInput
-      placeholder={param.description || param.name}
-      onChange={(e) =>
-        dispatch(
-          setParam({
-            ...param,
-            value:
-              param.in === "path" || param.in === "query"
-                ? e.target.value.replace(/\s/g, "%20")
-                : e.target.value,
-          })
-        )
-      }
-    />
-  );
-}
-export default ParamOptions;

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

@@ -1,60 +0,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.
- * ========================================================================== */
-
-import React from "react";
-import { useDoc } from "@docusaurus/theme-common/internal";
-import sdk from "@paloaltonetworks/postman-collection";
-import Accept from "@theme/ApiDemoPanel/Accept";
-import Authorization from "@theme/ApiDemoPanel/Authorization";
-import Body from "@theme/ApiDemoPanel/Body";
-import Execute from "@theme/ApiDemoPanel/Execute";
-import ParamOptions from "@theme/ApiDemoPanel/ParamOptions";
-import Server from "@theme/ApiDemoPanel/Server";
-import { useTypedSelector } from "@theme/ApiItem/hooks";
-import styles from "./styles.module.css";
-function Request({ item }) {
-  const response = useTypedSelector((state) => state.response.value);
-  const postman = new sdk.Request(item.postman);
-  const metadata = useDoc();
-  const { proxy, hide_send_button } = metadata.frontMatter;
-  const params = {
-    path: [],
-    query: [],
-    header: [],
-    cookie: [],
-  };
-  item.parameters?.forEach((param) => {
-    const paramType = param.in;
-    const paramsArray = params[paramType];
-    paramsArray.push(param);
-  });
-  return (
-    <div>
-      <details className={`details__demo-panel`} open={response ? false : true}>
-        <summary>
-          <div className={`details__request-summary`}>
-            <h4>Request</h4>
-            {item.servers && !hide_send_button && (
-              <Execute postman={postman} proxy={proxy} />
-            )}
-          </div>
-        </summary>
-        <div className={styles.optionsPanel}>
-          <Server />
-          <Authorization />
-          <ParamOptions />
-          <Body
-            jsonRequestBodyExample={item.jsonRequestBodyExample}
-            requestBodyMetadata={item.requestBody}
-          />
-          <Accept />
-        </div>
-      </details>
-    </div>
-  );
-}
-export default Request;

package/lib-next/theme/ApiDemoPanel/Request/styles.module.css

@@ -1,18 +0,0 @@
-.optionsPanel:empty {
-  display: none;
-}
-
-.optionsPanel {
-  background: var(--openapi-card-background-color);
-  border-radius: var(--openapi-card-border-radius);
-  color: var(--ifm-pre-color);
-  line-height: var(--ifm-pre-line-height);
-  margin-bottom: var(--ifm-spacing-vertical);
-  margin-top: 0;
-  overflow: auto;
-  padding-top: 0 !important;
-  padding: var(--ifm-pre-padding);
-
-  /* hack for view calculation when monaco is hidden */
-  position: relative;
-}

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

@@ -1,67 +0,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.
- * ========================================================================== */
-
-import React from "react";
-import { useTypedDispatch, useTypedSelector } from "@theme/ApiItem/hooks";
-import CodeBlock from "@theme/CodeBlock";
-import { clearResponse } from "./slice";
-
-// TODO: We probably shouldn't attempt to format XML...
-function formatXml(xml) {
-  const tab = "  ";
-  let formatted = "";
-  let indent = "";
-  xml.split(/>\s*</).forEach((node) => {
-    if (node.match(/^\/\w/)) {
-      // decrease indent by one 'tab'
-      indent = indent.substring(tab.length);
-    }
-    formatted += indent + "<" + node + ">\r\n";
-    if (node.match(/^<?\w[^>]*[^/]$/)) {
-      // increase indent
-      indent += tab;
-    }
-  });
-  return formatted.substring(1, formatted.length - 3);
-}
-function Response() {
-  const response = useTypedSelector((state) => state.response.value);
-  const dispatch = useTypedDispatch();
-  if (response === undefined) {
-    return null;
-  }
-  let prettyResponse = response;
-  try {
-    prettyResponse = JSON.stringify(JSON.parse(response), null, 2);
-  } catch {
-    if (response.startsWith("<")) {
-      prettyResponse = formatXml(response);
-    }
-  }
-  return (
-    <details className={`details__demo-panel`} open={true}>
-      <summary>
-        <div className={`details__response-summary`}>
-          <h4>Response</h4>
-          <button
-            className="button button--sm button--secondary"
-            onClick={() => dispatch(clearResponse())}
-          >
-            Clear
-          </button>
-        </div>
-      </summary>
-      <CodeBlock
-        language={response.startsWith("<") ? `xml` : `json`}
-        className="openapi-demo__code-block"
-      >
-        {prettyResponse || "No Response"}
-      </CodeBlock>
-    </details>
-  );
-}
-export default Response;

package/lib-next/theme/ApiDemoPanel/Response/slice.js

@@ -1,23 +0,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.
- * ========================================================================== */
-
-import { createSlice } from "@reduxjs/toolkit";
-const initialState = {};
-export const slice = createSlice({
-  name: "response",
-  initialState,
-  reducers: {
-    setResponse: (state, action) => {
-      state.value = action.payload;
-    },
-    clearResponse: (state) => {
-      state.value = undefined;
-    },
-  },
-});
-export const { setResponse, clearResponse } = slice.actions;
-export default slice.reducer;