Fix pivot viewer card overflow, zoom anchoring and pinch to zoom - #231
Merged
Conversation
A card's title and its value column are drawn to the canvas with word wrapping off and no width budget, so anything longer than the card kept painting straight past its edge and over the card beside it. A long title was unreadable and made its neighbour unreadable too. Both are now measured against the room they actually have and cut with an ellipsis when they do not fit. Measuring is the only way to know where to cut, since a glyph's width depends on the font, so the search is binary rather than a character-at-a-time walk and the result is cached against the text and the width it was fitted to - a card re-measures only when what it shows, or the room it has, changed. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
The toolbar always rendered a hardcoded "Pivot Viewer" heading, which is wrong wherever the host already names the view - and it rendered it as a bare h1, so it inherited whatever heading size the consuming application had set rather than the size the component asked for. The title is a prop now, rendered as a span with its own size. Omit it and the heading collapses entirely, leaving the item count directly beside the filter button. The count is sized to that button so the two read as one group either way. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
The zoom gesture listeners were bound in an effect that read the viewport out of a ref. That viewport mounts a render or more later - it sits behind the loading gate, inside a child component - and a ref object keeps the same identity forever, so the effect bound to nothing and had no reason to run again. Pinching did nothing at all until something else changed the zoom and happened to re-run the effect, which made zooming once with the toolbar the only way to get the gesture working. The hook now tracks the node itself and binds the moment it appears. Touch devices also need the viewport to give up the browser's own pinch gesture, or the two-finger moves never reach the handler; panning stays with the browser. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Zooming resized the content underneath a scroll offset that stayed where it was, and the toolbar's buttons, slider and reset had no anchoring of their own. Zooming all the way out is the worst case: the content then fits the viewport, the scroll range collapses to nothing, and zooming back in left the offset at zero. In grouped mode that reads as the viewer losing its cards. Groups are drawn from the bottom up, so the top of the scrollable area is empty for every group shorter than the tallest one - an offset of zero shows a blank canvas with no clue that the cards are below it, and the only way back is to scroll all the way down. The viewport now holds its place when the scrollable area is resized: grouped mode keeps its distance from the bottom, where its content is anchored, and every other mode keeps the centre. It watches the spacer that defines the scrollable area rather than the zoom level, since the spacer is what actually resizes. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.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
Four fixes to the PivotViewer, all found while using it in the Chronicle Workbench. Long card
text painted over neighbouring cards, the toolbar forced a heading no host asked for, pinch to
zoom silently did nothing, and zooming could leave the viewer showing an empty canvas with no
obvious way back.
Added
PivotVieweraccepts an optionaltitlefor the toolbar heading. Omit it and the headingcollapses entirely, leaving the item count directly beside the filter button.
Changed
h1, so it nolonger inherits whatever heading size the consuming application had set.
Fixed
card previously kept painting past its edge and over the card next to it.
two-finger gesture away to the browser. The zoom listeners were bound before the viewport
existed and never rebound, so the gesture did nothing until the zoom was changed some other way
first.
collapsed the scroll range, and zooming back in left the offset at zero — which in grouped mode,
where cards are drawn from the bottom up, showed a blank canvas until the user scrolled all the
way back down.