v3.7.0 #40

Author: iRoachie

README.md

@@ -66,6 +66,7 @@ import MaterialTabs from 'react-native-material-tabs';
 | onChange          | none                     | Function      | Handler that's emitted every time the user presses a tab. You can use this to change the selected index |
 | allowFontScaling  | true                     | boolean       | Specifies whether fonts should scale to respect Text Size accessibility settings                        |
 | uppercase         | true                     | boolean       | Specifies whether to uppercase the tab labels                                                           |
+| keyboardShouldPersistTaps | never          | string | Specifies how the [ScrollView](https://facebook.github.io/react-native/docs/scrollview#keyboardshouldpersisttaps) should respond to taps while keyboard is open                          |
 
 ## Example
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-material-tabs",
-  "version": "3.6.2",
+  "version": "3.7.0",
   "description": "Material Design implementation of Tabs",
   "keywords": [
     "react",
@@ -22,7 +22,7 @@
     "flow": "flow check",
     "lint": "eslint **/*.js",
     "format": "eslint --fix **/*.js",
-    "test": "jest"
+    "test": "jest --runInBand"
   },
   "dependencies": {
     "prop-types": "^15.5.10",

src/__tests__/__snapshots__/main.test.js.snap

@@ -17,6 +17,7 @@ exports[`Main should apply custom activeTextStyle to active tab 1`] = `
 >
   <RCTScrollView
     horizontal={true}
+    keyboardShouldPersistTaps="never"
     scrollEnabled={false}
     showsHorizontalScrollIndicator={false}
   >
@@ -203,6 +204,7 @@ exports[`Main should apply custom fontFamily to tab 1`] = `
 >
   <RCTScrollView
     horizontal={true}
+    keyboardShouldPersistTaps="never"
     scrollEnabled={false}
     showsHorizontalScrollIndicator={false}
   >
@@ -391,6 +393,7 @@ exports[`Main should display tab labels not uppercased 1`] = `
 >
   <RCTScrollView
     horizontal={true}
+    keyboardShouldPersistTaps="never"
     scrollEnabled={false}
     showsHorizontalScrollIndicator={false}
   >
@@ -575,6 +578,7 @@ exports[`Main should render without errors 1`] = `
 >
   <RCTScrollView
     horizontal={true}
+    keyboardShouldPersistTaps="never"
     scrollEnabled={false}
     showsHorizontalScrollIndicator={false}
   >

src/components/MaterialTabs.js

@@ -23,6 +23,7 @@ type Props = {
   items: string[],
   uppercase: boolean,
   onChange: (index: number) => void,
+  keyboardShouldPersistTaps: string,
 };
 
 type State = {
@@ -46,6 +47,7 @@ export default class MaterialTabs extends React.Component<Props, State> {
     items: PropTypes.arrayOf(PropTypes.string).isRequired,
     uppercase: PropTypes.bool,
     onChange: PropTypes.func.isRequired,
+    keyboardShouldPersistTaps: PropTypes.string,
   };
 
   static defaultProps = {
@@ -60,6 +62,7 @@ export default class MaterialTabs extends React.Component<Props, State> {
     textStyle: null,
     uppercase: true,
     activeTextStyle: {},
+    keyboardShouldPersistTaps: 'never',
   };
 
   state = {
@@ -166,6 +169,7 @@ export default class MaterialTabs extends React.Component<Props, State> {
           horizontal
           ref={ref => (this.scrollView = ref)}
           showsHorizontalScrollIndicator={false}
+          keyboardShouldPersistTaps={this.props.keyboardShouldPersistTaps}
           scrollEnabled={this.props.scrollable}
         >
           <TabTrack barHeight={this.props.barHeight}>

src/index.d.ts

@@ -86,6 +86,13 @@ interface TabsProps {
    * @param index
    */
   onChange(index: number): void;
+
+  /**
+   * Optional keyboard tap behaviour for the ScrollView.
+   * See: https://facebook.github.io/react-native/docs/scrollview#keyboardshouldpersisttaps
+   * Default 'none'.
+   */
+  keyboardShouldPersistTaps?: "always" | "never" | "handled";
 }
 
 export default class MaterialTabs extends React.Component<TabsProps> {}