[BUG]

[cchatfield]

Describe the bug NG 17 with modules using for root with nxg-stripe v17.

This is failing when elements are initialized. l is payment (which is the passed mode) but the u.value.parsedIntentSecret is undefined causing the element to throw an error.

var l = ["payment", "linkAuthentication"].indexOf(o) > -1
                  , d = "payment" === t.componentName && (u.value.parsedIntentSecret || null);
if (l && !t.clientSecret && !t.deferredIntent && !d)
                    throw new S.No("In order to create a ".concat(t.componentName, ' element, you must pass a clientSecret or mode when creating the Elements group.\n\n  e.g. stripe.elements({clientSecret: "{{CLIENT_SECRET}}"})'));

To Reproduce Steps to reproduce the behavior:

NgxStripeModule.forRoot((globalThis as any)['stripeKey'], {
  stripeAccount: (globalThis as any)['stripeAcct'],
}),

<ngx-stripe-payment (change)="onElementsChange($event)"
          [elementsOptions]="paymentElementOptions"></ngx-stripe-payment>

baseElementOptions: StripeElementsOptionsMode = {
    fonts: [
      {
        cssSrc: 'https://rsms.me/inter/inter.css',
      },
    ],
    appearance: {
      variables: {
        colorPrimary: this.styles.getPropertyValue('--primary-600'),
        colorText: 'rgb(55,65,81)',
        fontSizeBase: '1rem',
        fontWeightBold: '500',
        fontWeightNormal: '500',
        focusOutline: this.styles.getPropertyValue('--primary-500'),
        fontFamily:
          'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"',
      },
      rules: {
        '.Label': {
          display: 'block',
          fontSize: '0.875rem',
          lineHeight: '1.25rem',
          fontWeight: '500',
          color: 'rgb(55 65 81 / var(--tw-text-opacity))',
        },
        '.Input': {
          boxShadow: '0',
          display: 'block',
          appearance: 'none',
          borderRadius: '0.375rem',
          borderWidth: '1px',
          borderColor: 'rgb(209 213 219)',
          paddingLeft: '0.75rem',
          paddingRight: '0.75rem',
          paddingTop: '0.5rem',
          fontSize: '0.875rem',
          lineHeight: '1.25rem',
          paddingBottom: '0.5rem',
        },
        '.Input:focus': {
          boxShadow:
            '0px 0px 0px rgba(0, 0, 0, 0.03), 0px 0px 0px rgba(0, 0, 0, 0.02),0 0 0 1px var(--p-colorPrimaryHover)',
        },
      },
    },
  };
 paymentElementOptions: StripeElementsOptionsMode = {
    ...this.baseElementOptions,
    ...{
      amount: 0,
      mode: 'payment',
      locale: 'en',
      currency: 'usd',
      // paymentMethodTypes: ['card', 'link', 'klarna', 'affirm'],
      paymentMethodCreation: 'manual',
      loader: 'always',
    },
  };

Expected behavior Expect element to be initialized with parsedIntentSecret

Screenshots

Desktop (please complete the following information):

Smartphone (please complete the following information):

Additional context NG17 with version ngx-stripe 15.3.0 works as expected