@stoplight/elements-core 8.3.4 → 8.4.1

package/components/Docs/Docs.d.ts

@@ -24,6 +24,7 @@ interface BaseDocsProps {
     tryItCorsProxy?: string;
     layoutOptions?: {
         hideTryIt?: boolean;
+        hideSamples?: boolean;
         hideTryItPanel?: boolean;
         noHeading?: boolean;
         showPoweredByLink?: boolean;

package/components/Docs/HttpService/AdditionalInfo.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { AdditionalInfo } from './AdditionalInfo';
+declare const meta: Meta<typeof AdditionalInfo>;
+export default meta;
+declare type Story = StoryObj<typeof AdditionalInfo>;
+export declare const LicenseNameAndURL: Story;
+export declare const LicenseNameAndIdentifier: Story;
+export declare const LicenseIdentifierAndNameAndUrl: Story;

package/components/TryIt/TryItWithRequestSamples.d.ts

@@ -3,5 +3,6 @@ import { ResponseExamplesProps } from '../ResponseExamples/ResponseExamples';
 import { TryItProps } from './TryIt';
 export declare type TryItWithRequestSamplesProps = Omit<TryItProps, 'onRequestChange'> & ResponseExamplesProps & {
     hideTryIt?: boolean;
+    hideSamples?: boolean;
 };
 export declare const TryItWithRequestSamples: React.FC<TryItWithRequestSamplesProps>;

package/index.esm.js

@@ -2158,7 +2158,7 @@ const TryItResponse = ({ response }) => {
                 response.bodyText && responseType && ['json', 'xml', 'text'].includes(responseType) ? (React.createElement(ResponseCodeViewer, { language: "json", value: responseType && bodyFormat === 'preview'
                         ? parseBody(response.bodyText, responseType)
                         : response.bodyText })) : response.blob && responseType === 'image' ? (React.createElement(Flex, { justifyContent: "center" },
-                    React.createElement(Image, { src: URL.createObjectURL(response.blob), alt: "response image" }))) : (React.createElement("p", null,
+                    React.createElement(Image, { src: URL.createObjectURL(response.blob), alt: "response image" }))) : !response.bodyText ? null : (React.createElement("p", null,
                     React.createElement(Box, { as: Icon, icon: ['fas', 'exclamation-circle'], mr: 2 }),
                     "No supported response body returned"))))));
 };
@@ -2450,14 +2450,14 @@ const ResponseExamples = ({ httpOperation, responseMediaType, responseStatusCode
 };
 
 const TryItWithRequestSamples = (_a) => {
-    var { hideTryIt } = _a, props = __rest(_a, ["hideTryIt"]);
+    var { hideTryIt, hideSamples } = _a, props = __rest(_a, ["hideTryIt", "hideSamples"]);
     const [requestData, setRequestData] = React.useState();
     const customCodeSamples = extractCodeSamples(props.httpOperation);
     return (React.createElement(VStack, { spacing: 6 },
         !hideTryIt && (React.createElement(InvertTheme, null,
             React.createElement(Box, null,
                 React.createElement(TryIt, Object.assign({}, props, { onRequestChange: setRequestData }))))),
-        requestData && React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
+        requestData && !hideSamples && React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
         React.createElement(ResponseExamples, Object.assign({}, props))));
 };
 
@@ -2915,7 +2915,7 @@ const HttpOperationComponent = React.memo(({ className, data: unresolvedData, la
         throw new RangeError('unsupported node type');
     }
     const header = (React.createElement(OperationHeader, { id: data.id, method: data.method, path: path, noHeading: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.noHeading, hasBadges: hasBadges, name: prettyName, isDeprecated: isDeprecated, isInternal: isInternal, hideServerUrl: !isHttpOperation(data) }));
-    const tryItPanel = !(layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel) && (React.createElement(TryItWithRequestSamples, { httpOperation: data, responseMediaType: responseMediaType, responseStatusCode: responseStatusCode, requestBodyIndex: requestBodyIndex, hideTryIt: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryIt, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
+    const tryItPanel = !(layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel) && (React.createElement(TryItWithRequestSamples, { httpOperation: data, responseMediaType: responseMediaType, responseStatusCode: responseStatusCode, requestBodyIndex: requestBodyIndex, hideTryIt: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryIt, hideSamples: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideSamples, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
     const descriptionChanged = nodeHasChanged === null || nodeHasChanged === void 0 ? void 0 : nodeHasChanged({ nodeId: data.id, attr: 'description' });
     const description = (React.createElement(VStack, { spacing: 10 },
         data.description && (React.createElement(Box, { pos: "relative" },
@@ -2945,9 +2945,9 @@ function MethodPathInner({ method, path, chosenServerUrl }) {
     const isDark = useThemeIsDark();
     const fullUrl = `${chosenServerUrl}${path}`;
     const pathElem = (React.createElement(Flex, { overflowX: "hidden", fontSize: "lg", userSelect: "all" },
-        React.createElement(Box, { dir: "rtl", color: "muted", textOverflow: "truncate", overflowX: "hidden" },
-            React.createElement(Box, { as: "span", dir: "ltr", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl)),
-        React.createElement(Box, { fontWeight: "semibold", flex: 1 }, path)));
+        React.createElement(Box, { dir: "rtl", textOverflow: "truncate", overflowX: "hidden" },
+            React.createElement(Box, { as: "span", color: "muted", dir: "ltr", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl),
+            React.createElement(Box, { as: "span", fontWeight: "semibold", flex: 1 }, path))));
     return (React.createElement(HStack, { spacing: 3, pl: 2.5, pr: 4, py: 2, bg: "canvas-50", rounded: "lg", fontFamily: "mono", display: "inline-flex", maxW: "full", title: fullUrl },
         React.createElement(Box, { py: 1, px: 2.5, rounded: "lg", bg: !isDark ? HttpMethodColors[method] : 'canvas-100', color: !isDark ? 'on-primary' : 'body', fontSize: "lg", fontWeight: "semibold", textTransform: "uppercase" }, method),
         pathElem));
@@ -2988,8 +2988,12 @@ const AdditionalInfo = ({ id, termsOfService, contact, license }) => {
         : (contact === null || contact === void 0 ? void 0 : contact.email)
             ? `[Contact ${contact.name || contact.email}](mailto:${contact.email})`
             : '';
-    const licenseUrl = (license === null || license === void 0 ? void 0 : license.url) || `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html`;
-    const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl ? `[${license.name} License](${licenseUrl})` : '';
+    const licenseUrl = (license === null || license === void 0 ? void 0 : license.url) || (license === null || license === void 0 ? void 0 : license.identifier) ? `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html` : undefined;
+    const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl
+        ? `[${license.name}](${licenseUrl})`
+        : (license === null || license === void 0 ? void 0 : license.identifier) && licenseUrl
+            ? `[${license === null || license === void 0 ? void 0 : license.identifier}](${licenseUrl})`
+            : undefined;
     const tosLink = termsOfService ? `[Terms of Service](${termsOfService})` : '';
     return contactLink || licenseLink || tosLink ? (React__default.createElement(Panel, { rounded: true, isCollapsible: false, pos: "relative" },
         React__default.createElement(Panel.Titlebar, { bg: "canvas-300" },

package/index.js

@@ -2180,7 +2180,7 @@ const TryItResponse = ({ response }) => {
                 response.bodyText && responseType && ['json', 'xml', 'text'].includes(responseType) ? (React__namespace.createElement(ResponseCodeViewer, { language: "json", value: responseType && bodyFormat === 'preview'
                         ? parseBody(response.bodyText, responseType)
                         : response.bodyText })) : response.blob && responseType === 'image' ? (React__namespace.createElement(mosaic.Flex, { justifyContent: "center" },
-                    React__namespace.createElement(mosaic.Image, { src: URL.createObjectURL(response.blob), alt: "response image" }))) : (React__namespace.createElement("p", null,
+                    React__namespace.createElement(mosaic.Image, { src: URL.createObjectURL(response.blob), alt: "response image" }))) : !response.bodyText ? null : (React__namespace.createElement("p", null,
                     React__namespace.createElement(mosaic.Box, { as: mosaic.Icon, icon: ['fas', 'exclamation-circle'], mr: 2 }),
                     "No supported response body returned"))))));
 };
@@ -2472,14 +2472,14 @@ const ResponseExamples = ({ httpOperation, responseMediaType, responseStatusCode
 };
 
 const TryItWithRequestSamples = (_a) => {
-    var { hideTryIt } = _a, props = tslib.__rest(_a, ["hideTryIt"]);
+    var { hideTryIt, hideSamples } = _a, props = tslib.__rest(_a, ["hideTryIt", "hideSamples"]);
     const [requestData, setRequestData] = React__namespace.useState();
     const customCodeSamples = extractCodeSamples(props.httpOperation);
     return (React__namespace.createElement(mosaic.VStack, { spacing: 6 },
         !hideTryIt && (React__namespace.createElement(mosaic.InvertTheme, null,
             React__namespace.createElement(mosaic.Box, null,
                 React__namespace.createElement(TryIt, Object.assign({}, props, { onRequestChange: setRequestData }))))),
-        requestData && React__namespace.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
+        requestData && !hideSamples && React__namespace.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
         React__namespace.createElement(ResponseExamples, Object.assign({}, props))));
 };
 
@@ -2937,7 +2937,7 @@ const HttpOperationComponent = React__namespace.memo(({ className, data: unresol
         throw new RangeError('unsupported node type');
     }
     const header = (React__namespace.createElement(OperationHeader, { id: data.id, method: data.method, path: path, noHeading: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.noHeading, hasBadges: hasBadges, name: prettyName, isDeprecated: isDeprecated, isInternal: isInternal, hideServerUrl: !isHttpOperation(data) }));
-    const tryItPanel = !(layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel) && (React__namespace.createElement(TryItWithRequestSamples, { httpOperation: data, responseMediaType: responseMediaType, responseStatusCode: responseStatusCode, requestBodyIndex: requestBodyIndex, hideTryIt: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryIt, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
+    const tryItPanel = !(layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel) && (React__namespace.createElement(TryItWithRequestSamples, { httpOperation: data, responseMediaType: responseMediaType, responseStatusCode: responseStatusCode, requestBodyIndex: requestBodyIndex, hideTryIt: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryIt, hideSamples: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideSamples, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
     const descriptionChanged = nodeHasChanged === null || nodeHasChanged === void 0 ? void 0 : nodeHasChanged({ nodeId: data.id, attr: 'description' });
     const description = (React__namespace.createElement(mosaic.VStack, { spacing: 10 },
         data.description && (React__namespace.createElement(mosaic.Box, { pos: "relative" },
@@ -2967,9 +2967,9 @@ function MethodPathInner({ method, path, chosenServerUrl }) {
     const isDark = mosaic.useThemeIsDark();
     const fullUrl = `${chosenServerUrl}${path}`;
     const pathElem = (React__namespace.createElement(mosaic.Flex, { overflowX: "hidden", fontSize: "lg", userSelect: "all" },
-        React__namespace.createElement(mosaic.Box, { dir: "rtl", color: "muted", textOverflow: "truncate", overflowX: "hidden" },
-            React__namespace.createElement(mosaic.Box, { as: "span", dir: "ltr", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl)),
-        React__namespace.createElement(mosaic.Box, { fontWeight: "semibold", flex: 1 }, path)));
+        React__namespace.createElement(mosaic.Box, { dir: "rtl", textOverflow: "truncate", overflowX: "hidden" },
+            React__namespace.createElement(mosaic.Box, { as: "span", color: "muted", dir: "ltr", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl),
+            React__namespace.createElement(mosaic.Box, { as: "span", fontWeight: "semibold", flex: 1 }, path))));
     return (React__namespace.createElement(mosaic.HStack, { spacing: 3, pl: 2.5, pr: 4, py: 2, bg: "canvas-50", rounded: "lg", fontFamily: "mono", display: "inline-flex", maxW: "full", title: fullUrl },
         React__namespace.createElement(mosaic.Box, { py: 1, px: 2.5, rounded: "lg", bg: !isDark ? HttpMethodColors[method] : 'canvas-100', color: !isDark ? 'on-primary' : 'body', fontSize: "lg", fontWeight: "semibold", textTransform: "uppercase" }, method),
         pathElem));
@@ -3010,8 +3010,12 @@ const AdditionalInfo = ({ id, termsOfService, contact, license }) => {
         : (contact === null || contact === void 0 ? void 0 : contact.email)
             ? `[Contact ${contact.name || contact.email}](mailto:${contact.email})`
             : '';
-    const licenseUrl = (license === null || license === void 0 ? void 0 : license.url) || `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html`;
-    const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl ? `[${license.name} License](${licenseUrl})` : '';
+    const licenseUrl = (license === null || license === void 0 ? void 0 : license.url) || (license === null || license === void 0 ? void 0 : license.identifier) ? `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html` : undefined;
+    const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl
+        ? `[${license.name}](${licenseUrl})`
+        : (license === null || license === void 0 ? void 0 : license.identifier) && licenseUrl
+            ? `[${license === null || license === void 0 ? void 0 : license.identifier}](${licenseUrl})`
+            : undefined;
     const tosLink = termsOfService ? `[Terms of Service](${termsOfService})` : '';
     return contactLink || licenseLink || tosLink ? (React.createElement(mosaic.Panel, { rounded: true, isCollapsible: false, pos: "relative" },
         React.createElement(mosaic.Panel.Titlebar, { bg: "canvas-300" },

package/index.mjs

@@ -2158,7 +2158,7 @@ const TryItResponse = ({ response }) => {
                 response.bodyText && responseType && ['json', 'xml', 'text'].includes(responseType) ? (React.createElement(ResponseCodeViewer, { language: "json", value: responseType && bodyFormat === 'preview'
                         ? parseBody(response.bodyText, responseType)
                         : response.bodyText })) : response.blob && responseType === 'image' ? (React.createElement(Flex, { justifyContent: "center" },
-                    React.createElement(Image, { src: URL.createObjectURL(response.blob), alt: "response image" }))) : (React.createElement("p", null,
+                    React.createElement(Image, { src: URL.createObjectURL(response.blob), alt: "response image" }))) : !response.bodyText ? null : (React.createElement("p", null,
                     React.createElement(Box, { as: Icon, icon: ['fas', 'exclamation-circle'], mr: 2 }),
                     "No supported response body returned"))))));
 };
@@ -2450,14 +2450,14 @@ const ResponseExamples = ({ httpOperation, responseMediaType, responseStatusCode
 };
 
 const TryItWithRequestSamples = (_a) => {
-    var { hideTryIt } = _a, props = __rest(_a, ["hideTryIt"]);
+    var { hideTryIt, hideSamples } = _a, props = __rest(_a, ["hideTryIt", "hideSamples"]);
     const [requestData, setRequestData] = React.useState();
     const customCodeSamples = extractCodeSamples(props.httpOperation);
     return (React.createElement(VStack, { spacing: 6 },
         !hideTryIt && (React.createElement(InvertTheme, null,
             React.createElement(Box, null,
                 React.createElement(TryIt, Object.assign({}, props, { onRequestChange: setRequestData }))))),
-        requestData && React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
+        requestData && !hideSamples && React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
         React.createElement(ResponseExamples, Object.assign({}, props))));
 };
 
@@ -2915,7 +2915,7 @@ const HttpOperationComponent = React.memo(({ className, data: unresolvedData, la
         throw new RangeError('unsupported node type');
     }
     const header = (React.createElement(OperationHeader, { id: data.id, method: data.method, path: path, noHeading: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.noHeading, hasBadges: hasBadges, name: prettyName, isDeprecated: isDeprecated, isInternal: isInternal, hideServerUrl: !isHttpOperation(data) }));
-    const tryItPanel = !(layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel) && (React.createElement(TryItWithRequestSamples, { httpOperation: data, responseMediaType: responseMediaType, responseStatusCode: responseStatusCode, requestBodyIndex: requestBodyIndex, hideTryIt: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryIt, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
+    const tryItPanel = !(layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel) && (React.createElement(TryItWithRequestSamples, { httpOperation: data, responseMediaType: responseMediaType, responseStatusCode: responseStatusCode, requestBodyIndex: requestBodyIndex, hideTryIt: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryIt, hideSamples: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideSamples, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
     const descriptionChanged = nodeHasChanged === null || nodeHasChanged === void 0 ? void 0 : nodeHasChanged({ nodeId: data.id, attr: 'description' });
     const description = (React.createElement(VStack, { spacing: 10 },
         data.description && (React.createElement(Box, { pos: "relative" },
@@ -2945,9 +2945,9 @@ function MethodPathInner({ method, path, chosenServerUrl }) {
     const isDark = useThemeIsDark();
     const fullUrl = `${chosenServerUrl}${path}`;
     const pathElem = (React.createElement(Flex, { overflowX: "hidden", fontSize: "lg", userSelect: "all" },
-        React.createElement(Box, { dir: "rtl", color: "muted", textOverflow: "truncate", overflowX: "hidden" },
-            React.createElement(Box, { as: "span", dir: "ltr", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl)),
-        React.createElement(Box, { fontWeight: "semibold", flex: 1 }, path)));
+        React.createElement(Box, { dir: "rtl", textOverflow: "truncate", overflowX: "hidden" },
+            React.createElement(Box, { as: "span", color: "muted", dir: "ltr", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl),
+            React.createElement(Box, { as: "span", fontWeight: "semibold", flex: 1 }, path))));
     return (React.createElement(HStack, { spacing: 3, pl: 2.5, pr: 4, py: 2, bg: "canvas-50", rounded: "lg", fontFamily: "mono", display: "inline-flex", maxW: "full", title: fullUrl },
         React.createElement(Box, { py: 1, px: 2.5, rounded: "lg", bg: !isDark ? HttpMethodColors[method] : 'canvas-100', color: !isDark ? 'on-primary' : 'body', fontSize: "lg", fontWeight: "semibold", textTransform: "uppercase" }, method),
         pathElem));
@@ -2988,8 +2988,12 @@ const AdditionalInfo = ({ id, termsOfService, contact, license }) => {
         : (contact === null || contact === void 0 ? void 0 : contact.email)
             ? `[Contact ${contact.name || contact.email}](mailto:${contact.email})`
             : '';
-    const licenseUrl = (license === null || license === void 0 ? void 0 : license.url) || `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html`;
-    const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl ? `[${license.name} License](${licenseUrl})` : '';
+    const licenseUrl = (license === null || license === void 0 ? void 0 : license.url) || (license === null || license === void 0 ? void 0 : license.identifier) ? `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html` : undefined;
+    const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl
+        ? `[${license.name}](${licenseUrl})`
+        : (license === null || license === void 0 ? void 0 : license.identifier) && licenseUrl
+            ? `[${license === null || license === void 0 ? void 0 : license.identifier}](${licenseUrl})`
+            : undefined;
     const tosLink = termsOfService ? `[Terms of Service](${termsOfService})` : '';
     return contactLink || licenseLink || tosLink ? (React__default.createElement(Panel, { rounded: true, isCollapsible: false, pos: "relative" },
         React__default.createElement(Panel.Titlebar, { bg: "canvas-300" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stoplight/elements-core",
-  "version": "8.3.4",
+  "version": "8.4.1",
   "main": "./index.js",
   "sideEffects": [
     "web-components.min.js",
@@ -30,8 +30,8 @@
     "@stoplight/json-schema-sampler": "0.3.0",
     "@stoplight/json-schema-tree": "^4.0.0",
     "@stoplight/json-schema-viewer": "4.16.1",
-    "@stoplight/markdown-viewer": "^5.7.0",
-    "@stoplight/mosaic": "^1.53.1",
+    "@stoplight/markdown-viewer": "^5.7.1",
+    "@stoplight/mosaic": "^1.53.3",
     "@stoplight/mosaic-code-editor": "^1.53.1",
     "@stoplight/mosaic-code-viewer": "^1.53.1",
     "@stoplight/path": "^1.3.2",