### Install Agentation Package

Source: https://agentation.dev/install/index

Installs the Agentation package using npm. This is the first step to integrate Agentation into your project. It can also be installed using yarn, pnpm, or bun.

```bash
npm install agentation
```

--------------------------------

### Install Agentation via Claude Code Skill

Source: https://agentation.dev/install/index

Installs the Agentation skill within Claude Code using npx. This command adds the necessary integration for Agentation to be set up automatically.

```bash
npx add-skill benjitaylor/agentation
```

--------------------------------

### Programmatic Integration with Agentation

Source: https://agentation.dev/install/index

Demonstrates programmatic integration of Agentation using the `onAnnotationAdd` callback and `copyToClipboard` prop. The `onAnnotationAdd` callback provides structured annotation data, and `copyToClipboard` can be set to false to prevent automatic copying.

```javascript
import { Agentation, type Annotation } from "agentation";


function App() {
  const handleAnnotation = (annotation: Annotation) => {
    // Structured data - no parsing needed
    console.log(annotation.element);
    console.log(annotation.elementPath);
    console.log(annotation.boundingBox);


    // Send to your agent, API, etc.
    sendToAgent(annotation);
  };


  return (
    <>
      <YourApp />
      <Agentation
        onAnnotationAdd={handleAnnotation}
        copyToClipboard={false}  // Skip clipboard if handling via callback
      />
    </>
  );
}
```

--------------------------------

### Add Agentation to React App

Source: https://agentation.dev/install/index

Integrates the Agentation component into a React application. It's recommended to add it at the root level. The NODE_ENV check ensures it only loads during development.

```javascript
import { Agentation } from "agentation";


function App() {
  return (
    <>
      <YourApp />
      {process.env.NODE_ENV === "development" && <Agentation />}
    </>
  );
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.