Popper & React

A simple Popper.js component for React 16 to position elements

Grab the Gist here

Popper in React 16

I was in need for a simple Popper React component for my development, so i created a simple one that takes two elements as props. And outputs the calculated styles for the element to be positioned.

This React component will not create any extra markup to wrap the Popper elements in.

Pass a parent ( the element you want the popper to position to ) element to the ‘parent’ prop. And a target ( the element you wish to position relative to the parent ) element to the ‘target’ prop.

You will then need to pass the style calculated by Popper to the element you want to position. The ‘target’ prop is a Function as child.

No arrow functionality yet since i have not had the need for it. But I will update the Gist if i implement one.

Hope you will find this simple Popper React component useful!

Thanks!