-
Notifications
You must be signed in to change notification settings - Fork 1.9k
fix: Clamp legend height if it exceeds available space #3276
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: Clamp legend height if it exceeds available space #3276
Conversation
Signed-off-by: Ilya Boyandin <ilyabo@gmail.com>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR implements functionality to clamp the legend height when it exceeds the available space in the map viewport. The fix ensures the legend panel remains fully visible within the map boundaries by calculating a maximum content height based on map dimensions and clamping the legend's contentHeight accordingly.
Key changes:
- Added
maxContentHeightcalculation based on map dimensions in theuseLegendPositionhook - Implemented automatic clamping of legend content height when it exceeds available space
- Added test coverage for the new maxContentHeight calculation and clamping behavior
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
test/browser/components/hooks/use-legend-position.spec.js |
Added three new test cases to verify maxContentHeight calculation and contentHeight clamping behavior |
src/components/src/hooks/use-legend-position.ts |
Added maxContentHeight calculation, useEffect to clamp contentHeight when map resizes, and updated parameters to accept mapHeight/mapWidth |
src/components/src/map/map-legend-panel.tsx |
Updated component to pass mapState dimensions to the hook and thread maxContentHeight prop through to styled components |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| ? Math.min( | ||
| maxContentHeight, | ||
| mapRootBounds.bottom - | ||
| (legendRect.top + MAP_CONTROL_HEADER_FULL_HEIGHT + MARGIN.bottom) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Move to a separate variable
mapRootBounds.bottom -
(legendRect.top + MAP_CONTROL_HEADER_FULL_HEIGHT + MARGIN.bottom)
Signed-off-by: Ilya Boyandin <ilyabo@gmail.com>
Before the fix the legend wouldn't react to changes in the map container height. After fix it does:
Kapture.2026-01-07.at.15.21.17.mp4
The demo app still works too:
Kapture.2026-01-07.at.15.24.40.mp4