feat: rendered markdown, Mermaid diagrams, Google Docs-style comments, dark mode - #39
Draft
Ronkahn21 wants to merge 12 commits into
Draft
feat: rendered markdown, Mermaid diagrams, Google Docs-style comments, dark mode#39Ronkahn21 wants to merge 12 commits into
Ronkahn21 wants to merge 12 commits into
Conversation
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
…e comments Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
- Add remark-breaks so single newlines in comment bodies render as <br> - Float CommentForm near selection instead of appending to bottom of content - Fix injectHighlights to fall back to text-match when paragraphIndex is stale Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Diff comments: - Multi-line via press-drag on the gutter "+" (opens only on release), driven by synchronous pointer listeners + shadow-DOM hit-testing - GitHub-blue selection highlight; inline thread is the commented-line signal - Inline edit / resolve (collapsed summary) / delete on each comment Rendered (markdown) comments, Google-Docs style: - Highlights painted via the CSS Custom Highlight API (zero DOM mutation) - Two-way highlight <-> margin-card linkage via a single activeCommentId - Fix mermaid re-rendering: stable react-markdown components + ref-based MermaidBlock so diagrams no longer re-init when highlighting Theme: - Manual light/dark toggle (data-theme + persisted), no-flash inline script - Dark-mode comment-highlight colors that stay readable Testing: - Playwright e2e covering the +-drag multi-line and single-line click Signed-off-by: Ron Kahn <rkahn@nvidia.com>
- Collapse rendered comment margin to 0 width when no comments exist (fixes rendered view content squished to 173px in normal viewport) - Increase samePositions epsilon 0.5->2px to prevent sub-pixel ResizeObserver feedback loop causing comment cards to oscillate - Fix fileAnnotationsMap TS error: side typed as union not undefined - Add sourceLine to RenderedAnchor for cross-view comment sync - e2e: beforeEach cleanup+navigation in all groups, retry hover/scroll Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Author
|
@coderabbitai review |
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
Signed-off-by: Ron Kahn <rkahn@nvidia.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
.mdfile between Diff and Rendered with a toolbar buttonmermaidblocks render as live diagrams in the rendered view (lazy-loaded)+→ comment anchored to the highlighted text; bubbles appear in the right margin aligned to their anchor+across lines to comment on a range; a ghost+stays pinned to the start line while dragginglocalStorage, applied viadata-themeattribute/diffx-finish-reviewskill updated: documents both comment types (anchorType: "line"withendLineNumber/lineContents,anchorType: "rendered"withrenderedAnchorincludingparagraphIndex/offset fallback)Closes #38
Details
Rendered comments use the CSS Custom Highlight API to paint the anchor text. The
renderedAnchorobject storesselectedText,context,paragraphIndex, and character offsets so the highlight can be restored after re-renders or on/diffx-finish-review.The ghost
+button is aposition: absoluteoverlay captured frome.currentTarget.getBoundingClientRect()at drag-start and cleared onpointerup/pointercancel.Also addressed in this PR:
pointercancelhandler so drag state doesn't get stuck on touch-scroll or alt-tabe.button !== 0guard on gutter+(right-click was starting a drag)onKeyDownon gutter+so keyboard users can open a single-line composer via Enter/SpacelocalStoragereads/writes guarded against blocked storage (private browsing)/api/filescoped to.mdfiles only (was readable for any file under cwd)--comment-card-border/--comment-card-shadowadded:focus-withinfor keyboard usersaria-label/aria-pressedon theme toggle buttonTest plan
npx playwright test e2e/comments.spec.ts)pnpm run build).mdfile shows Diff/Rendered toggle; Rendered shows formatted HTML with Mermaid diagrams+tooltip; comment anchors to highlighted text with right-margin bubble; resolving/unresolving works+across lines → ghost stays at start line; release opens composer with correct range