> ## Documentation Index
> Fetch the complete documentation index at: https://react-docx.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Bookmark

Named anchor for internal document links.

```tsx theme={"dark"}
<Bookmark name="introduction">
  <H1>Introduction</H1>
</Bookmark>
```

***

## Props

| Prop       | Type        | Description                |
| ---------- | ----------- | -------------------------- |
| `name`     | `string`    | Unique bookmark identifier |
| `children` | `ReactNode` | Content to bookmark        |

***

## Usage

Create a bookmark target:

```tsx theme={"dark"}
<Bookmark name="section-1">
  <H1>Section 1</H1>
</Bookmark>
```

Link to it:

```tsx theme={"dark"}
<Paragraph>
  See <Link href="#section-1">Section 1</Link> for details.
</Paragraph>
```

***

## Common patterns

### Table of contents with bookmarks

```tsx theme={"dark"}
{/* Links */}
<Paragraph>
  <Link href="#intro">1. Introduction</Link>
</Paragraph>
<Paragraph>
  <Link href="#methods">2. Methods</Link>
</Paragraph>
<Paragraph>
  <Link href="#results">3. Results</Link>
</Paragraph>

<Hr />

{/* Bookmarked sections */}
<Bookmark name="intro">
  <H1>1. Introduction</H1>
</Bookmark>
<Paragraph>...</Paragraph>

<Bookmark name="methods">
  <H1>2. Methods</H1>
</Bookmark>
<Paragraph>...</Paragraph>

<Bookmark name="results">
  <H1>3. Results</H1>
</Bookmark>
<Paragraph>...</Paragraph>
```

### Cross-references

```tsx theme={"dark"}
<Paragraph>
  As shown in <Link href="#figure-1">Figure 1</Link>, the data indicates...
</Paragraph>

{/* Later in document */}
<Bookmark name="figure-1">
  <Paragraph className="font-bold">Figure 1: Sales Data</Paragraph>
</Bookmark>
<Image src="./chart.png" width="6in" />
```

### Bookmark on paragraph

```tsx theme={"dark"}
<Bookmark name="important-note">
  <Paragraph className="bg-yellow-100 p-2">
    This is an important note that can be linked to.
  </Paragraph>
</Bookmark>
```

***

## Naming conventions

Bookmark names should be:

* Unique within the document
* URL-safe (letters, numbers, hyphens)
* Descriptive

```tsx theme={"dark"}
// Good
<Bookmark name="executive-summary">
<Bookmark name="chapter-1">
<Bookmark name="appendix-a">

// Avoid
<Bookmark name="section 1">  // spaces
<Bookmark name="a">          // not descriptive
```

***

## Bookmark vs TableOfContents

| Feature             | Bookmark + Link | TableOfContents |
| ------------------- | --------------- | --------------- |
| Manual control      | Yes             | No              |
| Auto-generated      | No              | Yes             |
| Works with headings | Yes             | Yes (automatic) |
| Custom targets      | Yes             | No              |

Use `Bookmark` for custom navigation. Use `TableOfContents` for automatic heading-based navigation.
