fix: makes FAB not pressable when initialy not visible (#858)

callstack · Feb 21, 2019 · ade8d27 · ade8d27
1 parent 7a4966d
commit ade8d27
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/src/components/FAB/FAB.js b/src/components/FAB/FAB.js
@@ -136,6 +136,7 @@ class FAB extends React.Component<Props, State> {
       onPress,
       theme,
       style,
+      visible,
       ...rest
     } = this.props;
     const { visibility } = this.state;
@@ -185,6 +186,7 @@ class FAB extends React.Component<Props, State> {
           disabled && styles.disabled,
           style,
         ]}
+        pointerEvents={visible ? 'auto' : 'none'}
       >
         <TouchableRipple
           borderless

diff --git a/src/components/__tests__/__snapshots__/FAB.test.js.snap b/src/components/__tests__/__snapshots__/FAB.test.js.snap
@@ -2,6 +2,7 @@
 
 exports[`renders extended FAB 1`] = `
 <View
+  pointerEvents="auto"
   style={
     Object {
       "backgroundColor": "#03dac4",
@@ -22,7 +23,6 @@ exports[`renders extended FAB 1`] = `
       ],
     }
   }
-  visible={true}
 >
   <View
     accessibilityLabel="Add items"
@@ -159,6 +159,7 @@ exports[`renders extended FAB 1`] = `
 
 exports[`renders normal FAB 1`] = `
 <View
+  pointerEvents="auto"
   style={
     Object {
       "backgroundColor": "#03dac4",
@@ -179,7 +180,6 @@ exports[`renders normal FAB 1`] = `
       ],
     }
   }
-  visible={true}
 >
   <View
     accessibilityRole="button"
@@ -292,6 +292,7 @@ exports[`renders normal FAB 1`] = `
 
 exports[`renders small FAB 1`] = `
 <View
+  pointerEvents="auto"
   style={
     Object {
       "backgroundColor": "#03dac4",
@@ -312,7 +313,6 @@ exports[`renders small FAB 1`] = `
       ],
     }
   }
-  visible={true}
 >
   <View
     accessibilityRole="button"