Complete show => hide conversions.

CHANGELOG.md

@@ -4,6 +4,8 @@ This package follows standard semvar, `<major>.<minor>.<build>`. No breaking cha
 ## 2.0
 * `show-server-selection` has now be inverted to be `hide-server-selection` this brings it in line with how html boolean attributes are supposed to work. If you set this value to false previously, now you can hide the section using the new property.
 * `allow-authentication` has now be inverted to be `hide-authentication` this brings it in line with how html boolean attributes are supposed to work. If you set this value to false previously, now you can hide the section using the new property.
+* `fill-defaults` has now be inverted to be `hide-defaults` this brings it in line with how html boolean attributes are supposed to work. If you set this value to false previously, now you can hide the section using the new property.
+* `enable-console` has now be inverted to be `hide-console` this brings it in line with how html boolean attributes are supposed to work. If you set this value to false previously, now you can hide the section using the new property.
 * Fix `constraints` display for query parameters.
 
 ## 1.1 ##

docs/authress-example.vue

@@ -1,5 +1,5 @@
 <template>
-    <openapi-explorer :spec-url="openapiSpecificationUrl" :server-url="serverUrl" hide-server-selection fill-defaults="true"
+    <openapi-explorer :spec-url="openapiSpecificationUrl" :server-url="serverUrl" hide-server-selection
         nav-item-spacing="compact" :explorer-location="initialPath" primary-color="#3E6077" secondary-color="#FBAF0B"
         :bg-color="colors.light" :nav-bg-color="colors.dark" :text-color="colors.grey" :nav-hover-text-color="colors.light">
         <div slot="overview">

docs/documentation.md

@@ -9,13 +9,13 @@
 
 #### Disable configuration
 * `display-nulls` - [false] Force rendering of null types in the models. By default the models will assume `null` is equivalent to `not-required`.
-* `enable-console` - [true] Allow for disabling executing the API from the specification. Removes the `execute button` when disabled.
-* `fill-defaults` - [true] Fills the request data with the default data.
+* `hide-defaults` - [false] Prevents filling the request data with the default data.
 * `collapse` - [false] Set the operations and components collapsed by default
 * `table` - [false] Converts the body displays from object json to a table for schemas
 * `schema-expand-level` - [9999] Expands the display of schemas and models to this depth. Set to `1` to display only the first level properties.
 
 ### Hide/Show Sections
+* `hide-console` - Disable executing the API from the specification. Removes the `execute button` when disabled.
 * `hide-authentication` - Hide the authentication section
 * `hide-server-selection` - Hide server selection section
 * `hide-components` - Hide the OpenAPI specification components from being displayed

site/index.html

@@ -85,7 +85,7 @@
         </form>
       </div>
     </nav>
-    <openapi-explorer spec-url="https://api.authress.io/v1" collapse table fill-defaults="true" schema-description-expanded="true" nav-item-spacing="compact" show-components="true" bg-color="#FFFFFF" header-bg-color="#DEE2E6" nav-bg-color="#1D2F3B" text-color="#465865" nav-hover-text-color="#FFFFFF"
+    <openapi-explorer spec-url="https://api.authress.io/v1" collapse table schema-description-expanded="true" nav-item-spacing="compact" show-components="true" bg-color="#FFFFFF" header-bg-color="#DEE2E6" nav-bg-color="#1D2F3B" text-color="#465865" nav-hover-text-color="#FFFFFF"
     primary-color="#1D2F3B" secondary-color="#FBAF0B">
       <slot name="overview">
         <div class="alert alert-primary d-flex align-items-center m-4" role="alert">

src/openapi-explorer.js

@@ -62,7 +62,12 @@ export default class OpenApiExplorer extends LitElement {
 
       defaultSchemaTab: { type: String, attribute: 'default-schema-tab' },
       responseAreaHeight: { type: String, attribute: 'response-area-height' },
-      fillRequestWithDefault: { type: String, attribute: 'fill-defaults' },
+      hideDefaults: {
+        type: Boolean, attribute: 'hide-defaults',
+        converter(value) {
+          return value !== 'false' && value !== false;
+        }
+      },
 
       // Schema Styles
       displaySchemaAsTable: {
@@ -77,14 +82,24 @@ export default class OpenApiExplorer extends LitElement {
       serverUrl: { type: String, attribute: 'server-url' },
 
       // Hide/Show Sections & Enable Disable actions
-      showInfo: { type: String, attribute: 'show-info' },
+      hideInfo: {
+        type: Boolean, attribute: 'hide-info',
+        converter(value) {
+          return value !== 'false' && value !== false;
+        }
+      },
       hideAuthentication: {
         type: Boolean, attribute: 'hide-authentication',
         converter(value) {
           return value !== 'false' && value !== false;
         }
       },
-      allowTry: { type: String, attribute: 'enable-console' },
+      hideExecution: {
+        type: Boolean, attribute: 'hide-console',
+        converter(value) {
+          return value !== 'false' && value !== false;
+        }
+      },
       includeNulls: {
         type: Boolean, attribute: 'display-nulls',
         converter(value) {
@@ -392,6 +407,7 @@ export default class OpenApiExplorer extends LitElement {
     window.addEventListener('resize', this.handleResize);
     this.loading = true;
     initI18n();
+
     const parent = this.parentElement;
     if (parent) {
       if (parent.offsetWidth === 0 && parent.style.width === '') {
@@ -417,17 +433,12 @@ export default class OpenApiExplorer extends LitElement {
     if (!this.schemaExpandLevel || this.schemaExpandLevel < 1) { this.schemaExpandLevel = 99999; }
     this.schemaHideReadOnly = ['post', 'put', 'patch', 'query'].join(',');
     this.schemaHideWriteOnly = true;
-    if (!this.fillRequestWithDefault || !'true, false,'.includes(`${this.fillRequestWithDefault},`)) { this.fillRequestWithDefault = 'true'; }
     if (!this.responseAreaHeight) {
       this.responseAreaHeight = '300px';
     }
 
-    if (!this.allowTry || !'true, false,'.includes(`${this.allowTry},`)) { this.allowTry = 'true'; }
-
     if (!this.navItemSpacing || !'compact, relaxed, default,'.includes(`${this.navItemSpacing},`)) { this.navItemSpacing = 'default'; }
 
-    if (!this.showInfo || !'true, false,'.includes(`${this.showInfo},`)) { this.showInfo = 'true'; }
-
     if (!this.fetchCredentials || !'omit, same-origin, include,'.includes(`${this.fetchCredentials},`)) { this.fetchCredentials = ''; }
 
     if (!this.showAdvancedSearchDialog) { this.showAdvancedSearchDialog = false; }
@@ -609,7 +620,7 @@ export default class OpenApiExplorer extends LitElement {
     this.intersectionObserver.disconnect();
 
     if (this.renderStyle === 'focused') {
-      const defaultElementId = this.showInfo ? 'overview' : this.resolvedSpec.tags && this.resolvedSpec.tags[0] && this.resolvedSpec.tags[0].paths[0];
+      const defaultElementId = !this.hideInfo ? 'overview' : this.resolvedSpec.tags && this.resolvedSpec.tags[0] && this.resolvedSpec.tags[0].paths[0];
       this.scrollTo(this.explorerLocation || defaultElementId);
     }
 
@@ -647,7 +658,7 @@ export default class OpenApiExplorer extends LitElement {
   }
 
   isValidPathId(id) {
-    if (id === 'overview' && this.showInfo) {
+    if (id === 'overview' && !this.hideInfo) {
       return true;
     }
     if (id === 'servers' && !this.hideServerSelection) {

src/templates/callback-template.js

@@ -27,7 +27,7 @@ export default function callbackTemplate(callbacks) {
                       path = "${pathObj[0] || ''}" 
                       .parameters = "${method[1] && method[1].parameters || ''}" 
                       .request_body = "${method[1] && method[1].requestBody || ''}"
-                      fill-defaults = "${this.fillRequestWithDefault}"
+                      fill-defaults = "${!this.hideDefaults}"
                       display-nulls="${!!this.includeNulls}"
                       enable-console = "false"
                       render-style="${this.renderStyle}" 

src/templates/endpoint-template.js

@@ -94,9 +94,9 @@ function endpointBodyTemplate(path) {
           .servers = "${path.servers}"
           server-url = "${path.servers?.[0]?.url || this.selectedServer?.computedUrl}" 
           active-schema-tab = "${this.defaultSchemaTab}"
-          fill-defaults = "${this.fillRequestWithDefault}"
+          fill-defaults = "${!this.hideDefaults}"
           display-nulls="${!!this.includeNulls}"
-          enable-console = "${this.allowTry}"
+          enable-console = "${!this.hideExecution}"
           accept = "${accept}"
           render-style="${this.renderStyle}" 
           schema-style="${this.displaySchemaAsTable ? 'table' : 'tree'}"

src/templates/expanded-endpoint-template.js

@@ -57,9 +57,9 @@ export function expandedEndpointBodyTemplate(path, tagName = '') {
         .api_keys = "${nonEmptyApiKeys}"
         .servers = "${path.servers}"
         server-url = "${path.servers?.[0]?.url || this.selectedServer?.computedUrl}"
-        fill-defaults = "${this.fillRequestWithDefault}"
+        fill-defaults = "${!this.hideDefaults}"
         display-nulls="${!!this.includeNulls}"
-        enable-console = "${this.allowTry}"
+        enable-console = "${!this.hideExecution}"
         accept = "${accept}"
         render-style="${this.renderStyle}" 
         schema-style = "${this.displaySchemaAsTable ? 'table' : 'tree'}"

src/templates/focused-endpoint-template.js

@@ -16,7 +16,7 @@ function wrapFocusedTemplate(templateToWrap) {
 
 function defaultContentTemplate() {
   // In focused mode default content is overview or first path
-  if (this.showInfo === 'true') {
+  if (!this.hideInfo) {
     return overviewTemplate.call(this);
   }
   const selectedTagObj = this.resolvedSpec.tags[0];
@@ -35,7 +35,7 @@ export default function focusedEndpointTemplate() {
   let selectedTagObj = null;
   let focusedTemplate;
   let i = 0;
-  if (focusElId.startsWith('overview') && this.showInfo === 'true') {
+  if (focusElId.startsWith('overview') && !this.hideInfo) {
     focusedTemplate = overviewTemplate.call(this);
   } else if (focusElId === 'auth' && !this.hideAuthentication) {
     focusedTemplate = securitySchemeTemplate.call(this);

src/templates/mainBodyTemplate.js

@@ -51,7 +51,7 @@ export default function mainBodyTemplate() {
                 ${this.renderStyle === 'focused'
                   ? html`${focusedEndpointTemplate.call(this)}`
                   : html`
-                    ${this.showInfo === 'true' ? overviewTemplate.call(this) : ''}
+                    ${!this.hideInfo ? overviewTemplate.call(this) : ''}
                     ${!this.hideServerSelection ? serverTemplate.call(this) : ''}
                     ${!this.hideAuthentication ? securitySchemeTemplate.call(this) : ''}
                     <section id='section'

src/templates/navbar-template.js

@@ -53,7 +53,7 @@ export default function navbarTemplate() {
       `
     }
     ${html`<nav class='nav-scroll' part="navbar-scroll">
-      ${(this.showInfo === 'false' || !this.resolvedSpec.info)
+      ${(this.hideInfo || !this.resolvedSpec.info)
         ? ''
         : html`<div class='nav-bar-info'  id='link-overview' data-content-id='overview' @click = '${(e) => this.scrollToEventTarget(e, false)}'>
           ${this.resolvedSpec.info.title || getI18nText('menu.overview')}