Prompt, disclosure, and views

Use Mintlify-style prompt blocks, accordions, expandables, views, and visibility controls for progressive docs and agent-aware content.

Use this family when the docs should teach progressively. Prompt blocks give agents and developers a copyable instruction. Disclosure components hide optional detail until needed. View and visibility controls let the same page support human readers and agent contexts.

Progressive docs

Start with the shortest successful path, then reveal caveats, alternatives, and agent context as the reader needs them.

Prompt

Use Prompt for copyable agent instructions. Keep prompts concrete: name the product primitive, expected files, constraints, and verification step.

Generate an offer checkout button

Copy this into an agent when adding Plandalf to an existing site.

Create a Plandalf checkout button for an existing sales page.

  • Use the browser SDK.
  • Open offer offer_123 in a modal.
  • Listen for checkout completion.
  • Do not expose private API keys in browser code.
  • Link the docs page that explains Offers.
<Prompt title="Generate an offer checkout button" actions={["copy", "cursor"]}>
Create a Plandalf checkout button for an existing sales page.

- Use the browser SDK.
- Open offer `offer_123` in a modal.
- Do not expose private API keys in browser code.
</Prompt>

Accordions and expandables

Use accordions for grouped optional questions. Use Expandable for one local detail, especially nested API fields or implementation caveats.

Use an accordion when the reader may need the answer but should not be forced through it on the first pass.

If the detail changes the required path, keep it visible in the main flow.

purchase.customer.email is useful for fulfilment and CRM syncs, but it should stay inside a detailed field block until the page introduces purchase events.

<AccordionGroup>
  <Accordion title="When should this be an accordion?" icon="list-tree">
    Use an accordion when the reader may need the answer but should not be forced through it.
  </Accordion>
</AccordionGroup>

<Expandable title="Nested object example">
  `purchase.customer.email` is useful for fulfilment and CRM syncs.
</Expandable>

Views

Use adjacent View blocks when the same concept has different human, JavaScript, React, or agent presentations. The renderer turns adjacent views into a switcher.

Start by creating one test offer and connecting one visible checkout button. Keep the page focused on the sale the buyer is trying to complete.

Load the browser SDK, call openOffer, and handle completion from the returned flow handle.

Prefer the simplest working implementation first. Link to /docs/offers/overview when explaining what an offer contains.

<View title="Human" icon="user">
Start by creating one test offer and connecting one visible checkout button.
</View>

<View title="JavaScript" icon="js">
Load the browser SDK and call `openOffer`.
</View>

<View title="Agent" icon="sparkles">
Prefer the simplest working implementation first.
</View>

Visibility

Use Visibility when content should exist in source for a specific audience. Human-visible content renders on the public docs page. Agent-only content stays out of the human page.

This sentence is visible to readers and keeps the page understandable in the browser.

<Visibility for="humans">
This sentence is visible to readers.
</Visibility>

<Visibility for="agents">
Agent note: verify implementation claims before publishing.
</Visibility>

Prompt properties

titlestring

Optional heading above the prompt body.

descriptionstring

Short context line shown before the prompt text.

actionsarraydefault: ["copy"]

Supported prompt actions. Use ["copy", "cursor"] when the prompt should support both clipboard and Cursor handoff.

iconstring

Icon shown beside the prompt title.

copyLabelstringdefault: Copy prompt

Accessible label for the copy action.

cursorLabelstringdefault: Open in Cursor

Accessible label for the Cursor handoff action.

Disclosure properties

AccordionGroup.childrenAccordion[]required

Group related accordions so optional detail reads as one section, not scattered toggles.

Accordion.titlestringrequired

Visible accordion heading.

Accordion.iconstring

Icon shown beside the accordion title.

Accordion.defaultOpenbooleandefault: false

Opens the accordion on first load. Use sparingly for a detail that should be visible immediately.

Expandable.titlestring

Label for one inline reveal.

Expandable.defaultOpenbooleandefault: false

Opens the inline detail by default.

View and visibility properties

View.titlestringrequired

Label shown in the generated view switcher.

View.iconstring

Icon shown beside the view title.

View.whenalways | human | agentdefault: always

Controls whether the view is available in human or agent contexts.

View.forhumans | agents | human | agent

Compatibility alias for targeted views.

Visibility.forhumans | agentsrequired

Use humans for visible reader text and agents for source-only agent context.

Visibility.modevisible | hidden | human | agentdefault: visible

Compatibility mode for imported MDX that uses visibility labels instead of for.

Feature detail