Skip to content

feat(naked_ui): fit anchored select and menu panels to the space beside their trigger - #347

Open
leoafarias wants to merge 2 commits into
mainfrom
fix/naked-ui-overlay-available-height
Open

leoafarias wants to merge 2 commits into
mainfrom
fix/naked-ui-overlay-available-height

Conversation

@leoafarias

Copy link
Copy Markdown
Collaborator

Description

A tall NakedSelect or NakedMenu panel is laid out as tall as the whole overlay, so it slides over its trigger.

This adds an opt-in constrainToAvailableHeight to NakedSelect, NakedMenu, and OverlayPositioner. The internal AnchoredOverlay forwards it.

  • When set, a panel above or below its trigger is capped at the space on that side, after sideOffset and collisionPadding.
  • With collision avoidance on, the larger side bounds the layout. The panel stays on the preferred side when it fits there; otherwise it flips.
  • Left and right placements are not capped. Popover and tooltip are unchanged.
  • The default is false, so panels that cannot scroll keep today's layout. Content that cannot scroll overflows a capped panel.

It is opt-in because turning it on everywhere overflowed non-scrolling panels, including this repo's 15-option select tests. It would also have reached RemixSelect and RemixMenu on beta.13 through a naked_ui upgrade, before they can scroll.

Validation

  • Positioner tests cover fit-below, flip-above, a preferred top side, collision padding, negative room, left and right placements, right-to-left, and turning the option on and off on the same positioner.
  • Select and menu tests cover fit-below, flip-above, a short panel, right-to-left, and the default, which is pinned by leaving the argument out.
  • 12 of the new tests fail without the cap. Removing the shouldRelayout clause, or flipping a default to true, fails the intended tests.
  • Full naked_ui suite: 972 passed. Full remix suite: 2831 passed. dart analyze, format, and melos run ci:checks are clean.
  • A review swept 7,128 combinations of side, collision avoidance, anchor position and height, sideOffset, padding, and panel height against the flip-then-cap rule, with 0 failures.

Related Issues

Follows the select and menu scroll PRs #341 and #345. Remix opts in through a separate PR stacked on #345. Belongs in naked_ui 1.3.0. Positioning still ignores safe-area and keyboard insets; that is tracked separately.


Checklist

  • My PR includes unit or integration tests for all changed/updated/fixed behaviors.
  • I have updated or added relevant documentation (doc comments with ///).
  • I am prepared to follow up on review comments in a timely manner.

Breaking Change

  • Yes, this is a breaking change.
  • No, this is not a breaking change.

The new parameters default to false.

…e their trigger

OverlayPositioner laid its child out with the whole overlay as the maximum
height, so a panel taller than the room above or below its trigger slid over
the trigger instead of fitting beside it.

Add constrainToAvailableHeight to OverlayPositioner, AnchoredOverlay,
NakedSelect, and NakedMenu. When set, a panel placed above or below the
anchor is capped at the space on that side after sideOffset and
collisionPadding. With collision avoidance on, the cap is the larger side, so
the existing flip lands on it; without, it is the preferred side. Left and
right placements are not capped. The option defaults to false, so panels
that cannot scroll keep today's layout.
…n its defaults

The option is new public API with a false default, so it belongs under
Features. Drop the unexported AnchoredOverlay from the entry and say that the
larger side bounds the layout while the panel stays on the preferred side when
it fits there.

The select and menu tests now leave the argument out to pin the default, and a
positioner test turns the option on and off to cover shouldRelayout.
@chatgpt-codex-connector

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-10-27T21:55:07.586159Z 256dc16 PR opened
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

This branch has not been deployed

No deployments
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