search

stripe / stripe-react-native

React Native library for Stripe.
https://stripe.dev/stripe-react-native
MIT License
1.27k stars 263 forks source link

Custom Images for Payment Methods #1357

Open sallar opened 1 year ago

sallar commented 1 year ago

Is your feature request related to a problem? Please describe. Currently, calling the presentPaymentSheet() returns a paymentOption object that has a label and image. These values are not configurable.

const { error, paymentOption } = await presentPaymentSheet()

Describe the solution you'd like I would love to show a different image for different payment options that looks like the rest of my designer system. For that purpose, I recommend adding a type and brand field to the paymentOption. For example when selecting a Visa card:

{
  "type: "card",
  "brand": "visa",
  "label" "**** 4242"
  "image": "...."
}

Describe alternatives you've considered I have considered implementing the entire card selection UI myself, but that's just too much work for all the different payment options.

Additional context

image
sfriedman-stripe commented 1 year ago

Hi @sallar! Just to clarify: Are you wanting to modify the payment method brand assets themselves? I'm not totally understanding based on your example image. Thanks!

sallar commented 1 year ago

Hey @sfriedman-stripe I want to display a different image in my UI for each of the payment methods. For example a nicer visa logo or Apple/Google pay logo that adapts nicely to dark mode.

sfriedman-stripe commented 1 year ago

Thanks @sallar! Is having images that play nicer with Dark Mode the real ask here, or do you envision more customization needs than that?

sallar commented 1 year ago

@sfriedman-stripe my immediate need is to implement this to look the same way the designer has envisioned but it would be still nice to have some extra info about the payment option.

But for the time being, is there anyway I can update these images?