@fidelisppm/popover

3.2.1 • Public • Published

Popover

A React component which displays a popover when a target element is clicked.

Props

trigger (object):
Required. A DOM element which will display the popover when clicked.

content (object):
Required. A DOM element which will be rendered inside the popover.

position (string):
Optional. The position relative to the trigger where the popover will be displayed. Acceptable values are top, bottom, left, and right.
Defaults to top.

hideArrow (bool):
Optional. If true, the arrow will not be displayed.
Defaults to false.

arrowColor (string):
Optional. The color of the popover arrow.
Defaults to "#000000".

arrowSize (int):
Optional. The size in pixels of the width of the popover arrow.
Defaults to 6.

distance (int):
Optional. The distance in pixels the popover will be rendered away from the trigger.
Defaults to 0.

Usage

import { Popover } from '@fidelisppm/popover';

<Popover
  trigger={document.getElementById('example-element')}
  content={<span>I am popover text!</span>}
  position="top"
  hideArrow={false}
  arrowColor="#000000"
  arrowSize={6}
  distance={0}
/>

Readme

Keywords

Package Sidebar

Install

npm i @fidelisppm/popover

Weekly Downloads

1

Version

3.2.1

License

SEE LICENSE IN GIT REPO

Unpacked Size

1.32 MB

Total Files

12

Last publish

Collaborators

  • legendary_linux
  • sapphirecat
  • danyay