Skip to main content

AI tools

Prompt

Copyable AI prompt with deep links to Cursor, Claude, ChatGPT, and other LLM platforms.

Usage

<Prompt> is the visual hook for NookDocs' LLM-first authoring story. It renders an AI prompt block with a copy button and one-click deep links to popular LLM platforms and IDEs.

<Prompt
  title="Scaffold a docs site"
  description="Paste this into Cursor with NookDocs MCP installed"
  targets={["cursor", "claude", "chatgpt"]}
>
  Create a NookDocs site for a REST API. Use the component library
  (Callout, Card, CodeGroup, Steps, ParamField, ResponseField).
  Include an introduction, quickstart, and 3 endpoint pages.
</Prompt>

Scaffold a docs site

Paste this into Cursor with NookDocs MCP installed

Create a NookDocs site for a REST API. Use the component library (Callout, Card, CodeGroup, Steps, ParamField, ResponseField). Include an introduction, quickstart, and 3 endpoint pages.

Why this exists

Most documentation platforms expect you to write content by hand. NookDocs assumes the reader will often hand the page off to an LLM — to extend it, debug it, or generate a companion. The Prompt component is the lightweight version of that handoff: a ready-to-use AI prompt the reader can copy or open in their tool of choice with a single click.

In Phase 3 the platform ships an MCP server that lets LLMs query the component library directly. Until then, Prompt is the bridge — it preloads the LLM with enough context to write valid NookDocs MDX without any tool integration.

Without metadata

The title and description props are optional. A bare prompt body still works:

<Prompt>
  Convert this OpenAPI spec to a NookDocs API reference page using
  the ParamField, ResponseField, and CodeGroup components.
</Prompt>

Convert this OpenAPI spec to a NookDocs API reference page using the ParamField, ResponseField, and CodeGroup components.

Target platforms

The targets prop controls which deep-link buttons appear. Default is ["cursor", "claude", "chatgpt"].

TargetPlatformDeep link protocol
cursorCursor IDEcursor://
claudeClaude.aihttps://claude.ai/new?q=...
chatgptChatGPThttps://chat.openai.com/?q=...
windsurfCodeium Windsurfwindsurf://chat?prompt=...
vscodeVS Code + Copilot Chatvscode://github.copilot-chat/...
perplexityPerplexityhttps://www.perplexity.ai/?q=...
<Prompt targets={["cursor", "claude", "chatgpt", "windsurf", "vscode", "perplexity"]}>
  Improve this documentation page for clarity and SEO.
</Prompt>

Improve this documentation page for clarity and SEO.

How copy + deep link work

The component walks the children tree and concatenates all text content into a single string. That string is what:

  1. Copy button writes to the system clipboard

  2. Open-in-X buttons URL-encode and append as a query parameter to the platform's deep link

So inline formatting in the children (markdown bold, links, etc.) is rendered visually inside the prompt body, but only the plain text ships to the LLM.

Use cases

Workflow templates

"Generate a complete API reference for my OpenAPI spec." Reader clicks Cursor, gets a working starter file.

Improve this page

Page-level prompt at the bottom: "Suggest improvements to this page using the NookDocs component library."

Code generation

"Implement a NookDocs component called <Foo> that does X." Drops the LLM into the right context.

Migration help

"Convert this Mintlify MDX file to NookDocs format." Pre-fills with the source the reader wants to migrate.

Phase 3 forward reference

When the LLM-first authoring phase ships, the Prompt component will gain three more capabilities:

  1. MCP-aware prompts — automatically include npx nookdocs-mcp install instructions for IDEs that support it

  2. Component spec injection — the prompt body can reference {components} and the platform inlines the full library spec on copy

  3. Page context auto-include<Prompt usePageContext> automatically appends the current page's MDX source to the prompt so the LLM sees the surrounding content

The current API stays — Phase 3 only adds. No breaking changes.

Actions prop (Mintlify compat)

The actions prop is an alias for targets. If you're migrating from Mintlify, existing markup that uses actions works without changes:

<Prompt actions={["cursor", "claude"]}>
  Refactor this component to use server actions.
</Prompt>

If both actions and targets are set, targets takes priority.

Props

PropTypeDefaultDescription
titlestringBold heading shown above the prompt body
descriptionstringOne-line description shown under the title
iconstringIcon beside the title, replacing the default sparkle
iconTypestringFont Awesome style, when the icon comes from that library
targets("cursor" | "claude" | "chatgpt" | "windsurf" | "vscode" | "perplexity")[]["cursor", "claude", "chatgpt"]Which deep-link buttons to render
actions("cursor" | "claude" | "chatgpt" | "windsurf" | "vscode" | "perplexity")[]Alias for targets (Mintlify compat)
childrenReactNoderequiredThe prompt body — can include markdown formatting
Was this page helpful?

Last updated August 11, 2026