DeathByPorkChop

[gaunt pecan]

hello! what doesn't work? Are you getting an error?

[brisk hearth]

Hello, yeah I get a Typescript error that no overloads match this call

[gaunt pecan]

can you paste the exact error message?

and the stacktrace

[brisk hearth]

Unfortunately the error isn't showing up in the console, but I can send the typescript error

No overload matches this call.
Overload 1 of 2, '(options?: StripeElementsOptionsClientSecret): StripeElements', gave the following error.
Argument of type 'StripeElementsOptions' is not assignable to parameter of type 'StripeElementsOptionsClientSecret'.
Type 'StripeElementsOptionsMode' is not assignable to type 'StripeElementsOptionsClientSecret'.
Types of property 'mode' are incompatible.
Type 'string' is not assignable to type 'never'.
Type 'string' is not assignable to type 'never'.
Overload 2 of 2, '(options?: StripeElementsOptionsMode): StripeElements', gave the following error.
Argument of type 'StripeElementsOptions' is not assignable to parameter of type 'StripeElementsOptionsMode'.
Type 'StripeElementsOptionsClientSecret' is not assignable to type 'StripeElementsOptionsMode'.
Types of property 'clientSecret' are incompatible.
Type 'string' is not assignable to type 'never'.ts(2769)

[gaunt pecan]

are you using the TypeScript definitions included in the stripe-node SDK?

[brisk hearth]

Is it an independent package? I have /stripe-js in my package.json

[gaunt pecan]

ah no, it's not an independent package. It slipped my mind that this is client-side

[brisk hearth]

Sorry I also forgot to mention this is client side

What I find strange is that this error only showed up in the last week/10 days, though the code hasn't changed in 3 months

So I need to install the stripe-node sdk?

[crimson elk]

Hi @brisk hearth can you share the relevant code that you wrote?

[brisk hearth]

function setupElements(stripeElementsOptions: StripeElementsOptions) {
return state.stripe?.elements(stripeElementsOptions);
}

[crimson elk]

No you don't need to install stripe-node sdk, that's for backend

And are you using the latest version of stripe-js ?https://www.npmjs.com/package/@stripe/stripe-js

[brisk hearth]

I just upgraded it earlier today

[crimson elk]

How do you import StripeElementsOptions ?

[brisk hearth]

I import it as a type

from "@ stripe/stripe-js"

[crimson elk]

Can you share with me the complete so that I can try to reproduce at my end?

[brisk hearth]

import type { StripeElementsOptions } from "@ stripe/stripe-js";

[crimson elk]

I mean the complete source code, not just the import statement

[brisk hearth]

ahh okay, one sec

interface State {
stripe: Stripe | null;
elements: StripeElements | undefined;
elementOptions: StripeElementsOptions;
}

const state = {
stripe: null,
elements: undefined,
elementOptions: {},
}

async function setupStripe() {
state.stripe = await loadStripe(publishableKey.value as string);
state.elements = setupElements(state.elementOptions);
}

function setupElements(stripeElementsOptions: StripeElementsOptions) {
return state.stripe?.elements(stripeElementsOptions);
}

[crimson elk]

First you need to set the type for state variable

const state: State = {
    stripe: null,
    elements: undefined,
    elementOptions: {},
}

Second, the type that stripe.elements() accept is either StripeElementsOptionsClientSecret, or StripeElementsOptionsMode, not StripeElementsOptions

So you might want to decide which type (StripeElementsOptionsClientSecret, or StripeElementsOptionsMode) to use, and use that type for elementOptions