Live Agentic HTML Editor (Lahe)

We've graduated from MD to HTML for many of our docs. Or maybe you just want to edit your homepage in place. Lahe is injectable into any HTML on your machine, and provides direct editing, as well as threaded conversations for agentic updates.

Why

We're now spending a significant amount of our time reviewing and editing documentation, prompts, and HTML pages. It's not fast enough to copy a paragraph and bring it back to paste into your agent and ask for edits.

Lahe adds a live review layer to any HTML that's on your machine (including pages that are composed of many underlying files). Select a sentence and comment on it, or press an edit key and rewrite it in place.

No matter how many files were used to create the HTML page, Lahe knows how to edit the underlying source. And if you asked a question, don't let the answer get lost in the neverending chat flow. Threaded sidebar conversations mean the answer is always easy to find.

Features

Leaving feedback

• Comment for an agentic rewrite. Select a passage, say what is wrong, and let the agent write the fix.

• Comment on any object, not just text. Press Cmd-Shift-C with nothing selected to pick an element: hover to outline it, click to comment. Diagrams, images, charts, a whole section.

• Edit to use your own words. Type the correction into the page. Your exact words reach the source file, not a paraphrase with added em dashes.

• Write new text in place. Add paragraphs, headings, and bulleted or numbered lists after any block, or start a notes page from nothing with lahe write notes.md. A long piece gets a proofreading question, and your words are placed as you typed them.

• Ask questions and get threaded answers. Ask a question and the answer arrives on the same card, no need to go back to the chat window. An exchange from ten minutes ago is threaded and easy to find, not lost in the neverending scroll of the chat window.

• Drafted until sent. A half-typed thought is private to your browser until you hit Cmd-Enter.

• Zoom into big diagrams. Hover a graph or a large image and click the magnifier at its corner. It opens full screen: scroll to zoom toward the pointer, drag to move around, Esc to close. Graphs stay sharp at any zoom.

• Hotkeys for speed. Comment, edit, and send without reaching for the mouse.

• Save as PDF. A button in the rail asks your agent to turn the page into a PDF, in one click.

• Hand-made edits are protected. If a doc-wide change would clobber your carefully crafted text, it stops at text you placed by hand and asks. If an edit gets reverted anyway, the item reopens itself.

Working with the source

• Many source files, one page to review. A page built from templates, includes, or partials is reviewed as a single built page. The agent edits the underlying files.
• Markdown or HTML. A .md file (or multiple) is rendered for editing, diagrams included. Your prompt is assembled from multiple underlying modular files? No worries, live edit the rendered output as a single page and let your agent edit the underlying template files.

Many reviews, many agents

• One agent, many reviews. A single agent can handle multiple review sessions, each with their own conversations.
• A review can follow you across pages. Click through a site and each page shows only the edits you left on that page. The agent keeps all of it across pages.
• Several agents at once, without collisions. Every review has a session owner. Three agents on three documents never see each other's items, and a watcher only ever wakes for its own session.
• Clean handovers. Just ask a different agent to take over a live or a closed session. Start with Claude and switch to Codex, no problem.

Staying in sync

• Local server, hot updates. The agent lands a change and the page updates itself.
• Smart reloads wait for you. A reload holds while you are typing a comment or mid-edit, then swaps the page and puts your outstanding work in when you're in between comments.
• Live status. The rail shows at a glance that your agent is connected, and when feedback goes unanswered it says how long and offers to export it.
• Unread answers are pointed out. The agent flags replies you should actually read, so a routine confirmation stays quiet and a real answer does not.

No lost work!

• Several fallbacks for saving your feedback. Save to browser storage on every keystroke. Queue in an outbox that survives a reload or a hard kill. Retries with backoff while the helper is away. Append to a durable event log on disk. And "Copy review" and "Export review to file" if nothing else is working or you want to carry it out by hand.
• Session restarts. Prior sessions can be revived or picked up after a crash, without losing what is unanswered.
• Multi-tab detection. You have 10^1000 tabs open and you opened the same page twice? The second tab says so, and lets you move control to the tab you are actually using.

Under the hood

• No service in the middle. There is no Lahe account, no Lahe server, and no telemetry. Your feedback goes to the agent you already use, the same place it would go if you pasted it into the chat, and nowhere else.
• Zero model tokens while you are quiet. A push model taps agents only when you send a comment, so a document left open overnight doesn't burn your tokens on no-ops.
• Your app keeps working normally. Highlighting a passage does not add anything to your page, so your own buttons, layout, and scripts behave exactly as they did.
• Clone and go. Clone the repo and ask your agent to finish the setup. All the instructions are packaged within.

Document styles

Every page an agent writes for review, and every Markdown file Lahe renders, uses a full document style with ready-made components: stat tiles, callouts, tables, step sequences, badges, pull quotes, image layouts, and more. Your agent reaches for them instead of writing bare paragraphs, so a plan or a report reads like a finished page from the first render, with no styling work.

Switch the whole style from the rail. Click the swatch button at the top of the rail to open Document style. One click previews any installed style on the page you are reviewing, fonts and layout included. Like one? "Ask the agent to use it" writes it into the document, so it stays. International Style ships free with Lahe. More styles, the Lahe Styles, install with lahe style add <folder>.

The full list of components, with the markup for each, is in vendor/stclair-doc-style/COMPONENTS.md.

The Library

Every review and document on your machine is listed on one page, the Library. Run lahe library and open the address it prints. Reviews are grouped by agent session, with the ones that have unanswered comments at the top.

From a row you can:

• Open the document, even if its server has stopped.
• Star it, or rename it by clicking its name.
• Hand it to an agent: have your attached agent pick it up, or launch a new one on it.
• Search titles, files, folders and sessions, or narrow the list to one project.

The Library reads only files on disk and talks only to the helper on your machine. A rename or a star is never sent to an agent.

Addresses that stay put

Every document gets one address for good: its folder and two parent folders as
the name, then the file, as in
http://docs.features.my-plan.lahe.localhost:1483/brief.md. Bookmark it, and
your unsent drafts come back when you open it again. Run lahe install once and
the address loads after a session ends and after a reboot, with nothing to start
first. On macOS, lahe install --port-80 drops the :1483, and
lahe install --lahe-names adds a short <name>.lahe alias. Both are optional.
See docs/INSTALL.md.

Quickstart

Clone it, and hand the rest to your agent:

git clone https://github.com/kenxle/live-agentic-html-editor

Set up Live Agentic HTML Editor from ./live-agentic-html-editor, following its AGENTS.md, then use it to review path/to/page.html.

Your agent installs the command, opens the review, and starts watching. Open the URL it prints, select some text, and press Cmd-Shift-C. It works each item as you commit it and answers on the card.

If your agent already has the Lahe skill installed, that first line is all it needs:

Use Lahe to review path/to/page.html.

Or set it up yourself

cd live-agentic-html-editor
npm run install-cli                       # writes ~/.local/bin/lahe
lahe review path/to/page.html             # or path/to/notes.md
lahe write notes/today.md                 # a blank notes page to write into
lahe install                              # optional: keep addresses working after sessions end and reboots
brew install pandoc                       # optional: draws ::: fenced divs in Markdown (or see pandoc.org/installing.html)

Which agents this works with

Each host wakes an agent differently, so each gets its own instruction. The agent reads this from the review itself, so you do not have to remember it.

An idle review costs no model tokens on any of them. The watcher is a small local process, never a scheduled model wakeup.

The gestures

The rail also shows these as hints, so you do not need this file open to work them out.

When something goes wrong

• The helper is not running. The page still opens, the rail says the helper is away, and your work is kept in the browser. It posts when the helper comes back.
• The agent rebuilds the page while you are typing. The reload waits until you finish the sentence, then swaps the page and puts your outstanding work back on it.
• An agent stops listening. The rail says so: it shows whether an agent is watching, working, or gone, read from the helper's own files rather than from anything the agent claimed.
• An agent undoes an edit you made by hand. Handled edits are carved out of doc-wide sweeps, and an edit that gets reverted anyway reopens itself on the next page load.

Requirements

• Node 18.2 or later. No npm runtime dependencies: the two Markdown packages are vendored in the repo, so a clone works with no install step.
• Optional: pandoc 3 or later. With it, Markdown pages render through pandoc, so pandoc fenced divs (::: callout-req, ::: stat) draw as styled panels, the way the feature-forge and research-report builds draw them. Without it, LAHE renders with its vendored Markdown package and those blocks show as plain text.
• A current Chrome, Edge, Safari, or Firefox.
• macOS or Linux for the install-cli wrapper. On Windows, run node bin/lahe.js from the clone or work in WSL.

Docs

• AGENTS.md: how each agent host connects to the tool. Point your agent here.
• skills/lahe/SKILL.md: the instructions an agent follows during a review.
• docs/UPGRADING.md: what to do when upgrading, including moving older documents to stable addresses (0.2 to 0.3).
• docs/INSTALL.md: install details, the CLI wrapper, starting at login with lahe install, and dev-server setup.
• docs/CLI.md: every command and flag.
• docs/ongoing/FREE_WRITING.md: how writing new paragraphs, headings, and lists works, for the next builder.
• docs/ongoing/STYLES.md: how installed document styles work: the folder, the checks, serving, and Markdown.
• docs/CONTRACTS.md: the wire protocol, the record shape, and the review file format.
• docs/: the build history, including the brief, architecture, plan, and reviews.

License

MIT. See LICENSE.