PopoverHeader

Type: React component

How to get PopoverHeader?

JavaScript

import { PopoverHeader } from 'fds/components';

Serves as the header of the popover, rendering a Heading and an optional Icon. Additionally a connotation prop can be set to specify the severity of the popover. The content of this header should describe the purpose of the popover in a summarized manner.

Should be used as a direct child of a Popover component.

Props

  1. connotation

    (Optional)

    Type: String

    Specifies the meaning and/or severity of the given context. The possible values are:

    • 'error'

    • 'warning'

    Omit this prop for the default color.

    Default value

  2. icon

    (Optional)

    Type: String

    The name of the icon displayed in the component.

    This should be one of the Font Awesome icons. Do not include the fa- prefix, just use the icon names as-is from the documentation.

  3. title

    (Required)

    Type: String

    The title displayed in the component, generally presented inside a Heading component.