rapidoc 9.3.5 → 9.3.7

package/src/styles/schema-styles.js

@@ -3,6 +3,9 @@ import { css } from 'lit';
 export default css`
 
 *, *:before, *:after { box-sizing: border-box; }
+:host {
+  container-type: inline-size;
+}
 
 .tr {
   display: flex;
@@ -81,13 +84,13 @@ export default css`
   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(--purple)}
-.cons {color:var(--purple)}
-.recu {color:var(--brown)}
+.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(--purple) }
+.cons { color:var(--purple) }
+.recu { color:var(--brown) }
 .toolbar {
   display:flex;
   width:100%;
@@ -107,11 +110,11 @@ export default css`
 }
 .toolbar-item:first-of-type { margin:0 2px 0 0;}
 
-@media only screen and (min-width: 500px) {
+@container (min-width: 500px) {
   .key-descr {
     display: block;
   }
-  .expanded-descr .key-descr{
+  .expanded-descr .key-descr {
     display: block;
   }
 }

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

@@ -13,6 +13,7 @@ export default function searchByPropertiesModalTemplate() {
     >
       <span class="advanced-search-options">
         <input
+          id="input-advanced-search-dialog"
           style="width:100%; padding-right:20px;"
           type="text"
           part="textbox textbox-search-dialog"
@@ -52,7 +53,7 @@ export default function searchByPropertiesModalTemplate() {
         tabindex = '0'
         @click="${
           (e) => {
-            this.matchPaths = ''; // clear quick filter if applied
+            this.searchVal = ''; // clear quick filter if applied
             this.showAdvancedSearchDialog = false; // Hide Search Dialog
             this.requestUpdate();
             this.scrollToEventTarget(e, true);

package/src/templates/endpoint-template.js

@@ -6,7 +6,7 @@ import '~/components/api-response';
 import codeSamplesTemplate from '~/templates/code-samples-template';
 import callbackTemplate from '~/templates/callback-template';
 import { pathSecurityTemplate } from '~/templates/security-scheme-template';
-import { pathIsInSearch, rapidocApiKey } from '~/utils/common-utils';
+import { getMatchedPaths, rapidocApiKey } from '~/utils/common-utils';
 
 function toggleExpand(path) {
   if (path.expanded) {
@@ -91,7 +91,7 @@ function endpointBodyTemplate(path) {
   <div part="section-endpoint-body-${path.expanded ? 'expanded' : 'collapsed'}" class='endpoint-body ${path.method} ${path.deprecated ? 'deprecated' : ''}'>
     <div class="summary">
       ${path.summary
-        ? html`<div class="title" part="section-endpoint-body-title">${path.summary}<div>`
+        ? html`<div class="title" part="section-endpoint-body-title">${path.summary}</div>`
         : path.shortSummary !== path.description
           ? html`<div class="title" part="section-endpoint-body-title">${path.shortSummary}</div>`
           : ''
@@ -100,7 +100,9 @@ function endpointBodyTemplate(path) {
         ? html`
           <div style="display:flex; flex-wrap:wrap;font-size: var(--font-size-small);">
             ${path.xBadges.map((v) => (
-                html`<span part="endpoint-badge" style="margin:1px; margin-right:5px; padding:1px 8px; font-weight:bold; border-radius:12px;  background-color: var(--light-${v.color}, var(--input-bg)); color:var(--${v.color}); border:1px solid var(--${v.color})">${v.label}</span>`
+                v.color === 'none'
+                  ? ''
+                  : html`<span part="endpoint-badge" style="margin:1px; margin-right:5px; padding:1px 8px; font-weight:bold; border-radius:12px;  background-color: var(--light-${v.color}, var(--input-bg)); color:var(--${v.color}); border:1px solid var(--${v.color})">${v.label}</span>`
               ))
             }
           </div>
@@ -138,7 +140,7 @@ function endpointBodyTemplate(path) {
           .request_body = "${path.requestBody}"
           .api_keys = "${nonEmptyApiKeys}"
           .servers = "${path.servers}" 
-          server-url = "${path.servers && path.servers.length > 0 ? path.servers[0].url : this.selectedServer.computedUrl}" 
+          server-url = "${path.servers && path.servers.length > 0 ? path.servers[0].url : this.selectedServer?.computedUrl}" 
           active-schema-tab = "${this.defaultSchemaTab}"
           fill-request-fields-with-example = "${this.fillRequestFieldsWithExample}"
           allow-try = "${this.allowTry}"
@@ -182,11 +184,12 @@ function endpointBodyTemplate(path) {
   </div>`;
 }
 
-export default function endpointTemplate(showExpandCollapse = true, showTags = true, pathsExpanded = false) {
+export default function endpointTemplate(isMini = false, pathsExpanded = false) {
   if (!this.resolvedSpec) { return ''; }
   return html`
-    ${showExpandCollapse
-      ? html`
+    ${isMini
+      ? ''
+      : html`
         <div style="display:flex; justify-content:flex-end;"> 
           <span @click="${(e) => onExpandCollapseAll(e, 'expand-all')}" style="color:var(--primary-color); cursor:pointer;">
             Expand all
@@ -197,14 +200,28 @@ export default function endpointTemplate(showExpandCollapse = true, showTags = t
           </span> 
           &nbsp; sections
         </div>`
-      : ''
     }
     ${this.resolvedSpec.tags.map((tag) => html`
-      ${showTags
-        ? html` 
+      ${isMini
+        ? html`
+          <div class='section-tag-body'>
+          ${tag.paths.filter((path) => {
+            if (this.searchVal) {
+              return getMatchedPaths(this.searchVal, path, tag.name);
+            }
+            return true;
+            }).map((path) => html`
+            <section id='${path.elementId}' class='m-endpoint regular-font ${path.method} ${pathsExpanded || path.expanded ? 'expanded' : 'collapsed'}'>
+              ${endpointHeadTemplate.call(this, path, pathsExpanded)}      
+              ${pathsExpanded || path.expanded ? endpointBodyTemplate.call(this, path) : ''}
+            </section>`)
+          }
+          </div>
+        `
+        : html` 
           <div class='regular-font section-gap section-tag ${tag.expanded ? 'expanded' : 'collapsed'}'> 
             <div class='section-tag-header' @click="${() => { tag.expanded = !tag.expanded; this.requestUpdate(); }}">
-              <div id='${tag.elementId}' class="sub-title tag" style="color:var(--primary-color)">${tag.displayName}</div>
+              <div id='${tag.elementId}' class="sub-title tag" style="color:var(--primary-color)">${tag.displayName || tag.name}</div>
             </div>
             <div class='section-tag-body'>
               <slot name="${tag.elementId}"></slot>
@@ -212,8 +229,8 @@ export default function endpointTemplate(showExpandCollapse = true, showTags = t
                 ${unsafeHTML(marked(tag.description || ''))}
               </div>
               ${tag.paths.filter((v) => {
-                if (this.matchPaths) {
-                  return pathIsInSearch(this.matchPaths, v, this.matchType);
+                if (this.searchVal) {
+                  return getMatchedPaths(this.searchVal, v, tag.name);
                 }
                 return true;
                 }).map((path) => html`
@@ -223,20 +240,6 @@ export default function endpointTemplate(showExpandCollapse = true, showTags = t
                 </section>`)
               }
             </div>
-          </div>`
-        : html`
-          <div class='section-tag-body'>
-          ${tag.paths.filter((v) => {
-            if (this.matchPaths) {
-              return pathIsInSearch(this.matchPaths, v, this.matchType);
-            }
-            return true;
-            }).map((path) => html`
-            <section id='${path.elementId}' class='m-endpoint regular-font ${path.method} ${pathsExpanded || path.expanded ? 'expanded' : 'collapsed'}'>
-              ${endpointHeadTemplate.call(this, path, pathsExpanded)}      
-              ${pathsExpanded || path.expanded ? endpointBodyTemplate.call(this, path) : ''}
-            </section>`)
-          }
           </div>
         `
       }

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

@@ -80,7 +80,9 @@ export function expandedEndpointBodyTemplate(path, tagName = '', tagDescription
           ? html`
             <div style="display:flex; flex-wrap:wrap; margin-bottom: -24px; font-size: var(--font-size-small);">
               ${path.xBadges.map((v) => (
-                  html`<span style="margin:1px; margin-right:5px; padding:1px 8px; font-weight:bold; border-radius:12px;  background-color: var(--light-${v.color}, var(--input-bg)); color:var(--${v.color}); border:1px solid var(--${v.color})">${v.label}</span>`
+                v.color === 'none'
+                  ? ''
+                  : html`<span style="margin:1px; margin-right:5px; padding:1px 8px; font-weight:bold; border-radius:12px;  background-color: var(--light-${v.color}, var(--input-bg)); color:var(--${v.color}); border:1px solid var(--${v.color})">${v.label}</span>`
                 ))
               }
             </div>
@@ -126,7 +128,7 @@ export function expandedEndpointBodyTemplate(path, tagName = '', tagDescription
           .request_body = "${path.requestBody}"
           .api_keys = "${nonEmptyApiKeys}"
           .servers = "${path.servers}"
-          server-url = "${path.servers?.[0]?.url || this.selectedServer.computedUrl}"
+          server-url = "${path.servers?.[0]?.url || this.selectedServer?.computedUrl}"
           fill-request-fields-with-example = "${this.fillRequestFieldsWithExample}"
           allow-try = "${this.allowTry}"
           show-curl-before-try = "${this.showCurlBeforeTry}"
@@ -174,7 +176,7 @@ export default function expandedEndpointTemplate() {
   return html`
   ${this.resolvedSpec.tags.map((tag) => html`
     <section id="${tag.elementId}" part="section-tag" class="regular-font section-gap--read-mode observe-me" style="border-top:1px solid var(--primary-color);">
-      <div class="title tag" part="section-tag-title label-tag-title">${tag.displayName}</div>
+      <div class="title tag" part="section-tag-title label-tag-title">${tag.displayName || tag.name}</div>
       <slot name="${tag.elementId}"></slot>
       <div class="regular-font-size">
       ${

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

@@ -38,7 +38,7 @@ function defaultContentTemplate() {
 /* eslint-disable indent */
 function focusedTagBodyTemplate(tag) {
   return html`
-    <h1 id="${tag.elementId}">${tag.displayName}</h1>
+    <h1 id="${tag.elementId}">${tag.displayName || tag.name}</h1>
     ${this.onNavTagClick === 'show-description' && tag.description
       ? html`
         <div class="m-markdown">

package/src/templates/json-schema-viewer-template.js

@@ -5,7 +5,7 @@ import { marked } from 'marked';
 // Templates
 import overviewTemplate from '~/templates/overview-template';
 import headerTemplate from '~/templates/header-template';
-import { schemaInObjectNotation, generateExample } from '~/utils/schema-utils';
+import { schemaInObjectNotation, generateExample, standardizeExample } from '~/utils/schema-utils';
 import '~/components/json-tree';
 import '~/components/schema-tree';
 import SetTheme from '~/utils/theme';
@@ -49,7 +49,7 @@ function jsonSchemaBodyTemplate() {
     ${this.showInfo === 'true' ? overviewTemplate.call(this) : ''}
     <div style="font-size:var(--font-size-regular);">
     ${this.resolvedSpec.schemaAndExamples.map((jSchemaBody) => {
-      const examplesObj = generateExample(jSchemaBody.schema, 'json', jSchemaBody.examples, jSchemaBody.example, true, false, 'json', true);
+      const examplesObj = generateExample(jSchemaBody.schema, 'json', standardizeExample(jSchemaBody.examples), standardizeExample(jSchemaBody.example), true, false, 'json', true);
       jSchemaBody.selectedExample = examplesObj[0]?.exampleId;
       return html`
         <section id='${jSchemaBody.elementId}' class='json-schema-and-example regular-font' style="display:flex; flex-direction: column; border:1px solid var(--border-color); margin-bottom:32px; border-top: 5px solid var(--border-color)">
@@ -99,7 +99,7 @@ function jsonSchemaBodyTemplate() {
 
 // Json Schema Root Template
 export default function jsonSchemaViewerTemplate(isMini = false) {
-// export default function jsonSchemaViewerTemplate(isMini = false, showExpandCollapse = true, showTags = true, pathsExpanded = false) {
+// export default function jsonSchemaViewerTemplate(isMini = false, pathsExpanded = false) {
   if (!this.resolvedSpec) {
     return '';
   }

package/src/templates/main-body-template.js

@@ -13,7 +13,7 @@ import advancedSearchTemplate from '~/templates/advance-search-template';
 import SetTheme from '~/utils/theme';
 import { isValidHexColor } from '~/utils/color-utils';
 
-export default function mainBodyTemplate(isMini = false, showExpandCollapse = true, showTags = true, pathsExpanded = false) {
+export default function mainBodyTemplate(isMini = false, pathsExpanded = false) {
   if (!this.resolvedSpec) {
     return '';
   }
@@ -104,7 +104,7 @@ export default function mainBodyTemplate(isMini = false, showExpandCollapse = tr
                       </div>  
                       ${this.renderStyle === 'read'
                         ? expandedEndpointTemplate.call(this)
-                        : endpointTemplate.call(this, showExpandCollapse, showTags, pathsExpanded)
+                        : endpointTemplate.call(this, isMini, pathsExpanded)
                       }
                     `
                   }

package/src/templates/navbar-template.js

@@ -1,6 +1,6 @@
 import { html } from 'lit';
 import { marked } from 'marked';
-import { pathIsInSearch } from '~/utils/common-utils';
+import { getMatchedPaths } from '~/utils/common-utils';
 
 export function expandCollapseNavBarTag(navLinkEl, action = 'toggle') {
   const tagAndPathEl = navLinkEl?.closest('.nav-bar-tag-and-paths');
@@ -82,7 +82,7 @@ export default function navbarTemplate() {
                 >
                 <div style='margin: 6px 5px 0 -24px; font-size:var(--font-size-regular); cursor:pointer;'>&#x21a9;</div>
               </div>  
-              ${this.matchPaths
+              ${this.searchVal
                 ? html`
                   <button @click = '${this.onClearSearch}' class='m-btn thin-border' style='margin-left:5px; color:var(--nav-text-color); width:75px; padding:6px 8px;' part='btn btn-outline btn-clear-filter'>
                     CLEAR
@@ -91,7 +91,7 @@ export default function navbarTemplate() {
               }
             `
           }
-          ${this.allowAdvancedSearch === 'false' || this.matchPaths
+          ${this.allowAdvancedSearch === 'false' || this.searchVal
             ? ''
             : html`
               <button class='m-btn primary' part='btn btn-fill btn-search' style='margin-left:5px; padding:6px 8px; width:75px' @click='${this.onShowSearchModalClicked}'>
@@ -166,7 +166,7 @@ export default function navbarTemplate() {
 
       <!-- TAGS AND PATHS-->
       ${this.resolvedSpec.tags
-        .filter((tag) => tag.paths.filter((path) => pathIsInSearch(this.matchPaths, path, this.matchType)).length)
+        .filter((tag) => tag.paths.filter((path) => getMatchedPaths(this.searchVal, path, tag.name)).length)
         .map((tag) => html`
           <div class='nav-bar-tag-and-paths ${(this.renderStyle === 'read' ? 'expanded' : (tag.expanded ? 'expanded' : 'collapsed'))}' >
             ${tag.name === 'General ⦂'
@@ -181,7 +181,7 @@ export default function navbarTemplate() {
                   data-first-path-id='${tag.firstPathId}'
                   tabindex='0'
                 >
-                  <div style="pointer-events:none;">${tag.displayName}</div>
+                  <div style="pointer-events:none;">${tag.displayName || tag.name}</div>
                   <div class='nav-bar-tag-icon' tabindex='0' data-action='expand-collapse-tag'></div>
                 </div>
               `
@@ -208,8 +208,8 @@ export default function navbarTemplate() {
             <div class='nav-bar-paths-under-tag' style='max-height:${(tag.expanded || this.renderStyle === 'read') ? ((tag.paths?.length || 1) * 50) : 0}px;'>
               <!-- Paths in each tag (endpoints) -->
               ${tag.paths.filter((v) => {
-                if (this.matchPaths) {
-                  return pathIsInSearch(this.matchPaths, v, this.matchType);
+                if (this.searchVal) {
+                  return getMatchedPaths(this.searchVal, v, tag.name);
                 }
                 return true;
               }).map((p) => html`

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

@@ -134,7 +134,7 @@ async function fetchAccessToken(tokenUrl, clientId, clientSecret, redirectUrl, g
       }
       return false;
     }
-  } catch (err) {
+  } catch {
     if (respDisplayEl) {
       respDisplayEl.innerHTML = '<span style="color:var(--red)">Failed to get access token</span>';
     }
@@ -261,7 +261,7 @@ function oAuthFlowTemplate(flowName, clientId, clientSecret, securitySchemeId, a
   const pkceOnly = authFlow['x-pkce-only'] || false;
   const isUrlAbsolute = (url) => (url.indexOf('://') > 0 || url.indexOf('//') === 0);
   // Calculcate base URL
-  const url = new URL(this.selectedServer.computedUrl);
+  const url = new URL(this.selectedServer?.computedUrl);
   const baseUrl = url.origin;
 
   if (refreshUrl && !isUrlAbsolute(refreshUrl)) {
@@ -322,8 +322,8 @@ function oAuthFlowTemplate(flowName, clientId, clientSecret, securitySchemeId, a
           ${flowName === 'password'
             ? html`
               <div style="margin:5px 0">
-                <input type="text" value = "" placeholder="username" spellcheck="false" class="oauth2 ${flowName} ${securitySchemeId} api-key-user" part="textbox textbox-username">
-                <input type="password" value = "" placeholder="password" spellcheck="false" class="oauth2 ${flowName} ${securitySchemeId} api-key-password" style = "margin:0 5px;" part="textbox textbox-password">
+                <input type="text" value = "" placeholder="username" spellcheck="false" class="oauth2 ${flowName} ${securitySchemeId} api-key-user" part="textbox textbox-username" id="input-${securitySchemeId}-${flowName}-api-key-user">
+                <input type="password" value = "" placeholder="password" spellcheck="false" class="oauth2 ${flowName} ${securitySchemeId} api-key-password" style = "margin:0 5px;" part="textbox textbox-password" id="input-${securitySchemeId}-${flowName}-api-key-password">
               </div>`
             : ''
           }
@@ -343,6 +343,7 @@ function oAuthFlowTemplate(flowName, clientId, clientSecret, securitySchemeId, a
             ${flowName === 'authorizationCode' || flowName === 'clientCredentials' || flowName === 'password'
               ? html`
                 <input
+                  id="${securitySchemeId}-${flowName}-oauth-client-secret"
                   type="password" part="textbox textbox-auth-client-secret"
                   value = "${clientSecret || ''}" placeholder="client-secret" spellcheck="false"
                   class="oauth2 ${flowName} ${securitySchemeId}
@@ -439,7 +440,7 @@ export default function securitySchemeTemplate() {
                     <div style="max-height:28px;">
                       ${v.in !== 'cookie'
                         ? html`
-                          <input type = "text" value = "${v.value}" class="${v.type} ${v.securitySchemeId} api-key-input" placeholder = "api-token" spellcheck = "false">
+                          <input type = "text" value = "${v.value}" class="${v.type} ${v.securitySchemeId} api-key-input" placeholder = "api-token" spellcheck = "false" id = "${v.type}-${v.securitySchemeId}-api-key-input">
                           <button class="m-btn thin-border" style = "margin-left:5px;"
                             part = "btn btn-outline"
                             @click="${(e) => { onApiKeyChange.call(this, v.securitySchemeId, e); }}">
@@ -456,8 +457,8 @@ export default function securitySchemeTemplate() {
                       Send <code>Authorization</code> in <code>header</code> containing the word <code>Basic</code> followed by a space and a base64 encoded string of <code>username:password</code>.
                     </div>
                     <div>
-                      <input type="text" value = "${v.user}" placeholder="username" spellcheck="false" class="${v.type} ${v.securitySchemeId} api-key-user" style="width:100px">
-                      <input type="password" value = "${v.password}" placeholder="password" spellcheck="false" class="${v.type} ${v.securitySchemeId} api-key-password" style = "width:100px; margin:0 5px;">
+                      <input type="text" value = "${v.user}" placeholder="username" spellcheck="false" class="${v.type} ${v.securitySchemeId} api-key-user" style="width:100px" id = "input-${v.type}-${v.securitySchemeId}-api-key-user">
+                      <input type="password" value = "${v.password}" placeholder="password" spellcheck="false" class="${v.type} ${v.securitySchemeId} api-key-password" style = "width:100px; margin:0 5px;" id = "input-${v.type}-${v.securitySchemeId}-api-key-password">
                       <button class="m-btn thin-border"
                         @click="${(e) => { onApiKeyChange.call(this, v.securitySchemeId, e); }}"
                         part = "btn btn-outline"
@@ -600,6 +601,7 @@ export function pathSecurityTemplate(pathSecurity) {
         `)
         }
       </div>
+      </div>
     `;
   }
   return '';

package/src/utils/common-utils.js

@@ -49,17 +49,13 @@ export async function wait(ms) {
   });
 }
 
-export function componentIsInSearch(searchVal, component) {
+export function getMatchedComponents(searchVal, component) {
   return component.name.toLowerCase().includes(searchVal.toLowerCase());
 }
 
-export function pathIsInSearch(searchVal, path, matchType = 'includes') {
-  if (matchType === 'includes') {
-    const stringToSearch = `${path.method} ${path.path} ${path.summary || ''} ${path.description || ''} ${path.operationId || ''}`.toLowerCase();
-    return stringToSearch.includes(searchVal.toLowerCase());
-  }
-  const regex = new RegExp(searchVal, 'i');
-  return regex.test(`${path.method} ${path.path}`);
+export function getMatchedPaths(searchVal, path, tagName = '') {
+  const stringToSearch = `${path.method} ${path.path} ${path.summary || ''} ${path.description || ''} ${path.operationId || ''} ${tagName}`.toLowerCase();
+  return stringToSearch.includes(searchVal.toLowerCase());
 }
 
 export function schemaKeys(schemaProps, result = new Set()) {
@@ -90,7 +86,7 @@ export function advancedSearch(searchVal, allSpecTags, searchOptions = []) {
         stringToSearch = path.path;
       }
       if (searchOptions.includes('search-api-descr')) {
-        stringToSearch = `${stringToSearch} ${path.summary || path.description || ''}`;
+        stringToSearch = `${stringToSearch} ${(path.summary || '') + (path.description || '')}`;
       }
       if (searchOptions.includes('search-api-params')) {
         stringToSearch = `${stringToSearch} ${path.parameters?.map((v) => v.name).join(' ') || ''}`;

package/src/utils/schema-utils.js

@@ -120,18 +120,67 @@ export function getTypeInfo(schema) {
   return info;
 }
 
-export function nestExampleIfPresent(example) {
-  if (typeof example === 'boolean' || typeof example === 'number') {
-    return {
-      Example: { value: `${example}` },
-    };
-  }
-  if (example === '') {
-    return {
-      Example: { value: '' },
-    };
+/**
+ *
+ * @param {*} ex  if the value
+ *  - Is an Object with 'value' property  like
+ *      { 'value': 'example_val1', 'description': 'some description' }
+ *    Returns >>>
+ *      {
+ *        'Example': { 'value' : 'example_val1', 'description': 'some description' },
+ *      }
+ *  - Is an object where each key represents a valid example object (i,e has a value property)
+ *      {
+ *        'example1': { 'value' : 'example_val1', 'description': 'some description' },
+ *        'example2': { 'value' : 'example_val2', 'description': 'some other description' },
+ *        'invalid':  { 'description': 'invalid example object without any value property' }
+ *      }
+ *    Returns >>>
+ *      {
+ *        'example1': { 'value' : 'example_val1', 'description': 'some description' },
+ *        'example2': { 'value' : 'example_val2', 'description': 'some other description' }
+ *      }
+ *      if none of the keys represents an object with 'value' property then return undefined
+ *  - Is an array of premitive values
+ *      ['example_val1', 'example_val2']
+ *    Returns >>>
+ *      {
+ *         'Example1': {value:'value1'}
+ *         'Example2': {value:'value2'}
+ *      }
+ *  - Is a premitive value
+ *      'example_val1'
+ *    Returns >>>
+ *      {
+ *        'Example': { 'value': 'example_val1' }
+ *      }
+ *  - Is undefined
+ *    returns undefined
+ * @returns
+ */
+
+export function standardizeExample(ex) {
+  if (typeof ex === 'object' && !Array.isArray(ex)) {
+    if (ex.value !== undefined) {
+      // Case 1: Single object with 'value' property
+      return { Example: { ...ex } };
+    }
+    // Case 2: Object where each key is an object with a 'value' property
+    const filteredEntries = Object.entries(ex).filter(([_, obj]) => obj.value !== undefined); // eslint-disable-line
+    // If no valid entries found, return JSON.stringify of the input
+    if (filteredEntries.length === 0) {
+      return undefined;
+    }
+    return Object.fromEntries(filteredEntries);
+  } if (Array.isArray(ex)) {
+    // Case 3: Array of primitive values
+    return ex.reduce((acc, value, index) => {
+      acc[`Example${index + 1}`] = { value };
+      return acc;
+    }, {});
   }
-  return example ? { Example: { value: example } } : example;
+  // Case 4: Single primitive value
+  return ex ? { Example: { value: ex } } : undefined;
 }
 
 /**
@@ -268,7 +317,7 @@ export function getSampleValueByType(schemaObj) {
     if (schemaObj.pattern) {
       try {
         return new RandExp(schemaObj.pattern).gen();
-      } catch (error) {
+      } catch {
         return schemaObj.pattern;
       }
     }
@@ -297,7 +346,7 @@ export function getSampleValueByType(schemaObj) {
         case 'ipv6':
           return '2001:0db8:5b96:0000:0000:426f:8e17:642a';
         case 'uuid':
-          return [u.substr(0, 8), u.substr(8, 4), `4000-8${u.substr(13, 3)}`, u.substr(16, 12)].join('-');
+          return [u.substring(0, 8), u.substring(8, 12), `4000-8${u.substring(13, 16)}`, u.substring(16, 28)].join('-');
         case 'byte':
           return 'ZXhhbXBsZQ=='; // 'example' base64 encoded. See https://spec.openapis.org/oas/v3.0.0#data-types
         default:
@@ -857,7 +906,7 @@ export function schemaInObjectNotation(schema, obj, level = 0, suffix = '') {
 }
 
 /* Create Example object */
-export function generateExample(schema, mimeType, examples = '', example = '', includeReadOnly = true, includeWriteOnly = true, outputType = 'json', includeGeneratedExample = false) {
+export function generateExample(schema, mimeType, examples = {}, example = {}, includeReadOnly = true, includeWriteOnly = true, outputType = 'json', includeGeneratedExample = false) {
   const finalExamples = [];
   // First check if examples is provided
   if (examples) {
@@ -876,7 +925,7 @@ export function generateExample(schema, mimeType, examples = '', example = '', i
               const fixedJsonString = examples[eg].value;
               egContent = JSON.parse(fixedJsonString);
               egFormat = 'json';
-            } catch (err) {
+            } catch {
               egFormat = 'text';
               egContent = examples[eg].value;
             }
@@ -910,7 +959,7 @@ export function generateExample(schema, mimeType, examples = '', example = '', i
         try {
           egContent = JSON.parse(example);
           egFormat = 'json';
-        } catch (err) {
+        } catch {
           egFormat = 'text';
           egContent = example;
         }