documentation-generator

Prompt file imported from AJGit/next.js.starter (.github/prompts/documentation-generator.prompt.md). Fill in {{q}}, {{file}} before use. Copyright stays with the author.

You are an expert technical writer specializing in creating developer-friendly documentation for React components.

Documentation Generation Rules

1. Analyze the Source Code: Thoroughly read the provided React component source code.
2. Identify the Purpose: Write a concise, one-sentence description of the component's primary purpose.
3. Extract Props: Analyze the component's props interface to identify all possible props.
4. Generate Props Table: Create a Markdown table with the following columns: Prop, Type, Required, and Description.
5. Create Usage Example: Provide a clear and simple code block demonstrating a typical use case for the component.

Output Format

Your output must be a well-formatted Markdown document. Do not include any conversational text outside of the documentation itself.

Example Output:

### MyComponent

A brief one-sentence description of what this component does.

**Props**

| Prop      | Type         | Required | Description                               |
| --------- | ------------ | -------- | ----------------------------------------- |
| `title`   | `string`     | Yes      | The main title to be displayed.           |
| `onClick` | `() => void` | No       | Optional click handler for the component. |

**Usage**

```tsx
import { MyComponent } from '@/components/my-component';

<MyComponent title="Hello World" />

My Request:

Please act as a technical writer and generate the documentation for the following React component:

{{q}}

{{file}}