@stoplight/elements-core 8.4.7 → 8.5.1

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.
Files changed (12) hide show
  1. package/__fixtures__/operations/application-octet-stream-post.d.ts +3 -0
  2. package/components/Docs/HttpService/AdditionalInfo.stories.d.ts +3 -3
  3. package/components/TryIt/Body/BinaryBody.d.ts +9 -0
  4. package/components/TryIt/Body/request-body-utils.d.ts +7 -0
  5. package/components/TryIt/TryIt.d.ts +1 -0
  6. package/components/TryIt/TryItWithRequestSamples.d.ts +1 -0
  7. package/components/TryIt/TryItWithRequestSamples.stories.d.ts +1 -0
  8. package/components/TryIt/build-request.d.ts +1 -1
  9. package/index.esm.js +113 -41
  10. package/index.js +113 -41
  11. package/index.mjs +113 -41
  12. package/package.json +2 -2
package/__fixtures__/operations/application-octet-stream-post.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { IHttpOperation } from '@stoplight/types';
2
+ export declare const httpOperation: IHttpOperation;
3
+ export default httpOperation;
package/components/Docs/HttpService/AdditionalInfo.stories.d.ts CHANGED
@@ -3,6 +3,6 @@ import { AdditionalInfo } from './AdditionalInfo';
3
3
  declare const meta: Meta<typeof AdditionalInfo>;
4
4
  export default meta;
5
5
  declare type Story = StoryObj<typeof AdditionalInfo>;
6
- export declare const LicenseNameAndURL: Story;
7
- export declare const LicenseNameAndIdentifier: Story;
8
- export declare const LicenseIdentifierAndNameAndUrl: Story;
6
+ export declare const LicenseWithOnlyURL: Story;
7
+ export declare const LicenseWithOnlyIdentifier: Story;
8
+ export declare const LicenseWithURLAndIdentifier: Story;
package/components/TryIt/Body/BinaryBody.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import { IMediaTypeContent } from '@stoplight/types';
2
+ import * as React from 'react';
3
+ import { BodyParameterValues } from './request-body-utils';
4
+ export interface BinaryBodyProps {
5
+ specification?: IMediaTypeContent;
6
+ values: BodyParameterValues;
7
+ onChangeValues: (newValues: BodyParameterValues) => void;
8
+ }
9
+ export declare const BinaryBody: React.FC<BinaryBodyProps>;
package/components/TryIt/Body/request-body-utils.d.ts CHANGED
@@ -3,11 +3,18 @@ import * as React from 'react';
3
3
  export declare type BodyParameterValues = Record<string, string | File>;
4
4
  export declare type ParameterOptional = Record<string, boolean>;
5
5
  export declare const isFormDataContent: (content: IMediaTypeContent) => boolean;
6
+ export declare const isBinaryContent: (content: IMediaTypeContent) => boolean;
6
7
  export declare function createRequestBody(mediaTypeContent: IMediaTypeContent | undefined, bodyParameterValues: BodyParameterValues | undefined): Promise<string | Blob | ArrayBuffer | ReadableStream<any> | ArrayBufferView | FormData | undefined>;
7
8
  export declare const useBodyParameterState: (mediaTypeContent: IMediaTypeContent | undefined) => readonly [BodyParameterValues, React.Dispatch<React.SetStateAction<BodyParameterValues>>, ParameterOptional, React.Dispatch<React.SetStateAction<ParameterOptional>>, {
8
9
  readonly isFormDataBody: true;
10
+ readonly isBinaryBody: false;
9
11
  readonly bodySpecification: IMediaTypeContent<false>;
10
12
  }] | readonly [BodyParameterValues, React.Dispatch<React.SetStateAction<BodyParameterValues>>, ParameterOptional, React.Dispatch<React.SetStateAction<ParameterOptional>>, {
11
13
  readonly isFormDataBody: false;
14
+ readonly isBinaryBody: true;
15
+ readonly bodySpecification: IMediaTypeContent<false>;
16
+ }] | readonly [BodyParameterValues, React.Dispatch<React.SetStateAction<BodyParameterValues>>, ParameterOptional, React.Dispatch<React.SetStateAction<ParameterOptional>>, {
17
+ readonly isFormDataBody: false;
18
+ readonly isBinaryBody: false;
12
19
  readonly bodySpecification: undefined;
13
20
  }];
package/components/TryIt/TryIt.d.ts CHANGED
@@ -7,6 +7,7 @@ export interface TryItProps {
7
7
  onRequestChange?: (currentRequest: HarRequest) => void;
8
8
  requestBodyIndex?: number;
9
9
  embeddedInMd?: boolean;
10
+ hideTryItPanel?: boolean;
10
11
  tryItCredentialsPolicy?: 'omit' | 'include' | 'same-origin';
11
12
  corsProxy?: string;
12
13
  }
package/components/TryIt/TryItWithRequestSamples.d.ts CHANGED
@@ -3,6 +3,7 @@ import { ResponseExamplesProps } from '../ResponseExamples/ResponseExamples';
3
3
  import { TryItProps } from './TryIt';
4
4
  export declare type TryItWithRequestSamplesProps = Omit<TryItProps, 'onRequestChange'> & ResponseExamplesProps & {
5
5
  hideTryIt?: boolean;
6
+ hideTryItPanel?: boolean;
6
7
  hideSamples?: boolean;
7
8
  };
8
9
  export declare const TryItWithRequestSamples: React.FC<TryItWithRequestSamplesProps>;
package/components/TryIt/TryItWithRequestSamples.stories.d.ts CHANGED
@@ -3,3 +3,4 @@ declare const _default: import("@storybook/types").ComponentAnnotations<import("
3
3
  export default _default;
4
4
  export declare const WithParameters: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, TryItWithRequestSamplesProps>;
5
5
  export declare const WithVariables: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, TryItWithRequestSamplesProps>;
6
+ export declare const WithoutTryItPanel: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, TryItWithRequestSamplesProps>;
package/components/TryIt/build-request.d.ts CHANGED
@@ -8,7 +8,7 @@ interface BuildRequestInput {
8
8
  mediaTypeContent: IMediaTypeContent | undefined;
9
9
  parameterValues: Dictionary<string, string>;
10
10
  serverVariableValues: Dictionary<string, string>;
11
- bodyInput?: BodyParameterValues | string;
11
+ bodyInput?: BodyParameterValues | string | File;
12
12
  mockData?: MockData;
13
13
  auth?: HttpSecuritySchemeWithValues[];
14
14
  chosenServer?: IServer | null;
package/index.esm.js CHANGED
@@ -1521,6 +1521,27 @@ function OneOfMenu({ choices: subSchemas, choice, onChange }) {
1521
1521
  return (React.createElement(Menu, { "aria-label": title, items: menuItems, renderTrigger: ({ isOpen }) => (React.createElement(Button, { appearance: "minimal", size: "sm", iconRight: ['fas', 'sort'], active: isOpen, "data-testid": "oneof-menu" }, title)) }));
1522
1522
  }
1523
1523
 
1524
+ const BinaryBody = ({ specification, values, onChangeValues }) => {
1525
+ const schema = React.useMemo(() => {
1526
+ var _a;
1527
+ const schema = (_a = specification === null || specification === void 0 ? void 0 : specification.schema) !== null && _a !== void 0 ? _a : {};
1528
+ const tree = new SchemaTree(schema, { mergeAllOf: true, refResolver: null });
1529
+ tree.populate();
1530
+ return tree.root.children[0];
1531
+ }, [specification]);
1532
+ const { selectedChoice, choices, setSelectedChoice } = useChoices(schema);
1533
+ const onSchemaChange = (choice) => {
1534
+ onChangeValues({});
1535
+ setSelectedChoice(choice);
1536
+ };
1537
+ return (React.createElement(Panel, { defaultIsOpen: true },
1538
+ React.createElement(Panel.Titlebar, { rightComponent: React.createElement(OneOfMenu, { choices: choices, choice: selectedChoice, onChange: onSchemaChange }) }, "Body"),
1539
+ React.createElement(Panel.Content, { className: "sl-overflow-y-auto ParameterGrid OperationParametersContent" },
1540
+ React.createElement(FileUploadParameterEditor, { key: 'file', parameter: { name: 'file' }, value: values.file instanceof File ? values.file : undefined, onChange: newValue => {
1541
+ newValue ? onChangeValues({ file: newValue }) : onChangeValues({});
1542
+ } }))));
1543
+ };
1544
+
1524
1545
  const fileToBase64 = (file) => new Promise((resolve, reject) => {
1525
1546
  const reader = new FileReader();
1526
1547
  reader.readAsDataURL(file);
@@ -1539,6 +1560,10 @@ function isUrlEncodedContent(content) {
1539
1560
  function isMultipartContent(content) {
1540
1561
  return content.mediaType.toLowerCase() === 'multipart/form-data';
1541
1562
  }
1563
+ const isBinaryContent = (content) => isApplicationOctetStream(content);
1564
+ function isApplicationOctetStream(content) {
1565
+ return content.mediaType.toLowerCase() === 'application/octet-stream';
1566
+ }
1542
1567
  function createRequestBody(mediaTypeContent, bodyParameterValues) {
1543
1568
  var _a;
1544
1569
  return __awaiter(this, void 0, void 0, function* () {
@@ -1580,16 +1605,17 @@ const requestBodyCreators = {
1580
1605
  };
1581
1606
  const useBodyParameterState = (mediaTypeContent) => {
1582
1607
  const isFormDataBody = mediaTypeContent && isFormDataContent(mediaTypeContent);
1608
+ const isBinaryBody = mediaTypeContent && isBinaryContent(mediaTypeContent);
1583
1609
  const initialState = React.useMemo(() => {
1584
1610
  var _a, _b, _c;
1585
- if (!isFormDataBody) {
1611
+ if (!isFormDataBody || isBinaryBody) {
1586
1612
  return {};
1587
1613
  }
1588
1614
  const properties = (_b = (_a = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.schema) === null || _a === void 0 ? void 0 : _a.properties) !== null && _b !== void 0 ? _b : {};
1589
1615
  const required = (_c = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.schema) === null || _c === void 0 ? void 0 : _c.required;
1590
1616
  const parameters = mapSchemaPropertiesToParameters(properties, required);
1591
1617
  return initialParameterValues(parameters);
1592
- }, [isFormDataBody, mediaTypeContent]);
1618
+ }, [isFormDataBody, isBinaryBody, mediaTypeContent]);
1593
1619
  const [bodyParameterValues, setBodyParameterValues] = React.useState(initialState);
1594
1620
  const [isAllowedEmptyValue, setAllowedEmptyValue] = React.useState({});
1595
1621
  React.useEffect(() => {
@@ -1601,7 +1627,16 @@ const useBodyParameterState = (mediaTypeContent) => {
1601
1627
  setBodyParameterValues,
1602
1628
  isAllowedEmptyValue,
1603
1629
  setAllowedEmptyValue,
1604
- { isFormDataBody: true, bodySpecification: mediaTypeContent },
1630
+ { isFormDataBody: true, isBinaryBody: false, bodySpecification: mediaTypeContent },
1631
+ ];
1632
+ }
1633
+ else if (isBinaryBody) {
1634
+ return [
1635
+ bodyParameterValues,
1636
+ setBodyParameterValues,
1637
+ isAllowedEmptyValue,
1638
+ setAllowedEmptyValue,
1639
+ { isFormDataBody: false, isBinaryBody: true, bodySpecification: mediaTypeContent },
1605
1640
  ];
1606
1641
  }
1607
1642
  else {
@@ -1610,7 +1645,7 @@ const useBodyParameterState = (mediaTypeContent) => {
1610
1645
  setBodyParameterValues,
1611
1646
  isAllowedEmptyValue,
1612
1647
  setAllowedEmptyValue,
1613
- { isFormDataBody: false, bodySpecification: undefined },
1648
+ { isFormDataBody: false, isBinaryBody: false, bodySpecification: undefined },
1614
1649
  ];
1615
1650
  }
1616
1651
  };
@@ -1753,7 +1788,7 @@ const getQueryParams = ({ httpOperation, parameterValues, }) => {
1753
1788
  if (value.length === 0)
1754
1789
  return acc;
1755
1790
  const explode = (_b = param.explode) !== null && _b !== void 0 ? _b : true;
1756
- if (((_c = param.schema) === null || _c === void 0 ? void 0 : _c.type) === 'object' && param.style === 'form' && value) {
1791
+ if (((_c = param.schema) === null || _c === void 0 ? void 0 : _c.type) === 'object' && value) {
1757
1792
  let nested;
1758
1793
  try {
1759
1794
  nested = JSON.parse(value);
@@ -1763,16 +1798,27 @@ const getQueryParams = ({ httpOperation, parameterValues, }) => {
1763
1798
  catch (e) {
1764
1799
  throw new Error(`Cannot use param value "${value}". JSON object expected.`);
1765
1800
  }
1766
- if (explode) {
1767
- acc.push(...Object.entries(nested).map(([name, value]) => ({ name, value: value.toString() })));
1801
+ if (param.style === 'form') {
1802
+ if (explode) {
1803
+ acc.push(...Object.entries(nested).map(([name, value]) => ({ name, value: value.toString() })));
1804
+ }
1805
+ else {
1806
+ acc.push({
1807
+ name: param.name,
1808
+ value: Object.entries(nested)
1809
+ .map(entry => entry.join(','))
1810
+ .join(','),
1811
+ });
1812
+ }
1813
+ }
1814
+ else if (param.style === 'deepObject') {
1815
+ acc.push(...Object.entries(nested).map(([name, value]) => ({
1816
+ name: `${param.name}[${name}]`,
1817
+ value: value.toString(),
1818
+ })));
1768
1819
  }
1769
1820
  else {
1770
- acc.push({
1771
- name: param.name,
1772
- value: Object.entries(nested)
1773
- .map(entry => entry.join(','))
1774
- .join(','),
1775
- });
1821
+ acc.push({ name: param.name, value });
1776
1822
  }
1777
1823
  }
1778
1824
  else if (((_d = param.schema) === null || _d === void 0 ? void 0 : _d.type) === 'array' && value) {
@@ -1821,7 +1867,9 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
1821
1867
  const expandedPath = uriExpand(httpOperation.path, parameterValues);
1822
1868
  const urlObject = new URL(serverUrl + expandedPath);
1823
1869
  urlObject.search = new URLSearchParams(queryParamsWithAuth.map(nameAndValueObjectToPair)).toString();
1824
- const body = typeof bodyInput === 'object' ? yield createRequestBody(mediaTypeContent, bodyInput) : bodyInput;
1870
+ const body = typeof bodyInput === 'object' && !(bodyInput instanceof File)
1871
+ ? yield createRequestBody(mediaTypeContent, bodyInput)
1872
+ : bodyInput;
1825
1873
  const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
1826
1874
  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' &&
1827
1875
  shouldIncludeBody && {
@@ -1911,23 +1959,33 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, serverVari
1911
1959
  if (shouldIncludeBody && typeof bodyInput === 'string') {
1912
1960
  postData = { mimeType, text: bodyInput };
1913
1961
  }
1914
- if (shouldIncludeBody && typeof bodyInput === 'object') {
1915
- postData = {
1916
- mimeType,
1917
- params: Object.entries(bodyInput).map(([name, value]) => {
1918
- if (value instanceof File) {
1919
- return {
1920
- name,
1921
- fileName: value.name,
1922
- contentType: value.type,
1923
- };
1924
- }
1925
- return {
1926
- name,
1927
- value,
1962
+ if (shouldIncludeBody) {
1963
+ if (typeof bodyInput === 'object') {
1964
+ if (mimeType === 'application/octet-stream' && bodyInput instanceof File) {
1965
+ postData = {
1966
+ mimeType,
1967
+ text: `@${bodyInput.name}`,
1928
1968
  };
1929
- }),
1930
- };
1969
+ }
1970
+ else {
1971
+ postData = {
1972
+ mimeType,
1973
+ params: Object.entries(bodyInput).map(([name, value]) => {
1974
+ if (value instanceof File) {
1975
+ return {
1976
+ name,
1977
+ fileName: value.name,
1978
+ contentType: value.type,
1979
+ };
1980
+ }
1981
+ return {
1982
+ name,
1983
+ value,
1984
+ };
1985
+ }),
1986
+ };
1987
+ }
1988
+ }
1931
1989
  }
1932
1990
  return {
1933
1991
  method: httpOperation.method.toUpperCase(),
@@ -2272,7 +2330,7 @@ const ServerVariables = ({ variables, values, onChangeValue }) => {
2272
2330
  };
2273
2331
 
2274
2332
  const defaultServers = [];
2275
- const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embeddedInMd = false, tryItCredentialsPolicy, corsProxy, }) => {
2333
+ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embeddedInMd = false, hideTryItPanel = false, tryItCredentialsPolicy, corsProxy, }) => {
2276
2334
  var _a, _b, _c, _d, _e, _f;
2277
2335
  TryIt.displayName = 'TryIt';
2278
2336
  const isDark = useThemeIsDark();
@@ -2302,6 +2360,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2302
2360
  previousValue[currentValue] = bodyParameterValues[currentValue];
2303
2361
  return previousValue;
2304
2362
  }, {});
2363
+ const getBinaryValue = () => bodyParameterValues.file;
2305
2364
  React.useEffect(() => {
2306
2365
  const currentUrl = chosenServer === null || chosenServer === void 0 ? void 0 : chosenServer.url;
2307
2366
  const exists = currentUrl && servers.find(s => s.url === currentUrl);
@@ -2316,7 +2375,11 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2316
2375
  let isMounted = true;
2317
2376
  if (isHttpOperation(httpOperation) && (onRequestChange || embeddedInMd)) {
2318
2377
  buildHarRequest(Object.assign(Object.assign({ mediaTypeContent, parameterValues: parameterValuesWithDefaults, serverVariableValues,
2319
- httpOperation, bodyInput: formDataState.isFormDataBody ? getValues() : textRequestBody, auth: operationAuthValue }, (isMockingEnabled && { mockData: getMockData(mockUrl, httpOperation, mockingOptions) })), { chosenServer,
2378
+ httpOperation, bodyInput: formDataState.isFormDataBody
2379
+ ? getValues()
2380
+ : formDataState.isBinaryBody
2381
+ ? getBinaryValue()
2382
+ : textRequestBody, auth: operationAuthValue }, (isMockingEnabled && { mockData: getMockData(mockUrl, httpOperation, mockingOptions) })), { chosenServer,
2320
2383
  corsProxy })).then(request => {
2321
2384
  if (isMounted) {
2322
2385
  if (onRequestChange) {
@@ -2357,7 +2420,11 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2357
2420
  serverVariableValues,
2358
2421
  httpOperation,
2359
2422
  mediaTypeContent,
2360
- bodyInput: formDataState.isFormDataBody ? getValues() : textRequestBody,
2423
+ bodyInput: formDataState.isFormDataBody
2424
+ ? getValues()
2425
+ : formDataState.isBinaryBody
2426
+ ? getBinaryValue()
2427
+ : textRequestBody,
2361
2428
  mockData,
2362
2429
  auth: operationAuthValue,
2363
2430
  chosenServer,
@@ -2397,7 +2464,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2397
2464
  ((_e = httpOperation.security) === null || _e === void 0 ? void 0 : _e.length) ? (React.createElement(TryItAuth, { operationSecuritySchemes: httpOperation.security, operationAuthValue: operationAuthValue, setOperationAuthValue: setOperationAuthValue, setCurrentScheme: setCurrentScheme })) : null,
2398
2465
  isHttpOperation(httpOperation) && serverVariables.length > 0 && (React.createElement(ServerVariables, { variables: serverVariables, values: serverVariableValues, onChangeValue: updateServerVariableValue })),
2399
2466
  allParameters.length > 0 && (React.createElement(OperationParameters, { parameters: allParameters, values: parameterValuesWithDefaults, onChangeValue: updateParameterValue, validate: validateParameters })),
2400
- React.createElement(Box, { pb: 1 }, formDataState.isFormDataBody ? (React.createElement(FormDataBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues, onChangeParameterAllow: setAllowedEmptyValues, isAllowedEmptyValues: isAllowedEmptyValues })) : mediaTypeContent ? (React.createElement(RequestBody, { examples: (_f = mediaTypeContent.examples) !== null && _f !== void 0 ? _f : [], requestBody: textRequestBody, onChange: setTextRequestBody })) : null),
2467
+ React.createElement(Box, { pb: 1 }, formDataState.isFormDataBody ? (React.createElement(FormDataBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues, onChangeParameterAllow: setAllowedEmptyValues, isAllowedEmptyValues: isAllowedEmptyValues })) : formDataState.isBinaryBody ? (React.createElement(BinaryBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues })) : mediaTypeContent ? (React.createElement(RequestBody, { examples: (_f = mediaTypeContent.examples) !== null && _f !== void 0 ? _f : [], requestBody: textRequestBody, onChange: setTextRequestBody })) : null),
2401
2468
  isHttpOperation(httpOperation) ? (React.createElement(Panel.Content, { className: "SendButtonHolder", pt: !isOnlySendButton && !embeddedInMd ? 0 : undefined },
2402
2469
  React.createElement(HStack, { alignItems: "center", spacing: 2 },
2403
2470
  React.createElement(Button, { appearance: "primary", loading: loading, disabled: loading, onPress: handleSendRequest, size: "sm" }, "Send API Request"),
@@ -2428,7 +2495,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2428
2495
  tryItPanelElem = (React.createElement(Box, { className: "TryItPanel", bg: "canvas-100" }, tryItPanelContents));
2429
2496
  }
2430
2497
  return (React.createElement(Box, { rounded: "lg", overflowY: "hidden" },
2431
- tryItPanelElem,
2498
+ hideTryItPanel ? null : tryItPanelElem,
2432
2499
  requestData && embeddedInMd && (React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples, embeddedInMd: true })),
2433
2500
  response && !('error' in response) && React.createElement(TryItResponse, { response: response }),
2434
2501
  response && 'error' in response && React.createElement(ResponseError, { state: response })));
@@ -2471,13 +2538,14 @@ const ResponseExamples = ({ httpOperation, responseMediaType, responseStatusCode
2471
2538
  };
2472
2539
 
2473
2540
  const TryItWithRequestSamples = (_a) => {
2474
- var { hideTryIt, hideSamples } = _a, props = __rest(_a, ["hideTryIt", "hideSamples"]);
2541
+ var { hideTryIt, hideTryItPanel, hideSamples } = _a, props = __rest(_a, ["hideTryIt", "hideTryItPanel", "hideSamples"]);
2475
2542
  const [requestData, setRequestData] = React.useState();
2476
2543
  const customCodeSamples = extractCodeSamples(props.httpOperation);
2477
2544
  return (React.createElement(VStack, { spacing: 6 },
2478
- !hideTryIt && (React.createElement(InvertTheme, null,
2545
+ !hideTryIt ? (React.createElement(InvertTheme, null,
2479
2546
  React.createElement(Box, null,
2480
- React.createElement(TryIt, Object.assign({}, props, { onRequestChange: setRequestData }))))),
2547
+ React.createElement(TryIt, Object.assign({}, props, { hideTryItPanel: hideTryItPanel, onRequestChange: setRequestData }))))) : (React.createElement(React.Fragment, null,
2548
+ React.createElement(TryIt, Object.assign({}, props, { hideTryItPanel: hideTryIt, onRequestChange: setRequestData })))),
2481
2549
  requestData && !hideSamples && React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
2482
2550
  React.createElement(ResponseExamples, Object.assign({}, props))));
2483
2551
  };
@@ -2936,7 +3004,7 @@ const HttpOperationComponent = React.memo(({ className, data: unresolvedData, la
2936
3004
  throw new RangeError('unsupported node type');
2937
3005
  }
2938
3006
  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) }));
2939
- 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 }));
3007
+ 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, hideTryItPanel: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel, hideSamples: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideSamples, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
2940
3008
  const descriptionChanged = nodeHasChanged === null || nodeHasChanged === void 0 ? void 0 : nodeHasChanged({ nodeId: data.id, attr: 'description' });
2941
3009
  const description = (React.createElement(VStack, { spacing: 10 },
2942
3010
  data.description && (React.createElement(Box, { pos: "relative" },
@@ -2966,7 +3034,7 @@ function MethodPathInner({ method, path, chosenServerUrl }) {
2966
3034
  const isDark = useThemeIsDark();
2967
3035
  const fullUrl = `${chosenServerUrl}${path}`;
2968
3036
  const pathElem = (React.createElement(Flex, { overflowX: "hidden", fontSize: "lg", userSelect: "all" },
2969
- React.createElement(Box, { dir: "rtl", textOverflow: "truncate", overflowX: "hidden" },
3037
+ React.createElement(Box, { dir: "ltr", textOverflow: "truncate", overflowX: "hidden" },
2970
3038
  React.createElement(Box, { as: "span", dir: "ltr", color: "muted", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl),
2971
3039
  React.createElement(Box, { as: "span", fontWeight: "semibold", flex: 1 }, path))));
2972
3040
  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 },
@@ -3009,7 +3077,11 @@ const AdditionalInfo = ({ id, termsOfService, contact, license }) => {
3009
3077
  : (contact === null || contact === void 0 ? void 0 : contact.email)
3010
3078
  ? `[Contact ${contact.name || contact.email}](mailto:${contact.email})`
3011
3079
  : '';
3012
- 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;
3080
+ const licenseUrl = (license === null || license === void 0 ? void 0 : license.url)
3081
+ ? license === null || license === void 0 ? void 0 : license.url
3082
+ : (license === null || license === void 0 ? void 0 : license.identifier)
3083
+ ? `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html`
3084
+ : undefined;
3013
3085
  const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl
3014
3086
  ? `[${license.name}](${licenseUrl})`
3015
3087
  : (license === null || license === void 0 ? void 0 : license.identifier) && licenseUrl
package/index.js CHANGED
@@ -1543,6 +1543,27 @@ function OneOfMenu({ choices: subSchemas, choice, onChange }) {
1543
1543
  return (React__namespace.createElement(mosaic.Menu, { "aria-label": title, items: menuItems, renderTrigger: ({ isOpen }) => (React__namespace.createElement(mosaic.Button, { appearance: "minimal", size: "sm", iconRight: ['fas', 'sort'], active: isOpen, "data-testid": "oneof-menu" }, title)) }));
1544
1544
  }
1545
1545
 
1546
+ const BinaryBody = ({ specification, values, onChangeValues }) => {
1547
+ const schema = React__namespace.useMemo(() => {
1548
+ var _a;
1549
+ const schema = (_a = specification === null || specification === void 0 ? void 0 : specification.schema) !== null && _a !== void 0 ? _a : {};
1550
+ const tree = new jsonSchemaTree.SchemaTree(schema, { mergeAllOf: true, refResolver: null });
1551
+ tree.populate();
1552
+ return tree.root.children[0];
1553
+ }, [specification]);
1554
+ const { selectedChoice, choices, setSelectedChoice } = jsonSchemaViewer.useChoices(schema);
1555
+ const onSchemaChange = (choice) => {
1556
+ onChangeValues({});
1557
+ setSelectedChoice(choice);
1558
+ };
1559
+ return (React__namespace.createElement(mosaic.Panel, { defaultIsOpen: true },
1560
+ React__namespace.createElement(mosaic.Panel.Titlebar, { rightComponent: React__namespace.createElement(OneOfMenu, { choices: choices, choice: selectedChoice, onChange: onSchemaChange }) }, "Body"),
1561
+ React__namespace.createElement(mosaic.Panel.Content, { className: "sl-overflow-y-auto ParameterGrid OperationParametersContent" },
1562
+ React__namespace.createElement(FileUploadParameterEditor, { key: 'file', parameter: { name: 'file' }, value: values.file instanceof File ? values.file : undefined, onChange: newValue => {
1563
+ newValue ? onChangeValues({ file: newValue }) : onChangeValues({});
1564
+ } }))));
1565
+ };
1566
+
1546
1567
  const fileToBase64 = (file) => new Promise((resolve, reject) => {
1547
1568
  const reader = new FileReader();
1548
1569
  reader.readAsDataURL(file);
@@ -1561,6 +1582,10 @@ function isUrlEncodedContent(content) {
1561
1582
  function isMultipartContent(content) {
1562
1583
  return content.mediaType.toLowerCase() === 'multipart/form-data';
1563
1584
  }
1585
+ const isBinaryContent = (content) => isApplicationOctetStream(content);
1586
+ function isApplicationOctetStream(content) {
1587
+ return content.mediaType.toLowerCase() === 'application/octet-stream';
1588
+ }
1564
1589
  function createRequestBody(mediaTypeContent, bodyParameterValues) {
1565
1590
  var _a;
1566
1591
  return tslib.__awaiter(this, void 0, void 0, function* () {
@@ -1602,16 +1627,17 @@ const requestBodyCreators = {
1602
1627
  };
1603
1628
  const useBodyParameterState = (mediaTypeContent) => {
1604
1629
  const isFormDataBody = mediaTypeContent && isFormDataContent(mediaTypeContent);
1630
+ const isBinaryBody = mediaTypeContent && isBinaryContent(mediaTypeContent);
1605
1631
  const initialState = React__namespace.useMemo(() => {
1606
1632
  var _a, _b, _c;
1607
- if (!isFormDataBody) {
1633
+ if (!isFormDataBody || isBinaryBody) {
1608
1634
  return {};
1609
1635
  }
1610
1636
  const properties = (_b = (_a = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.schema) === null || _a === void 0 ? void 0 : _a.properties) !== null && _b !== void 0 ? _b : {};
1611
1637
  const required = (_c = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.schema) === null || _c === void 0 ? void 0 : _c.required;
1612
1638
  const parameters = mapSchemaPropertiesToParameters(properties, required);
1613
1639
  return initialParameterValues(parameters);
1614
- }, [isFormDataBody, mediaTypeContent]);
1640
+ }, [isFormDataBody, isBinaryBody, mediaTypeContent]);
1615
1641
  const [bodyParameterValues, setBodyParameterValues] = React__namespace.useState(initialState);
1616
1642
  const [isAllowedEmptyValue, setAllowedEmptyValue] = React__namespace.useState({});
1617
1643
  React__namespace.useEffect(() => {
@@ -1623,7 +1649,16 @@ const useBodyParameterState = (mediaTypeContent) => {
1623
1649
  setBodyParameterValues,
1624
1650
  isAllowedEmptyValue,
1625
1651
  setAllowedEmptyValue,
1626
- { isFormDataBody: true, bodySpecification: mediaTypeContent },
1652
+ { isFormDataBody: true, isBinaryBody: false, bodySpecification: mediaTypeContent },
1653
+ ];
1654
+ }
1655
+ else if (isBinaryBody) {
1656
+ return [
1657
+ bodyParameterValues,
1658
+ setBodyParameterValues,
1659
+ isAllowedEmptyValue,
1660
+ setAllowedEmptyValue,
1661
+ { isFormDataBody: false, isBinaryBody: true, bodySpecification: mediaTypeContent },
1627
1662
  ];
1628
1663
  }
1629
1664
  else {
@@ -1632,7 +1667,7 @@ const useBodyParameterState = (mediaTypeContent) => {
1632
1667
  setBodyParameterValues,
1633
1668
  isAllowedEmptyValue,
1634
1669
  setAllowedEmptyValue,
1635
- { isFormDataBody: false, bodySpecification: undefined },
1670
+ { isFormDataBody: false, isBinaryBody: false, bodySpecification: undefined },
1636
1671
  ];
1637
1672
  }
1638
1673
  };
@@ -1775,7 +1810,7 @@ const getQueryParams = ({ httpOperation, parameterValues, }) => {
1775
1810
  if (value.length === 0)
1776
1811
  return acc;
1777
1812
  const explode = (_b = param.explode) !== null && _b !== void 0 ? _b : true;
1778
- if (((_c = param.schema) === null || _c === void 0 ? void 0 : _c.type) === 'object' && param.style === 'form' && value) {
1813
+ if (((_c = param.schema) === null || _c === void 0 ? void 0 : _c.type) === 'object' && value) {
1779
1814
  let nested;
1780
1815
  try {
1781
1816
  nested = JSON.parse(value);
@@ -1785,16 +1820,27 @@ const getQueryParams = ({ httpOperation, parameterValues, }) => {
1785
1820
  catch (e) {
1786
1821
  throw new Error(`Cannot use param value "${value}". JSON object expected.`);
1787
1822
  }
1788
- if (explode) {
1789
- acc.push(...Object.entries(nested).map(([name, value]) => ({ name, value: value.toString() })));
1823
+ if (param.style === 'form') {
1824
+ if (explode) {
1825
+ acc.push(...Object.entries(nested).map(([name, value]) => ({ name, value: value.toString() })));
1826
+ }
1827
+ else {
1828
+ acc.push({
1829
+ name: param.name,
1830
+ value: Object.entries(nested)
1831
+ .map(entry => entry.join(','))
1832
+ .join(','),
1833
+ });
1834
+ }
1835
+ }
1836
+ else if (param.style === 'deepObject') {
1837
+ acc.push(...Object.entries(nested).map(([name, value]) => ({
1838
+ name: `${param.name}[${name}]`,
1839
+ value: value.toString(),
1840
+ })));
1790
1841
  }
1791
1842
  else {
1792
- acc.push({
1793
- name: param.name,
1794
- value: Object.entries(nested)
1795
- .map(entry => entry.join(','))
1796
- .join(','),
1797
- });
1843
+ acc.push({ name: param.name, value });
1798
1844
  }
1799
1845
  }
1800
1846
  else if (((_d = param.schema) === null || _d === void 0 ? void 0 : _d.type) === 'array' && value) {
@@ -1843,7 +1889,9 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
1843
1889
  const expandedPath = uriExpand(httpOperation.path, parameterValues);
1844
1890
  const urlObject = new URL(serverUrl + expandedPath);
1845
1891
  urlObject.search = new URLSearchParams(queryParamsWithAuth.map(nameAndValueObjectToPair)).toString();
1846
- const body = typeof bodyInput === 'object' ? yield createRequestBody(mediaTypeContent, bodyInput) : bodyInput;
1892
+ const body = typeof bodyInput === 'object' && !(bodyInput instanceof File)
1893
+ ? yield createRequestBody(mediaTypeContent, bodyInput)
1894
+ : bodyInput;
1847
1895
  const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
1848
1896
  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' &&
1849
1897
  shouldIncludeBody && {
@@ -1933,23 +1981,33 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, serverVari
1933
1981
  if (shouldIncludeBody && typeof bodyInput === 'string') {
1934
1982
  postData = { mimeType, text: bodyInput };
1935
1983
  }
1936
- if (shouldIncludeBody && typeof bodyInput === 'object') {
1937
- postData = {
1938
- mimeType,
1939
- params: Object.entries(bodyInput).map(([name, value]) => {
1940
- if (value instanceof File) {
1941
- return {
1942
- name,
1943
- fileName: value.name,
1944
- contentType: value.type,
1945
- };
1946
- }
1947
- return {
1948
- name,
1949
- value,
1984
+ if (shouldIncludeBody) {
1985
+ if (typeof bodyInput === 'object') {
1986
+ if (mimeType === 'application/octet-stream' && bodyInput instanceof File) {
1987
+ postData = {
1988
+ mimeType,
1989
+ text: `@${bodyInput.name}`,
1950
1990
  };
1951
- }),
1952
- };
1991
+ }
1992
+ else {
1993
+ postData = {
1994
+ mimeType,
1995
+ params: Object.entries(bodyInput).map(([name, value]) => {
1996
+ if (value instanceof File) {
1997
+ return {
1998
+ name,
1999
+ fileName: value.name,
2000
+ contentType: value.type,
2001
+ };
2002
+ }
2003
+ return {
2004
+ name,
2005
+ value,
2006
+ };
2007
+ }),
2008
+ };
2009
+ }
2010
+ }
1953
2011
  }
1954
2012
  return {
1955
2013
  method: httpOperation.method.toUpperCase(),
@@ -2294,7 +2352,7 @@ const ServerVariables = ({ variables, values, onChangeValue }) => {
2294
2352
  };
2295
2353
 
2296
2354
  const defaultServers = [];
2297
- const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embeddedInMd = false, tryItCredentialsPolicy, corsProxy, }) => {
2355
+ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embeddedInMd = false, hideTryItPanel = false, tryItCredentialsPolicy, corsProxy, }) => {
2298
2356
  var _a, _b, _c, _d, _e, _f;
2299
2357
  TryIt.displayName = 'TryIt';
2300
2358
  const isDark = mosaic.useThemeIsDark();
@@ -2324,6 +2382,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2324
2382
  previousValue[currentValue] = bodyParameterValues[currentValue];
2325
2383
  return previousValue;
2326
2384
  }, {});
2385
+ const getBinaryValue = () => bodyParameterValues.file;
2327
2386
  React__namespace.useEffect(() => {
2328
2387
  const currentUrl = chosenServer === null || chosenServer === void 0 ? void 0 : chosenServer.url;
2329
2388
  const exists = currentUrl && servers.find(s => s.url === currentUrl);
@@ -2338,7 +2397,11 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2338
2397
  let isMounted = true;
2339
2398
  if (isHttpOperation(httpOperation) && (onRequestChange || embeddedInMd)) {
2340
2399
  buildHarRequest(Object.assign(Object.assign({ mediaTypeContent, parameterValues: parameterValuesWithDefaults, serverVariableValues,
2341
- httpOperation, bodyInput: formDataState.isFormDataBody ? getValues() : textRequestBody, auth: operationAuthValue }, (isMockingEnabled && { mockData: getMockData(mockUrl, httpOperation, mockingOptions) })), { chosenServer,
2400
+ httpOperation, bodyInput: formDataState.isFormDataBody
2401
+ ? getValues()
2402
+ : formDataState.isBinaryBody
2403
+ ? getBinaryValue()
2404
+ : textRequestBody, auth: operationAuthValue }, (isMockingEnabled && { mockData: getMockData(mockUrl, httpOperation, mockingOptions) })), { chosenServer,
2342
2405
  corsProxy })).then(request => {
2343
2406
  if (isMounted) {
2344
2407
  if (onRequestChange) {
@@ -2379,7 +2442,11 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2379
2442
  serverVariableValues,
2380
2443
  httpOperation,
2381
2444
  mediaTypeContent,
2382
- bodyInput: formDataState.isFormDataBody ? getValues() : textRequestBody,
2445
+ bodyInput: formDataState.isFormDataBody
2446
+ ? getValues()
2447
+ : formDataState.isBinaryBody
2448
+ ? getBinaryValue()
2449
+ : textRequestBody,
2383
2450
  mockData,
2384
2451
  auth: operationAuthValue,
2385
2452
  chosenServer,
@@ -2419,7 +2486,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2419
2486
  ((_e = httpOperation.security) === null || _e === void 0 ? void 0 : _e.length) ? (React__namespace.createElement(TryItAuth, { operationSecuritySchemes: httpOperation.security, operationAuthValue: operationAuthValue, setOperationAuthValue: setOperationAuthValue, setCurrentScheme: setCurrentScheme })) : null,
2420
2487
  isHttpOperation(httpOperation) && serverVariables.length > 0 && (React__namespace.createElement(ServerVariables, { variables: serverVariables, values: serverVariableValues, onChangeValue: updateServerVariableValue })),
2421
2488
  allParameters.length > 0 && (React__namespace.createElement(OperationParameters, { parameters: allParameters, values: parameterValuesWithDefaults, onChangeValue: updateParameterValue, validate: validateParameters })),
2422
- React__namespace.createElement(mosaic.Box, { pb: 1 }, formDataState.isFormDataBody ? (React__namespace.createElement(FormDataBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues, onChangeParameterAllow: setAllowedEmptyValues, isAllowedEmptyValues: isAllowedEmptyValues })) : mediaTypeContent ? (React__namespace.createElement(RequestBody, { examples: (_f = mediaTypeContent.examples) !== null && _f !== void 0 ? _f : [], requestBody: textRequestBody, onChange: setTextRequestBody })) : null),
2489
+ React__namespace.createElement(mosaic.Box, { pb: 1 }, formDataState.isFormDataBody ? (React__namespace.createElement(FormDataBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues, onChangeParameterAllow: setAllowedEmptyValues, isAllowedEmptyValues: isAllowedEmptyValues })) : formDataState.isBinaryBody ? (React__namespace.createElement(BinaryBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues })) : mediaTypeContent ? (React__namespace.createElement(RequestBody, { examples: (_f = mediaTypeContent.examples) !== null && _f !== void 0 ? _f : [], requestBody: textRequestBody, onChange: setTextRequestBody })) : null),
2423
2490
  isHttpOperation(httpOperation) ? (React__namespace.createElement(mosaic.Panel.Content, { className: "SendButtonHolder", pt: !isOnlySendButton && !embeddedInMd ? 0 : undefined },
2424
2491
  React__namespace.createElement(mosaic.HStack, { alignItems: "center", spacing: 2 },
2425
2492
  React__namespace.createElement(mosaic.Button, { appearance: "primary", loading: loading, disabled: loading, onPress: handleSendRequest, size: "sm" }, "Send API Request"),
@@ -2450,7 +2517,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2450
2517
  tryItPanelElem = (React__namespace.createElement(mosaic.Box, { className: "TryItPanel", bg: "canvas-100" }, tryItPanelContents));
2451
2518
  }
2452
2519
  return (React__namespace.createElement(mosaic.Box, { rounded: "lg", overflowY: "hidden" },
2453
- tryItPanelElem,
2520
+ hideTryItPanel ? null : tryItPanelElem,
2454
2521
  requestData && embeddedInMd && (React__namespace.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples, embeddedInMd: true })),
2455
2522
  response && !('error' in response) && React__namespace.createElement(TryItResponse, { response: response }),
2456
2523
  response && 'error' in response && React__namespace.createElement(ResponseError, { state: response })));
@@ -2493,13 +2560,14 @@ const ResponseExamples = ({ httpOperation, responseMediaType, responseStatusCode
2493
2560
  };
2494
2561
 
2495
2562
  const TryItWithRequestSamples = (_a) => {
2496
- var { hideTryIt, hideSamples } = _a, props = tslib.__rest(_a, ["hideTryIt", "hideSamples"]);
2563
+ var { hideTryIt, hideTryItPanel, hideSamples } = _a, props = tslib.__rest(_a, ["hideTryIt", "hideTryItPanel", "hideSamples"]);
2497
2564
  const [requestData, setRequestData] = React__namespace.useState();
2498
2565
  const customCodeSamples = extractCodeSamples(props.httpOperation);
2499
2566
  return (React__namespace.createElement(mosaic.VStack, { spacing: 6 },
2500
- !hideTryIt && (React__namespace.createElement(mosaic.InvertTheme, null,
2567
+ !hideTryIt ? (React__namespace.createElement(mosaic.InvertTheme, null,
2501
2568
  React__namespace.createElement(mosaic.Box, null,
2502
- React__namespace.createElement(TryIt, Object.assign({}, props, { onRequestChange: setRequestData }))))),
2569
+ React__namespace.createElement(TryIt, Object.assign({}, props, { hideTryItPanel: hideTryItPanel, onRequestChange: setRequestData }))))) : (React__namespace.createElement(React__namespace.Fragment, null,
2570
+ React__namespace.createElement(TryIt, Object.assign({}, props, { hideTryItPanel: hideTryIt, onRequestChange: setRequestData })))),
2503
2571
  requestData && !hideSamples && React__namespace.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
2504
2572
  React__namespace.createElement(ResponseExamples, Object.assign({}, props))));
2505
2573
  };
@@ -2958,7 +3026,7 @@ const HttpOperationComponent = React__namespace.memo(({ className, data: unresol
2958
3026
  throw new RangeError('unsupported node type');
2959
3027
  }
2960
3028
  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) }));
2961
- 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 }));
3029
+ 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, hideTryItPanel: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel, hideSamples: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideSamples, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
2962
3030
  const descriptionChanged = nodeHasChanged === null || nodeHasChanged === void 0 ? void 0 : nodeHasChanged({ nodeId: data.id, attr: 'description' });
2963
3031
  const description = (React__namespace.createElement(mosaic.VStack, { spacing: 10 },
2964
3032
  data.description && (React__namespace.createElement(mosaic.Box, { pos: "relative" },
@@ -2988,7 +3056,7 @@ function MethodPathInner({ method, path, chosenServerUrl }) {
2988
3056
  const isDark = mosaic.useThemeIsDark();
2989
3057
  const fullUrl = `${chosenServerUrl}${path}`;
2990
3058
  const pathElem = (React__namespace.createElement(mosaic.Flex, { overflowX: "hidden", fontSize: "lg", userSelect: "all" },
2991
- React__namespace.createElement(mosaic.Box, { dir: "rtl", textOverflow: "truncate", overflowX: "hidden" },
3059
+ React__namespace.createElement(mosaic.Box, { dir: "ltr", textOverflow: "truncate", overflowX: "hidden" },
2992
3060
  React__namespace.createElement(mosaic.Box, { as: "span", dir: "ltr", color: "muted", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl),
2993
3061
  React__namespace.createElement(mosaic.Box, { as: "span", fontWeight: "semibold", flex: 1 }, path))));
2994
3062
  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 },
@@ -3031,7 +3099,11 @@ const AdditionalInfo = ({ id, termsOfService, contact, license }) => {
3031
3099
  : (contact === null || contact === void 0 ? void 0 : contact.email)
3032
3100
  ? `[Contact ${contact.name || contact.email}](mailto:${contact.email})`
3033
3101
  : '';
3034
- 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;
3102
+ const licenseUrl = (license === null || license === void 0 ? void 0 : license.url)
3103
+ ? license === null || license === void 0 ? void 0 : license.url
3104
+ : (license === null || license === void 0 ? void 0 : license.identifier)
3105
+ ? `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html`
3106
+ : undefined;
3035
3107
  const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl
3036
3108
  ? `[${license.name}](${licenseUrl})`
3037
3109
  : (license === null || license === void 0 ? void 0 : license.identifier) && licenseUrl
package/index.mjs CHANGED
@@ -1521,6 +1521,27 @@ function OneOfMenu({ choices: subSchemas, choice, onChange }) {
1521
1521
  return (React.createElement(Menu, { "aria-label": title, items: menuItems, renderTrigger: ({ isOpen }) => (React.createElement(Button, { appearance: "minimal", size: "sm", iconRight: ['fas', 'sort'], active: isOpen, "data-testid": "oneof-menu" }, title)) }));
1522
1522
  }
1523
1523
 
1524
+ const BinaryBody = ({ specification, values, onChangeValues }) => {
1525
+ const schema = React.useMemo(() => {
1526
+ var _a;
1527
+ const schema = (_a = specification === null || specification === void 0 ? void 0 : specification.schema) !== null && _a !== void 0 ? _a : {};
1528
+ const tree = new SchemaTree(schema, { mergeAllOf: true, refResolver: null });
1529
+ tree.populate();
1530
+ return tree.root.children[0];
1531
+ }, [specification]);
1532
+ const { selectedChoice, choices, setSelectedChoice } = useChoices(schema);
1533
+ const onSchemaChange = (choice) => {
1534
+ onChangeValues({});
1535
+ setSelectedChoice(choice);
1536
+ };
1537
+ return (React.createElement(Panel, { defaultIsOpen: true },
1538
+ React.createElement(Panel.Titlebar, { rightComponent: React.createElement(OneOfMenu, { choices: choices, choice: selectedChoice, onChange: onSchemaChange }) }, "Body"),
1539
+ React.createElement(Panel.Content, { className: "sl-overflow-y-auto ParameterGrid OperationParametersContent" },
1540
+ React.createElement(FileUploadParameterEditor, { key: 'file', parameter: { name: 'file' }, value: values.file instanceof File ? values.file : undefined, onChange: newValue => {
1541
+ newValue ? onChangeValues({ file: newValue }) : onChangeValues({});
1542
+ } }))));
1543
+ };
1544
+
1524
1545
  const fileToBase64 = (file) => new Promise((resolve, reject) => {
1525
1546
  const reader = new FileReader();
1526
1547
  reader.readAsDataURL(file);
@@ -1539,6 +1560,10 @@ function isUrlEncodedContent(content) {
1539
1560
  function isMultipartContent(content) {
1540
1561
  return content.mediaType.toLowerCase() === 'multipart/form-data';
1541
1562
  }
1563
+ const isBinaryContent = (content) => isApplicationOctetStream(content);
1564
+ function isApplicationOctetStream(content) {
1565
+ return content.mediaType.toLowerCase() === 'application/octet-stream';
1566
+ }
1542
1567
  function createRequestBody(mediaTypeContent, bodyParameterValues) {
1543
1568
  var _a;
1544
1569
  return __awaiter(this, void 0, void 0, function* () {
@@ -1580,16 +1605,17 @@ const requestBodyCreators = {
1580
1605
  };
1581
1606
  const useBodyParameterState = (mediaTypeContent) => {
1582
1607
  const isFormDataBody = mediaTypeContent && isFormDataContent(mediaTypeContent);
1608
+ const isBinaryBody = mediaTypeContent && isBinaryContent(mediaTypeContent);
1583
1609
  const initialState = React.useMemo(() => {
1584
1610
  var _a, _b, _c;
1585
- if (!isFormDataBody) {
1611
+ if (!isFormDataBody || isBinaryBody) {
1586
1612
  return {};
1587
1613
  }
1588
1614
  const properties = (_b = (_a = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.schema) === null || _a === void 0 ? void 0 : _a.properties) !== null && _b !== void 0 ? _b : {};
1589
1615
  const required = (_c = mediaTypeContent === null || mediaTypeContent === void 0 ? void 0 : mediaTypeContent.schema) === null || _c === void 0 ? void 0 : _c.required;
1590
1616
  const parameters = mapSchemaPropertiesToParameters(properties, required);
1591
1617
  return initialParameterValues(parameters);
1592
- }, [isFormDataBody, mediaTypeContent]);
1618
+ }, [isFormDataBody, isBinaryBody, mediaTypeContent]);
1593
1619
  const [bodyParameterValues, setBodyParameterValues] = React.useState(initialState);
1594
1620
  const [isAllowedEmptyValue, setAllowedEmptyValue] = React.useState({});
1595
1621
  React.useEffect(() => {
@@ -1601,7 +1627,16 @@ const useBodyParameterState = (mediaTypeContent) => {
1601
1627
  setBodyParameterValues,
1602
1628
  isAllowedEmptyValue,
1603
1629
  setAllowedEmptyValue,
1604
- { isFormDataBody: true, bodySpecification: mediaTypeContent },
1630
+ { isFormDataBody: true, isBinaryBody: false, bodySpecification: mediaTypeContent },
1631
+ ];
1632
+ }
1633
+ else if (isBinaryBody) {
1634
+ return [
1635
+ bodyParameterValues,
1636
+ setBodyParameterValues,
1637
+ isAllowedEmptyValue,
1638
+ setAllowedEmptyValue,
1639
+ { isFormDataBody: false, isBinaryBody: true, bodySpecification: mediaTypeContent },
1605
1640
  ];
1606
1641
  }
1607
1642
  else {
@@ -1610,7 +1645,7 @@ const useBodyParameterState = (mediaTypeContent) => {
1610
1645
  setBodyParameterValues,
1611
1646
  isAllowedEmptyValue,
1612
1647
  setAllowedEmptyValue,
1613
- { isFormDataBody: false, bodySpecification: undefined },
1648
+ { isFormDataBody: false, isBinaryBody: false, bodySpecification: undefined },
1614
1649
  ];
1615
1650
  }
1616
1651
  };
@@ -1753,7 +1788,7 @@ const getQueryParams = ({ httpOperation, parameterValues, }) => {
1753
1788
  if (value.length === 0)
1754
1789
  return acc;
1755
1790
  const explode = (_b = param.explode) !== null && _b !== void 0 ? _b : true;
1756
- if (((_c = param.schema) === null || _c === void 0 ? void 0 : _c.type) === 'object' && param.style === 'form' && value) {
1791
+ if (((_c = param.schema) === null || _c === void 0 ? void 0 : _c.type) === 'object' && value) {
1757
1792
  let nested;
1758
1793
  try {
1759
1794
  nested = JSON.parse(value);
@@ -1763,16 +1798,27 @@ const getQueryParams = ({ httpOperation, parameterValues, }) => {
1763
1798
  catch (e) {
1764
1799
  throw new Error(`Cannot use param value "${value}". JSON object expected.`);
1765
1800
  }
1766
- if (explode) {
1767
- acc.push(...Object.entries(nested).map(([name, value]) => ({ name, value: value.toString() })));
1801
+ if (param.style === 'form') {
1802
+ if (explode) {
1803
+ acc.push(...Object.entries(nested).map(([name, value]) => ({ name, value: value.toString() })));
1804
+ }
1805
+ else {
1806
+ acc.push({
1807
+ name: param.name,
1808
+ value: Object.entries(nested)
1809
+ .map(entry => entry.join(','))
1810
+ .join(','),
1811
+ });
1812
+ }
1813
+ }
1814
+ else if (param.style === 'deepObject') {
1815
+ acc.push(...Object.entries(nested).map(([name, value]) => ({
1816
+ name: `${param.name}[${name}]`,
1817
+ value: value.toString(),
1818
+ })));
1768
1819
  }
1769
1820
  else {
1770
- acc.push({
1771
- name: param.name,
1772
- value: Object.entries(nested)
1773
- .map(entry => entry.join(','))
1774
- .join(','),
1775
- });
1821
+ acc.push({ name: param.name, value });
1776
1822
  }
1777
1823
  }
1778
1824
  else if (((_d = param.schema) === null || _d === void 0 ? void 0 : _d.type) === 'array' && value) {
@@ -1821,7 +1867,9 @@ function buildFetchRequest({ httpOperation, mediaTypeContent, bodyInput, paramet
1821
1867
  const expandedPath = uriExpand(httpOperation.path, parameterValues);
1822
1868
  const urlObject = new URL(serverUrl + expandedPath);
1823
1869
  urlObject.search = new URLSearchParams(queryParamsWithAuth.map(nameAndValueObjectToPair)).toString();
1824
- const body = typeof bodyInput === 'object' ? yield createRequestBody(mediaTypeContent, bodyInput) : bodyInput;
1870
+ const body = typeof bodyInput === 'object' && !(bodyInput instanceof File)
1871
+ ? yield createRequestBody(mediaTypeContent, bodyInput)
1872
+ : bodyInput;
1825
1873
  const acceptedMimeTypes = getAcceptedMimeTypes(httpOperation);
1826
1874
  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' &&
1827
1875
  shouldIncludeBody && {
@@ -1911,23 +1959,33 @@ function buildHarRequest({ httpOperation, bodyInput, parameterValues, serverVari
1911
1959
  if (shouldIncludeBody && typeof bodyInput === 'string') {
1912
1960
  postData = { mimeType, text: bodyInput };
1913
1961
  }
1914
- if (shouldIncludeBody && typeof bodyInput === 'object') {
1915
- postData = {
1916
- mimeType,
1917
- params: Object.entries(bodyInput).map(([name, value]) => {
1918
- if (value instanceof File) {
1919
- return {
1920
- name,
1921
- fileName: value.name,
1922
- contentType: value.type,
1923
- };
1924
- }
1925
- return {
1926
- name,
1927
- value,
1962
+ if (shouldIncludeBody) {
1963
+ if (typeof bodyInput === 'object') {
1964
+ if (mimeType === 'application/octet-stream' && bodyInput instanceof File) {
1965
+ postData = {
1966
+ mimeType,
1967
+ text: `@${bodyInput.name}`,
1928
1968
  };
1929
- }),
1930
- };
1969
+ }
1970
+ else {
1971
+ postData = {
1972
+ mimeType,
1973
+ params: Object.entries(bodyInput).map(([name, value]) => {
1974
+ if (value instanceof File) {
1975
+ return {
1976
+ name,
1977
+ fileName: value.name,
1978
+ contentType: value.type,
1979
+ };
1980
+ }
1981
+ return {
1982
+ name,
1983
+ value,
1984
+ };
1985
+ }),
1986
+ };
1987
+ }
1988
+ }
1931
1989
  }
1932
1990
  return {
1933
1991
  method: httpOperation.method.toUpperCase(),
@@ -2272,7 +2330,7 @@ const ServerVariables = ({ variables, values, onChangeValue }) => {
2272
2330
  };
2273
2331
 
2274
2332
  const defaultServers = [];
2275
- const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embeddedInMd = false, tryItCredentialsPolicy, corsProxy, }) => {
2333
+ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embeddedInMd = false, hideTryItPanel = false, tryItCredentialsPolicy, corsProxy, }) => {
2276
2334
  var _a, _b, _c, _d, _e, _f;
2277
2335
  TryIt.displayName = 'TryIt';
2278
2336
  const isDark = useThemeIsDark();
@@ -2302,6 +2360,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2302
2360
  previousValue[currentValue] = bodyParameterValues[currentValue];
2303
2361
  return previousValue;
2304
2362
  }, {});
2363
+ const getBinaryValue = () => bodyParameterValues.file;
2305
2364
  React.useEffect(() => {
2306
2365
  const currentUrl = chosenServer === null || chosenServer === void 0 ? void 0 : chosenServer.url;
2307
2366
  const exists = currentUrl && servers.find(s => s.url === currentUrl);
@@ -2316,7 +2375,11 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2316
2375
  let isMounted = true;
2317
2376
  if (isHttpOperation(httpOperation) && (onRequestChange || embeddedInMd)) {
2318
2377
  buildHarRequest(Object.assign(Object.assign({ mediaTypeContent, parameterValues: parameterValuesWithDefaults, serverVariableValues,
2319
- httpOperation, bodyInput: formDataState.isFormDataBody ? getValues() : textRequestBody, auth: operationAuthValue }, (isMockingEnabled && { mockData: getMockData(mockUrl, httpOperation, mockingOptions) })), { chosenServer,
2378
+ httpOperation, bodyInput: formDataState.isFormDataBody
2379
+ ? getValues()
2380
+ : formDataState.isBinaryBody
2381
+ ? getBinaryValue()
2382
+ : textRequestBody, auth: operationAuthValue }, (isMockingEnabled && { mockData: getMockData(mockUrl, httpOperation, mockingOptions) })), { chosenServer,
2320
2383
  corsProxy })).then(request => {
2321
2384
  if (isMounted) {
2322
2385
  if (onRequestChange) {
@@ -2357,7 +2420,11 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2357
2420
  serverVariableValues,
2358
2421
  httpOperation,
2359
2422
  mediaTypeContent,
2360
- bodyInput: formDataState.isFormDataBody ? getValues() : textRequestBody,
2423
+ bodyInput: formDataState.isFormDataBody
2424
+ ? getValues()
2425
+ : formDataState.isBinaryBody
2426
+ ? getBinaryValue()
2427
+ : textRequestBody,
2361
2428
  mockData,
2362
2429
  auth: operationAuthValue,
2363
2430
  chosenServer,
@@ -2397,7 +2464,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2397
2464
  ((_e = httpOperation.security) === null || _e === void 0 ? void 0 : _e.length) ? (React.createElement(TryItAuth, { operationSecuritySchemes: httpOperation.security, operationAuthValue: operationAuthValue, setOperationAuthValue: setOperationAuthValue, setCurrentScheme: setCurrentScheme })) : null,
2398
2465
  isHttpOperation(httpOperation) && serverVariables.length > 0 && (React.createElement(ServerVariables, { variables: serverVariables, values: serverVariableValues, onChangeValue: updateServerVariableValue })),
2399
2466
  allParameters.length > 0 && (React.createElement(OperationParameters, { parameters: allParameters, values: parameterValuesWithDefaults, onChangeValue: updateParameterValue, validate: validateParameters })),
2400
- React.createElement(Box, { pb: 1 }, formDataState.isFormDataBody ? (React.createElement(FormDataBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues, onChangeParameterAllow: setAllowedEmptyValues, isAllowedEmptyValues: isAllowedEmptyValues })) : mediaTypeContent ? (React.createElement(RequestBody, { examples: (_f = mediaTypeContent.examples) !== null && _f !== void 0 ? _f : [], requestBody: textRequestBody, onChange: setTextRequestBody })) : null),
2467
+ React.createElement(Box, { pb: 1 }, formDataState.isFormDataBody ? (React.createElement(FormDataBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues, onChangeParameterAllow: setAllowedEmptyValues, isAllowedEmptyValues: isAllowedEmptyValues })) : formDataState.isBinaryBody ? (React.createElement(BinaryBody, { specification: formDataState.bodySpecification, values: bodyParameterValues, onChangeValues: setBodyParameterValues })) : mediaTypeContent ? (React.createElement(RequestBody, { examples: (_f = mediaTypeContent.examples) !== null && _f !== void 0 ? _f : [], requestBody: textRequestBody, onChange: setTextRequestBody })) : null),
2401
2468
  isHttpOperation(httpOperation) ? (React.createElement(Panel.Content, { className: "SendButtonHolder", pt: !isOnlySendButton && !embeddedInMd ? 0 : undefined },
2402
2469
  React.createElement(HStack, { alignItems: "center", spacing: 2 },
2403
2470
  React.createElement(Button, { appearance: "primary", loading: loading, disabled: loading, onPress: handleSendRequest, size: "sm" }, "Send API Request"),
@@ -2428,7 +2495,7 @@ const TryIt = ({ httpOperation, mockUrl, onRequestChange, requestBodyIndex, embe
2428
2495
  tryItPanelElem = (React.createElement(Box, { className: "TryItPanel", bg: "canvas-100" }, tryItPanelContents));
2429
2496
  }
2430
2497
  return (React.createElement(Box, { rounded: "lg", overflowY: "hidden" },
2431
- tryItPanelElem,
2498
+ hideTryItPanel ? null : tryItPanelElem,
2432
2499
  requestData && embeddedInMd && (React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples, embeddedInMd: true })),
2433
2500
  response && !('error' in response) && React.createElement(TryItResponse, { response: response }),
2434
2501
  response && 'error' in response && React.createElement(ResponseError, { state: response })));
@@ -2471,13 +2538,14 @@ const ResponseExamples = ({ httpOperation, responseMediaType, responseStatusCode
2471
2538
  };
2472
2539
 
2473
2540
  const TryItWithRequestSamples = (_a) => {
2474
- var { hideTryIt, hideSamples } = _a, props = __rest(_a, ["hideTryIt", "hideSamples"]);
2541
+ var { hideTryIt, hideTryItPanel, hideSamples } = _a, props = __rest(_a, ["hideTryIt", "hideTryItPanel", "hideSamples"]);
2475
2542
  const [requestData, setRequestData] = React.useState();
2476
2543
  const customCodeSamples = extractCodeSamples(props.httpOperation);
2477
2544
  return (React.createElement(VStack, { spacing: 6 },
2478
- !hideTryIt && (React.createElement(InvertTheme, null,
2545
+ !hideTryIt ? (React.createElement(InvertTheme, null,
2479
2546
  React.createElement(Box, null,
2480
- React.createElement(TryIt, Object.assign({}, props, { onRequestChange: setRequestData }))))),
2547
+ React.createElement(TryIt, Object.assign({}, props, { hideTryItPanel: hideTryItPanel, onRequestChange: setRequestData }))))) : (React.createElement(React.Fragment, null,
2548
+ React.createElement(TryIt, Object.assign({}, props, { hideTryItPanel: hideTryIt, onRequestChange: setRequestData })))),
2481
2549
  requestData && !hideSamples && React.createElement(RequestSamples, { request: requestData, customCodeSamples: customCodeSamples }),
2482
2550
  React.createElement(ResponseExamples, Object.assign({}, props))));
2483
2551
  };
@@ -2936,7 +3004,7 @@ const HttpOperationComponent = React.memo(({ className, data: unresolvedData, la
2936
3004
  throw new RangeError('unsupported node type');
2937
3005
  }
2938
3006
  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) }));
2939
- 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 }));
3007
+ 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, hideTryItPanel: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideTryItPanel, hideSamples: layoutOptions === null || layoutOptions === void 0 ? void 0 : layoutOptions.hideSamples, tryItCredentialsPolicy: tryItCredentialsPolicy, mockUrl: mocking.hideMocking ? undefined : mocking.mockUrl, corsProxy: tryItCorsProxy }));
2940
3008
  const descriptionChanged = nodeHasChanged === null || nodeHasChanged === void 0 ? void 0 : nodeHasChanged({ nodeId: data.id, attr: 'description' });
2941
3009
  const description = (React.createElement(VStack, { spacing: 10 },
2942
3010
  data.description && (React.createElement(Box, { pos: "relative" },
@@ -2966,7 +3034,7 @@ function MethodPathInner({ method, path, chosenServerUrl }) {
2966
3034
  const isDark = useThemeIsDark();
2967
3035
  const fullUrl = `${chosenServerUrl}${path}`;
2968
3036
  const pathElem = (React.createElement(Flex, { overflowX: "hidden", fontSize: "lg", userSelect: "all" },
2969
- React.createElement(Box, { dir: "rtl", textOverflow: "truncate", overflowX: "hidden" },
3037
+ React.createElement(Box, { dir: "ltr", textOverflow: "truncate", overflowX: "hidden" },
2970
3038
  React.createElement(Box, { as: "span", dir: "ltr", color: "muted", style: { unicodeBidi: 'bidi-override' } }, chosenServerUrl),
2971
3039
  React.createElement(Box, { as: "span", fontWeight: "semibold", flex: 1 }, path))));
2972
3040
  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 },
@@ -3009,7 +3077,11 @@ const AdditionalInfo = ({ id, termsOfService, contact, license }) => {
3009
3077
  : (contact === null || contact === void 0 ? void 0 : contact.email)
3010
3078
  ? `[Contact ${contact.name || contact.email}](mailto:${contact.email})`
3011
3079
  : '';
3012
- 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;
3080
+ const licenseUrl = (license === null || license === void 0 ? void 0 : license.url)
3081
+ ? license === null || license === void 0 ? void 0 : license.url
3082
+ : (license === null || license === void 0 ? void 0 : license.identifier)
3083
+ ? `https://spdx.org/licenses/${license === null || license === void 0 ? void 0 : license.identifier}.html`
3084
+ : undefined;
3013
3085
  const licenseLink = (license === null || license === void 0 ? void 0 : license.name) && licenseUrl
3014
3086
  ? `[${license.name}](${licenseUrl})`
3015
3087
  : (license === null || license === void 0 ? void 0 : license.identifier) && licenseUrl
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoplight/elements-core",
3
- "version": "8.4.7",
3
+ "version": "8.5.1",
4
4
  "main": "./index.js",
5
5
  "sideEffects": [
6
6
  "web-components.min.js",
@@ -29,7 +29,7 @@
29
29
  "@stoplight/json-schema-ref-parser": "^9.2.7",
30
30
  "@stoplight/json-schema-sampler": "0.3.0",
31
31
  "@stoplight/json-schema-tree": "^4.0.0",
32
- "@stoplight/json-schema-viewer": "4.16.1",
32
+ "@stoplight/json-schema-viewer": "4.16.3",
33
33
  "@stoplight/markdown-viewer": "^5.7.1",
34
34
  "@stoplight/mosaic": "^1.53.4",
35
35
  "@stoplight/mosaic-code-editor": "^1.53.4",