#sb_99

1 messages · Page 1 of 1 (latest)

wanton kayakBOT
frigid valley
#

Another idea is to wrap multiple Elements but I'm not sure if this is standard practise or breaks any rules?
CheckoutWrapper.js

  return(
    for(...) {
      { children }
    }
);

<CheckoutWrapper>
         <Elements stripe={stripePromise} options={optionsForAddress}>
                <PartialCheckoutForm checkoutProductInfo={checkoutProductInfo} CartItems={CartItems}/>
            </Elements>
         <Elements stripe={stripePromise} options={optionsDefault}>
                <PartialCheckoutForm checkoutProductInfo={checkoutProductInfo} CartItems={CartItems}/>
            </Elements>

</CheckoutWrapper>
#

I found the id parameter to be useful for targeting the LinkElement, but the fact that input fields are private classes means they can't be targeted via id

uncut atlas
#

Hi 👋

So you only want to update the styling on the Address Element and not affect the Payment Element?

frigid valley
#

Exactly!

uncut atlas
#

Hmmm... 🤔

frigid valley
#

But you can see they are wrapped in the same Elements tag

uncut atlas
frigid valley
#

Exactly, it seems I need two Elements instances then? But what are the implications of this?

#

What is the importance of the Elements instance to a group of elements?

uncut atlas
#

That could be a bad situation

#

Because it would break the connection between the Address Element and the Payment Element

#

They wouldn't know about each other since they were created by independent Elements wrappers

frigid valley
#

Ah of course and that would then be reflected in whatever Stripe systems link them together, on the dashboard etc

uncut atlas
#

It would mean we would not be able to bundle together the address info along with the payment info.

#

So the address wouldn't get appended to the confirmPayment request

frigid valley
#

I also see on the docs that there is no inline appearance options

#

seems it has to be through the Elements tag

#

seems like a tricky one

uncut atlas
#

This may be overkill, but have you tried writing CSS rules that are specific to the ID or name? Looking at my integration I see the first address line has name=addressLine1

frigid valley
#

hmm let me try, but I just know Stripe treats input classes as private

#

but let me target the actual name

uncut atlas
#

But I'm not seeing enough valid selectors there

frigid valley
#

so targeting by name doesn't work, as for Address element specific I'm not sure, because all the elements use .Input

uncut atlas
#

Unfortunately I don't know that this is supported currently. I can raise it as a feature request internally though.

frigid valley
#

Yes for sure!!

#

Stripe needs to get on that

#

The ability to pass appearance rules to the individual elements

#

instead of the Elements wrapper

uncut atlas
#

I agree. I think it would be a relatively quick win too

frigid valley
#

It'll be a really good thing

#

I can break up the monotony of the design then

uncut atlas
#

Agreed

frigid valley
#

and given that people using elements want more flexibility as well

#

Thank you for the help

#

btw do you guys do this discord thing like an on-call rotation?

uncut atlas
#

Alright, feedback filed

#

And yes we have shifts to staff the Discord server

frigid valley
#

Ah nice, it's really cool from a company. No one else does this. Also is it likely feedback gets implemented and does it take long usually?

uncut atlas
#

There's no guarantee about if/when a feature gets implemented but we take feedback from our users seriously

frigid valley
#

Awesome, thanks a lot and have a nice day