Skip to content
FrameworkStyle

usePopoverContext

Hook to access the nearest Popover compound-component context

Import

import { usePopoverContext } from "@videojs/react";

Usage

Use this hook to build a custom part rendered inside Popover.Root.

function ClosePopoverButton() {
  const { popover } = usePopoverContext();

  return <button onClick={() => popover.close()}>Close popover</button>;
}

The hook throws when there is no surrounding Popover.Root.

API Reference

Return Value

PropertyTypeDetails
corePopoverCore
popoverobject
statePopoverCore.State
preferredSidePopoverCore.State['side']
setPositionedSidefunction
stateAttrMap{ [Key in keyof State]?: string; }
anchorNamestring
popupIdstring
boundary'viewport' | 'container' | string & o...
containerobject | null