Michael Ramos
bcddced148
* perf(review): debounce search highlights and O(1) active match swap Split the single search highlight effect into two paths: 1. Full rebuild (debounced 100ms) — fires on query/matches/file/style changes, collapsing rapid keystrokes into one DOM update instead of one per character typed. 2. Active swap (instant) — fires when stepping between matches (Enter/Shift+Enter), changing two elements' background color via querySelector instead of tearing down and rebuilding every <mark> in the shadow DOM. Also removes augmentedDiff from the effect deps (was triggering unnecessary rebuilds on context expansion) and exports clearSearchHighlights for the immediate-clear path on Escape. Closes #405 For provenance purposes, this commit was AI assisted. * perf(review): debounce search query and pre-index searchable lines The search input was laggy on large PRs because findReviewSearchMatches re-parsed every file's patch and scanned all lines synchronously on every keystroke, blocking React from re-rendering the input value. Two complementary fixes: 1. Pre-index: Build SearchableLine[] once when files change (useMemo), with pre-lowercased normalizedText, so matching skips repeated patch parsing and per-line toLowerCase() calls. 2. Debounced query: searchQuery updates instantly (input responsive), debouncedSearchQuery trails by 200ms and drives all expensive work. During the pending window, sidebar shows "Searching…", diff clears stale highlights, match count hides, and stepping is disabled. Also: refactors findReviewSearchMatches to delegate to the new findMatchesInIndex so there is a single matching implementation, removes the now-redundant 100ms DOM debounce in DiffViewer (query debounce handles it upstream), trims query in highlightQuery to prevent whitespace-only edits from breaking snippet highlighting, and restores augmentedDiff in the highlight effect deps. For provenance purposes, this commit was AI assisted.
Plannotator
Interactive Plan & Code Review for AI Coding Agents. Mark up and refine your plans or code diffs using a visual UI, share for team collaboration, and seamlessly integrate with Claude Code, OpenCode, Pi, and Codex.
Plan Mode Demos:
Claude Code
|
OpenCode
|
New: Code Review
Features
| Visual Plan Review | Built-in hook | Approve or deny agent plans with inline annotations |
| Plan Diff | Automatic | See what changed when the agent revises a plan |
| Code Review | /plannotator-review | View git diffs or remote PRs. Package annotations and ask AI about the code as you review. |
| Annotate Any File | /plannotator-annotate | Annotate any markdown file and send feedback to your agent |
| Annotate Last Message | /plannotator-last | Annotate the agent's last response and send structured feedback |
Sharing Plans
Plannotator lets you privately share plans, annotations, and feedback with colleagues. For example, a colleague can annotate a shared plan, and you can import their feedback to send directly back to the coding agent.
Small plans are encoded entirely in the URL hash. No server involved, nothing stored anywhere.
Large plans use a short link service with end-to-end encryption. Your plan is encrypted with AES-256-GCM in your browser before upload. The server stores only ciphertext it cannot read. The decryption key lives only in the URL you share. Pastes auto-delete after 7 days.
- Zero-knowledge storage, similar to PrivateBin
- Fully open source and self-hostable (see docs)
Install
Install for Claude Code
Install the plannotator command:
macOS / Linux / WSL:
curl -fsSL https://plannotator.ai/install.sh | bash
Windows PowerShell:
irm https://plannotator.ai/install.ps1 | iex
Then in Claude Code:
/plugin marketplace add backnotprop/plannotator
/plugin install plannotator@plannotator
# IMPORTANT: Restart Claude Code after plugin install
See apps/hook/README.md for detailed installation instructions including a manual hook approach.
Install for OpenCode
Add to your opencode.json:
{
"plugin": ["@plannotator/opencode@latest"]
}
Run the install script to get /plannotator-review:
curl -fsSL https://plannotator.ai/install.sh | bash
Windows:
irm https://plannotator.ai/install.ps1 | iex
This also clears any cached plugin versions. Then restart OpenCode.
Install for Pi
pi install npm:@plannotator/pi-extension
Then start Pi with --plan to enter plan mode, or toggle it during a session with /plannotator.
See apps/pi-extension/README.md for full usage details, commands, and flags.
Install for Codex
Install the plannotator command:
macOS / Linux / WSL:
curl -fsSL https://plannotator.ai/install.sh | bash
Windows PowerShell:
irm https://plannotator.ai/install.ps1 | iex
Then in Codex — feedback flows back into the agent loop automatically:
!plannotator review # Code review for current changes
!plannotator review <pr-url> # Review a GitHub pull request
!plannotator annotate file.md # Annotate a markdown file
!plannotator last # Annotate the last agent message
Plan mode is not yet supported.
See apps/codex/README.md for details.
How It Works
When your AI agent finishes planning, Plannotator:
- Opens the Plannotator UI in your browser
- Lets you annotate the plan visually (delete, insert, replace, comment)
- Approve → Agent proceeds with implementation
- Request changes → Your annotations are sent back as structured feedback
(Similar flow for code review, except you can also comment on specific lines of code diffs)
License
Copyright 2025-2026 backnotprop
This project is licensed under either of
- Apache License, Version 2.0 (http://www.apache.org/licenses/LICENSE-2.0)
- MIT license (http://opensource.org/licenses/MIT)
at your option.
Contribution
Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in this project by you, as defined in the Apache-2.0 license, shall be dual licensed as above, without any additional terms or conditions.