rc-simple-tooltip v1.3.20

Simple react tooltip component

Demo

Installation

Install package with npm:

npm i rc-simple-tooltip

Install package with yarn:

yarn add rc-simple-tooltip

Basic Usage

Import Tooltip component:

import Tooltip from 'rc-simple-tooltip';

Wrap your component with Tooltip:

<Tooltip trigger="hover" content="Tooltip content">
  <button>Complete action</button>
</Tooltip>

Tooltip works with any component that supports refs. For custom functional components you need to forward ref:

const Button = React.forwardRef(({children, ...props}, ref) =>
  <button {...props} ref={ref}>{children}</button>
);
<Tooltip trigger="hover" content="Tooltip content">
  <Button>Complete action</Button>
</Tooltip>

Tooltip can be used without any children:

<Tooltip top content="Tooltip content" />

Additionally import styles.css to apply default styling:

import 'rc-simple-tooltip/dist/styles.css';

Props

Running locally

With yarn:

yarn start

With npm:

npm start