openapi-explorer 0.9.310 → 0.9.314

package/src/styles/prism-styles.js

@@ -1,107 +0,0 @@
-import { css } from 'lit-element';
-
-export default css`
-code[class*="language-"],
-pre[class*="language-"] {
-  text-align: left;
-  white-space: pre;
-  word-spacing: normal;
-  word-break: normal;
-  word-wrap: normal;
-  line-height: 1.5;
-  tab-size: 2;
-
-  -webkit-hyphens: none;
-  -moz-hyphens: none;
-  -ms-hyphens: none;
-  hyphens: none;
-}
-
-/* Code blocks */
-pre[class*="language-"] {
-  padding: 1em;
-  margin: .5em 0;
-  overflow: auto;
-}
-
-/* Inline code */
-:not(pre) > code[class*="language-"] {
-  white-space: normal;
-}
-
-.token.comment,
-.token.block-comment,
-.token.prolog,
-.token.doctype,
-.token.cdata {
-  color: var(--light-fg)
-}
-
-.token.punctuation {
-  color: var(--fg);
-}
-
-.token.tag,
-.token.attr-name,
-.token.namespace,
-.token.deleted {
-  color:var(--pink);
-}
-
-.token.function-name {
-  color: var(--blue);
-}
-
-.token.boolean,
-.token.number,
-.token.function {
-  color: var(--red);
-}
-
-.token.property,
-.token.class-name,
-.token.constant,
-.token.symbol {
-  color: var(--code-property-color);
-}
-
-.token.selector,
-.token.important,
-.token.atrule,
-.token.keyword,
-.token.builtin {
-  color: var(--code-keyword-color);
-}
-
-.token.string,
-.token.char,
-.token.attr-value,
-.token.regex,
-.token.variable { 
-  color: var(--green);
-  white-space: pre-wrap;
-  line-break: anywhere;
-}
-
-.token.operator,
-.token.entity,
-.token.url {
-  color: var(--code-operator-color);
-}
-
-.token.important,
-.token.bold {
-  font-weight: bold;
-}
-.token.italic {
-  font-style: italic;
-}
-
-.token.entity {
-  cursor: help;
-}
-
-.token.inserted {
-  color: green;
-}
-`;

package/src/styles/schema-styles.js

@@ -1,121 +0,0 @@
-import { css } from 'lit-element';
-
-export default css`
-
-*, *:before, *:after { box-sizing: border-box; }
-
-.tr {
-  display: flex;
-  flex: none;
-  width: 100%;
-  box-sizing: content-box;
-  border-bottom: 1px dotted transparent;
-}
-.td {
-  display: block;
-  flex: 0 0 auto;
-}
-.key {
-  font-family: var(--font-mono);
-  white-space: normal;
-  word-break: break-all;
-}
-
-.collapsed-descr .key{
-  overflow:hidden;
-}
-
-.key-descr {
-  font-family:var(--font-regular);
-  flex-shrink: 1;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  display: none;
-}
-.toolbar {
-  display: none;
-}
-.expanded-descr .key-descr{
-  max-height:auto;
-  overflow:hidden;
-  display: none;
-}
-.collapsed-descr .tr {
-  max-height:20px;
-}
-
-.tr.xxx-of{
-  border-top: 1px dotted var(--primary-color);
-}
-
-.xxx-of-key {
-  font-size: calc(var(--font-size-small) - 2px); 
-  font-weight:bold; 
-  background-color:var(--primary-color); 
-  color: var(--primary-btn-text-color);
-  border-radius:2px;
-  line-height:calc(var(--font-size-small) + 6px);
-  padding:0px 5px; 
-  margin-bottom:1px; 
-  display:inline-block;
-}
-
-.xxx-of-descr {
-    font-family: var(--font-regular);
-    color: var(--primary-color);
-    font-size: calc(var(--font-size-small) - 1px);
-    margin-left: 2px;
-}
-
-.stri, .string, .uri, .url, .byte, .bina, .date, .pass, .ipv4, .ipv4, .uuid, .emai, .host {color:var(--green);}
-.inte, .numb, .number, .int6, .int3, .floa, .doub, .deci .blue {color:var(--blue);}
-.null {color:var(--red);}
-.bool, .boolean{color:var(--orange)}
-.enum {color:var(--yellow)}
-
-.tree .toolbar {
-  display: flex;
-  justify-content: space-between;
-}
-
-.toolbar {
-  width:100%;
-}
-.toolbar-item {
-  cursor: pointer;
-  padding: 5px 0 5px 1rem;
-  margin: 0 1rem !important;
-  /* TODO: add: The import highlight color variable */
-  color: #38b3f9;
-  flex-shrink: 0;
-}
-.tree .toolbar .toolbar-item {
-  display: none;
-}
-.schema-root-type {
-  cursor:auto;
-  color:var(--fg2);
-  font-weight: bold;
-  text-transform: uppercase;
-}
-.schema-root-type.xxx-of {
-  display:none;
-}
-.toolbar-item:first-of-type { margin:0 2px 0 0;}
-
-
-@media only screen and (min-width: 576px) {
-  .key-descr {
-    display: block;
-  }
-  .tree .toolbar .toolbar-item {
-    display: block;
-  }
-  .toolbar {
-    display: flex;
-  }
-  .expanded-descr .key-descr{
-    display: block;
-  }
-}
-`;

package/src/styles/tab-styles.js

@@ -1,44 +0,0 @@
-import { css } from 'lit-element';
-
-export default css`
-.tab-panel {
-  border: none;
-}
-.tab-buttons {
-  height:30px;
-  border-bottom: 1px solid var(--light-border-color) ;
-  align-items: stretch;
-  overflow-y: hidden;
-  overflow-x: auto;
-  scrollbar-width: thin;
-}
-.tab-buttons::-webkit-scrollbar {
-  height: 1px;
-  background-color: var(--border-color);
-}
-.tab-btn {
-  border: none;
-  border-bottom: 3px solid transparent; 
-  color: var(--light-fg);
-  background-color: transparent;
-  white-space: nowrap;
-  cursor: pointer;
-  outline:none;
-  font-family:var(--font-regular); 
-  font-size:var(--font-size-small);
-  margin-right:16px;
-  padding:1px;
-}
-.tab-btn.active {
-  border-bottom: 3px solid var(--primary-color); 
-  font-weight:bold;
-  color:var(--primary-color);
-}
-
-.tab-btn:hover {
-  color:var(--primary-color);
-}
-.tab-content {
-  position:relative;
-}
-`;

package/src/styles/table-styles.js

@@ -1,48 +0,0 @@
-import { css } from 'lit-element';
-
-export default css`
-.m-table {
-  border-spacing: 0;  
-  border-collapse: separate;
-  border: 1px solid var(--light-border-color);
-  border-radius: var(--border-radius);
-  margin: 0;
-  max-width: 100%;
-}
-.m-table tr:first-child td,
-.m-table tr:first-child th {
-    border-top: 0 none;
-}
-.m-table td, 
-.m-table th {
-  font-size: var(--font-size-small);
-  padding: 4px 5px 4px;
-}
-
-.m-table td:not([align]), 
-.m-table th:not([align]) {
-  text-align: left;
-}
-
-.m-table th {
-  color: var(--fg2);
-  font-size: var(--font-size-small);
-  line-height: calc(var(--font-size-small) + 18px);
-  font-weight: 600;
-  letter-spacing: normal;
-  background-color: var(--bg2);
-  vertical-align: bottom;
-  border-bottom: 1px solid var(--light-border-color);
-}
-
-.m-table > tbody > tr > td,
-.m-table > tr > td {
-  border-top: 1px solid var(--light-border-color);
-}
-.table-title {
-  font-size:var(--font-size-small);
-  font-weight:bold;
-  vertical-align: middle;
-  margin: 12px 0 4px 0;
-}
-`;

package/src/templates/advance-search-template.js

@@ -1,81 +0,0 @@
-import { html } from 'lit-element';
-
-/* eslint-disable indent */
-export default function searchByPropertiesModalTemplate() {
-  const keyDownEventListenerAdvancedSearch = (e) => {
-    if ((e.detail && e.detail.code || e.code) === 'Escape') {
-      this.showAdvancedSearchDialog = false;
-    }
-  };
-
-  const closeAdvancedSearchDialog = () => {
-    // Trigger the event to force it to be removed from the DOM
-    document.dispatchEvent(new CustomEvent('keydown', { detail: { code: 'Escape' } }));
-    document.removeEventListener('keydown', keyDownEventListenerAdvancedSearch, { once: true });
-  };
-
-  document.addEventListener('keydown', keyDownEventListenerAdvancedSearch, { once: true });
-
-  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="${() => { closeAdvancedSearchDialog(); }}" part="btn btn-outline">&times;</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, 400)}">
-              </div>
-              <div class="advanced-search-locations">
-                <div>
-                  <input style="cursor: pointer;" type="checkbox" part="checkbox checkbox-search-dialog" id="search-api-path" checked @change = "${(e) => this.onAdvancedSearch(e, 0)}">
-                  <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 @change = "${(e) => this.onAdvancedSearch(e, 0)}">
-                  <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, 0)}">
-                  <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, 0)}">
-                  <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, 0)}">
-                  <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) => {
-                    this.matchPaths = ''; // clear quick filter if applied
-                    closeAdvancedSearchDialog(); // Hide Search Dialog
-                    this.requestUpdate();
-                    this.scrollToEventTarget(e, true);
-                  }}"> 
-                  <span class="upper bold-text method-fg ${path.method}">${path.method}</span> 
-                  <span>${path.path}</span> - <span class="regular-font gray-text">${path.summary}</span>
-                </div>
-              `)}
-            </div>
-          </div>
-        </div>
-      </div>`
-    : ''
-  }`;
-}
-/* eslint-enable indent */

package/src/templates/callback-template.js

@@ -1,63 +0,0 @@
-import { html } from 'lit-element';
-
-/* eslint-disable indent */
-export default function callbackTemplate(callbacks) {
-  return html`
-  <div class="api-request col regular-font request-panel ${this.renderStyle}-mode">
-    ${Object.entries(callbacks).map((kv) => html`
-      <div class="${this.renderStyle}-request"> 
-        <div class="req-res-title">CALLBACKS</div>
-        <div class="table-title">${kv[0]}</div>
-        ${Object.entries(kv[1]).map((pathObj) => html`
-          <div class="mono-font small-font-size" style="display:flex;">
-            <div style="width:100%"> 
-              ${Object.entries(pathObj[1]).map((method) => html`
-                <div>
-                  <div style="margin-top:12px;">
-                    <div class="method method-fg ${method[0]}" style="width:70px; border:none; margin:0; padding:0; line-height:20px; vertical-align: baseline;text-align:left"> 
-                      <span style="font-size:20px;"> &#x2944; </span> 
-                      ${method[0]} 
-                    </div>
-                    <span style="line-height:20px; vertical-align: baseline;">${pathObj[0]} </span>
-                  </div>  
-                  <div class='expanded-req-resp-container'>
-                    <api-request class="request-panel"
-                      callback = "true"
-                      method = "${method[0] || ''}", 
-                      path = "${pathObj[0] || ''}" 
-                      .parameters = "${method[1] && method[1].parameters || ''}" 
-                      .request_body = "${method[1] && method[1].requestBody || ''}"
-                      fill-defaults = "${this.fillRequestWithDefault}"
-                      enable-console = "false"
-                      render-style="${this.renderStyle}" 
-                      schema-style = "${this.schemaStyle}"
-                      active-schema-tab = "${this.defaultSchemaTab}"
-                      schema-expand-level = "${this.schemaExpandLevel}"
-                      schema-description-expanded = "${this.schemaDescriptionExpanded}"
-                      schema-hide-read-only = "${this.schemaHideReadOnly}"
-                      fetch-credentials = "${this.fetchCredentials}"
-                      exportparts="btn btn-fill btn-outline btn-try">
-                    </api-request>
-
-                    <api-response
-                      callback = "true"
-                      .responses="${method[1] && method[1].responses}"
-                      render-style="${this.renderStyle}"
-                      schema-style="${this.schemaStyle}"
-                      active-schema-tab = "${this.defaultSchemaTab}"
-                      schema-expand-level = "${this.schemaExpandLevel}"
-                      schema-description-expanded = "${this.schemaDescriptionExpanded}"
-                      exportparts = "btn--resp btn-fill--resp btn-outline--resp"
-                    > </api-response>
-                  </div>
-                </div>  
-              `)}
-            </div>  
-          </div>  
-        `)}
-      </div>  
-    `)}
-  </div>
-  `;
-}
-/* eslint-enable indent */

package/src/templates/code-samples-template.js

@@ -1,35 +0,0 @@
-import { html } from 'lit-element';
-import { unsafeHTML } from 'lit-html/directives/unsafe-html';
-import Prism from 'prismjs';
-import { copyToClipboard } from '../utils/common-utils';
-
-/* eslint-disable indent */
-export default function codeSamplesTemplate(xCodeSamples) {
-  return html`
-  <section class="table-title top-gap"> CODE SAMPLES </div>
-  <div class="tab-panel col"
-    @click="${
-      (e) => {
-        if (!e.target.classList.contains('tab-btn')) { return; }
-        const clickedTab = e.target.dataset.tab;
-
-        const tabButtons = [...e.currentTarget.querySelectorAll('.tab-btn')];
-        const tabContents = [...e.currentTarget.querySelectorAll('.tab-content')];
-        tabButtons.forEach((tabBtnEl) => tabBtnEl.classList[tabBtnEl.dataset.tab === clickedTab ? 'add' : 'remove']('active'));
-        tabContents.forEach((tabBodyEl) => { tabBodyEl.style.display = (tabBodyEl.dataset.tab === clickedTab ? 'block' : 'none'); });
-      }
-    }">
-    <div class="tab-buttons row" style="width:100; overflow">
-      ${xCodeSamples.map((v, i) => html`<button class="tab-btn ${i === 0 ? 'active' : ''}" data-tab = '${v.lang}${i}'> ${v.label || v.lang} </button>`)}
-    </div>
-    ${xCodeSamples.map((v, i) => html`
-      <div class="tab-content m-markdown code-sample-wrapper" style= "display:${i === 0 ? 'block' : 'none'}" data-tab = '${v.lang}${i}'>
-        <button class="toolbar-copy-btn" @click='${(e) => { copyToClipboard(v.source, e); }}'>Copy</button>
-        <pre>
-          <code>${Prism.languages[v.lang && v.lang.toLowerCase()] ? unsafeHTML(Prism.highlight(v.source, Prism.languages[v.lang && v.lang.toLowerCase()], v.lang && v.lang.toLowerCase())) : v.source}</code>
-        </pre>
-      </div>`)
-    }
-  </section>`;
-}
-/* eslint-enable indent */

package/src/templates/components-template.js

@@ -1,43 +0,0 @@
-/* eslint-disable no-console */
-import { schemaInObjectNotation } from '../utils/schema-utils';
-import { html } from 'lit-element';
-import { unsafeHTML } from 'lit-html/directives/unsafe-html';
-import { marked } from 'marked';
-import '../components/json-tree';
-import '../components/schema-tree';
-
-function componentBodyTemplate(sComponent) {
-  const formdataPartSchema = schemaInObjectNotation(sComponent.component, {});
-
-  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)'> 
-      <schema-tree
-        .data = '${formdataPartSchema}'
-        schema-expand-level = "${this.schemaExpandLevel}"
-        schema-description-expanded = "${this.schemaDescriptionExpanded}"
-        schema-hide-read-only=false
-        schema-hide-write-only=false> </schema-tree>
-    </div>
-  </div>
-  `;
-}
-
-export default function componentsTemplate() {
-  return html`
-  ${this.resolvedSpec.components.map((component) => html`
-    <div id="cmp--${component.name.toLowerCase()}" class='regular-font section-gap--read-mode observe-me' style="border-top:1px solid var(--primary-color);">
-      <div class="title tag">${component.name}</div>
-      <div class="regular-font-size">
-        ${unsafeHTML(`<div class='m-markdown regular-font'>${marked(component.description ? component.description : '')}</div>`)}
-      </div>
-    </div>
-    <div class='regular-font section-gap--read-mode'>
-      ${component.subComponents.filter(c => c.expanded).map((sComponent) => componentBodyTemplate.call(this, sComponent))}
-    </div>
-    `)
-}
-`;
-}
-/* eslint-enable indent */