ilokesto

OverlayHost

OverlayHost reads the current item list with useOverlayItems() and renders an OverlayItemRenderer for each item. The renderer looks up adapters[item.type], creates close and remove callbacks bound to the item id, and passes OverlayRenderProps plus item.props to the adapter.

const renderProps = {
  id: item.id,
  isOpen: item.status === 'open',
  status: item.status,
  close,
  remove,
};

return <Adapter {...renderProps} {...item.props} />;

Do not normally mount OverlayHost yourself: OverlayProvider and every provider returned by createOverlayContext() already include it, and its context-getter prop is an internal composition detail. Read this page to understand host dispatch or why an item with an unknown type renders nothing. A missing adapter renders null. In development, the host emits one error diagnostic per mounted item identity with the item's id and type; production stays silent. The host does not resolve, reject, or remove the item automatically, so it remains in the store and a display() promise remains pending until application code explicitly removes or clears it.

Practical note

The reference pages describe the runtime contract exactly. Guides may wrap these APIs into product-specific helpers, but those helpers should keep the same lifecycle language: open creates an item, close starts a closing state, remove settles and deletes an item, and clear ends every pending overlay in the provider scope.

On this page