fix(components): pin agent-config option popups below their trigger - #1212
Merged
Merged
Conversation
A select whose option list is taller than the dialog flipped upward over the whole form: one provider publishes about a hundred models (~3000px) against ~330px above and ~250px below the trigger, and Floating UI bestFit picks the taller side. TitleGenerationFields now renders OptionSelector: lists of 6+ options get a search field, every popup stays side=bottom with avoidCollisions off, and the list caps at min(60vh, 320px, --available-height). Adds a Storybook fixture covering the regression and a bilingual note recording the measured geometry. Model: swe-2-high
Model: swe-2-high
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.
Related issue
Problem / pressure
In the agent configuration dialog, a select whose option list is taller than the dialog flipped upward over the whole form. Measured live on the running desktop app (builtin Devin): the Model trigger sits at y=716–748 with ~330px of room above and ~250px below inside the dialog's scroll region, while the published catalog holds 108 models (~3000px). Floating UI
bestFitpicks the taller side andmaxHeight: var(--available-height)lets the popup swallow the form — the "dropdown flies up over the dialog" behaviour.Summary
agent-config-dialog.tsxTitleGenerationFieldsrendersOptionSelector(field appearance) instead of bareSelect: ≥6 options (shouldOfferOptionSearch) gets a search field; every popup is pinnedside="bottom"withavoidCollisions={false}; list height caps atmin(60vh, 320px, --available-height); mounts inside[data-lody-dialog-content]per the dialog-contained-menu rule.AgentConfigDialog.stories.tsx: newEditLongOptionListsstory — a synthetic runtime-provenance capability fixture with a 108-model catalog.settings.agent.dialog.optionSearch{Placeholder,Empty}(en + zh_CN); bilingual noteimplemented/bug-fix/2026-10-02-agent-config-selector-popup-pin.Visual explanation
Simple change: one render branch swaps
Selectfor the existing sharedOptionSelector; positioning and search are the component's own.Before / after
Captures from the
EditLongOptionListsstory under Playwright; before is the same fixture with the component change stashed.Test plan
pnpm --filter @lody/components typecheck(tsgo) ✓oxlint/oxfmt --checkon touched files ✓;pnpm lint:i18n✓;pnpm docs check✓vitest run tests/agent-config-dialog.test.tsx— 44 pass ✓pnpm checksuite; packaged-app visual pass pending a buildGenerated with Devin