openapi-explorer 0.10.419 → 0.10.421

package/dist/lib/templates/security-scheme-template.js

@@ -5,9 +5,9 @@ exports.checkForAuthToken = checkForAuthToken;
 exports.default = securitySchemeTemplate;
 exports.pathSecurityTemplate = pathSecurityTemplate;
 
-var _litElement = require("lit-element");
+var _lit = require("lit");
 
-var _unsafeHtml = require("lit-html/directives/unsafe-html.js");
+var _unsafeHtml = require("lit/directives/unsafe-html.js");
 
 var _marked = require("marked");
 
@@ -282,7 +282,7 @@ function oAuthFlowTemplate(flowName, securityObj, authFlow) {
     flowNameDisplay = flowName;
   }
 
-  return (0, _litElement.html)` <div class="oauth-flow" style="padding:10px 0;margin-bottom:10px"> <div class="tiny-title upper" style="margin-bottom:5px">${flowNameDisplay}</div> ${authorizationUrl ? (0, _litElement.html)`<div><span style="width:75px;display:inline-block">Auth URL</span> <span class="mono-font"> ${authorizationUrl} </span></div>` : ''} ${tokenUrl ? (0, _litElement.html)`<div><span style="width:75px;display:inline-block">Token URL</span> <span class="mono-font">${tokenUrl}</span></div>` : ''} ${refreshUrl ? (0, _litElement.html)`<div><span style="width:75px;display:inline-block">Refresh URL</span> <span class="mono-font">${refreshUrl}</span></div>` : ''} ${flowName === 'authorizationCode' || flowName === 'clientCredentials' || flowName === 'implicit' ? (0, _litElement.html)` ${authFlow.scopes ? (0, _litElement.html)` <span> Scopes </span> <div class="oauth-scopes" part="section-auth-scopes" style="width:100%;display:flex;flex-direction:column;flex-wrap:wrap;margin:0 0 .125rem 0"> ${Object.entries(authFlow.scopes).map((scopeAndDescr, index) => (0, _litElement.html)` <div class="m-checkbox" style="display:inline-flex;align-items:center"> <input type="checkbox" checked="checked" part="checkbox checkbox-auth-scope" id="${flowName}${index}" value="${scopeAndDescr[0]}"> <label for="${flowName}${index}" style="margin-left:5px"> <span class="mono-font">${scopeAndDescr[0]}</span> ${scopeAndDescr[0] !== scopeAndDescr[1] ? ` - ${scopeAndDescr[1] || ''}` : ''} </label> </div> `)} </div> ` : ''} <div style="display:flex"> <input type="text" part="textbox textbox-auth-client-id" value="${securityObj.clientId || ''}" placeholder="Client ID" spellcheck="false" class="oauth-client-id"> ${flowName === 'clientCredentials' ? (0, _litElement.html)` <input type="password" part="textbox textbox-auth-client-secret" value="" placeholder="Client Secret" spellcheck="false" class="oauth-client-secret" style="margin:0 5px"> <select aria-label="oauth client secret location" style="margin-right:5px" class="oauth-send-client-secret-in"> <option value="header" selected="selected"> Authorization Header </option> <option value="request-body"> Request Body </option> </select>` : (0, _litElement.html)`<div style="width:5px"></div>`} ${flowName === 'authorizationCode' || flowName === 'clientCredentials' || flowName === 'implicit' ? (0, _litElement.html)` <button class="m-btn thin-border" part="btn btn-outline" @click="${e => {
+  return (0, _lit.html)` <div class="oauth-flow" style="padding:10px 0;margin-bottom:10px"> <div class="tiny-title upper" style="margin-bottom:5px">${flowNameDisplay}</div> ${authorizationUrl ? (0, _lit.html)`<div><span style="width:75px;display:inline-block">Auth URL</span> <span class="mono-font"> ${authorizationUrl} </span></div>` : ''} ${tokenUrl ? (0, _lit.html)`<div><span style="width:75px;display:inline-block">Token URL</span> <span class="mono-font">${tokenUrl}</span></div>` : ''} ${refreshUrl ? (0, _lit.html)`<div><span style="width:75px;display:inline-block">Refresh URL</span> <span class="mono-font">${refreshUrl}</span></div>` : ''} ${flowName === 'authorizationCode' || flowName === 'clientCredentials' || flowName === 'implicit' ? (0, _lit.html)` ${authFlow.scopes ? (0, _lit.html)` <span> Scopes </span> <div class="oauth-scopes" part="section-auth-scopes" style="width:100%;display:flex;flex-direction:column;flex-wrap:wrap;margin:0 0 .125rem 0"> ${Object.entries(authFlow.scopes).map((scopeAndDescr, index) => (0, _lit.html)` <div class="m-checkbox" style="display:inline-flex;align-items:center"> <input type="checkbox" checked="checked" part="checkbox checkbox-auth-scope" id="${flowName}${index}" value="${scopeAndDescr[0]}"> <label for="${flowName}${index}" style="margin-left:5px"> <span class="mono-font">${scopeAndDescr[0]}</span> ${scopeAndDescr[0] !== scopeAndDescr[1] ? ` - ${scopeAndDescr[1] || ''}` : ''} </label> </div> `)} </div> ` : ''} <div style="display:flex"> <input type="text" part="textbox textbox-auth-client-id" value="${securityObj.clientId || ''}" placeholder="Client ID" spellcheck="false" class="oauth-client-id"> ${flowName === 'clientCredentials' ? (0, _lit.html)` <input type="password" part="textbox textbox-auth-client-secret" value="" placeholder="Client Secret" spellcheck="false" class="oauth-client-secret" style="margin:0 5px"> <select aria-label="oauth client secret location" style="margin-right:5px" class="oauth-send-client-secret-in"> <option value="header" selected="selected"> Authorization Header </option> <option value="request-body"> Request Body </option> </select>` : (0, _lit.html)`<div style="width:5px"></div>`} ${flowName === 'authorizationCode' || flowName === 'clientCredentials' || flowName === 'implicit' ? (0, _lit.html)` <button class="m-btn thin-border" part="btn btn-outline" @click="${e => {
     onInvokeOAuthFlow.call(this, apiKeyId, flowName, authorizationUrl, tokenUrl, e);
   }}">GET TOKEN</button>` : ''} </div> <div class="oauth-resp-display red-text small-font-size"></div> ` : ''} </div> `;
 }
@@ -295,16 +295,16 @@ function securitySchemeTemplate() {
   }
 
   const providedApiKeys = schemes.filter(v => v.finalKeyValue);
-  return (0, _litElement.html)` <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">${(0, _languages.getI18nText)('headers.authentication')}</div> <div class="small-font-size" style="display:flex;align-items:center;min-height:30px"> ${providedApiKeys.length > 0 ? (0, _litElement.html)` <div class="blue-text"> ${providedApiKeys.length} API key applied </div> <div style="flex:1"></div> <button class="m-btn thin-border" part="btn btn-outline" @click="${() => {
+  return (0, _lit.html)` <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">${(0, _languages.getI18nText)('headers.authentication')}</div> <div class="small-font-size" style="display:flex;align-items:center;min-height:30px"> ${providedApiKeys.length > 0 ? (0, _lit.html)` <div class="blue-text"> ${providedApiKeys.length} API key applied </div> <div style="flex:1"></div> <button class="m-btn thin-border" part="btn btn-outline" @click="${() => {
     onClearAllApiKeys.call(this);
-  }}">CLEAR ALL API KEYS</button>` : (0, _litElement.html)`<div class="red-text">${(0, _languages.getI18nText)('authentication.no-api-key-applied')}</div>`} </div> ${schemes.length > 0 ? (0, _litElement.html)` <table role="presentation" class="m-table" style="width:100%"> ${schemes.map(v => (0, _litElement.html)` <tr> <td style="max-width:500px;overflow-wrap:break-word"> <div style="min-height:24px"> <span style="font-weight:700">${v.typeDisplay}</span> ${v.finalKeyValue ? (0, _litElement.html)` <span class="blue-text"> ${v.finalKeyValue ? 'Key Applied' : ''} </span> <button class="m-btn thin-border small" part="btn btn-outline" @click="${() => {
+  }}">CLEAR ALL API KEYS</button>` : (0, _lit.html)`<div class="red-text">${(0, _languages.getI18nText)('authentication.no-api-key-applied')}</div>`} </div> ${schemes.length > 0 ? (0, _lit.html)` <table role="presentation" class="m-table" style="width:100%"> ${schemes.map(v => (0, _lit.html)` <tr> <td style="max-width:500px;overflow-wrap:break-word"> <div style="min-height:24px"> <span style="font-weight:700">${v.typeDisplay}</span> ${v.finalKeyValue ? (0, _lit.html)` <span class="blue-text"> ${v.finalKeyValue ? 'Key Applied' : ''} </span> <button class="m-btn thin-border small" part="btn btn-outline" @click="${() => {
     v.finalKeyValue = '';
     this.requestUpdate();
-  }}">REMOVE</button> ` : ''} </div> ${v.description ? (0, _litElement.html)` <div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(v.description || ''))} </div>` : ''} </td> <td> ${v.type && (v.type.toLowerCase() === 'apikey' || v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'bearer') ? (0, _litElement.html)` ${v.type.toLowerCase() === 'apikey' ? (0, _litElement.html)`Send <code>${v.name}</code> in <code>${v.in}</code> with the given value:` : (0, _litElement.html)`Send <code>Authorization</code> in <code>header</code> containing the word <code>Bearer</code> followed by a space and a Token String.`} <form style="display:flex"> ${v.in === 'cookie' ? (0, _litElement.html)` <div style="display:block"> <input type="text" value="${getCookieValue(v.apiKeyId)}" disabled="disabled" class="api-key-input" placeholder="IygRVGf54B59e0GAkKmigGfuiVlp/uhFfk2ifA+jMMJzau2F1jPldc09gPTfnMw13BFBxqUZIFDm55DPfwkb0A==" spellcheck="false" style="resize:horizontal;width:100%"> <br> <small> <strong>Cookies</strong>&nbsp;are set and configured by the remote service, therefore it is not possible to configure them from the browser. </small> </div>` : (0, _litElement.html)` <input type="text" value="${v.value}" class="api-key-input" placeholder="api-token" spellcheck="false"> <button type="submit" class="m-btn thin-border" style="margin-left:5px" part="btn btn-outline" @click="${e => {
+  }}">REMOVE</button> ` : ''} </div> ${v.description ? (0, _lit.html)` <div class="m-markdown"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(v.description || ''))} </div>` : ''} </td> <td> ${v.type && (v.type.toLowerCase() === 'apikey' || v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'bearer') ? (0, _lit.html)` ${v.type.toLowerCase() === 'apikey' ? (0, _lit.html)`Send <code>${v.name}</code> in <code>${v.in}</code> with the given value:` : (0, _lit.html)`Send <code>Authorization</code> in <code>header</code> containing the word <code>Bearer</code> followed by a space and a Token String.`} <form style="display:flex"> ${v.in === 'cookie' ? (0, _lit.html)` <div style="display:block"> <input type="text" value="${getCookieValue(v.apiKeyId)}" disabled="disabled" class="api-key-input" placeholder="IygRVGf54B59e0GAkKmigGfuiVlp/uhFfk2ifA+jMMJzau2F1jPldc09gPTfnMw13BFBxqUZIFDm55DPfwkb0A==" spellcheck="false" style="resize:horizontal;width:100%"> <br> <small> <strong>Cookies</strong>&nbsp;are set and configured by the remote service, therefore it is not possible to configure them from the browser. </small> </div>` : (0, _lit.html)` <input type="text" value="${v.value}" class="api-key-input" placeholder="api-token" spellcheck="false"> <button type="submit" class="m-btn thin-border" style="margin-left:5px" part="btn btn-outline" @click="${e => {
     onApiKeyChange.call(this, v.apiKeyId, e);
-  }}"> ${v.finalKeyValue ? 'UPDATE' : 'SET'} </button>`} </form>` : ''} ${v.type && v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'basic' ? (0, _litElement.html)` ${(0, _languages.getI18nText)('authentication.http-basic-desc')} <form style="display:flex"> <input type="text" value="${v.user}" placeholder="${(0, _languages.getI18nText)('authentication.username')}" spellcheck="false" class="api-key-user" style="width:100px"> <input type="password" value="${v.password}" placeholder="${(0, _languages.getI18nText)('authentication.password')}" spellcheck="false" class="api-key-password" style="width:100px;margin:0 5px"> <button type="submit" class="m-btn thin-border" @click="${e => {
+  }}"> ${v.finalKeyValue ? 'UPDATE' : 'SET'} </button>`} </form>` : ''} ${v.type && v.type.toLowerCase() === 'http' && v.scheme && v.scheme.toLowerCase() === 'basic' ? (0, _lit.html)` ${(0, _languages.getI18nText)('authentication.http-basic-desc')} <form style="display:flex"> <input type="text" value="${v.user}" placeholder="${(0, _languages.getI18nText)('authentication.username')}" spellcheck="false" class="api-key-user" style="width:100px"> <input type="password" value="${v.password}" placeholder="${(0, _languages.getI18nText)('authentication.password')}" spellcheck="false" class="api-key-password" style="width:100px;margin:0 5px"> <button type="submit" class="m-btn thin-border" @click="${e => {
     onApiKeyChange.call(this, v.apiKeyId, e);
-  }}" part="btn btn-outline"> ${v.finalKeyValue ? 'UPDATE' : (0, _languages.getI18nText)('authentication.set')} </button> </form>` : ''} </td> </tr> ${v.type.toLowerCase() === 'oauth2' ? (0, _litElement.html)` <tr> <td colspan="2" style="border:none;padding-left:48px"> ${Object.keys(v.flows).map(f => oAuthFlowTemplate.call(this, f, v, v.flows[f]))} </td> </tr> ` : ''} `)} </table>` : ''} </div> </slot> </section> `;
+  }}" part="btn btn-outline"> ${v.finalKeyValue ? 'UPDATE' : (0, _languages.getI18nText)('authentication.set')} </button> </form>` : ''} </td> </tr> ${v.type.toLowerCase() === 'oauth2' ? (0, _lit.html)` <tr> <td colspan="2" style="border:none;padding-left:48px"> ${Object.keys(v.flows).map(f => oAuthFlowTemplate.call(this, f, v, v.flows[f]))} </td> </tr> ` : ''} `)} </table>` : ''} </div> </slot> </section> `;
 }
 
 function getOauthScopeTemplate(scopes) {
@@ -312,7 +312,7 @@ function getOauthScopeTemplate(scopes) {
     return '';
   }
 
-  return (0, _litElement.html)` <div> <b>Required scopes:</b> <br> <div style="margin-left:8px"> ${scopes.map(scope => (0, _litElement.html)`<span>${scope}</span>&nbsp;`)} </div> </div>`;
+  return (0, _lit.html)` <div> <b>Required scopes:</b> <br> <div style="margin-left:8px"> ${scopes.map(scope => (0, _lit.html)`<span>${scope}</span>&nbsp;`)} </div> </div>`;
 }
 
 function pathSecurityTemplate(pathSecurity) {
@@ -336,7 +336,7 @@ function pathSecurityTemplate(pathSecurity) {
         securityDefs: andSecurityKeys1
       });
     });
-    return (0, _litElement.html)`<div class="security-info-button" data-content-id="auth" @click="${e => this.scrollToEventTarget(e, false)}"> <div style="position:relative;display:flex;min-width:350px;max-width:700px;justify-content:flex-end"> <svg width="16" height="24" style="cursor:pointer"> <g> <path style="fill:var(--fg3)" d="m13.8,8.5l0,-2.6l0,0c0,-3.2 -2.6,-5.8 -5.8,-5.8s-5.8,2.6 -5.8,5.8l0,0l0,2.6l-2.1,0l0,11.2l16,0l0,-11.2l-2.1,0l-0,0l0,0l0,0l-0,0zm-9.8,-2.6c0,0 0,0 0,0c0,-2.2 1.8,-4 4,-4c2.2,0 4,1.8 4,4c0,0 0,0 0,0l0,2.6l-8.03,0l0,-2.6l0,0l0,0z"/> </g> </svg> ${orSecurityKeys1.map((orSecurityItem1, i) => (0, _litElement.html)` ${i !== 0 ? (0, _litElement.html)`<div style="padding:3px 4px"> OR </div>` : ''} <div class="tooltip" style="cursor:pointer"> <div style="padding:2px 4px;white-space:nowrap;text-overflow:ellipsis;max-width:150px;overflow:hidden"> <span part="anchor anchor-operation-security"> ${orSecurityItem1.securityTypes} </span> </div> <div class="tooltip-text" style="position:absolute;color:var(--fg);top:26px;right:0;border:1px solid var(--border-color);padding:2px 4px;display:block"> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<div>Requires <b>all</b> of the following </div>` : ''} <div style="padding-left:8px"> ${orSecurityItem1.securityDefs.map((andSecurityItem, j) => (0, _litElement.html)` ${andSecurityItem.type === 'oauth2' ? (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> &nbsp;` : (0, _litElement.html)`Requires`} OAuth token (${andSecurityItem.apiKeyId}) in <b>Authorization header</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : andSecurityItem.type === 'http' ? (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> &nbsp;` : (0, _litElement.html)`${(0, _languages.getI18nText)('authentication.requires')}`} ${andSecurityItem.scheme === 'basic' ? (0, _languages.getI18nText)('authentication.http-basic-note') : 'Bearer Token'} ${(0, _languages.getI18nText)('authentication.in-auth-header')} ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : (0, _litElement.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _litElement.html)`<b>${j + 1}.</b> &nbsp;` : (0, _litElement.html)`Requires`} Token in <b>${andSecurityItem.name} ${andSecurityItem.in}</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>`} `)} </div> </div> </div> `)} </div> </div>`;
+    return (0, _lit.html)`<div class="security-info-button" data-content-id="auth" @click="${e => this.scrollToEventTarget(e, false)}"> <div style="position:relative;display:flex;min-width:350px;max-width:700px;justify-content:flex-end"> <svg width="16" height="24" style="cursor:pointer"> <g> <path style="fill:var(--fg3)" d="m13.8,8.5l0,-2.6l0,0c0,-3.2 -2.6,-5.8 -5.8,-5.8s-5.8,2.6 -5.8,5.8l0,0l0,2.6l-2.1,0l0,11.2l16,0l0,-11.2l-2.1,0l-0,0l0,0l0,0l-0,0zm-9.8,-2.6c0,0 0,0 0,0c0,-2.2 1.8,-4 4,-4c2.2,0 4,1.8 4,4c0,0 0,0 0,0l0,2.6l-8.03,0l0,-2.6l0,0l0,0z"/> </g> </svg> ${orSecurityKeys1.map((orSecurityItem1, i) => (0, _lit.html)` ${i !== 0 ? (0, _lit.html)`<div style="padding:3px 4px"> OR </div>` : ''} <div class="tooltip" style="cursor:pointer"> <div style="padding:2px 4px;white-space:nowrap;text-overflow:ellipsis;max-width:150px;overflow:hidden"> <span part="anchor anchor-operation-security"> ${orSecurityItem1.securityTypes} </span> </div> <div class="tooltip-text" style="position:absolute;color:var(--fg);top:26px;right:0;border:1px solid var(--border-color);padding:2px 4px;display:block"> ${orSecurityItem1.securityDefs.length > 1 ? (0, _lit.html)`<div>Requires <b>all</b> of the following </div>` : ''} <div style="padding-left:8px"> ${orSecurityItem1.securityDefs.map((andSecurityItem, j) => (0, _lit.html)` ${andSecurityItem.type === 'oauth2' ? (0, _lit.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _lit.html)`<b>${j + 1}.</b> &nbsp;` : (0, _lit.html)`Requires`} OAuth token (${andSecurityItem.apiKeyId}) in <b>Authorization header</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : andSecurityItem.type === 'http' ? (0, _lit.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _lit.html)`<b>${j + 1}.</b> &nbsp;` : (0, _lit.html)`${(0, _languages.getI18nText)('authentication.requires')}`} ${andSecurityItem.scheme === 'basic' ? (0, _languages.getI18nText)('authentication.http-basic-note') : 'Bearer Token'} ${(0, _languages.getI18nText)('authentication.in-auth-header')} ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>` : (0, _lit.html)` <div> ${orSecurityItem1.securityDefs.length > 1 ? (0, _lit.html)`<b>${j + 1}.</b> &nbsp;` : (0, _lit.html)`Requires`} Token in <b>${andSecurityItem.name} ${andSecurityItem.in}</b> ${getOauthScopeTemplate(andSecurityItem.scopes)} </div>`} `)} </div> </div> </div> `)} </div> </div>`;
   }
 
   return '';

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

@@ -3,11 +3,11 @@
 exports.__esModule = true;
 exports.default = serverTemplate;
 
-var _litElement = require("lit-element");
+var _lit = require("lit");
 
 var _marked = require("marked");
 
-var _unsafeHtml = require("lit-html/directives/unsafe-html.js");
+var _unsafeHtml = require("lit/directives/unsafe-html.js");
 
 var _languages = require("../languages");
 
@@ -32,11 +32,11 @@ function onApiServerVarChange(e, serverObj) {
 
 
 function serverVarsTemplate() {
-  return this.selectedServer && this.selectedServer.variables ? (0, _litElement.html)` <div class="table-title">${(0, _languages.getI18nText)('api-servers.server-variables')}</div> <table role="presentation" class="m-table"> ${Object.entries(this.selectedServer.variables).map(kv => (0, _litElement.html)` <tr> <td style="vertical-align:middle">${kv[0]}</td> <td> ${kv[1].enum ? (0, _litElement.html)` <select data-var="${kv[0]}" @input="${e => {
+  return this.selectedServer && this.selectedServer.variables ? (0, _lit.html)` <div class="table-title">${(0, _languages.getI18nText)('api-servers.server-variables')}</div> <table role="presentation" class="m-table"> ${Object.entries(this.selectedServer.variables).map(kv => (0, _lit.html)` <tr> <td style="vertical-align:middle">${kv[0]}</td> <td> ${kv[1].enum ? (0, _lit.html)` <select data-var="${kv[0]}" @input="${e => {
     onApiServerVarChange.call(this, e, this.selectedServer);
-  }}"> ${Object.entries(kv[1].enum).map(e => kv[1].default === e[1] ? (0, _litElement.html)` <option selected="selected" label="${e[1]}" value="${e[1]}">` : (0, _litElement.html)` <option label="${e[1]}" value="${e[1]}">`)} </select>` : (0, _litElement.html)` <input type="text" part="textbox textbox-server-var" spellcheck="false" data-var="${kv[0]}" value="${kv[1].default}" @input="${e => {
+  }}"> ${Object.entries(kv[1].enum).map(e => kv[1].default === e[1] ? (0, _lit.html)` <option selected="selected" label="${e[1]}" value="${e[1]}">` : (0, _lit.html)` <option label="${e[1]}" value="${e[1]}">`)} </select>` : (0, _lit.html)` <input type="text" part="textbox textbox-server-var" spellcheck="false" data-var="${kv[0]}" value="${kv[1].default}" @input="${e => {
     onApiServerVarChange.call(this, e, this.selectedServer);
-  }}">`} </td> </tr> ${kv[1].description ? (0, _litElement.html)`<tr><td colspan="2" style="border:none"><span class="m-markdown-small"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(kv[1].description))} </span></td></tr>` : ''} `)} </table> ` : '';
+  }}">`} </td> </tr> ${kv[1].description ? (0, _lit.html)`<tr><td colspan="2" style="border:none"><span class="m-markdown-small"> ${(0, _unsafeHtml.unsafeHTML)((0, _marked.marked)(kv[1].description))} </span></td></tr>` : ''} `)} </table> ` : '';
 }
 
 function serverTemplate() {
@@ -44,8 +44,8 @@ function serverTemplate() {
     return undefined;
   }
 
-  return (0, _litElement.html)` <section id="servers" part="section-servers" style="margin-top:24px;margin-bottom:24px" class="regular-font observe-me section-padding ${this.renderStyle === 'read' ? 'section-gap--read-mode' : this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> <div class="sub-title">${(0, _languages.getI18nText)('headers.api-servers')}</div> <div class="mono-font" style="margin:12px 0;font-size:calc(var(--font-size-small) + 1px)"> ${!this.resolvedSpec.servers || !this.resolvedSpec.servers.length ? '' : (0, _litElement.html)` ${this.resolvedSpec.servers.map((server, i) => (0, _litElement.html)` <input type="radio" name="api_server" id="srvr-opt-${i}" value="${server.url}" @change="${e => {
+  return (0, _lit.html)` <section id="servers" part="section-servers" style="margin-top:24px;margin-bottom:24px" class="regular-font observe-me section-padding ${this.renderStyle === 'read' ? 'section-gap--read-mode' : this.renderStyle === 'focused' ? 'section-gap--focused-mode' : 'section-gap'}"> <div class="sub-title">${(0, _languages.getI18nText)('headers.api-servers')}</div> <div class="mono-font" style="margin:12px 0;font-size:calc(var(--font-size-small) + 1px)"> ${!this.resolvedSpec.servers || !this.resolvedSpec.servers.length ? '' : (0, _lit.html)` ${this.resolvedSpec.servers.map((server, i) => (0, _lit.html)` <input type="radio" name="api_server" id="srvr-opt-${i}" value="${server.url}" @change="${e => {
     onApiServerChange.call(this, e, server);
-  }}" .checked="${this.selectedServer.url === server.url}" style="margin:4px 0;cursor:pointer"> <label style="cursor:pointer" for="srvr-opt-${i}"> ${server.url} ${server.description ? (0, _litElement.html)`- <span class="regular-font">${server.description} </span>` : ''} </label> <br> `)} `} <div class="table-title primary-text" part="label-selected-server"> ${(0, _languages.getI18nText)('api-servers.selected')}: ${this.selectedServer && this.selectedServer.computedUrl || 'none'}</div> </div> <slot name="servers"></slot> ${serverVarsTemplate.call(this)} </section>`;
+  }}" .checked="${this.selectedServer.url === server.url}" style="margin:4px 0;cursor:pointer"> <label style="cursor:pointer" for="srvr-opt-${i}"> ${server.url} ${server.description ? (0, _lit.html)`- <span class="regular-font">${server.description} </span>` : ''} </label> <br> `)} `} <div class="table-title primary-text" part="label-selected-server"> ${(0, _languages.getI18nText)('api-servers.selected')}: ${this.selectedServer && this.selectedServer.computedUrl || 'none'}</div> </div> <slot name="servers"></slot> ${serverVarsTemplate.call(this)} </section>`;
 }
 /* eslint-enable indent */

package/dist/lib/utils/schema-utils.js

@@ -19,6 +19,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // When the type is not known for a property set the displayed type to be this:
 const IS_MISSING_TYPE_INFO_TYPE = '';
+const EXAMPLE_VALUE_FOR_MISSING_TYPE = '';
 /* Generates an schema object containing type and constraint info */
 
 function getTypeInfo(schema, options = {
@@ -134,7 +135,7 @@ function getSampleValueByType(schemaObj, fallbackPropertyName, skipExampleString
   }
 
   if (Object.keys(schemaObj).length === 0) {
-    return null;
+    return EXAMPLE_VALUE_FOR_MISSING_TYPE;
   }
 
   if (schemaObj.$ref) {
@@ -225,7 +226,7 @@ function getSampleValueByType(schemaObj, fallbackPropertyName, skipExampleString
   } // If type cannot be determined
 
 
-  return '?';
+  return EXAMPLE_VALUE_FOR_MISSING_TYPE;
 }
 
 function duplicateExampleWithNewPropertyValues(objectExamples, propertyName, propertyValues) {
@@ -286,12 +287,22 @@ function getExampleValuesFromSchemaRecursive(rawSchema, config = {}) {
     return getExampleValuesFromSchemaRecursive(mergedAllOf, config);
   }
 
-  if (oneOf) {
-    return oneOf.map(s => getExampleValuesFromSchemaRecursive((0, _lodash2.default)({}, s, schema), config)).flat(1);
-  }
+  if (oneOf || anyOf) {
+    const examples = (oneOf || anyOf).map(s => getExampleValuesFromSchemaRecursive((0, _lodash2.default)({}, schema, s), config)).flat(1);
+
+    const hash = value => {
+      if (typeof value === 'object') {
+        return JSON.stringify(value);
+      }
 
-  if (anyOf) {
-    return anyOf.map(s => getExampleValuesFromSchemaRecursive((0, _lodash2.default)({}, s, schema), config)).flat(1);
+      return value;
+    };
+
+    const uniqueExamples = examples.reduce((acc, e) => {
+      acc[hash(e)] = e;
+      return acc;
+    }, {});
+    return Object.values(uniqueExamples);
   }
 
   return getSimpleValueResult(schema, config, namespace, prefix, xmlAttributes, xmlTagProperties, overridePropertyName);
@@ -421,35 +432,45 @@ function schemaInObjectNotation(rawSchema, options, level = 0, suffix = '') {
     let readOnly = true;
     (anyOf || oneOf || []).forEach((v, index) => {
       if (v.type === 'object' || v.properties || v.allOf || v.anyOf || v.oneOf) {
-        var _partialObj$Flags, _partialObj$Flags2;
-
         const partialObj = schemaInObjectNotation(v, options);
-        objWithAnyOfProps[`::OPTION~${index + 1}${v.title ? `~${v.title}` : ''}`] = partialObj;
-        objWithAnyOfProps['::type'] = 'xxx-of-option';
-        readOnly = readOnly && ((_partialObj$Flags = partialObj['::flags']) === null || _partialObj$Flags === void 0 ? void 0 : _partialObj$Flags['🆁']);
-        writeOnly = writeOnly && ((_partialObj$Flags2 = partialObj['::flags']) === null || _partialObj$Flags2 === void 0 ? void 0 : _partialObj$Flags2['🆆']);
+
+        if (partialObj) {
+          var _partialObj$Flags, _partialObj$Flags2;
+
+          objWithAnyOfProps[`::OPTION~${index + 1}${v.title ? `~${v.title}` : ''}`] = partialObj;
+          objWithAnyOfProps['::type'] = 'xxx-of-option';
+          readOnly = readOnly && ((_partialObj$Flags = partialObj['::flags']) === null || _partialObj$Flags === void 0 ? void 0 : _partialObj$Flags['🆁']);
+          writeOnly = writeOnly && ((_partialObj$Flags2 = partialObj['::flags']) === null || _partialObj$Flags2 === void 0 ? void 0 : _partialObj$Flags2['🆆']);
+        }
       } else if (v.type === 'array' || v.items) {
         var _partialObj$Flags3, _partialObj$Flags4;
 
-        // This else-if block never seems to get executed
         const partialObj = schemaInObjectNotation(v, options);
         objWithAnyOfProps[`::OPTION~${index + 1}${v.title ? `~${v.title}` : ''}`] = partialObj;
         objWithAnyOfProps['::type'] = 'xxx-of-array';
         readOnly = readOnly && ((_partialObj$Flags3 = partialObj['::flags']) === null || _partialObj$Flags3 === void 0 ? void 0 : _partialObj$Flags3['🆁']);
         writeOnly = writeOnly && ((_partialObj$Flags4 = partialObj['::flags']) === null || _partialObj$Flags4 === void 0 ? void 0 : _partialObj$Flags4['🆆']);
       } else {
-        var _objWithAnyOfProps$, _objWithAnyOfProps$2;
+        const typeInfo = getTypeInfo(v, options);
+
+        if (typeInfo !== null && typeInfo !== void 0 && typeInfo.type) {
+          var _objWithAnyOfProps$, _objWithAnyOfProps$2;
 
-        const prop = `::OPTION~${index + 1}${v.title ? `~${v.title}` : ''}`;
-        objWithAnyOfProps[prop] = `${getTypeInfo(v, options).html}`;
-        objWithAnyOfProps['::type'] = 'xxx-of-option';
-        readOnly = readOnly && ((_objWithAnyOfProps$ = objWithAnyOfProps['::flags']) === null || _objWithAnyOfProps$ === void 0 ? void 0 : _objWithAnyOfProps$['🆁']);
-        writeOnly = writeOnly && ((_objWithAnyOfProps$2 = objWithAnyOfProps['::flags']) === null || _objWithAnyOfProps$2 === void 0 ? void 0 : _objWithAnyOfProps$2['🆆']);
+          const prop = `::OPTION~${index + 1}${v.title ? `~${v.title}` : ''}`;
+          objWithAnyOfProps[prop] = `${typeInfo.html}`;
+          objWithAnyOfProps['::type'] = 'xxx-of-option';
+          readOnly = readOnly && ((_objWithAnyOfProps$ = objWithAnyOfProps['::flags']) === null || _objWithAnyOfProps$ === void 0 ? void 0 : _objWithAnyOfProps$['🆁']);
+          writeOnly = writeOnly && ((_objWithAnyOfProps$2 = objWithAnyOfProps['::flags']) === null || _objWithAnyOfProps$2 === void 0 ? void 0 : _objWithAnyOfProps$2['🆆']);
+        }
       }
     });
     const obj = schemaInObjectNotation(schema, options, 0);
     const resultObj = typeof obj === 'object' && !Array.isArray(obj) ? obj : {};
-    resultObj[anyOf ? `::ANY~OF ${suffix}` : `::ONE~OF ${suffix}`] = objWithAnyOfProps;
+
+    if (Object.keys(objWithAnyOfProps).length) {
+      resultObj[anyOf ? `::ANY~OF ${suffix}` : `::ONE~OF ${suffix}`] = objWithAnyOfProps;
+    }
+
     resultObj['::type'] = 'object';
     resultObj['::flags'] = {
       '🆁': readOnly && '🆁',

package/dist/lib/utils/theme.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports.default = setTheme;
 
-var _litElement = require("lit-element");
+var _lit = require("lit");
 
 var _color = _interopRequireDefault(require("color"));
 
@@ -80,5 +80,5 @@ function setTheme(theme = {}) {
     codeKeywordColor: theme.codeKeywordColor || '#07a',
     codeOperatorColor: theme.codeOperatorColor || '#9a6e3a'
   };
-  return (0, _litElement.html)` <style>*,:after,:before{box-sizing:border-box}:host{--border-radius:2px;--layout:${this.layout || 'column'};--nav-item-padding:${this.navItemSpacing === 'relaxed' ? '10px' : this.navItemSpacing === 'compact' ? '5px 10px' : '7px 10px'};--resp-area-height:${this.responseAreaHeight};--font-size-small:${this.fontSize === 'default' ? '12px' : this.fontSize === 'large' ? '13px' : '14px'};--font-size-mono:${this.fontSize === 'default' ? '13px' : this.fontSize === 'large' ? '14px' : '15px'};--font-size-regular:${this.fontSize === 'default' ? '14px' : this.fontSize === 'large' ? '15px' : '16px'};--dialog-z-index:1000;--bg:${newTheme.bg1};--bg2:${newTheme.bg2};--bg3:${newTheme.bg3};--light-bg:${newTheme.lightBg};--fg:${newTheme.fg1};--fg2:${newTheme.fg2};--fg3:${newTheme.fg3};--light-fg:${newTheme.lightFg};--selection-bg:${newTheme.selectionBg};--selection-fg:${newTheme.selectionFg};--overlay-bg:${newTheme.overlayBg};--border-color:${newTheme.borderColor};--light-border-color:${newTheme.lightBorderColor};--code-border-color:${newTheme.codeBorderColor};--input-bg:${newTheme.inputBg};--placeholder-color:${newTheme.placeHolder};--hover-color:${newTheme.hoverColor};${defaultColors.join(';\n')} ${lightColors.join(';\n')} --header-bg:${newTheme.headerColor};--header-fg:${newTheme.headerColorInvert};--header-color-darker:${newTheme.headerColorDarker};--header-color-border:${newTheme.headerColorBorder};--nav-bg-color:${newTheme.navBgColor};--nav-text-color:${newTheme.navTextColor};--nav-hover-bg-color:${newTheme.navHoverBgColor};--nav-hover-text-color:${newTheme.navHoverTextColor};--code-bg:${newTheme.codeBg};--code-fg:${newTheme.codeFg};--inline-code-fg:${newTheme.inlineCodeFg};--code-property-color:${newTheme.codePropertyColor};--code-keyword-color:${newTheme.codeKeywordColor};--code-operator-color:${newTheme.codeOperatorColor};--primary-color:${theme.primaryColor};--secondary-color:${theme.secondaryColor};--primary-btn-text-color:${_colorUtils.default.color.selectTextColorFromBackground(theme.primaryColor)}}</style>`;
+  return (0, _lit.html)` <style>*,:after,:before{box-sizing:border-box}:host{--border-radius:2px;--layout:${this.layout || 'column'};--nav-item-padding:${this.navItemSpacing === 'relaxed' ? '10px' : this.navItemSpacing === 'compact' ? '5px 10px' : '7px 10px'};--resp-area-height:${this.responseAreaHeight};--font-size-small:${this.fontSize === 'default' ? '12px' : this.fontSize === 'large' ? '13px' : '14px'};--font-size-mono:${this.fontSize === 'default' ? '13px' : this.fontSize === 'large' ? '14px' : '15px'};--font-size-regular:${this.fontSize === 'default' ? '14px' : this.fontSize === 'large' ? '15px' : '16px'};--dialog-z-index:1000;--bg:${newTheme.bg1};--bg2:${newTheme.bg2};--bg3:${newTheme.bg3};--light-bg:${newTheme.lightBg};--fg:${newTheme.fg1};--fg2:${newTheme.fg2};--fg3:${newTheme.fg3};--light-fg:${newTheme.lightFg};--selection-bg:${newTheme.selectionBg};--selection-fg:${newTheme.selectionFg};--overlay-bg:${newTheme.overlayBg};--border-color:${newTheme.borderColor};--light-border-color:${newTheme.lightBorderColor};--code-border-color:${newTheme.codeBorderColor};--input-bg:${newTheme.inputBg};--placeholder-color:${newTheme.placeHolder};--hover-color:${newTheme.hoverColor};${defaultColors.join(';\n')} ${lightColors.join(';\n')} --header-bg:${newTheme.headerColor};--header-fg:${newTheme.headerColorInvert};--header-color-darker:${newTheme.headerColorDarker};--header-color-border:${newTheme.headerColorBorder};--nav-bg-color:${newTheme.navBgColor};--nav-text-color:${newTheme.navTextColor};--nav-hover-bg-color:${newTheme.navHoverBgColor};--nav-hover-text-color:${newTheme.navHoverTextColor};--code-bg:${newTheme.codeBg};--code-fg:${newTheme.codeFg};--inline-code-fg:${newTheme.inlineCodeFg};--code-property-color:${newTheme.codePropertyColor};--code-keyword-color:${newTheme.codeKeywordColor};--code-operator-color:${newTheme.codeOperatorColor};--primary-color:${theme.primaryColor};--secondary-color:${theme.secondaryColor};--primary-btn-text-color:${_colorUtils.default.color.selectTextColorFromBackground(theme.primaryColor)}}</style>`;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "openapi-explorer",
-  "version": "0.10.419",
+  "version": "0.10.421",
   "description": "OpenAPI Explorer - API viewer with dynamically generated components, documentation, and interaction console",
   "author": "Rhosys Developers <developers@rhosys.ch>",
   "type": "module",
@@ -52,8 +52,7 @@
     "color": "^4.2.3",
     "create-hash": "^1.2.0",
     "i18next": "^21.9.0",
-    "lit-element": "^3.2.2",
-    "lit-html": "^2.3.1",
+    "lit": "^2.3.1",
     "lodash.clonedeep": "^4.5.0",
     "lodash.merge": "^4.6.2",
     "marked": "^4.0.16",
@@ -102,7 +101,6 @@
     "eslint-plugin-vue": "^7.17.0",
     "eslint-webpack-plugin": "2.5.3",
     "file-loader": "^6.2.0",
-    "filemanager-webpack-plugin": "^4.0.0",
     "fs-extra": "^8.1.0",
     "glob": "^7.1.6",
     "html-webpack-plugin": "^5.3.1",