PopoverAnchor

Type: React component

How to get PopoverAnchor?

JavaScript

import { PopoverAnchor } from 'fds/components';

A helper component used to easily position a Popover next to an anchor element. Uses render functions to render both the desired anchor and Popover.

Props

  1. isPopoverOpenedInitially

    (Optional)

    Type: Boolean

    Whether or not the popover is opened initially (from its first render). After the first render, whether or not the popover is opened is determined by this component's local state. Changing this prop afterwards won't affect it.

    Default value

  2. preferredPositionSpec

    (Required)

    A position spec that is preferred (tried first) before the normal Popover position spec. Eg. set this to:

    Other

    [
      { direction: positioner.DIRECTION_WEST, extension: positioner.EXTENSION_FORWARD },
      { direction: positioner.DIRECTION_WEST, extension: positioner.EXTENSION_BACKWARD },
      { direction: positioner.DIRECTION_WEST, extension: positioner.EXTENSION_CENTER }
    ]

    to try positioning the popover on the left of the element first (normally that is tried last).

    Default value

  3. renderAnchor

    (Required)

    Type: Function

    A callback that is called at render time, used to render an anchor point to trigger a popover from.

    Arguments

  4. renderPopover

    (Required)

    Type: Function

    A callback that is called at render time, used to render the Popover corresponding to the anchor point.

    Arguments