@gluedigital/tooltip

A customizable tooltip component.

Install

yarn add @gluedigital/tooltip

Usage

Simply wrap the Tooltip component around the element that will show a tooltip when hovered over.

You can customize the tooltip with the following props:

• content: Tooltip's content. Can be a string or a JSX element.
• position: Position of the tooltip with respect of the element. Can be top, bottom, right or left.
• className: Additional styles to apply to the tooltip.

Example

import React from 'react'
import { Tooltip } from '@gluedigital/tooltip'

const App = () => {
  return (
    <Tooltip
      content='Tooltip content here'
      position='left'
      className='custom-css'
    >
      <div className='element-with-tooltip'>
        Hover over me to show a tooltip!
      </div>
    </Tooltip>
  )
}

export default App