@funnelsgrove/payments 0.27.0 → 0.29.0

package/dist/generated/package-version.d.ts

@@ -1 +1 @@
-export declare const PAYMENTS_PACKAGE_VERSION = "0.27.0";
+export declare const PAYMENTS_PACKAGE_VERSION = "0.29.0";

package/dist/generated/package-version.js

@@ -1,2 +1,2 @@
 // Generated by scripts/generate-package-version.mjs.
-export const PAYMENTS_PACKAGE_VERSION = "0.27.0";
+export const PAYMENTS_PACKAGE_VERSION = "0.29.0";

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

@@ -1,3 +1,3 @@
 import type { SolidgateCheckoutDialogProps } from './SolidgateCheckoutDialog.types.js';
 export type { SolidgateCheckoutDialogState, SolidgateCheckoutDialogContent, SolidgateCheckoutDialogPresentation, SolidgateCheckoutDialogProps, SolidgateCheckoutAnalyticsContext, } from './SolidgateCheckoutDialog.types.js';
-export declare function SolidgateCheckoutDialog({ open, request, customerEmail, checkoutAnalytics, content, presentation, onClose, onCustomerEmailCommit, onSuccess, onRetry, onError, onPreparationStart, onStateChange, }: SolidgateCheckoutDialogProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SolidgateCheckoutDialog({ open, layout, request, customerEmail, checkoutAnalytics, content, presentation, onClose, onCustomerEmailCommit, onSuccess, onRetry, onError, onPreparationStart, onStateChange, onPaymentPendingChange, }: SolidgateCheckoutDialogProps): import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,10 +1,11 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { completePaywallCheckout } from '@funnelsgrove/runtime';
 import { publicAnalyticsSdk } from '@funnelsgrove/analytics';
 import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
-import { pollSolidgateCheckoutStatus, prepareSolidgateCheckout, } from '../services/solidgate.service.js';
+import { pollSolidgateCheckoutStatus, prepareSolidgateCheckout, SolidgateExistingSubscriptionError, } from '../services/solidgate.service.js';
 import { trackCheckoutCanceled, trackCheckoutFailureShown, } from '../../../services/checkoutObservability.service.js';
+import { solidgateDeclineMessage } from '../services/solidgateDeclineMessage.js';
 import { SolidgateCheckoutSummary } from './SolidgateCheckoutSummary.js';
 import { SolidgatePaymentForm } from './SolidgatePaymentForm.js';
 import { solidgateCheckoutDialogStyles } from './SolidgateCheckoutDialog.styles.js';
@@ -65,7 +66,7 @@ const trackSolidgateCheckoutEvent = async (eventName, attemptId, context) => {
     }
 };
 const isAbortError = (error) => (error instanceof DOMException && error.name === 'AbortError');
-export function SolidgateCheckoutDialog({ open, request, customerEmail, checkoutAnalytics, content, presentation, onClose, onCustomerEmailCommit, onSuccess, onRetry, onError, onPreparationStart, onStateChange, }) {
+export function SolidgateCheckoutDialog({ open, layout = 'dialog', request, customerEmail, checkoutAnalytics, content, presentation, onClose, onCustomerEmailCommit, onSuccess, onRetry, onError, onPreparationStart, onStateChange, onPaymentPendingChange, }) {
     const copy = useMemo(() => (Object.assign(Object.assign({}, defaultContent), content)), [content]);
     const [view, setView] = useState(initialView);
     const [retryRequest, setRetryRequest] = useState(null);
@@ -75,6 +76,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
     const [emailError, setEmailError] = useState(null);
     const [emailSubmitting, setEmailSubmitting] = useState(false);
     const [mountedPaymentAttemptId, setMountedPaymentAttemptId] = useState(null);
+    const declinedAttemptRef = useRef(null);
     const prepareAbortRef = useRef(null);
     const preparedRequestRef = useRef(null);
     const statusAbortRef = useRef(null);
@@ -85,6 +87,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
     const copyRef = useRef(copy);
     const onCloseRef = useRef(onClose);
     const onErrorRef = useRef(onError);
+    const onPaymentPendingChangeRef = useRef(onPaymentPendingChange);
     const onStateChangeRef = useRef(onStateChange);
     const onSuccessRef = useRef(onSuccess);
     useEffect(() => {
@@ -93,8 +96,9 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
         onCloseRef.current = onClose;
         onErrorRef.current = onError;
         onStateChangeRef.current = onStateChange;
+        onPaymentPendingChangeRef.current = onPaymentPendingChange;
         onSuccessRef.current = onSuccess;
-    }, [checkoutAnalytics, copy, onClose, onError, onStateChange, onSuccess]);
+    }, [checkoutAnalytics, copy, onClose, onError, onStateChange, onSuccess, onPaymentPendingChange]);
     useEffect(() => {
         setEmailInput((customerEmail === null || customerEmail === void 0 ? void 0 : customerEmail.trim()) || '');
         setCommittedEmail(normalizedCustomerEmail);
@@ -103,6 +107,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
     const { discountKeyOrProviderId, failUrl, funnelPlanKey, paymentProfileId, providerPlanId, checkoutType, environment, funnelEndUserId, funnelId, idempotencyKey, offerSetId, returnUrl, runtimeConfig, successUrl, } = request;
     const checkoutKey = (retryRequest === null || retryRequest === void 0 ? void 0 : retryRequest.originalKey) === idempotencyKey
         ? retryRequest.key : idempotencyKey;
+    const retryAttemptId = (retryRequest === null || retryRequest === void 0 ? void 0 : retryRequest.originalKey) === idempotencyKey ? retryRequest.attemptId : request.retryAttemptId;
     const { apiBaseUrl, funnelId: runtimeFunnelId, funnelSdkPublishableKey, funnelVersionId, paymentsApiVersion, } = runtimeConfig || {};
     const hasRuntimeConfig = runtimeConfig !== undefined;
     const normalizedRequest = useMemo(() => ({
@@ -115,6 +120,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
         checkoutType: checkoutType || null,
         environment: environment || null,
         idempotencyKey: checkoutKey.trim(),
+        retryAttemptId,
         discountKeyOrProviderId: (discountKeyOrProviderId === null || discountKeyOrProviderId === void 0 ? void 0 : discountKeyOrProviderId.trim()) || null,
         returnUrl: returnUrl.trim(),
         successUrl: successUrl.trim(),
@@ -141,6 +147,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
         funnelVersionId,
         paymentsApiVersion,
         checkoutKey,
+        retryAttemptId,
         offerSetId,
         returnUrl,
         hasRuntimeConfig,
@@ -150,9 +157,11 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
     const latestRequestRef = useRef(normalizedRequest);
     latestRequestRef.current = normalizedRequest;
     const setState = useCallback((nextView) => {
-        var _a;
+        var _a, _b;
         setView(nextView);
         (_a = onStateChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onStateChangeRef, nextView.state);
+        (_b = onPaymentPendingChangeRef.current) === null || _b === void 0 ? void 0 : _b.call(onPaymentPendingChangeRef, nextView.state === 'submitting'
+            || nextView.state === 'verifying' || nextView.state === 'success' || nextView.canResumeVerification);
     }, []);
     const trackFailure = useCallback((message, failureStage, attemptId) => {
         const analytics = checkoutAnalyticsRef.current;
@@ -169,9 +178,11 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
         });
     }, []);
     const requiresEmailCommit = Boolean(onCustomerEmailCommit);
+    const startedAttemptRef = useRef(null);
+    const active = open && (layout !== 'wallet' || Boolean(normalizedCustomerEmail));
     useEffect(() => {
         var _a, _b, _c, _d, _e, _f, _g;
-        if (!open) {
+        if (!active) {
             preparedRequestRef.current = null;
             (_a = prepareAbortRef.current) === null || _a === void 0 ? void 0 : _a.abort();
             (_b = statusAbortRef.current) === null || _b === void 0 ? void 0 : _b.abort();
@@ -204,26 +215,31 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
         void prepareSolidgateCheckout(Object.assign(Object.assign({}, preparedRequest), { signal: controller.signal }))
             .then((checkout) => {
             if (!controller.signal.aborted) {
+                declinedAttemptRef.current = null;
                 setState({ state: 'ready', checkout, canResumeVerification: false });
-                void trackSolidgateCheckoutEvent('checkout_started', checkout.attemptId, checkoutAnalyticsRef.current);
+                if (layout !== 'wallet') {
+                    void trackSolidgateCheckoutEvent('checkout_started', checkout.attemptId, checkoutAnalyticsRef.current);
+                }
             }
         })
             .catch((error) => {
             var _a;
             if (!controller.signal.aborted && !isAbortError(error)) {
-                setState({ state: 'recoverable_error', checkout: null, canResumeVerification: false });
-                trackFailure(copyRef.current.error, 'checkout_session_creation');
-                (_a = onErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onErrorRef, copyRef.current.error);
+                const failureMessage = error instanceof SolidgateExistingSubscriptionError
+                    ? error.message : copyRef.current.error;
+                setState({ state: 'recoverable_error', checkout: null, canResumeVerification: false, failureMessage });
+                trackFailure(failureMessage, 'checkout_session_creation');
+                (_a = onErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onErrorRef, failureMessage, error instanceof SolidgateExistingSubscriptionError ? error.code : undefined);
             }
         });
         return () => controller.abort();
-    }, [checkoutKey, committedEmail, onPreparationStart, open, requiresEmailCommit, setState, trackFailure]);
+    }, [checkoutKey, committedEmail, layout, onPreparationStart, active, requiresEmailCommit, setState, trackFailure]);
     const paymentFormMounted = Boolean(view.checkout && mountedPaymentAttemptId === view.checkout.attemptId);
     const showPreparingLoader = view.state === 'loading'
         || (view.state === 'ready' && !paymentFormMounted);
     useEffect(() => {
         var _a;
-        if (!open) {
+        if (!open || layout === 'wallet') {
             return;
         }
         const previouslyFocused = document.activeElement instanceof HTMLElement
@@ -253,7 +269,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
             window.removeEventListener('keydown', handleKeyDown);
             previouslyFocused === null || previouslyFocused === void 0 ? void 0 : previouslyFocused.focus();
         };
-    }, [open, showPreparingLoader, view.checkout]);
+    }, [layout, open, showPreparingLoader, view.checkout]);
     useEffect(() => () => {
         var _a, _b;
         (_a = prepareAbortRef.current) === null || _a === void 0 ? void 0 : _a.abort();
@@ -296,9 +312,11 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
                 trackFailure(copyRef.current.expired, 'payment_expired', checkout.attemptId);
             }
             else if (result.status === 'failed') {
-                setState({ state: 'recoverable_error', checkout, canResumeVerification: false });
-                trackFailure(copyRef.current.error, 'payment_failed', checkout.attemptId);
-                (_c = onErrorRef.current) === null || _c === void 0 ? void 0 : _c.call(onErrorRef, copyRef.current.error);
+                declinedAttemptRef.current = checkout.attemptId;
+                const failureMessage = solidgateDeclineMessage(result.failureCode);
+                setState({ state: 'recoverable_error', checkout, canResumeVerification: false, failureMessage });
+                trackFailure(failureMessage, 'payment_failed', checkout.attemptId);
+                (_c = onErrorRef.current) === null || _c === void 0 ? void 0 : _c.call(onErrorRef, failureMessage);
             }
             else if (result.status === 'requires_payment') {
                 setState({ state: 'ready', checkout, canResumeVerification: false });
@@ -356,7 +374,7 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
         }
         onCloseRef.current();
     };
-    if (!open) {
+    if (!active) {
         return null;
     }
     const showForm = view.state === 'ready'
@@ -372,13 +390,56 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
                     : view.state === 'expired'
                         ? copy.expired
                         : view.state === 'recoverable_error'
-                            ? copy.error
+                            ? view.failureMessage || copy.error
                             : null;
     const presentationStyle = presentation
         ? {
             '--solidgate-checkout-theme-color': presentation.themeColor,
         }
         : undefined;
+    const recoveryActions = (_jsxs(_Fragment, { children: [view.canResumeVerification ? (_jsx("button", { type: 'button', onClick: () => void verifyCanonicalStatus(), className: 'solidgate-checkout-action solidgate-checkout-action--spaced', children: copy.resumeVerification })) : null, (view.state === 'recoverable_error' || view.state === 'expired') && !view.canResumeVerification ? (_jsx("button", { type: 'button', onClick: () => {
+                    var _a;
+                    const source = checkoutType === 'subscription'
+                        ? declinedAttemptRef.current || (retryAttemptId ? ((_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId) || retryAttemptId : null)
+                        : null;
+                    if (!source && onRetry) {
+                        onRetry();
+                        return;
+                    }
+                    preparedRequestRef.current = null;
+                    setRetryRequest({
+                        originalKey: idempotencyKey,
+                        key: crypto.randomUUID(),
+                        attemptId: source,
+                    });
+                }, className: 'solidgate-checkout-action solidgate-checkout-action--spaced', children: copy.retry })) : null] }));
+    const paymentForm = view.checkout ? (_jsx(SolidgatePaymentForm, { walletOnly: layout === 'wallet', secureLabel: presentation === null || presentation === void 0 ? void 0 : presentation.secureLabel, cardLabel: presentation === null || presentation === void 0 ? void 0 : presentation.cardLabel, paymentMethodLabel: presentation === null || presentation === void 0 ? void 0 : presentation.paymentMethodLabel, buttonColor: (presentation === null || presentation === void 0 ? void 0 : presentation.buttonColor) || '#3f51b5', cardSubmitLabel: (presentation === null || presentation === void 0 ? void 0 : presentation.cardSubmitLabel) || 'Pay securely', checkout: view.checkout, hidden: !showForm, loadingLabel: copy.loading, onMounted: () => {
+            var _a;
+            setMountedPaymentAttemptId(((_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId) || null);
+        }, onSubmit: () => {
+            var _a, _b, _c;
+            if (paymentInfoAttemptRef.current !== ((_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId)) {
+                paymentInfoAttemptRef.current = ((_b = view.checkout) === null || _b === void 0 ? void 0 : _b.attemptId) || null;
+                void trackSolidgateCheckoutEvent('add_payment_info', ((_c = view.checkout) === null || _c === void 0 ? void 0 : _c.attemptId) || '', checkoutAnalyticsRef.current);
+            }
+            setState(Object.assign(Object.assign({}, view), { state: 'submitting' }));
+        }, onVerify: () => void verifyCanonicalStatus(), onError: () => {
+            var _a, _b;
+            setState(Object.assign(Object.assign({}, view), { state: 'recoverable_error', canResumeVerification: false }));
+            trackFailure(copyRef.current.error, 'payment_form', (_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId);
+            (_b = onErrorRef.current) === null || _b === void 0 ? void 0 : _b.call(onErrorRef, copyRef.current.error);
+        } }, view.checkout.attemptId)) : null;
+    if (layout === 'wallet') {
+        return (_jsxs("div", { className: 'solidgate-inline-wallet', onClick: (event) => {
+                var _a;
+                const attemptId = (_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId;
+                if (attemptId && startedAttemptRef.current !== attemptId
+                    && event.target instanceof Element && event.target.closest('[data-solidgate-wallet]')) {
+                    startedAttemptRef.current = attemptId;
+                    void trackSolidgateCheckoutEvent('checkout_started', attemptId, checkoutAnalyticsRef.current);
+                }
+            }, children: [paymentForm, statusMessage && !showPreparingLoader ? _jsx("p", { role: 'status', children: statusMessage }) : null, recoveryActions, _jsx("style", { children: solidgateCheckoutDialogStyles })] }));
+    }
     return (_jsxs(_Fragment, { children: [_jsxs("div", { className: `solidgate-checkout-overlay${presentation ? ' is-branded' : ''}`, style: presentationStyle, children: [showPreparingLoader ? (_jsxs("div", { className: 'solidgate-checkout-loader', role: 'status', "aria-live": 'polite', children: [_jsx("span", { className: 'solidgate-checkout-spinner', "aria-hidden": 'true' }), _jsx("span", { className: 'solidgate-checkout-visually-hidden', children: copy.loading })] })) : null, view.state !== 'loading' || view.checkout ? (_jsxs("div", { role: 'dialog', "aria-modal": 'true', "aria-hidden": showPreparingLoader || undefined, "aria-labelledby": 'solidgate-checkout-title', "data-checkout-state": view.state, className: [
                             'solidgate-checkout-dialog',
                             showPreparingLoader ? 'is-preparing' : '',
@@ -386,26 +447,5 @@ export function SolidgateCheckoutDialog({ open, request, customerEmail, checkout
                         ].filter(Boolean).join(' '), children: [_jsxs("div", { className: 'solidgate-checkout-header', children: [_jsx("button", { ref: closeButtonRef, type: 'button', onClick: handleClose, "aria-label": copy.closeAriaLabel, className: 'solidgate-checkout-close', children: _jsx("span", { "aria-hidden": 'true' }) }), _jsx("h2", { id: 'solidgate-checkout-title', className: 'solidgate-checkout-title', children: (presentation === null || presentation === void 0 ? void 0 : presentation.title) || copy.title })] }), presentation ? _jsx(SolidgateCheckoutSummary, { presentation: presentation }) : null, view.state === 'collecting_email' ? (_jsxs("form", { className: 'solidgate-checkout-email-form', onSubmit: (event) => void commitCustomerEmail(event), children: [_jsxs("label", { className: 'solidgate-checkout-email-label', 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: 'solidgate-checkout-email-input' })] }), emailError ? (_jsx("p", { role: 'alert', className: 'solidgate-checkout-alert', children: emailError })) : null, _jsx("button", { type: 'submit', disabled: emailSubmitting, className: 'solidgate-checkout-action', children: copy.customerEmailContinue })] })) : null, view.checkout ? (_jsx(SolidgatePaymentForm, { buttonColor: (presentation === null || presentation === void 0 ? void 0 : presentation.buttonColor) || '#3f51b5', cardSubmitLabel: (presentation === null || presentation === void 0 ? void 0 : presentation.cardSubmitLabel) || 'Pay securely', checkout: view.checkout, hidden: !showForm, loadingLabel: copy.loading, onMounted: () => {
-                                    var _a;
-                                    setMountedPaymentAttemptId(((_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId) || null);
-                                }, onSubmit: () => {
-                                    var _a, _b, _c;
-                                    if (paymentInfoAttemptRef.current !== ((_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId)) {
-                                        paymentInfoAttemptRef.current = ((_b = view.checkout) === null || _b === void 0 ? void 0 : _b.attemptId) || null;
-                                        void trackSolidgateCheckoutEvent('add_payment_info', ((_c = view.checkout) === null || _c === void 0 ? void 0 : _c.attemptId) || '', checkoutAnalyticsRef.current);
-                                    }
-                                    setState(Object.assign(Object.assign({}, view), { state: 'submitting' }));
-                                }, onVerify: () => void verifyCanonicalStatus(), onError: () => {
-                                    var _a, _b;
-                                    setState(Object.assign(Object.assign({}, view), { state: 'recoverable_error', canResumeVerification: false }));
-                                    trackFailure(copyRef.current.error, 'payment_form', (_a = view.checkout) === null || _a === void 0 ? void 0 : _a.attemptId);
-                                    (_b = onErrorRef.current) === null || _b === void 0 ? void 0 : _b.call(onErrorRef, copyRef.current.error);
-                                } }, view.checkout.attemptId)) : null, presentation && view.checkout && showForm ? (_jsx("p", { className: 'solidgate-checkout-secure', children: presentation.secureLabel })) : null, statusMessage && view.state !== 'ready' ? (_jsx("div", { className: 'solidgate-checkout-status', children: _jsx("p", { role: 'status', "aria-live": 'polite', children: statusMessage }) })) : null, view.canResumeVerification ? (_jsx("button", { type: 'button', onClick: () => void verifyCanonicalStatus(), className: 'solidgate-checkout-action solidgate-checkout-action--spaced', children: copy.resumeVerification })) : null, (view.state === 'recoverable_error' || view.state === 'expired') && !view.canResumeVerification ? (_jsx("button", { type: 'button', onClick: onRetry || (() => {
-                                    preparedRequestRef.current = null;
-                                    setRetryRequest({
-                                        originalKey: idempotencyKey,
-                                        key: crypto.randomUUID(),
-                                    });
-                                }), className: 'solidgate-checkout-action solidgate-checkout-action--spaced', children: copy.retry })) : null] })) : null] }), _jsx("style", { children: solidgateCheckoutDialogStyles })] }));
+                                                }, placeholder: copy.customerEmailPlaceholder, "aria-invalid": Boolean(emailError), className: 'solidgate-checkout-email-input' })] }), emailError ? (_jsx("p", { role: 'alert', className: 'solidgate-checkout-alert', children: emailError })) : null, _jsx("button", { type: 'submit', disabled: emailSubmitting, className: 'solidgate-checkout-action', children: copy.customerEmailContinue })] })) : null, paymentForm, statusMessage && view.state !== 'ready' ? (_jsx("div", { className: 'solidgate-checkout-status', children: _jsx("p", { role: 'status', "aria-live": 'polite', children: statusMessage }) })) : null, recoveryActions] })) : null] }), _jsx("style", { children: solidgateCheckoutDialogStyles })] }));
 }

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

@@ -1 +1 @@
-export declare const solidgateCheckoutDialogStyles = "\n.solidgate-checkout-overlay {\n  position: fixed;\n  inset: 0;\n  z-index: 100;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  padding: 16px;\n  background: rgb(17 24 39 / 60%);\n  backdrop-filter: blur(4px);\n}\n\n.solidgate-checkout-overlay.is-branded {\n  z-index: 110;\n  align-items: stretch;\n  padding: 0;\n  background: #fff;\n  backdrop-filter: none;\n}\n\n.solidgate-checkout-dialog {\n  box-sizing: border-box;\n  width: min(100%, 512px);\n  max-height: calc(100svh - 32px);\n  overflow-y: auto;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 16px;\n  background: var(--color-surface, #fff);\n  padding: 20px;\n  color: var(--color-text, #111827);\n  box-shadow: 0 24px 80px rgb(17 24 39 / 22%);\n}\n\n.solidgate-checkout-dialog.is-branded {\n  width: min(100%, 430px);\n  height: 100svh;\n  max-height: 100svh;\n  border: 0;\n  border-radius: 0;\n  background: #fff;\n  padding: 0 17px 28px;\n  color: #303136;\n  box-shadow: none;\n  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n}\n\n.solidgate-checkout-dialog.is-preparing {\n  position: absolute;\n  opacity: 0;\n  pointer-events: none;\n}\n\n.solidgate-checkout-loader {\n  display: grid;\n  place-items: center;\n}\n\n.solidgate-checkout-spinner {\n  box-sizing: border-box;\n  width: 44px;\n  height: 44px;\n  border: 4px solid var(--color-border, #d1d5db);\n  border-top-color: var(--color-primary, #22c55e);\n  border-radius: 50%;\n  animation: solidgate-checkout-spin 720ms linear infinite;\n}\n\n.solidgate-checkout-visually-hidden {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  white-space: nowrap;\n}\n\n@keyframes solidgate-checkout-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .solidgate-checkout-spinner {\n    animation-duration: 1.6s;\n  }\n}\n\n.solidgate-checkout-header {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n  margin-bottom: 16px;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-header {\n  min-height: 70px;\n  margin: 0 -17px;\n  padding: 0 56px;\n}\n\n.solidgate-checkout-title {\n  margin: 0;\n  color: var(--color-text, #111827);\n  font-size: 18px;\n  font-weight: 600;\n  line-height: 1.3;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-title {\n  color: #020203;\n  font-size: 24px;\n  font-weight: 900;\n  line-height: 1.15;\n  text-align: center;\n}\n\n.solidgate-checkout-close {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  width: 36px;\n  height: 36px;\n  flex: none;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 8px;\n  background: var(--color-bg, #f9fafb);\n  color: var(--color-text, #111827);\n  font-size: 22px;\n  transform: translateY(-50%);\n  cursor: pointer;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-close {\n  left: 16px;\n  width: 40px;\n  height: 40px;\n  border: 0;\n  border-radius: 999px;\n  background: #f2f2f3;\n  color: #aaa;\n}\n\n.solidgate-checkout-close span,\n.solidgate-checkout-close span::after {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  width: 22px;\n  height: 3px;\n  border-radius: 999px;\n  background: currentColor;\n  content: '';\n}\n\n.solidgate-checkout-close span {\n  transform: translate(-50%, -50%) rotate(45deg);\n}\n\n.solidgate-checkout-close span::after {\n  transform: translate(-50%, -50%) rotate(90deg);\n}\n\n.solidgate-checkout-close:hover {\n  background: var(--color-accent-soft, #eef2ff);\n}\n\n.solidgate-checkout-summary {\n  color: #303136;\n}\n\n.solidgate-checkout-countdown {\n  min-height: 37px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  border-radius: 12px;\n  background: color-mix(in srgb, var(--solidgate-checkout-theme-color) 10%, #fff);\n  color: var(--solidgate-checkout-theme-color);\n  font-size: 16px;\n  font-weight: 900;\n  text-align: center;\n}\n\n.solidgate-checkout-satisfaction {\n  margin: 17px 0 21px;\n  color: #2f3034;\n  font-size: 19px;\n  font-weight: 800;\n  line-height: 1.15;\n  text-align: center;\n}\n\n.solidgate-checkout-satisfaction strong {\n  color: var(--solidgate-checkout-theme-color);\n}\n\n.solidgate-checkout-price-stack {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.solidgate-checkout-price-row,\n.solidgate-checkout-promo,\n.solidgate-checkout-total {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n}\n\n.solidgate-checkout-price-row {\n  font-size: 17px;\n}\n\n.solidgate-checkout-price-row.is-muted {\n  color: #9d9d9f;\n  font-weight: 500;\n}\n\n.solidgate-checkout-strike {\n  text-decoration: line-through 2px;\n}\n\n.solidgate-checkout-price-row.is-discount {\n  color: #040508;\n  font-weight: 900;\n}\n\n.solidgate-checkout-price-row.is-discount strong:last-child {\n  color: #ff2544;\n}\n\n.solidgate-checkout-promo {\n  min-height: 42px;\n  border-radius: 13px;\n  background: #f0f0f0;\n  padding: 0 14px;\n  color: #8d8d90;\n  font-size: 16px;\n}\n\n.solidgate-checkout-promo strong {\n  color: #050609;\n  font-weight: 900;\n}\n\n.solidgate-checkout-total {\n  min-height: 76px;\n  margin-top: 20px;\n  border-top: 1px solid #dedede;\n  font-size: 23px;\n  font-weight: 800;\n}\n\n.solidgate-checkout-total.is-plain {\n  margin-top: 0;\n}\n\n.solidgate-checkout-total strong {\n  font-size: 25px;\n  font-weight: 900;\n}\n\n.solidgate-checkout-saved {\n  width: fit-content;\n  min-height: 36px;\n  display: flex;\n  align-items: center;\n  gap: 7px;\n  margin: 0 auto 12px;\n  border-radius: 999px;\n  background: #fff3cf;\n  padding: 0 13px;\n  color: #2e3034;\n  font-size: 14px;\n  font-weight: 800;\n}\n\n.solidgate-checkout-email-form,\n.solidgate-checkout-email-label,\n.solidgate-checkout-wallets {\n  display: grid;\n}\n\n.solidgate-checkout-email-form {\n  gap: 16px;\n}\n\n.solidgate-checkout-email-label {\n  gap: 8px;\n  color: var(--color-text, #111827);\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.solidgate-checkout-email-input {\n  box-sizing: border-box;\n  width: 100%;\n  min-height: 44px;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 8px;\n  background: var(--color-bg, #fff);\n  padding: 8px 12px;\n  color: var(--color-text, #111827);\n  font: inherit;\n}\n\n.solidgate-checkout-email-input::placeholder,\n.solidgate-checkout-status,\n.solidgate-checkout-status-text {\n  color: var(--color-text-muted, #6b7280);\n}\n\n.solidgate-checkout-email-input:focus-visible,\n.solidgate-checkout-close:focus-visible,\n.solidgate-checkout-action:focus-visible {\n  outline: 2px solid var(--color-accent, #3f51b5);\n  outline-offset: 2px;\n}\n\n.solidgate-checkout-alert {\n  margin: 0;\n  color: var(--color-danger, #b91c1c);\n  font-size: 14px;\n}\n\n.solidgate-checkout-action {\n  box-sizing: border-box;\n  width: 100%;\n  min-height: 44px;\n  border: 1px solid var(--color-accent, #3f51b5);\n  border-radius: 8px;\n  background: var(--color-accent, #3f51b5);\n  padding: 8px 16px;\n  color: var(--color-primary-text, #fff);\n  font: inherit;\n  font-weight: 600;\n  cursor: pointer;\n}\n\n.solidgate-checkout-action:disabled {\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.solidgate-checkout-action--spaced {\n  margin-top: 16px;\n}\n\n.solidgate-checkout-wallets {\n  gap: 12px;\n  margin-bottom: 12px;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-wallets {\n  margin-top: 4px;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-wallets > div:not(:empty) {\n  min-height: 48px;\n}\n\n.solidgate-checkout-secure {\n  width: fit-content;\n  margin: 14px auto 0;\n  border-radius: 999px;\n  background: #edfff4;\n  padding: 8px 14px;\n  color: #2b2d31;\n  font-size: 13px;\n  font-weight: 700;\n}\n\n.solidgate-checkout-payment[hidden] {\n  display: none;\n}\n\n.solidgate-checkout-status {\n  margin-top: 12px;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 12px;\n  background: var(--color-bg, #f9fafb);\n  padding: 16px;\n  font-size: 14px;\n}\n\n.solidgate-checkout-status p,\n.solidgate-checkout-status-text {\n  margin: 0;\n}\n";
+export declare const solidgateCheckoutDialogStyles = "\n.solidgate-checkout-overlay {\n  position: fixed;\n  inset: 0;\n  z-index: 100;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  padding: 16px;\n  background: rgb(17 24 39 / 60%);\n  backdrop-filter: blur(4px);\n}\n\n.solidgate-checkout-overlay.is-branded {\n  z-index: 110;\n  align-items: stretch;\n  padding: 0;\n  background: #fff;\n  backdrop-filter: none;\n}\n\n.solidgate-checkout-dialog {\n  box-sizing: border-box;\n  width: min(100%, 512px);\n  max-height: calc(100svh - 32px);\n  overflow-y: auto;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 16px;\n  background: var(--color-surface, #fff);\n  padding: 20px;\n  color: var(--color-text, #111827);\n  box-shadow: 0 24px 80px rgb(17 24 39 / 22%);\n}\n\n.solidgate-checkout-dialog.is-branded {\n  width: min(100%, 430px);\n  height: 100svh;\n  max-height: 100svh;\n  border: 0;\n  border-radius: 0;\n  background: #fff;\n  padding: 0 17px 28px;\n  color: #303136;\n  box-shadow: none;\n  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n}\n\n.solidgate-checkout-dialog.is-preparing {\n  position: absolute;\n  opacity: 0;\n  pointer-events: none;\n}\n\n.solidgate-checkout-loader {\n  display: grid;\n  place-items: center;\n}\n\n.solidgate-checkout-spinner {\n  box-sizing: border-box;\n  width: 44px;\n  height: 44px;\n  border: 4px solid var(--color-border, #d1d5db);\n  border-top-color: var(--color-primary, #22c55e);\n  border-radius: 50%;\n  animation: solidgate-checkout-spin 720ms linear infinite;\n}\n\n.solidgate-checkout-visually-hidden {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  white-space: nowrap;\n}\n\n@keyframes solidgate-checkout-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .solidgate-checkout-spinner {\n    animation-duration: 1.6s;\n  }\n}\n\n.solidgate-checkout-header {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n  margin-bottom: 16px;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-header {\n  min-height: 70px;\n  margin: 0 -17px;\n  padding: 0 56px;\n}\n\n.solidgate-checkout-title {\n  margin: 0;\n  color: var(--color-text, #111827);\n  font-size: 18px;\n  font-weight: 600;\n  line-height: 1.3;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-title {\n  color: #020203;\n  font-size: 24px;\n  font-weight: 900;\n  line-height: 1.15;\n  text-align: center;\n}\n\n.solidgate-checkout-close {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  width: 36px;\n  height: 36px;\n  flex: none;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 8px;\n  background: var(--color-bg, #f9fafb);\n  color: var(--color-text, #111827);\n  font-size: 22px;\n  transform: translateY(-50%);\n  cursor: pointer;\n}\n\n.solidgate-checkout-dialog.is-branded .solidgate-checkout-close {\n  left: 16px;\n  width: 40px;\n  height: 40px;\n  border: 0;\n  border-radius: 999px;\n  background: #f2f2f3;\n  color: #aaa;\n}\n\n.solidgate-checkout-close span,\n.solidgate-checkout-close span::after {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  width: 22px;\n  height: 3px;\n  border-radius: 999px;\n  background: currentColor;\n  content: '';\n}\n\n.solidgate-checkout-close span {\n  transform: translate(-50%, -50%) rotate(45deg);\n}\n\n.solidgate-checkout-close span::after {\n  transform: translate(-50%, -50%) rotate(90deg);\n}\n\n.solidgate-checkout-close:hover {\n  background: var(--color-accent-soft, #eef2ff);\n}\n\n.solidgate-checkout-summary {\n  color: #303136;\n}\n\n.solidgate-checkout-countdown {\n  min-height: 37px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  border-radius: 12px;\n  background: color-mix(in srgb, var(--solidgate-checkout-theme-color) 10%, #fff);\n  color: var(--solidgate-checkout-theme-color);\n  font-size: 16px;\n  font-weight: 900;\n  text-align: center;\n}\n\n.solidgate-checkout-satisfaction {\n  margin: 17px 0 21px;\n  color: #2f3034;\n  font-size: 19px;\n  font-weight: 800;\n  line-height: 1.15;\n  text-align: center;\n}\n\n.solidgate-checkout-satisfaction strong {\n  color: var(--solidgate-checkout-theme-color);\n}\n\n.solidgate-checkout-price-stack {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.solidgate-checkout-price-row,\n.solidgate-checkout-promo,\n.solidgate-checkout-total {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n}\n\n.solidgate-checkout-price-row {\n  font-size: 17px;\n}\n\n.solidgate-checkout-price-row.is-muted {\n  color: #9d9d9f;\n  font-weight: 500;\n}\n\n.solidgate-checkout-strike {\n  text-decoration: line-through 2px;\n}\n\n.solidgate-checkout-price-row.is-discount {\n  color: #040508;\n  font-weight: 900;\n}\n\n.solidgate-checkout-price-row.is-discount strong:last-child {\n  color: #ff2544;\n}\n\n.solidgate-checkout-promo {\n  min-height: 42px;\n  border-radius: 13px;\n  background: #f0f0f0;\n  padding: 0 14px;\n  color: #8d8d90;\n  font-size: 16px;\n}\n\n.solidgate-checkout-promo strong {\n  color: #050609;\n  font-weight: 900;\n}\n\n.solidgate-checkout-total {\n  min-height: 76px;\n  margin-top: 20px;\n  border-top: 1px solid #dedede;\n  font-size: 23px;\n  font-weight: 800;\n}\n\n.solidgate-checkout-total.is-plain {\n  margin-top: 0;\n}\n\n.solidgate-checkout-total strong {\n  font-size: 25px;\n  font-weight: 900;\n}\n\n.solidgate-checkout-total strong {\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n}\n.solidgate-checkout-total svg {\n  width: 25px;\n  height: 25px;\n  fill: none;\n  stroke: currentColor;\n  stroke-width: 2;\n  stroke-linejoin: round;\n}\n.solidgate-checkout-saved {\n  width: fit-content;\n  min-height: 36px;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  margin: -8px 0 9px auto;\n  border-radius: 12px;\n  background: #ffdce3;\n  padding: 0 14px;\n  color: #ff2544;\n  font-size: 14px;\n  font-weight: 900;\n  line-height: 1.1;\n}\n\n.solidgate-checkout-email-form,\n.solidgate-checkout-email-label,\n.solidgate-checkout-wallets {\n  display: grid;\n}\n\n.solidgate-checkout-email-form {\n  gap: 16px;\n}\n\n.solidgate-checkout-email-label {\n  gap: 8px;\n  color: var(--color-text, #111827);\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.solidgate-checkout-email-input {\n  box-sizing: border-box;\n  width: 100%;\n  min-height: 44px;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 8px;\n  background: var(--color-bg, #fff);\n  padding: 8px 12px;\n  color: var(--color-text, #111827);\n  font: inherit;\n}\n\n.solidgate-checkout-email-input::placeholder,\n.solidgate-checkout-status,\n.solidgate-checkout-status-text {\n  color: var(--color-text-muted, #6b7280);\n}\n\n.solidgate-checkout-email-input:focus-visible,\n.solidgate-checkout-close:focus-visible,\n.solidgate-checkout-action:focus-visible {\n  outline: 2px solid var(--color-accent, #3f51b5);\n  outline-offset: 2px;\n}\n\n.solidgate-checkout-alert {\n  margin: 0;\n  color: var(--color-danger, #b91c1c);\n  font-size: 14px;\n}\n\n.solidgate-checkout-action {\n  box-sizing: border-box;\n  width: 100%;\n  min-height: 44px;\n  border: 1px solid var(--color-accent, #3f51b5);\n  border-radius: 8px;\n  background: var(--color-accent, #3f51b5);\n  padding: 8px 16px;\n  color: var(--color-primary-text, #fff);\n  font: inherit;\n  font-weight: 600;\n  cursor: pointer;\n}\n\n.solidgate-checkout-action:disabled {\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.solidgate-checkout-action--spaced {\n  margin-top: 16px;\n}\n\n.solidgate-checkout-wallets {\n  gap: 12px;\n}\n.solidgate-checkout-wallets > div:empty,\n.solidgate-checkout-wallets:not(:has(> div:not(:empty))) { display: none; }\n.solidgate-checkout-wallets > div:not(:empty) {\n  width: 100%;\n  height: 54px;\n}\n.solidgate-checkout-wallets apple-pay-button {\n  --apple-pay-button-width: 100%;\n  --apple-pay-button-height: 54px;\n  --apple-pay-button-border-radius: 0;\n  width: 100%;\n  height: 54px;\n}\n.solidgate-checkout-payment.is-branded {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  margin: 0 -17px;\n  padding: 9px 17px 32px;\n  background: #f2f2f3;\n}\n.solidgate-checkout-methods {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);\n  gap: 42px;\n}\n.solidgate-checkout-method {\n  min-height: 74px;\n  border: 2px solid #e6e7eb;\n  border-radius: 13px;\n  background: #fff;\n  color: #303136;\n  padding: 9px 8px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  font: inherit;\n  cursor: pointer;\n}\n.solidgate-checkout-method[aria-selected='true'] { border: 3px solid #050609; }\n.solidgate-checkout-method:focus-visible { outline: 2px solid var(--solidgate-checkout-theme-color, #3f51b5); outline-offset: 2px; }\n.solidgate-checkout-method strong { font-size: 20px; font-weight: 800; line-height: 1.1; }\n.solidgate-checkout-tab-wallet { width: 58px; height: 36px; }\n.solidgate-checkout-tab-brands { display: flex; align-items: center; gap: 4px; }\n.solidgate-checkout-tab-brand { width: 24px; height: 15px; }\n.solidgate-checkout-tab-wallet svg, .solidgate-checkout-tab-brand svg { width: 100%; height: 100%; }\n.solidgate-checkout-secure {\n  min-height: 47px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 9px;\n  margin: 0;\n  border-radius: 12px;\n  background: #dcffd0;\n  color: #207733;\n  font-size: 18px;\n  font-weight: 800;\n}\n.solidgate-checkout-secure svg { width: 23px; height: 23px; }\n.solidgate-checkout-payment.is-branded .solidgate-checkout-card { padding: 10px 14px 0; }\n.solidgate-checkout-secure.is-card { width: fit-content; margin: 14px auto 0; padding: 0 14px; }\n.solidgate-sdk-card-container iframe { border: 0; }\n.solidgate-checkout-payment[hidden],\n.solidgate-checkout-wallets[hidden],\n.solidgate-checkout-card[hidden] { display: none; }\n.solidgate-inline-wallet { width: 100%; }\n.solidgate-inline-wallet .solidgate-checkout-wallets:has(> div:not(:empty)) { margin-bottom: 12px; }\n\n.solidgate-checkout-status {\n  margin-top: 12px;\n  border: 1px solid var(--color-border, #d1d5db);\n  border-radius: 12px;\n  background: var(--color-bg, #f9fafb);\n  padding: 16px;\n  font-size: 14px;\n}\n\n.solidgate-checkout-status p,\n.solidgate-checkout-status-text {\n  margin: 0;\n}\n";

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

@@ -270,19 +270,35 @@ export const solidgateCheckoutDialogStyles = `
   font-weight: 900;
 }
 
+.solidgate-checkout-total strong {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+}
+.solidgate-checkout-total svg {
+  width: 25px;
+  height: 25px;
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 2;
+  stroke-linejoin: round;
+}
 .solidgate-checkout-saved {
   width: fit-content;
   min-height: 36px;
+  box-sizing: border-box;
   display: flex;
   align-items: center;
-  gap: 7px;
-  margin: 0 auto 12px;
-  border-radius: 999px;
-  background: #fff3cf;
-  padding: 0 13px;
-  color: #2e3034;
+  justify-content: center;
+  gap: 8px;
+  margin: -8px 0 9px auto;
+  border-radius: 12px;
+  background: #ffdce3;
+  padding: 0 14px;
+  color: #ff2544;
   font-size: 14px;
-  font-weight: 800;
+  font-weight: 900;
+  line-height: 1.1;
 }
 
 .solidgate-checkout-email-form,
@@ -358,31 +374,77 @@ export const solidgateCheckoutDialogStyles = `
 
 .solidgate-checkout-wallets {
   gap: 12px;
-  margin-bottom: 12px;
 }
-
-.solidgate-checkout-dialog.is-branded .solidgate-checkout-wallets {
-  margin-top: 4px;
+.solidgate-checkout-wallets > div:empty,
+.solidgate-checkout-wallets:not(:has(> div:not(:empty))) { display: none; }
+.solidgate-checkout-wallets > div:not(:empty) {
+  width: 100%;
+  height: 54px;
 }
-
-.solidgate-checkout-dialog.is-branded .solidgate-checkout-wallets > div:not(:empty) {
-  min-height: 48px;
+.solidgate-checkout-wallets apple-pay-button {
+  --apple-pay-button-width: 100%;
+  --apple-pay-button-height: 54px;
+  --apple-pay-button-border-radius: 0;
+  width: 100%;
+  height: 54px;
 }
-
-.solidgate-checkout-secure {
-  width: fit-content;
-  margin: 14px auto 0;
-  border-radius: 999px;
-  background: #edfff4;
-  padding: 8px 14px;
-  color: #2b2d31;
-  font-size: 13px;
-  font-weight: 700;
+.solidgate-checkout-payment.is-branded {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin: 0 -17px;
+  padding: 9px 17px 32px;
+  background: #f2f2f3;
 }
-
-.solidgate-checkout-payment[hidden] {
-  display: none;
+.solidgate-checkout-methods {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  gap: 42px;
+}
+.solidgate-checkout-method {
+  min-height: 74px;
+  border: 2px solid #e6e7eb;
+  border-radius: 13px;
+  background: #fff;
+  color: #303136;
+  padding: 9px 8px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  font: inherit;
+  cursor: pointer;
+}
+.solidgate-checkout-method[aria-selected='true'] { border: 3px solid #050609; }
+.solidgate-checkout-method:focus-visible { outline: 2px solid var(--solidgate-checkout-theme-color, #3f51b5); outline-offset: 2px; }
+.solidgate-checkout-method strong { font-size: 20px; font-weight: 800; line-height: 1.1; }
+.solidgate-checkout-tab-wallet { width: 58px; height: 36px; }
+.solidgate-checkout-tab-brands { display: flex; align-items: center; gap: 4px; }
+.solidgate-checkout-tab-brand { width: 24px; height: 15px; }
+.solidgate-checkout-tab-wallet svg, .solidgate-checkout-tab-brand svg { width: 100%; height: 100%; }
+.solidgate-checkout-secure {
+  min-height: 47px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 9px;
+  margin: 0;
+  border-radius: 12px;
+  background: #dcffd0;
+  color: #207733;
+  font-size: 18px;
+  font-weight: 800;
 }
+.solidgate-checkout-secure svg { width: 23px; height: 23px; }
+.solidgate-checkout-payment.is-branded .solidgate-checkout-card { padding: 10px 14px 0; }
+.solidgate-checkout-secure.is-card { width: fit-content; margin: 14px auto 0; padding: 0 14px; }
+.solidgate-sdk-card-container iframe { border: 0; }
+.solidgate-checkout-payment[hidden],
+.solidgate-checkout-wallets[hidden],
+.solidgate-checkout-card[hidden] { display: none; }
+.solidgate-inline-wallet { width: 100%; }
+.solidgate-inline-wallet .solidgate-checkout-wallets:has(> div:not(:empty)) { margin-bottom: 12px; }
 
 .solidgate-checkout-status {
   margin-top: 12px;

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

@@ -22,6 +22,8 @@ export type SolidgateCheckoutDialogContent = {
 export type SolidgateCheckoutDialogPresentation = {
     buttonColor: string;
     cardSubmitLabel: string;
+    cardLabel?: string;
+    paymentMethodLabel?: string;
     countdownLabel: string;
     discountAmountLabel: string;
     discountLabel: string;
@@ -43,6 +45,8 @@ export type SolidgateCheckoutDialogPresentation = {
 };
 export type SolidgateCheckoutDialogProps = {
     open: boolean;
+    /** Wallet-only paywall placement; mount only one Solidgate surface at a time. */
+    layout?: 'dialog' | 'wallet';
     request: Omit<PrepareSolidgateCheckoutInput, 'signal'>;
     customerEmail?: string | null;
     checkoutAnalytics?: SolidgateCheckoutAnalyticsContext | null;
@@ -52,8 +56,10 @@ export type SolidgateCheckoutDialogProps = {
     onCustomerEmailCommit?: (email: string) => Promise<string>;
     onSuccess?: (checkout: SolidgateCheckoutPreparation) => void | Promise<void>;
     onRetry?: () => void;
-    onError?: (message: string) => void;
+    onError?: (message: string, code?: 'already_subscribed_to_product') => void;
     onPreparationStart?: () => void;
+    /** True while a submitted payment still needs verification (including resumable errors). */
+    onPaymentPendingChange?: (pending: boolean) => void;
     onStateChange?: (state: SolidgateCheckoutDialogState) => void;
 };
 export type SolidgateCheckoutAnalyticsContext = {

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

@@ -11,5 +11,5 @@ export function SolidgateCheckoutSummary({ presentation }) {
     const showPromo = Boolean((presentation === null || presentation === void 0 ? void 0 : presentation.promoActive) &&
         presentation.discountPercent > 0 &&
         presentation.promoCode.trim());
-    return (_jsxs("section", { className: 'solidgate-checkout-summary', children: [showPromo ? (_jsxs("p", { className: 'solidgate-checkout-countdown', children: [presentation.discountPercent, "% ", presentation.countdownLabel, ' ', formatCountdown(presentation.remainingSeconds), " min"] })) : null, _jsxs("p", { className: 'solidgate-checkout-satisfaction', children: [_jsx("strong", { children: presentation.satisfactionPercent }), ' ', presentation.satisfactionLabel] }), showPromo ? (_jsxs("div", { className: 'solidgate-checkout-price-stack', children: [_jsxs("div", { className: 'solidgate-checkout-price-row is-muted', children: [_jsx("span", { children: presentation.originalPriceLabel }), _jsx("span", { className: 'solidgate-checkout-strike', children: presentation.originalPriceValue })] }), _jsxs("div", { className: 'solidgate-checkout-price-row is-discount', children: [_jsx("strong", { children: presentation.discountLabel }), _jsx("strong", { children: presentation.discountAmountLabel })] }), _jsxs("div", { className: 'solidgate-checkout-promo', children: [_jsx("span", { children: presentation.promoCodeLabel }), _jsx("strong", { children: presentation.promoCode.trim() })] })] })) : null, _jsxs("div", { className: `solidgate-checkout-total${showPromo ? '' : ' is-plain'}`, children: [_jsx("span", { children: presentation.totalLabel }), _jsx("strong", { children: presentation.totalValue })] }), showPromo ? (_jsxs("p", { className: 'solidgate-checkout-saved', children: [_jsx("span", { "aria-hidden": 'true', children: "\uD83D\uDD25" }), presentation.savedLabel] })) : null] }));
+    return (_jsxs("section", { className: 'solidgate-checkout-summary', children: [showPromo ? (_jsxs("p", { className: 'solidgate-checkout-countdown', children: [presentation.discountPercent, "% ", presentation.countdownLabel, ' ', formatCountdown(presentation.remainingSeconds), " min"] })) : null, _jsxs("p", { className: 'solidgate-checkout-satisfaction', children: [_jsx("strong", { children: presentation.satisfactionPercent }), ' ', presentation.satisfactionLabel] }), showPromo ? (_jsxs("div", { className: 'solidgate-checkout-price-stack', children: [_jsxs("div", { className: 'solidgate-checkout-price-row is-muted', children: [_jsx("span", { children: presentation.originalPriceLabel }), _jsx("span", { className: 'solidgate-checkout-strike', children: presentation.originalPriceValue })] }), _jsxs("div", { className: 'solidgate-checkout-price-row is-discount', children: [_jsx("strong", { children: presentation.discountLabel }), _jsx("strong", { children: presentation.discountAmountLabel })] }), _jsxs("div", { className: 'solidgate-checkout-promo', children: [_jsx("span", { children: presentation.promoCodeLabel }), _jsx("strong", { children: presentation.promoCode.trim() })] })] })) : null, _jsxs("div", { className: `solidgate-checkout-total${showPromo ? '' : ' is-plain'}`, children: [_jsx("span", { children: presentation.totalLabel }), _jsxs("strong", { children: [_jsxs("svg", { viewBox: '0 0 24 24', "aria-hidden": 'true', children: [_jsx("path", { d: 'M20 13 11 22 2 13V2h11l9 9-2 2Z' }), _jsx("circle", { cx: '7', cy: '7', r: '1' })] }), presentation.totalValue] })] }), showPromo ? (_jsxs("p", { className: 'solidgate-checkout-saved', children: [_jsx("span", { "aria-hidden": 'true', children: "\uD83D\uDD25" }), presentation.savedLabel] })) : null] }));
 }

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

@@ -1,7 +1,11 @@
 import type { SolidgateCheckoutPreparation } from '../services/solidgate.service.js';
-export declare function SolidgatePaymentForm({ buttonColor, cardSubmitLabel, checkout, hidden, loadingLabel, onError, onMounted, onSubmit, onVerify, }: {
+export declare function SolidgatePaymentForm({ buttonColor, walletOnly, cardSubmitLabel, secureLabel, cardLabel, paymentMethodLabel, checkout, hidden, onError, onMounted, onSubmit, onVerify, }: {
     buttonColor: string;
+    walletOnly?: boolean;
     cardSubmitLabel: string;
+    secureLabel?: string;
+    cardLabel?: string;
+    paymentMethodLabel?: string;
     checkout: SolidgateCheckoutPreparation;
     hidden: boolean;
     loadingLabel: string;

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

@@ -1,26 +1,15 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Suspense, lazy, useEffect, useRef } from 'react';
-const SolidgatePayment = lazy(async () => ({
-    default: (await import('@solidgate/react-sdk')).default,
-}));
-const safeDestroyPaymentForm = (instance) => {
-    var _a;
-    try {
-        instance === null || instance === void 0 ? void 0 : instance.unsubscribeAll();
-    }
-    catch (_b) {
-        // The global destroy below is the final cleanup boundary.
-    }
-    try {
-        (_a = window.PaymentFormSdk) === null || _a === void 0 ? void 0 : _a.destroy();
-    }
-    catch (_c) {
-        // Cleanup must stay safe when the remote SDK is partially initialized.
-    }
-};
-export function SolidgatePaymentForm({ buttonColor, cardSubmitLabel, checkout, hidden, loadingLabel, onError, onMounted, onSubmit, onVerify, }) {
-    const instanceRef = useRef(null);
+import { useEffect, useId, useRef, useState } from 'react';
+import { PaymentBrandMark, SecurityLockIcon } from '../../stripe/components/CheckoutBrandAssets.js';
+import { SolidgateSdkPayment } from './SolidgateSdkPayment.js';
+export function SolidgatePaymentForm({ buttonColor, walletOnly = false, cardSubmitLabel, secureLabel, cardLabel = 'Credit card', paymentMethodLabel = 'Payment method', checkout, hidden, onError, onMounted, onSubmit, onVerify, }) {
+    const panelId = useId();
+    const [wallets, setWallets] = useState([]);
+    const [selectedMethod, setSelectedMethod] = useState('wallet');
+    const showTabs = !walletOnly && Boolean(secureLabel) && wallets.length > 0;
+    const showWallet = walletOnly || !showTabs || selectedMethod === 'wallet';
+    const showCard = !walletOnly && (!showTabs || selectedMethod === 'card');
     const submittedRef = useRef(false);
     const paymentBoundaryRef = useRef(null);
     const mountedReportedRef = useRef(false);
@@ -37,8 +26,14 @@ export function SolidgatePaymentForm({ buttonColor, cardSubmitLabel, checkout, h
             return;
         }
         const reportIframeMounted = () => {
+            var _a, _b;
+            const available = [
+                ((_a = applePayContainerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('apple-pay-button')) ? 'Apple Pay' : null,
+                ((_b = googlePayContainerRef.current) === null || _b === void 0 ? void 0 : _b.querySelector('button')) ? 'Google Pay' : null,
+            ].filter((method) => Boolean(method));
+            setWallets((previous) => previous.join() === available.join() ? previous : available);
             if (!mountedReportedRef.current
-                && boundary.querySelector('iframe#solid-payment-form-iframe, iframe[name="solid-payment-form-iframe"]')) {
+                && boundary.querySelector('iframe#payment-form-iframe, iframe[name="payment-form-iframe"], iframe#solid-payment-form-iframe, iframe[name="solid-payment-form-iframe"]')) {
                 mountedReportedRef.current = true;
                 onMountedRef.current();
             }
@@ -48,34 +43,19 @@ export function SolidgatePaymentForm({ buttonColor, cardSubmitLabel, checkout, h
         observer.observe(boundary, { childList: true, subtree: true });
         return () => observer.disconnect();
     }, [checkout.attemptId]);
-    useEffect(() => {
-        submittedRef.current = false;
-        return () => {
-            safeDestroyPaymentForm(instanceRef.current);
-            instanceRef.current = null;
-        };
-    }, [checkout.attemptId]);
     const walletButtonType = checkout.display.billingInterval ? 'subscribe' : 'buy';
-    return (_jsxs("div", { ref: paymentBoundaryRef, className: 'solidgate-checkout-payment', "data-solidgate-attempt-id": checkout.attemptId, hidden: hidden, "aria-hidden": hidden || undefined, children: [_jsxs("div", { className: 'solidgate-checkout-wallets', children: [_jsx("div", { ref: applePayContainerRef, "data-solidgate-wallet": 'apple-pay' }), _jsx("div", { ref: googlePayContainerRef, "data-solidgate-wallet": 'google-pay' })] }), _jsx(Suspense, { fallback: (_jsx("p", { role: 'status', className: 'solidgate-checkout-status-text', children: loadingLabel })), children: _jsx(SolidgatePayment, { merchantData: checkout.initialization.merchantData, width: '100%', formParams: {
-                        autoFocus: false,
-                        isSolidLogoVisible: true,
-                        submitButtonText: cardSubmitLabel,
-                    }, styles: {
+    return (_jsxs("div", { ref: paymentBoundaryRef, className: `solidgate-checkout-payment${secureLabel && !walletOnly ? ' is-branded' : ''}`, "data-solidgate-attempt-id": checkout.attemptId, hidden: hidden, "aria-hidden": hidden || undefined, children: [showTabs ? (_jsxs("div", { className: 'solidgate-checkout-methods', role: 'tablist', "aria-label": paymentMethodLabel, children: [_jsx("button", { type: 'button', role: 'tab', id: `${panelId}-wallet-tab`, "aria-label": wallets.join(' / '), "aria-selected": selectedMethod === 'wallet', "aria-controls": `${panelId}-wallet`, className: 'solidgate-checkout-method', onClick: () => setSelectedMethod('wallet'), children: wallets.map((label) => _jsx(PaymentBrandMark, { label: label, className: 'solidgate-checkout-tab-wallet' }, label)) }), _jsxs("button", { type: 'button', role: 'tab', id: `${panelId}-card-tab`, "aria-selected": selectedMethod === 'card', "aria-controls": `${panelId}-card`, className: 'solidgate-checkout-method', onClick: () => setSelectedMethod('card'), children: [_jsx("strong", { children: cardLabel }), _jsx("span", { className: 'solidgate-checkout-tab-brands', "aria-hidden": 'true', children: ['Visa', 'Mastercard', 'Maestro', 'Discover'].map((label) => (_jsx(PaymentBrandMark, { label: label, className: 'solidgate-checkout-tab-brand' }, label))) })] })] })) : null, !walletOnly && secureLabel && wallets.length > 0 && showWallet ? (_jsxs("p", { className: 'solidgate-checkout-secure', children: [_jsx(SecurityLockIcon, {}), secureLabel] })) : null, _jsxs("div", { className: 'solidgate-checkout-wallets', id: `${panelId}-wallet`, role: showTabs ? 'tabpanel' : undefined, "aria-labelledby": showTabs ? `${panelId}-wallet-tab` : undefined, hidden: !showWallet, children: [_jsx("div", { ref: applePayContainerRef, "data-solidgate-wallet": 'apple-pay' }), _jsx("div", { ref: googlePayContainerRef, "data-solidgate-wallet": 'google-pay' })] }), _jsx("div", { className: 'solidgate-checkout-card', id: `${panelId}-card`, role: showTabs ? 'tabpanel' : undefined, "aria-labelledby": showTabs ? `${panelId}-card-tab` : undefined, hidden: !showCard, children: _jsx(SolidgateSdkPayment, { onInitializationError: onError, merchantData: checkout.initialization.merchantData, width: '100%', formParams: Object.assign({ autoFocus: false, enabled: !walletOnly, isSolidLogoVisible: false, submitButtonText: cardSubmitLabel }, (secureLabel ? { cardNumberLabel: 'Card number', cardExpiryDateLabel: 'Expiration date', cardCvvLabel: 'Security code' } : {})), styles: {
                         form_body: {
                             'font-family': 'Inter, Arial, sans-serif',
                         },
-                        input_group: {
-                            input: {
-                                'border-color': '#d8d9dd',
-                                'border-radius': '10px',
-                            },
-                        },
+                        input_group: Object.assign({ input: Object.assign({ 'border-color': '#d8d9dd', 'border-radius': secureLabel ? '0' : '10px' }, (secureLabel ? { 'background-color': '#fff', 'font-size': '16px', height: '50px' } : {})) }, (secureLabel ? { '.label': { 'font-size': '14px', 'font-weight': '400', color: '#303136' } } : {})),
                         submit_button: {
                             'background-color': buttonColor,
                             'border-radius': '10px',
-                            'font-size': '16px',
+                            'font-size': secureLabel ? '21px' : '16px',
                             'font-weight': '800',
-                            height: '52px',
+                            height: secureLabel ? '60px' : '52px',
+                            'text-transform': 'none',
                         },
                     }, applePayButtonParams: {
                         color: 'black',
@@ -86,17 +66,7 @@ export function SolidgatePaymentForm({ buttonColor, cardSubmitLabel, checkout, h
                         color: 'black',
                         enabled: true,
                         type: walletButtonType,
-                    }, applePayContainerRef: applePayContainerRef, googlePayContainerRef: googlePayContainerRef, onReadyPaymentInstance: (instance) => {
-                        if (instanceRef.current && instanceRef.current !== instance) {
-                            try {
-                                instanceRef.current.unsubscribeAll();
-                            }
-                            catch (_a) {
-                                // The active instance remains usable even if stale-listener cleanup fails.
-                            }
-                        }
-                        instanceRef.current = instance;
-                    }, onMounted: () => {
+                    }, applePayContainerRef: applePayContainerRef, googlePayContainerRef: googlePayContainerRef, onMounted: () => {
                         if (!mountedReportedRef.current) {
                             mountedReportedRef.current = true;
                             onMountedRef.current();
@@ -110,5 +80,5 @@ export function SolidgatePaymentForm({ buttonColor, cardSubmitLabel, checkout, h
                             return;
                         }
                         onError();
-                    } }, checkout.attemptId) })] }));
+                    } }, checkout.attemptId) }), !walletOnly && secureLabel && (wallets.length === 0 || !showWallet) ? (_jsxs("p", { className: 'solidgate-checkout-secure is-card', children: [_jsx(SecurityLockIcon, {}), secureLabel] })) : null] }));
 }

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

@@ -0,0 +1,8 @@
+import type Payment from '@solidgate/react-sdk';
+import { type ComponentProps } from 'react';
+type Props = ComponentProps<typeof Payment> & {
+    onInitializationError: () => void;
+};
+/** Own container IDs and cancel pending initialization when a placement goes away. */
+export declare function SolidgateSdkPayment(props: Props): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,66 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useId, useRef } from 'react';
+let activeOwner = null;
+/** Own container IDs and cancel pending initialization when a placement goes away. */
+export function SolidgateSdkPayment(props) {
+    const id = `solidgate-${useId().replace(/[^a-zA-Z0-9]/g, '')}`;
+    const initialProps = useRef(props);
+    const callbacks = useRef(props);
+    useEffect(() => { callbacks.current = props; });
+    useEffect(() => {
+        var _a, _b;
+        let active = true;
+        let client = null;
+        let instance = null;
+        const owner = Symbol(id);
+        const config = initialProps.current;
+        const apple = (_a = config.applePayContainerRef) === null || _a === void 0 ? void 0 : _a.current;
+        const google = (_b = config.googlePayContainerRef) === null || _b === void 0 ? void 0 : _b.current;
+        if (apple)
+            apple.id = `${id}-apple`;
+        if (google)
+            google.id = `${id}-google`;
+        void import('@solidgate/react-sdk').then(async (sdk) => {
+            var _a, _b;
+            const loaded = await sdk.SdkLoader.load('https://cdn.charge-auth.com/js/form.js');
+            if (!active || !loaded)
+                return;
+            client = loaded;
+            activeOwner = owner;
+            instance = client.init({
+                merchantData: config.merchantData,
+                iframeParams: { containerId: id, width: config.width || '100%' },
+                formParams: config.formParams,
+                styles: config.styles,
+                applePayButtonParams: Object.assign(Object.assign({}, config.applePayButtonParams), { containerId: apple === null || apple === void 0 ? void 0 : apple.id }),
+                googlePayButtonParams: Object.assign(Object.assign({}, config.googlePayButtonParams), { containerId: google === null || google === void 0 ? void 0 : google.id }),
+            });
+            instance.on(sdk.MessageType.Mounted, (event) => { var _a, _b; return (_b = (_a = callbacks.current).onMounted) === null || _b === void 0 ? void 0 : _b.call(_a, event.data); });
+            instance.on(sdk.MessageType.Submit, (event) => { var _a, _b; return (_b = (_a = callbacks.current).onSubmit) === null || _b === void 0 ? void 0 : _b.call(_a, event.data); });
+            instance.on(sdk.MessageType.Verify, (event) => { var _a, _b; return (_b = (_a = callbacks.current).onVerify) === null || _b === void 0 ? void 0 : _b.call(_a, event.data); });
+            instance.on(sdk.MessageType.Success, (event) => { var _a, _b; return (_b = (_a = callbacks.current).onSuccess) === null || _b === void 0 ? void 0 : _b.call(_a, event.data); });
+            instance.on(sdk.MessageType.Fail, (event) => { var _a, _b; return (_b = (_a = callbacks.current).onFail) === null || _b === void 0 ? void 0 : _b.call(_a, event.data); });
+            instance.on(sdk.MessageType.Error, (event) => { var _a, _b; return (_b = (_a = callbacks.current).onError) === null || _b === void 0 ? void 0 : _b.call(_a, event.data); });
+            (_b = (_a = callbacks.current).onReadyPaymentInstance) === null || _b === void 0 ? void 0 : _b.call(_a, instance);
+        }).catch(() => {
+            if (active)
+                callbacks.current.onInitializationError();
+        });
+        return () => {
+            active = false;
+            if (activeOwner !== owner)
+                return;
+            activeOwner = null;
+            try {
+                instance === null || instance === void 0 ? void 0 : instance.unsubscribeAll();
+            }
+            catch ( /* Remote SDK may be partially initialized. */_a) { /* Remote SDK may be partially initialized. */ }
+            try {
+                client === null || client === void 0 ? void 0 : client.destroy();
+            }
+            catch ( /* Cleanup must not interrupt navigation. */_b) { /* Cleanup must not interrupt navigation. */ }
+        };
+    }, [id]);
+    return _jsx("div", { id: id, className: 'solidgate-sdk-card-container' });
+}

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

@@ -1,5 +1,9 @@
 import { type FunnelSdkRuntimeConfigOverrides } from '@funnelsgrove/runtime';
 export type SolidgateCheckoutStatus = 'preparing' | 'requires_payment' | 'verifying' | 'succeeded' | 'failed' | 'expired';
+export declare class SolidgateExistingSubscriptionError extends Error {
+    readonly code: "already_subscribed_to_product";
+    constructor();
+}
 export type SolidgateCheckoutPreparation = {
     attemptId: string;
     display: {
@@ -31,6 +35,7 @@ export type PrepareSolidgateCheckoutInput = {
     checkoutType?: 'subscription' | 'one_time' | null;
     environment?: 'test' | 'live' | null;
     idempotencyKey: string;
+    retryAttemptId?: string | null;
     discountKeyOrProviderId?: string | null;
     returnUrl: string;
     successUrl: string;
@@ -49,6 +54,7 @@ export type SolidgateCheckoutStatusResponse = {
     attemptId: string;
     status: SolidgateCheckoutStatus;
     retryAfterMs: number | null;
+    failureCode?: string;
 };
 export type PollSolidgateCheckoutStatusResult = SolidgateCheckoutStatusResponse & {
     timedOut: boolean;

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

@@ -1,4 +1,11 @@
 import { paywallCheckoutReturnUrl, retainPaywallCheckout, FUNNEL_ID, FUNNEL_SDK_PUBLISHABLE_KEY, buildMainApiUrl, resolvePreviewPaymentPublishableKey, } from '@funnelsgrove/runtime';
+export class SolidgateExistingSubscriptionError extends Error {
+    constructor() {
+        super('You already have an active subscription to this product.');
+        this.code = 'already_subscribed_to_product';
+        this.name = 'SolidgateExistingSubscriptionError';
+    }
+}
 const trimTrailingSlash = (value) => value.replace(/\/+$/, '');
 const requiredString = (value, name) => {
     const normalized = typeof value === 'string' ? value.trim() : '';
@@ -28,6 +35,13 @@ const postJson = async (path, body, runtimeConfig, signal) => {
         signal,
     });
     if (!response.ok) {
+        if (response.status === 409) {
+            const payload = await response.json().catch(() => null);
+            if (payload && typeof payload === 'object' && 'code' in payload
+                && payload.code === 'already_subscribed_to_product') {
+                throw new SolidgateExistingSubscriptionError();
+            }
+        }
         throw new Error('Solidgate checkout is temporarily unavailable');
     }
     return response.json();
@@ -103,11 +117,8 @@ const parseStatus = (value) => {
         && (typeof retryAfterMs !== 'number' || !Number.isFinite(retryAfterMs) || retryAfterMs < 0)) {
         throw new Error('Solidgate checkout status returned an invalid retry delay');
     }
-    return {
-        attemptId: requiredString(value.attemptId, 'attemptId'),
-        status: value.status,
-        retryAfterMs,
-    };
+    return Object.assign({ attemptId: requiredString(value.attemptId, 'attemptId'), status: value.status, retryAfterMs }, (value.status === 'failed' && typeof value.failureCode === 'string'
+        && /^\d\.\d{2}$/.test(value.failureCode) ? { failureCode: value.failureCode } : {}));
 };
 export const prepareSolidgateCheckout = async (input) => {
     var _a, _b, _c;
@@ -118,23 +129,8 @@ export const prepareSolidgateCheckout = async (input) => {
     if (!paymentProfileId || !providerPlanId || !checkoutType || !environment) {
         throw new Error('Solidgate V2 checkout selection is incomplete');
     }
-    const result = parsePreparation(await postJson('/sdk/public/v2/payments/checkout-sessions', {
-        checkoutType,
-        uiMode: 'custom',
-        environment,
-        paymentProfileId,
-        provider: 'solidgate',
-        providerPlanId,
-        planKey: requiredString(input.funnelPlanKey, 'funnelPlanKey'),
-        funnelId: resolveFunnelId(input.funnelId, input.runtimeConfig),
-        funnelEndUserId: requiredString(input.funnelEndUserId, 'funnelEndUserId'),
-        offerSetId: requiredString(input.offerSetId, 'offerSetId'),
-        idempotencyKey: requiredString(input.idempotencyKey, 'idempotencyKey'),
-        couponId: ((_c = input.discountKeyOrProviderId) === null || _c === void 0 ? void 0 : _c.trim()) || null,
-        returnUrl: paywallCheckoutReturnUrl(requiredString(input.returnUrl, 'returnUrl'), 'solidgate'),
-        successUrl: paywallCheckoutReturnUrl(requiredString(input.successUrl, 'successUrl'), 'solidgate'),
-        failUrl: paywallCheckoutReturnUrl(requiredString(input.failUrl, 'failUrl'), 'solidgate', true),
-    }, input.runtimeConfig, input.signal));
+    const result = parsePreparation(await postJson('/sdk/public/v2/payments/checkout-sessions', Object.assign(Object.assign({ checkoutType, uiMode: 'custom', environment,
+        paymentProfileId, provider: 'solidgate', providerPlanId, planKey: requiredString(input.funnelPlanKey, 'funnelPlanKey'), funnelId: resolveFunnelId(input.funnelId, input.runtimeConfig), funnelEndUserId: requiredString(input.funnelEndUserId, 'funnelEndUserId'), offerSetId: requiredString(input.offerSetId, 'offerSetId'), idempotencyKey: requiredString(input.idempotencyKey, 'idempotencyKey') }, (input.retryAttemptId ? { retryAttemptId: input.retryAttemptId } : {})), { couponId: ((_c = input.discountKeyOrProviderId) === null || _c === void 0 ? void 0 : _c.trim()) || null, returnUrl: paywallCheckoutReturnUrl(requiredString(input.returnUrl, 'returnUrl'), 'solidgate'), successUrl: paywallCheckoutReturnUrl(requiredString(input.successUrl, 'successUrl'), 'solidgate'), failUrl: paywallCheckoutReturnUrl(requiredString(input.failUrl, 'failUrl'), 'solidgate', true) }), input.runtimeConfig, input.signal));
     retainPaywallCheckout('solidgate', result.attemptId);
     return result;
 };

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

@@ -0,0 +1 @@
+export declare const solidgateDeclineMessage: (code?: string) => string;

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

@@ -0,0 +1,24 @@
+// Customer-safe descriptions; never render raw processor messages or risk decisions.
+// https://docs.solidgate.com/payments/payments-insights/error-codes/
+const messages = {
+    '0.02': 'The payment session expired. Start a new checkout to continue.',
+    '2.04': 'This card type is not supported. Use another payment method.',
+    '2.06': 'The security code is incorrect. Check the code on your card and try again.',
+    '2.08': 'The card number is invalid. Check the number and try again.',
+    '2.09': 'The card expiration date is invalid. Check the date or use another card.',
+    '2.14': 'We could not start this subscription. Check whether you already have access, or contact support.',
+    '2.15': 'Your bank requires additional verification. Try again and complete the bank verification step.',
+    '3.01': 'Your bank has blocked this card. Contact your bank or use another payment method.',
+    '3.02': 'Your card has insufficient funds. Add funds or use another payment method.',
+    '3.03': 'This payment exceeds your card limit. Check your limit with your bank or use another card.',
+    '3.04': 'Your bank declined this payment. Contact your bank or use another payment method.',
+    '3.05': 'Contact your bank to authorize this payment, or use another payment method.',
+    '3.06': 'Debit cards cannot be used for this payment. Use a credit card or another payment method.',
+    '3.07': 'This card type is not supported. Use another payment method.',
+    '3.09': 'Your bank requires additional verification. Try again and complete the bank verification step.',
+    '3.11': 'Recurring payments are not authorized for this card. Use another payment method.',
+    '3.13': 'The payment was cancelled. Try again and keep the payment window open until it finishes.',
+    '4.08': 'The billing address does not match your card. Check the address with your bank and try again.',
+};
+export const solidgateDeclineMessage = (code) => ((code && Object.hasOwn(messages, code) ? messages[code] : undefined)
+    || 'Your payment was declined. Use another payment method or contact your bank.');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@funnelsgrove/payments",
-  "version": "0.27.0",
+  "version": "0.29.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/The-Solid-Grove/funnelsgrove.git",