1.0.2 • Published 4 years ago

@gluedigital/tooltip v1.0.2

Weekly downloads
3
License
MIT
Repository
-
Last release
4 years ago

@gluedigital/tooltip

NPM JavaScript Style Guide

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