Popover React Component

Popover compontent is used to manage the presentation of content in a popover. You use popovers to present information temporarily. The popover remains visible until the user taps outside of the popover window or you explicitly dismiss it.

Popover React component represents Popover component.

Usage example

<!-- Popover -->
<Popover>
  <!-- Popover content goes here -->
</Popover>

Renders to:

<!-- Popover -->
<div class="popover">
  <div class="popover-angle"></div>
  <div class="popover-content">
    <!-- Popover content goes here -->
  </div>
</div>

Properties

Popover component has no any properties

Event Properties

Event Description
onPopoverOpen Event will be triggered when Popover starts its opening animation
onPopoverOpened Event will be triggered after Popover completes its opening animation
onPopoverClose Event will be triggered when Popover starts its closing animation
onPopoverClosed Event will be triggered after Popover completes its closing animation

Open and close Popover

You can control Popover state, open and closing it:

  • using its JavaScript API
  • by clicking on Link or Button with relevant openPopover property (to open it) and closePopover property to close it