Skip to content

Conversation

@HrvojeHemen
Copy link

@HrvojeHemen HrvojeHemen commented Jan 6, 2026

Adds a new maxHeight prop to the Popover component that allows constraining the maximum height of the popover body.

Why this feature is needed:

  • Content control: Long content in popovers can extend beyond viewport boundaries, making it difficult to interact with
  • Consistent UX: Provides predictable popover sizing regardless of content length
  • Better accessibility: Scrollable content within a constrained height is easier to navigate
  • Design flexibility: Allows designers to maintain consistent popover dimensions across different use cases

Changes made

  • Added maxHeight?: number prop to PopoverProps interface with JSDoc documentation
  • Updated positioning logic in use-popover-position.ts to handle height constraints
  • Added position adjustment for top-positioned popovers when height is constrained

Manual testing (pages/popover/max-height.page.tsx):

  • Popover with maxHeight constraint vs default behavior
  • Short content that fits within maxHeight
  • All four positioning directions (top, bottom, left, right) with maxHeight
  • Interactive controls to adjust maxHeight value

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

@HrvojeHemen HrvojeHemen marked this pull request as ready for review January 6, 2026 11:35
@HrvojeHemen HrvojeHemen requested a review from a team as a code owner January 6, 2026 11:35
@HrvojeHemen HrvojeHemen requested review from ClaudioGSDB and removed request for a team January 6, 2026 11:35
@pan-kot pan-kot requested review from a team and YueyingLu and removed request for a team and ClaudioGSDB January 6, 2026 12:59
@HrvojeHemen HrvojeHemen force-pushed the hemenh/tooltip-max-height branch from 1fe688a to 0a77fce Compare January 6, 2026 13:45
@codecov
Copy link

codecov bot commented Jan 6, 2026

Codecov Report

❌ Patch coverage is 37.50000% with 5 lines in your changes missing coverage. Please review.
✅ Project coverage is 97.12%. Comparing base (1a5715e) to head (0a77fce).

Files with missing lines Patch % Lines
src/popover/use-popover-position.ts 37.50% 5 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #4158      +/-   ##
==========================================
- Coverage   97.14%   97.12%   -0.02%     
==========================================
  Files         873      873              
  Lines       25642    25650       +8     
  Branches     9284     9287       +3     
==========================================
+ Hits        24910    24913       +3     
- Misses        726      731       +5     
  Partials        6        6              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@HrvojeHemen HrvojeHemen force-pushed the hemenh/tooltip-max-height branch from 0a77fce to c3b877c Compare January 6, 2026 15:29
@HrvojeHemen HrvojeHemen force-pushed the hemenh/tooltip-max-height branch from c3b877c to 2da934b Compare January 7, 2026 10:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant