docusaurus-theme-openapi-docs 1.3.2 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,54 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _fileSaver = _interopRequireDefault(require("file-saver"));
11
+
12
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
+
14
+ /* ============================================================================
15
+ * Copyright (c) Palo Alto Networks
16
+ *
17
+ * This source code is licensed under the MIT license found in the
18
+ * LICENSE file in the root directory of this source tree.
19
+ * ========================================================================== */
20
+ const saveFile = url => {
21
+ let fileName;
22
+
23
+ if (url.endsWith("json") || url.endsWith("yaml") || url.endsWith("yml")) {
24
+ fileName = url.substring(url.lastIndexOf("/") + 1);
25
+ }
26
+
27
+ _fileSaver.default.saveAs(url, fileName ? fileName : "openapi.txt");
28
+ };
29
+
30
+ function Export({
31
+ url,
32
+ proxy
33
+ }) {
34
+ return <div style={{
35
+ float: "right"
36
+ }} className="dropdown dropdown--hoverable dropdown--right">
37
+ <button className="export-button button button--sm button--secondary">
38
+ Export
39
+ </button>
40
+ <ul className="export-dropdown dropdown__menu">
41
+ <li>
42
+ <a onClick={e => {
43
+ e.preventDefault();
44
+ saveFile(`${url}`);
45
+ }} className="dropdown__link" href={`${url}`}>
46
+ OpenAPI Spec
47
+ </a>
48
+ </li>
49
+ </ul>
50
+ </div>;
51
+ }
52
+
53
+ var _default = Export;
54
+ exports.default = _default;
@@ -3,10 +3,12 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.default = void 0;
6
+ exports.default = ApiItem;
7
7
 
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
 
10
+ var _BrowserOnly = _interopRequireDefault(require("@docusaurus/BrowserOnly"));
11
+
10
12
  var _ExecutionEnvironment = _interopRequireDefault(require("@docusaurus/ExecutionEnvironment"));
11
13
 
12
14
  var _themeCommon = require("@docusaurus/theme-common");
@@ -43,34 +45,31 @@ let ApiDemoPanel = _ => <div style={{
43
45
  marginTop: "3.5em"
44
46
  }} />;
45
47
 
46
- let DocItem = props => {
47
- return <div style={{
48
- marginTop: "3.5em"
49
- }} />;
50
- };
51
-
52
48
  if (_ExecutionEnvironment.default.canUseDOM) {
53
49
  ApiDemoPanel = require("@theme/ApiDemoPanel").default;
50
+ }
54
51
 
55
- DocItem = function DocItem(props) {
52
+ function ApiItem(props) {
53
+ const docHtmlClassName = `docs-doc-id-${props.content.metadata.unversionedId}`;
54
+ const MDXComponent = props.content;
55
+ const {
56
+ frontMatter
57
+ } = MDXComponent;
58
+ const {
59
+ info_path: infoPath
60
+ } = frontMatter;
61
+ const {
62
+ api
63
+ } = frontMatter;
64
+ const {
65
+ siteConfig
66
+ } = (0, _useDocusaurusContext.default)();
67
+ const themeConfig = siteConfig.themeConfig;
68
+ const options = themeConfig.api;
69
+
70
+ const ApiDocContent = () => {
56
71
  var _api$responses, _api$requestBody$cont, _api$requestBody, _api$servers, _api$parameters, _window, _window2, _window3, _ref;
57
72
 
58
- const docHtmlClassName = `docs-doc-id-${props.content.metadata.unversionedId}`;
59
- const MDXComponent = props.content;
60
- const {
61
- frontMatter
62
- } = MDXComponent;
63
- const {
64
- info_path: infoPath
65
- } = frontMatter;
66
- const {
67
- api
68
- } = frontMatter;
69
- const {
70
- siteConfig
71
- } = (0, _useDocusaurusContext.default)();
72
- const themeConfig = siteConfig.themeConfig;
73
- const options = themeConfig.api;
74
73
  const acceptArray = Array.from(new Set(Object.values((_api$responses = api === null || api === void 0 ? void 0 : api.responses) !== null && _api$responses !== void 0 ? _api$responses : {}).map(response => {
75
74
  var _response$content;
76
75
 
@@ -95,11 +94,11 @@ if (_ExecutionEnvironment.default.canUseDOM) {
95
94
  securitySchemes: api === null || api === void 0 ? void 0 : api.securitySchemes,
96
95
  options
97
96
  });
98
- const persistanceMiddleware = (0, _persistanceMiddleware.createPersistanceMiddleware)(options);
99
97
  const acceptValue = (_window = window) === null || _window === void 0 ? void 0 : _window.sessionStorage.getItem("accept");
100
98
  const contentTypeValue = (_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.sessionStorage.getItem("contentType");
101
99
  const server = (_window3 = window) === null || _window3 === void 0 ? void 0 : _window3.sessionStorage.getItem("server");
102
100
  const serverObject = (_ref = JSON.parse(server)) !== null && _ref !== void 0 ? _ref : {};
101
+ const persistanceMiddleware = (0, _persistanceMiddleware.createPersistanceMiddleware)(options);
103
102
  const store2 = (0, _store.createStoreWithState)({
104
103
  accept: {
105
104
  value: acceptValue || acceptArray[0],
@@ -122,30 +121,45 @@ if (_ExecutionEnvironment.default.canUseDOM) {
122
121
  params,
123
122
  auth
124
123
  }, [persistanceMiddleware]);
125
-
126
- const DocContent = () => {
127
- return <div className="row">
124
+ return <_reactRedux.Provider store={store2}>
125
+ <div className="row">
128
126
  <div className={(0, _clsx.default)("col", api ? "col--7" : "col--12")}>
129
127
  <MDXComponent />
130
128
  </div>
131
129
  {api && <div className="col col--5">
132
130
  <ApiDemoPanel item={api} infoPath={infoPath} />
133
131
  </div>}
134
- </div>;
135
- };
136
-
137
- return <_reactRedux.Provider store={store2}>
138
- <DocProvider content={props.content}>
139
- <_themeCommon.HtmlClassNameProvider className={docHtmlClassName}>
140
- <_Metadata.default />
141
- <_Layout.default>
142
- <DocContent />
143
- </_Layout.default>
144
- </_themeCommon.HtmlClassNameProvider>
145
- </DocProvider>
132
+ </div>
146
133
  </_reactRedux.Provider>;
147
134
  };
148
- }
149
135
 
150
- var _default = DocItem;
151
- exports.default = _default;
136
+ if (api) {
137
+ // TODO: determine if there's a way to SSR and hydrate ApiItem/ApiDemoPanel
138
+ return <DocProvider content={props.content}>
139
+ <_themeCommon.HtmlClassNameProvider className={docHtmlClassName}>
140
+ <_Metadata.default />
141
+ <_Layout.default>
142
+ {<_BrowserOnly.default fallback={<div />}>
143
+ {() => {
144
+ return <ApiDocContent />;
145
+ }}
146
+ </_BrowserOnly.default>}
147
+ </_Layout.default>
148
+ </_themeCommon.HtmlClassNameProvider>
149
+ </DocProvider>;
150
+ } // Non-API docs
151
+
152
+
153
+ return <DocProvider content={props.content}>
154
+ <_themeCommon.HtmlClassNameProvider className={docHtmlClassName}>
155
+ <_Metadata.default />
156
+ <_Layout.default>
157
+ <div className="row">
158
+ <div className={(0, _clsx.default)("col col--12")}>
159
+ <MDXComponent />
160
+ </div>
161
+ </div>
162
+ </_Layout.default>
163
+ </_themeCommon.HtmlClassNameProvider>
164
+ </DocProvider>;
165
+ }
@@ -0,0 +1,49 @@
1
+ /* ============================================================================
2
+ * Copyright (c) Palo Alto Networks
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ * ========================================================================== */
7
+ import React from "react";
8
+ import fileSaver from "file-saver";
9
+
10
+ const saveFile = (url) => {
11
+ let fileName;
12
+
13
+ if (url.endsWith("json") || url.endsWith("yaml") || url.endsWith("yml")) {
14
+ fileName = url.substring(url.lastIndexOf("/") + 1);
15
+ }
16
+
17
+ fileSaver.saveAs(url, fileName ? fileName : "openapi.txt");
18
+ };
19
+
20
+ function Export({ url, proxy }) {
21
+ return (
22
+ <div
23
+ style={{
24
+ float: "right",
25
+ }}
26
+ className="dropdown dropdown--hoverable dropdown--right"
27
+ >
28
+ <button className="export-button button button--sm button--secondary">
29
+ Export
30
+ </button>
31
+ <ul className="export-dropdown dropdown__menu">
32
+ <li>
33
+ <a
34
+ onClick={(e) => {
35
+ e.preventDefault();
36
+ saveFile(`${url}`);
37
+ }}
38
+ className="dropdown__link"
39
+ href={`${url}`}
40
+ >
41
+ OpenAPI Spec
42
+ </a>
43
+ </li>
44
+ </ul>
45
+ </div>
46
+ );
47
+ }
48
+
49
+ export default Export;
@@ -5,6 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  * ========================================================================== */
7
7
  import React from "react";
8
+ import BrowserOnly from "@docusaurus/BrowserOnly";
8
9
  import ExecutionEnvironment from "@docusaurus/ExecutionEnvironment";
9
10
  import { HtmlClassNameProvider } from "@docusaurus/theme-common";
10
11
  import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
@@ -26,28 +27,21 @@ let ApiDemoPanel = (_) => (
26
27
  />
27
28
  );
28
29
 
29
- let DocItem = (props) => {
30
- return (
31
- <div
32
- style={{
33
- marginTop: "3.5em",
34
- }}
35
- />
36
- );
37
- };
38
-
39
30
  if (ExecutionEnvironment.canUseDOM) {
40
31
  ApiDemoPanel = require("@theme/ApiDemoPanel").default;
32
+ }
33
+
34
+ export default function ApiItem(props) {
35
+ const docHtmlClassName = `docs-doc-id-${props.content.metadata.unversionedId}`;
36
+ const MDXComponent = props.content;
37
+ const { frontMatter } = MDXComponent;
38
+ const { info_path: infoPath } = frontMatter;
39
+ const { api } = frontMatter;
40
+ const { siteConfig } = useDocusaurusContext();
41
+ const themeConfig = siteConfig.themeConfig;
42
+ const options = themeConfig.api;
41
43
 
42
- DocItem = function DocItem(props) {
43
- const docHtmlClassName = `docs-doc-id-${props.content.metadata.unversionedId}`;
44
- const MDXComponent = props.content;
45
- const { frontMatter } = MDXComponent;
46
- const { info_path: infoPath } = frontMatter;
47
- const { api } = frontMatter;
48
- const { siteConfig } = useDocusaurusContext();
49
- const themeConfig = siteConfig.themeConfig;
50
- const options = themeConfig.api;
44
+ const ApiDocContent = () => {
51
45
  const acceptArray = Array.from(
52
46
  new Set(
53
47
  Object.values(api?.responses ?? {})
@@ -74,11 +68,11 @@ if (ExecutionEnvironment.canUseDOM) {
74
68
  securitySchemes: api?.securitySchemes,
75
69
  options,
76
70
  });
77
- const persistanceMiddleware = createPersistanceMiddleware(options);
78
71
  const acceptValue = window?.sessionStorage.getItem("accept");
79
72
  const contentTypeValue = window?.sessionStorage.getItem("contentType");
80
73
  const server = window?.sessionStorage.getItem("server");
81
74
  const serverObject = JSON.parse(server) ?? {};
75
+ const persistanceMiddleware = createPersistanceMiddleware(options);
82
76
  const store2 = createStoreWithState(
83
77
  {
84
78
  accept: {
@@ -104,9 +98,8 @@ if (ExecutionEnvironment.canUseDOM) {
104
98
  },
105
99
  [persistanceMiddleware]
106
100
  );
107
-
108
- const DocContent = () => {
109
- return (
101
+ return (
102
+ <Provider store={store2}>
110
103
  <div className="row">
111
104
  <div className={clsx("col", api ? "col--7" : "col--12")}>
112
105
  <MDXComponent />
@@ -117,22 +110,42 @@ if (ExecutionEnvironment.canUseDOM) {
117
110
  </div>
118
111
  )}
119
112
  </div>
120
- );
121
- };
122
-
123
- return (
124
- <Provider store={store2}>
125
- <DocProvider content={props.content}>
126
- <HtmlClassNameProvider className={docHtmlClassName}>
127
- <DocItemMetadata />
128
- <DocItemLayout>
129
- <DocContent />
130
- </DocItemLayout>
131
- </HtmlClassNameProvider>
132
- </DocProvider>
133
113
  </Provider>
134
114
  );
135
115
  };
136
- }
137
116
 
138
- export default DocItem;
117
+ if (api) {
118
+ // TODO: determine if there's a way to SSR and hydrate ApiItem/ApiDemoPanel
119
+ return (
120
+ <DocProvider content={props.content}>
121
+ <HtmlClassNameProvider className={docHtmlClassName}>
122
+ <DocItemMetadata />
123
+ <DocItemLayout>
124
+ {
125
+ <BrowserOnly fallback={<div />}>
126
+ {() => {
127
+ return <ApiDocContent />;
128
+ }}
129
+ </BrowserOnly>
130
+ }
131
+ </DocItemLayout>
132
+ </HtmlClassNameProvider>
133
+ </DocProvider>
134
+ );
135
+ } // Non-API docs
136
+
137
+ return (
138
+ <DocProvider content={props.content}>
139
+ <HtmlClassNameProvider className={docHtmlClassName}>
140
+ <DocItemMetadata />
141
+ <DocItemLayout>
142
+ <div className="row">
143
+ <div className={clsx("col col--12")}>
144
+ <MDXComponent />
145
+ </div>
146
+ </div>
147
+ </DocItemLayout>
148
+ </HtmlClassNameProvider>
149
+ </DocProvider>
150
+ );
151
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "docusaurus-theme-openapi-docs",
3
3
  "description": "OpenAPI theme for Docusaurus.",
4
- "version": "1.3.2",
4
+ "version": "1.4.0",
5
5
  "license": "MIT",
6
6
  "keywords": [
7
7
  "openapi",
@@ -35,6 +35,7 @@
35
35
  "@docusaurus/types": "2.0.1",
36
36
  "@types/concurrently": "^6.3.0",
37
37
  "@types/crypto-js": "^4.1.0",
38
+ "@types/file-saver": "^2.0.5",
38
39
  "@types/fs-extra": "^9.0.13",
39
40
  "@types/lodash": "^4.14.176",
40
41
  "@types/mdx-js__react": "^1.5.4",
@@ -50,7 +51,8 @@
50
51
  "buffer": "^6.0.3",
51
52
  "clsx": "^1.1.1",
52
53
  "crypto-js": "^4.1.1",
53
- "docusaurus-plugin-openapi-docs": "^1.3.2",
54
+ "docusaurus-plugin-openapi-docs": "^1.4.0",
55
+ "file-saver": "^2.0.5",
54
56
  "immer": "^9.0.7",
55
57
  "lodash": "^4.17.20",
56
58
  "process": "^0.11.10",
@@ -71,5 +73,5 @@
71
73
  "engines": {
72
74
  "node": ">=14"
73
75
  },
74
- "gitHead": "761a89172da04573369441cf7342f6c643bc3ecd"
76
+ "gitHead": "74c5c52e4aa493eb4943d4899c60669f8722e089"
75
77
  }
@@ -0,0 +1,47 @@
1
+ /* ============================================================================
2
+ * Copyright (c) Palo Alto Networks
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ * ========================================================================== */
7
+
8
+ import React from "react";
9
+
10
+ import fileSaver from "file-saver";
11
+
12
+ const saveFile = (url: string) => {
13
+ let fileName;
14
+ if (url.endsWith("json") || url.endsWith("yaml") || url.endsWith("yml")) {
15
+ fileName = url.substring(url.lastIndexOf("/") + 1);
16
+ }
17
+ fileSaver.saveAs(url, fileName ? fileName : "openapi.txt");
18
+ };
19
+
20
+ function Export({ url, proxy }: any) {
21
+ return (
22
+ <div
23
+ style={{ float: "right" }}
24
+ className="dropdown dropdown--hoverable dropdown--right"
25
+ >
26
+ <button className="export-button button button--sm button--secondary">
27
+ Export
28
+ </button>
29
+ <ul className="export-dropdown dropdown__menu">
30
+ <li>
31
+ <a
32
+ onClick={(e) => {
33
+ e.preventDefault();
34
+ saveFile(`${url}`);
35
+ }}
36
+ className="dropdown__link"
37
+ href={`${url}`}
38
+ >
39
+ OpenAPI Spec
40
+ </a>
41
+ </li>
42
+ </ul>
43
+ </div>
44
+ );
45
+ }
46
+
47
+ export default Export;
@@ -7,6 +7,7 @@
7
7
 
8
8
  import React from "react";
9
9
 
10
+ import BrowserOnly from "@docusaurus/BrowserOnly";
10
11
  import ExecutionEnvironment from "@docusaurus/ExecutionEnvironment";
11
12
  import { HtmlClassNameProvider } from "@docusaurus/theme-common";
12
13
  import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
@@ -31,27 +32,25 @@ let ApiDemoPanel = (_: { item: any; infoPath: any }) => (
31
32
  <div style={{ marginTop: "3.5em" }} />
32
33
  );
33
34
 
34
- let DocItem = (props: Props) => {
35
- return <div style={{ marginTop: "3.5em" }} />;
36
- };
35
+ if (ExecutionEnvironment.canUseDOM) {
36
+ ApiDemoPanel = require("@theme/ApiDemoPanel").default;
37
+ }
37
38
 
38
39
  interface ApiFrontMatter extends DocFrontMatter {
39
40
  readonly api?: ApiItemType;
40
41
  }
41
42
 
42
- if (ExecutionEnvironment.canUseDOM) {
43
- ApiDemoPanel = require("@theme/ApiDemoPanel").default;
44
-
45
- DocItem = function DocItem(props: Props): JSX.Element {
46
- const docHtmlClassName = `docs-doc-id-${props.content.metadata.unversionedId}`;
47
- const MDXComponent = props.content;
48
- const { frontMatter } = MDXComponent;
49
- const { info_path: infoPath } = frontMatter as DocFrontMatter;
50
- const { api } = frontMatter as ApiFrontMatter;
51
- const { siteConfig } = useDocusaurusContext();
52
- const themeConfig = siteConfig.themeConfig as ThemeConfig;
53
- const options = themeConfig.api;
54
-
43
+ export default function ApiItem(props: Props): JSX.Element {
44
+ const docHtmlClassName = `docs-doc-id-${props.content.metadata.unversionedId}`;
45
+ const MDXComponent = props.content;
46
+ const { frontMatter } = MDXComponent;
47
+ const { info_path: infoPath } = frontMatter as DocFrontMatter;
48
+ const { api } = frontMatter as ApiFrontMatter;
49
+ const { siteConfig } = useDocusaurusContext();
50
+ const themeConfig = siteConfig.themeConfig as ThemeConfig;
51
+ const options = themeConfig.api;
52
+
53
+ const ApiDocContent = () => {
55
54
  const acceptArray = Array.from(
56
55
  new Set(
57
56
  Object.values(api?.responses ?? {})
@@ -59,18 +58,15 @@ if (ExecutionEnvironment.canUseDOM) {
59
58
  .flat()
60
59
  )
61
60
  );
62
-
63
61
  const content = api?.requestBody?.content ?? {};
64
62
  const contentTypeArray = Object.keys(content);
65
63
  const servers = api?.servers ?? [];
66
-
67
64
  const params = {
68
65
  path: [] as ParameterObject[],
69
66
  query: [] as ParameterObject[],
70
67
  header: [] as ParameterObject[],
71
68
  cookie: [] as ParameterObject[],
72
69
  };
73
-
74
70
  api?.parameters?.forEach(
75
71
  (param: { in: "path" | "query" | "header" | "cookie" }) => {
76
72
  const paramType = param.in;
@@ -78,21 +74,23 @@ if (ExecutionEnvironment.canUseDOM) {
78
74
  paramsArray.push(param as ParameterObject);
79
75
  }
80
76
  );
81
-
82
77
  const auth = createAuth({
83
78
  security: api?.security,
84
79
  securitySchemes: api?.securitySchemes,
85
80
  options,
86
81
  });
87
-
88
- const persistanceMiddleware = createPersistanceMiddleware(options);
89
82
  const acceptValue = window?.sessionStorage.getItem("accept");
90
83
  const contentTypeValue = window?.sessionStorage.getItem("contentType");
91
84
  const server = window?.sessionStorage.getItem("server");
92
85
  const serverObject = (JSON.parse(server!) as ServerObject) ?? {};
86
+
87
+ const persistanceMiddleware = createPersistanceMiddleware(options);
93
88
  const store2 = createStoreWithState(
94
89
  {
95
- accept: { value: acceptValue || acceptArray[0], options: acceptArray },
90
+ accept: {
91
+ value: acceptValue || acceptArray[0],
92
+ options: acceptArray,
93
+ },
96
94
  contentType: {
97
95
  value: contentTypeValue || contentTypeArray[0],
98
96
  options: contentTypeArray,
@@ -109,8 +107,8 @@ if (ExecutionEnvironment.canUseDOM) {
109
107
  [persistanceMiddleware]
110
108
  );
111
109
 
112
- const DocContent = () => {
113
- return (
110
+ return (
111
+ <Provider store={store2}>
114
112
  <div className="row">
115
113
  <div className={clsx("col", api ? "col--7" : "col--12")}>
116
114
  <MDXComponent />
@@ -121,22 +119,42 @@ if (ExecutionEnvironment.canUseDOM) {
121
119
  </div>
122
120
  )}
123
121
  </div>
124
- );
125
- };
126
-
127
- return (
128
- <Provider store={store2}>
129
- <DocProvider content={props.content}>
130
- <HtmlClassNameProvider className={docHtmlClassName}>
131
- <DocItemMetadata />
132
- <DocItemLayout>
133
- <DocContent />
134
- </DocItemLayout>
135
- </HtmlClassNameProvider>
136
- </DocProvider>
137
122
  </Provider>
138
123
  );
139
124
  };
140
- }
141
125
 
142
- export default DocItem;
126
+ if (api) {
127
+ // TODO: determine if there's a way to SSR and hydrate ApiItem/ApiDemoPanel
128
+ return (
129
+ <DocProvider content={props.content}>
130
+ <HtmlClassNameProvider className={docHtmlClassName}>
131
+ <DocItemMetadata />
132
+ <DocItemLayout>
133
+ {
134
+ <BrowserOnly fallback={<div />}>
135
+ {() => {
136
+ return <ApiDocContent />;
137
+ }}
138
+ </BrowserOnly>
139
+ }
140
+ </DocItemLayout>
141
+ </HtmlClassNameProvider>
142
+ </DocProvider>
143
+ );
144
+ }
145
+ // Non-API docs
146
+ return (
147
+ <DocProvider content={props.content}>
148
+ <HtmlClassNameProvider className={docHtmlClassName}>
149
+ <DocItemMetadata />
150
+ <DocItemLayout>
151
+ <div className="row">
152
+ <div className={clsx("col col--12")}>
153
+ <MDXComponent />
154
+ </div>
155
+ </div>
156
+ </DocItemLayout>
157
+ </HtmlClassNameProvider>
158
+ </DocProvider>
159
+ );
160
+ }