Skip to content

alexgorbatchev/agentation

 
 

Repository files navigation

Agentation

npm version downloads


Warning

Fork notice: this repository is a maintained fork of benjitaylor/agentation with several additions on top of upstream:

  • Annotation thread and reply UI
  • Deep select for piercing overlays
  • Alt hold-to-select mode with a crosshair cursor
  • Review queue for resolved annotations
  • MCP support for surfacing human thread replies
  • Storybook plus expanded automated test coverage
  • Neovim integration (nvim/README.md) and a local router daemon (router/README.md) for multi-project Neovim routing

Agentation is an agent-agnostic visual feedback tool. Click elements on your page, add notes, and copy structured output that helps AI coding agents find the exact code you're referring to.

Install

npm install agentation -D

Usage

import { Agentation } from 'agentation';

function App() {
  return (
    <>
      <YourApp />
      <Agentation />
    </>
  );
}

The toolbar appears in the bottom-right corner. Click to activate, then click any element to annotate it.

Features

  • Click to annotate – Click any element with automatic selector identification
  • Text selection – Select text to annotate specific content
  • Multi-select – Drag to select multiple elements at once
  • Area selection – Drag to annotate any region, even empty space
  • Animation pause – Freeze all animations (CSS, JS, videos) to capture specific states
  • Structured output – Copy markdown with selectors, positions, and context
  • Dark/light mode – Matches your preference or set manually
  • Zero dependencies – Pure CSS animations, no runtime libraries

How it works

Agentation captures class names, selectors, and element positions so AI agents can grep for the exact code you're referring to. Instead of describing "the blue button in the sidebar," you give the agent .sidebar > button.primary and your feedback.

Requirements

  • React 18+
  • Desktop browser (mobile not supported)

Docs

Full documentation at agentation.dev

Neovim/router docs:

  • nvim/README.md
  • router/README.md

Development

pnpm install
pnpm build
pnpm test

Router binaries are published via GitHub Actions on tags matching router-v*.

License

© 2026 Benji Taylor

Licensed under PolyForm Shield 1.0.0

About

The visual feedback tool for agents.

Resources

License

Contributing

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • TypeScript 88.5%
  • SCSS 4.9%
  • Go 2.7%
  • CSS 2.5%
  • Lua 1.2%
  • JavaScript 0.1%
  • Other 0.1%