@stripe/stripe-react-native 0.38.0 → 0.38.1

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 ## Unreleased
 
+## 0.38.1 - 2024-06-28
+
+**Fixes**
+
+- Fixed `preferredNetworks` prop on CardForm on iOS not always being applied
+- Updated `stripe-android` to 20.47.3
+
 ## 0.38.0 - 2024-05-24
 
 **Features**

package/README.md

@@ -105,6 +105,8 @@ You'll need to run `pod install` in your `ios` directory to install the native d
 
 ## Usage example
 
+For a complete example, [visit our docs](https://docs.stripe.com/payments/accept-a-payment?platform=react-native).
+
 ```tsx
 // App.ts
 import { StripeProvider } from '@stripe/stripe-react-native';
@@ -122,33 +124,39 @@ function App() {
 }
 
 // PaymentScreen.ts
-import { CardField, useStripe } from '@stripe/stripe-react-native';
+import { useStripe } from '@stripe/stripe-react-native';
 
 export default function PaymentScreen() {
-  const { confirmPayment } = useStripe();
+  const { initPaymentSheet, presentPaymentSheet } = useStripe();
+
+  const setup = async () => {
+    const { error } = await initPaymentSheet({
+      merchantDisplayName: 'Example, Inc.',
+      paymentIntentClientSecret: paymentIntent, // retrieve this from your server
+    });
+    if (error) {
+      // handle error
+    }
+  };
+
+  useEffect(() => {
+    setup();
+  }, []);
+
+  const checkout = async () => {
+    const { error } = await presentPaymentSheet();
+
+    if (error) {
+      // handle error
+    } else {
+      // success
+    }
+  };
 
   return (
-    <CardField
-      postalCodeEnabled={true}
-      placeholders={{
-        number: '4242 4242 4242 4242',
-      }}
-      cardStyle={{
-        backgroundColor: '#FFFFFF',
-        textColor: '#000000',
-      }}
-      style={{
-        width: '100%',
-        height: 50,
-        marginVertical: 30,
-      }}
-      onCardChange={(cardDetails) => {
-        console.log('cardDetails', cardDetails);
-      }}
-      onFocus={(focusedField) => {
-        console.log('focusField', focusedField);
-      }}
-    />
+    <View>
+      <Button title="Checkout" onPress={checkout} />
+    </View>
   );
 }
 ```

package/android/gradle.properties

@@ -1,3 +1,3 @@
 StripeSdk_kotlinVersion=1.8.0
 # Keep StripeSdk_stripeVersion in sync with https://github.com/stripe/stripe-identity-react-native/blob/main/android/gradle.properties
-StripeSdk_stripeVersion=20.44.+
+StripeSdk_stripeVersion=20.47.3

package/android/src/main/java/com/reactnativestripesdk/pushprovisioning/PushProvisioningProxy.kt

@@ -65,7 +65,7 @@ object PushProvisioningProxy {
         )
       }
     } catch (e: Exception) {
-      Log.e(TAG, "PushProvisioning dependency not found")
+      Log.e(TAG, "There was a problem using Stripe Android PushProvisioning: " + e.message)
     }
   }
 

package/android/src/main/java/com/reactnativestripesdk/pushprovisioning/TapAndPayProxy.kt

@@ -28,7 +28,7 @@ object TapAndPayProxy {
 
       listTokensMethod.invoke(client) as Task<List<Any>>
     } catch (e: Exception) {
-      Log.e(TAG, "Google TapAndPay dependency not found")
+      Log.e(TAG, "There was a problem listing tokens with Google TapAndPay: " + e.message)
       null
     }
   }
@@ -39,7 +39,7 @@ object TapAndPayProxy {
       val existingFpanLastFour = getFpanLastFourMethod.invoke(token) as String
       existingFpanLastFour == newLastFour
     } catch (e: Exception) {
-      Log.e(TAG, "There was a problem finding the class com.google.android.gms.tapandpay.issuer.TokenInfo. Make sure you've included Google's TapAndPay dependency.")
+      Log.e(TAG, "There was a problem getting the FPAN with Google TapAndPay: " + e.message)
       false
     }
   }
@@ -79,7 +79,7 @@ object TapAndPayProxy {
                             token.getInt("network"),
                             REQUEST_CODE_TOKENIZE)
     } catch (e: Exception) {
-      Log.e(TAG, "Google TapAndPay dependency not found.")
+      Log.e(TAG, "There was a problem tokenizing with Google TapAndPay: " + e.message)
     }
   }
 
@@ -114,8 +114,7 @@ object TapAndPayProxy {
           "serviceProvider",
           tokenInfoClass.getMethod("getTokenServiceProvider").invoke(it) as Int)
       } catch (e: Exception) {
-        Log.e(TAG,
-          "There was a problem finding the class com.google.android.gms.tapandpay.issuer.TokenInfo. Make sure you've included Google's TapAndPay dependency.")
+        Log.e(TAG, "There was a problem mapping the token information with Google TapAndPay: " + e.message)
       }
     }
     return result
@@ -134,8 +133,7 @@ object TapAndPayProxy {
         else -> "UNKNOWN"
       }
     } catch (e: Exception) {
-      Log.e(TAG,
-            "There was a problem finding Google's TapAndPay dependency.")
+      Log.e(TAG, "There was a problem mapping the token state with Google TapAndPay: " + e.message)
       return "UNKNOWN"
     }
   }

package/ios/CardFormView.swift

@@ -13,9 +13,7 @@ class CardFormView: UIView, STPCardFormViewDelegate {
     @objc var disabled: Bool = false
     @objc var preferredNetworks: Array<Int>? {
         didSet {
-            if let preferredNetworks = preferredNetworks {
-                cardForm?.preferredNetworks = preferredNetworks.map(Mappers.intToCardBrand).compactMap { $0 }
-            }
+            setPreferredNetworks()
         }
     }
     
@@ -36,6 +34,7 @@ class CardFormView: UIView, STPCardFormViewDelegate {
         self.cardForm = _cardForm
         self.addSubview(_cardForm)
         setStyles()
+        setPreferredNetworks()
     }
     
     @objc var cardStyle: NSDictionary = NSDictionary() {
@@ -107,6 +106,12 @@ class CardFormView: UIView, STPCardFormViewDelegate {
         // }
     }
     
+    func setPreferredNetworks() {
+        if let preferredNetworks = preferredNetworks {
+            cardForm?.preferredNetworks = preferredNetworks.map(Mappers.intToCardBrand).compactMap { $0 }
+        }
+    }
+    
     override init(frame: CGRect) {
         super.init(frame: frame)
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stripe/stripe-react-native",
-  "version": "0.38.0",
+  "version": "0.38.1",
   "author": "Stripe",
   "description": "Stripe SDK for React Native",
   "main": "lib/commonjs/index",