Examples

The <RequestExample> and <ResponseExample> components display code blocks in the right sidebar to create a two-column layout that keeps examples visible while users scroll through your content. Use these components for API documentation, but they work on all pages.

Common use cases:

• API endpoint documentation with request and response examples
• Configuration examples alongside explanatory text
• Code samples that users reference while following instructions
• Before and after examples in tutorials

On mobile devices, <RequestExample> and <ResponseExample> components display as regular code blocks that users can scroll past.

curl --request POST \
  --url https://dog-api.kinduff.com/api/facts

{ "status": "success" }

RequestExample

Use <RequestExample> to pin code examples in the right sidebar. This component works similarly to the CodeGroup component, but displays the code in the sidebar instead of inline.

You can include multiple code blocks inside a single <RequestExample>. Each code block must have a title attribute.

<RequestExample>

```bash Request
curl --request POST \
  --url https://dog-api.kinduff.com/api/facts
```

</RequestExample>

ResponseExample

The <ResponseExample> component pins code examples in the right sidebar beneath any <RequestExample> content on the same page.

<ResponseExample>

```json Response
{ "status": "success" }
```

</ResponseExample>

Properties

Both <RequestExample> and <ResponseExample> accept the following properties: