Custom Component MultiSelect dropdown not visible in Retool unless container height is large (overflow/portal issue)

💬 App Building
1

Hi everyone,
I’m building a custom React MultiSelect component for Retool, and the dropdown menu is not visible (or gets clipped) unless I give the component container a large fixed height — which is not acceptable for the UI.

Environment

  • Retool: [Cloud / Self-hosted]
  • Where the component is used: [inside a Container / Modal / Tabs / Table cell / etc.]
  • Custom component renders inside an iframe / or Retool layout wrapper (not 100% sure).

Expected

Dropdown opens above other components like a normal select (overlay), without requiring any fixed height on the component container.

Actual

Dropdown only becomes visible if the component container is tall. Otherwise it looks like the menu doesn't open (likely clipped by parent overflow/stacking context).

What I tried

  • z-index: 9999 on the menu
  • overflow: visible on the component root container
  • Measuring menu height and adding padding/margin to expand the component height (works but feels like a hack and breaks layouts)

Current approach (simplified)

The menu is rendered as position: absolute inside a position: relative container:

.container { position: relative; overflow: visible; }
.menu {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 9999;
  max-height: 260px;
  overflow-y: auto;
}
3

Have you tried adding min-height: fit-content; and/or height: auto; to your container?