@stoplight/elements-core 7.7.15 → 7.7.17

package/__fixtures__/operations/security-basic.d.ts

@@ -0,0 +1,3 @@
+import { IHttpOperation } from '@stoplight/types';
+export declare const httpOperation: IHttpOperation;
+export default httpOperation;

package/__fixtures__/operations/security-bearer.d.ts

@@ -0,0 +1,3 @@
+import { IHttpOperation } from '@stoplight/types';
+export declare const httpOperation: IHttpOperation;
+export default httpOperation;

package/components/TryIt/build-request.d.ts

@@ -20,4 +20,5 @@ export declare const getQueryParams: ({ httpOperation, parameterValues, }: Pick<
 }[];
 export declare function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, parameterValues, mockData, auth, chosenServer, credentials, corsProxy, }: BuildRequestInput): Promise<Parameters<typeof fetch>>;
 export declare function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeContent, auth, mockData, chosenServer, corsProxy, }: BuildRequestInput): Promise<HarRequest>;
+export declare function getAcceptedMimeTypes(httpOperation: IHttpOperation): string[];
 export {};

package/index.esm.js

@@ -905,11 +905,17 @@ const OAuth2Auth = ({ value, onChange }) => {
         React.createElement(AuthTokenInput, { type: "oauth2", name: "Token", value: value, onChange: onChange })));
 };
 
-const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value }) => {
+function getSupportedSecurityScheme(value, supportedSecuritySchemes) {
     var _a;
+    if (value && supportedSecuritySchemes.some(s => value.scheme.id === s.id)) {
+        return [value.scheme, (_a = value.authValue) !== null && _a !== void 0 ? _a : ''];
+    }
+    return [supportedSecuritySchemes[0], ''];
+}
+const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value }) => {
     const operationSecurityArray = flatten(operationAuth);
     const filteredSecurityItems = operationSecurityArray.filter(scheme => securitySchemeKeys.includes(scheme === null || scheme === void 0 ? void 0 : scheme.type));
-    const securityScheme = value ? value.scheme : filteredSecurityItems[0];
+    const [securityScheme, authValue] = getSupportedSecurityScheme(value, filteredSecurityItems);
     const menuName = securityScheme ? getReadableSecurityName(securityScheme) : 'Security Scheme';
     const handleChange = (authValue) => {
         onChange(securityScheme && { scheme: securityScheme, authValue: authValue });
@@ -938,7 +944,7 @@ const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value })
         return null;
     return (React.createElement(Panel, { defaultIsOpen: true },
         React.createElement(Panel.Titlebar, { rightComponent: filteredSecurityItems.length > 1 && (React.createElement(Menu, { "aria-label": "security-schemes", items: menuItems, closeOnPress: true, renderTrigger: ({ isOpen }) => (React.createElement(Button, { appearance: "minimal", size: "sm", iconRight: ['fas', 'sort'], active: isOpen }, menuName)) })) }, "Auth"),
-        React.createElement(SecuritySchemeComponent, { scheme: value ? value.scheme : filteredSecurityItems[0], onChange: handleChange, value: (_a = (value && value.authValue)) !== null && _a !== void 0 ? _a : '' })));
+        React.createElement(SecuritySchemeComponent, { scheme: securityScheme, onChange: handleChange, value: authValue })));
 };
 const GenericMessageContainer = ({ scheme }) => {
     return React.createElement(Panel.Content, null,
@@ -1480,7 +1486,7 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
     var _a, _b, _c;
     return __awaiter(this, void 0, void 0, function* () {
         const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy });
-        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase());
+        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
         const queryParams = getQueryParams({ httpOperation, parameterValues });
         const rawHeaders = filterOutAuthorizationParams((_b = (_a = httpOperation.request) === null || _a === void 0 ? void 0 : _a.headers) !== null && _b !== void 0 ? _b : [], httpOperation.security)
             .map(header => { var _a; return ({ name: header.name, value: (_a = parameterValues[header.name]) !== null && _a !== void 0 ? _a : '' }); })
@@ -1490,7 +1496,9 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
         const urlObject = new URL(serverUrl + expandedPath);
         urlObject.search = new URLSearchParams(queryParamsWithAuth.map(nameAndValueObjectToPair)).toString();
         const body = typeof bodyInput === 'object' ? yield createRequestBody(mediaTypeContent, bodyInput) : bodyInput;
-        const headers = Object.assign(Object.assign(Object.assign({}, ((mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== 'multipart/form-data' && {
+        const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
+        const headers = Object.assign(Object.assign(Object.assign(Object.assign({}, (acceptedMimeTypes.length > 0 && { Accept: acceptedMimeTypes.join(', ') })), ((mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== 'multipart/form-data' &&
+            shouldIncludeBody && {
             'Content-Type': (_c = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== null && _c !== void 0 ? _c : 'application/json',
         })), Object.fromEntries(headersWithAuth.map(nameAndValueObjectToPair))), mockData === null || mockData === void 0 ? void 0 : mockData.header);
         return [
@@ -1555,12 +1563,19 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeC
     return __awaiter(this, void 0, void 0, function* () {
         const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy });
         const mimeType = (_a = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== null && _a !== void 0 ? _a : 'application/json';
-        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase());
+        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
         const queryParams = getQueryParams({ httpOperation, parameterValues });
         const headerParams = (_d = (_c = (_b = httpOperation.request) === null || _b === void 0 ? void 0 : _b.headers) === null || _c === void 0 ? void 0 : _c.map(header => { var _a; return ({ name: header.name, value: (_a = parameterValues[header.name]) !== null && _a !== void 0 ? _a : '' }); })) !== null && _d !== void 0 ? _d : [];
         if (mockData === null || mockData === void 0 ? void 0 : mockData.header) {
             headerParams.push({ name: 'Prefer', value: mockData.header.Prefer });
         }
+        if (shouldIncludeBody) {
+            headerParams.push({ name: 'Content-Type', value: mimeType });
+        }
+        const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
+        if (acceptedMimeTypes.length > 0) {
+            headerParams.push({ name: 'Accept', value: acceptedMimeTypes.join(', ') });
+        }
         const [queryParamsWithAuth, headerParamsWithAuth] = runAuthRequestEhancements(auth, queryParams, headerParams);
         const expandedPath = uriExpand(httpOperation.path, parameterValues);
         const urlObject = new URL(serverUrl + expandedPath);
@@ -1591,7 +1606,7 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeC
             url: urlObject.href,
             httpVersion: 'HTTP/1.1',
             cookies: [],
-            headers: [{ name: 'Content-Type', value: mimeType }, ...headerParamsWithAuth],
+            headers: headerParamsWithAuth,
             queryString: queryParamsWithAuth,
             postData: postData,
             headersSize: -1,
@@ -1606,6 +1621,11 @@ function uriExpand(uri, data) {
     return uri.replace(/{([^#?]+?)}/g, (match, value) => {
         return data[value] || value;
     });
+}
+function getAcceptedMimeTypes(httpOperation) {
+    return Array.from(new Set(httpOperation.responses.flatMap(response => response === undefined || response.contents === undefined
+        ? []
+        : response.contents.map(contentType => contentType.mediaType))));
 }
 
 const formatMultiValueHeader = (...keyValuePairs) => {

package/index.js

@@ -958,11 +958,17 @@ const OAuth2Auth = ({ value, onChange }) => {
         React__namespace.createElement(AuthTokenInput, { type: "oauth2", name: "Token", value: value, onChange: onChange })));
 };
 
-const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value }) => {
+function getSupportedSecurityScheme(value, supportedSecuritySchemes) {
     var _a;
+    if (value && supportedSecuritySchemes.some(s => value.scheme.id === s.id)) {
+        return [value.scheme, (_a = value.authValue) !== null && _a !== void 0 ? _a : ''];
+    }
+    return [supportedSecuritySchemes[0], ''];
+}
+const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value }) => {
     const operationSecurityArray = flatten__default["default"](operationAuth);
     const filteredSecurityItems = operationSecurityArray.filter(scheme => securitySchemeKeys.includes(scheme === null || scheme === void 0 ? void 0 : scheme.type));
-    const securityScheme = value ? value.scheme : filteredSecurityItems[0];
+    const [securityScheme, authValue] = getSupportedSecurityScheme(value, filteredSecurityItems);
     const menuName = securityScheme ? getReadableSecurityName(securityScheme) : 'Security Scheme';
     const handleChange = (authValue) => {
         onChange(securityScheme && { scheme: securityScheme, authValue: authValue });
@@ -991,7 +997,7 @@ const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value })
         return null;
     return (React__namespace.createElement(mosaic.Panel, { defaultIsOpen: true },
         React__namespace.createElement(mosaic.Panel.Titlebar, { rightComponent: filteredSecurityItems.length > 1 && (React__namespace.createElement(mosaic.Menu, { "aria-label": "security-schemes", items: menuItems, closeOnPress: true, renderTrigger: ({ isOpen }) => (React__namespace.createElement(mosaic.Button, { appearance: "minimal", size: "sm", iconRight: ['fas', 'sort'], active: isOpen }, menuName)) })) }, "Auth"),
-        React__namespace.createElement(SecuritySchemeComponent, { scheme: value ? value.scheme : filteredSecurityItems[0], onChange: handleChange, value: (_a = (value && value.authValue)) !== null && _a !== void 0 ? _a : '' })));
+        React__namespace.createElement(SecuritySchemeComponent, { scheme: securityScheme, onChange: handleChange, value: authValue })));
 };
 const GenericMessageContainer = ({ scheme }) => {
     return React__namespace.createElement(mosaic.Panel.Content, null,
@@ -1533,7 +1539,7 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
     var _a, _b, _c;
     return tslib.__awaiter(this, void 0, void 0, function* () {
         const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy });
-        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase());
+        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
         const queryParams = getQueryParams({ httpOperation, parameterValues });
         const rawHeaders = filterOutAuthorizationParams((_b = (_a = httpOperation.request) === null || _a === void 0 ? void 0 : _a.headers) !== null && _b !== void 0 ? _b : [], httpOperation.security)
             .map(header => { var _a; return ({ name: header.name, value: (_a = parameterValues[header.name]) !== null && _a !== void 0 ? _a : '' }); })
@@ -1543,7 +1549,9 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
         const urlObject = new URL(serverUrl + expandedPath);
         urlObject.search = new URLSearchParams(queryParamsWithAuth.map(nameAndValueObjectToPair)).toString();
         const body = typeof bodyInput === 'object' ? yield createRequestBody(mediaTypeContent, bodyInput) : bodyInput;
-        const headers = Object.assign(Object.assign(Object.assign({}, ((mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== 'multipart/form-data' && {
+        const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
+        const headers = Object.assign(Object.assign(Object.assign(Object.assign({}, (acceptedMimeTypes.length > 0 && { Accept: acceptedMimeTypes.join(', ') })), ((mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== 'multipart/form-data' &&
+            shouldIncludeBody && {
             'Content-Type': (_c = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== null && _c !== void 0 ? _c : 'application/json',
         })), Object.fromEntries(headersWithAuth.map(nameAndValueObjectToPair))), mockData === null || mockData === void 0 ? void 0 : mockData.header);
         return [
@@ -1608,12 +1616,19 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeC
     return tslib.__awaiter(this, void 0, void 0, function* () {
         const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy });
         const mimeType = (_a = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== null && _a !== void 0 ? _a : 'application/json';
-        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase());
+        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
         const queryParams = getQueryParams({ httpOperation, parameterValues });
         const headerParams = (_d = (_c = (_b = httpOperation.request) === null || _b === void 0 ? void 0 : _b.headers) === null || _c === void 0 ? void 0 : _c.map(header => { var _a; return ({ name: header.name, value: (_a = parameterValues[header.name]) !== null && _a !== void 0 ? _a : '' }); })) !== null && _d !== void 0 ? _d : [];
         if (mockData === null || mockData === void 0 ? void 0 : mockData.header) {
             headerParams.push({ name: 'Prefer', value: mockData.header.Prefer });
         }
+        if (shouldIncludeBody) {
+            headerParams.push({ name: 'Content-Type', value: mimeType });
+        }
+        const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
+        if (acceptedMimeTypes.length > 0) {
+            headerParams.push({ name: 'Accept', value: acceptedMimeTypes.join(', ') });
+        }
         const [queryParamsWithAuth, headerParamsWithAuth] = runAuthRequestEhancements(auth, queryParams, headerParams);
         const expandedPath = uriExpand(httpOperation.path, parameterValues);
         const urlObject = new URL(serverUrl + expandedPath);
@@ -1644,7 +1659,7 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeC
             url: urlObject.href,
             httpVersion: 'HTTP/1.1',
             cookies: [],
-            headers: [{ name: 'Content-Type', value: mimeType }, ...headerParamsWithAuth],
+            headers: headerParamsWithAuth,
             queryString: queryParamsWithAuth,
             postData: postData,
             headersSize: -1,
@@ -1659,6 +1674,11 @@ function uriExpand(uri, data) {
     return uri.replace(/{([^#?]+?)}/g, (match, value) => {
         return data[value] || value;
     });
+}
+function getAcceptedMimeTypes(httpOperation) {
+    return Array.from(new Set(httpOperation.responses.flatMap(response => response === undefined || response.contents === undefined
+        ? []
+        : response.contents.map(contentType => contentType.mediaType))));
 }
 
 const formatMultiValueHeader = (...keyValuePairs) => {

package/index.mjs

@@ -905,11 +905,17 @@ const OAuth2Auth = ({ value, onChange }) => {
         React.createElement(AuthTokenInput, { type: "oauth2", name: "Token", value: value, onChange: onChange })));
 };
 
-const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value }) => {
+function getSupportedSecurityScheme(value, supportedSecuritySchemes) {
     var _a;
+    if (value && supportedSecuritySchemes.some(s => value.scheme.id === s.id)) {
+        return [value.scheme, (_a = value.authValue) !== null && _a !== void 0 ? _a : ''];
+    }
+    return [supportedSecuritySchemes[0], ''];
+}
+const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value }) => {
     const operationSecurityArray = flatten(operationAuth);
     const filteredSecurityItems = operationSecurityArray.filter(scheme => securitySchemeKeys.includes(scheme === null || scheme === void 0 ? void 0 : scheme.type));
-    const securityScheme = value ? value.scheme : filteredSecurityItems[0];
+    const [securityScheme, authValue] = getSupportedSecurityScheme(value, filteredSecurityItems);
     const menuName = securityScheme ? getReadableSecurityName(securityScheme) : 'Security Scheme';
     const handleChange = (authValue) => {
         onChange(securityScheme && { scheme: securityScheme, authValue: authValue });
@@ -938,7 +944,7 @@ const TryItAuth = ({ operationSecurityScheme: operationAuth, onChange, value })
         return null;
     return (React.createElement(Panel, { defaultIsOpen: true },
         React.createElement(Panel.Titlebar, { rightComponent: filteredSecurityItems.length > 1 && (React.createElement(Menu, { "aria-label": "security-schemes", items: menuItems, closeOnPress: true, renderTrigger: ({ isOpen }) => (React.createElement(Button, { appearance: "minimal", size: "sm", iconRight: ['fas', 'sort'], active: isOpen }, menuName)) })) }, "Auth"),
-        React.createElement(SecuritySchemeComponent, { scheme: value ? value.scheme : filteredSecurityItems[0], onChange: handleChange, value: (_a = (value && value.authValue)) !== null && _a !== void 0 ? _a : '' })));
+        React.createElement(SecuritySchemeComponent, { scheme: securityScheme, onChange: handleChange, value: authValue })));
 };
 const GenericMessageContainer = ({ scheme }) => {
     return React.createElement(Panel.Content, null,
@@ -1480,7 +1486,7 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
     var _a, _b, _c;
     return __awaiter(this, void 0, void 0, function* () {
         const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy });
-        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase());
+        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
         const queryParams = getQueryParams({ httpOperation, parameterValues });
         const rawHeaders = filterOutAuthorizationParams((_b = (_a = httpOperation.request) === null || _a === void 0 ? void 0 : _a.headers) !== null && _b !== void 0 ? _b : [], httpOperation.security)
             .map(header => { var _a; return ({ name: header.name, value: (_a = parameterValues[header.name]) !== null && _a !== void 0 ? _a : '' }); })
@@ -1490,7 +1496,9 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
         const urlObject = new URL(serverUrl + expandedPath);
         urlObject.search = new URLSearchParams(queryParamsWithAuth.map(nameAndValueObjectToPair)).toString();
         const body = typeof bodyInput === 'object' ? yield createRequestBody(mediaTypeContent, bodyInput) : bodyInput;
-        const headers = Object.assign(Object.assign(Object.assign({}, ((mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== 'multipart/form-data' && {
+        const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
+        const headers = Object.assign(Object.assign(Object.assign(Object.assign({}, (acceptedMimeTypes.length > 0 && { Accept: acceptedMimeTypes.join(', ') })), ((mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== 'multipart/form-data' &&
+            shouldIncludeBody && {
             'Content-Type': (_c = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== null && _c !== void 0 ? _c : 'application/json',
         })), Object.fromEntries(headersWithAuth.map(nameAndValueObjectToPair))), mockData === null || mockData === void 0 ? void 0 : mockData.header);
         return [
@@ -1555,12 +1563,19 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeC
     return __awaiter(this, void 0, void 0, function* () {
         const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy });
         const mimeType = (_a = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.mediaType) !== null && _a !== void 0 ? _a : 'application/json';
-        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase());
+        const shouldIncludeBody = ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
         const queryParams = getQueryParams({ httpOperation, parameterValues });
         const headerParams = (_d = (_c = (_b = httpOperation.request) === null || _b === void 0 ? void 0 : _b.headers) === null || _c === void 0 ? void 0 : _c.map(header => { var _a; return ({ name: header.name, value: (_a = parameterValues[header.name]) !== null && _a !== void 0 ? _a : '' }); })) !== null && _d !== void 0 ? _d : [];
         if (mockData === null || mockData === void 0 ? void 0 : mockData.header) {
             headerParams.push({ name: 'Prefer', value: mockData.header.Prefer });
         }
+        if (shouldIncludeBody) {
+            headerParams.push({ name: 'Content-Type', value: mimeType });
+        }
+        const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
+        if (acceptedMimeTypes.length > 0) {
+            headerParams.push({ name: 'Accept', value: acceptedMimeTypes.join(', ') });
+        }
         const [queryParamsWithAuth, headerParamsWithAuth] = runAuthRequestEhancements(auth, queryParams, headerParams);
         const expandedPath = uriExpand(httpOperation.path, parameterValues);
         const urlObject = new URL(serverUrl + expandedPath);
@@ -1591,7 +1606,7 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, mediaTypeC
             url: urlObject.href,
             httpVersion: 'HTTP/1.1',
             cookies: [],
-            headers: [{ name: 'Content-Type', value: mimeType }, ...headerParamsWithAuth],
+            headers: headerParamsWithAuth,
             queryString: queryParamsWithAuth,
             postData: postData,
             headersSize: -1,
@@ -1606,6 +1621,11 @@ function uriExpand(uri, data) {
     return uri.replace(/{([^#?]+?)}/g, (match, value) => {
         return data[value] || value;
     });
+}
+function getAcceptedMimeTypes(httpOperation) {
+    return Array.from(new Set(httpOperation.responses.flatMap(response => response === undefined || response.contents === undefined
+        ? []
+        : response.contents.map(contentType => contentType.mediaType))));
 }
 
 const formatMultiValueHeader = (...keyValuePairs) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stoplight/elements-core",
-  "version": "7.7.15",
+  "version": "7.7.17",
   "main": "./index.js",
   "sideEffects": [
     "web-components.min.js",