@stripe/stripe-react-native 0.2.1 → 0.3.0

package/android/build.gradle

@@ -8,7 +8,7 @@ buildscript {
   }
 
   dependencies {
-    classpath 'com.android.tools.build:gradle:4.2.1'
+    classpath 'com.android.tools.build:gradle:4.2.2'
     // noinspection DifferentKotlinGradleVersion
     classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
   }
@@ -132,9 +132,9 @@ dependencies {
   api 'com.facebook.react:react-native:+'
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
   implementation "androidx.lifecycle:lifecycle-runtime-ktx:2.3.1"
-  implementation 'com.stripe:stripe-android:17.1.0'
+  implementation 'com.stripe:stripe-android:19.2.+'
   implementation 'com.google.android.material:material:1.3.0'
   implementation 'androidx.appcompat:appcompat:1.2.0'
   implementation 'androidx.legacy:legacy-support-v4:1.0.0'
-  implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-core:1.5.0'
+  implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-core:1.6.0'
 }

package/android/gradle.properties

@@ -1,4 +1 @@
 StripeSdk_kotlinVersion=1.5.10
-StripeSdk_compileSdkVersion=28
-StripeSdk_buildToolsVersion=28.0.3
-StripeSdk_targetSdkVersion=28

package/android/src/main/java/com/reactnativestripesdk/CardChangedEvent.kt

@@ -36,6 +36,9 @@ internal class CardChangedEvent constructor(viewTag: Int, private val cardDetail
     }
 
     eventData.putBoolean("complete", complete)
+    eventData.putString("validNumber", cardDetails["validNumber"]?.toString())
+    eventData.putString("validCVC", cardDetails["validCVC"]?.toString())
+    eventData.putString("validExpiryDate", cardDetails["validExpiryDate"]?.toString())
 
     if (postalCodeEnabled) {
       eventData.putString("postalCode", cardDetails["postalCode"]?.toString())

package/android/src/main/java/com/reactnativestripesdk/Constants.kt

@@ -4,7 +4,6 @@ var ON_PAYMENT_RESULT_ACTION = "com.reactnativestripesdk.PAYMENT_RESULT_ACTION"
 var ON_PAYMENT_OPTION_ACTION = "com.reactnativestripesdk.PAYMENT_OPTION_ACTION"
 var ON_CONFIGURE_FLOW_CONTROLLER = "com.reactnativestripesdk.CONFIGURE_FLOW_CONTROLLER_ACTION"
 var ON_INIT_PAYMENT_SHEET = "com.reactnativestripesdk.INIT_PAYMENT_SHEET"
-var ON_FRAGMENT_CREATED = "com.reactnativestripesdk.FRAGMENT_CREATED_ACTION"
 
 var ON_GOOGLE_PAY_FRAGMENT_CREATED = "com.reactnativestripesdk.ON_GOOGLE_PAY_FRAGMENT_CREATED"
 var ON_INIT_GOOGLE_PAY = "com.reactnativestripesdk.ON_INIT_GOOGLE_PAY"

package/android/src/main/java/com/reactnativestripesdk/Errors.kt

@@ -2,10 +2,10 @@ package com.reactnativestripesdk
 
 import com.facebook.react.bridge.WritableMap
 import com.facebook.react.bridge.WritableNativeMap
-import com.stripe.android.exception.APIException
+import com.stripe.android.core.exception.APIException
 import com.stripe.android.exception.AuthenticationException
 import com.stripe.android.exception.CardException
-import com.stripe.android.exception.InvalidRequestException
+import com.stripe.android.core.exception.InvalidRequestException
 import com.stripe.android.model.PaymentIntent
 import com.stripe.android.model.SetupIntent
 

package/android/src/main/java/com/reactnativestripesdk/GooglePayFragment.kt

@@ -7,17 +7,17 @@ import android.view.View
 import android.view.ViewGroup
 import android.widget.FrameLayout
 import androidx.fragment.app.Fragment
-import com.facebook.react.bridge.WritableNativeMap
+import androidx.localbroadcastmanager.content.LocalBroadcastManager
 import com.stripe.android.googlepaylauncher.GooglePayEnvironment
 import com.stripe.android.googlepaylauncher.GooglePayLauncher
 import com.stripe.android.googlepaylauncher.GooglePayPaymentMethodLauncher
-import com.stripe.android.model.StripeIntent
 
 class GooglePayFragment : Fragment() {
   private var googlePayLauncher: GooglePayLauncher? = null
   private var googlePayMethodLauncher: GooglePayPaymentMethodLauncher? = null
   private var isGooglePayMethodLauncherReady: Boolean = false
   private var isGooglePayLauncherReady: Boolean = false
+  private lateinit var localBroadcastManager: LocalBroadcastManager
 
   private fun onGooglePayMethodLauncherReady(isReady: Boolean) {
     isGooglePayMethodLauncherReady = true
@@ -38,6 +38,7 @@ class GooglePayFragment : Fragment() {
     container: ViewGroup?,
     savedInstanceState: Bundle?
   ): View {
+    localBroadcastManager = LocalBroadcastManager.getInstance(requireContext())
     return FrameLayout(requireActivity()).also {
       it.visibility = View.GONE
     }
@@ -88,14 +89,14 @@ class GooglePayFragment : Fragment() {
     )
 
     val intent = Intent(ON_GOOGLE_PAY_FRAGMENT_CREATED)
-    activity?.sendBroadcast(intent)
+    localBroadcastManager.sendBroadcast(intent)
   }
 
   fun presentForPaymentIntent(clientSecret: String) {
     val launcher = googlePayLauncher ?: run {
       val intent = Intent(ON_GOOGLE_PAY_RESULT)
       intent.putExtra("error", "GooglePayLauncher is not initialized.")
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
       return
     }
     runCatching {
@@ -103,7 +104,7 @@ class GooglePayFragment : Fragment() {
     }.onFailure {
       val intent = Intent(ON_GOOGLE_PAY_RESULT)
       intent.putExtra("error", it.localizedMessage)
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
     }
   }
 
@@ -111,7 +112,7 @@ class GooglePayFragment : Fragment() {
     val launcher = googlePayLauncher ?: run {
       val intent = Intent(ON_GOOGLE_PAY_RESULT)
       intent.putExtra("error", "GooglePayLauncher is not initialized.")
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
       return
     }
     runCatching {
@@ -119,7 +120,7 @@ class GooglePayFragment : Fragment() {
     }.onFailure {
       val intent = Intent(ON_GOOGLE_PAY_RESULT)
       intent.putExtra("error", it.localizedMessage)
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
     }
   }
 
@@ -127,7 +128,7 @@ class GooglePayFragment : Fragment() {
     val launcher = googlePayMethodLauncher ?: run {
       val intent = Intent(ON_GOOGLE_PAYMENT_METHOD_RESULT)
       intent.putExtra("error", "GooglePayPaymentMethodLauncher is not initialized.")
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
       return
     }
 
@@ -139,26 +140,26 @@ class GooglePayFragment : Fragment() {
     }.onFailure {
       val intent = Intent(ON_GOOGLE_PAYMENT_METHOD_RESULT)
       intent.putExtra("error", it.localizedMessage)
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
     }
   }
 
   private fun onGooglePayReady(isReady: Boolean) {
     val intent = Intent(ON_INIT_GOOGLE_PAY)
     intent.putExtra("isReady", isReady)
-    activity?.sendBroadcast(intent)
+    localBroadcastManager.sendBroadcast(intent)
   }
 
   private fun onGooglePayResult(result: GooglePayLauncher.Result) {
     val intent = Intent(ON_GOOGLE_PAY_RESULT)
     intent.putExtra("paymentResult", result)
-    activity?.sendBroadcast(intent)
+    localBroadcastManager.sendBroadcast(intent)
   }
 
   private fun onGooglePayResult(result: GooglePayPaymentMethodLauncher.Result) {
     val intent = Intent(ON_GOOGLE_PAYMENT_METHOD_RESULT)
     intent.putExtra("paymentResult", result)
-    activity?.sendBroadcast(intent)
+    localBroadcastManager.sendBroadcast(intent)
   }
 
   private fun mapToGooglePayLauncherBillingAddressConfig(formatString: String, isRequired: Boolean, isPhoneNumberRequired: Boolean): GooglePayLauncher.BillingAddressConfig {

package/android/src/main/java/com/reactnativestripesdk/GooglePayPaymentMethodLauncherFragment.kt

@@ -0,0 +1,44 @@
+package com.reactnativestripesdk
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.widget.FrameLayout
+import androidx.appcompat.app.AppCompatActivity
+import androidx.fragment.app.Fragment
+import com.facebook.react.bridge.Promise
+import com.stripe.android.googlepaylauncher.GooglePayEnvironment
+import com.stripe.android.googlepaylauncher.GooglePayPaymentMethodLauncher
+
+class GooglePayPaymentMethodLauncherFragment(
+  private val activity: AppCompatActivity,
+  private val isTestEnv: Boolean,
+  private val paymentMethodRequired: Boolean,
+  private val promise: Promise
+  ) : Fragment() {
+  override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
+                            savedInstanceState: Bundle?): View? {
+    return FrameLayout(requireActivity()).also {
+      it.visibility = View.GONE
+    }
+  }
+
+  override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+    super.onViewCreated(view, savedInstanceState)
+    GooglePayPaymentMethodLauncher(
+      this,
+      config = GooglePayPaymentMethodLauncher.Config(
+        environment = if (isTestEnv) GooglePayEnvironment.Test else GooglePayEnvironment.Production,
+        existingPaymentMethodRequired = paymentMethodRequired,
+        merchantCountryCode = "", // Unnecessary since all we are checking for is Google Pay availability
+        merchantName = "",        // Same as above
+      ),
+      readyCallback = {
+        promise.resolve(it)
+        activity.supportFragmentManager.beginTransaction().remove(this).commit()
+      },
+      resultCallback = {}
+    )
+  }
+}

package/android/src/main/java/com/reactnativestripesdk/Mappers.kt

@@ -171,6 +171,14 @@ internal fun mapFromBankAccountType(type: BankAccount.Type?): String {
   }
 }
 
+internal fun mapToBankAccountType(type: String?): BankAccountTokenParams.Type {
+  return when (type) {
+    "Company" -> BankAccountTokenParams.Type.Company
+    "Individual" -> BankAccountTokenParams.Type.Individual
+    else -> BankAccountTokenParams.Type.Individual
+  }
+}
+
 internal fun mapFromBankAccountStatus(status: BankAccount.Status?): String {
   return when (status) {
     BankAccount.Status.Errored -> "Errored"
@@ -419,32 +427,35 @@ internal fun mapToAddress(addressMap: ReadableMap?, cardAddress: Address?): Addr
 }
 
 internal fun mapToBillingDetails(billingDetails: ReadableMap?, cardAddress: Address?): PaymentMethod.BillingDetails? {
-  if (billingDetails == null) {
+  if (billingDetails == null && cardAddress == null) {
     return null
   }
-  val address = Address.Builder()
-    .setPostalCode(getValOr(billingDetails, "addressPostalCode"))
-    .setCity(getValOr(billingDetails, "addressCity"))
-    .setCountry(getValOr(billingDetails, "addressCountry"))
-    .setLine1(getValOr(billingDetails, "addressLine1"))
-    .setLine2(getValOr(billingDetails, "addressLine2"))
-    .setState(getValOr(billingDetails, "addressState"))
+  val addressBuilder = Address.Builder()
+  val paymentMethodBillingDetailsBuilder =  PaymentMethod.BillingDetails.Builder()
 
-    cardAddress?.let { ca ->
-      ca.postalCode?.let {
-        address.setPostalCode(it)
-      }
-      ca.country?.let {
-        address.setCountry(it)
-      }
-    }
+  if (billingDetails != null) {
+    addressBuilder
+      .setPostalCode(getValOr(billingDetails, "addressPostalCode"))
+      .setCity(getValOr(billingDetails, "addressCity"))
+      .setCountry(getValOr(billingDetails, "addressCountry"))
+      .setLine1(getValOr(billingDetails, "addressLine1"))
+      .setLine2(getValOr(billingDetails, "addressLine2"))
+      .setState(getValOr(billingDetails, "addressState"))
+    paymentMethodBillingDetailsBuilder
+      .setName(getValOr(billingDetails, "name"))
+      .setPhone(getValOr(billingDetails, "phone"))
+      .setEmail(getValOr(billingDetails, "email"))
+  }
+
+  if (cardAddress?.postalCode?.isNotEmpty() == true) {
+    addressBuilder.setPostalCode(cardAddress.postalCode)
+  }
+  if (cardAddress?.country?.isNotEmpty() == true) {
+    addressBuilder.setCountry(cardAddress.country)
+  }
 
-  return PaymentMethod.BillingDetails.Builder()
-    .setAddress(address.build())
-    .setName(getValOr(billingDetails, "name"))
-    .setPhone(getValOr(billingDetails, "phone"))
-    .setEmail(getValOr(billingDetails, "email"))
-    .build()
+  paymentMethodBillingDetailsBuilder.setAddress(addressBuilder.build())
+  return paymentMethodBillingDetailsBuilder.build()
 }
 
 internal fun mapToShippingDetails(shippingDetails: ReadableMap?): ConfirmPaymentIntentParams.Shipping? {

package/android/src/main/java/com/reactnativestripesdk/PaymentSheetFragment.kt

@@ -2,6 +2,7 @@ package com.reactnativestripesdk
 
 import android.content.Context
 import android.content.Intent
+import android.content.res.ColorStateList
 import android.graphics.Bitmap
 import android.graphics.Canvas
 import android.graphics.Color
@@ -15,6 +16,7 @@ import android.widget.FrameLayout
 import androidx.appcompat.content.res.AppCompatResources
 import androidx.core.graphics.drawable.DrawableCompat
 import androidx.fragment.app.Fragment
+import androidx.localbroadcastmanager.content.LocalBroadcastManager
 import com.stripe.android.paymentsheet.*
 import com.stripe.android.paymentsheet.model.PaymentOption
 import java.io.ByteArrayOutputStream
@@ -25,12 +27,14 @@ class PaymentSheetFragment : Fragment() {
   private var paymentIntentClientSecret: String? = null
   private var setupIntentClientSecret: String? = null
   private lateinit var paymentSheetConfiguration: PaymentSheet.Configuration
+  private lateinit var localBroadcastManager: LocalBroadcastManager
 
   override fun onCreateView(
     inflater: LayoutInflater,
     container: ViewGroup?,
     savedInstanceState: Bundle?
   ): View {
+    localBroadcastManager = LocalBroadcastManager.getInstance(requireContext())
     return FrameLayout(requireActivity()).also {
       it.visibility = View.GONE
     }
@@ -42,8 +46,12 @@ class PaymentSheetFragment : Fragment() {
     val customerId = arguments?.getString("customerId").orEmpty()
     val customerEphemeralKeySecret = arguments?.getString("customerEphemeralKeySecret").orEmpty()
     val countryCode = arguments?.getString("merchantCountryCode").orEmpty()
+    val currencyCode = arguments?.getString("currencyCode").orEmpty()
     val googlePayEnabled = arguments?.getBoolean("googlePay")
     val testEnv = arguments?.getBoolean("testEnv")
+    val allowsDelayedPaymentMethods = arguments?.getBoolean("allowsDelayedPaymentMethods")
+    val primaryButtonColorHexStr = arguments?.getString("primaryButtonColor").orEmpty()
+    val billingDetailsBundle = arguments?.getBundle("defaultBillingDetails")
     paymentIntentClientSecret = arguments?.getString("paymentIntentClientSecret").orEmpty()
     setupIntentClientSecret = arguments?.getString("setupIntentClientSecret").orEmpty()
 
@@ -58,7 +66,7 @@ class PaymentSheetFragment : Fragment() {
           intent.putExtra("label", paymentOption.label)
           intent.putExtra("image", imageString)
         }
-        activity?.sendBroadcast(intent)
+        localBroadcastManager.sendBroadcast(intent)
       }
     }
 
@@ -67,19 +75,43 @@ class PaymentSheetFragment : Fragment() {
         val intent = Intent(ON_PAYMENT_RESULT_ACTION)
 
         intent.putExtra("paymentResult", paymentResult)
-          activity?.sendBroadcast(intent)
+        localBroadcastManager.sendBroadcast(intent)
       }
     }
 
+    var primaryButtonColor: ColorStateList? = null
+    if (primaryButtonColorHexStr != null && primaryButtonColorHexStr.isNotEmpty()) {
+      primaryButtonColor = ColorStateList.valueOf(Color.parseColor(primaryButtonColorHexStr))
+    }
+
+    var defaultBillingDetails: PaymentSheet.BillingDetails? = null
+    if (billingDetailsBundle != null) {
+      val addressBundle = billingDetailsBundle.getBundle("address")
+      val address = PaymentSheet.Address(addressBundle?.getString("city"),
+                                          addressBundle?.getString("country"),
+                                          addressBundle?.getString("line1"),
+                                          addressBundle?.getString("line2"),
+                                          addressBundle?.getString("postalCode"),
+                                          addressBundle?.getString("state"))
+      defaultBillingDetails = PaymentSheet.BillingDetails(address,
+                                                          billingDetailsBundle?.getString("email"),
+                                                          billingDetailsBundle?.getString("name"),
+                                                          billingDetailsBundle?.getString("phone"))
+    }
+
     paymentSheetConfiguration = PaymentSheet.Configuration(
       merchantDisplayName = merchantDisplayName,
+      allowsDelayedPaymentMethods = allowsDelayedPaymentMethods ?: false,
+      primaryButtonColor = primaryButtonColor,
+      defaultBillingDetails=defaultBillingDetails,
       customer = if (customerId.isNotEmpty() && customerEphemeralKeySecret.isNotEmpty()) PaymentSheet.CustomerConfiguration(
         id = customerId,
         ephemeralKeySecret = customerEphemeralKeySecret
       ) else null,
       googlePay = if (googlePayEnabled == true) PaymentSheet.GooglePayConfiguration(
         environment = if (testEnv == true) PaymentSheet.GooglePayConfiguration.Environment.Test else PaymentSheet.GooglePayConfiguration.Environment.Production,
-        countryCode = countryCode
+        countryCode = countryCode,
+        currencyCode = currencyCode
       ) else null
     )
 
@@ -89,11 +121,8 @@ class PaymentSheetFragment : Fragment() {
     } else {
       paymentSheet = PaymentSheet(this, paymentResultCallback)
       val intent = Intent(ON_INIT_PAYMENT_SHEET)
-      activity?.sendBroadcast(intent)
+      localBroadcastManager.sendBroadcast(intent)
     }
-
-    val intent = Intent(ON_FRAGMENT_CREATED)
-    activity?.sendBroadcast(intent)
   }
 
   fun present() {
@@ -125,7 +154,7 @@ class PaymentSheetFragment : Fragment() {
           intent.putExtra("label", paymentOption.label)
           intent.putExtra("image", imageString)
         }
-        activity?.sendBroadcast(intent)
+        localBroadcastManager.sendBroadcast(intent)
       }
     }
 

package/android/src/main/java/com/reactnativestripesdk/StripeSdkCardView.kt

@@ -1,13 +1,11 @@
 package com.reactnativestripesdk
 
-import android.content.Context
 import android.content.res.ColorStateList
 import android.graphics.Color
 import android.graphics.Typeface
+import android.os.Build
 import android.text.Editable
 import android.text.TextWatcher
-import android.view.View
-import android.view.inputmethod.InputMethodManager
 import android.widget.FrameLayout
 import com.facebook.react.bridge.ReadableMap
 import com.facebook.react.uimanager.ThemedReactContext
@@ -21,11 +19,12 @@ import com.stripe.android.model.Address
 import com.stripe.android.model.PaymentMethodCreateParams
 import com.stripe.android.view.CardInputListener
 import com.stripe.android.view.CardInputWidget
+import com.stripe.android.view.CardValidCallback
 
 
 class StripeSdkCardView(private val context: ThemedReactContext) : FrameLayout(context) {
   private var mCardWidget: CardInputWidget
-  val cardDetails: MutableMap<String, Any?> = mutableMapOf("brand" to "", "last4" to "", "expiryMonth" to null, "expiryYear" to null, "postalCode" to "")
+  val cardDetails: MutableMap<String, Any?> = mutableMapOf("brand" to "", "last4" to "", "expiryMonth" to null, "expiryYear" to null, "postalCode" to "", "validNumber" to "Unknown", "validCVC" to "Unknown", "validExpiryDate" to "Unknown")
   var cardParams: PaymentMethodCreateParams.Card? = null
   var cardAddress: Address? = null
   private var mEventDispatcher: EventDispatcher?
@@ -88,36 +87,45 @@ class StripeSdkCardView(private val context: ThemedReactContext) : FrameLayout(c
     val fontFamily = getValOr(value, "fontFamily")
     val placeholderColor = getValOr(value, "placeholderColor", null)
     val textErrorColor = getValOr(value, "textErrorColor", null)
+    val cursorColor = getValOr(value, "cursorColor", null)
+    val bindings = setOf(binding.cardNumberEditText, binding.cvcEditText, binding.expiryDateEditText, binding.postalCodeEditText)
 
     textColor?.let {
-      binding.cardNumberEditText.setTextColor(Color.parseColor(it))
-      binding.cvcEditText.setTextColor(Color.parseColor(it))
-      binding.expiryDateEditText.setTextColor(Color.parseColor(it))
-      binding.postalCodeEditText.setTextColor(Color.parseColor(it))
+      for (editTextBinding in bindings) {
+        editTextBinding.setTextColor(Color.parseColor(it))
+      }
     }
     textErrorColor?.let {
-      binding.cardNumberEditText.setErrorColor(Color.parseColor(it))
-      binding.cvcEditText.setErrorColor(Color.parseColor(it))
-      binding.expiryDateEditText.setErrorColor(Color.parseColor(it))
-      binding.postalCodeEditText.setErrorColor(Color.parseColor(it))
+      for (editTextBinding in bindings) {
+        editTextBinding.setErrorColor(Color.parseColor(it))
+      }
     }
     placeholderColor?.let {
-      binding.cardNumberEditText.setHintTextColor(Color.parseColor(it))
-      binding.cvcEditText.setHintTextColor(Color.parseColor(it))
-      binding.expiryDateEditText.setHintTextColor(Color.parseColor(it))
-      binding.postalCodeEditText.setHintTextColor(Color.parseColor(it))
+      for (editTextBinding in bindings) {
+        editTextBinding.setHintTextColor(Color.parseColor(it))
+      }
     }
     fontSize?.let {
-      binding.cardNumberEditText.textSize = it.toFloat()
-      binding.cvcEditText.textSize = it.toFloat()
-      binding.expiryDateEditText.textSize = it.toFloat()
-      binding.postalCodeEditText.textSize = it.toFloat()
+      for (editTextBinding in bindings) {
+        editTextBinding.textSize = it.toFloat()
+      }
     }
     fontFamily?.let {
-      binding.cardNumberEditText.typeface = Typeface.create(it, Typeface.NORMAL)
-      binding.cvcEditText.typeface = Typeface.create(it, Typeface.NORMAL)
-      binding.expiryDateEditText.typeface = Typeface.create(it, Typeface.NORMAL)
-      binding.postalCodeEditText.typeface = Typeface.create(it, Typeface.NORMAL)
+      for (editTextBinding in bindings) {
+        editTextBinding.typeface = Typeface.create(it, Typeface.NORMAL)
+      }
+    }
+    cursorColor?.let {
+      if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+        val color = Color.parseColor(it)
+        for (editTextBinding in bindings) {
+          editTextBinding.textCursorDrawable?.setTint(color)
+          editTextBinding.textSelectHandle?.setTint(color)
+          editTextBinding.textSelectHandleLeft?.setTint(color)
+          editTextBinding.textSelectHandleRight?.setTint(color)
+          editTextBinding.highlightColor = color
+        }
+      }
     }
 
     mCardWidget.setPadding(40, 0, 40, 0)
@@ -198,7 +206,10 @@ class StripeSdkCardView(private val context: ThemedReactContext) : FrameLayout(c
   }
 
   private fun setListeners() {
-    mCardWidget.setCardValidCallback { isValid, _ ->
+    mCardWidget.setCardValidCallback { isValid, invalidFields ->
+      cardDetails["validNumber"] = if (invalidFields.contains(CardValidCallback.Fields.Number)) "Invalid" else "Valid"
+      cardDetails["validCVC"] = if (invalidFields.contains(CardValidCallback.Fields.Cvc)) "Invalid" else "Valid"
+      cardDetails["validExpiryDate"] = if (invalidFields.contains(CardValidCallback.Fields.Expiry)) "Invalid" else "Valid"
       if (isValid) {
         onCardChanged()
       }
@@ -208,6 +219,7 @@ class StripeSdkCardView(private val context: ThemedReactContext) : FrameLayout(c
       override fun onCardComplete() {}
       override fun onExpirationComplete() {}
       override fun onCvcComplete() {}
+      override fun onPostalCodeComplete() {}
 
       override fun onFocusChange(focusField: CardInputListener.FocusField) {
         if (mEventDispatcher != null) {