rn-tooltip

Simple, lightwweight and blazing fast react native tooltip

Expo App if you want to try it out: https://expo.io/@andreixoc/RNTooltipTester

Code for the Expo app is here: https://github.com/andreiCalazans/rnTooltipTester

Install

yarn add rn-tooltip

or

npm install rn-tooltip --save

Usage

``js
import { Text } from 'react-native';
import Tooltip from 'rn-tooltip';

...

Info here}>
Press me

`

Props

* backgroundColor
* containerStyle
* height
* highlightColor
* onClose
* onOpen
* pointerColor
* pointerStyle
* popover
* actionType
* width
* withOverlay
* overlayColor
* withPointer
* toggleWrapperProps

---

Reference

$3

sets backgroundColor of the tooltip and pointer.

| Type | Default |
| :----: | :-----: |
| string | #617080 |

---

$3

Passes style object to tooltip container

| Type | Default |
| :------------: | :---------------: |
| object (style) | inherited styling |

---

$3

Tooltip container height. Necessary in order to render the container in the
correct place. Pass height according to the size of the content rendered inside
the container.

| Type | Default |
| :----: | :-----: |
| number | string | 40 |

---

$3

Color to highlight the item the tooltip is surrounding.

| Type | Default |
| :----: | :---------: |
| string | transparent |

---

$3

function which gets called on closing the tooltip.

| Type | Default |
| :------: | :------: |
| function | () => {} |

---

$3

function which gets called on opening the tooltip.

| Type | Default |
| :------: | :------: |
| function | () => {} |

---

$3

Color of tooltip pointer, it defaults to the
backgroundColor if none is passed .

| Type | Default |
| :----: | :-----------------------------------: |
| string | backgroundColor` |

---

$3

Passes style object to tooltip pointer view

| Type | Default |
| :------------: | :---------------: |
| object (style) | inherited styling |

$3

Component to be rendered as the display container.

| Type | Default |
| :-----------: | :-----: |
| React.Element | null |

---

$3

Flag to determine how the tooltip reacts to presses.

| Type | Default |
| :-----: | :-----: |
| press or none or longPress | press |

---

$3

Tooltip container width. Necessary in order to render the container in the
correct place. Pass height according to the size of the content rendered inside
the container.

| Type | Default |
| :----: | :-----: |
| number | number | 150 |

$3

Flag to determine whether or not dislay overlay shadow when tooltip is open.

| Type | Default |
| :-----: | :-----: |
| boolean | true |

$3

Sets backgroundColor of the overlay.

| Type | Default |
| :-----: | :-----: |
| string | rgba(250, 250, 250, 0.70) |

$3

Flag to determine whether or not dislay pointer.

| Type | Default |
| :-----: | :-----: |
| boolean | true |

$3

Drills TouchableOpacity Props down to the TouchableOpacity wrapper that toggles the Tooltip.

| Type | Default |
| :------------: | :---------------: |
| TouchableOpacityProps | {} |

MIT Licensed