DropAnchor

Type: React component

How to get DropAnchor?

JavaScript

import { DropAnchor } from 'fds/components';

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

Props

  1. isDropOpenedInitially

    (Optional)

    Type: Boolean

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

    Default value

  2. onRef

    (Optional)

    Type: Function

    A callback that is called whenever a component's ref changes.

    Use this callback to get a ref to (the domNode of) a component. There shouldn't be many usecases for using this prop yourself, but you might have to implement it with a given argument from a render callback somewhere.

    For more information about React and "refs", check the React documentation

    Arguments

    Returns

  3. preferredPositionSpec

    (Required)

    A position spec that is preferred (tried first) before the normal drop 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 drop on the left of the element first (normally that is tried last).

    Default value

  4. renderAnchor

    (Required)

    Type: Function

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

    Arguments

  5. renderDrop

    (Required)

    Type: Function

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

    Arguments