stripe-react-native icon indicating copy to clipboard operation
stripe-react-native copied to clipboard

CardForm (hide country/postal code + choose error label position)

Open nicolasdevienne opened this issue 3 years ago • 4 comments

On the CardForm, I would like :

  • to hide country/postal code
  • to choose error label position (flex-start, ...)

Is it possible to add these options ?

Simulator Screen Shot - iPhone 13 mini - 2022-07-18 at 12 21 10

nicolasdevienne avatar Jul 18 '22 12:07 nicolasdevienne

Unfortunately this isn't possible- I would recommend utilizing either the CardField component or PaymentSheet.

Providing the default country (which includes providing a country where the postal code isn't shown if that country doesn't have postal codes) will be added in https://github.com/stripe/stripe-react-native/pull/1044

that being said- the error message seems to be placed fairly far away from the component in your screenshot 🤔 what version are you using and what does your code look like? I can't repro that

charliecruzan-stripe avatar Jul 20 '22 16:07 charliecruzan-stripe

Hi @charliecruzan-stripe, I think it's due to the height of the CardForm (I use last version 0.15.0) :

          <CardForm
            cardStyle={{
              backgroundColor: COLORS.COLOR1,
              borderRadius: DIMENSIONS.SIZE010,
              cursorColor: COLORS.GRAY_DARK,
              placeholderColor: COLORS.GRAY_DARK,
              textErrorColor: COLORS.RED_DARK,
            }}
            style={{
              height: DEVICE_WIDTH,
              marginHorizontal: 20,
            }}
            onFormComplete={card => setCard(card.complete && card)}

But as you can see, on Android it's OK :

Screenshot_1658337751

nicolasdevienne avatar Jul 20 '22 17:07 nicolasdevienne

Hi @charliecruzan-stripe ! No PR for this ? :)

nicolasdevienne avatar Aug 29 '22 09:08 nicolasdevienne