@funnelsgrove/payments 0.1.50 → 0.1.52

package/README.md

@@ -24,8 +24,8 @@ Use these for new subscription paywalls:
 
 Use these for new one-time paywall plans:
 
-- `createStripePaymentIntent`
-- `SharedStripeCheckoutV2Dialog` with `checkoutMode="payment_intent"`
+- `createStripeOneTimeCheckout`
+- `SharedStripeCheckoutV2Dialog`
 
 Use `chargeStripeOneClickPayment` for post-checkout one-click upsells when the shared client helper fits the funnel. It delegates to `funnelSdkService.chargeOneClickPayment`.
 
@@ -33,6 +33,7 @@ Use `chargeStripeOneClickPayment` for post-checkout one-click upsells when the s
 
 Keep these exports available for saved drafts, old published artifacts, and controlled migrations. Do not use them for new subscription checkout work:
 
+- `createStripePaymentIntent`
 - `SharedStripeCheckoutDialog`
 - `ApplePaySubscribeButton`
 - `GooglePaySubscribeButton`
@@ -68,7 +69,7 @@ When a live funnel still uses one of these, migrate the funnel deliberately with
 - `services/planCatalog.service`: plan resolution and selection helpers.
 - `services/runtimeBillingPlanCatalog.service`: test/live runtime catalog selection.
 - `services/paywallOffer.service`: timed discount and display-plan helpers.
-- `services/stripe.service`: Stripe loader, checkout-session, hosted checkout, one-click, and one-time PaymentIntent clients.
+- `services/stripe.service`: Stripe loader, Checkout Session, hosted checkout, one-click, one-time Checkout Session clients, and deprecated PaymentIntent compatibility clients.
 - `providers/*`: provider-neutral checkout state and Stripe subscription checkout slots.
 - `components/shared/*`: plan selector, checkout dialogs, Express Checkout wrappers, wallet placeholders, and trust assets.
 - `testing/walletCheckoutSmoke`: wallet checkout smoke assertions.

package/dist/components/shared/SharedStripeCheckoutV2Dialog.d.ts

@@ -5,7 +5,6 @@ export type SharedStripeCheckoutV2DialogProps = {
     buttonColor: string;
     cardSubmitLabel: string;
     checkoutAnalytics?: StripeSubscriptionCheckoutAnalyticsContext | null;
-    checkoutMode?: 'checkout_session' | 'payment_intent';
     checkoutSessionId?: string | null;
     clientSecret: string;
     closeAriaLabel: string;
@@ -64,5 +63,5 @@ export type SharedCheckoutSpecialOfferDialogProps = {
     themeColor: string;
     title: string;
 };
-export declare function SharedStripeCheckoutV2Dialog({ checkoutAnalytics, checkoutMode, checkoutSessionId, clientSecret, onClose, stripePromise, supportedCountries, ...props }: SharedStripeCheckoutV2DialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function SharedStripeCheckoutV2Dialog({ checkoutAnalytics, checkoutSessionId, clientSecret, onClose, stripePromise, supportedCountries, ...props }: SharedStripeCheckoutV2DialogProps): import("react/jsx-runtime").JSX.Element;
 export declare function SharedCheckoutSpecialOfferDialog({ buttonColor, buttonLabel, description, discountLabel, imageAlt, imageSrc, onAccept, themeColor, title, }: SharedCheckoutSpecialOfferDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/shared/SharedStripeCheckoutV2Dialog.js

@@ -12,10 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useMemo, useState, } from 'react';
-import { Elements, PaymentElement as PaymentIntentPaymentElement, useElements, useStripe, } from '@stripe/react-stripe-js';
 import { CheckoutProvider, PaymentElement, useCheckout, } from '@stripe/react-stripe-js/checkout';
 import { PaymentBrandMark, SecurityLockIcon } from './CheckoutBrandAssets.js';
-import { StripeExpressCheckoutButton } from './StripeExpressCheckoutButton.js';
 import { StripeCheckoutExpressCheckoutButton } from './StripeCheckoutExpressCheckoutButton.js';
 import { getUnsupportedCheckoutCountryMessage, normalizeSupportedCheckoutCountries, } from './checkoutCountries.js';
 import { isInactiveCheckoutSessionError } from '../../providers/stripe/useStripeSubscriptionCheckoutSession.js';
@@ -61,23 +59,6 @@ function getFriendlyCardErrorMessage(error) {
         ? error.message
         : 'Payment failed. Please review your card details and try again.';
 }
-const normalizeBillingName = (input) => {
-    var _a, _b, _c;
-    const normalizedName = (_a = input.name) === null || _a === void 0 ? void 0 : _a.trim();
-    if (normalizedName) {
-        return normalizedName;
-    }
-    const normalizedEmail = (_b = input.email) === null || _b === void 0 ? void 0 : _b.trim();
-    if (normalizedEmail) {
-        const localPart = (_c = normalizedEmail
-            .split('@')[0]) === null || _c === void 0 ? void 0 : _c.replace(/[._-]+/g, ' ').trim();
-        if (localPart) {
-            return localPart;
-        }
-    }
-    return 'Customer';
-};
-const isSuccessfulIntentStatus = (status) => status === 'succeeded' || status === 'processing' || status === 'requires_capture';
 function SharedStripeCheckoutV2CheckoutSessionForm({ amountCents, buttonColor, cardSubmitLabel, closeAriaLabel, countdownLabel, checkoutAnalytics, checkoutSessionId, customerEmail, customerEmailEditable = false, customerEmailLabel = 'Email', customerEmailPlaceholder = 'Enter your email', customerEmailInvalidMessage = 'Enter a valid email address.', customerName, discountAmountLabel, discountLabel, discountPercent, initialWalletAvailable, onClose, onCustomerEmailChange, onCustomerEmailCommit, onError, onInactiveCheckoutSession, onPaymentInfoSubmitted, onSuccess, paymentMethodLabels = defaultPaymentMethodLabels, promoActive, processingLabel, promoCode, promoCodeLabel, remainingSeconds, returnUrl, savedLabel, secureLabel, satisfactionLabel, satisfactionPercent, summaryLabel, supportedCountries, themeColor, title, totalLabel, totalValue, unsupportedCountryMessage, walletButtonLabel, originalPriceLabel, originalPriceValue, }) {
     const checkoutState = useCheckout();
     const walletPaymentMethods = usePlatformWalletPaymentMethods();
@@ -325,270 +306,6 @@ function SharedStripeCheckoutV2CheckoutSessionForm({ amountCents, buttonColor, c
                                                         onCustomerEmailChange === null || onCustomerEmailChange === void 0 ? void 0 : onCustomerEmailChange(event.target.value);
                                                     } }) })] }), _jsx(PaymentElement, { options: paymentElementOptions, onChange: handlePaymentElementChange }), fixedBillingCountry && fixedBillingCountryLabel ? (_jsxs("label", { className: 'shared-checkout-v2-country-field', children: [_jsx("span", { className: 'shared-checkout-v2-country-label', children: "Country" }), _jsx("span", { className: 'shared-checkout-v2-country-control', children: _jsx("select", { "aria-label": 'Country', className: 'shared-checkout-v2-country-select', value: fixedBillingCountry, onChange: () => setBillingCountry(fixedBillingCountry), children: _jsx("option", { value: fixedBillingCountry, children: fixedBillingCountryLabel }) }) })] })) : null] }), visibleError ? _jsx("p", { className: 'shared-checkout-v2-error', children: visibleError }) : null, _jsxs("button", { type: 'submit', className: 'shared-checkout-v2-card-submit', disabled: submitting, children: [_jsx(SecurityLockIcon, { className: 'shared-checkout-v2-card-submit-icon' }), submitting ? processingLabel : cardSubmitLabel] }), _jsx("div", { className: 'shared-checkout-v2-card-brands', "aria-hidden": 'true', children: cardBrandLabels.map((label) => (_jsx(PaymentBrandMark, { label: label, className: 'shared-checkout-v2-card-brand' }, label))) }), _jsxs("p", { className: 'shared-checkout-v2-secure-pill shared-checkout-v2-secure-pill--card', children: [_jsx(SecurityLockIcon, { className: 'shared-checkout-v2-secure-pill-icon' }), secureLabel] })] })] })] }));
 }
-function SharedStripeCheckoutV2PaymentIntentForm({ amountCents, buttonColor, cardSubmitLabel, closeAriaLabel, countdownLabel, customerEmail, customerEmailEditable = false, customerEmailLabel = 'Email', customerEmailPlaceholder = 'Enter your email', customerEmailInvalidMessage = 'Enter a valid email address.', customerName, discountAmountLabel, discountLabel, discountPercent, initialWalletAvailable, onClose, onCustomerEmailChange, onCustomerEmailCommit, onError, onPaymentInfoSubmitted, onSuccess, paymentMethodLabels = defaultPaymentMethodLabels, promoActive, processingLabel, promoCode, promoCodeLabel, remainingSeconds, returnUrl, savedLabel, secureLabel, satisfactionLabel, satisfactionPercent, summaryLabel, supportedCountries, themeColor, title, totalLabel, totalValue, unsupportedCountryMessage, walletButtonLabel, originalPriceLabel, originalPriceValue, }) {
-    const stripe = useStripe();
-    const elements = useElements();
-    const walletPaymentMethods = usePlatformWalletPaymentMethods();
-    const [selectedMethod, setSelectedMethod] = useState('wallet');
-    const [walletAvailable, setWalletAvailable] = useState(initialWalletAvailable !== null && initialWalletAvailable !== void 0 ? initialWalletAvailable : null);
-    const effectiveWalletAvailable = initialWalletAvailable === true && walletAvailable !== false
-        ? true
-        : walletAvailable;
-    const [submitting, setSubmitting] = useState(false);
-    const [error, setError] = useState(null);
-    const [billingCountry, setBillingCountry] = useState(null);
-    const initialCustomerEmail = (customerEmail === null || customerEmail === void 0 ? void 0 : customerEmail.trim()) || '';
-    const [emailDraft, setEmailDraft] = useState(initialCustomerEmail);
-    const normalizedSupportedCountries = useMemo(() => normalizeSupportedCheckoutCountries(supportedCountries), [supportedCountries]);
-    const fixedBillingCountry = getFixedSupportedBillingCountry(normalizedSupportedCountries);
-    const fixedBillingCountryLabel = fixedBillingCountry
-        ? getCheckoutCountryLabel(fixedBillingCountry)
-        : null;
-    const cardBrandLabels = useMemo(() => paymentMethodLabels.length > 0 ? paymentMethodLabels : defaultPaymentMethodLabels, [paymentMethodLabels]);
-    const normalizedPromoCode = promoCode.trim();
-    const showPromo = promoActive !== null && promoActive !== void 0 ? promoActive : (discountPercent > 0 && normalizedPromoCode.length > 0);
-    const countdownValue = formatCountdown(remainingSeconds);
-    const resolvedCustomerEmail = customerEmailEditable
-        ? emailDraft.trim() || initialCustomerEmail
-        : initialCustomerEmail;
-    const emailFieldClassName = [
-        'shared-checkout-v2-email-field',
-        customerEmailEditable ? '' : 'is-disabled',
-    ]
-        .filter(Boolean)
-        .join(' ');
-    const checkoutStyle = {
-        '--shared-checkout-v2-theme-color': themeColor,
-        '--shared-checkout-v2-button-color': buttonColor,
-    };
-    const expressCheckoutSummaryLabel = (summaryLabel === null || summaryLabel === void 0 ? void 0 : summaryLabel.trim()) || discountLabel || title;
-    const walletAriaLabel = walletPaymentMethods
-        .map((method) => method === 'applePay' ? walletButtonLabel : 'Google Pay')
-        .join(' / ');
-    const showWalletMethod = effectiveWalletAvailable !== false && walletPaymentMethods.length > 0;
-    const effectiveSelectedMethod = showWalletMethod && selectedMethod === 'wallet' ? 'wallet' : 'card';
-    const expressCheckoutOptions = useMemo(() => {
-        return {
-            buttonHeight: 55,
-            buttonTheme: {
-                applePay: 'black',
-                googlePay: 'black',
-            },
-            buttonType: {
-                applePay: 'buy',
-                googlePay: 'buy',
-            },
-            layout: {
-                maxColumns: 1,
-                maxRows: 2,
-                overflow: 'auto',
-            },
-            lineItems: [
-                {
-                    name: expressCheckoutSummaryLabel,
-                    amount: amountCents,
-                },
-            ],
-            paymentMethodOrder: getStripeWalletPaymentMethodOrder(walletPaymentMethods),
-            paymentMethods: {
-                amazonPay: 'never',
-                applePay: walletPaymentMethods.includes('applePay') ? 'always' : 'never',
-                googlePay: walletPaymentMethods.includes('googlePay') ? 'always' : 'never',
-                klarna: 'never',
-                link: 'never',
-                paypal: 'never',
-            },
-        };
-    }, [amountCents, expressCheckoutSummaryLabel, walletPaymentMethods]);
-    const paymentElementOptions = useMemo(() => {
-        return Object.assign(Object.assign({ fields: {
-                billingDetails: {
-                    name: 'never',
-                    email: 'never',
-                    address: {
-                        country: fixedBillingCountry ? 'never' : 'auto',
-                    },
-                },
-            } }, (fixedBillingCountry
-            ? {
-                defaultValues: {
-                    billingDetails: {
-                        address: {
-                            country: fixedBillingCountry,
-                        },
-                    },
-                },
-            }
-            : {})), { layout: 'tabs', wallets: {
-                applePay: 'never',
-                googlePay: 'never',
-                link: 'never',
-            } });
-    }, [fixedBillingCountry]);
-    const setSharedError = (message) => {
-        setError(message);
-        onError === null || onError === void 0 ? void 0 : onError(message);
-    };
-    const selectWalletMethod = () => {
-        if (showWalletMethod) {
-            setSelectedMethod('wallet');
-        }
-    };
-    const selectCardMethod = () => setSelectedMethod('card');
-    const handleWalletAvailabilityChange = (available) => {
-        setWalletAvailable(available);
-        if (!available && selectedMethod === 'wallet') {
-            setSelectedMethod('card');
-        }
-    };
-    const getBillingCountryError = (country) => getUnsupportedCheckoutCountryMessage({
-        billingCountry: country,
-        message: unsupportedCountryMessage,
-        supportedCountries: normalizedSupportedCountries,
-    });
-    const handlePaymentElementChange = (event) => {
-        var _a, _b;
-        setBillingCountry((_b = (_a = event.value.billingDetails) === null || _a === void 0 ? void 0 : _a.address.country) !== null && _b !== void 0 ? _b : fixedBillingCountry);
-    };
-    const trackCheckoutSuccess = async () => {
-        await (onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess());
-    };
-    useEffect(() => {
-        if (effectiveSelectedMethod !== 'card' || typeof window === 'undefined') {
-            return;
-        }
-        const resizeTimer = window.setTimeout(() => {
-            window.dispatchEvent(new Event('resize'));
-        }, 0);
-        return () => window.clearTimeout(resizeTimer);
-    }, [effectiveSelectedMethod]);
-    const commitCustomerEmail = async (normalizedEmail) => {
-        if (!customerEmailEditable || !onCustomerEmailCommit) {
-            return normalizedEmail;
-        }
-        const committedEmail = await onCustomerEmailCommit(normalizedEmail);
-        const nextEmail = typeof committedEmail === 'string' && committedEmail.trim()
-            ? committedEmail.trim()
-            : normalizedEmail;
-        setEmailDraft(nextEmail);
-        onCustomerEmailChange === null || onCustomerEmailChange === void 0 ? void 0 : onCustomerEmailChange(nextEmail);
-        return nextEmail;
-    };
-    const commitEmailDraftIfValid = (value) => {
-        const normalizedEmail = value.trim();
-        if (!customerEmailEditable || !onCustomerEmailCommit) {
-            return;
-        }
-        if (!normalizedEmail || !isValidEmail(normalizedEmail)) {
-            return;
-        }
-        void commitCustomerEmail(normalizedEmail).catch((commitError) => {
-            setSharedError(getFriendlyCardErrorMessage(commitError));
-        });
-    };
-    const ensureCustomerEmail = async () => {
-        const normalizedEmail = resolvedCustomerEmail.trim();
-        if (!normalizedEmail || !isValidEmail(normalizedEmail)) {
-            setSharedError(customerEmailInvalidMessage);
-            return null;
-        }
-        return commitCustomerEmail(normalizedEmail);
-    };
-    const handleSubmit = async (event) => {
-        var _a;
-        event.preventDefault();
-        if (!stripe || !elements || submitting) {
-            return;
-        }
-        const billingCountryError = getBillingCountryError(billingCountry !== null && billingCountry !== void 0 ? billingCountry : fixedBillingCountry);
-        if (billingCountryError) {
-            setSharedError(billingCountryError);
-            return;
-        }
-        setSubmitting(true);
-        setSharedError(null);
-        try {
-            const syncedEmail = await ensureCustomerEmail();
-            if (!syncedEmail) {
-                setSubmitting(false);
-                return;
-            }
-            const submitResult = await elements.submit();
-            if (submitResult.error) {
-                setSharedError(submitResult.error.message || 'Payment form is not ready yet.');
-                setSubmitting(false);
-                return;
-            }
-            await (onPaymentInfoSubmitted === null || onPaymentInfoSubmitted === void 0 ? void 0 : onPaymentInfoSubmitted());
-            const result = await stripe.confirmPayment({
-                elements,
-                confirmParams: {
-                    payment_method_data: {
-                        billing_details: {
-                            email: syncedEmail || undefined,
-                            name: normalizeBillingName({
-                                email: syncedEmail,
-                                name: customerName,
-                            }),
-                        },
-                    },
-                    return_url: returnUrl,
-                },
-                redirect: 'if_required',
-            });
-            if (result.error) {
-                const message = result.error.message || 'Payment failed.';
-                setSharedError(message);
-                setSubmitting(false);
-                return;
-            }
-            if (typeof window !== 'undefined' &&
-                isSuccessfulIntentStatus((_a = result.paymentIntent) === null || _a === void 0 ? void 0 : _a.status)) {
-                await trackCheckoutSuccess();
-                window.location.assign(returnUrl);
-                return;
-            }
-            setSubmitting(false);
-        }
-        catch (submitError) {
-            setSharedError(getFriendlyCardErrorMessage(submitError));
-            setSubmitting(false);
-        }
-    };
-    const visibleError = error;
-    return (_jsxs("div", { className: 'shared-checkout-v2-shell', style: checkoutStyle, children: [_jsxs("header", { className: 'shared-checkout-v2-header', children: [_jsx("button", { type: 'button', className: 'shared-checkout-v2-close', onClick: onClose, "aria-label": closeAriaLabel, children: _jsx("span", { "aria-hidden": 'true' }) }), _jsx("h2", { id: 'shared-checkout-v2-title', children: title })] }), _jsxs("section", { className: 'shared-checkout-v2-summary', children: [showPromo ? (_jsxs("p", { className: 'shared-checkout-v2-countdown', children: [discountPercent, "% ", countdownLabel, " ", countdownValue, " min"] })) : null, _jsxs("p", { className: 'shared-checkout-v2-satisfaction', children: [_jsx("strong", { children: satisfactionPercent }), " ", satisfactionLabel] }), showPromo ? (_jsxs("div", { className: 'shared-checkout-v2-price-stack', children: [_jsxs("div", { className: 'shared-checkout-v2-price-row is-muted', children: [_jsx("span", { children: originalPriceLabel }), _jsx("span", { className: 'shared-checkout-v2-strike', children: originalPriceValue })] }), _jsxs("div", { className: 'shared-checkout-v2-price-row is-discount', children: [_jsx("strong", { children: discountLabel }), _jsx("strong", { children: discountAmountLabel })] }), _jsxs("div", { className: 'shared-checkout-v2-promo', children: [_jsx("span", { children: promoCodeLabel }), _jsx("strong", { children: normalizedPromoCode })] })] })) : null, _jsxs("div", { className: [
-                            'shared-checkout-v2-total',
-                            showPromo ? '' : 'is-plain',
-                        ]
-                            .filter(Boolean)
-                            .join(' '), children: [_jsx("span", { children: totalLabel }), _jsxs("strong", { children: [_jsx("svg", { viewBox: '0 0 24 24', "aria-hidden": 'true', children: _jsx("path", { d: 'M20.6 13.4 12.4 21.6a2.2 2.2 0 0 1-3.1 0L2.4 14.7a2.2 2.2 0 0 1-.6-1.6V5.4a2 2 0 0 1 2-2h7.7a2.2 2.2 0 0 1 1.6.6l7.5 7.5a1.4 1.4 0 0 1 0 1.9ZM7.2 8.1a1.2 1.2 0 1 0 0-2.4 1.2 1.2 0 0 0 0 2.4Z' }) }), totalValue] })] }), showPromo ? (_jsxs("p", { className: 'shared-checkout-v2-saved', children: [_jsx("span", { "aria-hidden": 'true', children: "\uD83D\uDD25" }), savedLabel] })) : null] }), _jsxs("form", { className: 'shared-checkout-v2-payment', onSubmit: (event) => void handleSubmit(event), children: [showWalletMethod ? (_jsxs("div", { className: 'shared-checkout-v2-methods', role: 'tablist', "aria-label": 'Payment method', children: [_jsxs("button", { type: 'button', className: [
-                                    'shared-checkout-v2-method',
-                                    effectiveSelectedMethod === 'wallet' ? 'is-selected' : '',
-                                ]
-                                    .filter(Boolean)
-                                    .join(' '), onClick: selectWalletMethod, role: 'tab', "aria-selected": effectiveSelectedMethod === 'wallet', children: [_jsxs("span", { className: 'shared-checkout-v2-tab-wallets', "aria-hidden": 'true', children: [walletPaymentMethods.includes('applePay') ? (_jsx(PaymentBrandMark, { label: 'Apple Pay', className: 'shared-checkout-v2-tab-wallet' })) : null, walletPaymentMethods.includes('googlePay') ? (_jsx(PaymentBrandMark, { label: 'Google Pay', className: 'shared-checkout-v2-tab-wallet' })) : null] }), _jsx("span", { className: 'shared-checkout-v2-sr-only', children: walletAriaLabel })] }), _jsxs("button", { type: 'button', className: [
-                                    'shared-checkout-v2-method',
-                                    effectiveSelectedMethod === 'card' ? 'is-selected' : '',
-                                ]
-                                    .filter(Boolean)
-                                    .join(' '), onClick: selectCardMethod, role: 'tab', "aria-selected": effectiveSelectedMethod === 'card', children: [_jsx("strong", { children: "Credit card" }), _jsx("span", { className: 'shared-checkout-v2-tab-brands', "aria-hidden": 'true', children: cardBrandLabels.slice(0, 4).map((label) => (_jsx(PaymentBrandMark, { label: label, className: 'shared-checkout-v2-tab-brand' }, label))) })] })] })) : null, _jsxs("div", { hidden: effectiveSelectedMethod !== 'wallet', className: [
-                            'shared-checkout-v2-wallet-panel',
-                            effectiveSelectedMethod === 'wallet' ? 'is-visible' : '',
-                        ]
-                            .filter(Boolean)
-                            .join(' '), children: [_jsxs("p", { className: 'shared-checkout-v2-secure-pill', children: [_jsx(SecurityLockIcon, { className: 'shared-checkout-v2-secure-pill-icon' }), secureLabel] }), _jsxs("div", { className: 'shared-checkout-v2-wallet-shell', "aria-label": walletAriaLabel, children: [_jsx(StripeExpressCheckoutButton, { amountCents: amountCents, availabilityPaymentMethods: walletPaymentMethods, beforeConfirm: ensureCustomerEmail, className: 'shared-checkout-v2-express-buttons', customerEmail: resolvedCustomerEmail, customerName: customerName, initialAvailable: initialWalletAvailable, keepInitialAvailableOnReady: initialWalletAvailable === true, onAvailabilityChange: handleWalletAvailabilityChange, onError: setSharedError, onPaymentInfoSubmitted: onPaymentInfoSubmitted, onSuccess: trackCheckoutSuccess, options: expressCheckoutOptions, returnUrl: returnUrl, summaryLabel: expressCheckoutSummaryLabel }), _jsx("span", { className: 'shared-checkout-v2-sr-only', children: walletAriaLabel })] })] }), _jsxs("div", { hidden: effectiveSelectedMethod !== 'card', className: [
-                            'shared-checkout-v2-card-panel',
-                            effectiveSelectedMethod === 'card' ? 'is-visible' : '',
-                        ]
-                            .filter(Boolean)
-                            .join(' '), children: [_jsxs("div", { className: 'shared-checkout-v2-card-box', children: [_jsxs("label", { className: emailFieldClassName, children: [_jsx("span", { className: 'shared-checkout-v2-email-label', children: customerEmailLabel }), _jsx("span", { className: 'shared-checkout-v2-email-control', children: _jsx("input", { type: 'email', autoComplete: 'email', className: 'shared-checkout-v2-email-input', disabled: !customerEmailEditable, inputMode: 'email', readOnly: !customerEmailEditable, value: customerEmailEditable ? emailDraft : initialCustomerEmail, placeholder: customerEmailPlaceholder, onBlur: (event) => commitEmailDraftIfValid(event.currentTarget.value), onChange: (event) => {
-                                                        if (!customerEmailEditable) {
-                                                            return;
-                                                        }
-                                                        setEmailDraft(event.target.value);
-                                                        onCustomerEmailChange === null || onCustomerEmailChange === void 0 ? void 0 : onCustomerEmailChange(event.target.value);
-                                                    } }) })] }), _jsx(PaymentIntentPaymentElement, { options: paymentElementOptions, onChange: handlePaymentElementChange }), fixedBillingCountry && fixedBillingCountryLabel ? (_jsxs("label", { className: 'shared-checkout-v2-country-field', children: [_jsx("span", { className: 'shared-checkout-v2-country-label', children: "Country" }), _jsx("span", { className: 'shared-checkout-v2-country-control', children: _jsx("select", { "aria-label": 'Country', className: 'shared-checkout-v2-country-select', value: fixedBillingCountry, onChange: () => setBillingCountry(fixedBillingCountry), children: _jsx("option", { value: fixedBillingCountry, children: fixedBillingCountryLabel }) }) })] })) : null] }), visibleError ? _jsx("p", { className: 'shared-checkout-v2-error', children: visibleError }) : null, _jsxs("button", { type: 'submit', className: 'shared-checkout-v2-card-submit', disabled: submitting, children: [_jsx(SecurityLockIcon, { className: 'shared-checkout-v2-card-submit-icon' }), submitting ? processingLabel : cardSubmitLabel] }), _jsx("div", { className: 'shared-checkout-v2-card-brands', "aria-hidden": 'true', children: cardBrandLabels.map((label) => (_jsx(PaymentBrandMark, { label: label, className: 'shared-checkout-v2-card-brand' }, label))) }), _jsxs("p", { className: 'shared-checkout-v2-secure-pill shared-checkout-v2-secure-pill--card', children: [_jsx(SecurityLockIcon, { className: 'shared-checkout-v2-secure-pill-icon' }), secureLabel] })] })] })] }));
-}
 function CheckoutSessionProvider({ children, clientSecret, fixedBillingCountry, stripePromise, }) {
     const providerChildren = children;
     const checkoutProviderOptions = useMemo(() => (Object.assign(Object.assign({ clientSecret }, (fixedBillingCountry
@@ -606,24 +323,16 @@ function CheckoutSessionProvider({ children, clientSecret, fixedBillingCountry,
         } })), [clientSecret, fixedBillingCountry]);
     return (_jsx(CheckoutProvider, { stripe: stripePromise, options: checkoutProviderOptions, children: providerChildren }, clientSecret));
 }
-function PaymentIntentProvider({ children, clientSecret, stripePromise, }) {
-    const providerChildren = children;
-    const elementsOptions = useMemo(() => ({
-        clientSecret,
-        appearance: stripeCheckoutV2Appearance,
-    }), [clientSecret]);
-    return (_jsx(Elements, { stripe: stripePromise, options: elementsOptions, children: providerChildren }, clientSecret));
-}
 export function SharedStripeCheckoutV2Dialog(_a) {
-    var { checkoutAnalytics, checkoutMode = 'checkout_session', checkoutSessionId, clientSecret, onClose, stripePromise, supportedCountries } = _a, props = __rest(_a, ["checkoutAnalytics", "checkoutMode", "checkoutSessionId", "clientSecret", "onClose", "stripePromise", "supportedCountries"]);
+    var { checkoutAnalytics, checkoutSessionId, clientSecret, onClose, stripePromise, supportedCountries } = _a, props = __rest(_a, ["checkoutAnalytics", "checkoutSessionId", "clientSecret", "onClose", "stripePromise", "supportedCountries"]);
     const normalizedSupportedCountries = useMemo(() => normalizeSupportedCheckoutCountries(supportedCountries), [supportedCountries]);
     const fixedBillingCountry = getFixedSupportedBillingCountry(normalizedSupportedCountries);
     useEffect(() => {
-        if (checkoutMode !== 'checkout_session' || !checkoutAnalytics) {
+        if (!checkoutAnalytics) {
             return;
         }
         void trackStripeSubscriptionCheckoutStarted(Object.assign({ checkoutSessionId }, checkoutAnalytics));
-    }, [checkoutAnalytics, checkoutMode, checkoutSessionId, clientSecret]);
+    }, [checkoutAnalytics, checkoutSessionId, clientSecret]);
     useEffect(() => {
         const handleKeyDown = (event) => {
             if (event.key === 'Escape') {
@@ -633,7 +342,7 @@ export function SharedStripeCheckoutV2Dialog(_a) {
         window.addEventListener('keydown', handleKeyDown);
         return () => window.removeEventListener('keydown', handleKeyDown);
     }, [onClose]);
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: 'shared-checkout-v2-overlay', children: _jsx("div", { className: 'shared-checkout-v2-dialog', role: 'dialog', "aria-modal": 'true', "aria-labelledby": 'shared-checkout-v2-title', children: checkoutMode === 'payment_intent' ? (_jsx(PaymentIntentProvider, { clientSecret: clientSecret, stripePromise: stripePromise, children: _jsx(SharedStripeCheckoutV2PaymentIntentForm, Object.assign({}, props, { clientSecret: clientSecret, onClose: onClose, supportedCountries: normalizedSupportedCountries })) })) : (_jsx(CheckoutSessionProvider, { clientSecret: clientSecret, fixedBillingCountry: fixedBillingCountry, stripePromise: stripePromise, children: _jsx(SharedStripeCheckoutV2CheckoutSessionForm, Object.assign({}, props, { checkoutAnalytics: checkoutAnalytics, checkoutSessionId: checkoutSessionId, clientSecret: clientSecret, onClose: onClose, supportedCountries: normalizedSupportedCountries })) })) }) }), _jsx("style", { children: sharedStripeCheckoutV2Styles })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: 'shared-checkout-v2-overlay', children: _jsx("div", { className: 'shared-checkout-v2-dialog', role: 'dialog', "aria-modal": 'true', "aria-labelledby": 'shared-checkout-v2-title', children: _jsx(CheckoutSessionProvider, { clientSecret: clientSecret, fixedBillingCountry: fixedBillingCountry, stripePromise: stripePromise, children: _jsx(SharedStripeCheckoutV2CheckoutSessionForm, Object.assign({}, props, { checkoutAnalytics: checkoutAnalytics, checkoutSessionId: checkoutSessionId, clientSecret: clientSecret, onClose: onClose, supportedCountries: normalizedSupportedCountries })) }) }) }), _jsx("style", { children: sharedStripeCheckoutV2Styles })] }));
 }
 function SharedCheckoutSpecialOfferGift({ discountLabel, imageAlt, imageSrc, }) {
     if (imageSrc) {

package/dist/components/shared/StripeExpressCheckoutElement.js

@@ -15,5 +15,5 @@ import { CheckoutProvider } from '@stripe/react-stripe-js/checkout';
 import { StripeCheckoutExpressCheckoutButton, } from './StripeCheckoutExpressCheckoutButton.js';
 export function StripeExpressCheckoutElement(_a) {
     var { appearance, clientSecret, stripePromise } = _a, buttonProps = __rest(_a, ["appearance", "clientSecret", "stripePromise"]);
-    return (_jsx(CheckoutProvider, { stripe: stripePromise, options: Object.assign({ clientSecret }, (appearance ? { elementsOptions: { appearance } } : {})), children: _jsx(StripeCheckoutExpressCheckoutButton, Object.assign({}, buttonProps)) }));
+    return (_jsx(CheckoutProvider, { stripe: stripePromise, options: Object.assign({ clientSecret }, (appearance ? { elementsOptions: { appearance } } : {})), children: _jsx(StripeCheckoutExpressCheckoutButton, Object.assign({}, buttonProps)) }, clientSecret));
 }

package/dist/services/stripe.service.d.ts

@@ -60,6 +60,26 @@ type CreatePaymentIntentResponse = {
     stripePublishableKey?: string;
     environment?: 'test' | 'live';
 };
+type CreateOneTimeCheckoutInput = {
+    plan: CheckoutSessionPlanInput;
+    couponId?: string | null;
+    analyticsMetadata?: Record<string, unknown> | null;
+    customerEmail?: string | null;
+    returnUrl: string;
+    user_id?: string | null;
+    environment?: RuntimeMode;
+    runtimeConfig?: StripeRuntimeConfigOverrides;
+};
+type CreateOneTimeCheckoutResponse = {
+    clientSecret: string;
+    checkoutSessionId?: string;
+    stripePublishableKey?: string;
+    environment?: 'test' | 'live';
+};
+export declare function createStripeOneTimeCheckout(input: CreateOneTimeCheckoutInput): Promise<CreateOneTimeCheckoutResponse>;
+/**
+ * @deprecated Use createStripeOneTimeCheckout for one-time paywall checkout.
+ */
 export declare function createStripePaymentIntent(input: CreatePaymentIntentInput): Promise<CreatePaymentIntentResponse>;
 type ChargeOneClickPaymentInput = {
     planId: string;

package/dist/services/stripe.service.js

@@ -531,6 +531,26 @@ const normalizeCheckoutAnalyticsMetadata = (metadata, plan) => {
     }
     return Object.assign(Object.assign({}, (normalized !== null && normalized !== void 0 ? normalized : {})), { analyticsPurchaseValue });
 };
+export async function createStripeOneTimeCheckout(input) {
+    var _a, _b, _c, _d, _e;
+    return funnelSdkService.createOneTimeCheckout({
+        planId: getPaywallPlanSelectionValue(input.plan),
+        providerPlanId: ((_a = input.plan.providerPlanId) === null || _a === void 0 ? void 0 : _a.trim()) || undefined,
+        title: input.plan.title,
+        description: ((_b = input.plan.description) === null || _b === void 0 ? void 0 : _b.trim()) || undefined,
+        amountCents: input.plan.amountCents,
+        couponId: ((_c = input.couponId) === null || _c === void 0 ? void 0 : _c.trim()) || undefined,
+        analyticsMetadata: normalizeCheckoutAnalyticsMetadata(input.analyticsMetadata, input.plan),
+        customerEmail: ((_d = input.customerEmail) === null || _d === void 0 ? void 0 : _d.trim()) || undefined,
+        returnUrl: input.returnUrl,
+        userId: ((_e = input.user_id) === null || _e === void 0 ? void 0 : _e.trim()) || undefined,
+        environment: input.environment,
+        runtimeConfig: input.runtimeConfig,
+    });
+}
+/**
+ * @deprecated Use createStripeOneTimeCheckout for one-time paywall checkout.
+ */
 export async function createStripePaymentIntent(input) {
     var _a, _b;
     return funnelSdkService.createOneTimePaymentIntent({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@funnelsgrove/payments",
-  "version": "0.1.50",
+  "version": "0.1.52",
   "type": "module",
   "private": false,
   "main": "./dist/index.js",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@funnelsgrove/analytics": "^0.1.28",
-    "@funnelsgrove/runtime": "^0.1.46",
+    "@funnelsgrove/runtime": "^0.1.54",
     "@stripe/react-stripe-js": "^5.6.0",
     "@stripe/stripe-js": "^8.7.0",
     "react": "19.2.3",