App stoped - fixed

Author: williamniemiec

README.md

@@ -68,8 +68,8 @@ const image = { uri: "https://reactjs.org/logo-og.png" };
 |        Property        |Type|Description|Default|
 |----------------|-------------------------------|-----------------------------|--------|
 |display |`boolean`|Tooltip content | `true` |
-|selected |`bool`|Custom style | `null` |
-|fgColor |`string`|Text color  |`"rgba(0, 0, 0, 0.7)"`|
+|style |`bool`|Custom style | `null` |
+|bgColor |`string`|Background color  |`"rgba(0, 0, 0, 0.7)"`|
 
 ## 🚩 Changelog
 Details about each version are documented in the [releases section](https://github.com/wniemiec-component-reactnative/full-tooltip/releases).

src/FullTooltip/index.js

@@ -11,28 +11,28 @@
 import React from 'react';
 import { View } from 'react-native';
 import styles from './styles';
-import Triangle from './components/Triangle';
-import Rectangle from './components/Rectangle';
+import Triangle from '../components/Triangle';
+import Rectangle from '../components/Rectangle';
 
 /**
  * Full-width tooltip.
  * 
  * @param    {object} children Tooltip content
  * @param    {boolean} [display=true] Indicates whether the tooltip should be displayed 
  * @param    {object} [style=null] Custom style
- * @param    {string} [fgColor='rgba(0, 0, 0, 0.7)'] Text color
+ * @param    {string} [bgColor='rgba(0, 0, 0, 0.7)'] Background color
  */
 export default function FullTooltip({ 
   children, 
   display=true, 
   style=null, 
-  fgColor='rgba(0, 0, 0, 0.7)' 
+  bgColor='rgba(0, 0, 0, 0.7)' 
 }) {
 
   return (
-    <View style={[styles.area, style, {display: display}]}>
-      <Triangle fgColor={fgColor} />
-      <Rectangle fgColor={fgColor}>
+    <View style={[styles.area, style, !display ? styles.hide : null]}>
+      <Triangle bgColor={bgColor} />
+      <Rectangle bgColor={bgColor}>
         {children}
       </Rectangle>
     </View>

src/FullTooltip/styles.js

@@ -5,5 +5,8 @@ export default StyleSheet.create({
     width: '100%',
     justifyContent: "center",
     alignItems: 'center'
+  },
+  hide: {
+    transform: [{ scale: 0 }]
   }
 });

src/FullTooltip/components/Rectangle/index.js renamed to src/components/Rectangle/index.js

@@ -12,9 +12,9 @@ import React from 'react';
 import { View } from 'react-native';
 import styles from './styles';
 
-export default function Rectangle({ children, fgColor }) {
+export default function Rectangle({ children, bgColor }) {
   return (
-    <View style={[styles.area, { backgroundColor: fgColor }]}>
+    <View style={[styles.area, { backgroundColor: bgColor }]}>
       {children}
     </View>
   );

src/FullTooltip/components/Rectangle/styles.js renamed to src/components/Rectangle/styles.js

@@ -12,9 +12,9 @@ import React from 'react';
 import { View } from 'react-native';
 import styles from './styles';
 
-export default function Triangle({ fgColor }) {
+export default function Triangle({ bgColor }) {
   return (
-    <View style={[styles.triangle, { borderBottomColor: fgColor }]}>
+    <View style={[styles.triangle, { borderBottomColor: bgColor }]}>
     </View>
   );
 }