@funnelsgrove/payments 0.7.8 → 0.7.10

package/dist/providers/solidgate/components/SolidgateCheckoutDialog.d.ts

@@ -1,6 +1,6 @@
 import type { FunnelSdkRuntimeConfigOverrides, FunnelStepType, RuntimeMode } from '@funnelsgrove/runtime';
 import { type PrepareSolidgateCheckoutInput, type SolidgateCheckoutPreparation } from '../services/solidgate.service.js';
-export type SolidgateCheckoutDialogState = 'loading' | 'ready' | 'submitting' | 'verifying' | 'success' | 'recoverable_error' | 'expired';
+export type SolidgateCheckoutDialogState = 'collecting_email' | 'loading' | 'ready' | 'submitting' | 'verifying' | 'success' | 'recoverable_error' | 'expired';
 export type SolidgateCheckoutDialogContent = {
     title: string;
     closeAriaLabel: string;
@@ -12,13 +12,20 @@ export type SolidgateCheckoutDialogContent = {
     expired: string;
     retry: string;
     resumeVerification: string;
+    customerEmailLabel: string;
+    customerEmailPlaceholder: string;
+    customerEmailInvalid: string;
+    customerEmailUnavailable: string;
+    customerEmailContinue: string;
 };
 export type SolidgateCheckoutDialogProps = {
     open: boolean;
     request: Omit<PrepareSolidgateCheckoutInput, 'signal'>;
+    customerEmail?: string | null;
     checkoutAnalytics?: SolidgateCheckoutAnalyticsContext | null;
     content?: Partial<SolidgateCheckoutDialogContent>;
     onClose: () => void;
+    onCustomerEmailCommit?: (email: string) => Promise<string>;
     onSuccess?: (checkout: SolidgateCheckoutPreparation) => void | Promise<void>;
     onRetry?: () => void;
     onError?: (message: string) => void;
@@ -34,4 +41,4 @@ export type SolidgateCheckoutAnalyticsContext = {
     stepType: Extract<FunnelStepType, 'checkout' | 'paywall_offer' | 'upsell_offer'>;
     stepContractVersion: number;
 };
-export declare function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, content, onClose, onSuccess, onRetry, onError, onStateChange, }: SolidgateCheckoutDialogProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SolidgateCheckoutDialog({ open, request, customerEmail, checkoutAnalytics, content, onClose, onCustomerEmailCommit, onSuccess, onRetry, onError, onStateChange, }: SolidgateCheckoutDialogProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/providers/solidgate/components/SolidgateCheckoutDialog.js

@@ -17,6 +17,17 @@ const defaultContent = {
     expired: 'This checkout has expired. Start a new payment to continue.',
     retry: 'Try again',
     resumeVerification: 'Check payment status',
+    customerEmailLabel: 'Email address',
+    customerEmailPlaceholder: 'you@example.com',
+    customerEmailInvalid: 'Enter a valid email address to continue.',
+    customerEmailUnavailable: 'Your email could not be saved. Please try again.',
+    customerEmailContinue: 'Continue to payment',
+};
+const normalizeValidEmail = (value) => {
+    const normalized = (value === null || value === void 0 ? void 0 : value.trim()) || '';
+    return normalized.length <= 320 && /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(normalized)
+        ? normalized
+        : null;
 };
 const initialView = {
     state: 'loading',
@@ -85,9 +96,14 @@ function SolidgatePaymentForm({ checkout, hidden, loadingLabel, onError, onMount
                         instanceRef.current = instance;
                     }, onMounted: onMounted, onSubmit: onSubmit, onVerify: onVerify, onSuccess: onVerify, onFail: onVerify, onError: onError }, checkout.attemptId) })] }));
 }
-export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, content, onClose, onSuccess, onRetry, onError, onStateChange, }) {
+export function SolidgateCheckoutDialog({ open, request, customerEmail, checkoutAnalytics, content, onClose, onCustomerEmailCommit, onSuccess, onRetry, onError, onStateChange, }) {
     const copy = useMemo(() => (Object.assign(Object.assign({}, defaultContent), content)), [content]);
     const [view, setView] = useState(initialView);
+    const normalizedCustomerEmail = normalizeValidEmail(customerEmail);
+    const [emailInput, setEmailInput] = useState((customerEmail === null || customerEmail === void 0 ? void 0 : customerEmail.trim()) || '');
+    const [committedEmail, setCommittedEmail] = useState(normalizedCustomerEmail);
+    const [emailError, setEmailError] = useState(null);
+    const [emailSubmitting, setEmailSubmitting] = useState(false);
     const prepareAbortRef = useRef(null);
     const statusAbortRef = useRef(null);
     const successAttemptRef = useRef(null);
@@ -105,17 +121,31 @@ export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, cont
         onStateChangeRef.current = onStateChange;
         onSuccessRef.current = onSuccess;
     }, [checkoutAnalytics, copy, onError, onStateChange, onSuccess]);
-    const { discountKeyOrProviderId, failUrl, funnelPlanKey, funnelEndUserId, funnelId, idempotencyKey, offerSetId, projectBillingPlanId, returnUrl, runtimeConfig, successUrl, } = request;
+    useEffect(() => {
+        setEmailInput((customerEmail === null || customerEmail === void 0 ? void 0 : customerEmail.trim()) || '');
+        setCommittedEmail(normalizedCustomerEmail);
+        setEmailError(null);
+    }, [customerEmail, normalizedCustomerEmail]);
+    const { discountKeyOrProviderId, failUrl, funnelPlanKey, funnelEndUserId, funnelId, idempotencyKey, offerSetId, returnUrl, runtimeConfig, successUrl, } = request;
     const { apiBaseUrl, funnelId: runtimeFunnelId, funnelSdkPublishableKey, funnelVersionId, } = runtimeConfig || {};
     const hasRuntimeConfig = runtimeConfig !== undefined;
-    const normalizedRequest = useMemo(() => (Object.assign(Object.assign({ funnelId: (funnelId === null || funnelId === void 0 ? void 0 : funnelId.trim()) || null, funnelEndUserId: funnelEndUserId.trim(), offerSetId: offerSetId.trim() }, (funnelPlanKey
-        ? { funnelPlanKey: funnelPlanKey.trim() }
-        : { projectBillingPlanId: (projectBillingPlanId === null || projectBillingPlanId === void 0 ? void 0 : projectBillingPlanId.trim()) || '' })), { idempotencyKey: idempotencyKey.trim(), discountKeyOrProviderId: (discountKeyOrProviderId === null || discountKeyOrProviderId === void 0 ? void 0 : discountKeyOrProviderId.trim()) || null, returnUrl: returnUrl.trim(), successUrl: successUrl.trim(), failUrl: failUrl.trim(), runtimeConfig: hasRuntimeConfig ? {
+    const normalizedRequest = useMemo(() => ({
+        funnelId: (funnelId === null || funnelId === void 0 ? void 0 : funnelId.trim()) || null,
+        funnelEndUserId: funnelEndUserId.trim(),
+        offerSetId: offerSetId.trim(),
+        funnelPlanKey: funnelPlanKey.trim(),
+        idempotencyKey: idempotencyKey.trim(),
+        discountKeyOrProviderId: (discountKeyOrProviderId === null || discountKeyOrProviderId === void 0 ? void 0 : discountKeyOrProviderId.trim()) || null,
+        returnUrl: returnUrl.trim(),
+        successUrl: successUrl.trim(),
+        failUrl: failUrl.trim(),
+        runtimeConfig: hasRuntimeConfig ? {
             apiBaseUrl: (apiBaseUrl === null || apiBaseUrl === void 0 ? void 0 : apiBaseUrl.trim()) || null,
             funnelId: (runtimeFunnelId === null || runtimeFunnelId === void 0 ? void 0 : runtimeFunnelId.trim()) || null,
             funnelVersionId: (funnelVersionId === null || funnelVersionId === void 0 ? void 0 : funnelVersionId.trim()) || null,
             funnelSdkPublishableKey: (funnelSdkPublishableKey === null || funnelSdkPublishableKey === void 0 ? void 0 : funnelSdkPublishableKey.trim()) || null,
-        } : undefined })), [
+        } : undefined,
+    }), [
         apiBaseUrl,
         discountKeyOrProviderId,
         failUrl,
@@ -126,7 +156,6 @@ export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, cont
         funnelVersionId,
         idempotencyKey,
         offerSetId,
-        projectBillingPlanId,
         returnUrl,
         hasRuntimeConfig,
         runtimeFunnelId,
@@ -137,16 +166,27 @@ export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, cont
         setView(nextView);
         (_a = onStateChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onStateChangeRef, nextView.state);
     }, []);
+    const requiresEmailCommit = Boolean(onCustomerEmailCommit);
     useEffect(() => {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f;
         if (!open) {
             (_a = prepareAbortRef.current) === null || _a === void 0 ? void 0 : _a.abort();
             (_b = statusAbortRef.current) === null || _b === void 0 ? void 0 : _b.abort();
             return;
         }
+        if (requiresEmailCommit && !committedEmail) {
+            (_c = prepareAbortRef.current) === null || _c === void 0 ? void 0 : _c.abort();
+            (_d = statusAbortRef.current) === null || _d === void 0 ? void 0 : _d.abort();
+            queueMicrotask(() => setState({
+                state: 'collecting_email',
+                checkout: null,
+                canResumeVerification: false,
+            }));
+            return;
+        }
         const controller = new AbortController();
-        (_c = prepareAbortRef.current) === null || _c === void 0 ? void 0 : _c.abort();
-        (_d = statusAbortRef.current) === null || _d === void 0 ? void 0 : _d.abort();
+        (_e = prepareAbortRef.current) === null || _e === void 0 ? void 0 : _e.abort();
+        (_f = statusAbortRef.current) === null || _f === void 0 ? void 0 : _f.abort();
         prepareAbortRef.current = controller;
         successAttemptRef.current = null;
         paymentInfoAttemptRef.current = null;
@@ -170,7 +210,7 @@ export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, cont
             }
         });
         return () => controller.abort();
-    }, [normalizedRequest, open, setState]);
+    }, [committedEmail, normalizedRequest, open, requiresEmailCommit, setState]);
     useEffect(() => {
         var _a;
         if (!open) {
@@ -245,6 +285,30 @@ export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, cont
             }
         }
     }, [normalizedRequest, setState, view]);
+    const commitCustomerEmail = useCallback(async (event) => {
+        event.preventDefault();
+        const normalized = normalizeValidEmail(emailInput);
+        if (!normalized || !onCustomerEmailCommit) {
+            setEmailError(copy.customerEmailInvalid);
+            return;
+        }
+        setEmailSubmitting(true);
+        setEmailError(null);
+        try {
+            const committed = normalizeValidEmail(await onCustomerEmailCommit(normalized));
+            if (!committed) {
+                throw new Error('customer-email-not-committed');
+            }
+            setEmailInput(committed);
+            setCommittedEmail(committed);
+        }
+        catch (_a) {
+            setEmailError(copy.customerEmailUnavailable);
+        }
+        finally {
+            setEmailSubmitting(false);
+        }
+    }, [copy.customerEmailInvalid, copy.customerEmailUnavailable, emailInput, onCustomerEmailCommit]);
     if (!open) {
         return null;
     }
@@ -264,7 +328,10 @@ export function SolidgateCheckoutDialog({ open, request, checkoutAnalytics, cont
                         : view.state === 'recoverable_error'
                             ? copy.error
                             : null;
-    return (_jsx("div", { className: 'fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4', children: _jsxs("div", { role: 'dialog', "aria-modal": 'true', "aria-labelledby": 'solidgate-checkout-title', "data-checkout-state": view.state, className: 'w-full max-w-lg rounded-2xl border border-border bg-card p-5 text-foreground shadow-xl', children: [_jsxs("div", { className: 'mb-4 flex items-center justify-between gap-4', children: [_jsx("h2", { id: 'solidgate-checkout-title', className: 'text-lg font-semibold text-foreground', children: copy.title }), _jsx("button", { ref: closeButtonRef, type: 'button', onClick: onClose, "aria-label": copy.closeAriaLabel, className: 'rounded-md border border-border bg-background px-3 py-1.5 text-foreground hover:bg-accent', children: "\u00D7" })] }), view.checkout ? (_jsx(SolidgatePaymentForm, { checkout: view.checkout, hidden: !showForm, loadingLabel: copy.loading, onMounted: () => {
+    return (_jsx("div", { className: 'fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4', children: _jsxs("div", { role: 'dialog', "aria-modal": 'true', "aria-labelledby": 'solidgate-checkout-title', "data-checkout-state": view.state, className: 'w-full max-w-lg rounded-2xl border border-border bg-card p-5 text-foreground shadow-xl', children: [_jsxs("div", { className: 'mb-4 flex items-center justify-between gap-4', children: [_jsx("h2", { id: 'solidgate-checkout-title', className: 'text-lg font-semibold text-foreground', children: copy.title }), _jsx("button", { ref: closeButtonRef, type: 'button', onClick: onClose, "aria-label": copy.closeAriaLabel, className: 'rounded-md border border-border bg-background px-3 py-1.5 text-foreground hover:bg-accent', children: "\u00D7" })] }), view.state === 'collecting_email' ? (_jsxs("form", { className: 'grid gap-4', onSubmit: (event) => void commitCustomerEmail(event), children: [_jsxs("label", { className: 'grid gap-2 text-sm font-medium text-foreground', children: [copy.customerEmailLabel, _jsx("input", { type: 'email', autoComplete: 'email', inputMode: 'email', maxLength: 320, required: true, value: emailInput, onChange: (event) => {
+                                        setEmailInput(event.target.value);
+                                        setEmailError(null);
+                                    }, placeholder: copy.customerEmailPlaceholder, "aria-invalid": Boolean(emailError), className: 'w-full rounded-lg border border-border bg-background px-3 py-2 text-foreground placeholder:text-muted-foreground' })] }), emailError ? (_jsx("p", { role: 'alert', className: 'text-sm text-destructive', children: emailError })) : null, _jsx("button", { type: 'submit', disabled: emailSubmitting, className: 'w-full rounded-lg border border-border bg-accent px-4 py-2 font-medium text-foreground disabled:opacity-60', children: copy.customerEmailContinue })] })) : null, view.checkout ? (_jsx(SolidgatePaymentForm, { checkout: view.checkout, hidden: !showForm, loadingLabel: copy.loading, onMounted: () => {
                         if (view.state === 'loading') {
                             setState(Object.assign(Object.assign({}, view), { state: 'ready' }));
                         }

package/dist/providers/solidgate/services/solidgate.service.d.ts

@@ -25,9 +25,7 @@ export type PrepareSolidgateCheckoutInput = {
     funnelId?: string | null;
     funnelEndUserId: string;
     offerSetId: string;
-    funnelPlanKey?: string | null;
-    /** @deprecated Published funnels may send this during the offer-set migration window. */
-    projectBillingPlanId?: string | null;
+    funnelPlanKey: string;
     idempotencyKey: string;
     discountKeyOrProviderId?: string | null;
     returnUrl: string;

package/dist/providers/solidgate/services/solidgate.service.js

@@ -99,9 +99,17 @@ const parseStatus = (value) => {
 };
 export const prepareSolidgateCheckout = async (input) => {
     var _a;
-    return parsePreparation(await postJson('/sdk/public/payments/solidgate/checkout', Object.assign(Object.assign({ funnelId: resolveFunnelId(input.funnelId, input.runtimeConfig), funnelEndUserId: requiredString(input.funnelEndUserId, 'funnelEndUserId'), offerSetId: requiredString(input.offerSetId, 'offerSetId') }, (input.funnelPlanKey
-        ? { funnelPlanKey: requiredString(input.funnelPlanKey, 'funnelPlanKey') }
-        : { projectBillingPlanId: requiredString(input.projectBillingPlanId, 'projectBillingPlanId') })), { idempotencyKey: requiredString(input.idempotencyKey, 'idempotencyKey'), discountKeyOrProviderId: ((_a = input.discountKeyOrProviderId) === null || _a === void 0 ? void 0 : _a.trim()) || null, returnUrl: requiredString(input.returnUrl, 'returnUrl'), successUrl: requiredString(input.successUrl, 'successUrl'), failUrl: requiredString(input.failUrl, 'failUrl') }), input.runtimeConfig, input.signal));
+    return parsePreparation(await postJson('/sdk/public/payments/solidgate/checkout', {
+        funnelId: resolveFunnelId(input.funnelId, input.runtimeConfig),
+        funnelEndUserId: requiredString(input.funnelEndUserId, 'funnelEndUserId'),
+        offerSetId: requiredString(input.offerSetId, 'offerSetId'),
+        funnelPlanKey: requiredString(input.funnelPlanKey, 'funnelPlanKey'),
+        idempotencyKey: requiredString(input.idempotencyKey, 'idempotencyKey'),
+        discountKeyOrProviderId: ((_a = input.discountKeyOrProviderId) === null || _a === void 0 ? void 0 : _a.trim()) || null,
+        returnUrl: requiredString(input.returnUrl, 'returnUrl'),
+        successUrl: requiredString(input.successUrl, 'successUrl'),
+        failUrl: requiredString(input.failUrl, 'failUrl'),
+    }, input.runtimeConfig, input.signal));
 };
 export const retrieveSolidgateCheckoutStatus = async (input) => {
     const attemptId = requiredString(input.attemptId, 'attemptId');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@funnelsgrove/payments",
-  "version": "0.7.8",
+  "version": "0.7.10",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/The-Solid-Grove/funnelsgrove.git",
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@funnelsgrove/analytics": "^0.1.67",
-    "@funnelsgrove/runtime": "^0.7.18",
+    "@funnelsgrove/runtime": "^0.7.19",
     "@solidgate/react-sdk": "1.34.0",
     "@stripe/react-stripe-js": "^5.6.0",
     "@stripe/stripe-js": "^8.7.0",