Skip to content

Live mode: staged AI copy edits#158

Draft
abdulwahabone wants to merge 45 commits into
pbakaus:mainfrom
abdulwahabone:feat/live-manual-text-edit
Draft

Live mode: staged AI copy edits#158
abdulwahabone wants to merge 45 commits into
pbakaus:mainfrom
abdulwahabone:feat/live-manual-text-edit

Conversation

@abdulwahabone
Copy link
Copy Markdown
Contributor

@abdulwahabone abdulwahabone commented May 16, 2026

Closes #139.

Summary

Adds staged inline copy editing to Live mode.

Users can edit text directly on the page, Save stages the copy edit without touching source, and Apply copy edits sends the staged page batch to the local AI agent. Source is only considered applied after verification confirms the requested new text exists in plausible source files.

Flow

flowchart TD
  A[User edits text on page] --> B[Save]
  B --> C[Stage copy edit only]
  C --> D[Show Apply copy edits dock]
  D --> E[Apply copy edits]
  E --> F[Send staged batch to local AI agent]
  F --> G[AI updates real source files]
  G --> H[Verify requested text exists in source]
  H -->|Verified| I[Clear applied edits from buffer]
  H -->|Failed or ambiguous| J[Keep edits staged with failure details]
Loading

What Changed

  • Added inline text editing and staged copy-edit buffer.
  • Added Apply/Discard dock with apply loading state.
  • Replaced deterministic resolver/source mutation with batched AI apply.
  • Added evidence collection for DOM refs, source hints, nearby text, and candidate files/lines.
  • Added verification so false success does not clear staged edits.
  • Removed obsolete direct-save/handoff paths and rebuilt generated provider copies.

Why The Noise?

Most changed files are generated harness output, not hand-authored feature code.

  • Current PR diff: 228 changed files.
  • 195 auto-generated harness/plugin files across 13 committed provider/install directories: .agents/, .claude/skills/, .cursor/, .gemini/, .github/, .kiro/, .opencode/, .pi/, .qoder/, .rovodev/, .trae/, .trae-cn/, and plugin/.
  • That generated set is 13 directories x 15 files each: reference/live.md plus 14 live-mode/helper scripts. They are produced by bun run build from skill/.
  • CLAUDE.md says these generated harness files are intentionally committed because npx skill installs read them directly at install time, so they need to ship.
  • The real review surface is 15 source-of-truth files in skill/ (reference/live.md + 14 scripts), 14 test files, and 4 config/dependency files: .gitignore, .claude/settings.json, package.json, and bun.lock.
  • No /site demo edits are included in this PR.

Safety

  • Save stages plain text only; markup-like text is rejected.
  • Apply requires explicit appliedEntryIds and touched files from the AI result.
  • Post-apply checks catch invalid JS and leftover live/carbonize markers.
  • Failed or ambiguous edits remain staged with candidate evidence.

Tests Run

  • node --check on changed live scripts
  • node --test focused live copy-edit/browser/server/session tests
  • bun run build
  • bun run test

Note

Medium Risk
Adds a new staged copy-edit pipeline (new server endpoints, on-page editor UI, and AI-driven source mutation/verification), which changes core Live-mode behavior and introduces new file-write and rollback logic that could affect developer workflows if it mis-verifies or rolls back incorrectly.

Overview
Adds staged inline copy editing to Live mode: users can edit text directly in the page, Save stashes plain-text ops into .impeccable/live/pending-manual-edits.json, and a new bottom-dock Apply copy edits action invokes an AI batch to update real source files.

Introduces new server endpoints (/manual-edit-stash, /manual-edit-commit, /manual-edit-discard) plus a new browser editing state/badge UI and a pending-edits counter/dock. The apply path is now AI-driven (live-copy-edit-agent.mjs + live-commit-manual-edits.mjs) with evidence gathering (live-manual-edit-evidence.mjs), post-apply validation/rollback, and verification before clearing staged edits.

Updates variant flows to be buffer-aware: live-wrap.mjs requires --page-url when pending edits might affect the wrapped block, and live-accept.mjs now scopes manual-edit scrubbing to the accepted wrapper’s original block (plus takes --page-url). Also hardens live infra with stale PID cleanup for server.json and tweaks injection for .astro (<script is:inline ...>), with docs updated accordingly.

Reviewed by Cursor Bugbot for commit f58fd12. Bugbot is set up for automated code reviews on this repo. Configure here.

@abdulwahabone abdulwahabone requested a review from pbakaus as a code owner May 16, 2026 11:15
Comment thread .agents/skills/impeccable/scripts/live-browser.js
Comment thread .agents/skills/impeccable/scripts/live-edit.mjs Outdated
Comment thread .agents/skills/impeccable/scripts/live-browser.js Outdated
Comment thread .agents/skills/impeccable/scripts/live-accept.mjs Outdated
Comment thread .agents/skills/impeccable/scripts/live-discard-manual-edits.mjs
Comment thread .claude/skills/impeccable/scripts/live-accept.mjs Outdated
Comment thread .agents/skills/impeccable/scripts/live-wrap.mjs
@abdulwahabone abdulwahabone marked this pull request as draft May 16, 2026 17:53
@abdulwahabone abdulwahabone changed the title Live mode: edit content badge styling + auto-focus + separate buttons Live mode: inline copy editing May 16, 2026
@abdulwahabone abdulwahabone marked this pull request as ready for review May 16, 2026 19:35
@abdulwahabone abdulwahabone marked this pull request as draft May 19, 2026 16:36
@abdulwahabone
Copy link
Copy Markdown
Contributor Author

Fixing a few bugs before this is ready for review.

@abdulwahabone abdulwahabone changed the title Live mode: inline copy editing Live mode: staged AI copy edits May 20, 2026
abdulwahabone and others added 17 commits May 21, 2026 01:19
Adds a manual text-edit popover under the live-mode bar so users can
retype copy directly without going through generate. The footer's
"Apply edits" button fires a manual_edits event; the server writes
the changes back to source via the new live-edit.mjs deterministic
file mutator. Mirrors the wrap+accept flow but skips variant generation.

New scripts:
- skill/scripts/live-edit.mjs: writes manual_edits back to source
- skill/scripts/live-text-rows.js: browser walker that surfaces every
  pure-text descendant of the picked element as an editable row

Touched scripts:
- skill/scripts/live-browser.js: text panel UI, CONFIGURING state hook
- skill/scripts/live-poll.mjs: manual_edits routing
- skill/scripts/live-server.mjs: manual_edits endpoint + handler
- skill/scripts/live-wrap.mjs: small adjustments to support the flow

Docs + tests:
- skill/reference/live.md: manual-edit section
- tests/live-edit.test.mjs, tests/live-text-rows.test.mjs

Also bundles two live-mode reliability fixes that surfaced during
manual testing of the feature:

1. live-inject now emits is:inline when the inject target is a .astro
   file. Astro otherwise processes the <script> tag and rewrites src
   to its own bundled URL, so the literal live.js never loads.

2. readLiveServerInfo now probes the lockfile PID with kill(pid, 0)
   and unlinks the stale lock if dead. Previously a crashed helper
   left server.json with a dead PID and live-poll reported "Live
   server not running" forever.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace the text-edit popover panel with inline contenteditable activation.
When an element is picked in CONFIGURING, every pure-text descendant becomes
contenteditable="true" directly on the page. Each blur-event fires a single-op
manual_edits save to source. Esc restores original text and stays in CONFIGURING;
successful save exits to PICKING. If Go is clicked while a save is in-flight,
the save completes before generate fires.

Deleted ~340 lines of panel UI (initTextPanel, openTextPanel, closeTextPanel,
renderTextRow, buildTextFooter, etc.). Added enableInlineEdit, disableInlineEdit,
onInlineBlur. Server contract unchanged; live-edit.mjs handles per-op saves as
before. Tests: 186 pass.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Annotation overlay's click handler was intercepting clicks on contenteditable
text elements. Hide the overlay when inline-edit is enabled to allow text
selection and editing. Restore it when exiting inline-edit (if still in
CONFIGURING).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replace automatic inline contenteditable on element pick with an explicit "Edit content" badge. The badge appears at the element's top-right corner when an element is picked. Clicking the badge enters a new EDITING state where:

- The contextual bar hides
- The annotation overlay hides
- The badge morphs to show Cancel + Apply buttons
- Text descendants become contenteditable inline

Edits are held in memory (input event tracking) until Apply is clicked, which fires a single batched manual_edits event with all ops. Cancel discards drafts without saving. This eliminates the annotation overlay interference that prevented clicking on text elements.

The EDITING state integrates with the main state machine and handles all exits (Esc, click-outside, teardown) cleanly.

All 186 tests pass.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
The applyEditing function was trying to use row.tag which doesn't exist on the row object. The tag should be the tagName of the text element itself (row.el.tagName.toLowerCase()).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Edit content button now matches Go button styling (BP.accent background, BP.mark text, FONT, transitions, hover effects)
- Auto-focus first editable element when entering editing mode (50ms timeout)
- Separate Cancel and Apply buttons with 8px gap (no divider)
- Cancel uses muted styling (BP.hairline background, BP.textDim text)
- Apply keeps brand accent styling
- Remove all focus rings and outlines on edit badge buttons (no blue ring/outline in EDITING mode)

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Change badge buttons to use impeccable-button aesthetic (ink background, surface text, hover to accent)
  - Removes aggressive styling conflict with Go button
  - No animations; simple 150ms background transition
  - Matches site design language (padding 0.625rem 1.5rem, 0.8125rem font, letter-spacing 0.03em)
- Shorter, clearer button copy: "Edit" instead of "Edit content", "Save" instead of "Apply"
- Fix cursor positioning: cursor now appears at END of text, not beginning
  - Use Selection API to collapse cursor to end of contenteditable element
  - Improves UX for immediate continuation of text
- Update live.md documentation to reflect new button labels

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Edit/Save buttons: oklch(10% 0 0) background → oklch(60% 0.25 350) on hover
- Cancel button: oklch(55% 0 0) background → oklch(65% 0 0) on hover
- All buttons: 6px border-radius (matches Go button), oklch(98% 0 0) text
- Smooth transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1) (--ease-out)
- Uses site color palette instead of live-overlay constants

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Use exact .slop-callout aesthetic: paper background, accent border + text, uppercase 10px (0.625rem)
- 600 weight, 0.06em letter-spacing, 4px 8px padding, 6px border-radius
- Box-shadow: 0 2px 8px rgba(0,0,0,0.1) matches site callouts
- Hover: inverts to filled background (accent fill, paper text)
- Cancel uses ash color variant for muted state, Save uses accent
- Smooth 0.3s cubic-bezier(0.16, 1, 0.3, 1) transition on background and color

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Border-radius: 999px (pill shape)
- Padding: 2px 8px (more compact)
- Removed text-transform: uppercase

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Border: 1px solid oklch(92% 0 0) (--color-mist)
- Color: oklch(55% 0 0) (--color-ash)
- Hover: inverts to ash background with paper text

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
… EDITING mode

- Add inline outline: none on each row's element when contenteditable activates
- Inject [data-impeccable-editable] CSS rule to override browser default focus ring
- Use !important to win against site styles that re-apply focus outlines
- Cleanup restores outline/data-attribute on disable

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Manual text edits now POST directly to a new /manual-edit endpoint
that runs live-edit.mjs synchronously and returns the result. The
event is never enqueued, never reaches the poll loop, never reaches
the agent.

Why: every Save was costing an LLM turn. The poll script would
dequeue the manual_edits event, run live-edit.mjs deterministically,
post a completion ack, then print the event JSON to stdout. The
Claude agent would read that output and decide "loop and re-poll".
Zero real work for the agent but every Save burned context.

Changes:
- live-server.mjs: new POST /manual-edit handler that runs live-edit.mjs
  synchronously and returns the result. Does not enqueue, does not log
  to session store. Defense-in-depth: /events rejects manual_edits.
- live-browser.js: applyEditing() POSTs to /manual-edit instead of
  sendEvent({type: 'manual_edits'}).
- live-poll.mjs: removed manual_edits handler branch (dead code now).
- reference/live.md: removed "Handle manual_edits" section; replaced
  with a one-line note that manual edits are server-direct.

The HMR-triggered page reload remains (dev server detects source file
change) but that is a separate dev-server behavior, not our pipeline.
resumeSession() already restores variants and selection after reload.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Decouples manual-edit Save from source file writes. Save now stashes
to .impeccable/live/pending-manual-edits.json with no HMR refresh.
The user explicitly asks the AI to commit when ready.

Why: even with the prior /manual-edit fix, every Save still wrote to
source and triggered the dev server's HMR/full reload. The page flash
was the actual user pain. Now there's zero source touch on Save, and
the user controls when the dev server reloads.

Server (live-server.mjs):
- /manual-edit-stash POST: append to buffer file. Returns {ok, pendingCount, totalCount, perPage}.
- /manual-edit-stash GET: query counts by page for counter UI.
- /manual-edit-discard POST: drop entries (all if no pageUrl).
- Old /manual-edit returns 410 Gone (defense in depth).
- Buffer ops merge by (pageUrl, ref): keep first originalText, update newText.

CLIs:
- live-commit-manual-edits.mjs: read buffer, shell out to live-edit.mjs
  per entry, truncate succeeded entries, surface failures.
- live-discard-manual-edits.mjs: truncate buffer (optionally scoped by page).
- Both take optional --page-url=<url>.

Browser (live-browser.js):
- applyEditing() POSTs to /manual-edit-stash, no source write.
- Pending pill (• N staged) + trash icon next to Exit in global bar.
- One-time onboarding toast on first Save: "Saved. Tell the AI to commit when ready."
- Counter persists across reloads via GET /manual-edit-stash on init.
- Trash icon: confirm dialog scoped to current page, then POST /manual-edit-discard.

Variant pipeline interaction:
- live-wrap.mjs: when wrapping an element, apply pending manual edits to
  the source range so the wrap block's "original" variant reflects the
  user's edited DOM (their pre-Go view), not the raw source.
- live-accept.mjs: after accept writes the variant to source, scrub
  buffer ops whose originalText no longer appears in that file. The
  accept embodies the manual edit; the pending op is consumed.
- Variant discard does NOT touch the buffer.

Reference docs:
- reference/live.md: full commit/discard contract, trigger guidance
  (narrow action-verb intent), do-not-auto-commit rule.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Click the "• N staged" pill → confirm dialog "Apply N staged edits
to source? The page will reload." → POST /manual-edit-commit on the
server, which shells out to live-commit-manual-edits.mjs. Same path
the AI uses, just triggered from the overlay.

Trash icon stays for discard. The AI-driven commit path also stays
(useful for inspecting failures or scripting). The pill is now the
primary apply affordance because it removes the chat-context-switch
for the common case.

Pill styling: pointer cursor, accent border + text at rest, fills
on hover (accent bg, paper text). Tooltip: "Click to apply staged
edits to source".

First-save toast updated: "Saved. Click the 'staged' badge to apply,
or ask the AI."

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
abdulwahabone and others added 11 commits May 21, 2026 01:19
…ng edits

When a manual edit is staged ("Impeccable Works!") but not yet committed,
the buffer holds the user's edited DOM while source still has the un-
edited text ("Impeccable"). live-wrap's buffer-aware step exists to
rewrite the wrap block's <div data-impeccable-variant="original"> to
match the staged DOM, but per CB-4 it is gated by --page-url. When the
agent invoking live-wrap omits --page-url, the buffer-aware step
silently no-op'd and the variant authoring saw stale source — the
user's manual edit appeared lost.

Make the silent no-op a loud error: when buffer.entries.length > 0
and --page-url is missing, exit 1 with
{ error: 'missing_page_url_with_pending_edits', pendingEntries, hint }.
Empty buffer = no risk = no requirement, so existing flows without
pending edits keep working.

Updated reference/live.md to flag --page-url as required when the
buffer has entries. Added regression test in
live-wrap-buffer-aware.test.mjs. live-wrap.test.mjs gained a buffer-
clear hook so any leftover .impeccable/live/pending-manual-edits.json
from local dev doesn't trip the new check.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Live-inject script tag in Base.astro slipped back in via git add -A
while a local live server was running. Restore both site/ files to
main.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@abdulwahabone abdulwahabone force-pushed the feat/live-manual-text-edit branch from ea35e5d to eb5715d Compare May 20, 2026 16:20
@abdulwahabone abdulwahabone marked this pull request as ready for review May 20, 2026 16:20
Comment thread skill/scripts/live-commit-manual-edits.mjs
Comment thread skill/scripts/live-accept.mjs Outdated
Comment thread skill/scripts/live-accept.mjs
Comment thread skill/scripts/impeccable-paths.mjs Outdated
Comment thread skill/scripts/live-commit-manual-edits.mjs
Comment thread skill/scripts/live-wrap.mjs Outdated
Comment thread .agents/skills/impeccable/scripts/live-browser.js Outdated
Comment thread .agents/skills/impeccable/scripts/live-wrap.mjs
Comment thread .agents/skills/impeccable/scripts/live-commit-manual-edits.mjs
Comment thread .agents/skills/impeccable/scripts/live-accept.mjs Outdated
Comment thread skill/scripts/live-commit-manual-edits.mjs
Comment thread skill/scripts/live-wrap.mjs
Comment thread skill/scripts/live-browser.js
Comment thread skill/scripts/live-wrap.mjs
Comment thread skill/scripts/live-browser.js
Comment thread skill/scripts/live-browser.js
Comment thread skill/scripts/live-commit-manual-edits.mjs
Comment thread skill/scripts/live-commit-manual-edits.mjs Outdated
Comment thread skill/scripts/live-wrap.mjs
Copy link
Copy Markdown

@cursor cursor Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 2 potential issues.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 1e2b305. Configure here.

Comment thread .agents/skills/impeccable/scripts/live-commit-manual-edits.mjs
Comment thread .agents/skills/impeccable/scripts/live-commit-manual-edits.mjs
@abdulwahabone abdulwahabone marked this pull request as draft May 20, 2026 19:09
@abdulwahabone
Copy link
Copy Markdown
Contributor Author

Taking some time to do more testing on this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Feature request: Live mode UX Copy Editing

1 participant