elementary-watson-component

This is a react component that stays on the top of a DOM element. It is able to track position and size changes of the DOM element, and update its position and size accordingly.

It is designed for building overlays on top of other elements, tooltips for example.

Compatibility

The module is in ES5 and it should work

How to use it

import ElementaryWatsonComponent from 'ElementaryWatsonComponent'

...

const element = document.querySelector('.selector')

<ElementaryWatsonComponent element={element}>
  This content will be placed on top of the item with the class selector
</ElementaryWatsonComponent>

props

• element: (optional) a DOM element. The component will be positioned (absolute or fixed) and resized to overlap this element. If the element is undefined the component will be hidden
• className: (optional) className to assign to the wrapper component
• style: (optional) style to assign to the wrapper component