fix(top-navigation): add hit-slop to actions

akveo · Jun 12, 2019 · ce984cf · ce984cf
1 parent f0234bf
commit ce984cf
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/src/framework/ui/topNavigation/topNavigationAction.component.tsx b/src/framework/ui/topNavigation/topNavigationAction.component.tsx
@@ -76,6 +76,8 @@ class TopNavigationActionComponent extends React.Component<TopNavigationActionPr
       iconMarginHorizontal,
     } = source;
 
+    const hitSlop: number = 40 - iconWidth;
+
     return {
       container: {
         marginHorizontal: iconMarginHorizontal,
@@ -88,6 +90,12 @@ class TopNavigationActionComponent extends React.Component<TopNavigationActionPr
         height: iconHeight,
         ...styles.icon,
       },
+      hitSlop: {
+        top: hitSlop,
+        left: hitSlop,
+        bottom: hitSlop,
+        right: hitSlop,
+      },
     };
   };
 
@@ -103,6 +111,7 @@ class TopNavigationActionComponent extends React.Component<TopNavigationActionPr
     return (
       <TouchableOpacity
         activeOpacity={1.0}
+        hitSlop={componentStyle.hitSlop}
         {...touchableProps}
         style={componentStyle.container}
         onPress={this.onPress}