diff --git a/.changeset/sharp-doors-itch.md b/.changeset/sharp-doors-itch.md new file mode 100644 index 000000000..0de85c59e --- /dev/null +++ b/.changeset/sharp-doors-itch.md @@ -0,0 +1,7 @@ +--- +'@gitbook/openapi-parser': patch +'@gitbook/react-openapi': patch +'gitbook': patch +--- + +Render GitBook blocks in OpenAPI operation description diff --git a/packages/gitbook/src/app/middleware/(space)/~gitbook/pdf/page.tsx b/packages/gitbook/src/app/middleware/(space)/~gitbook/pdf/page.tsx index 41e48f7d0..c00855a31 100644 --- a/packages/gitbook/src/app/middleware/(space)/~gitbook/pdf/page.tsx +++ b/packages/gitbook/src/app/middleware/(space)/~gitbook/pdf/page.tsx @@ -244,8 +244,8 @@ async function PDFPageDocument(props: { {document ? ( ) { chevronRight: , plus: , }, - CodeBlock: PlainCodeBlock, + renderCodeBlock: (codeProps) => , + renderDocument: (documentProps) => ( + + ), renderHeading: (headingProps) => ( ({ key: `default-${generator.id}`, label: generator.label, - body: , + body: context.renderCodeBlock({ + code: generator.generate(input), + syntax: generator.syntax, + }), })); // Use custom samples if defined @@ -95,7 +98,10 @@ export function OpenAPICodeSample(props: { .map((sample) => ({ key: `redocly-${sample.lang}`, label: sample.label, - body: , + body: context.renderCodeBlock({ + code: sample.source, + syntax: sample.lang, + }), })); } }); diff --git a/packages/react-openapi/src/OpenAPIOperation.tsx b/packages/react-openapi/src/OpenAPIOperation.tsx index 47fd22d46..d28f49cac 100644 --- a/packages/react-openapi/src/OpenAPIOperation.tsx +++ b/packages/react-openapi/src/OpenAPIOperation.tsx @@ -7,6 +7,7 @@ import { OpenAPISpec } from './OpenAPISpec'; import type { OpenAPIClientContext, OpenAPIContextProps, OpenAPIOperationData } from './types'; import { OpenAPIPath } from './OpenAPIPath'; import { resolveDescription } from './utils'; +import { OpenAPICustomOperationProperties, OpenAPIV3 } from '@gitbook/openapi-parser'; /** * Display an interactive OpenAPI operation. @@ -25,8 +26,6 @@ export function OpenAPIOperation(props: { blockKey: context.blockKey, }; - const description = resolveDescription(operation); - return (
@@ -49,11 +48,7 @@ export function OpenAPIOperation(props: { {`.`}
) : null} - {description ? ( -
- -
- ) : null} +
@@ -67,3 +62,30 @@ export function OpenAPIOperation(props: { ); } + +function OpenAPIOperationDescription(props: { + operation: OpenAPIV3.OperationObject; + context: OpenAPIContextProps; +}) { + const { operation } = props; + if (operation['x-gitbook-description-document']) { + return ( +
+ {props.context.renderDocument({ + document: operation['x-gitbook-description-document'], + })} +
+ ); + } + + const description = resolveDescription(operation); + if (!description) { + return null; + } + + return ( +
+ +
+ ); +} diff --git a/packages/react-openapi/src/OpenAPIResponseExample.tsx b/packages/react-openapi/src/OpenAPIResponseExample.tsx index 466f42313..2439660f9 100644 --- a/packages/react-openapi/src/OpenAPIResponseExample.tsx +++ b/packages/react-openapi/src/OpenAPIResponseExample.tsx @@ -209,7 +209,7 @@ function OpenAPIExample(props: { return ; } - return ; + return context.renderCodeBlock({ code, syntax }); } function stringifyExample(args: { example: OpenAPIV3.ExampleObject; xml: boolean }): string | null { diff --git a/packages/react-openapi/src/types.ts b/packages/react-openapi/src/types.ts index 331da6b69..d652b11b0 100644 --- a/packages/react-openapi/src/types.ts +++ b/packages/react-openapi/src/types.ts @@ -5,8 +5,18 @@ import type { } from '@gitbook/openapi-parser'; export interface OpenAPIContextProps extends OpenAPIClientContext { - CodeBlock: React.ComponentType<{ code: string; syntax: string }>; + /** + * Render a code block. + */ + renderCodeBlock: (props: { code: string; syntax: string }) => React.ReactNode; + /** + * Render the heading of the operation. + */ renderHeading: (props: { deprecated: boolean; title: string }) => React.ReactNode; + /** + * Render the document of the operation. + */ + renderDocument: (props: { document: object }) => React.ReactNode; /** Spec url for the Scalar Api Client */ specUrl: string;