openapi-explorer 2.1.627 → 2.1.635

package/dist/es/components/syntax-highlighter.js

@@ -2,8 +2,8 @@ import { LitElement, html, css } from 'lit';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { marked } from 'marked';
 import Prism from 'prismjs';
-import './json-tree.js'; // It's possible none of these imports are actually necessary and should just be removed
-
+import './json-tree.js';
+import 'prismjs/components/prism-markup-templating.js';
 import 'prismjs/components/prism-css.js';
 import 'prismjs/components/prism-yaml.js';
 import 'prismjs/components/prism-go.js';
@@ -14,6 +14,8 @@ import 'prismjs/components/prism-bash.js';
 import 'prismjs/components/prism-python.js';
 import 'prismjs/components/prism-http.js';
 import 'prismjs/components/prism-csharp.js';
+import 'prismjs/components/prism-rust.js';
+import 'prismjs/components/prism-php.js';
 import PrismStyles from '../styles/prism-styles.js';
 import FontStyle from '../styles/font-styles.js';
 import InputStyle from '../styles/input-styles.js';

package/dist/es/openapi-explorer.js

@@ -261,7 +261,7 @@ export default class OpenApiExplorer extends LitElement {
   }
 
   static finalizeStyles() {
-    return [FontStyles, SchemaStyles, InputStyles, FlexStyles, TableStyles, KeyFrameStyles, EndpointStyles, PrismStyles, TabStyles, NavStyles, InfoStyles, TagInputStyles, advancedSearchStyles, apiRequestStyles, 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}a{text-decoration:none}.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{margin:0;padding:0 8px 0 4px;border-bottom:1px solid var(--border-color)}.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%}.security-tooltip{border:1px solid var(--border-color);border-left-width:4px;margin-left:2px}.security-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-replace:hover{visibility:hidden}.tooltip:hover a:hover{color:var(--primary-color)}.tooltip:hover .tooltip-text{visibility:visible;cursor:text;opacity:1}@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:330px;display:flex}.section-gap--read-mode{padding:24px 24px 12px}.main-content-inner{padding:24px}}`];
+    return [FontStyles, SchemaStyles, InputStyles, FlexStyles, TableStyles, KeyFrameStyles, EndpointStyles, PrismStyles, TabStyles, NavStyles, InfoStyles, TagInputStyles, advancedSearchStyles, apiRequestStyles, 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}a{text-decoration:none}.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{margin:0;padding:0 8px 0 4px;border-bottom:1px solid var(--border-color)}.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,.expanded-endpoint-component{position:relative;padding:6px 0}.expanded-endpoint-component>h2:hover{cursor:pointer;text-decoration:underline}.divider{border-top:2px solid var(--border-color);margin:24px 0;width:100%}.security-tooltip{border:1px solid var(--border-color);border-left-width:4px;margin-left:2px}.security-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-replace:hover{visibility:hidden}.tooltip:hover a:hover{color:var(--primary-color)}.tooltip:hover .tooltip-text{visibility:visible;cursor:text;opacity:1}@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:330px;display:flex}.section-gap--read-mode{padding:24px 24px 12px}.main-content-inner{padding:24px}}`];
   } // Startup
 
 

package/dist/es/templates/components-template.js

@@ -4,12 +4,13 @@ import { html } from 'lit';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { marked } from 'marked';
 import '../components/schema-tree.js';
+import { replaceState } from '../utils/common-utils.js';
 
 function componentBodyTemplate(sComponent) {
   const formdataPartSchema = schemaInObjectNotation(sComponent.component, {
     includeNulls: this.includeNulls
   });
-  return 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 ? html`<schema-table .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-table>` : html`<schema-tree .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-tree>`} </div> </div> `;
+  return html` <div class="expanded-endpoint-component observe-me ${sComponent.name}" id="cmp--${sComponent.id}" @click="${() => replaceState(`cmp--${sComponent.id}`)}"> <h2>${sComponent.name}</h2> <div class="mono-font regular-font-size" style="padding:8px 0;color:var(--fg2)"> ${this.displaySchemaAsTable ? html`<schema-table .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-table>` : html`<schema-tree .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-tree>`} </div> </div> `;
 }
 
 export default function componentsTemplate() {

package/dist/es/templates/expanded-endpoint-template.js

@@ -25,7 +25,7 @@ export function expandedEndpointBodyTemplate(path, tagName = '') {
 
   const nonEmptyApiKeys = this.resolvedSpec.securitySchemes.filter(v => v.finalKeyValue && path.security && path.security.some(ps => ps[v.apiKeyId])) || [];
   const codeSampleTabPanel = path.xCodeSamples ? codeSamplesTemplate.call(this, path.xCodeSamples) : '';
-  return html` ${this.renderStyle === 'read' ? 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 && tagName !== 'General ⦂' ? html`<h3 class="upper" style="font-weight:700"> ${tagName} </h3>` : ''} ${path.deprecated ? html`<div class="bold-text red-text"> DEPRECATED </div>` : ''} <div style="display:flex;justify-content:space-between"> <div style="flex-grow:1"> <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 ? 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> </div> ${path.externalDocs ? html`<div class="m-markdown" style="margin-top:2rem;margin-bottom:.5rem;max-width:300px"> ${unsafeHTML(marked(path.externalDocs.description || ''))} <a href="${path.externalDocs.url}">Navigate to documentation ↗</a> </div>` : ''} </div> <div class="m-markdown" style="margin-right:2rem"> ${unsafeHTML(marked(path.description || ''))}</div> <slot name="${path.elementId}"></slot> <slot name="path-details" data-method="${path.method}" data-path="${path.path}"></slot> ${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) === 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)}" fill-defaults="${!this.hideDefaults}" display-nulls="${!!this.includeNulls}" enable-console="${!this.hideExecution}" 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.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> `;
+  return html` ${this.renderStyle === 'read' ? 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 && tagName !== 'General ⦂' ? html`<h3 class="upper" style="font-weight:700"> ${tagName} </h3>` : ''} ${path.deprecated ? html`<div class="bold-text red-text"> DEPRECATED </div>` : ''} <div style="display:flex;justify-content:space-between"> <div style="flex-grow:1"> <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 ? 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> </div> ${path.externalDocs ? html`<div class="m-markdown" style="margin-top:2rem;margin-bottom:.5rem;max-width:300px"> ${unsafeHTML(marked(path.externalDocs.description || ''))} <a href="${path.externalDocs.url}">Navigate to documentation ↗</a> </div>` : ''} </div> <div class="m-markdown" style="margin-right:2rem"> ${unsafeHTML(marked(path.description || ''))}</div> <slot name="${path.elementId}"></slot> <slot name="path-details" data-method="${path.method}" data-path="${path.path}"></slot> ${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) === 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)}" fill-defaults="${!this.hideDefaults}" display-nulls="${!!this.includeNulls}" enable-console="${!this.hideExecution}" 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.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>`;
 }
 export function expandedTagTemplate(tagId, subsectionFullId) {
   const tag = (this.resolvedSpec.tags || []).find(t => t.elementId === tagId);

package/dist/lib/components/syntax-highlighter.js

@@ -10,6 +10,8 @@ var _prismjs = _interopRequireDefault(require("prismjs"));
 
 require("./json-tree.js");
 
+require("prismjs/components/prism-markup-templating.js");
+
 require("prismjs/components/prism-css.js");
 
 require("prismjs/components/prism-yaml.js");
@@ -30,6 +32,10 @@ require("prismjs/components/prism-http.js");
 
 require("prismjs/components/prism-csharp.js");
 
+require("prismjs/components/prism-rust.js");
+
+require("prismjs/components/prism-php.js");
+
 var _prismStyles = _interopRequireDefault(require("../styles/prism-styles.js"));
 
 var _fontStyles = _interopRequireDefault(require("../styles/font-styles.js"));
@@ -42,8 +48,6 @@ var _commonUtils = require("../utils/common-utils.js");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-// It's possible none of these imports are actually necessary and should just be removed
-
 /**
  * Mapping mime-type => prism language
  */

package/dist/lib/openapi-explorer.js

@@ -291,7 +291,7 @@ class OpenApiExplorer extends _lit.LitElement {
   }
 
   static finalizeStyles() {
-    return [_fontStyles.default, _schemaStyles.default, _inputStyles.default, _flexStyles.default, _tableStyles.default, _keyFrameStyles.default, _endpointStyles.default, _prismStyles.default, _tabStyles.default, _navStyles.default, _infoStyles.default, _tagInputStyles.default, _advancedSearchStyles.default, _apiRequestStyles.default, (0, _lit.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}a{text-decoration:none}.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{margin:0;padding:0 8px 0 4px;border-bottom:1px solid var(--border-color)}.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%}.security-tooltip{border:1px solid var(--border-color);border-left-width:4px;margin-left:2px}.security-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-replace:hover{visibility:hidden}.tooltip:hover a:hover{color:var(--primary-color)}.tooltip:hover .tooltip-text{visibility:visible;cursor:text;opacity:1}@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:330px;display:flex}.section-gap--read-mode{padding:24px 24px 12px}.main-content-inner{padding:24px}}`];
+    return [_fontStyles.default, _schemaStyles.default, _inputStyles.default, _flexStyles.default, _tableStyles.default, _keyFrameStyles.default, _endpointStyles.default, _prismStyles.default, _tabStyles.default, _navStyles.default, _infoStyles.default, _tagInputStyles.default, _advancedSearchStyles.default, _apiRequestStyles.default, (0, _lit.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}a{text-decoration:none}.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{margin:0;padding:0 8px 0 4px;border-bottom:1px solid var(--border-color)}.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,.expanded-endpoint-component{position:relative;padding:6px 0}.expanded-endpoint-component>h2:hover{cursor:pointer;text-decoration:underline}.divider{border-top:2px solid var(--border-color);margin:24px 0;width:100%}.security-tooltip{border:1px solid var(--border-color);border-left-width:4px;margin-left:2px}.security-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-replace:hover{visibility:hidden}.tooltip:hover a:hover{color:var(--primary-color)}.tooltip:hover .tooltip-text{visibility:visible;cursor:text;opacity:1}@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:330px;display:flex}.section-gap--read-mode{padding:24px 24px 12px}.main-content-inner{padding:24px}}`];
   } // Startup
 
 

package/dist/lib/templates/components-template.js

@@ -13,12 +13,14 @@ var _marked = require("marked");
 
 require("../components/schema-tree.js");
 
+var _commonUtils = require("../utils/common-utils.js");
+
 /* eslint-disable no-console */
 function componentBodyTemplate(sComponent) {
   const formdataPartSchema = (0, _schemaUtils.schemaInObjectNotation)(sComponent.component, {
     includeNulls: this.includeNulls
   });
-  return (0, _lit.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, _lit.html)`<schema-table .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-table>` : (0, _lit.html)`<schema-tree .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-tree>`} </div> </div> `;
+  return (0, _lit.html)` <div class="expanded-endpoint-component observe-me ${sComponent.name}" id="cmp--${sComponent.id}" @click="${() => (0, _commonUtils.replaceState)(`cmp--${sComponent.id}`)}"> <h2>${sComponent.name}</h2> <div class="mono-font regular-font-size" style="padding:8px 0;color:var(--fg2)"> ${this.displaySchemaAsTable ? (0, _lit.html)`<schema-table .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-table>` : (0, _lit.html)`<schema-tree .data="${formdataPartSchema}" schema-expand-level="${this.schemaExpandLevel}" schema-hide-read-only="false" schema-hide-write-only="false"> </schema-tree>`} </div> </div> `;
 }
 
 function componentsTemplate() {

package/dist/lib/templates/expanded-endpoint-template.js

@@ -40,7 +40,7 @@ function expandedEndpointBodyTemplate(path, tagName = '') {
 
   const nonEmptyApiKeys = this.resolvedSpec.securitySchemes.filter(v => v.finalKeyValue && path.security && path.security.some(ps => ps[v.apiKeyId])) || [];
   const codeSampleTabPanel = path.xCodeSamples ? _codeSamplesTemplate.default.call(this, path.xCodeSamples) : '';
-  return (0, _lit.html)` ${this.renderStyle === 'read' ? (0, _lit.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 && tagName !== 'General ⦂' ? (0, _lit.html)`<h3 class="upper" style="font-weight:700"> ${tagName} </h3>` : ''} ${path.deprecated ? (0, _lit.html)`<div class="bold-text red-text"> DEPRECATED </div>` : ''} <div style="display:flex;justify-content:space-between"> <div style="flex-grow:1"> <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, _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 part="label-operation-path">${path.path}</span> </div> </div> ${path.externalDocs ? (0, _lit.html)`<div class="m-markdown" style="margin-top:2rem;margin-bottom:.5rem;max-width:300px"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.externalDocs.description || ''))} <a href="${path.externalDocs.url}">Navigate to documentation ↗</a> </div>` : ''} </div> <div class="m-markdown" style="margin-right:2rem"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.description || ''))}</div> <slot name="${path.elementId}"></slot> <slot name="path-details" data-method="${path.method}" data-path="${path.path}"></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) === 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)}" fill-defaults="${!this.hideDefaults}" display-nulls="${!!this.includeNulls}" enable-console="${!this.hideExecution}" 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> `;
+  return (0, _lit.html)` ${this.renderStyle === 'read' ? (0, _lit.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 && tagName !== 'General ⦂' ? (0, _lit.html)`<h3 class="upper" style="font-weight:700"> ${tagName} </h3>` : ''} ${path.deprecated ? (0, _lit.html)`<div class="bold-text red-text"> DEPRECATED </div>` : ''} <div style="display:flex;justify-content:space-between"> <div style="flex-grow:1"> <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, _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 part="label-operation-path">${path.path}</span> </div> </div> ${path.externalDocs ? (0, _lit.html)`<div class="m-markdown" style="margin-top:2rem;margin-bottom:.5rem;max-width:300px"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.externalDocs.description || ''))} <a href="${path.externalDocs.url}">Navigate to documentation ↗</a> </div>` : ''} </div> <div class="m-markdown" style="margin-right:2rem"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(path.description || ''))}</div> <slot name="${path.elementId}"></slot> <slot name="path-details" data-method="${path.method}" data-path="${path.path}"></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) === 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)}" fill-defaults="${!this.hideDefaults}" display-nulls="${!!this.includeNulls}" enable-console="${!this.hideExecution}" 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>`;
 }
 
 function expandedTagTemplate(tagId, subsectionFullId) {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "openapi-explorer",
-  "version": "2.1.627",
+  "version": "2.1.635",
   "description": "OpenAPI Explorer - API viewer with dynamically generated components, documentation, and interaction console",
-  "author": "Rhosys Developers <developers@rhosys.ch>",
+  "author": "Authress Developers <developers@authress.io>",
   "type": "module",
   "repository": {
     "type": "git",
-    "url": "https://github.com/Rhosys/openapi-explorer.git"
+    "url": "https://github.com/Authress-Engineering/openapi-explorer.git"
   },
   "license": "Apache-2.0",
   "keywords": [