openapi-explorer 0.10.435 → 0.10.439
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 +1 -0
- package/dist/browser/openapi-explorer.min.js +4 -4
- package/dist/es/openapi-explorer.js +13 -2
- package/dist/es/styles/nav-styles.js +1 -1
- package/dist/es/templates/advance-search-template.js +1 -1
- package/dist/es/templates/endpoint-template.js +2 -2
- package/dist/es/templates/navbar-template.js +5 -5
- package/dist/lib/openapi-explorer.js +13 -2
- package/dist/lib/styles/nav-styles.js +1 -1
- package/dist/lib/templates/advance-search-template.js +1 -1
- package/dist/lib/templates/endpoint-template.js +2 -2
- package/dist/lib/templates/navbar-template.js +5 -5
- package/package.json +1 -1
|
@@ -424,7 +424,18 @@ export default class OpenApiExplorer extends LitElement {
|
|
|
424
424
|
}
|
|
425
425
|
|
|
426
426
|
onSearchChange(e) {
|
|
427
|
+
var _this$matchPaths;
|
|
428
|
+
|
|
427
429
|
this.matchPaths = e.target.value;
|
|
430
|
+
const expand = !!((_this$matchPaths = this.matchPaths) !== null && _this$matchPaths !== void 0 && _this$matchPaths.trim());
|
|
431
|
+
this.operationsCollapsed = !expand;
|
|
432
|
+
this.componentsCollapsed = !expand;
|
|
433
|
+
this.resolvedSpec.tags.forEach(tag => {
|
|
434
|
+
tag.expanded = expand;
|
|
435
|
+
});
|
|
436
|
+
this.resolvedSpec.components.forEach(component => {
|
|
437
|
+
component.expanded = expand;
|
|
438
|
+
});
|
|
428
439
|
this.requestUpdate();
|
|
429
440
|
}
|
|
430
441
|
|
|
@@ -796,7 +807,7 @@ export default class OpenApiExplorer extends LitElement {
|
|
|
796
807
|
} // Event handler for Advanced Search text-inputs and checkboxes
|
|
797
808
|
|
|
798
809
|
|
|
799
|
-
onAdvancedSearch(ev
|
|
810
|
+
onAdvancedSearch(ev) {
|
|
800
811
|
const eventTargetEl = ev.target;
|
|
801
812
|
clearTimeout(this.timeoutId);
|
|
802
813
|
this.timeoutId = setTimeout(() => {
|
|
@@ -810,7 +821,7 @@ export default class OpenApiExplorer extends LitElement {
|
|
|
810
821
|
|
|
811
822
|
const searchOptions = [...eventTargetEl.closest('.advanced-search-options').querySelectorAll('input:checked')].map(v => v.id);
|
|
812
823
|
this.advancedSearchMatches = advancedSearch(searchInputEl.value, this.resolvedSpec.tags, searchOptions);
|
|
813
|
-
},
|
|
824
|
+
}, 0);
|
|
814
825
|
}
|
|
815
826
|
|
|
816
827
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export default css`.nav-bar{width:0;height:100%;overflow:hidden;color:var(--nav-text-color);background-color:var(--nav-bg-color);background-blend-mode:multiply;line-height:calc(var(--font-size-small) + 4px);display:none;position:relative;flex-direction:column;flex-wrap:nowrap;word-break:break-word}.nav-scroll{overflow-x:hidden;overflow-y:auto;overflow-y:overlay;scrollbar-width:thin;scrollbar-color:var(--nav-hover-bg-color) transparent}.nav-bar-tag{display:flex;align-items:center;justify-content:space-between;flex-direction:row}.
|
|
2
|
+
export default css`.nav-bar{width:0;height:100%;overflow:hidden;color:var(--nav-text-color);background-color:var(--nav-bg-color);background-blend-mode:multiply;line-height:calc(var(--font-size-small) + 4px);display:none;position:relative;flex-direction:column;flex-wrap:nowrap;word-break:break-word}.nav-scroll{overflow-x:hidden;overflow-y:auto;overflow-y:overlay;scrollbar-width:thin;scrollbar-color:var(--nav-hover-bg-color) transparent}.nav-bar-tag{display:flex;align-items:center;justify-content:space-between;flex-direction:row}.toggle{font-size:16px;cursor:pointer;color:var(--nav-text-color);transform:translate(-5px,0) rotate(0);transition:transform .1s ease}.toggle:hover{color:var(--nav-hover-text-color)}.collapsed .toggle{transform:translate(-6px,0) rotate(-90deg)}.nav-bar-tag-and-paths>.nav-bar-section-wrapper{max-height:5000px;transition:max-height 1.2s ease-in-out;overflow:hidden}.nav-bar-tag-and-paths.collapsed>.nav-bar-section-wrapper{transition:max-height 1.2s ease-in-out -1s;max-height:0}.nav-bar.focused,.nav-scroll{border-top:1px solid var(--secondary-color)}.nav-scroll::-webkit-scrollbar{width:10px}.nav-scroll::-webkit-scrollbar-track{background:0 0}.nav-scroll::-webkit-scrollbar-thumb{background-color:var(--nav-hover-bg-color)}.nav-bar-tag{font-size:var(--font-size-regular);color:var(--secondary-color);border-left:4px solid transparent;font-weight:700;padding:15px 15px 15px 10px}.nav-bar-components,.nav-bar-h1,.nav-bar-h2,.nav-bar-info,.nav-bar-path,.nav-bar-tag,slot[name=nav-section]::slotted(*){display:flex;cursor:pointer;border-left:4px solid transparent}.nav-bar-h1,.nav-bar-h2,.nav-bar-path{font-size:calc(var(--font-size-small) + 1px);padding:var(--nav-item-padding)}.nav-bar-path.small-font{font-size:var(--font-size-small)}.nav-bar-info,slot[name=nav-section]::slotted(*){font-size:var(--font-size-regular);padding:16px 10px;font-weight:700}.nav-bar-section{display:flex;flex-direction:row;justify-content:space-between;font-size:var(--font-size-small);color:var(--nav-text-color);padding:15px 15px 5px 5px;font-weight:700;border-bottom:1px solid var(--nav-text-color);background:var(--nav-bg-color)}.sticky-scroll-element{position:sticky;top:0;z-index:1;cursor:pointer}.nav-bar-h1{padding-left:20px}.nav-bar-h2{padding-left:30px}.nav-bar-h1.active,.nav-bar-h1.active:hover,.nav-bar-h2.active,.nav-bar-h2.active:hover,.nav-bar-info.active,.nav-bar-info.active:hover,.nav-bar-path.active,.nav-bar-path.active:hover,.nav-bar-tag.active,.nav-bar-tag.active:hover,slot[name=nav-section]::slotted(.active),slot[name=nav-section]::slotted(.active:hover){border-left:4px solid var(--secondary-color);color:var(--secondary-color);background-color:var(--nav-hover-bg-color)}.nav-bar-h1:hover,.nav-bar-h2:hover,.nav-bar-info:hover,.nav-bar-path:hover,.nav-bar-tag:hover,slot[name=nav-section]::slotted(:hover){color:var(--nav-hover-text-color);background-color:var(--nav-hover-bg-color)}`;
|
|
@@ -25,7 +25,7 @@ export default function searchByPropertiesModalTemplate() {
|
|
|
25
25
|
});
|
|
26
26
|
return html` ${this.showAdvancedSearchDialog ? html` <div class="dialog-box-overlay"> <div class="dialog-box"> <header class="dialog-box-header"> <span class="dialog-box-title">Advanced Search</span> <button class="m-btn thin-border" @click="${() => {
|
|
27
27
|
closeAdvancedSearchDialog();
|
|
28
|
-
}}" part="btn btn-outline">×</button> </header> <div id="advanced-search-modal" class="dialog-box-content"> <span class="advanced-search-options"> <div class="advanced-search-dialog-input"> <input id="advanced-search-dialog-input" type="text" part="textbox textbox-search-dialog" placeholder="search text..." spellcheck="false" @keyup="${e => this.onAdvancedSearch(e
|
|
28
|
+
}}" part="btn btn-outline">×</button> </header> <div id="advanced-search-modal" class="dialog-box-content"> <span class="advanced-search-options"> <div class="advanced-search-dialog-input"> <input id="advanced-search-dialog-input" type="text" part="textbox textbox-search-dialog" placeholder="search text..." spellcheck="false" @keyup="${e => this.onAdvancedSearch(e)}"> </div> <div class="advanced-search-locations"> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-path" checked="checked" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-path"> API Path </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-descr" checked="checked" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-descr"> API Description </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-params" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-params"> Request Parameters </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-request-body" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-request-body"> Request Body </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-resp-descr" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-resp-descr"> Response Description </label> </div> </div> </span> <div class="advanced-search-results"> ${this.advancedSearchMatches && this.advancedSearchMatches.map(path => html` <div class="mono-font small-font-size hover-bg" tabindex="0" style="padding:5px;cursor:pointer;border-bottom:1px solid var(--light-border-color);${path.deprecated ? 'filter:opacity(0.5);' : ''}" data-content-id="${path.elementId}" @click="${e => {
|
|
29
29
|
this.matchPaths = ''; // clear quick filter if applied
|
|
30
30
|
|
|
31
31
|
closeAdvancedSearchDialog(); // Hide Search Dialog
|
|
@@ -60,7 +60,7 @@ export function expandCollapseAll(currentElement, action = 'expand-all') {
|
|
|
60
60
|
function endpointHeadTemplate(path) {
|
|
61
61
|
return html` <summary @click="${e => {
|
|
62
62
|
toggleExpand.call(this, path, e);
|
|
63
|
-
}}" class="endpoint-head ${path.method} ${path.expanded ? 'expanded' : 'collapsed'}"> <div class="method ${path.method}"> ${path.method} </div> <div
|
|
63
|
+
}}" class="endpoint-head ${path.method} ${path.expanded ? 'expanded' : 'collapsed'}"> <div class="method ${path.method}"> ${path.method} </div> <div style="${path.deprecated ? 'text-decoration: line-through;' : ''}"> ${this.usePathInNavBar === 'true' ? html`<div class="path">${path.path.split('/').filter(t => t.trim()).map(t => html`<span>/${t}</span>`)}</div>` : html`<div class="">${path.summary || path.shortSummary}</div>`} ${path.isWebhook ? html`<span style="color:var(--primary-color)"> (Webhook) </span>` : ''} </div> </summary> `;
|
|
64
64
|
}
|
|
65
65
|
|
|
66
66
|
function endpointBodyTemplate(path) {
|
|
@@ -78,7 +78,7 @@ function endpointBodyTemplate(path) {
|
|
|
78
78
|
|
|
79
79
|
const nonEmptyApiKeys = this.resolvedSpec.securitySchemes.filter(v => v.finalKeyValue && path.security && path.security.some(ps => ps[v.apiKeyId])) || [];
|
|
80
80
|
const codeSampleTabPanel = path.xCodeSamples ? codeSamplesTemplate(path.xCodeSamples) : '';
|
|
81
|
-
return html` <div class="endpoint-body ${path.method}"> <div class="summary"> ${path.summary ? html`<div class="title">${path.summary}<div></div></div>` : path.shortSummary !== path.description ? html`<div class="title">${path.shortSummary}</div>` : ''} ${path.description ? html`<div class="m-markdown"> ${unsafeHTML(marked(path.description))}</div>` : ''} <slot name="${path.elementId}"></slot> ${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) === null || _path$servers === void 0 ? void 0 : (_path$servers$ = _path$servers[0]) === null || _path$servers$ === void 0 ? void 0 : _path$servers$.url) || ((_this$selectedServer = this.selectedServer) === null || _this$selectedServer === void 0 ? void 0 : _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.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>`;
|
|
81
|
+
return html` <div class="endpoint-body ${path.method}"> <div class="summary"> ${this.usePathInNavBar === 'true' ? path.summary ? html`<div class="title">${path.summary}<div></div></div>` : path.shortSummary !== path.description ? html`<div class="title">${path.shortSummary}</div>` : '' : html` <div class="title mono-font regular-font-size" part="section-operation-url" style="display:flex;flex-wrap:wrap;color:var(--fg3)"> ${path.isWebhook ? 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 style="display:flex;flex-wrap:wrap" part="label-operation-path">${path.path.split('/').filter(t => t.trim()).map(t => html`<span>/${t}</span>`)}</span> </div>`} ${path.description ? html`<div class="m-markdown"> ${unsafeHTML(marked(path.description))}</div>` : ''} <slot name="${path.elementId}"></slot> ${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) === null || _path$servers === void 0 ? void 0 : (_path$servers$ = _path$servers[0]) === null || _path$servers$ === void 0 ? void 0 : _path$servers$.url) || ((_this$selectedServer = this.selectedServer) === null || _this$selectedServer === void 0 ? void 0 : _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.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>`;
|
|
82
82
|
}
|
|
83
83
|
|
|
84
84
|
export default function endpointTemplate() {
|
|
@@ -40,14 +40,14 @@ export function expandCollapseAllComponents() {
|
|
|
40
40
|
export default function navbarTemplate() {
|
|
41
41
|
var _this$resolvedSpec$co;
|
|
42
42
|
|
|
43
|
-
return html` <nav class="nav-bar ${this.renderStyle}" part="section-navbar"> <slot name="nav-header"></slot> ${this.allowSearch === 'false' && this.allowAdvancedSearch === 'false' ? '' : 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' ? '' : 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="${getI18nText('menu.filter')}" @
|
|
43
|
+
return html` <nav class="nav-bar ${this.renderStyle}" part="section-navbar"> <slot name="nav-header"></slot> ${this.allowSearch === 'false' && this.allowAdvancedSearch === 'false' ? '' : 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' ? '' : 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="${getI18nText('menu.filter')}" @input="${this.onSearchChange}" spellcheck="false"> </div>`} ${this.allowAdvancedSearch === 'false' ? '' : html` <button class="m-btn outline-primary" part="btn btn-fill btn-search" style="margin-left:5px" @click="${this.onShowSearchModalClicked}"> ${getI18nText('menu.search')} </button> `} </div> `} ${html`<nav class="nav-scroll" part="navbar-scroll"> ${this.showInfo === 'false' || !this.resolvedSpec.info ? '' : 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 || getI18nText('menu.overview')} </div>`} ${this.allowServerSelection === 'false' ? '' : html`<div class="nav-bar-info" id="link-servers" data-content-id="servers" @click="${e => this.scrollToEventTarget(e, false)}"> ${getI18nText('menu.api-servers')} </div>`} ${this.allowAuthentication === 'false' || !this.resolvedSpec.securitySchemes ? '' : html`<div class="nav-bar-info" id="link-auth" data-content-id="auth" @click="${e => this.scrollToEventTarget(e, false)}"> ${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 ${this.operationsCollapsed ? 'collapsed' : ''}" @click="${() => {
|
|
44
44
|
expandCollapseAll.call(this);
|
|
45
|
-
}}" style="
|
|
45
|
+
}}"> <div class="nav-bar-section" part="navbar-operations-header"> <slot name="operations-header"> <div class="nav-bar-section-title">${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 => pathIsInSearch(this.matchPaths, path))) ? html` <div class="toggle">▾</div>` : ''} </div> </div> </div> ${this.resolvedSpec.tags.filter(tag => tag.paths.some(path => pathIsInSearch(this.matchPaths, path))).map(tag => html` <slot name="nav-${tag.elementId}"> <div class="nav-bar-tag-and-paths ${tag.expanded ? '' : 'collapsed'}"> ${tag.name === 'General ⦂' ? html`` : html` <div class="nav-bar-tag" id="link-${tag.elementId}" data-content-id="${tag.elementId}" @click="${() => {
|
|
46
46
|
onExpandCollapse.call(this, tag.elementId);
|
|
47
|
-
}}"> <div style="display:flex;justify-content:space-between;width:100%"> <div>${tag.name}</div> <div class="
|
|
47
|
+
}}"> <div style="display:flex;justify-content:space-between;width:100%"> <div style="margin-right:.5rem">${tag.name}</div> <div class="toggle">▾</div> </div> </div> `} <div class="nav-bar-section-wrapper"> <div> ${tag.headers.map(header => html` <div class="nav-bar-h${header.depth}" id="link-${tag.elementId}--${new marked.Slugger().slug(header.text)}" data-content-id="${tag.elementId}--${new 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 => pathIsInSearch(this.matchPaths, v)).map(p => html` <div class="nav-bar-path ${this.usePathInNavBar === 'true' ? 'small-font' : ''}" data-content-id="${p.elementId}" id="link-${p.elementId}" @click="${e => {
|
|
48
48
|
this.scrollToEventTarget(e, false);
|
|
49
|
-
}}"> <span style="${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? html`<
|
|
49
|
+
}}"> <span style="${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? html`<div class="mono-font" style="display:flex"> <div style="min-width:1rem;margin-right:.5rem;flex-shrink:0">${p.method.toUpperCase()}</div> <div style="display:flex;flex-wrap:wrap">${p.path.split('/').filter(t => t.trim()).map(t => html`<span>/${t}</span>`)}</div> </div>` : p.summary || p.shortSummary} ${p.isWebhook ? '(Webhook)' : ''} </span> </div>`)} </div> </div> </div> </slot> `)} ${(_this$resolvedSpec$co = this.resolvedSpec.components) !== null && _this$resolvedSpec$co !== void 0 && _this$resolvedSpec$co.length && !this.hideComponents ? html` <div class="sticky-scroll-element ${this.componentsCollapsed ? 'collapsed' : ''}" @click="${() => {
|
|
50
50
|
expandCollapseAllComponents.call(this);
|
|
51
|
-
}}"
|
|
51
|
+
}}"> <div id="link-components" class="nav-bar-section"> <slot name="components-header"> <div class="nav-bar-section-title">${getI18nText('menu.components')}</div> </slot> ${this.resolvedSpec.components.some(c => c.subComponents.some(s => componentIsInSearch(this.matchPaths, s))) ? html` <div style="" part="navbar-components-header-collapse"> <div class="toggle">▾</div></div>` : ''} </div> </div> ${this.resolvedSpec.components.filter(c => c.subComponents.some(s => componentIsInSearch(this.matchPaths, s))).map(component => html` <div class="nav-bar-tag-and-paths ${component.expanded ? '' : 'collapsed'}"> <div class="nav-bar-tag" data-content-id="cmp--${component.name.toLowerCase()}" id="link-cmp--${component.name.toLowerCase()}" @click="${e => this.scrollToEventTarget(e, false)}"> ${component.name} </div> <div class="nav-bar-section-wrapper"> <div class="nav-bar-paths-under-tag"> ${component.subComponents.filter(s => componentIsInSearch(this.matchPaths, s)).map(p => html` <div class="nav-bar-path" data-content-id="cmp--${p.id}" id="link-cmp--${p.id}" @click="${e => this.scrollToEventTarget(e, false)}"> <span> ${p.name} </span> </div>`)} </div> </div> </div>`)}` : ''} </nav>`} </nav> `;
|
|
52
52
|
}
|
|
53
53
|
/* eslint-enable indent */
|
|
@@ -463,7 +463,18 @@ class OpenApiExplorer extends _lit.LitElement {
|
|
|
463
463
|
}
|
|
464
464
|
|
|
465
465
|
onSearchChange(e) {
|
|
466
|
+
var _this$matchPaths;
|
|
467
|
+
|
|
466
468
|
this.matchPaths = e.target.value;
|
|
469
|
+
const expand = !!((_this$matchPaths = this.matchPaths) !== null && _this$matchPaths !== void 0 && _this$matchPaths.trim());
|
|
470
|
+
this.operationsCollapsed = !expand;
|
|
471
|
+
this.componentsCollapsed = !expand;
|
|
472
|
+
this.resolvedSpec.tags.forEach(tag => {
|
|
473
|
+
tag.expanded = expand;
|
|
474
|
+
});
|
|
475
|
+
this.resolvedSpec.components.forEach(component => {
|
|
476
|
+
component.expanded = expand;
|
|
477
|
+
});
|
|
467
478
|
this.requestUpdate();
|
|
468
479
|
}
|
|
469
480
|
|
|
@@ -835,7 +846,7 @@ class OpenApiExplorer extends _lit.LitElement {
|
|
|
835
846
|
} // Event handler for Advanced Search text-inputs and checkboxes
|
|
836
847
|
|
|
837
848
|
|
|
838
|
-
onAdvancedSearch(ev
|
|
849
|
+
onAdvancedSearch(ev) {
|
|
839
850
|
const eventTargetEl = ev.target;
|
|
840
851
|
clearTimeout(this.timeoutId);
|
|
841
852
|
this.timeoutId = setTimeout(() => {
|
|
@@ -849,7 +860,7 @@ class OpenApiExplorer extends _lit.LitElement {
|
|
|
849
860
|
|
|
850
861
|
const searchOptions = [...eventTargetEl.closest('.advanced-search-options').querySelectorAll('input:checked')].map(v => v.id);
|
|
851
862
|
this.advancedSearchMatches = (0, _commonUtils.advancedSearch)(searchInputEl.value, this.resolvedSpec.tags, searchOptions);
|
|
852
|
-
},
|
|
863
|
+
}, 0);
|
|
853
864
|
}
|
|
854
865
|
|
|
855
866
|
}
|
|
@@ -5,6 +5,6 @@ exports.default = void 0;
|
|
|
5
5
|
|
|
6
6
|
var _lit = require("lit");
|
|
7
7
|
|
|
8
|
-
var _default = (0, _lit.css)`.nav-bar{width:0;height:100%;overflow:hidden;color:var(--nav-text-color);background-color:var(--nav-bg-color);background-blend-mode:multiply;line-height:calc(var(--font-size-small) + 4px);display:none;position:relative;flex-direction:column;flex-wrap:nowrap;word-break:break-word}.nav-scroll{overflow-x:hidden;overflow-y:auto;overflow-y:overlay;scrollbar-width:thin;scrollbar-color:var(--nav-hover-bg-color) transparent}.nav-bar-tag{display:flex;align-items:center;justify-content:space-between;flex-direction:row}.
|
|
8
|
+
var _default = (0, _lit.css)`.nav-bar{width:0;height:100%;overflow:hidden;color:var(--nav-text-color);background-color:var(--nav-bg-color);background-blend-mode:multiply;line-height:calc(var(--font-size-small) + 4px);display:none;position:relative;flex-direction:column;flex-wrap:nowrap;word-break:break-word}.nav-scroll{overflow-x:hidden;overflow-y:auto;overflow-y:overlay;scrollbar-width:thin;scrollbar-color:var(--nav-hover-bg-color) transparent}.nav-bar-tag{display:flex;align-items:center;justify-content:space-between;flex-direction:row}.toggle{font-size:16px;cursor:pointer;color:var(--nav-text-color);transform:translate(-5px,0) rotate(0);transition:transform .1s ease}.toggle:hover{color:var(--nav-hover-text-color)}.collapsed .toggle{transform:translate(-6px,0) rotate(-90deg)}.nav-bar-tag-and-paths>.nav-bar-section-wrapper{max-height:5000px;transition:max-height 1.2s ease-in-out;overflow:hidden}.nav-bar-tag-and-paths.collapsed>.nav-bar-section-wrapper{transition:max-height 1.2s ease-in-out -1s;max-height:0}.nav-bar.focused,.nav-scroll{border-top:1px solid var(--secondary-color)}.nav-scroll::-webkit-scrollbar{width:10px}.nav-scroll::-webkit-scrollbar-track{background:0 0}.nav-scroll::-webkit-scrollbar-thumb{background-color:var(--nav-hover-bg-color)}.nav-bar-tag{font-size:var(--font-size-regular);color:var(--secondary-color);border-left:4px solid transparent;font-weight:700;padding:15px 15px 15px 10px}.nav-bar-components,.nav-bar-h1,.nav-bar-h2,.nav-bar-info,.nav-bar-path,.nav-bar-tag,slot[name=nav-section]::slotted(*){display:flex;cursor:pointer;border-left:4px solid transparent}.nav-bar-h1,.nav-bar-h2,.nav-bar-path{font-size:calc(var(--font-size-small) + 1px);padding:var(--nav-item-padding)}.nav-bar-path.small-font{font-size:var(--font-size-small)}.nav-bar-info,slot[name=nav-section]::slotted(*){font-size:var(--font-size-regular);padding:16px 10px;font-weight:700}.nav-bar-section{display:flex;flex-direction:row;justify-content:space-between;font-size:var(--font-size-small);color:var(--nav-text-color);padding:15px 15px 5px 5px;font-weight:700;border-bottom:1px solid var(--nav-text-color);background:var(--nav-bg-color)}.sticky-scroll-element{position:sticky;top:0;z-index:1;cursor:pointer}.nav-bar-h1{padding-left:20px}.nav-bar-h2{padding-left:30px}.nav-bar-h1.active,.nav-bar-h1.active:hover,.nav-bar-h2.active,.nav-bar-h2.active:hover,.nav-bar-info.active,.nav-bar-info.active:hover,.nav-bar-path.active,.nav-bar-path.active:hover,.nav-bar-tag.active,.nav-bar-tag.active:hover,slot[name=nav-section]::slotted(.active),slot[name=nav-section]::slotted(.active:hover){border-left:4px solid var(--secondary-color);color:var(--secondary-color);background-color:var(--nav-hover-bg-color)}.nav-bar-h1:hover,.nav-bar-h2:hover,.nav-bar-info:hover,.nav-bar-path:hover,.nav-bar-tag:hover,slot[name=nav-section]::slotted(:hover){color:var(--nav-hover-text-color);background-color:var(--nav-hover-bg-color)}`;
|
|
9
9
|
|
|
10
10
|
exports.default = _default;
|
|
@@ -30,7 +30,7 @@ function searchByPropertiesModalTemplate() {
|
|
|
30
30
|
});
|
|
31
31
|
return (0, _lit.html)` ${this.showAdvancedSearchDialog ? (0, _lit.html)` <div class="dialog-box-overlay"> <div class="dialog-box"> <header class="dialog-box-header"> <span class="dialog-box-title">Advanced Search</span> <button class="m-btn thin-border" @click="${() => {
|
|
32
32
|
closeAdvancedSearchDialog();
|
|
33
|
-
}}" part="btn btn-outline">×</button> </header> <div id="advanced-search-modal" class="dialog-box-content"> <span class="advanced-search-options"> <div class="advanced-search-dialog-input"> <input id="advanced-search-dialog-input" type="text" part="textbox textbox-search-dialog" placeholder="search text..." spellcheck="false" @keyup="${e => this.onAdvancedSearch(e
|
|
33
|
+
}}" part="btn btn-outline">×</button> </header> <div id="advanced-search-modal" class="dialog-box-content"> <span class="advanced-search-options"> <div class="advanced-search-dialog-input"> <input id="advanced-search-dialog-input" type="text" part="textbox textbox-search-dialog" placeholder="search text..." spellcheck="false" @keyup="${e => this.onAdvancedSearch(e)}"> </div> <div class="advanced-search-locations"> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-path" checked="checked" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-path"> API Path </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-descr" checked="checked" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-descr"> API Description </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-params" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-params"> Request Parameters </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-request-body" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-request-body"> Request Body </label> </div> <div> <input style="cursor:pointer" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-resp-descr" @change="${e => this.onAdvancedSearch(e)}"> <label style="cursor:pointer" for="search-api-resp-descr"> Response Description </label> </div> </div> </span> <div class="advanced-search-results"> ${this.advancedSearchMatches && this.advancedSearchMatches.map(path => (0, _lit.html)` <div class="mono-font small-font-size hover-bg" tabindex="0" style="padding:5px;cursor:pointer;border-bottom:1px solid var(--light-border-color);${path.deprecated ? 'filter:opacity(0.5);' : ''}" data-content-id="${path.elementId}" @click="${e => {
|
|
34
34
|
this.matchPaths = ''; // clear quick filter if applied
|
|
35
35
|
|
|
36
36
|
closeAdvancedSearchDialog(); // Hide Search Dialog
|
|
@@ -77,7 +77,7 @@ function expandCollapseAll(currentElement, action = 'expand-all') {
|
|
|
77
77
|
function endpointHeadTemplate(path) {
|
|
78
78
|
return (0, _lit.html)` <summary @click="${e => {
|
|
79
79
|
toggleExpand.call(this, path, e);
|
|
80
|
-
}}" class="endpoint-head ${path.method} ${path.expanded ? 'expanded' : 'collapsed'}"> <div class="method ${path.method}"> ${path.method} </div> <div
|
|
80
|
+
}}" class="endpoint-head ${path.method} ${path.expanded ? 'expanded' : 'collapsed'}"> <div class="method ${path.method}"> ${path.method} </div> <div style="${path.deprecated ? 'text-decoration: line-through;' : ''}"> ${this.usePathInNavBar === 'true' ? (0, _lit.html)`<div class="path">${path.path.split('/').filter(t => t.trim()).map(t => (0, _lit.html)`<span>/${t}</span>`)}</div>` : (0, _lit.html)`<div class="">${path.summary || path.shortSummary}</div>`} ${path.isWebhook ? (0, _lit.html)`<span style="color:var(--primary-color)"> (Webhook) </span>` : ''} </div> </summary> `;
|
|
81
81
|
}
|
|
82
82
|
|
|
83
83
|
function endpointBodyTemplate(path) {
|
|
@@ -95,7 +95,7 @@ function endpointBodyTemplate(path) {
|
|
|
95
95
|
|
|
96
96
|
const nonEmptyApiKeys = this.resolvedSpec.securitySchemes.filter(v => v.finalKeyValue && path.security && path.security.some(ps => ps[v.apiKeyId])) || [];
|
|
97
97
|
const codeSampleTabPanel = path.xCodeSamples ? (0, _codeSamplesTemplate.default)(path.xCodeSamples) : '';
|
|
98
|
-
return (0, _lit.html)` <div class="endpoint-body ${path.method}"> <div class="summary"> ${path.summary ? (0, _lit.html)`<div class="title">${path.summary}<div></div></div>` : path.shortSummary !== path.description ? (0, _lit.html)`<div class="title">${path.shortSummary}</div>` : ''} ${path.description ? (0, _lit.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) === null || _path$servers === void 0 ? void 0 : (_path$servers$ = _path$servers[0]) === null || _path$servers$ === void 0 ? void 0 : _path$servers$.url) || ((_this$selectedServer = this.selectedServer) === null || _this$selectedServer === void 0 ? void 0 : _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>`;
|
|
98
|
+
return (0, _lit.html)` <div class="endpoint-body ${path.method}"> <div class="summary"> ${this.usePathInNavBar === 'true' ? path.summary ? (0, _lit.html)`<div class="title">${path.summary}<div></div></div>` : path.shortSummary !== path.description ? (0, _lit.html)`<div class="title">${path.shortSummary}</div>` : '' : (0, _lit.html)` <div class="title mono-font regular-font-size" part="section-operation-url" style="display:flex;flex-wrap:wrap;color:var(--fg3)"> ${path.isWebhook ? (0, _lit.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 style="display:flex;flex-wrap:wrap" part="label-operation-path">${path.path.split('/').filter(t => t.trim()).map(t => (0, _lit.html)`<span>/${t}</span>`)}</span> </div>`} ${path.description ? (0, _lit.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) === null || _path$servers === void 0 ? void 0 : (_path$servers$ = _path$servers[0]) === null || _path$servers$ === void 0 ? void 0 : _path$servers$.url) || ((_this$selectedServer = this.selectedServer) === null || _this$selectedServer === void 0 ? void 0 : _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>`;
|
|
99
99
|
}
|
|
100
100
|
|
|
101
101
|
function endpointTemplate() {
|
|
@@ -52,14 +52,14 @@ function expandCollapseAllComponents() {
|
|
|
52
52
|
function navbarTemplate() {
|
|
53
53
|
var _this$resolvedSpec$co;
|
|
54
54
|
|
|
55
|
-
return (0, _lit.html)` <nav class="nav-bar ${this.renderStyle}" part="section-navbar"> <slot name="nav-header"></slot> ${this.allowSearch === 'false' && this.allowAdvancedSearch === 'false' ? '' : (0, _lit.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, _lit.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')}" @
|
|
55
|
+
return (0, _lit.html)` <nav class="nav-bar ${this.renderStyle}" part="section-navbar"> <slot name="nav-header"></slot> ${this.allowSearch === 'false' && this.allowAdvancedSearch === 'false' ? '' : (0, _lit.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, _lit.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')}" @input="${this.onSearchChange}" spellcheck="false"> </div>`} ${this.allowAdvancedSearch === 'false' ? '' : (0, _lit.html)` <button class="m-btn outline-primary" part="btn btn-fill btn-search" style="margin-left:5px" @click="${this.onShowSearchModalClicked}"> ${(0, _languages.getI18nText)('menu.search')} </button> `} </div> `} ${(0, _lit.html)`<nav class="nav-scroll" part="navbar-scroll"> ${this.showInfo === 'false' || !this.resolvedSpec.info ? '' : (0, _lit.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, _lit.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, _lit.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 ${this.operationsCollapsed ? 'collapsed' : ''}" @click="${() => {
|
|
56
56
|
expandCollapseAll.call(this);
|
|
57
|
-
}}" style="
|
|
57
|
+
}}"> <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, _lit.html)` <div class="toggle">▾</div>` : ''} </div> </div> </div> ${this.resolvedSpec.tags.filter(tag => tag.paths.some(path => (0, _commonUtils.pathIsInSearch)(this.matchPaths, path))).map(tag => (0, _lit.html)` <slot name="nav-${tag.elementId}"> <div class="nav-bar-tag-and-paths ${tag.expanded ? '' : 'collapsed'}"> ${tag.name === 'General ⦂' ? (0, _lit.html)`` : (0, _lit.html)` <div class="nav-bar-tag" id="link-${tag.elementId}" data-content-id="${tag.elementId}" @click="${() => {
|
|
58
58
|
onExpandCollapse.call(this, tag.elementId);
|
|
59
|
-
}}"> <div style="display:flex;justify-content:space-between;width:100%"> <div>${tag.name}</div> <div class="
|
|
59
|
+
}}"> <div style="display:flex;justify-content:space-between;width:100%"> <div style="margin-right:.5rem">${tag.name}</div> <div class="toggle">▾</div> </div> </div> `} <div class="nav-bar-section-wrapper"> <div> ${tag.headers.map(header => (0, _lit.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, _lit.html)` <div class="nav-bar-path ${this.usePathInNavBar === 'true' ? 'small-font' : ''}" data-content-id="${p.elementId}" id="link-${p.elementId}" @click="${e => {
|
|
60
60
|
this.scrollToEventTarget(e, false);
|
|
61
|
-
}}"> <span style="${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? (0, _lit.html)`<
|
|
61
|
+
}}"> <span style="${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? (0, _lit.html)`<div class="mono-font" style="display:flex"> <div style="min-width:1rem;margin-right:.5rem;flex-shrink:0">${p.method.toUpperCase()}</div> <div style="display:flex;flex-wrap:wrap">${p.path.split('/').filter(t => t.trim()).map(t => (0, _lit.html)`<span>/${t}</span>`)}</div> </div>` : p.summary || p.shortSummary} ${p.isWebhook ? '(Webhook)' : ''} </span> </div>`)} </div> </div> </div> </slot> `)} ${(_this$resolvedSpec$co = this.resolvedSpec.components) !== null && _this$resolvedSpec$co !== void 0 && _this$resolvedSpec$co.length && !this.hideComponents ? (0, _lit.html)` <div class="sticky-scroll-element ${this.componentsCollapsed ? 'collapsed' : ''}" @click="${() => {
|
|
62
62
|
expandCollapseAllComponents.call(this);
|
|
63
|
-
}}"
|
|
63
|
+
}}"> <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, _lit.html)` <div style="" part="navbar-components-header-collapse"> <div class="toggle">▾</div></div>` : ''} </div> </div> ${this.resolvedSpec.components.filter(c => c.subComponents.some(s => (0, _commonUtils.componentIsInSearch)(this.matchPaths, s))).map(component => (0, _lit.html)` <div class="nav-bar-tag-and-paths ${component.expanded ? '' : 'collapsed'}"> <div class="nav-bar-tag" data-content-id="cmp--${component.name.toLowerCase()}" id="link-cmp--${component.name.toLowerCase()}" @click="${e => this.scrollToEventTarget(e, false)}"> ${component.name} </div> <div class="nav-bar-section-wrapper"> <div class="nav-bar-paths-under-tag"> ${component.subComponents.filter(s => (0, _commonUtils.componentIsInSearch)(this.matchPaths, s)).map(p => (0, _lit.html)` <div class="nav-bar-path" data-content-id="cmp--${p.id}" id="link-cmp--${p.id}" @click="${e => this.scrollToEventTarget(e, false)}"> <span> ${p.name} </span> </div>`)} </div> </div> </div>`)}` : ''} </nav>`} </nav> `;
|
|
64
64
|
}
|
|
65
65
|
/* eslint-enable indent */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "openapi-explorer",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.439",
|
|
4
4
|
"description": "OpenAPI Explorer - API viewer with dynamically generated components, documentation, and interaction console",
|
|
5
5
|
"author": "Rhosys Developers <developers@rhosys.ch>",
|
|
6
6
|
"type": "module",
|