npm - @funnelsgrove/runtime - Versions diffs - 0.1.55 → 0.1.59 - Mend

@funnelsgrove/runtime 0.1.55 → 0.1.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (56) hide show

package/dist/components/FunnelContext.d.ts +5 -1
package/dist/components/FunnelContext.js +2 -1
package/dist/components/ManageSubscriptionScreen.js +4 -1
package/dist/components/SubscriptionHandoffScreen.d.ts +2 -1
package/dist/components/SubscriptionHandoffScreen.js +11 -6
package/dist/config/funnel.manifest.types.d.ts +4 -2
package/dist/generated/step-contract-hash.d.ts +1 -0
package/dist/generated/step-contract-hash.js +2 -0
package/dist/index.d.ts +12 -0
package/dist/index.js +10 -0
package/dist/migrations/step-contract-v2.d.ts +50 -0
package/dist/migrations/step-contract-v2.js +310 -0
package/dist/migrations/step-contract-v3.d.ts +41 -0
package/dist/migrations/step-contract-v3.js +26 -0
package/dist/runtime/funnel-attribution.d.ts +1 -0
package/dist/runtime/funnel-attribution.js +24 -0
package/dist/runtime/funnel-manifest.validation.d.ts +7 -2
package/dist/runtime/funnel-manifest.validation.js +24 -68
package/dist/runtime/funnel-step-lifecycle.d.ts +35 -0
package/dist/runtime/funnel-step-lifecycle.js +49 -0
package/dist/runtime/funnel-step-metadata.validation.d.ts +7 -0
package/dist/runtime/funnel-step-metadata.validation.js +88 -0
package/dist/runtime/submit-email-capture.d.ts +23 -0
package/dist/runtime/submit-email-capture.js +54 -0
package/dist/runtime/use-funnel-flow-controller.d.ts +71 -5
package/dist/runtime/use-funnel-flow-controller.js +850 -116
package/dist/runtime/use-step-choices.d.ts +58 -0
package/dist/runtime/use-step-choices.js +187 -0
package/dist/sdk/userAnswers.d.ts +1 -0
package/dist/services/api.service.d.ts +10 -0
package/dist/services/api.service.js +32 -0
package/dist/services/funnel-sdk.service.d.ts +17 -0
package/dist/services/funnel-sdk.service.js +13 -0
package/dist/steps/choice-contract.d.ts +33 -0
package/dist/steps/choice-contract.js +302 -0
package/dist/steps/step-contract.d.ts +498 -0
package/dist/steps/step-contract.js +506 -0
package/dist/steps/types.d.ts +7 -5
package/dist/steps/types.js +1 -18
package/dist/testing/funnel-contract-journey-driver.d.ts +35 -0
package/dist/testing/funnel-contract-journey-driver.js +266 -0
package/dist/testing/index.d.ts +1 -0
package/dist/testing/index.js +1 -0
package/dist/validation/fixtures/invalid-reserved-identities.d.ts +249 -0
package/dist/validation/fixtures/invalid-reserved-identities.js +20 -0
package/dist/validation/fixtures/valid-v2-project.d.ts +419 -0
package/dist/validation/fixtures/valid-v2-project.js +228 -0
package/dist/validation/fixtures/valid-v3-project.d.ts +419 -0
package/dist/validation/fixtures/valid-v3-project.js +30 -0
package/dist/validation/funnel-contract-diagnostics.d.ts +49 -0
package/dist/validation/funnel-contract-diagnostics.js +67 -0
package/dist/validation/funnel-contract-validator.d.ts +30 -0
package/dist/validation/funnel-contract-validator.js +1458 -0
package/dist/validation/funnel-manifest-input.normalization.d.ts +67 -0
package/dist/validation/funnel-manifest-input.normalization.js +386 -0
package/package.json +9 -1

package/dist/testing/funnel-contract-journey-driver.js ADDED Viewed

@@ -0,0 +1,266 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { JSDOM } from 'jsdom';
+import { fireEvent, render, waitFor } from '@testing-library/react';
+import { useEffect } from 'react';
+import { FunnelProvider, useFunnel } from '../components/FunnelContext.js';
+import { useFunnelFlowController } from '../runtime/use-funnel-flow-controller.js';
+import { useStepChoices } from '../runtime/use-step-choices.js';
+const steps = [
+    {
+        id: 'intro',
+        name: 'intro',
+        type: 'intro_hero',
+        figmaNodeId: '1:1',
+        title: 'Intro',
+        description: 'Intro',
+    },
+    {
+        id: 'goal-choice',
+        name: 'goal-choice',
+        type: 'single_step_choice',
+        choice: { answerKey: 'goal' },
+        figmaNodeId: '1:2',
+        title: 'Goal',
+        description: 'Goal',
+    },
+    {
+        id: 'mood-choice',
+        name: 'mood-choice',
+        type: 'single_step_choice_emoji',
+        choice: { answerKey: 'mood' },
+        figmaNodeId: '1:3',
+        title: 'Mood',
+        description: 'Mood',
+    },
+    {
+        id: 'habit-choice',
+        name: 'habit-choice',
+        type: 'multi_select_choice',
+        choice: { answerKey: 'habits', allowEmpty: false },
+        figmaNodeId: '1:4',
+        title: 'Habits',
+        description: 'Habits',
+    },
+    {
+        id: 'email-capture',
+        name: 'email-capture',
+        type: 'form_input',
+        figmaNodeId: '1:5',
+        title: 'Email',
+        description: 'Email',
+    },
+    {
+        id: 'paywall',
+        name: 'paywall',
+        type: 'paywall_offer',
+        kind: 'paywall',
+        figmaNodeId: '1:6',
+        title: 'Paywall',
+        description: 'Paywall',
+    },
+    {
+        id: 'subscription-started',
+        name: 'subscription-started',
+        type: 'complete_registration',
+        kind: 'subscription-handoff',
+        figmaNodeId: '1:7',
+        title: 'Subscription started',
+        description: 'Subscription started',
+    },
+];
+const stepById = Object.fromEntries(steps.map((step) => [step.id, step]));
+const stepIds = steps.map((step) => step.id);
+const standardOptions = [{ id: 'focus', label: 'Focus' }];
+const emojiOptions = [{ id: 'calm', label: 'Calm', emoji: '😌' }];
+const multiOptions = [
+    { id: 'walk', label: 'Walk' },
+    { id: 'sleep', label: 'Sleep' },
+];
+const installDomIfNeeded = () => {
+    if (typeof window !== 'undefined' && typeof document !== 'undefined') {
+        document.body.replaceChildren();
+        window.history.replaceState({}, '', '/intro?mode=test');
+        return () => document.body.replaceChildren();
+    }
+    const dom = new JSDOM('<!doctype html><html><body></body></html>', {
+        pretendToBeVisual: true,
+        url: 'https://journey.test/intro?mode=test',
+    });
+    const values = {
+        window: dom.window,
+        document: dom.window.document,
+        navigator: dom.window.navigator,
+        HTMLElement: dom.window.HTMLElement,
+        Node: dom.window.Node,
+        Event: dom.window.Event,
+        CustomEvent: dom.window.CustomEvent,
+        PageTransitionEvent: dom.window.PageTransitionEvent,
+        Blob: dom.window.Blob,
+        localStorage: dom.window.localStorage,
+        IS_REACT_ACT_ENVIRONMENT: true,
+    };
+    const previous = new Map();
+    for (const [key, value] of Object.entries(values)) {
+        previous.set(key, Object.getOwnPropertyDescriptor(globalThis, key));
+        Object.defineProperty(globalThis, key, {
+            configurable: true,
+            writable: true,
+            value,
+        });
+    }
+    return () => {
+        dom.window.close();
+        for (const [key, descriptor] of previous) {
+            if (descriptor) {
+                Object.defineProperty(globalThis, key, descriptor);
+            }
+            else {
+                delete globalThis[key];
+            }
+        }
+    };
+};
+function JourneyProbe({ onVisit }) {
+    const funnel = useFunnel();
+    const single = useStepChoices(stepById['goal-choice'], standardOptions);
+    const emoji = useStepChoices(stepById['mood-choice'], emojiOptions);
+    const multi = useStepChoices(stepById['habit-choice'], multiOptions);
+    useEffect(() => onVisit(funnel.activeStepId), [funnel.activeStepId, onVisit]);
+    const act = () => {
+        switch (funnel.activeStepId) {
+            case 'intro':
+            case 'paywall':
+                funnel.goNext();
+                break;
+            case 'goal-choice':
+                single.selectSingle('focus');
+                break;
+            case 'mood-choice':
+                emoji.selectSingle('calm');
+                break;
+            case 'habit-choice':
+                multi.completeMulti(['walk', 'sleep']);
+                break;
+            case 'email-capture':
+                void funnel.submitEmailCapture(' Person@Example.com ');
+                break;
+            case 'subscription-started':
+                funnel.completeFunnel('subscription-started');
+                break;
+        }
+    };
+    return (_jsx("button", { "data-journey-action": true, "data-step-id": funnel.activeStepId, onClick: act, children: "Continue" }));
+}
+function JourneyHarness({ api, analytics, onVisit, }) {
+    const controller = useFunnelFlowController({
+        api,
+        analytics,
+        stepContractVersion: 2,
+        defaultStepId: 'intro',
+        stepSequence: stepIds,
+        stepById,
+        stepComponentById: Object.fromEntries(stepIds.map((id) => [id, true])),
+        funnelExperiments: [],
+        getPathForStep: (stepId) => `/${stepId}`,
+        getStepIdFromPath: (pathname) => {
+            const candidate = pathname.slice(1);
+            return stepIds.includes(candidate) ? candidate : null;
+        },
+        getSequentialNextStepId: (stepId) => { var _a; return (_a = stepIds[stepIds.indexOf(stepId) + 1]) !== null && _a !== void 0 ? _a : null; },
+        getChoiceTargetsForStep: () => null,
+        isFunnelStepId: (value) => stepIds.includes(value),
+        resolveConfiguredNextStep: (stepId) => { var _a; return (_a = stepIds[stepIds.indexOf(stepId) + 1]) !== null && _a !== void 0 ? _a : null; },
+        resolveRuntimeInitialStepId: () => 'intro',
+    });
+    return (_jsx(FunnelProvider, { value: controller.contextValue, children: _jsx(JourneyProbe, { onVisit: onVisit }) }));
+}
+export const runFunnelContractJourney = async (options) => {
+    const restoreDom = installDomIfNeeded();
+    const envelopes = [];
+    const emailCaptureCalls = [];
+    const browserEmailEvents = [];
+    const visitedStepIds = [];
+    let eventSequence = 0;
+    const journeyUser = {
+        id: 'journey-user',
+        name: '',
+        email: '',
+        attributes: {},
+        document: {},
+    };
+    const api = {
+        getOrCreateClientUserId: () => journeyUser.id,
+        getBootstrapCandidateUserId: () => journeyUser.id,
+        bootstrapSession: async () => journeyUser,
+        pingUserContext: async () => null,
+        updateUser: async (user) => user,
+        captureEmail: async (captureInput) => {
+            emailCaptureCalls.push(captureInput);
+            return options.captureEmail(captureInput);
+        },
+    };
+    const capture = (eventType, input) => {
+        eventSequence += 1;
+        const eventId = `journey-event-${eventSequence}`;
+        envelopes.push(Object.assign({ eventType, eventId }, input));
+        return eventId;
+    };
+    const analytics = {
+        flush: async () => envelopes.length,
+        trackEmailCapturedBrowserDestinations: (input) => {
+            browserEmailEvents.push(input);
+        },
+        trackStepStarted: (input) => capture('step_start', input),
+        trackStepCompleted: (input) => capture('step_end', input),
+        trackStepExited: (input) => capture('step_exit', input),
+        trackFunnelStarted: (input) => capture('funnel_start', input),
+        trackFunnelCompleted: (input) => capture('funnel_completed', input),
+        trackFirstStepViewed: (input) => capture('first_step_viewed', input),
+        trackFirstStepClicked: (input) => capture('first_step_clicked', input),
+    };
+    const rendered = render(_jsx(JourneyHarness, { api: api, analytics: analytics, onVisit: (stepId) => {
+            if (visitedStepIds.at(-1) !== stepId) {
+                visitedStepIds.push(stepId);
+            }
+        } }));
+    try {
+        await waitFor(() => {
+            if (envelopes.filter((event) => event.eventType === 'step_start').length !== 1) {
+                throw new Error('Initial lifecycle did not start.');
+            }
+        });
+        for (const stepId of stepIds) {
+            const button = await waitFor(() => {
+                const candidate = rendered.container.querySelector('[data-journey-action]');
+                if (!candidate || candidate.dataset.stepId !== stepId) {
+                    throw new Error(`Journey did not reach ${stepId}.`);
+                }
+                return candidate;
+            });
+            fireEvent.click(button);
+            if (stepId === 'subscription-started') {
+                await waitFor(() => {
+                    if (!envelopes.some((event) => event.eventType === 'funnel_completed')) {
+                        throw new Error('Funnel completion did not fire.');
+                    }
+                });
+            }
+            else {
+                const nextId = stepIds[stepIds.indexOf(stepId) + 1];
+                await waitFor(() => {
+                    var _a;
+                    const activeId = (_a = rendered.container
+                        .querySelector('[data-journey-action]')) === null || _a === void 0 ? void 0 : _a.dataset.stepId;
+                    if (activeId !== nextId) {
+                        throw new Error(`Journey did not advance from ${stepId}.`);
+                    }
+                });
+            }
+        }
+        return { envelopes, emailCaptureCalls, browserEmailEvents, visitedStepIds };
+    }
+    finally {
+        rendered.unmount();
+        restoreDom();
+    }
+};

package/dist/testing/index.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export * from './funnel-contract-journey-driver.js';

package/dist/testing/index.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ export * from './funnel-contract-journey-driver.js';

package/dist/validation/fixtures/invalid-reserved-identities.d.ts ADDED Viewed

@@ -0,0 +1,249 @@
+export declare const scratchcardMisclassifiedManifest: {
+    readonly steps: readonly [{
+        readonly id: "step-1";
+        readonly name: "step-one";
+        readonly path: "/step-1";
+        readonly filePath: "src/steps/step-01.tsx";
+        readonly componentKey: "stepOne";
+        readonly type: "intro_hero";
+        readonly title: "Introduction";
+    }, {
+        readonly id: "step-2";
+        readonly name: "device-choice";
+        readonly path: "/step-2";
+        readonly filePath: "src/steps/step-02.tsx";
+        readonly componentKey: "stepTwo";
+        readonly type: "multi_select_choice";
+        readonly choice: {
+            readonly answerKey: "selectedDevices";
+            readonly allowEmpty: true;
+        };
+        readonly title: "Choose devices";
+    }, {
+        readonly id: "email-capture";
+        readonly name: "email-capture";
+        readonly path: "/email-capture";
+        readonly filePath: "src/steps/step-31-email-capture.tsx";
+        readonly componentKey: "stepEmailCapture";
+        readonly type: "form_input";
+        readonly title: "Email capture";
+    }, {
+        readonly id: "paywall";
+        readonly name: "paywall";
+        readonly path: "/paywall";
+        readonly filePath: "src/steps/step-32-paywall.tsx";
+        readonly componentKey: "stepPaywall";
+        readonly type: "paywall_offer";
+        readonly kind: "paywall";
+        readonly title: "Paywall";
+    }, {
+        readonly id: "paywall-b";
+        readonly name: "paywall-b";
+        readonly path: "/paywall-b";
+        readonly filePath: "src/steps/step-32b-paywall-b.tsx";
+        readonly componentKey: "stepPaywallB";
+        readonly type: "paywall_offer";
+        readonly kind: "paywall";
+        readonly title: "Paywall B";
+    }, {
+        readonly id: "subscription-started";
+        readonly name: "subscription-started";
+        readonly path: "/subscription-started";
+        readonly filePath: "src/steps/step-33-subscription-started.tsx";
+        readonly componentKey: "stepSubscriptionStarted";
+        readonly type: "complete_registration";
+        readonly kind: "subscription-handoff";
+        readonly title: "Subscription started";
+    }, {
+        readonly id: "manage-subscription";
+        readonly name: "manage-subscription";
+        readonly path: "/manage-subscription";
+        readonly filePath: "src/steps/step-35-manage-subscription.tsx";
+        readonly componentKey: "stepManageSubscription";
+        readonly type: "subscription_management";
+        readonly kind: "manage-subscription";
+        readonly title: "Manage subscription";
+    }, {
+        readonly id: "step-4";
+        readonly name: "scratchcard";
+        readonly path: "/step-4";
+        readonly filePath: "src/steps/step-04.tsx";
+        readonly componentKey: "stepFour";
+        readonly type: "paywall_offer";
+        readonly kind: "paywall";
+        readonly title: "Scratchcard";
+    }];
+    readonly templateArchitectureVersion: 1;
+    readonly stepContractVersion: 2;
+    readonly meta: {
+        readonly title: "Contract fixture";
+        readonly description: "A valid version 2 funnel contract fixture.";
+    };
+    readonly viewport: {
+        readonly width: 390;
+        readonly height: 844;
+    };
+    readonly assets: {};
+    readonly entryPoints: readonly [{
+        readonly id: "default";
+        readonly stepId: "step-1";
+        readonly isDefault: true;
+    }, {
+        readonly id: "manage-subscription";
+        readonly stepId: "manage-subscription";
+    }];
+    readonly edgesByStepId: {
+        readonly 'step-1': readonly [{
+            readonly toStepId: "step-2";
+        }];
+        readonly 'step-2': readonly [{
+            readonly toStepId: "email-capture";
+        }];
+        readonly 'email-capture': readonly [{
+            readonly toStepId: "paywall";
+        }];
+        readonly paywall: readonly [{
+            readonly toStepId: "subscription-started";
+        }];
+        readonly 'paywall-b': readonly [{
+            readonly toStepId: "subscription-started";
+        }];
+    };
+    readonly branches: readonly [{
+        readonly id: "device-owners";
+        readonly name: "Device owners";
+        readonly sourceStepId: "step-2";
+        readonly stepIds: readonly ["email-capture", "paywall"];
+    }];
+    readonly experiments: readonly [{
+        readonly experimentId: "paywall-offer";
+        readonly stepId: "paywall";
+        readonly variants: readonly [{
+            readonly variantKey: "control";
+            readonly routeToStepId: "paywall";
+        }, {
+            readonly variantKey: "variant-b";
+            readonly routeToStepId: "paywall-b";
+        }];
+    }];
+};
+export declare const wrongSubscriptionTerminalManifest: {
+    steps: ({
+        readonly id: "step-1";
+        readonly name: "step-one";
+        readonly path: "/step-1";
+        readonly filePath: "src/steps/step-01.tsx";
+        readonly componentKey: "stepOne";
+        readonly type: "intro_hero";
+        readonly title: "Introduction";
+    } | {
+        readonly id: "step-2";
+        readonly name: "device-choice";
+        readonly path: "/step-2";
+        readonly filePath: "src/steps/step-02.tsx";
+        readonly componentKey: "stepTwo";
+        readonly type: "multi_select_choice";
+        readonly choice: {
+            readonly answerKey: "selectedDevices";
+            readonly allowEmpty: true;
+        };
+        readonly title: "Choose devices";
+    } | {
+        readonly id: "email-capture";
+        readonly name: "email-capture";
+        readonly path: "/email-capture";
+        readonly filePath: "src/steps/step-31-email-capture.tsx";
+        readonly componentKey: "stepEmailCapture";
+        readonly type: "form_input";
+        readonly title: "Email capture";
+    } | {
+        readonly id: "paywall";
+        readonly name: "paywall";
+        readonly path: "/paywall";
+        readonly filePath: "src/steps/step-32-paywall.tsx";
+        readonly componentKey: "stepPaywall";
+        readonly type: "paywall_offer";
+        readonly kind: "paywall";
+        readonly title: "Paywall";
+    } | {
+        readonly id: "paywall-b";
+        readonly name: "paywall-b";
+        readonly path: "/paywall-b";
+        readonly filePath: "src/steps/step-32b-paywall-b.tsx";
+        readonly componentKey: "stepPaywallB";
+        readonly type: "paywall_offer";
+        readonly kind: "paywall";
+        readonly title: "Paywall B";
+    } | {
+        readonly id: "manage-subscription";
+        readonly name: "manage-subscription";
+        readonly path: "/manage-subscription";
+        readonly filePath: "src/steps/step-35-manage-subscription.tsx";
+        readonly componentKey: "stepManageSubscription";
+        readonly type: "subscription_management";
+        readonly kind: "manage-subscription";
+        readonly title: "Manage subscription";
+    } | {
+        type: "subscription_handoff";
+        id: "subscription-started";
+        name: "subscription-started";
+        path: "/subscription-started";
+        filePath: "src/steps/step-33-subscription-started.tsx";
+        componentKey: "stepSubscriptionStarted";
+        kind: "subscription-handoff";
+        title: "Subscription started";
+    })[];
+    templateArchitectureVersion: 1;
+    stepContractVersion: 2;
+    meta: {
+        readonly title: "Contract fixture";
+        readonly description: "A valid version 2 funnel contract fixture.";
+    };
+    viewport: {
+        readonly width: 390;
+        readonly height: 844;
+    };
+    assets: {};
+    entryPoints: readonly [{
+        readonly id: "default";
+        readonly stepId: "step-1";
+        readonly isDefault: true;
+    }, {
+        readonly id: "manage-subscription";
+        readonly stepId: "manage-subscription";
+    }];
+    edgesByStepId: {
+        readonly 'step-1': readonly [{
+            readonly toStepId: "step-2";
+        }];
+        readonly 'step-2': readonly [{
+            readonly toStepId: "email-capture";
+        }];
+        readonly 'email-capture': readonly [{
+            readonly toStepId: "paywall";
+        }];
+        readonly paywall: readonly [{
+            readonly toStepId: "subscription-started";
+        }];
+        readonly 'paywall-b': readonly [{
+            readonly toStepId: "subscription-started";
+        }];
+    };
+    branches: readonly [{
+        readonly id: "device-owners";
+        readonly name: "Device owners";
+        readonly sourceStepId: "step-2";
+        readonly stepIds: readonly ["email-capture", "paywall"];
+    }];
+    experiments: readonly [{
+        readonly experimentId: "paywall-offer";
+        readonly stepId: "paywall";
+        readonly variants: readonly [{
+            readonly variantKey: "control";
+            readonly routeToStepId: "paywall";
+        }, {
+            readonly variantKey: "variant-b";
+            readonly routeToStepId: "paywall-b";
+        }];
+    }];
+};

package/dist/validation/fixtures/invalid-reserved-identities.js ADDED Viewed

@@ -0,0 +1,20 @@
+import { validV2ProjectManifest } from './valid-v2-project.js';
+export const scratchcardMisclassifiedManifest = Object.assign(Object.assign({}, validV2ProjectManifest), { steps: [
+        ...validV2ProjectManifest.steps,
+        {
+            id: 'step-4',
+            name: 'scratchcard',
+            path: '/step-4',
+            filePath: 'src/steps/step-04.tsx',
+            componentKey: 'stepFour',
+            type: 'paywall_offer',
+            kind: 'paywall',
+            title: 'Scratchcard',
+        },
+    ] });
+export const wrongSubscriptionTerminalManifest = Object.assign(Object.assign({}, validV2ProjectManifest), { steps: validV2ProjectManifest.steps.map((step) => {
+        if (step.id !== 'subscription-started') {
+            return step;
+        }
+        return Object.assign(Object.assign({}, step), { type: 'subscription_handoff' });
+    }) });