ns-ui
A native <dialog> modal that grows out of the control that opened it and returns into it on close.
Use when a modal that should visibly grow out of the control that opened it and return into it on close, built on the native dialog element so the focus trap, background inertness and Escape come from the platform; pick drawer-counterweight instead when the panel is a side sheet the user drags, or popover-pendulum when the content is non-modal and anchored rather than blocking.
Install
npx shadcn add https://design.helpmarq.comns-ui / dialog-emerge — the panel grows out of the control that opened it
| Prop | Type | Default | Description |
|---|---|---|---|
| open | boolean | — | Controlled open state. The dialog is opened with `showModal()`. |
| onOpenChange | (open: boolean) => void | — | Called for every close the platform can originate: Escape, backdrop, close controls. |
| triggerRef? | RefObject<HTMLElement | null> | — | The control the panel emerges from and returns into. Omit for a centered scale-in. |
| title? | ReactNode | — | — |
| description? | ReactNode | — | — |
| children? | ReactNode | — | Body and actions. Rendered inside the panel, below the title block. |
| dismissOnBackdrop? | boolean | — | Clicking the dimmed backdrop closes. Default true. |
| className? | string | — | — |