openapi-explorer 0.9.327 → 0.9.333

package/dist/es/openapi-explorer.js

@@ -74,6 +74,10 @@ export default class OpenApiExplorer extends LitElement {
       layout: {
         type: String
       },
+      operationsCollapsed: {
+        type: Boolean,
+        attribute: 'collapse'
+      },
       defaultSchemaTab: {
         type: String,
         attribute: 'default-schema-tab'
@@ -129,9 +133,9 @@ export default class OpenApiExplorer extends LitElement {
         type: String,
         attribute: 'show-server-selection'
       },
-      showComponents: {
-        type: String,
-        attribute: 'show-components'
+      hideComponents: {
+        type: Boolean,
+        attribute: 'hide-components'
       },
       // Main Colors and Font
       primaryColor: {
@@ -198,9 +202,6 @@ export default class OpenApiExplorer extends LitElement {
         type: Boolean
       },
       // indicates spec is being loaded
-      operationsCollapsed: {
-        type: Boolean
-      },
       showAdvancedSearchDialog: {
         type: Boolean
       },
@@ -316,10 +317,6 @@ export default class OpenApiExplorer extends LitElement {
       this.allowAuthentication = 'true';
     }
 
-    if (!this.showComponents || !'true false'.includes(this.showComponents)) {
-      this.showComponents = 'true';
-    }
-
     if (!this.fetchCredentials || !'omit, same-origin, include,'.includes(`${this.fetchCredentials},`)) {
       this.fetchCredentials = '';
     }
@@ -519,6 +516,11 @@ export default class OpenApiExplorer extends LitElement {
 
   afterSpecParsedAndValidated(spec) {
     this.resolvedSpec = spec;
+
+    if (this.operationsCollapsed) {
+      this.resolvedSpec.tags.forEach(t => t.expanded = false);
+    }
+
     this.dispatchEvent(new CustomEvent('spec-loaded', {
       bubbles: true,
       detail: spec

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

@@ -47,7 +47,7 @@ export default function focusedEndpointTemplate() {
     focusedTemplate = serverTemplate.call(this);
   } else if (focusElId === 'section') {
     focusedTemplate = html` <section id="section" class="observe-me"> <slot name="custom-section"></slot> </section>`;
-  } else if (focusElId.startsWith('cmp--') && this.showComponents === 'true') {
+  } else if (focusElId.startsWith('cmp--') && !this.hideComponents) {
     focusedTemplate = componentsTemplate.call(this);
   } else if (focusElId.startsWith('tag--')) {
     const idToFocus = focusElId.indexOf('--', 4) > 0 ? focusElId.substring(0, focusElId.indexOf('--', 5)) : focusElId;

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

@@ -41,6 +41,6 @@ export default function navbarTemplate() {
     return true;
   }).map(p => html` <div class="nav-bar-path ${this.usePathInNavBar === 'true' ? 'small-font' : ''}" data-content-id="${p.elementId}" id="link-${p.elementId}" @click="${e => {
     this.scrollToEventTarget(e, false);
-  }}"> <span style="line-break:anywhere;${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? 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.components && this.showComponents === 'true' ? html` <div class="sticky-scroll-element"> <div id="link-components" class="nav-bar-section"> <div class="nav-bar-section-title">COMPONENTS</div> </div> </div> ${this.resolvedSpec.components.map(component => component.subComponents.filter(s => s.expanded).length ? html` <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> ${component.subComponents.filter(s => s.expanded).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>`)}` : '')}` : ''} </nav>`} </nav> `;
+  }}"> <span style="line-break:anywhere;${p.deprecated ? 'filter:opacity(0.5)' : ''}"> ${this.usePathInNavBar === 'true' ? 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.components && !this.hideComponents ? html` <div class="sticky-scroll-element"> <div id="link-components" class="nav-bar-section"> <div class="nav-bar-section-title">COMPONENTS</div> </div> </div> ${this.resolvedSpec.components.map(component => component.subComponents.filter(s => s.expanded).length ? html` <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> ${component.subComponents.filter(s => s.expanded).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>`)}` : '')}` : ''} </nav>`} </nav> `;
 }
 /* eslint-enable indent */

package/dist/es/utils/spec-parser.js

@@ -88,10 +88,10 @@ export default async function ProcessSpec(specUrlOrObject, serverUrl = '') {
     });
 
     if (serverUrl && !jsonParsedSpec.servers.some(s => s.url === serverUrl || s.computedUrl === serverUrl)) {
-      jsonParsedSpec.servers.push({
+      jsonParsedSpec.servers = [{
         url: serverUrl,
         computedUrl: serverUrl
-      });
+      }].concat(jsonParsedSpec.servers);
     }
   } else if (serverUrl) {
     jsonParsedSpec.servers = [{
@@ -203,7 +203,7 @@ function getComponents(openApiSpec) {
 
     if (cmpName) {
       components.push({
-        show: true,
+        expanded: true,
         name: cmpName,
         description: cmpDescription,
         subComponents
@@ -218,13 +218,12 @@ function groupByTags(openApiSpec) {
   const supportedMethods = ['get', 'put', 'post', 'delete', 'patch', 'head', 'options']; // this is also used for ordering endpoints by methods
 
   const tags = openApiSpec.tags && Array.isArray(openApiSpec.tags) ? openApiSpec.tags.map(t => ({
-    show: true,
     elementId: `tag--${t.name.replace(invalidCharsRegEx, '-')}`,
     name: t.name,
     description: t.description || '',
     headers: t.description ? getHeadersFromMarkdown(t.description) : [],
     paths: [],
-    expanded: t['x-tag-expanded'] !== false
+    expanded: true
   })) : [];
   const pathsAndWebhooks = openApiSpec.paths || {};
 
@@ -267,13 +266,12 @@ function groupByTags(openApiSpec) {
 
           if (!tagObj) {
             tagObj = {
-              show: true,
               elementId: `tag--${tag.replace(invalidCharsRegEx, '-')}`,
               name: tag,
               description: specTagsItem && specTagsItem.description || '',
               headers: specTagsItem && specTagsItem.description ? getHeadersFromMarkdown(specTagsItem.description) : [],
               paths: [],
-              expanded: specTagsItem ? specTagsItem['x-tag-expanded'] !== false : true
+              expanded: true
             };
             tags.push(tagObj);
           } // Generate a short summary which is broken
@@ -319,7 +317,6 @@ function groupByTags(openApiSpec) {
 
 
           tagObj.paths.push({
-            show: true,
             expanded: false,
             isWebhook,
             expandedAtLeastOnce: false,
@@ -336,7 +333,7 @@ function groupByTags(openApiSpec) {
             responses: pathOrHookObj.responses,
             callbacks: pathOrHookObj.callbacks,
             deprecated: pathOrHookObj.deprecated,
-            security: pathOrHookObj.security,
+            security: pathOrHookObj.security || openApiSpec.security,
             // commonSummary: commonPathProp.summary,
             // commonDescription: commonPathProp.description,
             xCodeSamples: pathOrHookObj['x-codeSamples'] || pathOrHookObj['x-code-samples'] || ''

package/dist/lib/openapi-explorer.js

@@ -110,6 +110,10 @@ class OpenApiExplorer extends _litElement.LitElement {
       layout: {
         type: String
       },
+      operationsCollapsed: {
+        type: Boolean,
+        attribute: 'collapse'
+      },
       defaultSchemaTab: {
         type: String,
         attribute: 'default-schema-tab'
@@ -165,9 +169,9 @@ class OpenApiExplorer extends _litElement.LitElement {
         type: String,
         attribute: 'show-server-selection'
       },
-      showComponents: {
-        type: String,
-        attribute: 'show-components'
+      hideComponents: {
+        type: Boolean,
+        attribute: 'hide-components'
       },
       // Main Colors and Font
       primaryColor: {
@@ -234,9 +238,6 @@ class OpenApiExplorer extends _litElement.LitElement {
         type: Boolean
       },
       // indicates spec is being loaded
-      operationsCollapsed: {
-        type: Boolean
-      },
       showAdvancedSearchDialog: {
         type: Boolean
       },
@@ -352,10 +353,6 @@ class OpenApiExplorer extends _litElement.LitElement {
       this.allowAuthentication = 'true';
     }
 
-    if (!this.showComponents || !'true false'.includes(this.showComponents)) {
-      this.showComponents = 'true';
-    }
-
     if (!this.fetchCredentials || !'omit, same-origin, include,'.includes(`${this.fetchCredentials},`)) {
       this.fetchCredentials = '';
     }
@@ -556,6 +553,11 @@ class OpenApiExplorer extends _litElement.LitElement {
 
   afterSpecParsedAndValidated(spec) {
     this.resolvedSpec = spec;
+
+    if (this.operationsCollapsed) {
+      this.resolvedSpec.tags.forEach(t => t.expanded = false);
+    }
+
     this.dispatchEvent(new CustomEvent('spec-loaded', {
       bubbles: true,
       detail: spec

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

@@ -61,7 +61,7 @@ function focusedEndpointTemplate() {
     focusedTemplate = _serverTemplate.default.call(this);
   } else if (focusElId === 'section') {
     focusedTemplate = (0, _litElement.html)` <section id="section" class="observe-me"> <slot name="custom-section"></slot> </section>`;
-  } else if (focusElId.startsWith('cmp--') && this.showComponents === 'true') {
+  } else if (focusElId.startsWith('cmp--') && !this.hideComponents) {
     focusedTemplate = _componentsTemplate.default.call(this);
   } else if (focusElId.startsWith('tag--')) {
     const idToFocus = focusElId.indexOf('--', 4) > 0 ? focusElId.substring(0, focusElId.indexOf('--', 5)) : focusElId;

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

@@ -49,6 +49,6 @@ function navbarTemplate() {
     return true;
   }).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 => {
     this.scrollToEventTarget(e, false);
-  }}"> <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.components && this.showComponents === 'true' ? (0, _litElement.html)` <div class="sticky-scroll-element"> <div id="link-components" class="nav-bar-section"> <div class="nav-bar-section-title">COMPONENTS</div> </div> </div> ${this.resolvedSpec.components.map(component => component.subComponents.filter(s => s.expanded).length ? (0, _litElement.html)` <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> ${component.subComponents.filter(s => s.expanded).map(p => (0, _litElement.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>`)}` : '')}` : ''} </nav>`} </nav> `;
+  }}"> <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.components && !this.hideComponents ? (0, _litElement.html)` <div class="sticky-scroll-element"> <div id="link-components" class="nav-bar-section"> <div class="nav-bar-section-title">COMPONENTS</div> </div> </div> ${this.resolvedSpec.components.map(component => component.subComponents.filter(s => s.expanded).length ? (0, _litElement.html)` <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> ${component.subComponents.filter(s => s.expanded).map(p => (0, _litElement.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>`)}` : '')}` : ''} </nav>`} </nav> `;
 }
 /* eslint-enable indent */

package/dist/lib/utils/spec-parser.js

@@ -98,10 +98,10 @@ async function ProcessSpec(specUrlOrObject, serverUrl = '') {
     });
 
     if (serverUrl && !jsonParsedSpec.servers.some(s => s.url === serverUrl || s.computedUrl === serverUrl)) {
-      jsonParsedSpec.servers.push({
+      jsonParsedSpec.servers = [{
         url: serverUrl,
         computedUrl: serverUrl
-      });
+      }].concat(jsonParsedSpec.servers);
     }
   } else if (serverUrl) {
     jsonParsedSpec.servers = [{
@@ -214,7 +214,7 @@ function getComponents(openApiSpec) {
 
     if (cmpName) {
       components.push({
-        show: true,
+        expanded: true,
         name: cmpName,
         description: cmpDescription,
         subComponents
@@ -229,13 +229,12 @@ function groupByTags(openApiSpec) {
   const supportedMethods = ['get', 'put', 'post', 'delete', 'patch', 'head', 'options']; // this is also used for ordering endpoints by methods
 
   const tags = openApiSpec.tags && Array.isArray(openApiSpec.tags) ? openApiSpec.tags.map(t => ({
-    show: true,
     elementId: `tag--${t.name.replace(_commonUtils.invalidCharsRegEx, '-')}`,
     name: t.name,
     description: t.description || '',
     headers: t.description ? getHeadersFromMarkdown(t.description) : [],
     paths: [],
-    expanded: t['x-tag-expanded'] !== false
+    expanded: true
   })) : [];
   const pathsAndWebhooks = openApiSpec.paths || {};
 
@@ -278,13 +277,12 @@ function groupByTags(openApiSpec) {
 
           if (!tagObj) {
             tagObj = {
-              show: true,
               elementId: `tag--${tag.replace(_commonUtils.invalidCharsRegEx, '-')}`,
               name: tag,
               description: specTagsItem && specTagsItem.description || '',
               headers: specTagsItem && specTagsItem.description ? getHeadersFromMarkdown(specTagsItem.description) : [],
               paths: [],
-              expanded: specTagsItem ? specTagsItem['x-tag-expanded'] !== false : true
+              expanded: true
             };
             tags.push(tagObj);
           } // Generate a short summary which is broken
@@ -330,7 +328,6 @@ function groupByTags(openApiSpec) {
 
 
           tagObj.paths.push({
-            show: true,
             expanded: false,
             isWebhook,
             expandedAtLeastOnce: false,
@@ -347,7 +344,7 @@ function groupByTags(openApiSpec) {
             responses: pathOrHookObj.responses,
             callbacks: pathOrHookObj.callbacks,
             deprecated: pathOrHookObj.deprecated,
-            security: pathOrHookObj.security,
+            security: pathOrHookObj.security || openApiSpec.security,
             // commonSummary: commonPathProp.summary,
             // commonDescription: commonPathProp.description,
             xCodeSamples: pathOrHookObj['x-codeSamples'] || pathOrHookObj['x-code-samples'] || ''

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "openapi-explorer",
-  "version": "0.9.327",
+  "version": "0.9.333",
   "description": "OpenAPI Explorer - API viewer with dynamically generated components, documentation, and interaction console",
   "author": "Rhosys Developers <developers@rhosys.ch>",
   "repository": {