Portal

Import#

import { Portal, usePortal } from '@volue/wave-react';

Portals in a nutshell#

Portals are used to transport any component or element to the end of document.body and render a React tree into them.

They are useful for rendering a natural React element hierarchy with a different DOM hierarchy to prevent parent styles from clipping or hiding content (for popovers, dropdowns, dialogs etc).

Examples#

Basic#

Nesting Portals#

You can also nest multiple portals within themselves, this will create a nested DOM hierarchy to make it easy to create nested dialogs, popovers, etc.

API Reference#