RN: Update to work with React Native >= 0.70 (propType, dependencies,…

Button.js

@@ -0,0 +1,130 @@
+import React, { Component } from 'react';
+import {
+  Platform,
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  TouchableNativeFeedback,
+  View,
+} from 'react-native';
+import coalesceNonElementChildren from './coalesceNonElementChildren';
+
+const systemButtonOpacity = 0.2;
+
+export default class Button extends Component {
+  render() {
+    const touchableProps = {
+      activeOpacity: this._computeActiveOpacity(),
+    };
+    const containerStyle = [
+      this.props.containerStyle,
+      this.props.disabled ? this.props.disabledContainerStyle : null,
+    ];
+
+    if (!this.props.disabled) {
+      touchableProps.onPress = this.props.onPress;
+      touchableProps.onPressIn = this.props.onPressIn;
+      touchableProps.onPressOut = this.props.onPressOut;
+      touchableProps.onLongPress = this.props.onLongPress;
+      touchableProps.delayPressIn = this.props.delayPressIn;
+      touchableProps.delayPressOut = this.props.delayPressOut;
+      touchableProps.delayLongPress = this.props.delayLongPress;
+    }
+
+    if (Platform.OS === 'ios') {
+      return (
+        <TouchableOpacity
+          {...touchableProps}
+          testID={this.props.testID}
+          style={containerStyle}
+          accessibilityLabel={this.props.accessibilityLabel}
+          accessibilityRole="button"
+        >
+          {this._renderGroupedChildren()}
+        </TouchableOpacity>
+      );
+    }
+    const background = this.props.androidBackground
+      ? this.props.androidBackground
+      : TouchableNativeFeedback.SelectableBackground();
+
+    let padding = 0;
+    if (containerStyle[0] && containerStyle[0].padding) {
+      padding = containerStyle[0].padding;
+      const fixedStyle = { ...containerStyle[0], padding: 0 };
+      containerStyle[0] = fixedStyle;
+    }
+
+    return (
+      <View style={containerStyle}>
+        <TouchableNativeFeedback
+          {...touchableProps}
+          style={{ flex: 1 }}
+          testID={this.props.testID}
+          accessibilityLabel={this.props.accessibilityLabel}
+          accessibilityRole="button"
+          background={background}
+        >
+          <View style={{ padding }}>
+            {this._renderGroupedChildren()}
+          </View>
+        </TouchableNativeFeedback>
+      </View>
+    );
+  }
+
+  _renderGroupedChildren() {
+    const { disabled } = this.props;
+    const style = [
+      styles.text,
+      disabled ? styles.disabledText : null,
+      this.props.style,
+      disabled ? this.props.styleDisabled : null,
+    ];
+    const childGroupStyle = [
+      styles.group,
+      this.props.childGroupStyle,
+    ];
+
+    const children = coalesceNonElementChildren(this.props.children, (children, index) => (
+      <Text key={index} style={style} allowFontScaling={this.props.allowFontScaling}>
+        {children}
+      </Text>
+    ));
+
+    switch (children.length) {
+      case 0:
+        return null;
+      case 1:
+        return children[0];
+      default:
+        return <View style={childGroupStyle}>{children}</View>;
+    }
+  }
+
+  _computeActiveOpacity() {
+    if (this.props.disabled) {
+      return 1;
+    }
+    return this.props.activeOpacity != null
+      ? this.props.activeOpacity
+      : systemButtonOpacity;
+  }
+}
+
+const styles = StyleSheet.create({
+  text: {
+    color: '#007aff',
+    fontSize: 17,
+    fontWeight: '500',
+    textAlign: 'center',
+  },
+  disabledText: {
+    color: '#dcdcdc',
+  },
+  group: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+  },
+});

StarButton.js

@@ -1,11 +1,12 @@
 // React and react native imports
 import React, { Component } from 'react';
-import { Image, StyleSheet, ViewPropTypes } from 'react-native';
+import { Image, StyleSheet } from 'react-native';
+import { ViewPropTypes } from 'deprecated-react-native-prop-types';
 import PropTypes from 'prop-types';
 import { createIconSetFromIcoMoon } from 'react-native-vector-icons';
 
 // Third party imports
-import Button from 'react-native-button';
+import Button from './Button';
 import EntypoIcons from 'react-native-vector-icons/Entypo';
 import EvilIconsIcons from 'react-native-vector-icons/EvilIcons';
 import FeatherIcons from 'react-native-vector-icons/Feather';

StarRating.js

@@ -1,6 +1,7 @@
 // React and react native imports
 import React, { Component } from 'react';
-import { View, ViewPropTypes, StyleSheet } from 'react-native';
+import { View, StyleSheet } from 'react-native';
+import { ViewPropTypes } from 'deprecated-react-native-prop-types';
 import PropTypes from 'prop-types';
 import { View as AnimatableView } from 'react-native-animatable';
 

coalesceNonElementChildren.js

@@ -0,0 +1,31 @@
+import React, { Children } from 'react';
+
+
+export default function coalesceNonElementChildren(children, coalesceNodes) {
+  var coalescedChildren = [];
+
+  var contiguousNonElements = [];
+  Children.forEach(children, (child) => {
+    if (!React.isValidElement(child)) {
+      contiguousNonElements.push(child);
+      return;
+    }
+
+    if (contiguousNonElements.length) {
+      coalescedChildren.push(
+        coalesceNodes(contiguousNonElements, coalescedChildren.length)
+      );
+      contiguousNonElements = [];
+    }
+
+    coalescedChildren.push(child);
+  });
+
+  if (contiguousNonElements.length) {
+    coalescedChildren.push(
+      coalesceNodes(contiguousNonElements, coalescedChildren.length)
+    );
+  }
+
+  return coalescedChildren;
+}