react-native-credit-card-input icon indicating copy to clipboard operation
react-native-credit-card-input copied to clipboard

Published 20 hours ago • verified publisher icon sbycrosz

ViewPropsType deprecated error [fixed]

Open zinlinphyo opened this issue 2 years ago • 7 comments

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch [email protected] for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-credit-card-input/src/CCInput.js b/node_modules/react-native-credit-card-input/src/CCInput.js
index dde3aec..62081b4 100644
--- a/node_modules/react-native-credit-card-input/src/CCInput.js
+++ b/node_modules/react-native-credit-card-input/src/CCInput.js
@@ -6,8 +6,8 @@ import {
   TextInput,
   TouchableOpacity,
   StyleSheet,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 const s = StyleSheet.create({
   baseInputStyle: {
@@ -26,8 +26,8 @@ export default class CCInput extends Component {
     status: PropTypes.oneOf(["valid", "invalid", "incomplete"]),
 
     containerStyle: ViewPropTypes.style,
-    inputStyle: Text.propTypes.style,
-    labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,
     placeholderColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/CreditCardInput.js b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
index 44f43c8..db6e0d6 100644
--- a/node_modules/react-native-credit-card-input/src/CreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
@@ -8,8 +8,8 @@ import ReactNative, {
   ScrollView,
   Dimensions,
   TextInput,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 import CreditCard from "./CardView";
 import CCInput from "./CCInput";
@@ -48,8 +48,8 @@ export default class CreditCardInput extends Component {
     labels: PropTypes.object,
     placeholders: PropTypes.object,
 
-    labelStyle: Text.propTypes.style,
-    inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
     inputContainerStyle: ViewPropTypes.style,
 
     validColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
index a5f166b..fb4ad65 100644
--- a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
@@ -72,7 +72,7 @@ export default class LiteCreditCardInput extends Component {
 
     placeholders: PropTypes.object,
 
-    inputStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
 
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,

This issue body was partially generated by patch-package.

zinlinphyo avatar Nov 11 '22 05:11 zinlinphyo

Hi, After update, it goes to old version when i use yarn or npm install. How can i keep new updated files?

hayalpc avatar Nov 18 '22 14:11 hayalpc

Fix!

  1. Run yarn add patch-package postinstall-postinstall && yarn add deprecated-react-native-prop-types
  2. Add this script command to package.json "scripts": { "postinstall": "patch-package" }
  3. Open node_modules/react-native-credit-card-input/src/CCInput.js and remove ViewPropTypes, from line 9
  4. Add import ViewPropTypes from 'deprecated-react-native-prop-types' to line 10
  5. Comment out lines 29 and 30 respectively // labelStyle: Text.propTypes.style, // inputStyle: Text.propTypes.style,
  6. Open node_modules/react-native-credit-card-input/src/CreditCardInput.js and remove ViewPropTypes, from line 11
  7. Add import ViewPropTypes from 'deprecated-react-native-prop-types' to line 12
  8. Comment out lines 51 and 52 respectively // labelStyle: Text.propTypes.style, // inputStyle: Text.propTypes.style,
  9. Open node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js and comment out line 75 // inputStyle: Text.propTypes.style,
  10. Run yarn patch-package react-native-credit-card-input

You should have a folder /patches/react-native-credit-card-input+0.4.1.patch

index dde3aec..62081b4 100644
--- a/node_modules/react-native-credit-card-input/src/CCInput.js
+++ b/node_modules/react-native-credit-card-input/src/CCInput.js
@@ -6,8 +6,8 @@ import {
   TextInput,
   TouchableOpacity,
   StyleSheet,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 const s = StyleSheet.create({
   baseInputStyle: {
@@ -26,8 +26,8 @@ export default class CCInput extends Component {
     status: PropTypes.oneOf(["valid", "invalid", "incomplete"]),
 
     containerStyle: ViewPropTypes.style,
-    inputStyle: Text.propTypes.style,
-    labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,
     placeholderColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/CreditCardInput.js b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
index 44f43c8..db6e0d6 100644
--- a/node_modules/react-native-credit-card-input/src/CreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
@@ -8,8 +8,8 @@ import ReactNative, {
   ScrollView,
   Dimensions,
   TextInput,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 import CreditCard from "./CardView";
 import CCInput from "./CCInput";
@@ -48,8 +48,8 @@ export default class CreditCardInput extends Component {
     labels: PropTypes.object,
     placeholders: PropTypes.object,
 
-    labelStyle: Text.propTypes.style,
-    inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
     inputContainerStyle: ViewPropTypes.style,
 
     validColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
index a5f166b..fb4ad65 100644
--- a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
@@ -72,7 +72,7 @@ export default class LiteCreditCardInput extends Component {
 
     placeholders: PropTypes.object,
 
-    inputStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
 
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,

ckOfor avatar Nov 27 '22 12:11 ckOfor

Thank you @ckOfor. I did it and solved my problem :)

hayalpc avatar Nov 27 '22 12:11 hayalpc

@hayalpc very happy to help :)

ckOfor avatar Nov 27 '22 12:11 ckOfor

For those who are using react-native-flip-card/lib/FlipCard.js please do the following steps steps after step 10 in my comment here

  1. Open node_modules/react-native-flip-card/lib/FlipCard.js and remove ViewPropTypes from line 9
  2. Import import ViewPropTypes from 'deprecated-react-native-prop-types' on line 13
  3. Run yarn patch-package react-native-flip-card

You should have another You should have a folder /patches/react-native-flip-card+3.5.6.patch

index c496da7..5e513a9 100644
--- a/node_modules/react-native-flip-card/lib/FlipCard.js
+++ b/node_modules/react-native-flip-card/lib/FlipCard.js
@@ -8,9 +8,10 @@ import {
   TouchableOpacity,
   Animated,
   Platform,
-  ViewPropTypes
 } from "react-native";
 
+import ViewPropTypes from 'deprecated-react-native-prop-types'
+
 import S from './Style.js'
 
 export default class FlipCard extends Component {

ckOfor avatar Nov 27 '22 13:11 ckOfor

Fix!

  1. Run yarn add patch-package postinstall-postinstall && yarn add deprecated-react-native-prop-types
  2. Add this script command to package.json "scripts": { "postinstall": "patch-package" }
  3. Open node_modules/react-native-credit-card-input/src/CCInput.js and remove ViewPropTypes, from line 9
  4. Add import ViewPropTypes from 'deprecated-react-native-prop-types' to line 10
  5. Comment out lines 29 and 30 respectively // labelStyle: Text.propTypes.style, // inputStyle: Text.propTypes.style,
  6. Open node_modules/react-native-credit-card-input/src/CreditCardInput.js and remove ViewPropTypes, from line 11
  7. Add import ViewPropTypes from 'deprecated-react-native-prop-types' to line 12
  8. Comment out lines 51 and 52 respectively // labelStyle: Text.propTypes.style, // inputStyle: Text.propTypes.style,
  9. Open node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js and comment out line 75 // inputStyle: Text.propTypes.style,
  10. Run yarn patch-package react-native-credit-card-input

You should have a folder /patches/react-native-credit-card-input+0.4.1.patch

index dde3aec..62081b4 100644
--- a/node_modules/react-native-credit-card-input/src/CCInput.js
+++ b/node_modules/react-native-credit-card-input/src/CCInput.js
@@ -6,8 +6,8 @@ import {
   TextInput,
   TouchableOpacity,
   StyleSheet,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 const s = StyleSheet.create({
   baseInputStyle: {
@@ -26,8 +26,8 @@ export default class CCInput extends Component {
     status: PropTypes.oneOf(["valid", "invalid", "incomplete"]),
 
     containerStyle: ViewPropTypes.style,
-    inputStyle: Text.propTypes.style,
-    labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,
     placeholderColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/CreditCardInput.js b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
index 44f43c8..db6e0d6 100644
--- a/node_modules/react-native-credit-card-input/src/CreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
@@ -8,8 +8,8 @@ import ReactNative, {
   ScrollView,
   Dimensions,
   TextInput,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 import CreditCard from "./CardView";
 import CCInput from "./CCInput";
@@ -48,8 +48,8 @@ export default class CreditCardInput extends Component {
     labels: PropTypes.object,
     placeholders: PropTypes.object,
 
-    labelStyle: Text.propTypes.style,
-    inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
     inputContainerStyle: ViewPropTypes.style,
 
     validColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
index a5f166b..fb4ad65 100644
--- a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
@@ -72,7 +72,7 @@ export default class LiteCreditCardInput extends Component {
 
     placeholders: PropTypes.object,
 
-    inputStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
 
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,

Thank you so much !

nathanael-anstett avatar Dec 17 '22 00:12 nathanael-anstett

Fix!

  1. Run yarn add patch-package postinstall-postinstall && yarn add deprecated-react-native-prop-types
  2. Add this script command to package.json "scripts": { "postinstall": "patch-package" }
  3. Open node_modules/react-native-credit-card-input/src/CCInput.js and remove ViewPropTypes, from line 9
  4. Add import ViewPropTypes from 'deprecated-react-native-prop-types' to line 10
  5. Comment out lines 29 and 30 respectively // labelStyle: Text.propTypes.style, // inputStyle: Text.propTypes.style,
  6. Open node_modules/react-native-credit-card-input/src/CreditCardInput.js and remove ViewPropTypes, from line 11
  7. Add import ViewPropTypes from 'deprecated-react-native-prop-types' to line 12
  8. Comment out lines 51 and 52 respectively // labelStyle: Text.propTypes.style, // inputStyle: Text.propTypes.style,
  9. Open node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js and comment out line 75 // inputStyle: Text.propTypes.style,
  10. Run yarn patch-package react-native-credit-card-input

You should have a folder /patches/react-native-credit-card-input+0.4.1.patch

index dde3aec..62081b4 100644
--- a/node_modules/react-native-credit-card-input/src/CCInput.js
+++ b/node_modules/react-native-credit-card-input/src/CCInput.js
@@ -6,8 +6,8 @@ import {
   TextInput,
   TouchableOpacity,
   StyleSheet,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 const s = StyleSheet.create({
   baseInputStyle: {
@@ -26,8 +26,8 @@ export default class CCInput extends Component {
     status: PropTypes.oneOf(["valid", "invalid", "incomplete"]),
 
     containerStyle: ViewPropTypes.style,
-    inputStyle: Text.propTypes.style,
-    labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,
     placeholderColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/CreditCardInput.js b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
index 44f43c8..db6e0d6 100644
--- a/node_modules/react-native-credit-card-input/src/CreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/CreditCardInput.js
@@ -8,8 +8,8 @@ import ReactNative, {
   ScrollView,
   Dimensions,
   TextInput,
-  ViewPropTypes,
 } from "react-native";
+import ViewPropTypes from 'deprecated-react-native-prop-types'
 
 import CreditCard from "./CardView";
 import CCInput from "./CCInput";
@@ -48,8 +48,8 @@ export default class CreditCardInput extends Component {
     labels: PropTypes.object,
     placeholders: PropTypes.object,
 
-    labelStyle: Text.propTypes.style,
-    inputStyle: Text.propTypes.style,
+    // labelStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
     inputContainerStyle: ViewPropTypes.style,
 
     validColor: PropTypes.string,
diff --git a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
index a5f166b..fb4ad65 100644
--- a/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
+++ b/node_modules/react-native-credit-card-input/src/LiteCreditCardInput.js
@@ -72,7 +72,7 @@ export default class LiteCreditCardInput extends Component {
 
     placeholders: PropTypes.object,
 
-    inputStyle: Text.propTypes.style,
+    // inputStyle: Text.propTypes.style,
 
     validColor: PropTypes.string,
     invalidColor: PropTypes.string,

It's works for me. Thank you

AngelDev0329 avatar Jan 08 '23 15:01 AngelDev0329

Should be fixed in the latest version. Sorry for the inconvenience 🙇

sbycrosz avatar Jul 19 '24 07:07 sbycrosz