UI·loomora/Dropdown
Dropdown
A locally controlled menu that passes a close callback to its render-prop children.
Interactive live playground
Tweak props, change states, and see the live component respond in real time.
How to call
Import directly from the Loomora package root. For projects without Tailwind CSS, ensure loomora/dist/index.css is imported once in your root layout.
import { Dropdown } from 'loomora'
<Dropdown trigger="More actions" staticPosition position="BOTTOM_START">
{(close) => <button onClick={close}>Choose action</button>}
</Dropdown>API reference
Important public props and how they affect rendering.
| Prop | Type | Default | Description |
|---|---|---|---|
| trigger | ReactNode | required | Content for the trigger button. |
| children | (close: () => void) => ReactNode | required | Menu render function with a close callback. |
| staticPosition | boolean | false | Uses the position token rather than calculated viewport position. |
| position | placement token | 'TOP_START' | Static menu placement. |
| menuClassName | string | w-56 … | Classes applied to the menu surface. |
| onToggle | (opened: boolean) => void | — | Notifies when the menu opens or closes. |