@funnelsgrove/runtime 0.7.27 → 0.7.29

package/dist/runtime/funnel-answer-draft.d.ts

@@ -0,0 +1,11 @@
+import type { FunnelUserAnswers } from '../sdk/userAnswers.js';
+type FunnelAnswerDraftScope = {
+    funnelId: string | null | undefined;
+    funnelVersionId: string | null | undefined;
+    userId: string | null | undefined;
+};
+export declare const buildFunnelAnswerDraftStorageKey: (scope: FunnelAnswerDraftScope) => string | null;
+export declare const readFunnelAnswerDraft: (scope: FunnelAnswerDraftScope, nowMs?: number) => FunnelUserAnswers | null;
+export declare const writeFunnelAnswerDraft: (scope: FunnelAnswerDraftScope, answers: FunnelUserAnswers, nowMs?: number) => boolean;
+export declare const clearFunnelAnswerDraft: (scope: FunnelAnswerDraftScope) => void;
+export {};

package/dist/runtime/funnel-answer-draft.js

@@ -0,0 +1,82 @@
+const ANSWER_DRAFT_VERSION = 1;
+const ANSWER_DRAFT_TTL_MS = 14 * 24 * 60 * 60 * 1000;
+const MAX_ANSWER_DRAFT_BYTES = 65536;
+const asNonEmptyPart = (value) => {
+    const normalized = value === null || value === void 0 ? void 0 : value.trim();
+    return normalized || null;
+};
+const isRecord = (value) => (Boolean(value) && typeof value === 'object' && !Array.isArray(value));
+export const buildFunnelAnswerDraftStorageKey = (scope) => {
+    const funnelId = asNonEmptyPart(scope.funnelId);
+    const funnelVersionId = asNonEmptyPart(scope.funnelVersionId);
+    const userId = asNonEmptyPart(scope.userId);
+    if (!funnelId || !funnelVersionId || !userId) {
+        return null;
+    }
+    return `funnel:${funnelId}:${funnelVersionId}:${userId}:answer-draft`;
+};
+export const readFunnelAnswerDraft = (scope, nowMs = Date.now()) => {
+    const key = buildFunnelAnswerDraftStorageKey(scope);
+    if (!key || typeof window === 'undefined') {
+        return null;
+    }
+    try {
+        const raw = window.localStorage.getItem(key);
+        if (!raw) {
+            return null;
+        }
+        const parsed = JSON.parse(raw);
+        if (parsed.version !== ANSWER_DRAFT_VERSION
+            || typeof parsed.updatedAt !== 'number'
+            || !Number.isFinite(parsed.updatedAt)
+            || parsed.updatedAt > nowMs
+            || nowMs - parsed.updatedAt > ANSWER_DRAFT_TTL_MS
+            || !isRecord(parsed.answers)) {
+            window.localStorage.removeItem(key);
+            return null;
+        }
+        return parsed.answers;
+    }
+    catch (_a) {
+        try {
+            window.localStorage.removeItem(key);
+        }
+        catch (_b) {
+            // Storage may be unavailable in privacy-constrained browser contexts.
+        }
+        return null;
+    }
+};
+export const writeFunnelAnswerDraft = (scope, answers, nowMs = Date.now()) => {
+    const key = buildFunnelAnswerDraftStorageKey(scope);
+    if (!key || typeof window === 'undefined' || !isRecord(answers)) {
+        return false;
+    }
+    try {
+        const serialized = JSON.stringify({
+            version: ANSWER_DRAFT_VERSION,
+            updatedAt: nowMs,
+            answers,
+        });
+        if (new TextEncoder().encode(serialized).byteLength > MAX_ANSWER_DRAFT_BYTES) {
+            return false;
+        }
+        window.localStorage.setItem(key, serialized);
+        return true;
+    }
+    catch (_a) {
+        return false;
+    }
+};
+export const clearFunnelAnswerDraft = (scope) => {
+    const key = buildFunnelAnswerDraftStorageKey(scope);
+    if (!key || typeof window === 'undefined') {
+        return;
+    }
+    try {
+        window.localStorage.removeItem(key);
+    }
+    catch (_a) {
+        // Storage may be unavailable in privacy-constrained browser contexts.
+    }
+};

package/dist/runtime/use-funnel-flow-controller.js

@@ -4,7 +4,7 @@ import { useFunnelRuntimeConfig } from '../components/FunnelRuntimeConfigBoundar
 import { writeStepChoice } from '../sdk/userAnswers.js';
 import { apiService } from '../services/api.service.js';
 import { logger } from '../services/logger.js';
-import { FUNNEL_ID, POSTHOG_API_HOST, POSTHOG_PROJECT_API_KEY, PROJECT_ID, } from '../services/runtime-api.config.js';
+import { FUNNEL_ID, FUNNEL_VERSION_ID, POSTHOG_API_HOST, POSTHOG_PROJECT_API_KEY, PROJECT_ID, } from '../services/runtime-api.config.js';
 import { buildHostedStepLocation, dispatchWindowCustomEvent, updateFunnelHistory, } from './browser-helpers.js';
 import { isPreviewStepLockRequested, resolveNextStepFromContext, shouldRunAutoAdvanceTimer, } from './funnel-flow.js';
 import { usePreviewBridge } from './preview-bridge.js';
@@ -19,6 +19,7 @@ import { isDevelopmentRuntime } from '../config/env.config.js';
 import { consumeChoiceCompletionMarker, enforceChoiceBypassGuard, registerInternalChoiceCommit, runAtomicChoiceCommit, } from './use-step-choices.js';
 import { createFunnelStepLifecycleState, finishVisit, startVisit, } from './funnel-step-lifecycle.js';
 import { createEmailCaptureSingleFlight, submitEmailCapture as submitEmailCapturePrimitive, } from './submit-email-capture.js';
+import { clearFunnelAnswerDraft, readFunnelAnswerDraft, writeFunnelAnswerDraft, } from './funnel-answer-draft.js';
 const isTerminalCompletion = (stepMeta, outcome) => {
     var _a;
     return (outcome.type === 'complete'
@@ -322,14 +323,25 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
     }, [initialStepId, resolveFallbackStepId, resolveRuntimeInitialStepId]);
     const isSubscriptionManagementRuntime = ((_g = stepById[safeInitialStepId]) === null || _g === void 0 ? void 0 : _g.kind) === 'manage-subscription';
     const lifecycleEventsSuppressed = isPreviewRuntime || editorModeEnabled || isSubscriptionManagementRuntime;
+    const [initialRuntimeIdentity] = useState(() => {
+        const urlAttributes = resolveUrlUserAttributes();
+        const clientUserId = isSubscriptionManagementRuntime
+            ? urlAttributes.userId || ''
+            : api.getOrCreateClientUserId();
+        return { clientUserId, urlAttributes };
+    });
     const [activeStepId, setActiveStepId] = useState(safeInitialStepId);
-    const [attributes, setAttributes] = useState(() => (Object.assign({}, (initialAttributes || {}))));
+    const [attributes, setAttributes] = useState(() => (Object.assign(Object.assign({}, (isSubscriptionManagementRuntime || isPreviewRuntime
+        ? {}
+        : readFunnelAnswerDraft({
+            funnelId: FUNNEL_ID,
+            funnelVersionId: FUNNEL_VERSION_ID,
+            userId: initialRuntimeIdentity.clientUserId,
+        }) || {})), (initialAttributes || {}))));
     const [user, setUser] = useState(() => ({
-        id: isSubscriptionManagementRuntime
-            ? resolveUrlUserAttributes().userId || ''
-            : api.getOrCreateClientUserId(),
-        name: '',
-        email: '',
+        id: initialRuntimeIdentity.clientUserId,
+        name: initialRuntimeIdentity.urlAttributes.name || '',
+        email: initialRuntimeIdentity.urlAttributes.email || '',
         attributes: {},
         document: {},
         completedSteps: [],
@@ -353,6 +365,7 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
     const stepLifecycleStateRef = useRef(createFunnelStepLifecycleState());
     const activeVisitTokenRef = useRef(null);
     const emailCaptureSingleFlightRef = useRef(createEmailCaptureSingleFlight());
+    const answersCommittedRef = useRef(false);
     const pendingEmailCaptureNavigationRef = useRef(null);
     const appliedInitialStepIdRef = useRef(safeInitialStepId);
     const safeActiveStepId = useMemo(() => { var _a; return (_a = resolveRenderableStepId(activeStepId)) !== null && _a !== void 0 ? _a : safeInitialStepId; }, [activeStepId, resolveRenderableStepId, safeInitialStepId]);
@@ -474,6 +487,16 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
     useEffect(() => {
         attributesRef.current = attributes;
     }, [attributes]);
+    useEffect(() => {
+        if (isPreviewRuntime || isSubscriptionManagementRuntime || answersCommittedRef.current) {
+            return;
+        }
+        writeFunnelAnswerDraft({
+            funnelId: FUNNEL_ID,
+            funnelVersionId: FUNNEL_VERSION_ID,
+            userId: user.id,
+        }, attributes);
+    }, [attributes, isPreviewRuntime, isSubscriptionManagementRuntime, user.id]);
     useEffect(() => {
         postHogFeatureFlagsRef.current = postHogFeatureFlags;
     }, [postHogFeatureFlags]);
@@ -522,12 +545,12 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
             setPostHogReady(true);
             return;
         }
-        const localUserId = api.getOrCreateClientUserId();
+        const localUserId = initialRuntimeIdentity.clientUserId;
         const bootstrapCandidateUserId = api.getBootstrapCandidateUserId(localUserId);
         const initialAttribution = collectCurrentFunnelAttribution();
         initialAttributionRef.current = initialAttribution;
         setUserBootstrapped(isPreviewRuntime);
-        setUser((prev) => (Object.assign(Object.assign({}, prev), { id: localUserId })));
+        setUser((prev) => (Object.assign(Object.assign({}, prev), { id: localUserId, name: prev.name || urlUserAttributes.name || '', email: prev.email || urlUserAttributes.email || '' })));
         if (isPreviewRuntime) {
             return;
         }
@@ -551,8 +574,6 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
         const sessionBootstrap = api
             .bootstrapSession({
             userId: bootstrapCandidateUserId || localUserId,
-            email: urlUserAttributes.email || undefined,
-            name: urlUserAttributes.name || undefined,
             attribution: initialAttribution,
         })
             .then((sessionUser) => {
@@ -560,8 +581,13 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
             const sessionAttributes = Object.keys(sessionUser.attributes || {}).length > 0
                 ? sessionUser.attributes
                 : null;
-            if (sessionAttributes) {
-                setAttributes((prev) => (Object.assign(Object.assign({}, sessionAttributes), prev)));
+            const sessionDraft = readFunnelAnswerDraft({
+                funnelId: FUNNEL_ID,
+                funnelVersionId: FUNNEL_VERSION_ID,
+                userId: sessionUser.id,
+            });
+            if (sessionAttributes || sessionDraft) {
+                setAttributes((prev) => (Object.assign(Object.assign(Object.assign({}, (sessionAttributes || {})), (sessionDraft || {})), prev)));
             }
             initialAttributionRef.current = resolveFunnelEventAttribution(sessionUser.document, initialAttribution);
             setUser((prev) => (Object.assign(Object.assign({}, prev), { id: sessionUser.id || prev.id, name: sessionUser.name || prev.name, email: sessionUser.email || prev.email, document: sessionUser.document, attributes: sessionAttributes ? Object.assign(Object.assign({}, sessionAttributes), prev.attributes) : prev.attributes })));
@@ -602,6 +628,7 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
         return cancelAttributionFailOpen;
     }, [
         api,
+        initialRuntimeIdentity.clientUserId,
         isPreviewRuntime,
         isSubscriptionManagementRuntime,
         sessionReplayEnabled,
@@ -640,25 +667,9 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
         const completionAttributes = Object.assign({}, attributesRef.current);
         dispatchWindowCustomEvent('funnel:step-completed', record);
         setUser((prev) => {
-            var _a, _b;
+            var _a;
             const updatedSteps = [...((_a = prev.completedSteps) !== null && _a !== void 0 ? _a : []), record];
             const updatedUser = Object.assign(Object.assign({}, prev), { attributes: Object.assign(Object.assign({}, prev.attributes), completionAttributes), document: prev.document, completedSteps: updatedSteps });
-            if (!isPreviewRuntime) {
-                api
-                    .updateUser({
-                    id: updatedUser.id,
-                    name: updatedUser.name,
-                    email: updatedUser.email,
-                    attributes: Object.assign(Object.assign({}, updatedUser.attributes), { completedSteps: updatedSteps }),
-                    document: (_b = updatedUser.document) !== null && _b !== void 0 ? _b : {},
-                }, {
-                    attribution: collectCurrentFunnelAttribution(),
-                    persistClientIdentity: false,
-                })
-                    .catch((error) => {
-                    logger.error('Failed to persist step completion:', error);
-                });
-            }
             return updatedUser;
         });
         if (!isPreviewRuntime) {
@@ -670,7 +681,7 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
                 logger.error('Failed to track step completion:', error);
             }
         }
-    }, [analytics, api, attributionReady, isPreviewRuntime, lifecycleEventsSuppressed, stepById, stepContractVersion]);
+    }, [analytics, attributionReady, isPreviewRuntime, lifecycleEventsSuppressed, stepById, stepContractVersion]);
     const emitStepExit = useCallback((intent) => {
         var _a;
         const meta = stepById[intent.visit.stepId];
@@ -785,11 +796,33 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
                 pendingEmailCaptureNavigationRef.current = null;
                 return true;
             },
-            persist: (normalizedEmail) => api.captureEmail({
-                userId: submittedUserId,
-                email: normalizedEmail,
-                environment: getRuntimeMode(),
-            }),
+            persist: async (normalizedEmail) => {
+                const result = await api.captureEmail({
+                    userId: submittedUserId,
+                    email: normalizedEmail,
+                    environment: getRuntimeMode(),
+                    answers: Object.assign({}, attributesRef.current),
+                });
+                answersCommittedRef.current = true;
+                clearFunnelAnswerDraft({
+                    funnelId: FUNNEL_ID,
+                    funnelVersionId: FUNNEL_VERSION_ID,
+                    userId: submittedUserId,
+                });
+                clearFunnelAnswerDraft({
+                    funnelId: FUNNEL_ID,
+                    funnelVersionId: FUNNEL_VERSION_ID,
+                    userId: initialRuntimeIdentity.clientUserId,
+                });
+                if (result.canonicalUser) {
+                    clearFunnelAnswerDraft({
+                        funnelId: FUNNEL_ID,
+                        funnelVersionId: FUNNEL_VERSION_ID,
+                        userId: result.canonicalUser.id,
+                    });
+                }
+                return result;
+            },
             applyUser: (capturedUser) => {
                 setIsReturningSubscriber(false);
                 currentUserIdRef.current = capturedUser.id;
@@ -855,6 +888,7 @@ export function useFunnelFlowController({ api = apiService, analytics, stepContr
         api,
         analytics,
         claimActiveVisit,
+        initialRuntimeIdentity.clientUserId,
         isFunnelStepId,
         isPreviewRuntime,
         navigateToStep,

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

@@ -59,7 +59,6 @@ export type EmailCaptureResult = {
     activeSubscription: boolean;
 };
 declare class ApiService {
-    private readFileAsDataUrl;
     getOrCreateClientUserId(): string;
     persistCanonicalUserId(userId: string): string;
     getSubscriptionManagementUserId(): string | null;
@@ -81,6 +80,7 @@ declare class ApiService {
         userId: string;
         email: string;
         environment: 'test' | 'live';
+        answers?: FunnelUserAnswers;
     }): Promise<EmailCaptureResult>;
     syncUrlUserAttributes(input: {
         user: AppUserInput;

package/dist/services/api.service.js

@@ -194,20 +194,6 @@ const toAppUser = (input) => {
     };
 };
 class ApiService {
-    readFileAsDataUrl(file) {
-        return new Promise((resolve, reject) => {
-            const reader = new FileReader();
-            reader.onload = () => {
-                if (typeof reader.result !== 'string' || !reader.result.trim()) {
-                    reject(new Error('Failed to read image'));
-                    return;
-                }
-                resolve(reader.result);
-            };
-            reader.onerror = () => reject(new Error('Failed to read image'));
-            reader.readAsDataURL(file);
-        });
-    }
     getOrCreateClientUserId() {
         const existing = readStoredUserId(FUNNEL_ID);
         if (existing) {
@@ -267,8 +253,8 @@ class ApiService {
     async bootstrapSession(input) {
         var _a, _b, _c;
         const urlUserAttributes = resolveUrlUserAttributes();
-        const inputEmail = (input === null || input === void 0 ? void 0 : input.email) || urlUserAttributes.email || undefined;
-        const inputName = (input === null || input === void 0 ? void 0 : input.name) || urlUserAttributes.name || undefined;
+        const inputEmail = (input === null || input === void 0 ? void 0 : input.email) || undefined;
+        const inputName = (input === null || input === void 0 ? void 0 : input.name) || undefined;
         const candidateUserId = (input === null || input === void 0 ? void 0 : input.userId) || urlUserAttributes.userId;
         const userId = await this.resolveBootstrapUserId(candidateUserId);
         const publishableKey = getFunnelSdkPublishableKey();
@@ -358,6 +344,7 @@ class ApiService {
             userId,
             email,
             environment: input.environment,
+            answers: input.answers,
         });
         const eventId = asString(payload.eventId);
         const responseUser = isRecord(payload.user) ? payload.user : null;
@@ -465,8 +452,8 @@ class ApiService {
     async uploadTempPhoto(input) {
         const userId = persistUserId(input.userId || this.getOrCreateClientUserId(), FUNNEL_ID);
         const publishableKey = getFunnelSdkPublishableKey();
-        const imageDataUrl = await this.readFileAsDataUrl(input.file);
         if (!publishableKey) {
+            const imageDataUrl = URL.createObjectURL(input.file);
             return {
                 key: `local_${userId}_${Date.now()}`,
                 publicUrl: imageDataUrl,
@@ -475,11 +462,11 @@ class ApiService {
                 uploadedAt: new Date().toISOString(),
             };
         }
-        const payload = await funnelSdkService.uploadPhoto({
+        const payload = await funnelSdkService.uploadPhotoFile({
             userId,
             fileName: input.file.name || 'capture.jpg',
-            mimeType: input.file.type || undefined,
-            imageDataUrl,
+            contentType: input.file.type || undefined,
+            file: input.file,
             source: input.source || 'upload',
         });
         const publicUrl = asString(payload.publicUrl);

package/dist/services/funnel-sdk.service.d.ts

@@ -27,6 +27,7 @@ export type FunnelSdkCaptureEmailInput = {
     userId: string;
     email: string;
     environment: FunnelSdkRuntimeMode;
+    answers?: FunnelSdkJsonObject;
     runtimeConfig?: FunnelSdkRuntimeConfigOverrides;
 };
 export type FunnelSdkCaptureEmailResponse = {
@@ -77,6 +78,25 @@ export type FunnelSdkUploadPhotoInput = {
     userId?: string | null;
     runtimeConfig?: FunnelSdkRuntimeConfigOverrides;
 };
+export type FunnelSdkUploadPhotoFileInput = {
+    file: Blob;
+    fileName: string;
+    contentType?: string | null;
+    source?: 'camera' | 'upload' | string | null;
+    userId?: string | null;
+    runtimeConfig?: FunnelSdkRuntimeConfigOverrides;
+};
+export type FunnelSdkPreparedPhotoUpload = {
+    key: string;
+    publicUrl: string;
+    uploadUrl: string;
+    uploadHeaders: Record<string, string>;
+    contentType: string;
+    sizeBytes: number;
+};
+export type FunnelSdkUploadedPhoto = Omit<FunnelSdkPreparedPhotoUpload, 'uploadUrl' | 'uploadHeaders'> & {
+    uploadedAt: string;
+};
 export type FunnelSdkCreateHostedCheckoutSessionInput = {
     planId: string;
     offerSetId?: string | null;
@@ -263,6 +283,10 @@ declare class FunnelSdkService {
     claimUserSubscription<ResponsePayload = FunnelSdkJsonObject>(input: FunnelSdkClaimUserSubscriptionInput): Promise<ResponsePayload>;
     updateFunnelUser<ResponsePayload = FunnelSdkJsonObject>(input: FunnelSdkUpdateFunnelUserInput): Promise<ResponsePayload>;
     uploadPhoto<ResponsePayload = FunnelSdkJsonObject>(input: FunnelSdkUploadPhotoInput): Promise<ResponsePayload>;
+    preparePhotoUpload(input: Omit<FunnelSdkUploadPhotoFileInput, 'file'> & {
+        sizeBytes: number;
+    }): Promise<FunnelSdkPreparedPhotoUpload>;
+    uploadPhotoFile(input: FunnelSdkUploadPhotoFileInput): Promise<FunnelSdkUploadedPhoto>;
     listPaymentPlans(input?: {
         environment?: FunnelSdkRuntimeMode;
         offerSetId?: string | null;

package/dist/services/funnel-sdk.service.js

@@ -122,6 +122,7 @@ class FunnelSdkService {
                 user_id: input.userId,
                 email: input.email,
                 environment: input.environment,
+                answers: input.answers,
                 stepContractVersion: CURRENT_STEP_CONTRACT_VERSION,
             },
             errorMessage: 'Failed to capture email',
@@ -186,6 +187,48 @@ class FunnelSdkService {
             errorMessage: 'Failed to upload photo',
         });
     }
+    async preparePhotoUpload(input) {
+        const { funnelId } = resolveRuntimeConfig(input.runtimeConfig);
+        return this.postJson('/sdk/public/uploads/photos/prepare', {
+            runtimeConfig: input.runtimeConfig,
+            body: {
+                funnelId,
+                userId: input.userId,
+                fileName: input.fileName,
+                contentType: input.contentType,
+                sizeBytes: input.sizeBytes,
+                source: input.source,
+            },
+            includeRuntimeFields: false,
+            includePublishableKey: false,
+            errorMessage: 'Failed to prepare photo upload',
+        });
+    }
+    async uploadPhotoFile(input) {
+        const prepared = await this.preparePhotoUpload({
+            fileName: input.fileName,
+            contentType: input.contentType,
+            sizeBytes: input.file.size,
+            source: input.source,
+            userId: input.userId,
+            runtimeConfig: input.runtimeConfig,
+        });
+        const response = await fetch(prepared.uploadUrl, {
+            method: 'PUT',
+            headers: prepared.uploadHeaders,
+            body: input.file,
+        });
+        if (!response.ok) {
+            throw new Error(`Failed to upload photo (${response.status})`);
+        }
+        return {
+            key: prepared.key,
+            publicUrl: prepared.publicUrl,
+            contentType: prepared.contentType,
+            sizeBytes: prepared.sizeBytes,
+            uploadedAt: new Date().toISOString(),
+        };
+    }
     async listPaymentPlans(input = {}) {
         const { funnelId } = resolveRuntimeConfig(input.runtimeConfig);
         return this.getJson('/sdk/public/payments/plans', {

package/package.json

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