From 90b50a0b9910e8e32becf4e48112253eb2044475 Mon Sep 17 00:00:00 2001
From: AndreiCalazans <andreixoc@hotmail.com>
Date: Fri, 15 Nov 2019 10:54:59 -0300
Subject: [PATCH] feat: enable tooltip pointer customization

---
 README.md      | 13 +++++++++++--
 index.d.ts     |  1 +
 src/Tooltip.js | 10 ++++++++--
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 158037b..a0d6db6 100644
--- a/README.md
+++ b/README.md
@@ -45,6 +45,7 @@ import Tooltip from 'rn-tooltip';
 * [`onClose`](#onClose)
 * [`onOpen`](#onOpen)
 * [`pointerColor`](#pointerColor)
+* [`pointerStyle`](#pointerStyle)
 * [`popover`](#popover)
 * [`actionType`](#actionType)
 * [`width`](#width)
@@ -130,6 +131,14 @@ Color of tooltip pointer, it defaults to the
 
 ---
 
+### `pointerStyle`
+
+Passes style object to tooltip pointer view
+
+|      Type      |      Default      |
+| :------------: | :---------------: |
+| object (style) | inherited styling |
+
 ### `popover`
 
 Component to be rendered as the display container.
@@ -145,8 +154,8 @@ Component to be rendered as the display container.
 Flag to determine how the tooltip reacts to presses.
 
 |  Type   | Default |
-| :-----: | press |
-| Enum |  none or  press or longPress  |
+| :-----: | :-----: |
+| press or none or longPress | press |
 
 ---
 
diff --git a/index.d.ts b/index.d.ts
index 037f6fa..92cd984 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -8,6 +8,7 @@ type Props = {
   width?: number | string,
   containerStyle?: StyleProp<ViewStyle>;
   pointerColor?: string,
+  pointerStyle?: StyleProp<ViewStyle>,
   onClose?: () => void,
   onOpen?: () => void,
   withOverlay?: boolean,
diff --git a/src/Tooltip.js b/src/Tooltip.js
index 7849021..d3b747f 100644
--- a/src/Tooltip.js
+++ b/src/Tooltip.js
@@ -30,6 +30,7 @@ type Props = {
   width: number | string,
   containerStyle: any,
   pointerColor: string,
+  pointerStyle: {},
   onClose: () => void,
   onOpen: () => void,
   withOverlay: boolean,
@@ -132,7 +133,7 @@ class Tooltip extends React.Component<Props, State> {
 
   renderPointer = tooltipY => {
     const { yOffset, xOffset, elementHeight, elementWidth } = this.state;
-    const { backgroundColor, pointerColor } = this.props;
+    const { backgroundColor, pointerColor, pointerStyle } = this.props;
     const pastMiddleLine = yOffset > tooltipY;
 
     return (
@@ -144,7 +145,10 @@ class Tooltip extends React.Component<Props, State> {
         }}
       >
         <Triangle
-          style={{ borderBottomColor: pointerColor || backgroundColor }}
+          style={{
+            borderBottomColor: pointerColor || backgroundColor,
+            ...pointerStyle,
+          }}
           isDown={pastMiddleLine}
         />
       </View>
@@ -234,6 +238,7 @@ Tooltip.propTypes = {
   width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   containerStyle: ViewPropTypes.style,
   pointerColor: PropTypes.string,
+  pointerStyle: PropTypes.object,
   onClose: PropTypes.func,
   onOpen: PropTypes.func,
   withOverlay: PropTypes.bool,
@@ -253,6 +258,7 @@ Tooltip.defaultProps = {
   height: 40,
   width: 150,
   containerStyle: {},
+  pointerStyle: {},
   backgroundColor: '#617080',
   onClose: () => {},
   onOpen: () => {},