feat(snapshots): Add click-to-snap interaction on wipe slider#110102
Merged
NicoHinderling merged 2 commits intomasterfrom Mar 6, 2026
Merged
feat(snapshots): Add click-to-snap interaction on wipe slider#110102NicoHinderling merged 2 commits intomasterfrom
NicoHinderling merged 2 commits intomasterfrom
Conversation
Click anywhere on the image comparison area to snap the slider handle to the cursor position and begin dragging. Previously users had to precisely grab the narrow 12px drag handle. Also fix a race condition in useResizableDrawer where sizeRef.current lagged behind programmatic setSize calls, causing the handle to jump back momentarily on first mousemove. Co-Authored-By: Claude <noreply@anthropic.com>
github-actions
bot
added
the
Scope: Frontend
natemoo-re
approved these changes
Mar 6, 2026
Member
natemoo-re
left a comment
natemoo-re
left a comment
There was a problem hiding this comment.
🔥 Nice! This is looking lovely
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
2 participants
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.
try it: https://sentry-1p29scb2a.sentry.dev//issues/5460107969/?project=6301746
Add click-anywhere-to-snap interaction to the
ContentSliderDiffwipe slider component. Previously users had to precisely grab the narrow 12px drag handle to reposition the divider. Now clicking anywhere on the image comparison area snaps the handle to the cursor position and seamlessly continues into drag mode.Changes:
contentSliderDiff/index.tsx— ReplaceFragmentwrapper with a positioned container that captures mousedown events, calculates the click position relative to the container, snaps the slider viasetSize, then initiates the drag. Double-click reset on the handle is preserved. Right/middle clicks are ignored.useResizableDrawer.tsx— SynchronizesizeRef.currentimmediately inupdateSizebefore the asyncsetSizecall. This prevents the drag handle from jumping back to the stale position on the first mousemove after a programmatic snap.