@delmaredigital/payload-experiments 0.0.0-stage → 0.1.0-rc.6

package/dist/proxy/resolve.js

@@ -0,0 +1,163 @@
+import { XP_HEADER, XP_REQUEST_HEADER } from '../constants.js';
+import { createManifestCache } from '../manifest/cache.js';
+import { assign, fillFlagPoints } from '../runtime/assign.js';
+import { sign } from '../runtime/signing.js';
+import { requestAttributes } from '../runtime/normalisePath.js';
+import { isBot } from '../runtime/bot.js';
+import { cookieAttributes, encodeUnitCookie, mintUnitId, verifyUnitCookie } from '../runtime/cookie.js';
+import { encodeAssignmentsHeader } from '../runtime/header.js';
+import { verifyPreviewToken } from '../runtime/previewToken.js';
+import { pageRewrite } from './pageRewrite.js';
+import { skipPath } from './skip.js';
+import { controlAssignments, emptyAssignments } from './control.js';
+import { consentFallback } from './consentFallback.js';
+const caches = new WeakMap();
+export async function resolveExperiments(request, proxyRuntime) {
+    const requestHeaders = new Headers(request.headers);
+    const result = {
+        requestHeaders,
+        requestCookies: [],
+        setCookies: []
+    };
+    for (const name of [
+        ...requestHeaders.keys()
+    ])if (name.startsWith('x-xp-')) requestHeaders.delete(name);
+    if (skipPath(request.nextUrl.pathname, proxyRuntime.apiRoute)) return result;
+    let consent = false;
+    try {
+        consent = proxyRuntime.cookie.consent?.(request) !== false;
+    } catch  {
+        console.error('[payload-experiments] consent failed; treating consent as false');
+    }
+    const requestContext = `${request.method}|${request.nextUrl.pathname}${request.nextUrl.search}|${consent ? 'c1' : 'c0'}`;
+    const signedContext = `${requestContext}|${sign(`xp:request:${requestContext}`, proxyRuntime.secrets)}`;
+    if (Buffer.byteLength(signedContext) <= 2048) requestHeaders.set(XP_REQUEST_HEADER, signedContext);
+    const name = proxyRuntime.cookie.name;
+    let visitorId = consent ? verifyUnitCookie(request.cookies.get(name)?.value, proxyRuntime.secrets) ?? undefined : undefined;
+    if (!consent) {
+        const cookies = (requestHeaders.get('cookie') ?? '').split(';').map((cookie)=>cookie.trim()).filter((cookie)=>cookie && cookie.split('=', 1)[0]?.trim() !== name);
+        if (cookies.length) requestHeaders.set('cookie', cookies.join('; '));
+        else requestHeaders.delete('cookie');
+    } else if (!visitorId) {
+        visitorId = mintUnitId();
+        const value = encodeUnitCookie(visitorId, proxyRuntime.secrets);
+        result.requestCookies.push({
+            name,
+            value
+        });
+        result.setCookies.push({
+            name,
+            value,
+            ...cookieAttributes(proxyRuntime, {
+                https: request.nextUrl.protocol === 'https:'
+            })
+        });
+        const cookies = (request.headers.get('cookie') ?? '').split(';').map((cookie)=>cookie.trim()).filter((cookie)=>cookie && cookie.split('=', 1)[0] !== name);
+        cookies.push(`${name}=${value}`);
+        requestHeaders.set('cookie', cookies.join('; '));
+    }
+    let resolvedUnit = {
+        attributes: {}
+    };
+    try {
+        resolvedUnit = await proxyRuntime.getUnit?.(request) ?? resolvedUnit;
+    } catch  {
+        console.error('[payload-experiments] getUnit failed; treating session as unknown');
+        resolvedUnit = {
+            attributes: {},
+            sessionUnknown: true
+        };
+    }
+    const { attributes: unitAttributes, sessionUnknown } = resolvedUnit;
+    const userId = consent ? resolvedUnit.userId : undefined;
+    const attributes = requestAttributes(unitAttributes, request.nextUrl.pathname);
+    let cache = caches.get(proxyRuntime);
+    if (!cache && proxyRuntime.loadManifest) {
+        cache = createManifestCache(proxyRuntime.loadManifest);
+        caches.set(proxyRuntime, cache);
+    }
+    const manifest = await cache?.get() ?? null;
+    const now = Math.floor(Date.now() / 1000);
+    const token = verifyPreviewToken(request.nextUrl.searchParams.get('xp_preview') ?? '', proxyRuntime.secrets, now);
+    const previewExperiment = token && manifest?.experiments.find((experiment)=>experiment.id === token.e && experiment.phase === token.p && (experiment.status === 'running' || experiment.status === 'decided') && experiment.arms.some((arm)=>arm.key === token.a));
+    const currentManifest = manifest ?? {
+        v: 1,
+        revision: 0,
+        experiments: [],
+        flagDefaults: {},
+        archivedWinners: {},
+        archivedPages: {}
+    };
+    const context = {
+        visitorId,
+        userId,
+        staff: attributes.staff === true,
+        bot: isBot(request.headers.get('user-agent')),
+        preview: Boolean(previewExperiment),
+        sessionUnknown: sessionUnknown ?? false,
+        method: request.method
+    };
+    let assignments;
+    let assignmentFailed = false;
+    if (!consent) {
+        try {
+            assignments = consentFallback(currentManifest, attributes, context);
+        } catch  {
+            console.error('[payload-experiments] consent fallback failed; serving non-exposable control');
+            assignmentFailed = true;
+            try {
+                assignments = controlAssignments(currentManifest, context);
+            } catch  {
+                assignments = emptyAssignments(context);
+            }
+        }
+    } else {
+        try {
+            assignments = assign(currentManifest, {
+                visitorId,
+                userId,
+                sessionUnknown
+            }, attributes, {
+                ...context,
+                now
+            });
+        } catch  {
+            console.error('[payload-experiments] assign failed; serving non-exposable control');
+            assignmentFailed = true;
+            try {
+                assignments = controlAssignments(currentManifest, context);
+            } catch  {
+                assignments = emptyAssignments(context);
+            }
+        }
+    }
+    if (previewExperiment && token) {
+        if (consent && !assignmentFailed) {
+            assignments.deferred = assignments.deferred.filter((slug)=>slug !== previewExperiment.slug);
+            assignments.bySlug[previewExperiment.slug] = {
+                slug: previewExperiment.slug,
+                experimentId: previewExperiment.id,
+                arm: token.a,
+                phase: previewExperiment.phase,
+                exposable: false,
+                policy: previewExperiment.exposurePolicy,
+                source: 'preview'
+            };
+            fillFlagPoints(assignments, currentManifest);
+        }
+    }
+    if (token) result.responseHeaders = new Headers({
+        'Cache-Control': 'no-store'
+    });
+    if (manifest && !assignmentFailed) result.rewrite = pageRewrite(manifest, assignments, request.nextUrl);
+    try {
+        requestHeaders.set(XP_HEADER, encodeAssignmentsHeader(assignments, {
+            secrets: proxyRuntime.secrets,
+            manifest: manifest ?? undefined
+        }));
+    } catch  {
+    // The server recomputes from the signed cookie and request context.
+    // Without request context it fails closed; signed c0 keeps recompute identity-free.
+    }
+    return result;
+}

package/dist/proxy/skip.d.ts

@@ -0,0 +1 @@
+export declare function skipPath(path: string, apiRoute: string): boolean;

package/dist/proxy/skip.js

@@ -0,0 +1,9 @@
+const ASSET_EXTENSION = /\.(?:js|mjs|css|map|png|jpg|jpeg|gif|webp|avif|svg|ico|woff|woff2|ttf|otf|eot|txt|xml|json|pdf|webmanifest|mp4|webm|mp3|wav)$/i;
+export function skipPath(path, apiRoute) {
+    const under = (prefix)=>path === prefix || path.startsWith(`${prefix}/`);
+    const apiPrefix = apiRoute.replace(/\/+$/, '');
+    // Only the last segment's extension counts, and only for known asset types: `/blog/v1.2`
+    // and `/users/john.doe` are pages; a path ending in `.js` is treated as a script.
+    const asset = ASSET_EXTENSION.test(path.slice(path.lastIndexOf('/') + 1));
+    return under('/admin') || under('/_next') || apiPrefix !== '' && under(apiPrefix) || asset;
+}

package/dist/puck/ExperimentPicker.d.ts

@@ -0,0 +1,5 @@
+import type { ExperimentRef } from '../types/puck.js';
+export declare function ExperimentPicker({ value, onChange }: {
+    value: ExperimentRef | null;
+    onChange: (value: ExperimentRef | null) => void;
+}): import("react").JSX.Element;

package/dist/puck/ExperimentPicker.js

@@ -0,0 +1,88 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { pickerCopy } from './copy.js';
+function isExperimentOption(value) {
+    if (!value || typeof value !== 'object') return false;
+    const doc = value;
+    return (typeof doc.id === 'string' || typeof doc.id === 'number') && typeof doc.slug === 'string' && typeof doc.name === 'string' && typeof doc.status === 'string' && Object.hasOwn(pickerCopy.statuses, doc.status);
+}
+export function ExperimentPicker({ value, onChange }) {
+    const [experiments, setExperiments] = useState([]);
+    const [state, setState] = useState('loading');
+    useEffect(()=>{
+        let active = true;
+        const controller = new AbortController();
+        async function load() {
+            try {
+                const response = await fetch('/api/xp-experiments?where[kind][equals]=block&depth=0&limit=100&sort=-updatedAt', {
+                    credentials: 'include',
+                    signal: controller.signal
+                });
+                if (!active) return;
+                if (!response.ok) {
+                    setState(response.status === 403 ? 'forbidden' : 'error');
+                    return;
+                }
+                const data = await response.json();
+                if (!active) return;
+                if (!data || typeof data !== 'object' || !('docs' in data) || !Array.isArray(data.docs)) {
+                    setState('error');
+                    return;
+                }
+                setExperiments(data.docs.filter(isExperimentOption));
+                setState('ready');
+            } catch  {
+                if (active) setState('error');
+            }
+        }
+        void load();
+        return ()=>{
+            active = false;
+            controller.abort();
+        };
+    }, []);
+    const selected = value ? String(value.id) : '';
+    return /*#__PURE__*/ _jsxs("div", {
+        children: [
+            /*#__PURE__*/ _jsxs("select", {
+                "aria-label": pickerCopy.label,
+                value: selected,
+                disabled: state === 'loading',
+                onChange: (event)=>{
+                    const experiment = experiments.find((doc)=>String(doc.id) === event.currentTarget.value);
+                    onChange(experiment ? {
+                        id: experiment.id,
+                        slug: experiment.slug
+                    } : null);
+                },
+                children: [
+                    /*#__PURE__*/ _jsx("option", {
+                        value: "",
+                        children: pickerCopy.none
+                    }),
+                    value && !experiments.some((doc)=>String(doc.id) === selected) ? /*#__PURE__*/ _jsx("option", {
+                        value: selected,
+                        children: value.slug
+                    }) : null,
+                    experiments.map((doc)=>/*#__PURE__*/ _jsxs("option", {
+                            value: String(doc.id),
+                            children: [
+                                doc.name,
+                                " · ",
+                                pickerCopy.statuses[doc.status]
+                            ]
+                        }, doc.id))
+                ]
+            }),
+            state === 'loading' ? /*#__PURE__*/ _jsx("p", {
+                role: "status",
+                children: pickerCopy.loading
+            }) : null,
+            state === 'error' || state === 'forbidden' ? /*#__PURE__*/ _jsx("p", {
+                role: "alert",
+                children: pickerCopy[state]
+            }) : null
+        ]
+    });
+}

package/dist/puck/ExperimentSlot.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentConfig } from '@puckeditor/core';
+import type { ExperimentSlotProps } from '../types/puck.js';
+export declare const ExperimentSlot: ComponentConfig<ExperimentSlotProps>;

package/dist/puck/ExperimentSlot.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ViewportExposure } from '../client/ViewportExposure.js';
+import { experimentSlotDefaultProps, experimentSlotFields, experimentSlotLabel } from './slotConfig.js';
+import { slotToRender } from './slot.model.js';
+export const ExperimentSlot = {
+    label: experimentSlotLabel,
+    fields: experimentSlotFields,
+    defaultProps: experimentSlotDefaultProps,
+    render: (props)=>{
+        const Slot = props[slotToRender(props)];
+        return /*#__PURE__*/ _jsx(ViewportExposure, {
+            expose: props.xpExpose,
+            children: /*#__PURE__*/ _jsx(Slot, {})
+        });
+    }
+};

package/dist/puck/copy.d.ts

@@ -0,0 +1,14 @@
+export declare const pickerCopy: {
+    readonly label: "Experiment";
+    readonly none: "No experiment";
+    readonly loading: "Loading experiments…";
+    readonly error: "Couldn't load experiments.";
+    readonly forbidden: "You can't see experiments. Ask an admin.";
+    readonly statuses: {
+        readonly draft: "Draft";
+        readonly running: "Running";
+        readonly stopped: "Stopped";
+        readonly decided: "Decided";
+        readonly archived: "Archived";
+    };
+};

package/dist/puck/copy.js

@@ -0,0 +1,14 @@
+export const pickerCopy = {
+    label: 'Experiment',
+    none: 'No experiment',
+    loading: 'Loading experiments…',
+    error: "Couldn't load experiments.",
+    forbidden: "You can't see experiments. Ask an admin.",
+    statuses: {
+        draft: 'Draft',
+        running: 'Running',
+        stopped: 'Stopped',
+        decided: 'Decided',
+        archived: 'Archived'
+    }
+};

package/dist/puck/editor/CreateExperimentDrawer.d.ts

@@ -0,0 +1,5 @@
+import type { ExperimentRef } from '../../types/puck.js';
+export declare function CreateExperimentDrawer({ onCreate, onClose }: {
+    onCreate: (experiment: ExperimentRef) => void;
+    onClose: () => void;
+}): import("react").JSX.Element;

package/dist/puck/editor/CreateExperimentDrawer.js

@@ -0,0 +1,120 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, useState } from 'react';
+import { slugify } from './editor.model.js';
+import { editorCopy } from './copy.js';
+export function CreateExperimentDrawer({ onCreate, onClose }) {
+    const titleId = useId();
+    const [name, setName] = useState('');
+    const [slug, setSlug] = useState('');
+    const [slugEdited, setSlugEdited] = useState(false);
+    const [pending, setPending] = useState(false);
+    const [error, setError] = useState('');
+    async function submitNew() {
+        setPending(true);
+        setError('');
+        try {
+            const response = await fetch('/api/xp-experiments', {
+                method: 'POST',
+                credentials: 'include',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({
+                    name,
+                    slug,
+                    kind: 'block',
+                    unitType: 'visitor'
+                })
+            });
+            const body = await response.json();
+            if (!response.ok) {
+                setError(typeof body?.errors?.[0]?.message === 'string' ? body.errors[0].message : editorCopy.createError);
+                return;
+            }
+            const doc = body?.doc;
+            if (!doc || typeof doc.id !== 'string' && typeof doc.id !== 'number' || typeof doc.slug !== 'string') {
+                setError(editorCopy.createError);
+                return;
+            }
+            onCreate({
+                id: doc.id,
+                slug: doc.slug
+            });
+            onClose();
+        } catch  {
+            setError(editorCopy.createError);
+        } finally{
+            setPending(false);
+        }
+    }
+    return /*#__PURE__*/ _jsxs("aside", {
+        role: "dialog",
+        "aria-labelledby": titleId,
+        style: {
+            padding: 16,
+            border: '1px solid #aaa',
+            background: 'Canvas',
+            color: 'CanvasText'
+        },
+        children: [
+            /*#__PURE__*/ _jsx("h3", {
+                id: titleId,
+                children: editorCopy.createLabel
+            }),
+            /*#__PURE__*/ _jsxs("label", {
+                style: {
+                    display: 'block',
+                    marginBottom: 8
+                },
+                children: [
+                    editorCopy.name,
+                    /*#__PURE__*/ _jsx("input", {
+                        value: name,
+                        disabled: pending,
+                        onChange: (event)=>{
+                            setName(event.currentTarget.value);
+                            if (!slugEdited) setSlug(slugify(event.currentTarget.value));
+                        }
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("label", {
+                style: {
+                    display: 'block',
+                    marginBottom: 8
+                },
+                children: [
+                    editorCopy.slug,
+                    /*#__PURE__*/ _jsx("input", {
+                        value: slug,
+                        maxLength: 64,
+                        disabled: pending,
+                        onChange: (event)=>{
+                            setSlugEdited(true);
+                            setSlug(event.currentTarget.value);
+                        }
+                    })
+                ]
+            }),
+            error ? /*#__PURE__*/ _jsx("p", {
+                role: "alert",
+                children: error
+            }) : null,
+            /*#__PURE__*/ _jsx("button", {
+                type: "button",
+                disabled: pending || !name.trim() || !slug.trim(),
+                onClick: ()=>{
+                    void submitNew();
+                },
+                children: pending ? editorCopy.creating : editorCopy.createLabel
+            }),
+            /*#__PURE__*/ _jsx("button", {
+                type: "button",
+                disabled: pending,
+                onClick: onClose,
+                children: editorCopy.cancel
+            })
+        ]
+    });
+}

package/dist/puck/editor/ExperimentSlotEditor.d.ts

@@ -0,0 +1,3 @@
+import { type ComponentConfig } from '@puckeditor/core';
+import type { ExperimentSlotProps } from '../../types/puck.js';
+export declare const ExperimentSlotEditor: ComponentConfig<ExperimentSlotProps>;