Examples

Use request, response, and generic examples to keep copyable code beside the endpoint or concept a reader is viewing.

Examples render copyable code blocks with language labels and optional switchers. On API pages, RequestExample and ResponseExample clone into the desktop right rail and switch as the active endpoint changes.

Use the right example type

Use RequestExample for a call the reader sends, ResponseExample for what comes back, and Example for non-API snippets that should stay inline.

Keep side-panel examples together

If a page uses a right-rail Panel, put the request and response examples inside that panel. If the page documents API calls, use ApiEndpoint so examples stay tied to the active endpoint.

Request and response

Create a session

Request
curl -X POST "https://api.plandalf.com/api/checkout/sessions" \
  -H "Content-Type: application/json" \
  -H "Accept: application/json" \
  -d '{"offer":"pro-plan"}'
const response = await fetch("https://api.plandalf.com/api/checkout/sessions", {
  method: "POST",
  headers: { "Content-Type": "application/json", Accept: "application/json" },
  body: JSON.stringify({ offer: "pro-plan" })
});

Session response

Response
{
  "session": {
    "id": "cs_123",
    "status": "open"
  }
}
<RequestExample title="Create a session" labels={["Shell", "JavaScript"]}>
  ```bash title="POST /api/checkout/sessions"
  curl -X POST "https://api.plandalf.com/api/checkout/sessions"
  ```

  ```js title="create-session.js"
  await fetch("https://api.plandalf.com/api/checkout/sessions", { method: "POST" });
  ```
</RequestExample>

<ResponseExample title="Session response" labels={["JSON"]}>
  ```json title="201 checkout session"
  { "session": { "id": "cs_123", "status": "open" } }
  ```
</ResponseExample>

Generic examples

Use Example for short code that is not an API request or response. It still gets language labels, copy controls, and optional dropdown behavior.

Declarative button

Example
<button
  data-plandalf-offer="pro-plan"
  data-plandalf-mode="modal"
>
  Buy now
</button>
export function BuyButton() {
  return (
    <button onClick={() => plandalf.openOffer({ offerId: "pro-plan" })}>
      Buy now
    </button>
  );
}

Use dropdown when there are too many languages for a horizontal tab row.

Install SDK

Request
npm install @plandalf/js
pnpm add @plandalf/js
yarn add @plandalf/js

Right-rail patterns

Where examples belong

Inside ApiEndpointAPI reference

Use this for endpoint pages. The request and response examples clone into the API rail and switch with the active call.

Inside Panelside context

Use this when a guide needs a pinned sidebar sample but is not primarily an endpoint reference.

Inline with rail={false}component docs

Use this in component reference pages so the example appears exactly where it is being explained.

Properties

Both RequestExample and ResponseExample accept this Mintlify property.

Plandalf extensions

titlestring

Heading for the example block.

labelsstring[]

Labels multiple fenced code blocks when the code titles are not enough.

railbooleandefault: true

Controls whether request and response examples clone into the API right rail.

typerequest | response | exampledefault: example

RequestExample and ResponseExample set this automatically. Use Example directly for non-API snippets.

statusstring | number

Adds an HTTP status badge to response examples and response variant controls in the API rail.

statusTextstring

Adds the human-readable HTTP status text for response examples.

Authoring rules

  • Put request and response examples inside the same ApiEndpoint as their fields.
  • Use equivalent snippets when multiple languages appear in one example.
  • Keep response examples realistic and small enough to scan in the right rail.
  • Set rail={false} on component docs pages so examples stay inline.
  • Use CodeGroup when the code is the main content, and Example when the snippet supports a field or endpoint.

Feature detail