@gitbook/react-openapi 1.5.4 → 1.5.6

package/dist/OpenAPISchemaName.js

@@ -1,4 +1,5 @@
 import { t, tString } from "./translate.js";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/OpenAPISchemaName.tsx
 /**
@@ -8,30 +9,49 @@ import { t, tString } from "./translate.js";
 function OpenAPISchemaName(props) {
 	const { schema, type, propertyName, required, isDiscriminatorProperty, context } = props;
 	const additionalItems = schema && getAdditionalItems(schema, context);
-	return <span className="openapi-schema-name">
-            {propertyName ? <span data-deprecated={schema?.deprecated} className="openapi-schema-propertyname">
-                    {propertyName}
-                </span> : null}
-            {isDiscriminatorProperty ? <span className="openapi-schema-discriminator">
-                    {t(context.translation, "discriminator")}
-                </span> : null}
-            {type || additionalItems ? <span>
-                    {schema?.const ? <span className="openapi-schema-type">const: {schema?.const}</span> : type ? <span className="openapi-schema-type">{type}</span> : null}
-                    {additionalItems ? <span className="openapi-schema-type">{additionalItems}</span> : null}
-                </span> : null}
-            {schema?.readOnly ? <span className="openapi-schema-readonly">
-                    {t(context.translation, "read_only")}
-                </span> : null}
-            {schema?.writeOnly ? <span className="openapi-schema-writeonly">
-                    {t(context.translation, "write_only")}
-                </span> : null}
-            {required === null ? null : required ? <span className="openapi-schema-required">
-                    {t(context.translation, "required")}
-                </span> : <span className="openapi-schema-optional">
-                    {t(context.translation, "optional")}
-                </span>}
-            {schema?.deprecated ? <span className="openapi-deprecated">{t(context.translation, "deprecated")}</span> : null}
-        </span>;
+	return /* @__PURE__ */ jsxs("span", {
+		className: "openapi-schema-name",
+		children: [
+			propertyName ? /* @__PURE__ */ jsx("span", {
+				"data-deprecated": schema?.deprecated,
+				className: "openapi-schema-propertyname",
+				children: propertyName
+			}) : null,
+			isDiscriminatorProperty ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-discriminator",
+				children: t(context.translation, "discriminator")
+			}) : null,
+			type || additionalItems ? /* @__PURE__ */ jsxs("span", { children: [schema?.const ? /* @__PURE__ */ jsxs("span", {
+				className: "openapi-schema-type",
+				children: ["const: ", schema?.const]
+			}) : type ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-type",
+				children: type
+			}) : null, additionalItems ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-type",
+				children: additionalItems
+			}) : null] }) : null,
+			schema?.readOnly ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-readonly",
+				children: t(context.translation, "read_only")
+			}) : null,
+			schema?.writeOnly ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-writeonly",
+				children: t(context.translation, "write_only")
+			}) : null,
+			required === null ? null : required ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-required",
+				children: t(context.translation, "required")
+			}) : /* @__PURE__ */ jsx("span", {
+				className: "openapi-schema-optional",
+				children: t(context.translation, "optional")
+			}),
+			schema?.deprecated ? /* @__PURE__ */ jsx("span", {
+				className: "openapi-deprecated",
+				children: t(context.translation, "deprecated")
+			}) : null
+		]
+	});
 }
 function getAdditionalItems(schema, context) {
 	let additionalItems = "";

package/dist/OpenAPISchemaServer.js

@@ -1,12 +1,20 @@
 import { decycle } from "./decycle.js";
 import { OpenAPIRootSchemaFromServer, OpenAPISchemaPropertiesFromServer } from "./OpenAPISchema.js";
+import { jsx } from "react/jsx-runtime";
 
 //#region src/OpenAPISchemaServer.tsx
 function OpenAPISchemaProperties(props) {
-	return <OpenAPISchemaPropertiesFromServer id={props.id} properties={JSON.stringify(props.properties, decycle())} context={props.context} />;
+	return /* @__PURE__ */ jsx(OpenAPISchemaPropertiesFromServer, {
+		id: props.id,
+		properties: JSON.stringify(props.properties, decycle()),
+		context: props.context
+	});
 }
 function OpenAPIRootSchema(props) {
-	return <OpenAPIRootSchemaFromServer schema={JSON.stringify(props.schema, decycle())} context={props.context} />;
+	return /* @__PURE__ */ jsx(OpenAPIRootSchemaFromServer, {
+		schema: JSON.stringify(props.schema, decycle()),
+		context: props.context
+	});
 }
 
 //#endregion

package/dist/OpenAPISecurities.js

@@ -6,6 +6,7 @@ import { createStateKey, extractOperationSecurityInfo, resolveDescription } from
 import { InteractiveSection } from "./InteractiveSection.js";
 import { OpenAPIRequiredScopes, OpenAPISchemaScopes } from "./OpenAPIRequiredScopes.js";
 import { Fragment } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/OpenAPISecurities.tsx
 /**
@@ -19,79 +20,146 @@ function OpenAPISecurities(props) {
 		securities
 	});
 	const stateKey = createStateKey("securities", context.blockKey);
-	return <>
-            <OpenAPIRequiredScopes context={context} stateKey={stateKey} securities={tabsData} />
-            <InteractiveSection header={t(context.translation, "authorizations")} stateKey={stateKey} toggleIcon={context.icons.chevronRight} selectIcon={context.icons.chevronDown} className="openapi-securities" tabs={tabsData.map(({ key, label, schemes }) => ({
-		key,
-		label,
-		body: <div className="openapi-schema">
-                            {schemes.map((security, index) => {
-			const description = security.type !== "oauth2" ? resolveDescription(security) : void 0;
-			return <div key={`${key}-${index}`} className="openapi-schema-presentation">
-                                        {getLabelForType(security, context)}
-                                        {description ? <Markdown source={description} className="openapi-securities-description" /> : null}
-                                    </div>;
-		})}
-                        </div>
-	}))} />
-        </>;
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(OpenAPIRequiredScopes, {
+		context,
+		stateKey,
+		securities: tabsData
+	}), /* @__PURE__ */ jsx(InteractiveSection, {
+		header: t(context.translation, "authorizations"),
+		stateKey,
+		toggleIcon: context.icons.chevronRight,
+		selectIcon: context.icons.chevronDown,
+		className: "openapi-securities",
+		tabs: tabsData.map(({ key, label, schemes }) => ({
+			key,
+			label,
+			body: /* @__PURE__ */ jsx("div", {
+				className: "openapi-schema",
+				children: schemes.map((security, index) => {
+					const description = security.type !== "oauth2" ? resolveDescription(security) : void 0;
+					return /* @__PURE__ */ jsxs("div", {
+						className: "openapi-schema-presentation",
+						children: [getLabelForType(security, context), description ? /* @__PURE__ */ jsx(Markdown, {
+							source: description,
+							className: "openapi-securities-description"
+						}) : null]
+					}, `${key}-${index}`);
+				})
+			})
+		}))
+	})] });
 }
 function getLabelForType(security, context) {
 	switch (security.type) {
-		case "apiKey": return <OpenAPISchemaName context={context} propertyName={security.name ?? "apiKey"} type="string" required={security.required} />;
+		case "apiKey": return /* @__PURE__ */ jsx(OpenAPISchemaName, {
+			context,
+			propertyName: security.name ?? "apiKey",
+			type: "string",
+			required: security.required
+		});
 		case "http":
-			if (security.scheme === "basic") return <OpenAPISchemaName context={context} propertyName="Authorization" type="string" required={security.required} />;
-			if (security.scheme === "bearer") return <>
-                        <OpenAPISchemaName context={context} propertyName="Authorization" type="string" required={security.required} />
-                        {			/** Show a default description if none is provided */}
-                        {!security.description ? <Markdown source={`Bearer authentication header of the form Bearer &lt;token&gt;.`} className="openapi-securities-description" /> : null}
-                    </>;
- return <OpenAPISchemaName context={context} propertyName="HTTP" required={security.required} />;
-		case "oauth2": return <OpenAPISchemaOAuth2Flows context={context} security={security} />;
-		case "openIdConnect": return <OpenAPISchemaName context={context} propertyName="OpenID Connect" required={security.required} />;
+			if (security.scheme === "basic") return /* @__PURE__ */ jsx(OpenAPISchemaName, {
+				context,
+				propertyName: "Authorization",
+				type: "string",
+				required: security.required
+			});
+			if (security.scheme === "bearer") return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(OpenAPISchemaName, {
+				context,
+				propertyName: "Authorization",
+				type: "string",
+				required: security.required
+			}), !security.description ? /* @__PURE__ */ jsx(Markdown, {
+				source: `Bearer authentication header of the form Bearer &lt;token&gt;.`,
+				className: "openapi-securities-description"
+			}) : null] });
+			return /* @__PURE__ */ jsx(OpenAPISchemaName, {
+				context,
+				propertyName: "HTTP",
+				required: security.required
+			});
+		case "oauth2": return /* @__PURE__ */ jsx(OpenAPISchemaOAuth2Flows, {
+			context,
+			security
+		});
+		case "openIdConnect": return /* @__PURE__ */ jsx(OpenAPISchemaName, {
+			context,
+			propertyName: "OpenID Connect",
+			required: security.required
+		});
 		default: return security.type;
 	}
 }
 function OpenAPISchemaOAuth2Flows(props) {
 	const { context, security } = props;
 	const flows = security.flows ? Object.entries(security.flows) : [];
-	return <div className="openapi-securities-oauth-flows">
-            {flows.map(([name, flow], index) => <Fragment key={index}>
-                    <OpenAPISchemaOAuth2Item flow={flow} name={name} context={context} security={security} />
-                    {index < flows.length - 1 ? <hr /> : null}
-                </Fragment>)}
-        </div>;
+	return /* @__PURE__ */ jsx("div", {
+		className: "openapi-securities-oauth-flows",
+		children: flows.map(([name, flow], index) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(OpenAPISchemaOAuth2Item, {
+			flow,
+			name,
+			context,
+			security
+		}), index < flows.length - 1 ? /* @__PURE__ */ jsx("hr", {}) : null] }, index))
+	});
 }
 function OpenAPISchemaOAuth2Item(props) {
 	const { flow, context, security, name } = props;
 	if (!flow) return null;
 	const scopes = !security.scopes?.length && flow.scopes ? Object.entries(flow.scopes) : [];
 	const description = resolveDescription(security);
-	return <div>
-            <OpenAPISchemaName context={context} propertyName="OAuth2" type={name} required={security.required} />
-            <div className="openapi-securities-oauth-content openapi-markdown">
-                {description ? <Markdown source={description} className="openapi-securities-description" /> : null}
-                {"authorizationUrl" in flow && flow.authorizationUrl ? <span>
-                        Authorization URL:{" "}
-                        <OpenAPICopyButton value={flow.authorizationUrl} context={context} className="openapi-securities-url" withTooltip>
-                            {flow.authorizationUrl}
-                        </OpenAPICopyButton>
-                    </span> : null}
-                {"tokenUrl" in flow && flow.tokenUrl ? <span>
-                        Token URL:{" "}
-                        <OpenAPICopyButton value={flow.tokenUrl} context={context} className="openapi-securities-url" withTooltip>
-                            {flow.tokenUrl}
-                        </OpenAPICopyButton>
-                    </span> : null}
-                {"refreshUrl" in flow && flow.refreshUrl ? <span>
-                        Refresh URL:{" "}
-                        <OpenAPICopyButton value={flow.refreshUrl} context={context} className="openapi-securities-url" withTooltip>
-                            {flow.refreshUrl}
-                        </OpenAPICopyButton>
-                    </span> : null}
-                {scopes.length ? <OpenAPISchemaScopes scopes={scopes} context={context} isOAuth2 /> : null}
-            </div>
-        </div>;
+	return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(OpenAPISchemaName, {
+		context,
+		propertyName: "OAuth2",
+		type: name,
+		required: security.required
+	}), /* @__PURE__ */ jsxs("div", {
+		className: "openapi-securities-oauth-content openapi-markdown",
+		children: [
+			description ? /* @__PURE__ */ jsx(Markdown, {
+				source: description,
+				className: "openapi-securities-description"
+			}) : null,
+			"authorizationUrl" in flow && flow.authorizationUrl ? /* @__PURE__ */ jsxs("span", { children: [
+				"Authorization URL:",
+				" ",
+				/* @__PURE__ */ jsx(OpenAPICopyButton, {
+					value: flow.authorizationUrl,
+					context,
+					className: "openapi-securities-url",
+					withTooltip: true,
+					children: flow.authorizationUrl
+				})
+			] }) : null,
+			"tokenUrl" in flow && flow.tokenUrl ? /* @__PURE__ */ jsxs("span", { children: [
+				"Token URL:",
+				" ",
+				/* @__PURE__ */ jsx(OpenAPICopyButton, {
+					value: flow.tokenUrl,
+					context,
+					className: "openapi-securities-url",
+					withTooltip: true,
+					children: flow.tokenUrl
+				})
+			] }) : null,
+			"refreshUrl" in flow && flow.refreshUrl ? /* @__PURE__ */ jsxs("span", { children: [
+				"Refresh URL:",
+				" ",
+				/* @__PURE__ */ jsx(OpenAPICopyButton, {
+					value: flow.refreshUrl,
+					context,
+					className: "openapi-securities-url",
+					withTooltip: true,
+					children: flow.refreshUrl
+				})
+			] }) : null,
+			scopes.length ? /* @__PURE__ */ jsx(OpenAPISchemaScopes, {
+				scopes,
+				context,
+				isOAuth2: true
+			}) : null
+		]
+	})] });
 }
 
 //#endregion

package/dist/OpenAPISelect.js

@@ -4,6 +4,7 @@
 import { getOrCreateStoreByKey } from "./getOrCreateStoreByKey.js";
 import clsx from "classnames";
 import { useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Button, ListBox, ListBoxItem, Popover, Select, SelectValue } from "react-aria-components";
 import { useStore } from "zustand";
 
@@ -19,26 +20,34 @@ function OpenAPISelect(props) {
 	const { icon, items, children, className, placement, stateKey, value, onChange, defaultValue } = props;
 	const state = useSelectState(stateKey, defaultValue ?? items[0]?.key);
 	const selected = items.find((item) => item.key === state.key) || items[0];
-	return <Select aria-label="OpenAPI Select" {...props} value={value ?? selected?.key} onChange={(key) => {
-		onChange?.(key);
-		state.setKey(key);
-	}} className={clsx("openapi-select", className)}>
-            <Button>
-                <SelectValue />
-                {icon !== null ? icon || "▼" : null}
-            </Button>
-            <Popover placement={placement} className="openapi-select-popover">
-                <ListBox className="openapi-select-listbox" items={items}>
-                    {children}
-                </ListBox>
-            </Popover>
-        </Select>;
+	return /* @__PURE__ */ jsxs(Select, {
+		"aria-label": "OpenAPI Select",
+		...props,
+		value: value ?? selected?.key,
+		onChange: (key) => {
+			onChange?.(key);
+			state.setKey(key);
+		},
+		className: clsx("openapi-select", className),
+		children: [/* @__PURE__ */ jsxs(Button, { children: [/* @__PURE__ */ jsx(SelectValue, {}), icon !== null ? icon || "▼" : null] }), /* @__PURE__ */ jsx(Popover, {
+			placement,
+			className: "openapi-select-popover",
+			children: /* @__PURE__ */ jsx(ListBox, {
+				className: "openapi-select-listbox",
+				items,
+				children
+			})
+		})]
+	});
 }
 function OpenAPISelectItem(props) {
-	return <ListBoxItem {...props} className={({ isFocused, isSelected }) => clsx("openapi-select-item", {
-		"openapi-select-item-focused": isFocused,
-		"openapi-select-item-selected": isSelected
-	}, props.className)} />;
+	return /* @__PURE__ */ jsx(ListBoxItem, {
+		...props,
+		className: ({ isFocused, isSelected }) => clsx("openapi-select-item", {
+			"openapi-select-item-focused": isFocused,
+			"openapi-select-item-selected": isSelected
+		}, props.className)
+	});
 }
 
 //#endregion

package/dist/OpenAPISpec.js

@@ -5,6 +5,7 @@ import { StaticSection } from "./StaticSection.js";
 import { OpenAPIRequestBody } from "./OpenAPIRequestBody.js";
 import { OpenAPIResponses } from "./OpenAPIResponses.js";
 import { OpenAPISecurities } from "./OpenAPISecurities.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/OpenAPISpec.tsx
 function OpenAPISpec(props) {
@@ -12,18 +13,32 @@ function OpenAPISpec(props) {
 	const { operation } = data;
 	const parameterGroups = groupParameters(deduplicateParameters(operation.parameters ?? []), context);
 	const securities = "securities" in data ? data.securities : [];
-	return <>
-            {securities.length > 0 ? <OpenAPISecurities key="securities" securityRequirement={operation.security} securities={securities} context={context} /> : null}
-
-            {parameterGroups.map((group) => {
-		return <StaticSection key={`parameter-${group.key}`} className="openapi-parameters" header={group.label}>
-                        <OpenAPISchemaProperties properties={group.parameters.map(parameterToProperty)} context={context} />
-                    </StaticSection>;
-	})}
-
-            {operation.requestBody ? <OpenAPIRequestBody key="body" requestBody={operation.requestBody} context={context} data={data} /> : null}
-            {operation.responses ? <OpenAPIResponses key="responses" responses={operation.responses} context={context} /> : null}
-        </>;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		securities.length > 0 ? /* @__PURE__ */ jsx(OpenAPISecurities, {
+			securityRequirement: operation.security,
+			securities,
+			context
+		}, "securities") : null,
+		parameterGroups.map((group) => {
+			return /* @__PURE__ */ jsx(StaticSection, {
+				className: "openapi-parameters",
+				header: group.label,
+				children: /* @__PURE__ */ jsx(OpenAPISchemaProperties, {
+					properties: group.parameters.map(parameterToProperty),
+					context
+				})
+			}, `parameter-${group.key}`);
+		}),
+		operation.requestBody ? /* @__PURE__ */ jsx(OpenAPIRequestBody, {
+			requestBody: operation.requestBody,
+			context,
+			data
+		}, "body") : null,
+		operation.responses ? /* @__PURE__ */ jsx(OpenAPIResponses, {
+			responses: operation.responses,
+			context
+		}, "responses") : null
+	] });
 }
 function groupParameters(parameters, context) {
 	const sorted = [

package/dist/OpenAPITooltip.js

@@ -2,20 +2,28 @@
 
 
 import clsx from "classnames";
+import { jsx } from "react/jsx-runtime";
 import { Tooltip, TooltipTrigger } from "react-aria-components";
 
 //#region src/OpenAPITooltip.tsx
 function OpenAPITooltip(props) {
 	const { children,...rest } = props;
-	return <TooltipTrigger {...rest} closeDelay={200} delay={200}>
-            {children}
-        </TooltipTrigger>;
+	return /* @__PURE__ */ jsx(TooltipTrigger, {
+		...rest,
+		closeDelay: 200,
+		delay: 200,
+		children
+	});
 }
 function OpenAPITooltipContent(props) {
 	const { children, placement = "top", offset = 4, className,...rest } = props;
-	return <Tooltip {...rest} placement={placement} offset={offset} className={clsx("openapi-tooltip", className)}>
-            {children}
-        </Tooltip>;
+	return /* @__PURE__ */ jsx(Tooltip, {
+		...rest,
+		placement,
+		offset,
+		className: clsx("openapi-tooltip", className),
+		children
+	});
 }
 OpenAPITooltip.Content = OpenAPITooltipContent;
 

package/dist/OpenAPIWebhook.d.ts

@@ -1,6 +1,6 @@
 import { OpenAPIContextInput } from "./context.js";
 import { OpenAPIWebhookData } from "./types.js";
-import * as react0 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/OpenAPIWebhook.d.ts
 /**
@@ -10,6 +10,6 @@ declare function OpenAPIWebhook(props: {
   className?: string;
   data: OpenAPIWebhookData;
   context: OpenAPIContextInput;
-}): react0.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { OpenAPIWebhook };

package/dist/OpenAPIWebhook.js

@@ -3,6 +3,7 @@ import { OpenAPIColumnSpec } from "./common/OpenAPIColumnSpec.js";
 import { OpenAPISummary } from "./common/OpenAPISummary.js";
 import { OpenAPIWebhookExample } from "./OpenAPIWebhookExample.js";
 import clsx from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/OpenAPIWebhook.tsx
 /**
@@ -11,17 +12,28 @@ import clsx from "classnames";
 function OpenAPIWebhook(props) {
 	const { className, data, context: contextInput } = props;
 	const context = resolveOpenAPIContext(contextInput);
-	return <div className={clsx("openapi-webhook", className)}>
-            <OpenAPISummary data={data} context={context} />
-            <div className="openapi-columns">
-                <OpenAPIColumnSpec data={data} context={context} />
-                <div className="openapi-column-preview">
-                    <div className="openapi-column-preview-body">
-                        <OpenAPIWebhookExample data={data} context={context} />
-                    </div>
-                </div>
-            </div>
-        </div>;
+	return /* @__PURE__ */ jsxs("div", {
+		className: clsx("openapi-webhook", className),
+		children: [/* @__PURE__ */ jsx(OpenAPISummary, {
+			data,
+			context
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "openapi-columns",
+			children: [/* @__PURE__ */ jsx(OpenAPIColumnSpec, {
+				data,
+				context
+			}), /* @__PURE__ */ jsx("div", {
+				className: "openapi-column-preview",
+				children: /* @__PURE__ */ jsx("div", {
+					className: "openapi-column-preview-body",
+					children: /* @__PURE__ */ jsx(OpenAPIWebhookExample, {
+						data,
+						context
+					})
+				})
+			})]
+		})]
+	});
 }
 
 //#endregion

package/dist/OpenAPIWebhookExample.js

@@ -3,6 +3,7 @@ import { createStateKey } from "./utils.js";
 import { getOpenAPIClientContext } from "./context.js";
 import { getExamples } from "./util/example.js";
 import { OpenAPIMediaTypeContent } from "./OpenAPIMediaType.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/OpenAPIWebhookExample.tsx
 function OpenAPIWebhookExample(props) {
@@ -14,12 +15,12 @@ function OpenAPIWebhookExample(props) {
 			if (!value?.schema) return {
 				key,
 				label: key,
-				body: <OpenAPIEmptyExample context={context} />
+				body: /* @__PURE__ */ jsx(OpenAPIEmptyExample, { context })
 			};
 			return {
 				key,
 				label: key,
-				body: <></>,
+				body: /* @__PURE__ */ jsx(Fragment, {}),
 				examples: getExamples({
 					mediaTypeObject: value,
 					mediaType: key,
@@ -28,12 +29,21 @@ function OpenAPIWebhookExample(props) {
 			};
 		});
 	})();
-	return <div className="openapi-panel">
-            <h4 className="openapi-panel-heading">Payload</h4>
-            <div className="openapi-panel-body">
-                <OpenAPIMediaTypeContent selectIcon={context.icons.chevronDown} stateKey={createStateKey("request-body-media-type", context.blockKey)} items={items} context={getOpenAPIClientContext(context)} />
-            </div>
-        </div>;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "openapi-panel",
+		children: [/* @__PURE__ */ jsx("h4", {
+			className: "openapi-panel-heading",
+			children: "Payload"
+		}), /* @__PURE__ */ jsx("div", {
+			className: "openapi-panel-body",
+			children: /* @__PURE__ */ jsx(OpenAPIMediaTypeContent, {
+				selectIcon: context.icons.chevronDown,
+				stateKey: createStateKey("request-body-media-type", context.blockKey),
+				items,
+				context: getOpenAPIClientContext(context)
+			})
+		})]
+	});
 }
 
 //#endregion