@delmaredigital/payload-experiments 0.2.0-rc.7 → 0.3.0-rc.4

package/dist/admin/surface/test/ReadinessBar.js

@@ -0,0 +1,33 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLayoutEffect, useRef } from 'react';
+import { READINESS_COPY as C } from '../../copy/readiness.js';
+import { ReadinessContent } from '../readiness/Banner.js';
+/** Measure wrapping actions/copy so the final section always clears the fixed bar. */ export function ReadinessBar({ onHeightChange, ...props }) {
+    const ref = useRef(null);
+    useLayoutEffect(()=>{
+        const node = ref.current;
+        if (!node) return;
+        const measure = ()=>onHeightChange(node.getBoundingClientRect().height);
+        measure();
+        const observer = typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(measure);
+        observer?.observe(node);
+        window.addEventListener('resize', measure);
+        return ()=>{
+            observer?.disconnect();
+            window.removeEventListener('resize', measure);
+        };
+    }, [
+        onHeightChange
+    ]);
+    return /*#__PURE__*/ _jsx("div", {
+        ref: ref,
+        className: "xp-test-readiness-bar",
+        role: "region",
+        "aria-label": C.label,
+        children: props.test.doc ? /*#__PURE__*/ _jsx(ReadinessContent, {
+            ...props,
+            bar: true
+        }, `${props.test.doc.id}/${props.test.doc.status}`) : null
+    });
+}

package/dist/admin/surface/test/Section.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import type { SectionId, TestDocApi } from '../contracts.js';
 export declare function Section({ test, sectionId, children }: {
     test: TestDocApi;

package/dist/admin/surface/test/Section.js

@@ -1,27 +1,47 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
 import { readinessParts } from '../readiness/parts.js';
+import { SectionCard } from '../../../ui/SectionCard.js';
+import { SECTION_ORDER } from '../contracts.js';
 import { TEST_PAGE as C } from '../../copy/testPage.js';
 export function Section({ test, sectionId, children }) {
+    const disclosure = useRef(null);
+    const hasAdvancedError = Object.keys(test.errors).some((path)=>path.startsWith('analysis.') && ![
+            'analysis.reachPerDay',
+            'analysis.plannedDurationDays'
+        ].includes(path) || path === 'exposurePolicy');
+    useEffect(()=>{
+        if (hasAdvancedError && disclosure.current) disclosure.current.open = true;
+    }, [
+        hasAdvancedError
+    ]);
     const done = readinessParts.sectionDone(test)[sectionId];
-    return /*#__PURE__*/ _jsxs("section", {
-        className: "xp-test-section",
-        id: `section-${sectionId}`,
-        "aria-labelledby": `title-${sectionId}`,
+    if (sectionId === 'advanced') return /*#__PURE__*/ _jsxs("details", {
+        ref: disclosure,
+        className: "xp-test-advanced",
+        id: "section-advanced",
         children: [
-            /*#__PURE__*/ _jsxs("h2", {
-                id: `title-${sectionId}`,
-                children: [
-                    /*#__PURE__*/ _jsx("span", {
-                        className: done ? 'xp-section-check xp-section-check--done' : 'xp-section-check',
-                        "aria-label": done ? C.complete : C.incomplete,
-                        children: done ? C.completeMark : C.incompleteMark
-                    }),
-                    ' ',
-                    C.sections[sectionId]
-                ]
+            /*#__PURE__*/ _jsx("summary", {
+                children: /*#__PURE__*/ _jsx("h2", {
+                    id: "title-advanced",
+                    tabIndex: -1,
+                    children: C.sections.advanced
+                })
             }),
-            children
+            /*#__PURE__*/ _jsx("div", {
+                className: "xp-ui-section-body",
+                children: children
+            })
         ]
     });
+    return /*#__PURE__*/ _jsx(SectionCard, {
+        number: SECTION_ORDER.indexOf(sectionId) + 1,
+        title: C.sections[sectionId],
+        complete: done,
+        id: `section-${sectionId}`,
+        headingId: `title-${sectionId}`,
+        className: "xp-test-section",
+        children: children
+    });
 }

package/dist/admin/surface/test/TargetingSection.js

@@ -1,7 +1,8 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../../ui/Button.js';
 import { useId, useState } from 'react';
-import { ChipsInput } from '../../components/ChipsInput.js';
+import { ChipsInput } from '../../../ui/ChipsInput.js';
 import { AUDIENCE_COPY } from '../../copy/audience.js';
 import { coerceValue, emptyListHint, humaniseAttribute, opLabel, opsFor, readListValue, readTargetingRules, valueInput } from '../../targeting/targeting.model.js';
 import { TEST_PAGE as C, NUMBER_COMPARISONS } from '../../copy/testPage.js';
@@ -17,145 +18,170 @@ export function TargetingSection({ test, surface }) {
     const update = (transform)=>save(test, 'targeting', ()=>({
                 targeting: transform(readTargetingRules(test.doc.targeting ?? []))
             }));
-    const keys = Object.keys(surface.attributeKeys);
-    return /*#__PURE__*/ _jsx(Section, {
+    // Page block tests are scoped by their page; path rules belong to setting and flag tests (ruling Nov 3).
+    const blockPath = (key)=>test.doc.kind === 'block' && key === 'path';
+    const keys = Object.keys(surface.attributeKeys).filter((key)=>!blockPath(key));
+    return /*#__PURE__*/ _jsxs(Section, {
         test: test,
         sectionId: "who",
-        children: /*#__PURE__*/ _jsxs("details", {
-            children: [
-                /*#__PURE__*/ _jsx("summary", {
-                    children: rules.length ? C.rulesSummary : C.everyone
-                }),
-                rules.map((rule, index)=>{
-                    const attribute = surface.attributeKeys[rule.attribute];
-                    const input = valueInput(attribute, rule.op);
-                    const setRule = (partial)=>update((current)=>current.map((row, i)=>i === index ? {
-                                    ...row,
-                                    ...partial
-                                } : row));
-                    const hint = emptyListHint(rule.op, rule.value);
-                    const changeValue = (raw)=>{
-                        const current = test.doc.targeting?.[index];
-                        const schema = current && surface.attributeKeys[current.attribute];
-                        if (!current || !schema) return;
-                        const value = coerceValue(schema.type, current.op, raw);
-                        if (value !== null) setRule({
-                            value
-                        });
-                    };
-                    return /*#__PURE__*/ _jsxs("div", {
-                        className: "xp-targeting-row",
-                        children: [
-                            /*#__PURE__*/ _jsx(SelectEdit, {
-                                label: C.attribute,
-                                reason: reason,
-                                value: rule.attribute,
-                                options: [
-                                    ...keys,
-                                    ...!attribute ? [
-                                        rule.attribute
-                                    ] : []
-                                ].map((key)=>({
-                                        value: key,
-                                        label: humaniseAttribute(key)
-                                    })),
-                                onCommit: (value)=>{
-                                    const key = String(value);
-                                    const type = surface.attributeKeys[key].type;
-                                    setRule({
-                                        attribute: key,
-                                        op: 'eq',
-                                        value: type === 'boolean' ? false : type === 'number' ? 0 : ''
-                                    });
-                                }
-                            }),
-                            /*#__PURE__*/ _jsx(SelectEdit, {
-                                label: C.comparison,
-                                reason: reason,
-                                value: rule.op,
-                                options: opsFor(attribute?.type).map((op)=>({
-                                        value: op,
-                                        label: attribute?.type === 'number' ? NUMBER_COMPARISONS[op] : opLabel(attribute.type, op)
-                                    })),
-                                onCommit: (value)=>{
-                                    const op = value;
-                                    const current = readTargetingRules(test.doc.targeting ?? [])[index];
-                                    setRule({
-                                        op,
-                                        value: coerceValue(attribute.type, op, current?.value) ?? ''
-                                    });
-                                }
-                            }),
-                            input.kind === 'multiselect' ? /*#__PURE__*/ _jsx(CheckboxList, {
-                                label: C.value,
-                                reason: reason,
-                                value: readListValue(rule.value),
-                                options: input.options ?? [],
-                                onToggle: (value, checked)=>{
-                                    const values = readListValue(test.doc.targeting?.[index]?.value);
-                                    changeValue(checked ? [
-                                        ...new Set([
-                                            ...values,
-                                            value
-                                        ])
-                                    ] : values.filter((saved)=>saved !== value));
-                                }
-                            }) : input.kind === 'chips' ? /*#__PURE__*/ _jsx(ChipsInput, {
-                                id: `${id}-${index}-value`,
-                                label: C.value,
-                                value: readListValue(rule.value),
-                                disabled: Boolean(reason),
-                                description: reason ?? AUDIENCE_COPY.listDescription,
-                                placeholder: AUDIENCE_COPY.listPlaceholder,
-                                onChange: changeValue
-                            }, `${rule.attribute}-${rule.op}`) : input.kind === 'select' ? /*#__PURE__*/ _jsx(SelectEdit, {
-                                label: C.value,
-                                reason: reason,
-                                value: String(rule.value),
-                                options: input.options ?? [],
-                                onCommit: changeValue
-                            }) : input.kind === 'boolean' ? /*#__PURE__*/ _jsx(SelectEdit, {
-                                label: C.value,
-                                reason: reason,
-                                value: String(rule.value),
-                                options: [
-                                    {
-                                        value: 'true',
-                                        label: C.yes
-                                    },
-                                    {
-                                        value: 'false',
-                                        label: C.no
-                                    }
-                                ],
-                                onCommit: changeValue
-                            }) : /*#__PURE__*/ _jsx(TextEdit, {
-                                label: C.value,
-                                reason: reason,
-                                value: Array.isArray(rule.value) ? rule.value.join(', ') : String(rule.value),
-                                type: input.kind === 'number' ? 'number' : 'text',
-                                onCommit: changeValue
-                            }),
-                            hint ? /*#__PURE__*/ _jsx("p", {
-                                children: hint
-                            }) : null,
-                            /*#__PURE__*/ _jsx(FieldErrors, {
-                                test: test,
-                                path: `targeting.${index}`
-                            }),
-                            !reason ? /*#__PURE__*/ _jsx("button", {
-                                type: "button",
-                                onClick: ()=>{
-                                    setRowsRevision((revision)=>revision + 1);
-                                    update((current)=>current.filter((_, i)=>i !== index));
+        children: [
+            /*#__PURE__*/ _jsx("p", {
+                children: rules.length ? C.rulesSummary : C.everyone
+            }),
+            rules.map((rule, index)=>{
+                const remove = ()=>{
+                    setRowsRevision((revision)=>revision + 1);
+                    update((current)=>current.filter((_, i)=>i !== index));
+                };
+                if (blockPath(rule.attribute)) return /*#__PURE__*/ _jsxs("div", {
+                    className: "xp-targeting-row",
+                    children: [
+                        /*#__PURE__*/ _jsx("p", {
+                            className: "xp-ui-help",
+                            children: C.blockPathRule
+                        }),
+                        !reason ? /*#__PURE__*/ _jsx("div", {
+                            className: "xp-ui-button-group",
+                            children: /*#__PURE__*/ _jsx(Button, {
+                                variant: "link",
+                                size: "sm",
+                                onClick: remove,
+                                children: C.removeRule
+                            })
+                        }) : null
+                    ]
+                }, `${rowsRevision}-${index}`);
+                const attribute = surface.attributeKeys[rule.attribute];
+                const input = valueInput(attribute, rule.op);
+                const setRule = (partial)=>update((current)=>current.map((row, i)=>i === index ? {
+                                ...row,
+                                ...partial
+                            } : row));
+                const hint = emptyListHint(rule.op, rule.value);
+                const changeValue = (raw)=>{
+                    const current = test.doc.targeting?.[index];
+                    const schema = current && surface.attributeKeys[current.attribute];
+                    if (!current || !schema) return;
+                    const value = coerceValue(schema.type, current.op, raw);
+                    if (value !== null) setRule({
+                        value
+                    });
+                };
+                return /*#__PURE__*/ _jsxs("div", {
+                    className: "xp-targeting-row",
+                    children: [
+                        /*#__PURE__*/ _jsx(SelectEdit, {
+                            label: C.attribute,
+                            reason: reason,
+                            value: rule.attribute,
+                            options: [
+                                ...keys,
+                                ...!attribute ? [
+                                    rule.attribute
+                                ] : []
+                            ].map((key)=>({
+                                    value: key,
+                                    label: humaniseAttribute(key)
+                                })),
+                            onCommit: (value)=>{
+                                const key = String(value);
+                                const type = surface.attributeKeys[key].type;
+                                setRule({
+                                    attribute: key,
+                                    op: 'eq',
+                                    value: type === 'boolean' ? false : type === 'number' ? 0 : ''
+                                });
+                            }
+                        }),
+                        /*#__PURE__*/ _jsx(SelectEdit, {
+                            label: C.comparison,
+                            reason: reason,
+                            value: rule.op,
+                            options: opsFor(attribute?.type).map((op)=>({
+                                    value: op,
+                                    label: attribute?.type === 'number' ? NUMBER_COMPARISONS[op] : opLabel(attribute.type, op)
+                                })),
+                            onCommit: (value)=>{
+                                const op = value;
+                                const current = readTargetingRules(test.doc.targeting ?? [])[index];
+                                setRule({
+                                    op,
+                                    value: coerceValue(attribute.type, op, current?.value) ?? ''
+                                });
+                            }
+                        }),
+                        input.kind === 'multiselect' ? /*#__PURE__*/ _jsx(CheckboxList, {
+                            label: C.value,
+                            reason: reason,
+                            value: readListValue(rule.value),
+                            options: input.options ?? [],
+                            onToggle: (value, checked)=>{
+                                const values = readListValue(test.doc.targeting?.[index]?.value);
+                                changeValue(checked ? [
+                                    ...new Set([
+                                        ...values,
+                                        value
+                                    ])
+                                ] : values.filter((saved)=>saved !== value));
+                            }
+                        }) : input.kind === 'chips' ? /*#__PURE__*/ _jsx(ChipsInput, {
+                            id: `${id}-${index}-value`,
+                            label: C.value,
+                            value: readListValue(rule.value),
+                            disabled: Boolean(reason),
+                            description: reason ?? AUDIENCE_COPY.listDescription,
+                            placeholder: AUDIENCE_COPY.listPlaceholder,
+                            onChange: changeValue
+                        }, `${rule.attribute}-${rule.op}`) : input.kind === 'select' ? /*#__PURE__*/ _jsx(SelectEdit, {
+                            label: C.value,
+                            reason: reason,
+                            value: String(rule.value),
+                            options: input.options ?? [],
+                            onCommit: changeValue
+                        }) : input.kind === 'boolean' ? /*#__PURE__*/ _jsx(SelectEdit, {
+                            label: C.value,
+                            reason: reason,
+                            value: String(rule.value),
+                            options: [
+                                {
+                                    value: 'true',
+                                    label: C.yes
                                 },
+                                {
+                                    value: 'false',
+                                    label: C.no
+                                }
+                            ],
+                            onCommit: changeValue
+                        }) : /*#__PURE__*/ _jsx(TextEdit, {
+                            label: C.value,
+                            reason: reason,
+                            value: Array.isArray(rule.value) ? rule.value.join(', ') : String(rule.value),
+                            type: input.kind === 'number' ? 'number' : 'text',
+                            onCommit: changeValue
+                        }),
+                        hint ? /*#__PURE__*/ _jsx("p", {
+                            children: hint
+                        }) : null,
+                        /*#__PURE__*/ _jsx(FieldErrors, {
+                            test: test,
+                            path: `targeting.${index}`
+                        }),
+                        !reason ? /*#__PURE__*/ _jsx("div", {
+                            className: "xp-ui-button-group",
+                            children: /*#__PURE__*/ _jsx(Button, {
+                                variant: "link",
+                                size: "sm",
+                                onClick: remove,
                                 children: C.removeRule
-                            }) : null
-                        ]
-                    }, `${rowsRevision}-${index}`);
-                }),
-                !reason ? /*#__PURE__*/ _jsx("button", {
-                    type: "button",
+                            })
+                        }) : null
+                    ]
+                }, `${rowsRevision}-${index}`);
+            }),
+            !reason ? /*#__PURE__*/ _jsx("div", {
+                className: "xp-ui-button-group",
+                children: /*#__PURE__*/ _jsx(Button, {
                     disabled: !keys.length,
                     onClick: ()=>{
                         const attribute = keys[0];
@@ -170,12 +196,12 @@ export function TargetingSection({ test, surface }) {
                             ]);
                     },
                     children: C.addRule
-                }) : null,
-                /*#__PURE__*/ _jsx(FieldErrors, {
-                    test: test,
-                    path: "targeting"
                 })
-            ]
-        })
+            }) : null,
+            /*#__PURE__*/ _jsx(FieldErrors, {
+                test: test,
+                path: "targeting"
+            })
+        ]
     });
 }

package/dist/admin/surface/test/TestPage.d.ts

@@ -1,7 +1,8 @@
 import type { DocId } from '../../../types/contracts.js';
 import type { SurfaceProps } from '../contracts.js';
 import './testPage.css';
-export declare function TestPage({ id, surface }: {
+export declare function TestPage({ id, surface, onTitleChange }: {
     id: DocId;
     surface: SurfaceProps;
+    onTitleChange?: (title: string) => void;
 }): import("react").JSX.Element;