openapi-explorer 0.8.264 → 0.8.268

package/package.json

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

package/src/components/schema-table.js

@@ -227,7 +227,7 @@ export default class SchemaTable extends LitElement {
         </div>
         <div class='td key-descr'>
           ${dataType === 'array' ? html`<span class="m-markdown-small">${unsafeHTML(marked(description))}</span>` : ''}
-          ${schemaDescription ? html`<span class="m-markdown-small">${unsafeHTML(marked(`${schemaTitle ? `**${schemaTitle}:** ` : ''}${schemaDescription}`))}</span>` : ''}
+          ${schemaTitle || schemaDescription ? html`<span class="m-markdown-small">${unsafeHTML(marked(`${schemaTitle ? `**${schemaTitle}:** ` : ''}${schemaDescription || ''}`))}</span>` : ''}
           ${constraint ? html`<div style='display:inline-block; line-break:anywhere; margin-right:8px;'> <span class='bold-text'>Constraints: </span> ${constraint}</div>` : ''}
           ${defaultValue ? html`<div style='display:inline-block; line-break:anywhere; margin-right:8px;'> <span class='bold-text'>Default: </span>${defaultValue}</div>` : ''}
           ${allowedValues ? html`<div style='display:inline-block; line-break:anywhere; margin-right:8px;'> <span class='bold-text'>Allowed: </span>${allowedValues}</div>` : ''}

package/src/openapi-explorer.js

@@ -27,7 +27,7 @@ import advancedSearchStyles from './styles/advanced-search-styles';
 
 import { advancedSearch, getCurrentElement, pathIsInSearch, replaceState, sleep } from './utils/common-utils';
 import ProcessSpec from './utils/spec-parser';
-import mainBodyTemplate from './templates/main-body-template';
+import responsiveViewMainBodyTemplate from './templates/responsiveViewMainBodyTemplate';
 import apiRequestStyles from './styles/api-request-styles';
 import { checkForAuthToken } from './templates/security-scheme-template';
 
@@ -180,8 +180,11 @@ export default class OpenApiExplorer extends LitElement {
       .section-gap.section-tag {
         border-bottom:1px solid var(--border-color);
       }
+      .method-section-gap {
+        padding: 24px 8px 0px 4px;
+      }
       .section-gap { 
-        padding: 0px 4px; 
+        padding: 24px 0px 0px;
       }
       .section-tag-header {
         position:relative;
@@ -432,7 +435,7 @@ export default class OpenApiExplorer extends LitElement {
   }
 
   render() {
-    return mainBodyTemplate.call(this);
+    return responsiveViewMainBodyTemplate.call(this);
   }
 
   observeExpandedContent() {

package/src/templates/endpoint-template.js

@@ -144,7 +144,7 @@ export default function endpointTemplate() {
       <span @click="${(e) => expandCollapseAll.call(this, e, 'collapse-all')}" style="color:var(--primary-color); cursor: pointer;">Collapse</span>
     </div>
     ${(this.resolvedSpec && this.resolvedSpec.tags || []).map((tag) => html`
-    <div class='regular-font section-gap section-tag ${tag.expanded ? 'expanded' : 'collapsed'}' > 
+    <div class='regular-font method-section-gap section-tag ${tag.expanded ? 'expanded' : 'collapsed'}' > 
     
       <div class='section-tag-header' @click="${(e) => toggleTag.call(this, e, tag.elementId)}">
         <div id='${tag.elementId}' class="sub-title tag" style="color:var(--primary-color)">${tag.name}</div>

package/src/templates/focused-endpoint-template.js

@@ -72,7 +72,7 @@ export default function focusedEndpointTemplate() {
   } else if (focusElId === 'section') {
     focusedTemplate = html`
       <section id='section' style="margin-top:24px; margin-bottom:24px;"
-        class='observe-me ${this.renderStyle === 'read' ? 'section-gap--read-mode' : (this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap')}'>
+        class='observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}'>
         <slot name="custom-section"></slot>
       </section>`;
   } else if (focusElId.startsWith('cmp--') && this.showComponents === 'true') {

package/src/templates/overview-template.js

@@ -12,7 +12,7 @@ function headingRenderer() {
 export default function overviewTemplate() {
   return html`
     <section id="overview" part="section-overview"
-      class="observe-me ${this.renderStyle === 'read' ? 'section-gap--read-mode' : (this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap')}">
+      class="observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}">
       ${this.resolvedSpec && this.resolvedSpec.info
         ? html`
           <slot name="overview">

package/src/templates/{main-body-template.js → responsiveViewMainBodyTemplate.js}

@@ -12,7 +12,7 @@ import advancedSearchTemplate from './advance-search-template';
 import SetTheme from '../utils/theme';
 import ColorUtils from '../utils/color-utils';
 
-export default function mainBodyTemplate() {
+export default function responsiveViewMainBodyTemplate() {
   const newTheme = {
     bg1: ColorUtils.isValidHexColor(this.bgColor) ? this.bgColor : '',
     fg1: ColorUtils.isValidHexColor(this.textColor) ? this.textColor : '',
@@ -57,8 +57,8 @@ export default function mainBodyTemplate() {
                     ${this.showInfo === 'true' ? overviewTemplate.call(this) : ''}
                     ${this.allowServerSelection === 'true' ? serverTemplate.call(this) : ''}
                     ${this.allowAuthentication === 'true' ? securitySchemeTemplate.call(this) : ''}
-                    <section id='section' style="margin-top:24px; margin-bottom:24px;"
-                      class='observe-me ${this.renderStyle === 'read' ? 'section-gap--read-mode' : (this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap')}'>
+                    <section id='section'
+                      class='observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}'>
                       <slot name="custom-section"></slot>
                     </section>
                     ${this.renderStyle === 'read'

package/src/templates/security-scheme-template.js

@@ -298,7 +298,7 @@ export default function securitySchemeTemplate() {
   }
   const providedApiKeys = schemes.filter((v) => (v.finalKeyValue));
   return html`
-  <section id='auth' part="section-auth" class = 'observe-me ${this.renderStyle === 'read' ? 'section-gap--read-mode' : (this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap')}'>
+  <section id='auth' part="section-auth" class = 'observe-me ${this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}'>
     <slot name="authentication">
       <div class="section-padding">
         <div class='sub-title regular-font'>AUTHENTICATION</div>

package/src/utils/spec-parser.js

@@ -5,12 +5,21 @@ import { invalidCharsRegEx } from './common-utils';
 
 export default async function ProcessSpec(requiresLookup, specUrlOrObject, serverUrl = '') {
   let specMeta;
+
+  // Dynamically resolve non yaml or json files and insert their descriptions where necessary
+  function responseInterceptor(val) {
+    if (val.ok && val.text && val.parseError && val.parseError.name === 'YAMLException' && (!val.headers['content-type'] || val.headers['content-type'].match('text/plain'))) {
+      val.body = val.text;
+    }
+    return val;
+  }
+
   if (requiresLookup) {
-    specMeta = await SwaggerClient(specUrlOrObject);
+    specMeta = await SwaggerClient({ url: specUrlOrObject, responseInterceptor });
   } else if (typeof specUrlOrObject === 'string') {
-    specMeta = await SwaggerClient({ spec: yaml.load(specUrlOrObject) });
+    specMeta = await SwaggerClient({ spec: yaml.load(specUrlOrObject), responseInterceptor });
   } else {
-    specMeta = await SwaggerClient({ spec: specUrlOrObject });
+    specMeta = await SwaggerClient({ spec: specUrlOrObject, responseInterceptor });
   }
 
   const jsonParsedSpec = specMeta.spec;