[Owen-Richard]

Why

People reviewing a prototype need to add and manage targeted notes without losing context or interrupting the preview. The Pick & polish flow needed clearer Notes language, predictable dismissal, and keyboard support.

What changes

Pick & polish now starts target selection immediately and supports the S shortcut from the canvas and preview. Typing, modified keys, handled events, and inputs inside open shadow roots remain unaffected.

Notes now use the selected element as the conversation heading, protect unfinished drafts, and dismiss without stealing focus from the preview or ordinary Hub comments. The panel has concise labels, guarded close and delete flows, a hover action for single deletes, an overflow menu for multiple actions, a Retry icon, accessible focus and contrast, and Command+Enter or Control+Enter submission with compact keycaps.

Storybook screenshots

Components/Prototype canvas/Improvement threads — Pins Without Sidebar (light; 1440×900)

Components/Prototype canvas/Improvement threads — Active Notes (light; 1440×900)

Components/Prototype canvas/Improvement threads — Blocked Notes (light; 1440×900)

Components/Prototype canvas/Improvement threads — Copilot Answer (light; 1440×900)

Components/Prototype canvas/Improvement threads — Author Identity Unavailable (light; 1440×900)

Components/Prototype canvas/Improvement threads — No Pending Requests (light; 1440×900)

Components/Prototype canvas/Follow-up thread sample — Sample (light; 1440×900)

[Copilot]

🟡 Changes recommended

Confirmed interaction and keyboard-handling regressions can hide draft controls, interrupt prototype input, and prevent cancellation.

7 open issues

• Guard missing keyboard keys before normalization · New
• Preserve ordinary comment behavior on pointer dismissal · New
• Route Notes counter close through guarded sidebar dismissal · New
• Allow S to cancel a target while source capture is pending · New
• Cancel pending preview selection on Escape · New
• Preserve filter and sidebar close control behavior · New
• Exclude shadow-root inputs from S shortcut handling · New

2 files not reviewed

• .github/extensions/replica-prototype/assets/renderer-improvement-notes-prototype.js: Generated file
• .github/extensions/replica-prototype/assets/renderer-prototype-canvas-improvement-threads.js: Generated file

What changed in this PR

Refines the prototype canvas’s Pick & polish Notes workflow, making selection faster and conversation controls more consistent.

Changes:

• Adds S-key selection toggling and immediate selection during source capture.
• Updates conversation dismissal, filtering, deletion, labels, and the Notes counter.
• Adds Save shortcuts and keycaps, expands interaction coverage, and refreshes extension assets and documentation.

File	Description
hub/​vite.prototype-canvas.config.mjs	Includes the shortcut helper in the Notes bundle.
hub/​script/​check-prototype-canvas-renderer.mjs	Expands renderer interaction checks.
hub/​docs/​prototype-canvas.md	Documents the updated Notes workflow.
hub/​app/​javascript/​utils/​is-annotation-shortcut/​index.ts	Adds shared S-key shortcut detection.
hub/​app/​javascript/​features/​prototype-canvas-improvement-threads/​styles.css	Styles header actions and direct deletion.
hub/​app/​javascript/​features/​prototype-canvas-improvement-threads/​index.tsx	Updates conversation dismissal and row actions.
hub/​app/​javascript/​features/​prototype-canvas-improvement-threads/​index.test.tsx	Covers dismissal, draft protection, and deletion.
hub/​app/​javascript/​features/​prototype-canvas-improvement-threads/​en.ts	Revises Notes, filter, and deletion labels.
hub/​app/​javascript/​features/​prototype-canvas-improvement-notes/​use-preview-selection/​index.ts	Handles preview toggles and dismissal metadata.
hub/​app/​javascript/​features/​prototype-canvas-improvement-notes/​styles.css	Adds Save keycaps and adjusts pin focus styling.
hub/​app/​javascript/​features/​prototype-canvas-improvement-notes/​index.tsx	Adds immediate selection, counter toggling, and submission shortcuts.
hub/​app/​javascript/​features/​prototype-canvas-improvement-notes/​en.ts	Updates selection hints and composer labels.
hub/​app/​javascript/​application/​prototype-preview-bridge/​index.ts	Forwards shortcuts and preview pointer dismissal.
hub/​app/​javascript/​application/​prototype-preview-bridge/​improvement-selection.test.ts	Tests shortcut authentication and dismissal behavior.
hub/​app/​javascript/​application/​prototype-canvas/​tests/​improvement-notes.test.tsx	Expands capture, cancellation, submission, and focus coverage.
.github/​extensions/​replica-prototype/​assets/​renderer-prototype-canvas-improvement-threads.js	Refreshes bundled conversation presentation.
.github/​extensions/​replica-prototype/​assets/​renderer-improvement-notes-prototype.js	Refreshes bundled Notes orchestration and shortcuts.

_{Review effort: Max}

[nshki]

Thanks for the polish here, @Owen-Richard! Left a couple change requests. Also if you don't mind, could you ask your agent to update the PR title and description according to our conventions?

Happy to chat about this in the channel if needed.