openapi-explorer 0.9.385 → 0.9.392
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.
- package/CHANGELOG.md +6 -0
- package/README.md +3 -2
- package/dist/browser/openapi-explorer.min.js +7 -5
- package/dist/browser/openapi-explorer.min.js.map +1 -1
- package/dist/es/components/api-request.js +51 -18
- package/dist/es/components/api-response.js +17 -5
- package/dist/es/components/json-tree.js +3 -2
- package/dist/es/components/mime-types.js +5 -5
- package/dist/es/components/schema-table.js +1 -1
- package/dist/es/components/schema-tree.js +4 -3
- package/dist/es/languages/en.js +59 -0
- package/dist/es/languages/fr.js +59 -0
- package/dist/es/languages/index.js +20 -0
- package/dist/es/openapi-explorer.js +8 -3
- package/dist/es/styles/input-styles.js +1 -1
- package/dist/es/styles/schema-styles.js +1 -1
- package/dist/es/templates/callback-template.js +1 -1
- package/dist/es/templates/code-samples-template.js +2 -1
- package/dist/es/templates/components-template.js +4 -2
- package/dist/es/templates/endpoint-template.js +1 -1
- package/dist/es/templates/expanded-endpoint-template.js +1 -1
- package/dist/es/templates/navbar-template.js +3 -2
- package/dist/es/templates/overview-template.js +2 -1
- package/dist/es/templates/security-scheme-template.js +6 -5
- package/dist/es/templates/server-template.js +4 -3
- package/dist/es/utils/common-utils.js +4 -2
- package/dist/es/utils/schema-utils.js +51 -44
- package/dist/es/utils/spec-parser.js +3 -2
- package/dist/lib/components/api-request.js +52 -18
- package/dist/lib/components/api-response.js +18 -5
- package/dist/lib/components/json-tree.js +4 -2
- package/dist/lib/components/mime-types.js +8 -9
- package/dist/lib/components/schema-table.js +1 -1
- package/dist/lib/components/schema-tree.js +5 -3
- package/dist/lib/languages/en.js +64 -0
- package/dist/lib/languages/fr.js +64 -0
- package/dist/lib/languages/index.js +32 -0
- package/dist/lib/openapi-explorer.js +9 -3
- package/dist/lib/styles/input-styles.js +1 -1
- package/dist/lib/styles/schema-styles.js +1 -1
- package/dist/lib/templates/callback-template.js +1 -1
- package/dist/lib/templates/code-samples-template.js +3 -1
- package/dist/lib/templates/components-template.js +4 -2
- package/dist/lib/templates/endpoint-template.js +1 -1
- package/dist/lib/templates/expanded-endpoint-template.js +1 -1
- package/dist/lib/templates/navbar-template.js +4 -2
- package/dist/lib/templates/overview-template.js +3 -1
- package/dist/lib/templates/security-scheme-template.js +7 -5
- package/dist/lib/templates/server-template.js +5 -3
- package/dist/lib/utils/common-utils.js +4 -2
- package/dist/lib/utils/schema-utils.js +51 -44
- package/dist/lib/utils/spec-parser.js +4 -2
- package/package.json +7 -4
|
@@ -27,7 +27,7 @@ require("prismjs/components/prism-http");
|
|
|
27
27
|
|
|
28
28
|
require("prismjs/components/prism-csharp");
|
|
29
29
|
|
|
30
|
-
var _fontStyles = _interopRequireDefault(require("./styles/font-styles"));
|
|
30
|
+
var _fontStyles = _interopRequireDefault(require("./styles/font-styles.js"));
|
|
31
31
|
|
|
32
32
|
var _inputStyles = _interopRequireDefault(require("./styles/input-styles"));
|
|
33
33
|
|
|
@@ -49,6 +49,8 @@ var _advancedSearchStyles = _interopRequireDefault(require("./styles/advanced-se
|
|
|
49
49
|
|
|
50
50
|
var _commonUtils = require("./utils/common-utils");
|
|
51
51
|
|
|
52
|
+
var _languages = require("./languages");
|
|
53
|
+
|
|
52
54
|
var _specParser = _interopRequireDefault(require("./utils/spec-parser"));
|
|
53
55
|
|
|
54
56
|
var _responsiveViewMainBodyTemplate = _interopRequireDefault(require("./templates/responsiveViewMainBodyTemplate"));
|
|
@@ -159,6 +161,10 @@ class OpenApiExplorer extends _litElement.LitElement {
|
|
|
159
161
|
type: String,
|
|
160
162
|
attribute: 'enable-console'
|
|
161
163
|
},
|
|
164
|
+
includeNulls: {
|
|
165
|
+
type: Boolean,
|
|
166
|
+
attribute: 'display-nulls'
|
|
167
|
+
},
|
|
162
168
|
allowSearch: {
|
|
163
169
|
type: String,
|
|
164
170
|
attribute: 'allow-search'
|
|
@@ -250,7 +256,7 @@ class OpenApiExplorer extends _litElement.LitElement {
|
|
|
250
256
|
}
|
|
251
257
|
|
|
252
258
|
static get styles() {
|
|
253
|
-
return [_fontStyles.default, _inputStyles.default, _flexStyles.default, _tableStyles.default, _endpointStyles.default, _prismStyles.default, _tabStyles.default, _navStyles.default, _infoStyles.default, _advancedSearchStyles.default, _apiRequestStyles.default, (0, _litElement.css)`:not(:defined){display:none}:host{display:flex;flex-direction:column;width:100%;height:100%;margin:0;padding:0;overflow:hidden;letter-spacing:normal;color:var(--fg);background-color:var(--bg);font-family:var(--font-regular)}.body{display:flex;height:100%;width:100%;overflow:hidden}.main-content{margin:0;padding:0;display:block;flex:1;height:100%;overflow-y:overlay;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.main-content::-webkit-scrollbar{width:8px;height:8px}.main-content::-webkit-scrollbar-track{background:0 0}.main-content::-webkit-scrollbar-thumb{background-color:var(--border-color)}.section-gap.section-tag{border-bottom:1px solid var(--border-color)}.method-section-gap{padding:24px 8px 0 4px}.section-gap{padding:24px 0 0}.section-tag-header{position:relative;cursor:n-resize;padding:12px 0}.collapsed .section-tag-header:hover{cursor:s-resize}.section-tag-header:hover{background-image:linear-gradient(to right,rgba(0,0,0,0),var(--border-color),rgba(0,0,0,0))}.collapsed .section-tag-header:hover::after{color:var(--primary-color)}.collapsed .section-tag-body{display:none}.logo{height:36px;width:36px;margin-left:5px}.only-large-screen,.only-large-screen-flex{display:none}.header-title{font-size:calc(var(--font-size-regular) + 8px);padding:0 8px}.tag.title{text-transform:uppercase}.header{background-color:var(--header-bg);color:var(--header-fg);width:100%}input.header-input{background:var(--header-color-darker);color:var(--header-fg);border:1px solid var(--header-color-border);flex:1;padding-right:24px;border-radius:3px}input.header-input::placeholder{opacity:.4}input:disabled{cursor:not-allowed}.loader{margin:16px auto 16px auto;border:4px solid var(--bg3);border-radius:50%;border-top:4px solid var(--primary-color);width:36px;height:36px;animation:spin 2s linear infinite}.expanded-endpoint-body{position:relative;padding:6px 0}.divider{border-top:2px solid var(--border-color);margin:24px 0;width:100%}.tooltip{border:1px solid var(--border-color);border-left-width:4px;margin-left:2px}.tooltip a{color:var(--fg2);text-decoration:none}.tooltip-text{color:var(--fg2);background-color:var(--bg2);visibility:hidden;overflow-wrap:break-word}.tooltip:hover{color:var(--primary-color);border-color:var(--primary-color)}.tooltip:hover a:hover{color:var(--primary-color)}.tooltip:hover .tooltip-text{visibility:visible;opacity:1}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@media only screen and (max-width:767.98px){.section-padding{margin:1rem}.sub-title.tag{margin-left:1rem}.section-tag-body .description{margin-left:1rem;margin-right:1rem}}@media only screen and (min-width:768px){.nav-bar{width:260px;display:flex}.only-large-screen{display:block}.only-large-screen-flex{display:flex}.section-gap{padding:24px 24px}.section-gap--read-mode{padding:24px 8px}.section-gap--focused-mode{padding:
|
|
259
|
+
return [_fontStyles.default, _inputStyles.default, _flexStyles.default, _tableStyles.default, _endpointStyles.default, _prismStyles.default, _tabStyles.default, _navStyles.default, _infoStyles.default, _advancedSearchStyles.default, _apiRequestStyles.default, (0, _litElement.css)`:not(:defined){display:none}:host{display:flex;flex-direction:column;width:100%;height:100%;margin:0;padding:0;overflow:hidden;letter-spacing:normal;color:var(--fg);background-color:var(--bg);font-family:var(--font-regular)}.body{display:flex;height:100%;width:100%;overflow:hidden}.main-content{margin:0;padding:0;display:block;flex:1;height:100%;overflow-y:overlay;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.main-content::-webkit-scrollbar{width:8px;height:8px}.main-content::-webkit-scrollbar-track{background:0 0}.main-content::-webkit-scrollbar-thumb{background-color:var(--border-color)}.section-gap.section-tag{border-bottom:1px solid var(--border-color)}.method-section-gap{padding:24px 8px 0 4px}.section-gap{padding:24px 0 0}.section-tag-header{position:relative;cursor:n-resize;padding:12px 0}.collapsed .section-tag-header:hover{cursor:s-resize}.section-tag-header:hover{background-image:linear-gradient(to right,rgba(0,0,0,0),var(--border-color),rgba(0,0,0,0))}.collapsed .section-tag-header:hover::after{color:var(--primary-color)}.collapsed .section-tag-body{display:none}.logo{height:36px;width:36px;margin-left:5px}.only-large-screen,.only-large-screen-flex{display:none}.header-title{font-size:calc(var(--font-size-regular) + 8px);padding:0 8px}.tag.title{text-transform:uppercase}.header{background-color:var(--header-bg);color:var(--header-fg);width:100%}input.header-input{background:var(--header-color-darker);color:var(--header-fg);border:1px solid var(--header-color-border);flex:1;padding-right:24px;border-radius:3px}input.header-input::placeholder{opacity:.4}input:disabled{cursor:not-allowed}.loader{margin:16px auto 16px auto;border:4px solid var(--bg3);border-radius:50%;border-top:4px solid var(--primary-color);width:36px;height:36px;animation:spin 2s linear infinite}.expanded-endpoint-body{position:relative;padding:6px 0}.divider{border-top:2px solid var(--border-color);margin:24px 0;width:100%}.tooltip{border:1px solid var(--border-color);border-left-width:4px;margin-left:2px}.tooltip a{color:var(--fg2);text-decoration:none}.tooltip-text{color:var(--fg2);background-color:var(--bg2);visibility:hidden;overflow-wrap:break-word}.tooltip:hover{color:var(--primary-color);border-color:var(--primary-color)}.tooltip:hover a:hover{color:var(--primary-color)}.tooltip:hover .tooltip-text{visibility:visible;opacity:1}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@media only screen and (max-width:767.98px){.section-padding{margin:1rem}.sub-title.tag{margin-left:1rem}.section-tag-body .description{margin-left:1rem;margin-right:1rem}}@media only screen and (min-width:768px){.nav-bar{width:260px;display:flex}.only-large-screen{display:block}.only-large-screen-flex{display:flex}.section-gap{padding:24px 24px}.section-gap--read-mode{padding:24px 8px}.section-gap--focused-mode{padding:1.5rem}.endpoint-body{position:relative;padding:36px 0 48px 0}}@media only screen and (min-width:1024px){.nav-bar{width:${(0, _litElement.unsafeCSS)(this.fontSize === 'default' ? '300px' : this.fontSize === 'large' ? '315px' : '330px')};display:flex}.section-gap--read-mode{padding:24px 24px 12px}.main-content-inner{padding:24px}}`];
|
|
254
260
|
} // Startup
|
|
255
261
|
|
|
256
262
|
|
|
@@ -259,6 +265,7 @@ class OpenApiExplorer extends _litElement.LitElement {
|
|
|
259
265
|
this.handleResize = this.handleResize.bind(this);
|
|
260
266
|
window.addEventListener('resize', this.handleResize);
|
|
261
267
|
this.loading = true;
|
|
268
|
+
(0, _languages.initI18n)();
|
|
262
269
|
const parent = this.parentElement;
|
|
263
270
|
|
|
264
271
|
if (parent) {
|
|
@@ -406,7 +413,6 @@ class OpenApiExplorer extends _litElement.LitElement {
|
|
|
406
413
|
attributeChangedCallback(name, oldVal, newVal) {
|
|
407
414
|
if (name === 'spec-url') {
|
|
408
415
|
if (oldVal !== newVal) {
|
|
409
|
-
// put it at the end of event-loop to load all the attributes
|
|
410
416
|
window.setTimeout(async () => {
|
|
411
417
|
await this.loadSpec(newVal); // If the initial location is set, then attempt to scroll there
|
|
412
418
|
|
|
@@ -6,6 +6,6 @@ exports.default = void 0;
|
|
|
6
6
|
var _litElement = require("lit-element");
|
|
7
7
|
|
|
8
8
|
/* eslint-disable max-len */
|
|
9
|
-
var _default = (0, _litElement.css)`.m-btn{border-radius:var(--border-radius);font-weight:600;display:inline-block;padding:6px 16px;font-size:var(--font-size-small);outline:0;line-height:1;text-align:center;white-space:nowrap;border:2px solid var(--primary-color);background-color:transparent;transition:background-color .2s;user-select:none;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)}.m-btn.primary{background-color:var(--primary-color);color:var(--primary-btn-text-color)}.m-btn.thin-border{border-width:1px}.m-btn.large{padding:8px 14px}.m-btn.small{padding:5px 12px}.m-btn.tiny{padding:5px 6px}.m-btn.circle{border-radius:50%}.m-btn:hover{background-color:var(--primary-color);color:var(--primary-btn-text-color)}.m-btn.nav{border:2px solid var(--secondary-color)}.m-btn.nav:hover{background-color:var(--secondary-color)}.m-btn:disabled{background-color:var(--bg3);color:var(--fg3);border-color:var(--fg3);cursor:progress;opacity:.4}.toolbar-copy-btn{cursor:pointer;padding:.125rem .5rem;margin:0 2px;font-size:.8rem;width:
|
|
9
|
+
var _default = (0, _litElement.css)`.m-btn{border-radius:var(--border-radius);font-weight:600;display:inline-block;padding:6px 16px;font-size:var(--font-size-small);outline:0;line-height:1;text-align:center;white-space:nowrap;border:2px solid var(--primary-color);background-color:transparent;transition:background-color .2s;user-select:none;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)}.m-btn.primary{background-color:var(--primary-color);color:var(--primary-btn-text-color)}.m-btn.thin-border{border-width:1px}.m-btn.large{padding:8px 14px}.m-btn.small{padding:5px 12px}.m-btn.tiny{padding:5px 6px}.m-btn.circle{border-radius:50%}.m-btn:hover{background-color:var(--primary-color);color:var(--primary-btn-text-color)}.m-btn.nav{border:2px solid var(--secondary-color)}.m-btn.nav:hover{background-color:var(--secondary-color)}.m-btn:disabled{background-color:var(--bg3);color:var(--fg3);border-color:var(--fg3);cursor:progress;opacity:.4}.toolbar-copy-btn{cursor:pointer;padding:.125rem .5rem;margin:0 2px;font-size:.8rem;width:60px;color:var(--primary-btn-text-color);border-radius:2px;border:none;background-color:var(--primary-color)}.tab-content .toolbar-copy-btn{position:absolute;top:8px;right:8px;margin-right:8px}.tab-content .toolbar-copy-btn+pre{white-space:pre;max-height:400px;overflow:auto;display:flex;padding-right:70px}button,input,pre,select,textarea{color:var(--fg);outline:0;background-color:var(--input-bg);border:1px solid var(--border-color);border-radius:var(--border-radius)}button{font-family:var(--font-regular)}input[type=file],input[type=password],input[type=text],pre,select,textarea{font-family:var(--font-mono);font-weight:400;font-size:var(--font-size-small);transition:border .2s;padding:6px 5px}select{font-family:var(--font-regular);padding-right:30px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2212%22%3E%3Cpath%20d%3D%22M10.3%203.3L6%207.6%201.7%203.3A1%201%200%2000.3%204.7l5%205a1%201%200%20001.4%200l5-5a1%201%200%2010-1.4-1.4z%22%20fill%3D%22%23777777%22%2F%3E%3C%2Fsvg%3E");background-position:calc(100% - 5px) center;background-repeat:no-repeat;background-size:10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}select:hover{border-color:var(--primary-color)}input[type=password]::placeholder,input[type=text]::placeholder,textarea::placeholder{color:var(--placeholder-color);opacity:1}input[type=password]:active,input[type=password]:focus,input[type=text]:active,input[type=text]:focus,select:focus,textarea:active,textarea:focus{border:1px solid var(--primary-color)}input[type=file]{font-family:var(--font-regular);padding:2px;cursor:pointer;border:1px solid var(--primary-color);min-height:calc(var(--font-size-small) + 18px)}input[type=file]::-webkit-file-upload-button{font-family:var(--font-regular);font-size:var(--font-size-small);outline:0;cursor:pointer;padding:3px 8px;border:1px solid var(--primary-color);background-color:var(--primary-color);color:var(--primary-btn-text-color);border-radius:var(--border-radius);-webkit-appearance:none}pre,textarea{scrollbar-width:thin;scrollbar-color:var(--border-color) var(--input-bg)}pre::-webkit-scrollbar,textarea::-webkit-scrollbar{width:8px;height:8px}pre::-webkit-scrollbar-track,textarea::-webkit-scrollbar-track{background:var(--input-bg)}pre::-webkit-scrollbar-thumb,textarea::-webkit-scrollbar-thumb{border-radius:2px;background-color:var(--border-color)}.link{font-size:var(--font-size-small);text-decoration:underline;color:var(--blue);font-family:var(--font-mono);margin-bottom:2px}input[type=checkbox]:focus{outline:0}input[type=checkbox]{appearance:none;display:inline-block;background-color:var(--light-bg);border-radius:9px;cursor:pointer;height:18px;position:relative;transition:border .15s,padding .25s;min-width:36px;width:36px;vertical-align:top}input[type=checkbox]:after{position:absolute;background-color:var(--bg);border-radius:8px;content:'';top:0;left:0;right:16px;display:block;height:16px;transition:left .25s .1s,right .15s .175s}input[type=checkbox]:checked{box-shadow:inset 0 0 0 13px var(--primary-color);border-color:var(--primary-color)}input[type=checkbox]:checked:after{border:1px solid var(--primary-color);left:16px;right:1px;transition:border .25s,left .15s .25s,right .25s .175s}input.oauth-client-id{flex-grow:1;max-width:300px}input.oauth-client-secret{flex-grow:1;max-width:300px}`;
|
|
10
10
|
|
|
11
11
|
exports.default = _default;
|
|
@@ -5,6 +5,6 @@ exports.default = void 0;
|
|
|
5
5
|
|
|
6
6
|
var _litElement = require("lit-element");
|
|
7
7
|
|
|
8
|
-
var _default = (0, _litElement.css)`*,:after,:before{box-sizing:border-box}.tr{display:flex;flex:none;width:100%;box-sizing:content-box;border-bottom:1px dotted transparent}.td{display:block;flex:0 0 auto}.key{font-family:var(--font-mono);white-space:normal;word-break:break-all}.key-descr{font-family:var(--font-regular);flex-shrink:1;text-overflow:ellipsis;overflow:hidden;display:none;max-height:auto}.toolbar{display:none}.tr.xxx-of{border-top:1px dotted var(--primary-color)}.xxx-of-key{font-size:calc(var(--font-size-small) - 2px);font-weight:700;background-color:var(--primary-color);color:var(--primary-btn-text-color);border-radius:2px;line-height:calc(var(--font-size-small) + 6px);padding:0 5px;margin-bottom:1px;display:inline-block}.xxx-of-descr{font-family:var(--font-regular);font-size:calc(var(--font-size-small) - 1px);margin-left:2px}.bina,.byte,.date,.emai,.host,.ipv4,.pass,.stri,.string,.uri,.url,.uuid{color:var(--green)}.
|
|
8
|
+
var _default = (0, _litElement.css)`*,:after,:before{box-sizing:border-box}.tr{display:flex;flex:none;width:100%;box-sizing:content-box;border-bottom:1px dotted transparent}.td{display:block;flex:0 0 auto}.key{font-family:var(--font-mono);white-space:normal;word-break:break-all}.key-descr{font-family:var(--font-regular);flex-shrink:1;text-overflow:ellipsis;overflow:hidden;display:none;max-height:auto}.toolbar{display:none}.tr.xxx-of{border-top:1px dotted var(--primary-color)}.xxx-of-key{font-size:calc(var(--font-size-small) - 2px);font-weight:700;background-color:var(--primary-color);color:var(--primary-btn-text-color);border-radius:2px;line-height:calc(var(--font-size-small) + 6px);padding:0 5px;margin-bottom:1px;display:inline-block}.xxx-of-descr{font-family:var(--font-regular);font-size:calc(var(--font-size-small) - 1px);margin-left:2px}.bina,.binary,.byte,.date,.emai,.email,.host,.hostname,.ipv4,.pass,.password,.stri,.string,.uri,.url,.uuid{color:var(--green)}.blue,.deci,.decimal,.doub,.double,.floa,.float,.int3,.int32,.int6,.int64,.inte,.numb,.number{color:var(--blue)}.null{color:var(--red)}.bool,.boolean{color:var(--orange)}.cons,.const,.enum{color:var(--yellow)}.tree .toolbar{display:flex;justify-content:space-between}.toolbar{width:100%}.toolbar-item{cursor:pointer;padding:5px 0 5px 1rem;margin:0 1rem!important;color:#38b3f9;flex-shrink:0}.tree .toolbar .toolbar-item{display:none}.schema-root-type{cursor:auto;color:var(--fg2);font-weight:700;text-transform:uppercase}.schema-root-type.xxx-of{display:none}.toolbar-item:first-of-type{margin:0 2px 0 0}@media only screen and (min-width:576px){.key-descr{display:block}.tree .toolbar .toolbar-item{display:block}.toolbar{display:flex}}`;
|
|
9
9
|
|
|
10
10
|
exports.default = _default;
|
|
@@ -7,6 +7,6 @@ var _litElement = require("lit-element");
|
|
|
7
7
|
|
|
8
8
|
/* eslint-disable indent */
|
|
9
9
|
function callbackTemplate(callbacks) {
|
|
10
|
-
return (0, _litElement.html)` <div class="api-request col regular-font request-panel ${this.renderStyle}-mode"> ${Object.entries(callbacks).map(kv => (0, _litElement.html)` <div class="${this.renderStyle}-request"> <div class="req-res-title">CALLBACKS</div> <div class="table-title">${kv[0]}</div> ${Object.entries(kv[1]).map(pathObj => (0, _litElement.html)` <div class="mono-font small-font-size" style="display:flex"> <div style="width:100%"> ${Object.entries(pathObj[1]).map(method => (0, _litElement.html)` <div> <div style="margin-top:12px"> <div class="method method-fg ${method[0]}" style="width:70px;border:none;margin:0;padding:0;line-height:20px;vertical-align:baseline;text-align:left"> <span style="font-size:20px"> ⥄ </span> ${method[0]} </div> <span style="line-height:20px;vertical-align:baseline">${pathObj[0]} </span> </div> <div class="expanded-req-resp-container"> <api-request class="request-panel" callback="true" method="${method[0] || ''}" , path="${pathObj[0] || ''}" .parameters="${method[1] && method[1].parameters || ''}" .request_body="${method[1] && method[1].requestBody || ''}" fill-defaults="${this.fillRequestWithDefault}" enable-console="false" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="${this.schemaHideReadOnly}" fetch-credentials="${this.fetchCredentials}" exportparts="btn btn-fill btn-outline btn-try"> </api-request> <api-response callback="true" .responses="${method[1] && method[1].responses}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" exportparts="btn--resp btn-fill--resp btn-outline--resp"> </api-response> </div> </div> `)} </div> </div> `)} </div> `)} </div> `;
|
|
10
|
+
return (0, _litElement.html)` <div class="api-request col regular-font request-panel ${this.renderStyle}-mode"> ${Object.entries(callbacks).map(kv => (0, _litElement.html)` <div class="${this.renderStyle}-request"> <div class="req-res-title">CALLBACKS</div> <div class="table-title">${kv[0]}</div> ${Object.entries(kv[1]).map(pathObj => (0, _litElement.html)` <div class="mono-font small-font-size" style="display:flex"> <div style="width:100%"> ${Object.entries(pathObj[1]).map(method => (0, _litElement.html)` <div> <div style="margin-top:12px"> <div class="method method-fg ${method[0]}" style="width:70px;border:none;margin:0;padding:0;line-height:20px;vertical-align:baseline;text-align:left"> <span style="font-size:20px"> ⥄ </span> ${method[0]} </div> <span style="line-height:20px;vertical-align:baseline">${pathObj[0]} </span> </div> <div class="expanded-req-resp-container"> <api-request class="request-panel" callback="true" method="${method[0] || ''}" , path="${pathObj[0] || ''}" .parameters="${method[1] && method[1].parameters || ''}" .request_body="${method[1] && method[1].requestBody || ''}" fill-defaults="${this.fillRequestWithDefault}" display-nulls="${!!this.includeNulls}" enable-console="false" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="${this.schemaHideReadOnly}" fetch-credentials="${this.fetchCredentials}" exportparts="btn btn-fill btn-outline btn-try"> </api-request> <api-response callback="true" .responses="${method[1] && method[1].responses}" display-nulls="${!!this.includeNulls}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" exportparts="btn--resp btn-fill--resp btn-outline--resp"> </api-response> </div> </div> `)} </div> </div> `)} </div> `)} </div> `;
|
|
11
11
|
}
|
|
12
12
|
/* eslint-enable indent */
|
|
@@ -11,6 +11,8 @@ var _prismjs = _interopRequireDefault(require("prismjs"));
|
|
|
11
11
|
|
|
12
12
|
var _commonUtils = require("../utils/common-utils");
|
|
13
13
|
|
|
14
|
+
var _languages = require("../languages");
|
|
15
|
+
|
|
14
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
17
|
|
|
16
18
|
/* eslint-disable indent */
|
|
@@ -29,7 +31,7 @@ function codeSamplesTemplate(xCodeSamples) {
|
|
|
29
31
|
});
|
|
30
32
|
}}"> <div class="tab-buttons row" style="width:100"> ${xCodeSamples.map((v, i) => (0, _litElement.html)`<button class="tab-btn ${i === 0 ? 'active' : ''}" data-tab="${v.lang}${i}"> ${v.label || v.lang} </button>`)} </div> ${xCodeSamples.map((v, i) => (0, _litElement.html)` <div class="tab-content m-markdown code-sample-wrapper" style="display:${i === 0 ? 'block' : 'none'}" data-tab="${v.lang}${i}"> <button class="toolbar-copy-btn" @click="${e => {
|
|
31
33
|
(0, _commonUtils.copyToClipboard)(v.source, e);
|
|
32
|
-
}}"
|
|
34
|
+
}}">${(0, _languages.getI18nText)('operations.copy')}</button> <pre>
|
|
33
35
|
<code>${_prismjs.default.languages[v.lang && v.lang.toLowerCase()] ? (0, _unsafeHtml.unsafeHTML)(_prismjs.default.highlight(v.source, _prismjs.default.languages[v.lang && v.lang.toLowerCase()], v.lang && v.lang.toLowerCase())) : v.source}</code>
|
|
34
36
|
</pre> </div>`)} </div></section>`;
|
|
35
37
|
}
|
|
@@ -17,11 +17,13 @@ require("../components/schema-tree");
|
|
|
17
17
|
|
|
18
18
|
/* eslint-disable no-console */
|
|
19
19
|
function componentBodyTemplate(sComponent) {
|
|
20
|
-
const formdataPartSchema = (0, _schemaUtils.schemaInObjectNotation)(sComponent.component, {
|
|
20
|
+
const formdataPartSchema = (0, _schemaUtils.schemaInObjectNotation)(sComponent.component, {
|
|
21
|
+
includeNulls: this.includeNulls
|
|
22
|
+
});
|
|
21
23
|
return (0, _litElement.html)` <div class="expanded-endpoint-body observe-me ${sComponent.name}" id="cmp--${sComponent.id}"> <h2>${sComponent.name}</h2> <div class="mono-font regular-font-size" style="padding:8px 0;color:var(--fg2)"> ${this.displaySchemaAsTable ? (0, _litElement.html)`<schema-table .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-table>` : (0, _litElement.html)`<schema-tree .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-tree>`} </div> </div> `;
|
|
22
24
|
}
|
|
23
25
|
|
|
24
26
|
function componentsTemplate() {
|
|
25
|
-
return (0, _litElement.html)` ${this.resolvedSpec.components.map(component => (0, _litElement.html)` <div id="cmp--${component.name.toLowerCase()}" class="regular-font section-gap--
|
|
27
|
+
return (0, _litElement.html)` ${this.resolvedSpec.components.map(component => (0, _litElement.html)` <div id="cmp--${component.name.toLowerCase()}" class="regular-font section-gap--focused-mode observe-me" style="padding-bottom:0"> <div class="title tag">${component.name}</div> <div class="regular-font-size"> ${(0, _unsafeHtml.unsafeHTML)(`<div class='m-markdown regular-font'>${(0, _marked.marked)(component.description ? component.description : '')}</div>`)} </div> </div> <div class="regular-font section-gap--focused-mode" style="padding-top:0"> ${component.subComponents.filter(c => c.expanded).map(sComponent => componentBodyTemplate.call(this, sComponent))} </div> `)} `;
|
|
26
28
|
}
|
|
27
29
|
/* eslint-enable indent */
|
|
@@ -93,7 +93,7 @@ function endpointBodyTemplate(path) {
|
|
|
93
93
|
|
|
94
94
|
const nonEmptyApiKeys = this.resolvedSpec.securitySchemes.filter(v => v.finalKeyValue && path.security && path.security.some(ps => ps[v.apiKeyId])) || [];
|
|
95
95
|
const codeSampleTabPanel = path.xCodeSamples ? (0, _codeSamplesTemplate.default)(path.xCodeSamples) : '';
|
|
96
|
-
return (0, _litElement.html)` <div class="endpoint-body ${path.method}"> <div class="summary"> ${path.summary ? (0, _litElement.html)`<div class="title">${path.summary}<div></div></div>` : path.shortSummary !== path.description ? (0, _litElement.html)`<div class="title">${path.shortSummary}</div>` : ''} ${path.description ? (0, _litElement.html)`<div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.description))}</div>` : ''} <slot name="${path.elementId}"></slot> ${_securitySchemeTemplate.pathSecurityTemplate.call(this, path.security)} ${codeSampleTabPanel} </div> <div class="req-resp-container"> <div style="display:flex;flex-direction:column" class="request"> <api-request class="request-panel" style="width:100%" method="${path.method}" , path="${path.path}" .parameters="${path.parameters}" .request_body="${path.requestBody}" .api_keys="${nonEmptyApiKeys}" .servers="${path.servers}" server-url="${path.servers && path.servers.length > 0 ? path.servers[0].url : this.selectedServer.computedUrl}" active-schema-tab="${this.defaultSchemaTab}" fill-defaults="${this.fillRequestWithDefault}" enable-console="${this.allowTry}" accept="${accept}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="${this.schemaHideReadOnly}" fetch-credentials="${this.fetchCredentials}" exportparts="btn btn-fill btn-outline btn-try"> </api-request> </div> ${path.callbacks ? _callbackTemplate.default.call(this, path.callbacks) : ''} <api-response class="request response" .responses="${path.responses}" active-schema-tab="${this.defaultSchemaTab}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-write-only="${this.schemaHideWriteOnly}" selected-status="${Object.keys(path.responses || {})[0] || ''}" exportparts="btn--resp btn-fill--resp btn-outline--resp"> </api-response> </div> </div>`;
|
|
96
|
+
return (0, _litElement.html)` <div class="endpoint-body ${path.method}"> <div class="summary"> ${path.summary ? (0, _litElement.html)`<div class="title">${path.summary}<div></div></div>` : path.shortSummary !== path.description ? (0, _litElement.html)`<div class="title">${path.shortSummary}</div>` : ''} ${path.description ? (0, _litElement.html)`<div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.description))}</div>` : ''} <slot name="${path.elementId}"></slot> ${_securitySchemeTemplate.pathSecurityTemplate.call(this, path.security)} ${codeSampleTabPanel} </div> <div class="req-resp-container"> <div style="display:flex;flex-direction:column" class="request"> <api-request class="request-panel" style="width:100%" method="${path.method}" , path="${path.path}" element-id="${path.elementId}" .parameters="${path.parameters}" .request_body="${path.requestBody}" .api_keys="${nonEmptyApiKeys}" .servers="${path.servers}" server-url="${path.servers && path.servers.length > 0 ? path.servers[0].url : this.selectedServer.computedUrl}" active-schema-tab="${this.defaultSchemaTab}" fill-defaults="${this.fillRequestWithDefault}" display-nulls="${!!this.includeNulls}" enable-console="${this.allowTry}" accept="${accept}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="${this.schemaHideReadOnly}" fetch-credentials="${this.fetchCredentials}" exportparts="btn btn-fill btn-outline btn-try"> </api-request> </div> ${path.callbacks ? _callbackTemplate.default.call(this, path.callbacks) : ''} <api-response class="request response" .responses="${path.responses}" display-nulls="${!!this.includeNulls}" active-schema-tab="${this.defaultSchemaTab}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-write-only="${this.schemaHideWriteOnly}" selected-status="${Object.keys(path.responses || {})[0] || ''}" exportparts="btn--resp btn-fill--resp btn-outline--resp"> </api-response> </div> </div>`;
|
|
97
97
|
}
|
|
98
98
|
|
|
99
99
|
function endpointTemplate() {
|
|
@@ -36,7 +36,7 @@ function expandedEndpointBodyTemplate(path, tagName = '') {
|
|
|
36
36
|
|
|
37
37
|
const nonEmptyApiKeys = this.resolvedSpec.securitySchemes.filter(v => v.finalKeyValue && path.security && path.security.some(ps => ps[v.apiKeyId])) || [];
|
|
38
38
|
const codeSampleTabPanel = path.xCodeSamples ? _codeSamplesTemplate.default.call(this, path.xCodeSamples) : '';
|
|
39
|
-
return (0, _litElement.html)` ${this.renderStyle === 'read' ? (0, _litElement.html)`<div class="divider" part="operation-divider"></div>` : ''} <div class="expanded-endpoint-body observe-me ${path.method}" part="section-operation ${path.elementId}" id="${path.elementId}"> ${this.renderStyle === 'focused' && tagName !== 'General ⦂' ? (0, _litElement.html)`<h3 class="upper" style="font-weight:700"> ${tagName} </h3>` : ''} ${path.deprecated ? (0, _litElement.html)`<div class="bold-text red-text"> DEPRECATED </div>` : ''} ${(0, _litElement.html)` <h2> ${path.shortSummary || `${path.method.toUpperCase()} ${path.path}`}</h2> <div class='mono-font part="section-operation-url" regular-font-size' style="padding:8px 0;color:var(--fg3)"> ${path.isWebhook ? (0, _litElement.html)`<span style="color:var(--primary-color)"> WEBHOOK </span>` : ''} <span part="label-operation-method" class="regular-font upper method-fg bold-text ${path.method}">${path.method}</span> <span part="label-operation-path">${path.path}</span> </div>`} ${path.description ? (0, _litElement.html)`<div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.description))}</div>` : ''} <slot name="${path.elementId}"></slot> ${_securitySchemeTemplate.pathSecurityTemplate.call(this, path.security)} ${codeSampleTabPanel} <div class="expanded-req-resp-container"> <api-request class="request-panel" method="${path.method}" path="${path.path}" .parameters="${path.parameters}" .request_body="${path.requestBody}" .api_keys="${nonEmptyApiKeys}" .servers="${path.servers}" server-url="${path.servers && path.servers[0] && path.servers[0].url || this.selectedServer.computedUrl}" fill-defaults="${this.fillRequestWithDefault}" enable-console="${this.allowTry}" accept="${accept}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="${this.schemaHideReadOnly}" fetch-credentials="${this.fetchCredentials}" exportparts="btn btn-fill btn-outline btn-try"> </api-request> ${path.callbacks ? _callbackTemplate.default.call(this, path.callbacks) : ''} <api-response class="response-panel" .responses="${path.responses}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-write-only="${this.schemaHideWriteOnly}" selected-status="${Object.keys(path.responses || {})[0] || ''}" exportparts="btn--resp btn-fill--resp btn-outline--resp"> </api-response> </div> </div> `;
|
|
39
|
+
return (0, _litElement.html)` ${this.renderStyle === 'read' ? (0, _litElement.html)`<div class="divider" part="operation-divider"></div>` : ''} <div class="expanded-endpoint-body observe-me ${path.method}" part="section-operation ${path.elementId}" id="${path.elementId}"> ${this.renderStyle === 'focused' && tagName !== 'General ⦂' ? (0, _litElement.html)`<h3 class="upper" style="font-weight:700"> ${tagName} </h3>` : ''} ${path.deprecated ? (0, _litElement.html)`<div class="bold-text red-text"> DEPRECATED </div>` : ''} ${(0, _litElement.html)` <h2> ${path.shortSummary || `${path.method.toUpperCase()} ${path.path}`}</h2> <div class='mono-font part="section-operation-url" regular-font-size' style="padding:8px 0;color:var(--fg3)"> ${path.isWebhook ? (0, _litElement.html)`<span style="color:var(--primary-color)"> WEBHOOK </span>` : ''} <span part="label-operation-method" class="regular-font upper method-fg bold-text ${path.method}">${path.method}</span> <span part="label-operation-path">${path.path}</span> </div>`} ${path.description ? (0, _litElement.html)`<div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.description))}</div>` : ''} <slot name="${path.elementId}"></slot> ${_securitySchemeTemplate.pathSecurityTemplate.call(this, path.security)} ${codeSampleTabPanel} <div class="expanded-req-resp-container"> <api-request class="request-panel" method="${path.method}" path="${path.path}" element-id="${path.elementId}" .parameters="${path.parameters}" .request_body="${path.requestBody}" .api_keys="${nonEmptyApiKeys}" .servers="${path.servers}" server-url="${path.servers && path.servers[0] && path.servers[0].url || this.selectedServer.computedUrl}" fill-defaults="${this.fillRequestWithDefault}" display-nulls="${!!this.includeNulls}" enable-console="${this.allowTry}" accept="${accept}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="${this.schemaHideReadOnly}" fetch-credentials="${this.fetchCredentials}" exportparts="btn btn-fill btn-outline btn-try"> </api-request> ${path.callbacks ? _callbackTemplate.default.call(this, path.callbacks) : ''} <api-response class="response-panel" .responses="${path.responses}" display-nulls="${!!this.includeNulls}" render-style="${this.renderStyle}" schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}" active-schema-tab="${this.defaultSchemaTab}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-write-only="${this.schemaHideWriteOnly}" selected-status="${Object.keys(path.responses || {})[0] || ''}" exportparts="btn--resp btn-fill--resp btn-outline--resp"> </api-response> </div> </div> `;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
function expandedTagTemplate(tagId, subsectionFullId) {
|
|
@@ -11,6 +11,8 @@ var _marked = require("marked");
|
|
|
11
11
|
|
|
12
12
|
var _commonUtils = require("../utils/common-utils");
|
|
13
13
|
|
|
14
|
+
var _languages = require("../languages");
|
|
15
|
+
|
|
14
16
|
function onExpandCollapse(tagId) {
|
|
15
17
|
const tag = this.resolvedSpec.tags.find(t => t.elementId === tagId);
|
|
16
18
|
|
|
@@ -50,7 +52,7 @@ function expandCollapseAllComponents() {
|
|
|
50
52
|
function navbarTemplate() {
|
|
51
53
|
var _this$resolvedSpec$co;
|
|
52
54
|
|
|
53
|
-
return (0, _litElement.html)` <nav class="nav-bar ${this.renderStyle}" part="section-navbar"> ${this.allowSearch === 'false' && this.allowAdvancedSearch === 'false' ? '' : (0, _litElement.html)` <div style="display:flex;flex-direction:row;justify-content:center;align-items:center;padding:24px;${this.allowAdvancedSearch === 'false' ? 'border-bottom: 1px solid var(--nav-hover-bg-color)' : ''}"> ${this.allowSearch === 'false' ? '' : (0, _litElement.html)` <div style="display:flex;flex:1;line-height:22px"> <input id="nav-bar-search" part="textbox textbox-nav-filter" style="width:100%;padding-right:20px;color:var(--nav-hover-text-color);border-color:var(--secondary-color);background-color:var(--nav-hover-bg-color)" type="text" placeholder="
|
|
55
|
+
return (0, _litElement.html)` <nav class="nav-bar ${this.renderStyle}" part="section-navbar"> ${this.allowSearch === 'false' && this.allowAdvancedSearch === 'false' ? '' : (0, _litElement.html)` <div style="display:flex;flex-direction:row;justify-content:center;align-items:center;padding:24px;${this.allowAdvancedSearch === 'false' ? 'border-bottom: 1px solid var(--nav-hover-bg-color)' : ''}"> ${this.allowSearch === 'false' ? '' : (0, _litElement.html)` <div style="display:flex;flex:1;line-height:22px"> <input id="nav-bar-search" part="textbox textbox-nav-filter" style="width:100%;padding-right:20px;color:var(--nav-hover-text-color);border-color:var(--secondary-color);background-color:var(--nav-hover-bg-color)" type="text" placeholder="${(0, _languages.getI18nText)('menu.filter')}" @change="${this.onSearchChange}" spellcheck="false"> <div style="margin:6px 5px 0 -24px;font-size:var(--font-size-regular);cursor:pointer">↩</div> </div> ${this.matchPaths ? (0, _litElement.html)` <div @click="${this.onClearSearch}" style="margin-left:5px;cursor:pointer;align-self:center;color:var(--nav-text-color)" class="small-font-size primary-text bold-text"> CLEAR </div>` : ''} `} ${this.allowAdvancedSearch === 'false' || this.matchPaths ? '' : (0, _litElement.html)` <button class="m-btn primary" part="btn btn-fill btn-search" style="margin-left:5px" @click="${this.onShowSearchModalClicked}"> ${(0, _languages.getI18nText)('menu.search')} </button> `} </div> `} ${(0, _litElement.html)`<nav class="nav-scroll" part="navbar-scroll"> ${this.showInfo === 'false' || !this.resolvedSpec.info ? '' : (0, _litElement.html)`<div class="nav-bar-info" id="link-overview" data-content-id="overview" @click="${e => this.scrollToEventTarget(e, false)}"> ${this.isV1 && this.resolvedSpec.info.title || (0, _languages.getI18nText)('menu.overview')} </div>`} ${this.allowServerSelection === 'false' ? '' : (0, _litElement.html)`<div class="nav-bar-info" id="link-servers" data-content-id="servers" @click="${e => this.scrollToEventTarget(e, false)}"> ${(0, _languages.getI18nText)('menu.api-servers')} </div>`} ${this.allowAuthentication === 'false' || !this.resolvedSpec.securitySchemes ? '' : (0, _litElement.html)`<div class="nav-bar-info" id="link-auth" data-content-id="auth" @click="${e => this.scrollToEventTarget(e, false)}"> ${(0, _languages.getI18nText)('menu.authentication')} </div>`} <slot name="nav-section" class="custom-nav-section" data-content-id="section" @click="${e => this.scrollToCustomNavSectionTarget(e, false)}"></slot> <div class="sticky-scroll-element"> <div class="nav-bar-section" part="navbar-operations-header"> <slot name="operations-header"> <div class="nav-bar-section-title">${(0, _languages.getI18nText)('menu.operations')}</div> </slot> <div style="" part="navbar-operations-header-collapse"> ${this.resolvedSpec.tags.length > 1 && this.resolvedSpec.tags.some(tag => tag.paths.some(path => (0, _commonUtils.pathIsInSearch)(this.matchPaths, path))) ? (0, _litElement.html)` ${this.operationsCollapsed ? (0, _litElement.html)`<div @click="${() => {
|
|
54
56
|
expandCollapseAll.call(this);
|
|
55
57
|
}}" style="font-size:16px;transform:rotate(0);cursor:pointer">▸</div>` : (0, _litElement.html)`<div @click="${() => {
|
|
56
58
|
expandCollapseAll.call(this);
|
|
@@ -58,7 +60,7 @@ function navbarTemplate() {
|
|
|
58
60
|
onExpandCollapse.call(this, tag.elementId);
|
|
59
61
|
}}"> <div style="display:flex;justify-content:space-between;width:100%"> <div>${tag.name}</div> <div class="nav-bar-tag-icon expand-button-arrow">▸</div> <div class="nav-bar-tag-icon collapse-button-arrow">▾</div> </div> </div> `} <div class="tag-headers"> ${tag.headers.map(header => (0, _litElement.html)` <div class="nav-bar-h${header.depth}" id="link-${tag.elementId}--${new _marked.marked.Slugger().slug(header.text)}" data-content-id="${tag.elementId}--${new _marked.marked.Slugger().slug(header.text)}" @click="${e => this.scrollToEventTarget(e, false)}"> ${header.text} </div>`)} </div> <div class="nav-bar-paths-under-tag"> ${tag.paths.filter(v => (0, _commonUtils.pathIsInSearch)(this.matchPaths, v)).map(p => (0, _litElement.html)` <div class="nav-bar-path ${this.usePathInNavBar === 'true' ? 'small-font' : ''}" data-content-id="${p.elementId}" id="link-${p.elementId}" @click="${e => {
|
|
60
62
|
this.scrollToEventTarget(e, false);
|
|
61
|
-
}}"> <span style="line-break:anywhere;${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? (0, _litElement.html)`<span class="mono-font">${p.method.toUpperCase()} ${p.path}</span>` : p.summary || p.shortSummary} ${p.isWebhook ? '(Webhook)' : ''} </span> </div>`)} </div> </div> </slot> `)} ${(_this$resolvedSpec$co = this.resolvedSpec.components) !== null && _this$resolvedSpec$co !== void 0 && _this$resolvedSpec$co.length && !this.hideComponents ? (0, _litElement.html)` <div class="sticky-scroll-element"> <div id="link-components" class="nav-bar-section"> <slot name="components-header"> <div class="nav-bar-section-title"
|
|
63
|
+
}}"> <span style="line-break:anywhere;${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? (0, _litElement.html)`<span class="mono-font">${p.method.toUpperCase()} ${p.path}</span>` : p.summary || p.shortSummary} ${p.isWebhook ? '(Webhook)' : ''} </span> </div>`)} </div> </div> </slot> `)} ${(_this$resolvedSpec$co = this.resolvedSpec.components) !== null && _this$resolvedSpec$co !== void 0 && _this$resolvedSpec$co.length && !this.hideComponents ? (0, _litElement.html)` <div class="sticky-scroll-element"> <div id="link-components" class="nav-bar-section"> <slot name="components-header"> <div class="nav-bar-section-title">${(0, _languages.getI18nText)('menu.components')}</div> </slot> ${this.resolvedSpec.components.some(c => c.subComponents.some(s => (0, _commonUtils.componentIsInSearch)(this.matchPaths, s))) ? (0, _litElement.html)` <div style="" part="navbar-components-header-collapse"> ${this.componentsCollapsed ? (0, _litElement.html)`<div @click="${() => {
|
|
62
64
|
expandCollapseAllComponents.call(this);
|
|
63
65
|
}}" style="font-size:16px;transform:rotate(0);cursor:pointer">▸</div>` : (0, _litElement.html)`<div @click="${() => {
|
|
64
66
|
expandCollapseAllComponents.call(this);
|
|
@@ -9,8 +9,10 @@ var _unsafeHtml = require("lit-html/directives/unsafe-html.js");
|
|
|
9
9
|
|
|
10
10
|
var _marked = require("marked");
|
|
11
11
|
|
|
12
|
+
var _languages = require("../languages");
|
|
13
|
+
|
|
12
14
|
/* eslint-disable indent */
|
|
13
15
|
function overviewTemplate() {
|
|
14
|
-
return (0, _litElement.html)` <section id="overview" part="section-overview" class="observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> ${this.resolvedSpec && this.resolvedSpec.info ? (0, _litElement.html)` <slot name="overview"> <div id="api-title" part="label-overview-title" style="font-size:32px" class="section-padding"> ${this.resolvedSpec.info.title} ${!this.resolvedSpec.info.version ? '' : (0, _litElement.html)` <span style="font-size:var(--font-size-small);font-weight:700"> ${this.resolvedSpec.info.version} </span>`} </div> <div id="api-info" style="font-size:calc(var(--font-size-regular) - 1px);margin-top:8px" class="section-padding"> ${this.resolvedSpec.info.contact && this.resolvedSpec.info.contact.email ? (0, _litElement.html)`<span>${this.resolvedSpec.info.contact.name || '
|
|
16
|
+
return (0, _litElement.html)` <section id="overview" part="section-overview" class="observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> ${this.resolvedSpec && this.resolvedSpec.info ? (0, _litElement.html)` <slot name="overview"> <div id="api-title" part="label-overview-title" style="font-size:32px" class="section-padding"> ${this.resolvedSpec.info.title} ${!this.resolvedSpec.info.version ? '' : (0, _litElement.html)` <span style="font-size:var(--font-size-small);font-weight:700"> ${this.resolvedSpec.info.version} </span>`} </div> <div id="api-info" style="font-size:calc(var(--font-size-regular) - 1px);margin-top:8px" class="section-padding"> ${this.resolvedSpec.info.contact && this.resolvedSpec.info.contact.email ? (0, _litElement.html)`<span>${this.resolvedSpec.info.contact.name || (0, _languages.getI18nText)('overview.email')}: <a href="mailto:${this.resolvedSpec.info.contact.email}" part="anchor anchor-overview">${this.resolvedSpec.info.contact.email}</a> </span>` : ''} ${this.resolvedSpec.info.contact && this.resolvedSpec.info.contact.url ? (0, _litElement.html)`<span>URL: <a href="${this.resolvedSpec.info.contact.url}" part="anchor anchor-overview">${this.resolvedSpec.info.contact.url}</a></span>` : ''} ${this.resolvedSpec.info.license ? (0, _litElement.html)`<span>License: ${this.resolvedSpec.info.license.url ? (0, _litElement.html)`<a href="${this.resolvedSpec.info.license.url}" part="anchor anchor-overview">${this.resolvedSpec.info.license.name}</a>` : this.resolvedSpec.info.license.name} </span>` : ''} ${this.resolvedSpec.info.termsOfService ? (0, _litElement.html)`<span><a href="${this.resolvedSpec.info.termsOfService}" part="anchor anchor-overview">${(0, _languages.getI18nText)('overview.terms-of-service')}</a></span>` : ''} </div> </slot> <slot name="overview-api-description"> ${this.resolvedSpec.info.description ? (0, _litElement.html)`${(0, _unsafeHtml.unsafeHTML)(`<div class="m-markdown regular-font section-padding">${(0, _marked.marked)(this.resolvedSpec.info.description)}</div>`)}` : ''} </slot> ` : ''} </section> `;
|
|
15
17
|
}
|
|
16
18
|
/* eslint-enable indent */
|
|
@@ -13,6 +13,8 @@ var _marked = require("marked");
|
|
|
13
13
|
|
|
14
14
|
var _base64url = _interopRequireDefault(require("base64url"));
|
|
15
15
|
|
|
16
|
+
var _languages = require("../languages");
|
|
17
|
+
|
|
16
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
19
|
|
|
18
20
|
function onApiKeyChange(apiKeyId, e) {
|
|
@@ -293,16 +295,16 @@ function securitySchemeTemplate() {
|
|
|
293
295
|
}
|
|
294
296
|
|
|
295
297
|
const providedApiKeys = schemes.filter(v => v.finalKeyValue);
|
|
296
|
-
return (0, _litElement.html)` <section id="auth" part="section-auth" class="observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> <slot name="authentication"> <div class="section-padding"> <div class="sub-title regular-font"
|
|
298
|
+
return (0, _litElement.html)` <section id="auth" part="section-auth" class="observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> <slot name="authentication"> <div class="section-padding"> <div class="sub-title regular-font">${(0, _languages.getI18nText)('headers.authentication')}</div> <div class="small-font-size" style="display:flex;align-items:center;min-height:30px"> ${providedApiKeys.length > 0 ? (0, _litElement.html)` <div class="blue-text"> ${providedApiKeys.length} API key applied </div> <div style="flex:1"></div> <button class="m-btn thin-border" part="btn btn-outline" @click="${() => {
|
|
297
299
|
onClearAllApiKeys.call(this);
|
|
298
|
-
}}">CLEAR ALL API KEYS</button>` : (0, _litElement.html)`<div class="red-text"
|
|
300
|
+
}}">CLEAR ALL API KEYS</button>` : (0, _litElement.html)`<div class="red-text">${(0, _languages.getI18nText)('authentication.no-api-key-applied')}</div>`} </div> ${schemes.length > 0 ? (0, _litElement.html)` <table role="presentation" class="m-table" style="width:100%"> ${schemes.map(v => (0, _litElement.html)` <tr> <td style="max-width:500px;overflow-wrap:break-word"> <div style="min-height:24px"> <span style="font-weight:700">${v.typeDisplay}</span> ${v.finalKeyValue ? (0, _litElement.html)` <span class="blue-text"> ${v.finalKeyValue ? 'Key Applied' : ''} </span> <button class="m-btn thin-border small" part="btn btn-outline" @click="${() => {
|
|
299
301
|
v.finalKeyValue = '';
|
|
300
302
|
this.requestUpdate();
|
|
301
303
|
}}">REMOVE</button> ` : ''} </div> ${v.description ? (0, _litElement.html)` <div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(v.description || ''))} </div>` : ''} </td> <td> ${v.type && (v.type.toLowerCase() === 'apikey' || v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'bearer') ? (0, _litElement.html)` ${v.type.toLowerCase() === 'apikey' ? (0, _litElement.html)`Send <code>${v.name}</code> in <code>${v.in}</code> with the given value:` : (0, _litElement.html)`Send <code>Authorization</code> in <code>header</code> containing the word <code>Bearer</code> followed by a space and a Token String.`} <form style="display:flex"> ${v.in === 'cookie' ? (0, _litElement.html)` <div style="display:block"> <input type="text" value="${getCookieValue(v.apiKeyId)}" disabled="disabled" class="api-key-input" placeholder="IygRVGf54B59e0GAkKmigGfuiVlp/uhFfk2ifA+jMMJzau2F1jPldc09gPTfnMw13BFBxqUZIFDm55DPfwkb0A==" spellcheck="false" style="resize:horizontal;width:100%"> <br> <small> <strong>Cookies</strong> are set and configured by the remote service, therefore it is not possible to configure them from the browser. </small> </div>` : (0, _litElement.html)` <input type="text" value="${v.value}" class="api-key-input" placeholder="api-token" spellcheck="false"> <button type="submit" class="m-btn thin-border" style="margin-left:5px" part="btn btn-outline" @click="${e => {
|
|
302
304
|
onApiKeyChange.call(this, v.apiKeyId, e);
|
|
303
|
-
}}"> ${v.finalKeyValue ? 'UPDATE' : 'SET'} </button>`} </form>` : ''} ${v.type && v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'basic' ? (0, _litElement.html)`
|
|
305
|
+
}}"> ${v.finalKeyValue ? 'UPDATE' : 'SET'} </button>`} </form>` : ''} ${v.type && v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'basic' ? (0, _litElement.html)` ${(0, _languages.getI18nText)('authentication.http-basic-desc')} <form style="display:flex"> <input type="text" value="${v.user}" placeholder="${(0, _languages.getI18nText)('authentication.username')}" spellcheck="false" class="api-key-user" style="width:100px"> <input type="password" value="${v.password}" placeholder="${(0, _languages.getI18nText)('authentication.password')}" spellcheck="false" class="api-key-password" style="width:100px;margin:0 5px"> <button type="submit" class="m-btn thin-border" @click="${e => {
|
|
304
306
|
onApiKeyChange.call(this, v.apiKeyId, e);
|
|
305
|
-
}}" part="btn btn-outline"> ${v.finalKeyValue ? 'UPDATE' : '
|
|
307
|
+
}}" part="btn btn-outline"> ${v.finalKeyValue ? 'UPDATE' : (0, _languages.getI18nText)('authentication.set')} </button> </form>` : ''} </td> </tr> ${v.type.toLowerCase() === 'oauth2' ? (0, _litElement.html)` <tr> <td colspan="2" style="border:none;padding-left:48px"> ${Object.keys(v.flows).map(f => oAuthFlowTemplate.call(this, f, v, v.flows[f]))} </td> </tr> ` : ''} `)} </table>` : ''} </div> </slot> </section> `;
|
|
306
308
|
}
|
|
307
309
|
|
|
308
310
|
function getOauthScopeTemplate(scopes) {
|
|
@@ -334,7 +336,7 @@ function pathSecurityTemplate(pathSecurity) {
|
|
|
334
336
|
securityDefs: andSecurityKeys1
|
|
335
337
|
});
|
|
336
338
|
});
|
|
337
|
-
return (0, _litElement.html)`<div class="security-info-button" data-content-id="auth" @click="${e => this.scrollToEventTarget(e, false)}"> <div style="position:relative;display:flex;min-width:350px;max-width:700px;justify-content:flex-end"> <svg width="16" height="24" style="cursor:pointer"> <g> <path style="fill:var(--fg3)" d="m13.8,8.5l0,-2.6l0,0c0,-3.2 -2.6,-5.8 -5.8,-5.8s-5.8,2.6 -5.8,5.8l0,0l0,2.6l-2.1,0l0,11.2l16,0l0,-11.2l-2.1,0l-0,0l0,0l0,0l-0,0zm-9.8,-2.6c0,0 0,0 0,0c0,-2.2 1.8,-4 4,-4c2.2,0 4,1.8 4,4c0,0 0,0 0,0l0,2.6l-8.03,0l0,-2.6l0,0l0,0z"/> </g> </svg> ${orSecurityKeys1.map((orSecurityItem1, i) => (0, _litElement.html)` ${i !== 0 ? (0, _litElement.html)`<div style="padding:3px 4px"> OR </div>` : ''} <div class="tooltip" style="cursor:pointer"> <div style="padding:2px 4px;white-space:nowrap;text-overflow:ellipsis;max-width:150px;overflow:hidden"> <span part="anchor anchor-operation-security"> ${orSecurityItem1.securityTypes} </span> </div> <div class="tooltip-text" style="position:absolute;color:var(--fg);top:26px;right:0;border:1px solid var(--border-color);padding:2px 4px;display:block"> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<div>Requires <b>all</b> of the following </div>` : ''} <div style="padding-left:8px"> ${orSecurityItem1.securityDefs.map((andSecurityItem, j) => (0, _litElement.html)` ${andSecurityItem.type === 'oauth2' ? (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> ` : (0, _litElement.html)`Requires`} OAuth token (${andSecurityItem.apiKeyId}) in <b>Authorization header</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : andSecurityItem.type === 'http' ? (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> ` : (0, _litElement.html)`
|
|
339
|
+
return (0, _litElement.html)`<div class="security-info-button" data-content-id="auth" @click="${e => this.scrollToEventTarget(e, false)}"> <div style="position:relative;display:flex;min-width:350px;max-width:700px;justify-content:flex-end"> <svg width="16" height="24" style="cursor:pointer"> <g> <path style="fill:var(--fg3)" d="m13.8,8.5l0,-2.6l0,0c0,-3.2 -2.6,-5.8 -5.8,-5.8s-5.8,2.6 -5.8,5.8l0,0l0,2.6l-2.1,0l0,11.2l16,0l0,-11.2l-2.1,0l-0,0l0,0l0,0l-0,0zm-9.8,-2.6c0,0 0,0 0,0c0,-2.2 1.8,-4 4,-4c2.2,0 4,1.8 4,4c0,0 0,0 0,0l0,2.6l-8.03,0l0,-2.6l0,0l0,0z"/> </g> </svg> ${orSecurityKeys1.map((orSecurityItem1, i) => (0, _litElement.html)` ${i !== 0 ? (0, _litElement.html)`<div style="padding:3px 4px"> OR </div>` : ''} <div class="tooltip" style="cursor:pointer"> <div style="padding:2px 4px;white-space:nowrap;text-overflow:ellipsis;max-width:150px;overflow:hidden"> <span part="anchor anchor-operation-security"> ${orSecurityItem1.securityTypes} </span> </div> <div class="tooltip-text" style="position:absolute;color:var(--fg);top:26px;right:0;border:1px solid var(--border-color);padding:2px 4px;display:block"> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<div>Requires <b>all</b> of the following </div>` : ''} <div style="padding-left:8px"> ${orSecurityItem1.securityDefs.map((andSecurityItem, j) => (0, _litElement.html)` ${andSecurityItem.type === 'oauth2' ? (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> ` : (0, _litElement.html)`Requires`} OAuth token (${andSecurityItem.apiKeyId}) in <b>Authorization header</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : andSecurityItem.type === 'http' ? (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> ` : (0, _litElement.html)`${(0, _languages.getI18nText)('authentication.requires')}`} ${andSecurityItem.scheme === 'basic' ? (0, _languages.getI18nText)('authentication.http-basic-note') : 'Bearer Token'} ${(0, _languages.getI18nText)('authentication.in-auth-header')} ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> ` : (0, _litElement.html)`Requires`} Token in <b>${andSecurityItem.name} ${andSecurityItem.in}</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>`} `)} </div> </div> </div> `)} </div> </div>`;
|
|
338
340
|
}
|
|
339
341
|
|
|
340
342
|
return '';
|
|
@@ -9,6 +9,8 @@ var _marked = require("marked");
|
|
|
9
9
|
|
|
10
10
|
var _unsafeHtml = require("lit-html/directives/unsafe-html.js");
|
|
11
11
|
|
|
12
|
+
var _languages = require("../languages");
|
|
13
|
+
|
|
12
14
|
function onApiServerChange(e, server) {
|
|
13
15
|
if (e && e.target.checked) {
|
|
14
16
|
this.selectedServer = server;
|
|
@@ -30,7 +32,7 @@ function onApiServerVarChange(e, serverObj) {
|
|
|
30
32
|
|
|
31
33
|
|
|
32
34
|
function serverVarsTemplate() {
|
|
33
|
-
return this.selectedServer && this.selectedServer.variables ? (0, _litElement.html)` <div class="table-title"
|
|
35
|
+
return this.selectedServer && this.selectedServer.variables ? (0, _litElement.html)` <div class="table-title">${(0, _languages.getI18nText)('api-servers.server-variables')}</div> <table role="presentation" class="m-table"> ${Object.entries(this.selectedServer.variables).map(kv => (0, _litElement.html)` <tr> <td style="vertical-align:middle">${kv[0]}</td> <td> ${kv[1].enum ? (0, _litElement.html)` <select data-var="${kv[0]}" @input="${e => {
|
|
34
36
|
onApiServerVarChange.call(this, e, this.selectedServer);
|
|
35
37
|
}}"> ${Object.entries(kv[1].enum).map(e => kv[1].default === e[1] ? (0, _litElement.html)` <option selected="selected" label="${e[1]}" value="${e[1]}">` : (0, _litElement.html)` <option label="${e[1]}" value="${e[1]}">`)} </select>` : (0, _litElement.html)` <input type="text" part="textbox textbox-server-var" spellcheck="false" data-var="${kv[0]}" value="${kv[1].default}" @input="${e => {
|
|
36
38
|
onApiServerVarChange.call(this, e, this.selectedServer);
|
|
@@ -42,8 +44,8 @@ function serverTemplate() {
|
|
|
42
44
|
return undefined;
|
|
43
45
|
}
|
|
44
46
|
|
|
45
|
-
return (0, _litElement.html)` <section id="servers" part="section-servers" style="margin-top:24px;margin-bottom:24px" class="regular-font observe-me section-padding ${this.renderStyle === 'read' ? 'section-gap--read-mode' : this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> <div class="sub-title"
|
|
47
|
+
return (0, _litElement.html)` <section id="servers" part="section-servers" style="margin-top:24px;margin-bottom:24px" class="regular-font observe-me section-padding ${this.renderStyle === 'read' ? 'section-gap--read-mode' : this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> <div class="sub-title">${(0, _languages.getI18nText)('headers.api-servers')}</div> <div class="mono-font" style="margin:12px 0;font-size:calc(var(--font-size-small) + 1px)"> ${!this.resolvedSpec.servers || !this.resolvedSpec.servers.length ? '' : (0, _litElement.html)` ${this.resolvedSpec.servers.map((server, i) => (0, _litElement.html)` <input type="radio" name="api_server" id="srvr-opt-${i}" value="${server.url}" @change="${e => {
|
|
46
48
|
onApiServerChange.call(this, e, server);
|
|
47
|
-
}}" .checked="${this.selectedServer.url === server.url}" style="margin:4px 0;cursor:pointer"> <label style="cursor:pointer" for="srvr-opt-${i}"> ${server.url} ${server.description ? (0, _litElement.html)`- <span class="regular-font">${server.description} </span>` : ''} </label> <br> `)} `} <div class="table-title primary-text" part="label-selected-server">
|
|
49
|
+
}}" .checked="${this.selectedServer.url === server.url}" style="margin:4px 0;cursor:pointer"> <label style="cursor:pointer" for="srvr-opt-${i}"> ${server.url} ${server.description ? (0, _litElement.html)`- <span class="regular-font">${server.description} </span>` : ''} </label> <br> `)} `} <div class="table-title primary-text" part="label-selected-server"> ${(0, _languages.getI18nText)('api-servers.selected')}: ${this.selectedServer && this.selectedServer.computedUrl || 'none'}</div> </div> <slot name="servers"></slot> ${serverVarsTemplate.call(this)} </section>`;
|
|
48
50
|
}
|
|
49
51
|
/* eslint-enable indent */
|
|
@@ -13,6 +13,8 @@ exports.replaceState = replaceState;
|
|
|
13
13
|
exports.schemaKeys = schemaKeys;
|
|
14
14
|
exports.sleep = sleep;
|
|
15
15
|
|
|
16
|
+
var _languages = require("../languages");
|
|
17
|
+
|
|
16
18
|
/* For Delayed Event Handler Execution */
|
|
17
19
|
function debounce(fn, delay) {
|
|
18
20
|
let timeoutID = null;
|
|
@@ -45,9 +47,9 @@ function copyToClipboard(data, e) {
|
|
|
45
47
|
|
|
46
48
|
try {
|
|
47
49
|
document.execCommand('copy');
|
|
48
|
-
btnEl.innerText = '
|
|
50
|
+
btnEl.innerText = (0, _languages.getI18nText)('operations.copied');
|
|
49
51
|
setTimeout(() => {
|
|
50
|
-
btnEl.innerText = '
|
|
52
|
+
btnEl.innerText = (0, _languages.getI18nText)('operations.copy');
|
|
51
53
|
}, 5000);
|
|
52
54
|
} catch (err) {
|
|
53
55
|
console.error('Unable to copy', err); // eslint-disable-line no-console
|