openapi-explorer 2.2.761 → 2.2.768
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -226,17 +226,17 @@ export default class ApiRequest extends LitElement {
|
|
226
226
|
}, generatedParamSchema) => {
|
227
227
|
var _this$storedParamValu, _generatedParamSchema;
|
228
228
|
const displayAllowedValuesHints = (generatedParamSchema.type === 'object' || generatedParamSchema.type === 'array') && generatedParamSchema.allowedValues;
|
229
|
-
return html` <tr> <td colspan="1" style="width:160px;min-width:50px;vertical-align:top"> <div class="param-name ${generatedParamSchema.deprecated ? 'deprecated' : ''}" style="margin-top:1rem" id="request-${paramName}-label"> ${paramName}${!generatedParamSchema.deprecated && paramRequired ? html`<span style="color:var(--red)">*</span>` : ''} </div> <div class="param-type" style="margin-bottom:1rem"> ${generatedParamSchema.type === 'array' ? `${generatedParamSchema.arrayType}` : `${generatedParamSchema.format ? generatedParamSchema.format : generatedParamSchema.type}`}${!generatedParamSchema.deprecated && paramRequired ? html`<span style="opacity:0">*</span>` : ''} </div> </td> <td colspan="2" style="min-width:160px;vertical-align:top"> ${this.allowTry === 'true' ? generatedParamSchema.type === 'array' && html` <div style="margin-top:1rem;margin-bottom:1rem"> <tag-input class="request-param" autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" style="width:100%" data-ptype="${paramLocation}" data-pname="${paramName}" data-
|
229
|
+
return html` <tr> <td colspan="1" style="width:160px;min-width:50px;vertical-align:top"> <div class="param-name ${generatedParamSchema.deprecated ? 'deprecated' : ''}" style="margin-top:1rem" id="request-${paramName}-label"> ${paramName}${!generatedParamSchema.deprecated && paramRequired ? html`<span style="color:var(--red)">*</span>` : ''} </div> <div class="param-type" style="margin-bottom:1rem"> ${generatedParamSchema.type === 'array' ? `${generatedParamSchema.arrayType}` : `${generatedParamSchema.format ? generatedParamSchema.format : generatedParamSchema.type}`}${!generatedParamSchema.deprecated && paramRequired ? html`<span style="opacity:0">*</span>` : ''} </div> </td> <td colspan="2" style="min-width:160px;vertical-align:top"> ${this.allowTry === 'true' ? generatedParamSchema.type === 'array' && html` <div style="margin-top:1rem;margin-bottom:1rem"> <tag-input class="request-param" autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" style="width:100%" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" data-param-serialize-style="${paramStyle}" data-param-serialize-explode="${paramExplode}" data-array="true" placeholder="add-multiple ↩" @change="${e => {
|
230
230
|
this.storedParamValues[paramName] = e.detail.value;
|
231
231
|
this.computeCurlSyntax();
|
232
232
|
}}" .value="${(_this$storedParamValu = this.storedParamValues[paramName]) !== null && _this$storedParamValu !== void 0 ? _this$storedParamValu : this.fillRequestWithDefault === 'true' && Array.isArray(defaultVal) ? defaultVal : defaultVal.split(',')}"></tag-input> </div>` || generatedParamSchema.type === 'object' && html` <textarea autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" @input="${() => {
|
233
233
|
this.computeCurlSyntax();
|
234
|
-
}}" class="textarea small request-param" part="textarea small textarea-param" rows="3" data-ptype="${paramLocation}" data-pname="${paramName}" data-
|
234
|
+
}}" class="textarea small request-param" part="textarea small textarea-param" rows="3" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" data-param-serialize-style="${paramStyle}" data-param-serialize-explode="${paramExplode}" spellcheck="false" placeholder="${generatedParamSchema.example || defaultVal || ''}" style="width:100%;margin-top:1rem;margin-bottom:1rem" .value="${this.fillRequestWithDefault === 'true' ? defaultVal : ''}"></textarea>` || generatedParamSchema.allowedValues && html` <select aria-label="mime type" style="width:100%;margin-top:1rem;margin-bottom:1rem" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" .value="${this.fillRequestWithDefault === 'true' ? defaultVal : !generatedParamSchema.allowedValues.length || generatedParamSchema.allowedValues.some(v => v === null) ? null : generatedParamSchema.allowedValues[0]}" @change="${e => {
|
235
235
|
this.storedParamValues[paramName] = e;
|
236
236
|
this.computeCurlSyntax();
|
237
237
|
}}"> ${generatedParamSchema.allowedValues.map(allowedValue => html` <option value="${allowedValue}" ?selected="${allowedValue === this.storedParamValues[paramName]}"> ${allowedValue === null ? '-' : allowedValue} </option>`)} </select>` || html` <input type="${generatedParamSchema.format === 'password' ? 'password' : 'text'}" spellcheck="false" style="width:100%;margin-top:1rem;margin-bottom:1rem" autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" @input="${() => {
|
238
238
|
this.computeCurlSyntax();
|
239
|
-
}}" placeholder="${generatedParamSchema.example || defaultVal || ''}" class="request-param" part="textbox textbox-param" data-ptype="${paramLocation}" data-pname="${paramName}" data-
|
239
|
+
}}" placeholder="${generatedParamSchema.example || defaultVal || ''}" class="request-param" part="textbox textbox-param" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" data-array="false" @keyup="${this.requestParamFunction}" .value="${this.fillRequestWithDefault === 'true' ? defaultVal : ''}">` : ''} ${this.exampleListTemplate.call(this, param, generatedParamSchema.type)} </td> ${this.renderStyle === 'focused' ? html` <td colspan="2" style="vertical-align:top"> ${paramDescription ? html` <div class="param-description" style="margin-top:1rem"> ${unsafeHTML(toMarkdown(paramDescription))} </div>` : ''} ${generatedParamSchema.constraints.length || displayAllowedValuesHints || generatedParamSchema.pattern ? html` <div class="param-constraint" style="margin-top:1rem"> ${generatedParamSchema.constraints.length ? html`<span style="font-weight:700">Constraints: </span>${generatedParamSchema.constraints.join(', ')}<br>` : ''} ${generatedParamSchema.pattern ? html` <div class="tooltip tooltip-replace" style="cursor:pointer;max-width:100%;display:flex"> <div style="white-space:nowrap;font-weight:700;margin-right:2px">Pattern: </div> <div style="white-space:nowrap;text-overflow:ellipsis;max-width:100%;overflow:hidden">${generatedParamSchema.pattern}</div> <br> <div class="tooltip-text" style="position:absolute;display:block">${generatedParamSchema.pattern}</div> </div> ` : ''} ${(_generatedParamSchema = generatedParamSchema.allowedValues) === null || _generatedParamSchema === void 0 ? void 0 : _generatedParamSchema.map((v, i) => html` ${i > 0 ? '|' : html`<span style="font-weight:700">Allowed: </span>`} ${html` <a part="anchor anchor-param-constraint" class="${this.allowTry === 'true' ? '' : 'inactive-link'}" data-type="${generatedParamSchema.type === 'array' ? 'array' : 'string'}" data-enum="${v === null || v === void 0 ? void 0 : v.trim()}" @click="${e => {
|
240
240
|
const inputEl = e.target.closest('table').querySelector(`[data-pname="${paramName}"]`);
|
241
241
|
if (inputEl) {
|
242
242
|
inputEl.value = e.target.dataset.type === 'array' ? [e.target.dataset.enum] : e.target.dataset.enum;
|
@@ -391,9 +391,9 @@ export default class ApiRequest extends LitElement {
|
|
391
391
|
this.selectedRequestBodyExample = reqBodyExamples.length > 0 ? reqBodyExamples[0].exampleId : '';
|
392
392
|
}
|
393
393
|
const displayedBodyExample = reqBodyExamples.find(v => v.exampleId === this.selectedRequestBodyExample) || reqBodyExamples[0];
|
394
|
-
reqBodyDefaultHtml = html` <div class="example-panel pad-top-8"> ${reqBodyExamples.length === 1 ? '' : html` <select aria-label="request body example" style="min-width:100px;max-width:100%;margin-bottom:-1px" @change="${e => this.onSelectExample(e)}"> ${reqBodyExamples.map(v => html`<option value="${v.exampleId}" ?selected="${v.exampleId === this.selectedRequestBodyExample}"> ${v.exampleSummary.length > 80 ? v.exampleId : v.exampleSummary ? v.exampleSummary : v.exampleId} </option>`)} </select>`} ${displayedBodyExample ? html` <div class="example"
|
394
|
+
reqBodyDefaultHtml = html` <div class="example-panel pad-top-8"> ${reqBodyExamples.length === 1 ? '' : html` <select aria-label="request body example" style="min-width:100px;max-width:100%;margin-bottom:-1px" @change="${e => this.onSelectExample(e)}"> ${reqBodyExamples.map(v => html`<option value="${v.exampleId}" ?selected="${v.exampleId === this.selectedRequestBodyExample}"> ${v.exampleSummary.length > 80 ? v.exampleId : v.exampleSummary ? v.exampleSummary : v.exampleId} </option>`)} </select>`} ${displayedBodyExample ? html` <div class="example"> ${displayedBodyExample.exampleSummary && displayedBodyExample.exampleSummary.length > 80 ? html`<div style="padding:4px 0"> ${displayedBodyExample.exampleSummary} </div>` : ''} ${displayedBodyExample.exampleDescription ? html`<div class="m-markdown-small" style="padding:4px 0"> ${unsafeHTML(toMarkdown(displayedBodyExample.exampleDescription || ''))} </div>` : ''} <slot name="${this.elementId}--request-body"> <textarea @input="${() => {
|
395
395
|
this.computeCurlSyntax();
|
396
|
-
}}" class="textarea request-body-param-user-input" part="textarea textarea-param" aria-label="${getI18nText('operations.request-body')}" spellcheck="false" data-ptype="${reqBody.mimeType}"
|
396
|
+
}}" class="textarea request-body-param-user-input" part="textarea textarea-param" aria-label="${getI18nText('operations.request-body')}" spellcheck="false" data-ptype="${reqBody.mimeType}" style="width:100%;resize:vertical" .value="${this.fillRequestWithDefault === 'true' ? displayedBodyExample.exampleFormat === 'text' ? displayedBodyExample.exampleValue : JSON.stringify(displayedBodyExample.exampleValue, null, 8) : ''}"></textarea> </slot> </div>` : ''} ${reqBodyExamples.map(bodyExample => html` <textarea class="textarea is-hidden request-body-param ${reqBody.mimeType.substring(reqBody.mimeType.indexOf('/') + 1)}" spellcheck="false" data-ptype="${reqBody.mimeType}" data-example="${bodyExample.exampleId}" style="width:100%;resize:vertical;display:none" .value="${bodyExample.exampleFormat === 'text' ? bodyExample.exampleValue : JSON.stringify(bodyExample.exampleValue, null, 8)}"></textarea> `)} </div> `;
|
397
397
|
} else if (this.selectedRequestBodyType.includes('form-urlencoded') || this.selectedRequestBodyType.includes('form-data')) {
|
398
398
|
bodyTabNameUseBody = false;
|
399
399
|
const schemaAsObj = schemaInObjectNotation(reqBody.schema, {
|
@@ -465,7 +465,7 @@ export default class ApiRequest extends LitElement {
|
|
465
465
|
|
466
466
|
onClearRequestData(e) {
|
467
467
|
const requestPanelEl = e.target.closest('.request-panel');
|
468
|
-
const requestPanelInputEls = [...requestPanelEl.querySelectorAll('input, tag-input, textarea:not(.is-hidden)')];
|
468
|
+
const requestPanelInputEls = [...requestPanelEl.querySelectorAll('input, select, tag-input, textarea:not(.is-hidden)')];
|
469
469
|
requestPanelInputEls.forEach(el => {
|
470
470
|
el.value = '';
|
471
471
|
});
|
@@ -493,6 +493,13 @@ export default class ApiRequest extends LitElement {
|
|
493
493
|
error.code = 'MissingPathParameter';
|
494
494
|
throw error;
|
495
495
|
}
|
496
|
+
const requiredPanelEl = [...requestPanelEl.querySelectorAll("[data-required='true']")];
|
497
|
+
const missingRequiredParameterValue = requiredPanelEl.find(el => !el.value);
|
498
|
+
if (missingRequiredParameterValue) {
|
499
|
+
const error = Error(`Required parameter found, but no valid value was set for the parameter: '${missingRequiredParameterValue.dataset.pname}'.`);
|
500
|
+
error.code = 'MissingRequiredParameter';
|
501
|
+
throw error;
|
502
|
+
}
|
496
503
|
}
|
497
504
|
recomputeFetchOptions() {
|
498
505
|
const requestPanelEl = this.closest('.request-panel');
|
@@ -647,12 +654,6 @@ export default class ApiRequest extends LitElement {
|
|
647
654
|
}
|
648
655
|
});
|
649
656
|
fetchOptions.body = formDataParams;
|
650
|
-
} else if (mediaFileRegex.test(requestBodyType) || textFileRegex.test(requestBodyType)) {
|
651
|
-
const bodyParamFileEl = requestPanelEl.querySelector('.request-body-param-file');
|
652
|
-
if (bodyParamFileEl && bodyParamFileEl.files[0]) {
|
653
|
-
fetchOptions.body = bodyParamFileEl.files[0];
|
654
|
-
curlData = ` \\\n --data-binary @${bodyParamFileEl.files[0].name}`;
|
655
|
-
}
|
656
657
|
} else if (requestBodyType.includes('json') || requestBodyType.includes('xml') || requestBodyType.includes('text')) {
|
657
658
|
const exampleTextAreaEl = requestPanelEl.querySelector('.request-body-param-user-input');
|
658
659
|
if (exampleTextAreaEl && exampleTextAreaEl.value) {
|
@@ -670,6 +671,12 @@ export default class ApiRequest extends LitElement {
|
|
670
671
|
curlData = ` \\\n -d '${fetchOptions.body.replace(/'/g, '\'"\'"\'')}'`;
|
671
672
|
}
|
672
673
|
}
|
674
|
+
} else if (mediaFileRegex.test(requestBodyType) || textFileRegex.test(requestBodyType)) {
|
675
|
+
const bodyParamFileEl = requestPanelEl.querySelector('.request-body-param-file');
|
676
|
+
if (bodyParamFileEl && bodyParamFileEl.files[0]) {
|
677
|
+
fetchOptions.body = bodyParamFileEl.files[0];
|
678
|
+
curlData = ` \\\n --data-binary @${bodyParamFileEl.files[0].name}`;
|
679
|
+
}
|
673
680
|
}
|
674
681
|
// Common for all request-body
|
675
682
|
if (!requestBodyType.includes('form-data')) {
|
@@ -135,7 +135,6 @@ function inputFieldKeyLabel(isOption, keyLabel, keyDescription, dataType, deprec
|
|
135
135
|
// data-array = "false"
|
136
136
|
// data-ptype = "form-input"
|
137
137
|
// data-pname = "${keyLabel}"
|
138
|
-
// data-default = "${defaultValue || ''}"
|
139
138
|
// spellcheck = "false"
|
140
139
|
// .value="${options.fillRequestWithDefault === 'true' ? defaultValue : ''}"
|
141
140
|
// ></textarea>
|
@@ -156,13 +155,13 @@ function getArrayFormField(keyLabel, example, defaultValue, format, rowGenerator
|
|
156
155
|
return html`<td style="min-width:100px"> <tag-input @change="${e => {
|
157
156
|
rowGenerator(e);
|
158
157
|
this.computeCurlSyntax();
|
159
|
-
}}" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-
|
158
|
+
}}" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-array="true" placeholder="${(Array.isArray(example) ? example[0] : example) || defaultValue || 'add-multiple ↩'}" .value="${defaultValue || ''}"></tag-input> </td>`;
|
160
159
|
}
|
161
160
|
function getPrimitiveFormField(keyLabel, example, defaultValue, format, options, rowGenerator) {
|
162
161
|
return html`<td style="min-width:100px"> <input placeholder="${example || defaultValue || ''}" @input="${e => {
|
163
162
|
rowGenerator(e);
|
164
163
|
this.computeCurlSyntax();
|
165
|
-
}}" .value="${options.fillRequestWithDefault && defaultValue || ''}" spellcheck="false" type="${format === 'binary' ? 'file' : format === 'password' ? 'password' : 'text'}" part="textbox textbox-param" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-
|
164
|
+
}}" .value="${options.fillRequestWithDefault && defaultValue || ''}" spellcheck="false" type="${format === 'binary' ? 'file' : format === 'password' ? 'password' : 'text'}" part="textbox textbox-param" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-array="false"> </td>`;
|
166
165
|
}
|
167
166
|
export default function getRequestFormTable(data, mimeType) {
|
168
167
|
const options = {
|
@@ -231,17 +231,17 @@ class ApiRequest extends _lit.LitElement {
|
|
231
231
|
}, generatedParamSchema) => {
|
232
232
|
var _this$storedParamValu, _generatedParamSchema;
|
233
233
|
const displayAllowedValuesHints = (generatedParamSchema.type === 'object' || generatedParamSchema.type === 'array') && generatedParamSchema.allowedValues;
|
234
|
-
return (0, _lit.html)` <tr> <td colspan="1" style="width:160px;min-width:50px;vertical-align:top"> <div class="param-name ${generatedParamSchema.deprecated ? 'deprecated' : ''}" style="margin-top:1rem" id="request-${paramName}-label"> ${paramName}${!generatedParamSchema.deprecated && paramRequired ? (0, _lit.html)`<span style="color:var(--red)">*</span>` : ''} </div> <div class="param-type" style="margin-bottom:1rem"> ${generatedParamSchema.type === 'array' ? `${generatedParamSchema.arrayType}` : `${generatedParamSchema.format ? generatedParamSchema.format : generatedParamSchema.type}`}${!generatedParamSchema.deprecated && paramRequired ? (0, _lit.html)`<span style="opacity:0">*</span>` : ''} </div> </td> <td colspan="2" style="min-width:160px;vertical-align:top"> ${this.allowTry === 'true' ? generatedParamSchema.type === 'array' && (0, _lit.html)` <div style="margin-top:1rem;margin-bottom:1rem"> <tag-input class="request-param" autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" style="width:100%" data-ptype="${paramLocation}" data-pname="${paramName}" data-
|
234
|
+
return (0, _lit.html)` <tr> <td colspan="1" style="width:160px;min-width:50px;vertical-align:top"> <div class="param-name ${generatedParamSchema.deprecated ? 'deprecated' : ''}" style="margin-top:1rem" id="request-${paramName}-label"> ${paramName}${!generatedParamSchema.deprecated && paramRequired ? (0, _lit.html)`<span style="color:var(--red)">*</span>` : ''} </div> <div class="param-type" style="margin-bottom:1rem"> ${generatedParamSchema.type === 'array' ? `${generatedParamSchema.arrayType}` : `${generatedParamSchema.format ? generatedParamSchema.format : generatedParamSchema.type}`}${!generatedParamSchema.deprecated && paramRequired ? (0, _lit.html)`<span style="opacity:0">*</span>` : ''} </div> </td> <td colspan="2" style="min-width:160px;vertical-align:top"> ${this.allowTry === 'true' ? generatedParamSchema.type === 'array' && (0, _lit.html)` <div style="margin-top:1rem;margin-bottom:1rem"> <tag-input class="request-param" autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" style="width:100%" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" data-param-serialize-style="${paramStyle}" data-param-serialize-explode="${paramExplode}" data-array="true" placeholder="add-multiple ↩" @change="${e => {
|
235
235
|
this.storedParamValues[paramName] = e.detail.value;
|
236
236
|
this.computeCurlSyntax();
|
237
237
|
}}" .value="${(_this$storedParamValu = this.storedParamValues[paramName]) !== null && _this$storedParamValu !== void 0 ? _this$storedParamValu : this.fillRequestWithDefault === 'true' && Array.isArray(defaultVal) ? defaultVal : defaultVal.split(',')}"></tag-input> </div>` || generatedParamSchema.type === 'object' && (0, _lit.html)` <textarea autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" @input="${() => {
|
238
238
|
this.computeCurlSyntax();
|
239
|
-
}}" class="textarea small request-param" part="textarea small textarea-param" rows="3" data-ptype="${paramLocation}" data-pname="${paramName}" data-
|
239
|
+
}}" class="textarea small request-param" part="textarea small textarea-param" rows="3" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" data-param-serialize-style="${paramStyle}" data-param-serialize-explode="${paramExplode}" spellcheck="false" placeholder="${generatedParamSchema.example || defaultVal || ''}" style="width:100%;margin-top:1rem;margin-bottom:1rem" .value="${this.fillRequestWithDefault === 'true' ? defaultVal : ''}"></textarea>` || generatedParamSchema.allowedValues && (0, _lit.html)` <select aria-label="mime type" style="width:100%;margin-top:1rem;margin-bottom:1rem" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" .value="${this.fillRequestWithDefault === 'true' ? defaultVal : !generatedParamSchema.allowedValues.length || generatedParamSchema.allowedValues.some(v => v === null) ? null : generatedParamSchema.allowedValues[0]}" @change="${e => {
|
240
240
|
this.storedParamValues[paramName] = e;
|
241
241
|
this.computeCurlSyntax();
|
242
242
|
}}"> ${generatedParamSchema.allowedValues.map(allowedValue => (0, _lit.html)` <option value="${allowedValue}" ?selected="${allowedValue === this.storedParamValues[paramName]}"> ${allowedValue === null ? '-' : allowedValue} </option>`)} </select>` || (0, _lit.html)` <input type="${generatedParamSchema.format === 'password' ? 'password' : 'text'}" spellcheck="false" style="width:100%;margin-top:1rem;margin-bottom:1rem" autocomplete="on" id="request-param-${paramName}" aria-labelledby="request-${paramName}-label" @input="${() => {
|
243
243
|
this.computeCurlSyntax();
|
244
|
-
}}" placeholder="${generatedParamSchema.example || defaultVal || ''}" class="request-param" part="textbox textbox-param" data-ptype="${paramLocation}" data-pname="${paramName}" data-
|
244
|
+
}}" placeholder="${generatedParamSchema.example || defaultVal || ''}" class="request-param" part="textbox textbox-param" data-ptype="${paramLocation}" data-pname="${paramName}" data-required="${paramRequired}" data-array="false" @keyup="${this.requestParamFunction}" .value="${this.fillRequestWithDefault === 'true' ? defaultVal : ''}">` : ''} ${this.exampleListTemplate.call(this, param, generatedParamSchema.type)} </td> ${this.renderStyle === 'focused' ? (0, _lit.html)` <td colspan="2" style="vertical-align:top"> ${paramDescription ? (0, _lit.html)` <div class="param-description" style="margin-top:1rem"> ${(0, _unsafeHtml.unsafeHTML)((0, _commonUtils.toMarkdown)(paramDescription))} </div>` : ''} ${generatedParamSchema.constraints.length || displayAllowedValuesHints || generatedParamSchema.pattern ? (0, _lit.html)` <div class="param-constraint" style="margin-top:1rem"> ${generatedParamSchema.constraints.length ? (0, _lit.html)`<span style="font-weight:700">Constraints: </span>${generatedParamSchema.constraints.join(', ')}<br>` : ''} ${generatedParamSchema.pattern ? (0, _lit.html)` <div class="tooltip tooltip-replace" style="cursor:pointer;max-width:100%;display:flex"> <div style="white-space:nowrap;font-weight:700;margin-right:2px">Pattern: </div> <div style="white-space:nowrap;text-overflow:ellipsis;max-width:100%;overflow:hidden">${generatedParamSchema.pattern}</div> <br> <div class="tooltip-text" style="position:absolute;display:block">${generatedParamSchema.pattern}</div> </div> ` : ''} ${(_generatedParamSchema = generatedParamSchema.allowedValues) === null || _generatedParamSchema === void 0 ? void 0 : _generatedParamSchema.map((v, i) => (0, _lit.html)` ${i > 0 ? '|' : (0, _lit.html)`<span style="font-weight:700">Allowed: </span>`} ${(0, _lit.html)` <a part="anchor anchor-param-constraint" class="${this.allowTry === 'true' ? '' : 'inactive-link'}" data-type="${generatedParamSchema.type === 'array' ? 'array' : 'string'}" data-enum="${v === null || v === void 0 ? void 0 : v.trim()}" @click="${e => {
|
245
245
|
const inputEl = e.target.closest('table').querySelector(`[data-pname="${paramName}"]`);
|
246
246
|
if (inputEl) {
|
247
247
|
inputEl.value = e.target.dataset.type === 'array' ? [e.target.dataset.enum] : e.target.dataset.enum;
|
@@ -396,9 +396,9 @@ class ApiRequest extends _lit.LitElement {
|
|
396
396
|
this.selectedRequestBodyExample = reqBodyExamples.length > 0 ? reqBodyExamples[0].exampleId : '';
|
397
397
|
}
|
398
398
|
const displayedBodyExample = reqBodyExamples.find(v => v.exampleId === this.selectedRequestBodyExample) || reqBodyExamples[0];
|
399
|
-
reqBodyDefaultHtml = (0, _lit.html)` <div class="example-panel pad-top-8"> ${reqBodyExamples.length === 1 ? '' : (0, _lit.html)` <select aria-label="request body example" style="min-width:100px;max-width:100%;margin-bottom:-1px" @change="${e => this.onSelectExample(e)}"> ${reqBodyExamples.map(v => (0, _lit.html)`<option value="${v.exampleId}" ?selected="${v.exampleId === this.selectedRequestBodyExample}"> ${v.exampleSummary.length > 80 ? v.exampleId : v.exampleSummary ? v.exampleSummary : v.exampleId} </option>`)} </select>`} ${displayedBodyExample ? (0, _lit.html)` <div class="example"
|
399
|
+
reqBodyDefaultHtml = (0, _lit.html)` <div class="example-panel pad-top-8"> ${reqBodyExamples.length === 1 ? '' : (0, _lit.html)` <select aria-label="request body example" style="min-width:100px;max-width:100%;margin-bottom:-1px" @change="${e => this.onSelectExample(e)}"> ${reqBodyExamples.map(v => (0, _lit.html)`<option value="${v.exampleId}" ?selected="${v.exampleId === this.selectedRequestBodyExample}"> ${v.exampleSummary.length > 80 ? v.exampleId : v.exampleSummary ? v.exampleSummary : v.exampleId} </option>`)} </select>`} ${displayedBodyExample ? (0, _lit.html)` <div class="example"> ${displayedBodyExample.exampleSummary && displayedBodyExample.exampleSummary.length > 80 ? (0, _lit.html)`<div style="padding:4px 0"> ${displayedBodyExample.exampleSummary} </div>` : ''} ${displayedBodyExample.exampleDescription ? (0, _lit.html)`<div class="m-markdown-small" style="padding:4px 0"> ${(0, _unsafeHtml.unsafeHTML)((0, _commonUtils.toMarkdown)(displayedBodyExample.exampleDescription || ''))} </div>` : ''} <slot name="${this.elementId}--request-body"> <textarea @input="${() => {
|
400
400
|
this.computeCurlSyntax();
|
401
|
-
}}" class="textarea request-body-param-user-input" part="textarea textarea-param" aria-label="${(0, _index.getI18nText)('operations.request-body')}" spellcheck="false" data-ptype="${reqBody.mimeType}"
|
401
|
+
}}" class="textarea request-body-param-user-input" part="textarea textarea-param" aria-label="${(0, _index.getI18nText)('operations.request-body')}" spellcheck="false" data-ptype="${reqBody.mimeType}" style="width:100%;resize:vertical" .value="${this.fillRequestWithDefault === 'true' ? displayedBodyExample.exampleFormat === 'text' ? displayedBodyExample.exampleValue : JSON.stringify(displayedBodyExample.exampleValue, null, 8) : ''}"></textarea> </slot> </div>` : ''} ${reqBodyExamples.map(bodyExample => (0, _lit.html)` <textarea class="textarea is-hidden request-body-param ${reqBody.mimeType.substring(reqBody.mimeType.indexOf('/') + 1)}" spellcheck="false" data-ptype="${reqBody.mimeType}" data-example="${bodyExample.exampleId}" style="width:100%;resize:vertical;display:none" .value="${bodyExample.exampleFormat === 'text' ? bodyExample.exampleValue : JSON.stringify(bodyExample.exampleValue, null, 8)}"></textarea> `)} </div> `;
|
402
402
|
} else if (this.selectedRequestBodyType.includes('form-urlencoded') || this.selectedRequestBodyType.includes('form-data')) {
|
403
403
|
bodyTabNameUseBody = false;
|
404
404
|
const schemaAsObj = (0, _schemaUtils.schemaInObjectNotation)(reqBody.schema, {
|
@@ -470,7 +470,7 @@ class ApiRequest extends _lit.LitElement {
|
|
470
470
|
|
471
471
|
onClearRequestData(e) {
|
472
472
|
const requestPanelEl = e.target.closest('.request-panel');
|
473
|
-
const requestPanelInputEls = [...requestPanelEl.querySelectorAll('input, tag-input, textarea:not(.is-hidden)')];
|
473
|
+
const requestPanelInputEls = [...requestPanelEl.querySelectorAll('input, select, tag-input, textarea:not(.is-hidden)')];
|
474
474
|
requestPanelInputEls.forEach(el => {
|
475
475
|
el.value = '';
|
476
476
|
});
|
@@ -498,6 +498,13 @@ class ApiRequest extends _lit.LitElement {
|
|
498
498
|
error.code = 'MissingPathParameter';
|
499
499
|
throw error;
|
500
500
|
}
|
501
|
+
const requiredPanelEl = [...requestPanelEl.querySelectorAll("[data-required='true']")];
|
502
|
+
const missingRequiredParameterValue = requiredPanelEl.find(el => !el.value);
|
503
|
+
if (missingRequiredParameterValue) {
|
504
|
+
const error = Error(`Required parameter found, but no valid value was set for the parameter: '${missingRequiredParameterValue.dataset.pname}'.`);
|
505
|
+
error.code = 'MissingRequiredParameter';
|
506
|
+
throw error;
|
507
|
+
}
|
501
508
|
}
|
502
509
|
recomputeFetchOptions() {
|
503
510
|
const requestPanelEl = this.closest('.request-panel');
|
@@ -652,12 +659,6 @@ class ApiRequest extends _lit.LitElement {
|
|
652
659
|
}
|
653
660
|
});
|
654
661
|
fetchOptions.body = formDataParams;
|
655
|
-
} else if (mediaFileRegex.test(requestBodyType) || textFileRegex.test(requestBodyType)) {
|
656
|
-
const bodyParamFileEl = requestPanelEl.querySelector('.request-body-param-file');
|
657
|
-
if (bodyParamFileEl && bodyParamFileEl.files[0]) {
|
658
|
-
fetchOptions.body = bodyParamFileEl.files[0];
|
659
|
-
curlData = ` \\\n --data-binary @${bodyParamFileEl.files[0].name}`;
|
660
|
-
}
|
661
662
|
} else if (requestBodyType.includes('json') || requestBodyType.includes('xml') || requestBodyType.includes('text')) {
|
662
663
|
const exampleTextAreaEl = requestPanelEl.querySelector('.request-body-param-user-input');
|
663
664
|
if (exampleTextAreaEl && exampleTextAreaEl.value) {
|
@@ -675,6 +676,12 @@ class ApiRequest extends _lit.LitElement {
|
|
675
676
|
curlData = ` \\\n -d '${fetchOptions.body.replace(/'/g, '\'"\'"\'')}'`;
|
676
677
|
}
|
677
678
|
}
|
679
|
+
} else if (mediaFileRegex.test(requestBodyType) || textFileRegex.test(requestBodyType)) {
|
680
|
+
const bodyParamFileEl = requestPanelEl.querySelector('.request-body-param-file');
|
681
|
+
if (bodyParamFileEl && bodyParamFileEl.files[0]) {
|
682
|
+
fetchOptions.body = bodyParamFileEl.files[0];
|
683
|
+
curlData = ` \\\n --data-binary @${bodyParamFileEl.files[0].name}`;
|
684
|
+
}
|
678
685
|
}
|
679
686
|
// Common for all request-body
|
680
687
|
if (!requestBodyType.includes('form-data')) {
|
@@ -140,7 +140,6 @@ function inputFieldKeyLabel(isOption, keyLabel, keyDescription, dataType, deprec
|
|
140
140
|
// data-array = "false"
|
141
141
|
// data-ptype = "form-input"
|
142
142
|
// data-pname = "${keyLabel}"
|
143
|
-
// data-default = "${defaultValue || ''}"
|
144
143
|
// spellcheck = "false"
|
145
144
|
// .value="${options.fillRequestWithDefault === 'true' ? defaultValue : ''}"
|
146
145
|
// ></textarea>
|
@@ -161,13 +160,13 @@ function getArrayFormField(keyLabel, example, defaultValue, format, rowGenerator
|
|
161
160
|
return (0, _lit.html)`<td style="min-width:100px"> <tag-input @change="${e => {
|
162
161
|
rowGenerator(e);
|
163
162
|
this.computeCurlSyntax();
|
164
|
-
}}" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-
|
163
|
+
}}" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-array="true" placeholder="${(Array.isArray(example) ? example[0] : example) || defaultValue || 'add-multiple ↩'}" .value="${defaultValue || ''}"></tag-input> </td>`;
|
165
164
|
}
|
166
165
|
function getPrimitiveFormField(keyLabel, example, defaultValue, format, options, rowGenerator) {
|
167
166
|
return (0, _lit.html)`<td style="min-width:100px"> <input placeholder="${example || defaultValue || ''}" @input="${e => {
|
168
167
|
rowGenerator(e);
|
169
168
|
this.computeCurlSyntax();
|
170
|
-
}}" .value="${options.fillRequestWithDefault && defaultValue || ''}" spellcheck="false" type="${format === 'binary' ? 'file' : format === 'password' ? 'password' : 'text'}" part="textbox textbox-param" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-
|
169
|
+
}}" .value="${options.fillRequestWithDefault && defaultValue || ''}" spellcheck="false" type="${format === 'binary' ? 'file' : format === 'password' ? 'password' : 'text'}" part="textbox textbox-param" style="width:100%" data-ptype="form-input" data-pname="${keyLabel}" data-array="false"> </td>`;
|
171
170
|
}
|
172
171
|
function getRequestFormTable(data, mimeType) {
|
173
172
|
const options = {
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "openapi-explorer",
|
3
|
-
"version": "2.2.
|
3
|
+
"version": "2.2.768",
|
4
4
|
"description": "OpenAPI Explorer - API viewer with dynamically generated components, documentation, and interaction console",
|
5
5
|
"author": "Authress Developers <developers@authress.io>",
|
6
6
|
"type": "module",
|