@stripe/stripe-react-native 0.50.2 → 0.51.0

package/android/.idea/compiler.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="CompilerConfiguration">
+    <bytecodeTargetLevel target="1.6" />
+  </component>
+</project>

package/android/.idea/gradle.xml

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="GradleMigrationSettings" migrationVersion="1" />
+  <component name="GradleSettings">
+    <option name="linkedExternalProjectsSettings">
+      <GradleProjectSettings>
+        <option name="testRunner" value="CHOOSE_PER_TEST" />
+        <option name="externalProjectPath" value="$PROJECT_DIR$" />
+        <option name="gradleJvm" value="#GRADLE_LOCAL_JAVA_HOME" />
+        <option name="modules">
+          <set>
+            <option value="$PROJECT_DIR$" />
+          </set>
+        </option>
+        <option name="resolveExternalAnnotations" value="false" />
+      </GradleProjectSettings>
+    </option>
+  </component>
+</project>

package/android/.idea/migrations.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectMigrations">
+    <option name="MigrateToGradleLocalJavaHome">
+      <set>
+        <option value="$PROJECT_DIR$" />
+      </set>
+    </option>
+  </component>
+</project>

package/android/.idea/misc.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ExternalStorageConfigurationManager" enabled="true" />
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_21" default="true" project-jdk-name="jbr-21" project-jdk-type="JavaSDK">
+    <output url="file://$PROJECT_DIR$/build/classes" />
+  </component>
+  <component name="ProjectType">
+    <option name="id" value="Android" />
+  </component>
+</project>

package/android/.idea/runConfigurations.xml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="RunConfigurationProducerService">
+    <option name="ignoredProducers">
+      <set>
+        <option value="com.intellij.execution.junit.AbstractAllInDirectoryConfigurationProducer" />
+        <option value="com.intellij.execution.junit.AllInPackageConfigurationProducer" />
+        <option value="com.intellij.execution.junit.PatternConfigurationProducer" />
+        <option value="com.intellij.execution.junit.TestInClassConfigurationProducer" />
+        <option value="com.intellij.execution.junit.UniqueIdConfigurationProducer" />
+        <option value="com.intellij.execution.junit.testDiscovery.JUnitTestDiscoveryConfigurationProducer" />
+        <option value="org.jetbrains.kotlin.idea.junit.KotlinJUnitRunConfigurationProducer" />
+        <option value="org.jetbrains.kotlin.idea.junit.KotlinPatternConfigurationProducer" />
+      </set>
+    </option>
+  </component>
+</project>

package/android/.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$/.." vcs="Git" />
+  </component>
+</project>

package/android/gradle.properties

@@ -3,4 +3,4 @@ StripeSdk_compileSdkVersion=30
 StripeSdk_targetSdkVersion=28
 StripeSdk_minSdkVersion=21
 # Keep StripeSdk_stripeVersion in sync with https://github.com/stripe/stripe-identity-react-native/blob/main/android/gradle.properties
-StripeSdk_stripeVersion=21.22.+
+StripeSdk_stripeVersion=21.23.+

package/android/local.properties

@@ -0,0 +1,8 @@
+## This file must *NOT* be checked into Version Control Systems,
+# as it contains information specific to your local configuration.
+#
+# Location of the SDK. This is only used by Gradle.
+# For customization when using a Version Control System, please read the
+# header note.
+#Thu Jun 26 11:00:51 PDT 2025
+sdk.dir=/Users/tianzhao/Library/Android/sdk

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

@@ -21,6 +21,7 @@ import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
 import com.facebook.react.bridge.Arguments
 import com.facebook.react.uimanager.ThemedReactContext
+import com.reactnativestripesdk.toWritableMap
 import com.reactnativestripesdk.utils.KeepJsAwakeTask
 import com.reactnativestripesdk.utils.mapFromCustomPaymentMethod
 import com.reactnativestripesdk.utils.mapFromPaymentMethod
@@ -37,7 +38,6 @@ import kotlinx.coroutines.channels.Channel
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.flow.consumeAsFlow
 import kotlinx.coroutines.launch
-import toWritableMap
 
 enum class RowSelectionBehaviorType {
   Default,

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

@@ -195,6 +195,15 @@ class EmbeddedPaymentElementViewManager :
           ),
         ).allowsRemovalOfLastSavedPaymentMethod(allowsRemovalOfLastSavedPaymentMethod)
         .cardBrandAcceptance(mapToCardBrandAcceptance(toBundleObject(map)))
+        .embeddedViewDisplaysMandateText(
+          if (map.hasKey("embeddedViewDisplaysMandateText") &&
+            map.getType("embeddedViewDisplaysMandateText") == ReadableType.Boolean
+          ) {
+            map.getBoolean("embeddedViewDisplaysMandateText")
+          } else {
+            true // default value
+          },
+        )
         // Serialize original ReadableMap because toBundleObject cannot keep arrays of objects
         .customPaymentMethods(
           parseCustomPaymentMethods(

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

@@ -39,6 +39,7 @@ class PaymentMethodCreateParamsFactory(
         PaymentMethod.Type.Ideal -> createIDEALParams()
         PaymentMethod.Type.Alipay -> createAlipayParams()
         PaymentMethod.Type.Bancontact -> createBancontactParams()
+        PaymentMethod.Type.Billie -> createBillieParams()
         PaymentMethod.Type.SepaDebit -> createSepaParams()
         PaymentMethod.Type.Oxxo -> createOXXOParams()
         PaymentMethod.Type.Giropay -> createGiropayParams()
@@ -90,6 +91,13 @@ class PaymentMethodCreateParamsFactory(
     throw PaymentMethodCreateParamsException("You must provide billing details")
   }
 
+  @Throws(PaymentMethodCreateParamsException::class)
+  private fun createBillieParams(): PaymentMethodCreateParams =
+    PaymentMethodCreateParams.createBillie(
+      billingDetails = billingDetailsParams,
+      metadata = metadataParams,
+    )
+
   @Throws(PaymentMethodCreateParamsException::class)
   private fun createSepaParams(): PaymentMethodCreateParams {
     billingDetailsParams?.let {
@@ -200,21 +208,11 @@ class PaymentMethodCreateParamsFactory(
   }
 
   @Throws(PaymentMethodCreateParamsException::class)
-  private fun createKlarnaParams(): PaymentMethodCreateParams {
-    if (billingDetailsParams == null ||
-      billingDetailsParams.address?.country.isNullOrBlank() ||
-      billingDetailsParams.email.isNullOrBlank()
-    ) {
-      throw PaymentMethodCreateParamsException(
-        "Klarna requires that you provide the following billing details: email, country",
-      )
-    }
-
-    return PaymentMethodCreateParams.createKlarna(
+  private fun createKlarnaParams(): PaymentMethodCreateParams =
+    PaymentMethodCreateParams.createKlarna(
       billingDetails = billingDetailsParams,
       metadata = metadataParams,
     )
-  }
 
   @Throws(PaymentMethodCreateParamsException::class)
   private fun createPayPalParams(): PaymentMethodCreateParams = PaymentMethodCreateParams.createPayPal(metadata = metadataParams)
@@ -256,6 +254,7 @@ class PaymentMethodCreateParamsFactory(
         PaymentMethod.Type.Ideal,
         PaymentMethod.Type.Alipay,
         PaymentMethod.Type.Bancontact,
+        PaymentMethod.Type.Billie,
         PaymentMethod.Type.SepaDebit,
         PaymentMethod.Type.Oxxo,
         PaymentMethod.Type.Giropay,

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

@@ -1,15 +1,219 @@
+package com.reactnativestripesdk
+
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.toArgb
+import androidx.compose.ui.text.AnnotatedString
+import androidx.compose.ui.text.LinkAnnotation
+import androidx.compose.ui.text.SpanStyle
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextDecoration
+import androidx.compose.ui.unit.TextUnit
 import com.facebook.react.bridge.Arguments
 import com.facebook.react.bridge.WritableMap
+import com.reactnativestripesdk.getBase64FromBitmap
+import com.reactnativestripesdk.getBitmapFromDrawable
 import com.reactnativestripesdk.utils.mapFromPaymentSheetBillingDetails
 import com.stripe.android.paymentelement.EmbeddedPaymentElement
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.withContext
+import kotlinx.coroutines.withTimeout
 
 /**
  * Serialize Stripe's PaymentOptionDisplayData into a WritableMap
  * that can be sent over the RN bridge.
  */
-fun EmbeddedPaymentElement.PaymentOptionDisplayData.toWritableMap(): WritableMap =
+suspend fun EmbeddedPaymentElement.PaymentOptionDisplayData.toWritableMap(): WritableMap =
   Arguments.createMap().apply {
     putString("label", label)
     putString("paymentMethodType", paymentMethodType)
     putMap("billingDetails", mapFromPaymentSheetBillingDetails(billingDetails))
+
+    val mandateTextHTML = mandateText?.toHtmlString()
+    if (!mandateTextHTML.isNullOrEmpty()) {
+      putString("mandateHTML", mandateTextHTML)
+    } else {
+      putNull("mandateHTML")
+    }
+
+    // Load image off the main thread with a timeout
+    val imageBase64 =
+      try {
+        withContext(Dispatchers.Default) {
+          val drawable =
+            withTimeout(5_000L) {
+              withContext(Dispatchers.IO) {
+                imageLoader()
+              }
+            }
+          getBitmapFromDrawable(drawable)?.let { bitmap ->
+            getBase64FromBitmap(bitmap)
+          } ?: ""
+        }
+      } catch (e: Exception) {
+        // If imageLoader fails or times out, return empty string
+        ""
+      }
+    putString("image", imageBase64)
+  }
+
+fun AnnotatedString.toHtmlString(): String {
+  val htmlBuilder = StringBuilder()
+  var currentIndex = 0
+
+  val allAnnotations = mutableListOf<AnnotationInfo>()
+
+  spanStyles.forEach { range ->
+    allAnnotations.add(
+      AnnotationInfo(
+        start = range.start,
+        end = range.end,
+        type = AnnotationType.SPAN_STYLE,
+        data = range.item,
+      ),
+    )
+  }
+
+  getStringAnnotations(0, length).forEach { range ->
+    allAnnotations.add(
+      AnnotationInfo(
+        start = range.start,
+        end = range.end,
+        type = AnnotationType.STRING_ANNOTATION,
+        data = range,
+      ),
+    )
+  }
+
+  getLinkAnnotations(0, length).forEach { range ->
+    allAnnotations.add(
+      AnnotationInfo(
+        start = range.start,
+        end = range.end,
+        type = AnnotationType.LINK_ANNOTATION,
+        data = range,
+      ),
+    )
+  }
+
+  allAnnotations.sortWith(compareBy({ it.start }, { -it.end }))
+
+  val openTags = mutableListOf<TagInfo>()
+
+  while (currentIndex < length) {
+    openTags
+      .filter { it.end == currentIndex }
+      .reversed()
+      .forEach { tagInfo ->
+        htmlBuilder.append(tagInfo.closeTag)
+        openTags.remove(tagInfo)
+      }
+
+    allAnnotations.filter { it.start == currentIndex }.forEach { annotation ->
+      when (annotation.type) {
+        AnnotationType.SPAN_STYLE -> {
+          val spanStyle = annotation.data as SpanStyle
+          val tags = getHtmlTagsForSpanStyle(spanStyle)
+          tags.forEach { (openTag, closeTag) ->
+            htmlBuilder.append(openTag)
+            openTags.add(TagInfo(annotation.end, closeTag))
+          }
+        }
+        AnnotationType.STRING_ANNOTATION -> {
+          val stringAnnotation = annotation.data as AnnotatedString.Range<String>
+          when (stringAnnotation.tag) {
+            "URL", "LINK_TAG" -> {
+              val url = stringAnnotation.item
+              htmlBuilder.append("<a href=\"${escapeHtml(url)}\">")
+              openTags.add(TagInfo(annotation.end, "</a>"))
+            }
+          }
+        }
+        AnnotationType.LINK_ANNOTATION -> {
+          val linkAnnotation = annotation.data as AnnotatedString.Range<LinkAnnotation>
+          when (val linkItem = linkAnnotation.item) {
+            is LinkAnnotation.Url -> {
+              htmlBuilder.append("<a href=\"${escapeHtml(linkItem.url)}\">")
+              openTags.add(TagInfo(annotation.end, "</a>"))
+            }
+          }
+        }
+      }
+    }
+
+    htmlBuilder.append(escapeHtml(text[currentIndex].toString()))
+    currentIndex++
+  }
+
+  openTags.reversed().forEach { tagInfo ->
+    htmlBuilder.append(tagInfo.closeTag)
   }
+
+  return htmlBuilder.toString()
+}
+
+private fun getHtmlTagsForSpanStyle(spanStyle: SpanStyle): List<Pair<String, String>> {
+  val tags = mutableListOf<Pair<String, String>>()
+
+  if (spanStyle.fontWeight == FontWeight.Bold ||
+    (spanStyle.fontWeight?.weight ?: 0) >= FontWeight.Bold.weight
+  ) {
+    tags.add("<b>" to "</b>")
+  }
+
+  if (spanStyle.fontStyle == FontStyle.Italic) {
+    tags.add("<i>" to "</i>")
+  }
+
+  spanStyle.color.takeIf { it != Color.Unspecified }?.let { color ->
+    val hexColor = String.format("#%06X", 0xFFFFFF and color.toArgb())
+    tags.add("<font color=\"$hexColor\">" to "</font>")
+  }
+
+  spanStyle.fontSize.takeIf { it != TextUnit.Unspecified }?.let { fontSize ->
+    val emSize = fontSize.value / 16f
+    tags.add("<span style=\"font-size: ${emSize}em;\">" to "</span>")
+  }
+
+  spanStyle.textDecoration?.let { decoration ->
+    if (decoration.contains(TextDecoration.Underline)) {
+      tags.add("<u>" to "</u>")
+    }
+    if (decoration.contains(TextDecoration.LineThrough)) {
+      tags.add("<s>" to "</s>")
+    }
+  }
+
+  spanStyle.background.takeIf { it != Color.Unspecified }?.let { bgColor ->
+    val hexBgColor = String.format("#%06X", 0xFFFFFF and bgColor.toArgb())
+    tags.add("<span style=\"background-color: $hexBgColor;\">" to "</span>")
+  }
+
+  return tags
+}
+
+private fun escapeHtml(text: String): String =
+  text
+    .replace("&", "&amp;")
+    .replace("<", "&lt;")
+    .replace(">", "&gt;")
+    .replace("\"", "&quot;")
+    .replace("'", "&#39;")
+
+private data class AnnotationInfo(
+  val start: Int,
+  val end: Int,
+  val type: AnnotationType,
+  val data: Any,
+)
+
+private enum class AnnotationType {
+  SPAN_STYLE,
+  STRING_ANNOTATION,
+  LINK_ANNOTATION,
+}
+
+private data class TagInfo(
+  val end: Int,
+  val closeTag: String,
+)

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

@@ -45,7 +45,7 @@ import com.stripe.android.paymentelement.PaymentMethodOptionsSetupFutureUsagePre
 import com.stripe.android.paymentsheet.CreateIntentCallback
 import com.stripe.android.paymentsheet.CreateIntentResult
 import com.stripe.android.paymentsheet.ExperimentalCustomerSessionApi
-import com.stripe.android.paymentsheet.PaymentOptionCallback
+import com.stripe.android.paymentsheet.PaymentOptionResultCallback
 import com.stripe.android.paymentsheet.PaymentSheet
 import com.stripe.android.paymentsheet.PaymentSheetResult
 import com.stripe.android.paymentsheet.PaymentSheetResultCallback
@@ -124,9 +124,9 @@ class PaymentSheetFragment :
       }
 
     val paymentOptionCallback =
-      PaymentOptionCallback { paymentOption ->
+      PaymentOptionResultCallback { paymentOptionResult ->
         val result =
-          paymentOption?.let {
+          paymentOptionResult.paymentOption?.let {
             val bitmap = getBitmapFromVectorDrawable(context, it.drawableResourceId)
             val imageString = getBase64FromBitmap(bitmap)
             val option: WritableMap = WritableNativeMap()
@@ -250,6 +250,7 @@ class PaymentSheetFragment :
         .googlePay(googlePayConfig)
         .appearance(appearance)
         .shippingDetails(shippingDetails)
+        .link(linkConfig)
         .billingDetailsCollectionConfiguration(billingDetailsConfig)
         .preferredNetworks(
           mapToPreferredNetworks(arguments?.getIntegerArrayList("preferredNetworks")),
@@ -272,7 +273,7 @@ class PaymentSheetFragment :
           PaymentSheet.FlowController
             .Builder(
               resultCallback = paymentResultCallback,
-              paymentOptionCallback = paymentOptionCallback,
+              paymentOptionResultCallback = paymentOptionCallback,
             ).createIntentCallback(createIntentCallback)
             .confirmCustomPaymentMethodCallback(this)
             .build(this)
@@ -280,7 +281,7 @@ class PaymentSheetFragment :
           PaymentSheet.FlowController
             .Builder(
               resultCallback = paymentResultCallback,
-              paymentOptionCallback = paymentOptionCallback,
+              paymentOptionResultCallback = paymentOptionCallback,
             ).confirmCustomPaymentMethodCallback(this)
             .build(this)
         }
@@ -550,7 +551,7 @@ class PaymentSheetFragment :
       )
 
     internal fun buildGooglePayConfig(params: Bundle?): PaymentSheet.GooglePayConfiguration? {
-      if (params == null) {
+      if (params == null || params.isEmpty) {
         return null
       }
 

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

@@ -129,6 +129,7 @@ internal fun mapPaymentMethodType(type: PaymentMethod.Type?): String =
     PaymentMethod.Type.AuBecsDebit -> "AuBecsDebit"
     PaymentMethod.Type.BacsDebit -> "BacsDebit"
     PaymentMethod.Type.Bancontact -> "Bancontact"
+    PaymentMethod.Type.Billie -> "Billie"
     PaymentMethod.Type.Card -> "Card"
     PaymentMethod.Type.CardPresent -> "CardPresent"
     PaymentMethod.Type.Eps -> "Eps"
@@ -159,6 +160,7 @@ internal fun mapToPaymentMethodType(type: String?): PaymentMethod.Type? =
     "AuBecsDebit" -> PaymentMethod.Type.AuBecsDebit
     "BacsDebit" -> PaymentMethod.Type.BacsDebit
     "Bancontact" -> PaymentMethod.Type.Bancontact
+    "Billie" -> PaymentMethod.Type.Billie
     "AfterpayClearpay" -> PaymentMethod.Type.AfterpayClearpay
     "CardPresent" -> PaymentMethod.Type.CardPresent
     "Eps" -> PaymentMethod.Type.Eps

package/e2e-artifacts/afterpay-clearpay/ai-(afterpay-clearpay).json

@@ -0,0 +1,4 @@
+{
+  "flow_name" : "afterpay-clearpay",
+  "flow_file_path" : "/Users/tianzhao/stripe/stripe-react-native/./e2e-tests/afterpay-clearpay.yml"
+}

package/e2e-artifacts/afterpay-clearpay/ai-report-afterpay-clearpay.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Maestro Test Report</title>
+    <script src="https://cdn.tailwindcss.com/3.4.5"></script>
+    <script>tailwind.config = {
+    darkMode: "media",
+    theme: {
+        extend: {
+            colors: {
+                "gray-dark": "#110c22", // text-gray-dark
+                "gray-medium": "#4f4b5c", // text-gray-medium
+                "gray-1": "#f8f8f8", // surface-gray-1
+                "gray-0": "#110C22", // surface-gray-0
+                "orange-2": "#ff9254", // surface-orange-2
+            },
+        },
+    },
+};
+</script>
+    <style type="text/tailwindcss">@layer components {
+    body {
+        @apply dark:bg-gray-dark dark:text-gray-1 text-gray-dark;
+    }
+
+    .screenshot-image {
+        @apply w-64 rounded-lg border-2 border-gray-medium dark:border-gray-1 pb-1;
+    }
+
+    .screen-card {
+        @apply flex items-start gap-4;
+    }
+
+    .defect-card {
+        @apply flex flex-col items-start gap-2 rounded-lg bg-[#f8f8f8] p-2 text-gray-dark dark:bg-gray-medium dark:text-gray-1;
+    }
+
+    .badge {
+        @apply dark:text-red-500 rounded-lg bg-[#ececec] dark:bg-gray-dark p-1 font-semibold text-gray-medium dark:text-gray-1;
+    }
+
+    .toggle-link {
+        @apply block border-2 border-gray-medium bg-[#ececec] px-3 py-4 text-gray-medium hover:bg-gray-medium hover:text-[#ececec];
+    }
+
+    .toggle-link-selected {
+        @apply border-orange-2;
+    }
+
+    .divider {
+        @apply h-0.5 rounded-sm bg-gray-medium dark:bg-gray-1 my-2;
+    }
+
+    .btn {
+        @apply hover:text-gray-medium dark:hover:text-gray-medium;
+    }
+}
+</style>
+  </head>
+  <body>
+    <div class="flex min-h-screen flex-col">
+      <div class="container mx-auto py-6 space-y-2">
+        <h1 class="text-3xl">AI suggestions for flow <span class="text-gray-medium">afterpay-clearpay</span></h1>
+        <div class="group relative inline-block self-start"><button class="btn">→ Open other report</button>
+          <div class="absolute z-10 hidden min-w-32 group-hover:block"><a class="toggle-link toggle-link-selected" href="./ai-report-afterpay-clearpay.html">(1) afterpay-clearpay</a></div>
+        </div>
+        <p><a href="/Users/tianzhao/stripe/stripe-react-native/./e2e-tests/afterpay-clearpay.yml" class="btn">→ Open flow file ( afterpay-clearpay.yml )</a></p>
+      </div>
+      <main class="container mx-auto flex flex-col gap-4">
+        <p class="text-lg">0 possible defects found</p>
+      </main>
+    </div>
+  </body>
+</html>