updated the packages & fix the propType issue

.gitignore

@@ -6,3 +6,4 @@
 #
 node_modules/
 npm-debug.log
+.jest

Button.js

@@ -0,0 +1,150 @@
+/* eslint-disable react/forbid-prop-types */
+/* eslint-disable react/require-default-props */
+/* eslint-disable react/jsx-props-no-spreading */
+/* eslint-disable react/destructuring-assignment */
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import {
+  Platform,
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  TouchableNativeFeedback,
+  View,
+} from 'react-native';
+import { ViewPropTypes, TextPropTypes } from 'deprecated-react-native-prop-types';
+import coalesceNonElementChildren from './coalesceNonElementChildren';
+
+const systemButtonOpacity = 0.2;
+const styles = StyleSheet.create({
+  text: {
+    color: '#007aff',
+    fontSize: 17,
+    fontWeight: '500',
+    textAlign: 'center',
+  },
+  disabledText: {
+    color: '#dcdcdc',
+  },
+  group: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+  },
+});
+
+class Button extends Component {
+  computeActiveOpacity() {
+    if (this.props.disabled) {
+      return 1;
+    }
+    return this.props.activeOpacity != null
+      ? this.props.activeOpacity
+      : systemButtonOpacity;
+  }
+
+  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, (children2, index) => (
+      <Text key={index} style={style} allowFontScaling={this.props.allowFontScaling}>
+        {children2}
+      </Text>
+    ));
+
+    switch (children.length) {
+      case 0:
+        return null;
+      case 1:
+        return children[0];
+      default:
+        return <View style={childGroupStyle}>{children}</View>;
+    }
+  }
+
+  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>
+    );
+  }
+}
+
+Button.propTypes = {
+  ...TouchableOpacity.propTypes,
+  accessibilityLabel: PropTypes.string,
+  allowFontScaling: PropTypes.bool,
+  containerStyle: ViewPropTypes.style,
+  disabledContainerStyle: ViewPropTypes.style,
+  disabled: PropTypes.bool,
+  style: TextPropTypes.style,
+  styleDisabled: TextPropTypes.style,
+  childGroupStyle: ViewPropTypes.style,
+  androidBackground: PropTypes.object,
+};
+
+export default Button;

CHANGELOG.md

@@ -4,7 +4,10 @@ All notable changes to this package will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [Unreleased]
+## [1.2.0] - 2022-08-06
+- Updated the packages to latest version
+- Able to run with React v18 and Expo v46
+- Fixed the bug related to `propTypes` issues in the dependency component from the 'react-native-button' package. And that file was also merged with this repo.
 
 ## [1.1.0] - 2017-06-20
 ### Added

CONTRIBUTING.md

@@ -30,7 +30,7 @@
 
 ### Fork the repo
 
-Use github’s interface to make a fork of the repo, then add that repo as an upstream remote:
+Use github's interface to make a fork of the repo, then add that repo as an upstream remote:
 
 ```
 git remote add upstream https://github.com/djchie/react-native-star-rating.git
@@ -53,7 +53,7 @@ These commands will help you do this:
 git checkout -b `your-branch-name`
 ```
 
-### Make commits to your feature branch. 
+### Make commits to your feature branch.
 
 Prefix each commit like so
   - (feat) Added a new feature
@@ -113,7 +113,7 @@ git rebase --continue
 ```
 
 This will continue the rebasing process. Once you are done fixing all
-conflicts you should run the existing tests to make sure you didn’t break
+conflicts you should run the existing tests to make sure you didn't break
 anything, then run your new tests (there are new tests, right?) and
 make sure they work also.
 

README.md

@@ -4,6 +4,11 @@
 
 # React Native Star Rating Component
 
+What I did in my fork as follows:
+- Updated the packages to latest version
+- Able to run with React v18 and Expo v46
+- Fixed the bug related to `propTypes` issues in the dependency component from the 'react-native-button' package. And that file was also merged with this repo.
+
 > A React Native component for generating and displaying interactive star ratings. Compatible with both iOS and Android.
 
 ## Table of Contents
@@ -26,7 +31,7 @@ or
 ```sh
 yarn add react-native-star-rating
 ```
-2. link `react-native-vector-icons`   
+2. link `react-native-vector-icons`
 please refer to [react-native-vector-icons installation guide](https://github.com/oblador/react-native-vector-icons#installation)
 
 ## Usage

StarButton.js

@@ -1,11 +1,11 @@
 // React and react native imports
 import React, { Component } from 'react';
-import { Image, StyleSheet, ViewPropTypes } from 'react-native';
+import { Image, StyleSheet } from 'react-native';
 import PropTypes from 'prop-types';
 import { createIconSetFromIcoMoon } from 'react-native-vector-icons';
+import { ViewPropTypes } from 'deprecated-react-native-prop-types';
 
 // Third party imports
-import Button from 'react-native-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';
@@ -17,6 +17,7 @@ import MaterialCommunityIconsIcons from 'react-native-vector-icons/MaterialCommu
 import OcticonsIcons from 'react-native-vector-icons/Octicons';
 import ZocialIcons from 'react-native-vector-icons/Zocial';
 import SimpleLineIconsIcons from 'react-native-vector-icons/SimpleLineIcons';
+import Button from './Button';
 
 const iconSets = {
   Entypo: EntypoIcons,

StarRating.js

@@ -1,8 +1,9 @@
 // React and react native imports
 import React, { Component } from 'react';
-import { View, ViewPropTypes, StyleSheet } from 'react-native';
+import { View, StyleSheet } from 'react-native';
 import PropTypes from 'prop-types';
 import { View as AnimatableView } from 'react-native-animatable';
+import { ViewPropTypes } from 'deprecated-react-native-prop-types';
 
 // Local file imports
 import StarButton from './StarButton';

babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: ['module:metro-react-native-babel-preset'],
+};

coalesceNonElementChildren.js

@@ -0,0 +1,30 @@
+import React, { Children } from 'react';
+
+export default function coalesceNonElementChildren(children, coalesceNodes) {
+  const coalescedChildren = [];
+
+  let 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;
+}

jest.config.js

@@ -0,0 +1,23 @@
+// jest.config.js
+module.exports = {
+  preset: 'react-native',
+  moduleFileExtensions: [
+    'ts',
+    'tsx',
+    'js',
+    'jsx',
+    'json',
+    'node',
+  ],
+  modulePathIgnorePatterns: [
+    '<rootDir>/ExampleApp/',
+  ],
+  transformIgnorePatterns: ['/node_modules/(?!(@react-native|react-native)).*/'],
+  testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$',
+  testPathIgnorePatterns: [
+    '<rootDir>/node_modules/',
+    '<rootDir>/ExampleApp/',
+    '\\.snap$',
+  ],
+  cacheDirectory: '.jest/cache',
+};