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

package/dist/admin/results/chart.model.js

@@ -0,0 +1,52 @@
+/** Selects stored primary comparisons and display domains; performs no inference. */ export function chartModel({ series = [], metricId, phase, contentChanges = [] }) {
+    const variants = phase.arms.filter((arm)=>arm.kind === 'variant').map((arm)=>({
+            arm: arm.key,
+            label: arm.label,
+            points: series.filter((point)=>point.metricId === metricId && point.arm === arm.key).map((point)=>({
+                    t: Date.parse(point.computedAt),
+                    lift: point.lift,
+                    lo: point.ci[0] !== null && Number.isFinite(point.ci[0]) ? point.ci[0] : null,
+                    hi: point.ci[1] !== null && Number.isFinite(point.ci[1]) ? point.ci[1] : null
+                })).filter((point)=>Number.isFinite(point.t) && Number.isFinite(point.lift)).sort((a, b)=>a.t - b.t)
+        })).filter((variant)=>variant.points.length > 0);
+    const points = variants.flatMap((variant)=>variant.points);
+    if (points.length < 2) return {
+        empty: true
+    };
+    let from = points[0].t, to = from, low = 0, high = 0;
+    for (const point of points){
+        from = Math.min(from, point.t);
+        to = Math.max(to, point.t);
+        for (const value of [
+            point.lift,
+            point.lo,
+            point.hi
+        ])if (value !== null) {
+            low = Math.min(low, value);
+            high = Math.max(high, value);
+        }
+    }
+    if (from === to) return {
+        empty: true
+    };
+    return {
+        empty: false,
+        xDomain: [
+            from,
+            to
+        ],
+        yDomain: low === high ? [
+            -1,
+            1
+        ] : [
+            low,
+            high
+        ],
+        variants,
+        // Opaque editor ids never enter the chart model or its accessible text.
+        markers: contentChanges.map(({ at })=>({
+                t: Date.parse(at),
+                at
+            })).filter((marker)=>Number.isFinite(marker.t) && marker.t >= from && marker.t <= to)
+    };
+}

package/dist/admin/results/format.d.ts

@@ -0,0 +1,10 @@
+import type { MetricSource } from '../../types/contracts.js';
+export declare function formatCount(value: number | null | undefined): string;
+export declare function formatNumber(value: number | null | undefined): string;
+/** Increase precision near zero so a finite, nonzero bound never loses its sign. */
+export declare function formatPercent(value: number | null | undefined, signed?: boolean): string;
+export declare function formatCurrency(value: number | null | undefined, currency?: string): string;
+/** Revenue alone is money; counts and conversion metrics never receive a currency symbol. */
+export declare function formatMetric(value: number | null | undefined, kind: MetricSource['kind'], currency?: string): string;
+export declare function formatProbability(value: number | null | undefined): string;
+export declare function formatCI(ci: readonly [number | null, number | null] | undefined): string;

package/dist/admin/results/format.js

@@ -0,0 +1,55 @@
+import { atLeast, atMost, intervalCopy } from '../copy/results.js';
+const locale = 'en-US';
+const missing = '—';
+const finite = (value)=>typeof value === 'number' && Number.isFinite(value);
+const minus = (value)=>value.replace(/-/g, '−');
+export function formatCount(value) {
+    return finite(value) ? new Intl.NumberFormat(locale, {
+        maximumFractionDigits: 0
+    }).format(value) : missing;
+}
+export function formatNumber(value) {
+    return finite(value) ? minus(new Intl.NumberFormat(locale, {
+        maximumFractionDigits: 2
+    }).format(value)) : missing;
+}
+/** Increase precision near zero so a finite, nonzero bound never loses its sign. */ export function formatPercent(value, signed = false) {
+    if (!finite(value)) return missing;
+    const magnitude = Math.abs(value) * 100;
+    const digits = magnitude > 0 ? Math.max(1, 1 - Math.floor(Math.log10(magnitude))) : 1;
+    const options = digits > 20 ? {
+        style: 'percent',
+        notation: 'scientific',
+        maximumSignificantDigits: 3
+    } : {
+        style: 'percent',
+        minimumFractionDigits: 1,
+        maximumFractionDigits: digits
+    };
+    return minus(new Intl.NumberFormat(locale, {
+        ...options,
+        signDisplay: signed ? 'exceptZero' : 'auto'
+    }).format(value));
+}
+export function formatCurrency(value, currency = 'USD') {
+    return finite(value) ? minus(new Intl.NumberFormat(locale, {
+        style: 'currency',
+        currency
+    }).format(value)) : missing;
+}
+/** Revenue alone is money; counts and conversion metrics never receive a currency symbol. */ export function formatMetric(value, kind, currency = 'USD') {
+    return kind === 'revenue' ? formatCurrency(value, currency) : kind === 'binomial' ? formatPercent(value) : formatNumber(value);
+}
+export function formatProbability(value) {
+    return finite(value) ? new Intl.NumberFormat(locale, {
+        maximumSignificantDigits: 3
+    }).format(value) : missing;
+}
+export function formatCI(ci) {
+    if (!ci || ci.some((bound)=>bound !== null && !finite(bound))) return missing;
+    const [low, high] = ci;
+    if (low === null && high === null) return missing;
+    if (high === null) return atLeast(formatPercent(low, true));
+    if (low === null) return atMost(formatPercent(high, true));
+    return intervalCopy(formatPercent(low, true), formatPercent(high, true));
+}

package/dist/admin/results/results.model.d.ts

@@ -0,0 +1,105 @@
+import type { DocId, Status } from '../../types/contracts.js';
+import type { PhaseSummary, ResultsResponse } from '../../types/endpoints.js';
+import type { Snapshot } from '../../types/snapshot.js';
+type Metric = Snapshot['metrics'][number];
+type Arm = Metric['perArm'][number];
+type Decision = {
+    phase: number;
+    winnerArm?: string;
+};
+type DisplaySnapshot = Snapshot;
+export declare function defaultRound({ phases, decision, status }: Pick<ResultsResponse, 'phases'> & {
+    decision?: Decision | null;
+    status: Status;
+}): number | null;
+export declare function roundOptions(phases: PhaseSummary[]): {
+    value: number;
+    label: string;
+}[];
+export type VerdictCardModel = {
+    title: string;
+    finding: string | null;
+    detail: string | null;
+} | {
+    headline: string;
+    detail: string;
+    guardrailLine?: string;
+};
+export declare function verdictCard({ snapshot, decisionSnapshot, isDecidedTestRound, winnerLabel }: {
+    snapshot: Snapshot;
+    decisionSnapshot?: Snapshot;
+    isDecidedTestRound: boolean;
+    winnerLabel: string;
+}): VerdictCardModel;
+export declare function rolloutLine(snapshot: DisplaySnapshot, phase: PhaseSummary, phases: PhaseSummary[], decision?: Pick<Decision, 'winnerArm'>): string | null;
+export interface CappedCellModel {
+    statistic: string;
+    totalLine?: string;
+    cappedLine?: string;
+    notice?: string;
+}
+export declare function cappedCell({ metric, arm, caps }: {
+    metric: Pick<Metric, 'metricId' | 'kind'> & {
+        capNotice?: 'no-history';
+    };
+    arm?: Arm;
+    caps?: Snapshot['params']['caps'];
+}): CappedCellModel;
+export type ComparisonModel = {
+    method: 'sequential';
+    lift: string;
+    ci: string;
+    adjustedCI?: string;
+    pValue: string;
+    pValueAdjusted?: string;
+    significance: string;
+} | {
+    method: 'bayesian';
+    chanceToWin: string;
+    ci: string;
+    risk: string;
+    significance: string;
+};
+export interface ArmRow {
+    key: string;
+    label: string;
+    n: string;
+    value: string;
+    capped: CappedCellModel;
+    baseline?: string;
+    comparison?: ComparisonModel;
+}
+export declare function armRows({ snapshot, phase, metricId }: {
+    snapshot: Snapshot;
+    phase: PhaseSummary;
+    metricId: DocId;
+}): ArmRow[];
+export declare function guardrailChips(snapshot: Snapshot): {
+    name: string;
+    status: "Failing" | "OK" | "Watch" | "Too little data";
+}[];
+interface RoundLineInput {
+    snapshot: DisplaySnapshot;
+    phaseKind: Snapshot['phaseKind'];
+    status: Status;
+}
+export declare function powerLine({ snapshot, phaseKind, status }: RoundLineInput): string | null;
+export interface ResultsContext {
+    phase?: PhaseSummary;
+    minExposuresPerArm?: number;
+    inLayer?: boolean;
+    layerSlices?: number | readonly number[];
+    allocation?: number;
+}
+/** Only selects stored counts; never estimates sample sizes or power in the UI. */
+export declare function collectingLine({ snapshot, phaseKind, status }: RoundLineInput, ctx?: ResultsContext): string | null;
+export interface DataQualityItem {
+    id: string;
+    message: string;
+    detail?: string;
+    nextStep: string;
+    shares?: string[];
+}
+export declare function dataQuality(snapshot: DisplaySnapshot, ctx?: ResultsContext): DataQualityItem[];
+export declare function verdictLabel(snapshot: Snapshot): string;
+export {};

package/dist/admin/results/results.model.js

@@ -0,0 +1,175 @@
+import { armLabel, phaseKindLabel, verdictCodeLabel } from '../labels.js';
+import { RESULTS_COPY, cappedCount, collectingCopy, conflictCopy, decidedTitle, exclusionCopy, ignoredCopy, metricUnavailable, moreDays, roundLabel, shareCopy, shippingTitle, srmP, uncappedTotal } from '../copy/results.js';
+import { formatCI, formatCount, formatMetric, formatPercent, formatProbability } from './format.js';
+export function defaultRound({ phases, decision, status }) {
+    if (status === 'decided' && decision) return decision.phase;
+    return phases.reduce((latest, phase)=>latest === null || phase.phase > latest ? phase.phase : latest, null);
+}
+export function roundOptions(phases) {
+    return phases.map((phase)=>({
+            value: phase.phase,
+            label: roundLabel(phase.phase, phaseKindLabel(phase.phaseKind))
+        }));
+}
+export function verdictCard({ snapshot, decisionSnapshot, isDecidedTestRound, winnerLabel }) {
+    if (isDecidedTestRound) return {
+        title: decidedTitle(winnerLabel),
+        finding: decisionSnapshot?.verdict.finding ?? null,
+        detail: decisionSnapshot?.verdict.detail ?? null
+    };
+    const { headline, detail, guardrailLine } = snapshot.verdict;
+    return {
+        headline,
+        detail,
+        ...guardrailLine === undefined ? {} : {
+            guardrailLine
+        }
+    };
+}
+export function rolloutLine(snapshot, phase, phases, decision) {
+    if (snapshot.phaseKind !== 'rollout') return null;
+    const newestRollout = phases.filter((phase)=>phase.phaseKind === 'rollout').reduce((latest, phase)=>latest === null || phase.phase > latest ? phase.phase : latest, null);
+    const winner = snapshot.winnerArm ?? (snapshot.phase === newestRollout ? decision?.winnerArm : undefined);
+    return shippingTitle(winner ? phase.arms.find((arm)=>arm.key === winner)?.label ?? armLabel(winner) : RESULTS_COPY.shippedGroup);
+}
+export function cappedCell({ metric, arm, caps }) {
+    const cap = caps?.[metric.metricId];
+    const model = {
+        statistic: formatMetric(arm?.mean, metric.kind)
+    };
+    if (metric.kind !== 'revenue') return model;
+    if (cap?.resolvedCap === null || !cap && metric.capNotice === 'no-history') model.notice = RESULTS_COPY.noCap;
+    if (arm?.capped) {
+        model.totalLine = uncappedTotal(formatMetric(arm.capped.uncappedTotal, metric.kind));
+        model.cappedLine = cappedCount(formatCount(arm.capped.cappedCount), formatMetric(cap?.resolvedCap, metric.kind));
+    }
+    return model;
+}
+export function armRows({ snapshot, phase, metricId }) {
+    const metric = snapshot.metrics.find((metric)=>metric.metricId === metricId);
+    return phase.arms.map((group)=>{
+        const arm = metric?.perArm.find((arm)=>arm.arm === group.key);
+        const cell = cappedCell({
+            metric: metric ?? phase.metrics.find((metric)=>metric.metricId === metricId) ?? {
+                metricId,
+                kind: 'count'
+            },
+            arm,
+            caps: snapshot.params.caps
+        });
+        const row = {
+            key: group.key,
+            label: group.label,
+            n: formatCount(arm?.n ?? snapshot.exposures.perArm[group.key]),
+            value: metric?.kind === 'binomial' ? formatCount(arm?.converters) : cell.statistic,
+            capped: cell
+        };
+        if (group.kind === 'holdout') return {
+            ...row,
+            baseline: snapshot.phaseKind === 'rollout' ? RESULTS_COPY.holdoutBaseline : RESULTS_COPY.holdout
+        };
+        if (group.kind === 'control' && snapshot.phaseKind === 'test') return {
+            ...row,
+            baseline: RESULTS_COPY.original
+        };
+        const comparison = metric?.comparisons.find((comparison)=>comparison.arm === group.key);
+        if (!comparison) return row;
+        const common = {
+            ci: formatCI(comparison.ci),
+            significance: RESULTS_COPY.significance[comparison.significant]
+        };
+        row.comparison = snapshot.method === 'bayesian' ? {
+            ...common,
+            method: 'bayesian',
+            chanceToWin: formatPercent(comparison.chanceToWin),
+            risk: formatPercent(comparison.risk)
+        } : {
+            ...common,
+            method: 'sequential',
+            lift: formatPercent(comparison.lift, true),
+            ...snapshot.alphaAdjusted !== snapshot.alpha && comparison.ciAdjusted !== undefined ? {
+                adjustedCI: formatCI(comparison.ciAdjusted)
+            } : {},
+            pValue: formatProbability(comparison.pValue),
+            ...snapshot.alphaAdjusted !== snapshot.alpha && comparison.pValueAdjusted !== undefined ? {
+                pValueAdjusted: formatProbability(comparison.pValueAdjusted)
+            } : {}
+        };
+        return row;
+    });
+}
+export function guardrailChips(snapshot) {
+    return snapshot.guardrails.map((guardrail)=>({
+            name: snapshot.metrics.find((metric)=>metric.metricId === guardrail.metricId)?.name ?? '—',
+            status: RESULTS_COPY.guardrails[guardrail.status]
+        }));
+}
+export function powerLine({ snapshot, phaseKind, status }) {
+    if (phaseKind !== 'test' || status !== 'running' || snapshot.verdict.code !== 'collecting') return null;
+    const { power } = snapshot;
+    if (power.feasible === false || power.daysRemaining !== null && power.daysRemaining > 90) return RESULTS_COPY.infeasible;
+    return power.daysRemaining !== null && power.daysRemaining >= 1 ? moreDays(formatCount(Math.ceil(power.daysRemaining))) : RESULTS_COPY.plannedEnd;
+}
+function comparedKeys(snapshot, phase) {
+    return phase ? phase.arms.filter((arm)=>arm.kind !== 'holdout' || snapshot.phaseKind === 'rollout').map((arm)=>arm.key) : Object.keys(snapshot.exposures.perArm).filter((key)=>key !== 'holdout' || snapshot.phaseKind === 'rollout');
+}
+function smallest(values) {
+    if (!values.length || values.some((value)=>value === undefined || !Number.isFinite(value))) return undefined;
+    return values.reduce((min, value)=>min === undefined || value !== undefined && value < min ? value : min, undefined);
+}
+/** Only selects stored counts; never estimates sample sizes or power in the UI. */ export function collectingLine({ snapshot, phaseKind, status }, ctx = {}) {
+    if (phaseKind === 'test' && status === 'decided') return null;
+    if (snapshot.verdict.code !== (phaseKind === 'rollout' ? 'rollout-collecting' : 'collecting')) return null;
+    const keys = comparedKeys(snapshot, ctx.phase);
+    const primary = snapshot.metrics.find((metric)=>metric.role === 'primary');
+    return collectingCopy(formatCount(smallest(keys.map((key)=>snapshot.exposures.perArm[key]))), formatCount(snapshot.minExposuresPerArm ?? ctx.minExposuresPerArm), formatCount(smallest(keys.map((key)=>primary?.perArm.find((arm)=>arm.arm === key)?.converters))), formatCount(primary ? snapshot.params.minSampleSizes[primary.metricId] : undefined));
+}
+export function dataQuality(snapshot, ctx = {}) {
+    const items = [];
+    const srmTotal = Object.keys(snapshot.srm.expected).reduce((total, key)=>total + (snapshot.exposures.perArm[key] ?? 0), 0);
+    if (snapshot.srm.flagged) items.push({
+        id: 'srm',
+        message: srmP(formatProbability(snapshot.srm.p)),
+        nextStep: RESULTS_COPY.srm,
+        shares: Object.entries(snapshot.srm.expected).map(([key, expected])=>shareCopy(ctx.phase?.arms.find((arm)=>arm.key === key)?.label ?? armLabel(key), formatPercent(expected), formatPercent(srmTotal > 0 ? (snapshot.exposures.perArm[key] ?? 0) / srmTotal : undefined)))
+    });
+    const exposures = snapshot.exposures;
+    if (exposures.excludedMultiArm > 0 || exposures.multiArmShare > 0) items.push({
+        id: 'multi-group',
+        message: RESULTS_COPY.multiGroup,
+        detail: exclusionCopy(formatCount(exposures.excludedMultiArm), formatPercent(exposures.multiArmShare)),
+        nextStep: RESULTS_COPY.multiGroupNext
+    });
+    if (exposures.armMismatch > 0) items.push({
+        id: 'mismatch',
+        message: RESULTS_COPY.mismatch,
+        detail: ignoredCopy(formatCount(exposures.armMismatch)),
+        nextStep: RESULTS_COPY.mismatchNext
+    });
+    if (exposures.identityConflictShare > 0) items.push({
+        id: 'identity',
+        message: RESULTS_COPY.identity,
+        detail: conflictCopy(formatPercent(exposures.identityConflictShare)),
+        nextStep: RESULTS_COPY.identityNext
+    });
+    if (snapshot.verdict.code === 'collecting' || snapshot.verdict.code === 'rollout-collecting') items.push({
+        id: 'too-few',
+        message: RESULTS_COPY.tooFew,
+        nextStep: RESULTS_COPY.tooFewNext
+    });
+    const slices = typeof ctx.layerSlices === 'number' ? ctx.layerSlices : ctx.layerSlices?.length;
+    if (ctx.inLayer && slices !== undefined && ctx.allocation !== undefined && slices < ctx.allocation) items.push({
+        id: 'layer',
+        message: RESULTS_COPY.layerFull,
+        nextStep: RESULTS_COPY.layerNext
+    });
+    for (const metric of snapshot.metrics)if (metric.unavailable !== undefined) items.push({
+        id: `metric-${metric.metricId}`,
+        message: metricUnavailable(metric.name, metric.unavailable),
+        nextStep: RESULTS_COPY.unavailableNext
+    });
+    return items;
+}
+export function verdictLabel(snapshot) {
+    return verdictCodeLabel(snapshot.verdict.code);
+}

package/dist/admin/review/ReviewPanel.d.ts

@@ -0,0 +1,2 @@
+import type { UIFieldClientProps } from 'payload';
+export declare function ReviewPanel(_props: UIFieldClientProps): import("react").JSX.Element;

package/dist/admin/review/ReviewPanel.js

@@ -0,0 +1,268 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { Button, useConfig, useDocumentInfo, useForm, useFormFields, useFormModified } from '@payloadcms/ui';
+import { useApi } from '../useApi.js';
+import { reloadPage } from '../reload.js';
+import { readArms } from '../arms/arms.model.js';
+import { PreviewLinks } from '../PreviewLinks.js';
+import { REVIEW_COPY as C } from '../copy/review.js';
+import { API_MESSAGES, LOCKED_MESSAGES } from '../copy/common.js';
+import { availableActions } from '../actions/actions.model.js';
+import { ConfirmDialog } from '../actions/ConfirmDialog.js';
+import { reviewView } from './review.model.js';
+export function ReviewPanel(_props) {
+    const { id, data } = useDocumentInfo();
+    const savedAt = typeof data?.updatedAt === 'string' ? data.updatedAt : undefined;
+    const { config, getEntityConfig } = useConfig();
+    const api = useApi();
+    const { dispatchFields, setModified } = useForm();
+    const modified = useFormModified();
+    const status = useFormFields(([fields])=>fields.status?.value ?? 'draft');
+    const kind = useFormFields(([fields])=>fields.kind?.value ?? 'block');
+    const armsJson = useFormFields(([fields])=>JSON.stringify(readArms(fields)));
+    const arms = JSON.parse(armsJson);
+    const metricFields = getEntityConfig({
+        collectionSlug: 'xp-metrics'
+    })?.fields;
+    const sourcesJson = JSON.stringify(metricFields?.find((field)=>field.name === 'source')?.admin?.custom?.sources ?? []);
+    const [preflight, setPreflight] = useState(null);
+    const [refresh, setRefresh] = useState(0);
+    const [loading, setLoading] = useState(true);
+    const [busy, setBusy] = useState(false);
+    const [confirmStart, setConfirmStart] = useState(false);
+    const inFlight = useRef(false);
+    const [error, setError] = useState(null);
+    const [metricKind, setMetricKind] = useState();
+    const [duration, setDuration] = useState('');
+    const [tuning, setTuning] = useState('');
+    useEffect(()=>{
+        if (id == null) return;
+        let active = true;
+        setLoading(true);
+        setError(null);
+        void api.preflight(id).then((result)=>{
+            if (!active) return;
+            if (result.ok && result.data) {
+                setPreflight(result.data);
+                setDuration(result.data.estimate ? String(result.data.estimate.plannedDurationDays) : '');
+                setTuning(result.data.estimate ? String(result.data.estimate.sequentialTuningParameter) : '');
+            } else {
+                setPreflight(null);
+                setError(result.ok ? API_MESSAGES.unreadable : result.message);
+            }
+            setLoading(false);
+        });
+        return ()=>{
+            active = false;
+        };
+    }, [
+        id,
+        api,
+        refresh,
+        savedAt
+    ]);
+    // The preflight wire shape contains the value, but the saved metric's source supplies its kind.
+    const metricId = preflight?.baseline?.metricId;
+    useEffect(()=>{
+        setMetricKind(undefined);
+        if (metricId == null) return;
+        const controller = new AbortController();
+        void (async ()=>{
+            try {
+                const response = await fetch(`${config.routes.api.replace(/\/$/, '')}/xp-metrics/${encodeURIComponent(metricId)}?depth=0`, {
+                    credentials: 'include',
+                    signal: controller.signal
+                });
+                if (!response.ok) return;
+                const metric = await response.json();
+                const sources = JSON.parse(sourcesJson);
+                if (!controller.signal.aborted) setMetricKind(sources.find((source)=>source.id === metric.source)?.kind);
+            } catch  {}
+        })();
+        return ()=>controller.abort();
+    }, [
+        metricId,
+        config.routes.api,
+        sourcesJson
+    ]);
+    if (id == null) return /*#__PURE__*/ _jsx("p", {
+        children: C.save
+    });
+    const view = preflight ? reviewView(preflight, {
+        status,
+        primaryMetricKind: metricKind
+    }) : null;
+    const editable = status === 'draft' || status === 'stopped';
+    const startAction = availableActions({
+        status,
+        kind,
+        arms,
+        canManage: true
+    }).find((action)=>action.id === 'start');
+    const pending = busy || confirmStart;
+    const lockedReason = status === 'running' ? LOCKED_MESSAGES.running : status === 'decided' ? LOCKED_MESSAGES.decided : LOCKED_MESSAGES.archived;
+    const validValues = duration.trim() !== '' && Number.isInteger(Number(duration)) && Number(duration) > 0 && tuning.trim() !== '' && Number.isFinite(Number(tuning)) && Number(tuning) >= 0;
+    function apply() {
+        if (!editable || pending || loading || !view?.applyValues || !validValues) return;
+        dispatchFields({
+            type: 'UPDATE',
+            path: 'analysis.plannedDurationDays',
+            value: Number(duration)
+        });
+        dispatchFields({
+            type: 'UPDATE',
+            path: 'analysis.sequentialTuningParameter',
+            value: Number(tuning)
+        });
+        setModified(true);
+        setRefresh((value)=>value + 1);
+    }
+    async function start() {
+        if (id == null || inFlight.current || pending || loading || modified || !view?.canStart) return;
+        if (status === 'stopped') {
+            setConfirmStart(true);
+            return;
+        }
+        inFlight.current = true;
+        setBusy(true);
+        setError(null);
+        const result = await api.start(id);
+        if (result.ok) {
+            reloadPage();
+            return;
+        }
+        setError(result.message);
+        inFlight.current = false;
+        setBusy(false);
+    }
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "xp-review",
+        children: [
+            loading ? /*#__PURE__*/ _jsx("p", {
+                role: "status",
+                children: C.loading
+            }) : null,
+            view && preflight ? /*#__PURE__*/ _jsxs(_Fragment, {
+                children: [
+                    /*#__PURE__*/ _jsx("ul", {
+                        children: view.checks.map((check, index)=>/*#__PURE__*/ _jsxs("li", {
+                                children: [
+                                    /*#__PURE__*/ _jsxs("span", {
+                                        children: [
+                                            check.ok ? '✓' : '✗',
+                                            " ",
+                                            check.ok ? check.done : check.hint
+                                        ]
+                                    }),
+                                    check.detail ? /*#__PURE__*/ _jsx("p", {
+                                        children: check.detail
+                                    }) : null
+                                ]
+                            }, index))
+                    }),
+                    /*#__PURE__*/ _jsx("ul", {
+                        children: view.placements.map((placement)=>/*#__PURE__*/ _jsxs("li", {
+                                children: [
+                                    placement.ok ? '✓' : '✗',
+                                    " ",
+                                    placement.title,
+                                    placement.detail ? /*#__PURE__*/ _jsx("p", {
+                                        children: placement.detail
+                                    }) : null
+                                ]
+                            }, `${placement.collection}/${placement.id}`))
+                    }),
+                    /*#__PURE__*/ _jsx("fieldset", {
+                        disabled: pending || loading,
+                        style: {
+                            border: 0,
+                            padding: 0
+                        },
+                        children: /*#__PURE__*/ _jsx(PreviewLinks, {
+                            experimentId: id,
+                            placements: preflight.placements,
+                            arms: arms
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        children: view.baseline
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        children: view.traffic
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        className: view.estimateWarning ? 'xp-review__warning' : undefined,
+                        style: view.estimateWarning ? {
+                            color: 'var(--theme-warning-600)'
+                        } : undefined,
+                        children: view.estimate
+                    }),
+                    view.applyValues ? /*#__PURE__*/ _jsxs(_Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsxs("label", {
+                                children: [
+                                    C.duration,
+                                    /*#__PURE__*/ _jsx("input", {
+                                        type: "number",
+                                        min: 1,
+                                        step: 1,
+                                        value: duration,
+                                        disabled: !editable || pending || loading,
+                                        onChange: (event)=>setDuration(event.target.value)
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("label", {
+                                children: [
+                                    C.tuning,
+                                    /*#__PURE__*/ _jsx("input", {
+                                        type: "number",
+                                        min: 0,
+                                        step: "any",
+                                        value: tuning,
+                                        disabled: !editable || pending || loading,
+                                        onChange: (event)=>setTuning(event.target.value)
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                disabled: !editable || pending || loading || !validValues,
+                                onClick: apply,
+                                children: C.apply
+                            })
+                        ]
+                    }) : null,
+                    !editable ? /*#__PURE__*/ _jsx("p", {
+                        children: lockedReason
+                    }) : null,
+                    modified ? /*#__PURE__*/ _jsx("p", {
+                        children: C.saveFirst
+                    }) : null,
+                    /*#__PURE__*/ _jsx(Button, {
+                        disabled: !view.canStart || modified || pending || loading,
+                        onClick: ()=>{
+                            void start();
+                        },
+                        children: startAction?.label ?? C.start
+                    })
+                ]
+            }) : null,
+            error ? /*#__PURE__*/ _jsx("p", {
+                role: "alert",
+                children: error
+            }) : null,
+            error && !preflight ? /*#__PURE__*/ _jsx(Button, {
+                disabled: pending || loading,
+                onClick: ()=>setRefresh((value)=>value + 1),
+                children: C.retry
+            }) : null,
+            confirmStart && startAction ? /*#__PURE__*/ _jsx(ConfirmDialog, {
+                id: id,
+                action: startAction,
+                winnerLabel: "",
+                onClose: ()=>setConfirmStart(false)
+            }, `${id}/start`) : null
+        ]
+    });
+}