canopycms 0.11.1 → 0.12.1

package/dist/editor/components/change-parts.js

@@ -0,0 +1,171 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * How the "Show changes" drawer shows a value and a text change, shared by its change cards and its
+ * conflict cards: marked text, values as the form would show them, and the drawer's reasoned button.
+ */
+import React, { useEffect, useRef, useState } from 'react';
+import { Button, Group, List, Stack, Text, Tooltip, VisuallyHidden } from '@mantine/core';
+import { IconPhotoOff } from '@tabler/icons-react';
+import { EDITOR_THUMBNAIL_WIDTHS } from '../../assets/editor-thumbnail-widths.js';
+import { useAssetContext } from '../context/index.js';
+import { editorImageSrc } from '../media/editor-image-src.js';
+import { formatRelativeTime } from '../relative-time.js';
+/**
+ * Struck on a tint at least 1.3:1 from the card in either scheme, with text kept at 4.5:1 on it:
+ * `red.2` in light, `red.6` at 30% over the dark card.
+ */
+const REMOVED_STYLE = {
+    background: 'light-dark(var(--mantine-color-red-2), color-mix(in srgb, var(--mantine-color-red-6) 30%, transparent))',
+    color: 'inherit',
+    textDecoration: 'line-through',
+    textDecorationThickness: 2,
+};
+/** Underlined on a tint, measured as REMOVED_STYLE's: `green.3`, or `green.6` at 30%. */
+const ADDED_STYLE = {
+    background: 'light-dark(var(--mantine-color-green-3), color-mix(in srgb, var(--mantine-color-green-6) 30%, transparent))',
+    color: 'inherit',
+    textDecoration: 'underline',
+    textDecorationThickness: 2,
+};
+export const TEXT_STYLE = { whiteSpace: 'pre-wrap', overflowWrap: 'anywhere' };
+/** Long text on one side only is cut to this many lines once it has more than LONG_TEXT_LINES. */
+const COLLAPSED_LINES = 50;
+const LONG_TEXT_LINES = 200;
+/** Above this share of a line's text changed, one prefix names the whole line instead of each run. */
+const WHOLE_LINE_SHARE = 0.6;
+export const plural = (count, one, many) => `${count} ${count === 1 ? one : many}`;
+export const ordinal = (n) => {
+    const tens = n % 100;
+    const suffix = tens >= 11 && tens <= 13 ? 'th' : ({ 1: 'st', 2: 'nd', 3: 'rd' }[n % 10] ?? 'th');
+    return `${n}${suffix}`;
+};
+/**
+ * `side`'s runs of `parts`, a marked run joined to the next of its mark across whitespace alone,
+ * so a screen reader hears one removal, not one per word.
+ */
+const sideRuns = (parts, side) => {
+    const runs = [];
+    for (const part of parts) {
+        if (side === 'before' ? part.added : part.removed)
+            continue;
+        const mark = part.removed ? 'removed' : part.added ? 'added' : undefined;
+        const last = runs[runs.length - 1];
+        const gap = runs[runs.length - 2];
+        if (mark && last && last.mark === mark) {
+            last.value += part.value;
+        }
+        else if (mark && last && !last.mark && /^\s+$/.test(last.value) && gap?.mark === mark) {
+            runs.pop();
+            gap.value += last.value + part.value;
+        }
+        else {
+            runs.push({ value: part.value, ...(mark && { mark }) });
+        }
+    }
+    return runs;
+};
+const WHITESPACE_MARKS = {
+    ' ': { shown: '·', said: 'space' },
+    '\t': { shown: '→', said: 'tab' },
+    '\n': { shown: '⏎', said: 'line break' },
+};
+/** A run's text; whitespace alone shows a mark for each character, said in words. */
+const RunText = ({ value }) => {
+    if (value === '')
+        return _jsx("em", { children: "(blank line)" });
+    if (!/^\s+$/.test(value))
+        return _jsx(_Fragment, { children: value });
+    const chars = [...value];
+    return (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: chars.map((c) => WHITESPACE_MARKS[c]?.shown ?? c).join('') }), _jsx(VisuallyHidden, { component: "span", children: chars.map((c) => WHITESPACE_MARKS[c]?.said ?? 'space').join(', ') })] }));
+};
+const MARK_WORDS = {
+    removed: { start: 'Removed: ', end: ', end of removal', line: 'Removed line: ' },
+    added: { start: 'Added: ', end: ', end of addition', line: 'Added line: ' },
+};
+/**
+ * One side's text with its runs marked by a strike or an underline and by words, never colour
+ * alone. A line mostly changed says so once, up front, instead of run by run.
+ */
+export const MarkedText = ({ parts, side, unit }) => {
+    const runs = sideRuns(parts, side);
+    const total = runs.reduce((n, run) => n + run.value.length, 0);
+    const marked = runs.reduce((n, run) => n + (run.mark ? run.value.length : 0), 0);
+    const mark = side === 'before' ? 'removed' : 'added';
+    const whole = runs.some((run) => run.mark) && (total === 0 || marked / total > WHOLE_LINE_SHARE);
+    return (_jsxs(_Fragment, { children: [whole && (_jsx(VisuallyHidden, { component: "span", children: unit === 'line' ? MARK_WORDS[mark].line : MARK_WORDS[mark].start })), runs.map((run, i) => {
+                if (!run.mark)
+                    return _jsx(React.Fragment, { children: run.value }, i);
+                const Tag = run.mark === 'removed' ? 'del' : 'ins';
+                const style = run.mark === 'removed' ? REMOVED_STYLE : ADDED_STYLE;
+                // Whitespace alone, or a blank line's label, has nothing for a line to cross.
+                const shown = /^\s*$/.test(run.value) ? { ...style, textDecoration: 'none' } : style;
+                return (_jsxs(Tag, { style: shown, children: [!whole && (_jsx(VisuallyHidden, { component: "span", children: MARK_WORDS[run.mark].start })), _jsx(RunText, { value: run.value }), !whole && _jsx(VisuallyHidden, { component: "span", children: MARK_WORDS[run.mark].end })] }, i));
+            })] }));
+};
+const THUMBNAIL_SIZE = EDITOR_THUMBNAIL_WIDTHS.listRow / 2;
+/** An image's thumbnail beside its name, which says what it is; an icon if it won't load. */
+const Thumbnail = ({ src }) => {
+    const { baseUrl } = useAssetContext();
+    const [failed, setFailed] = useState(false);
+    if (failed) {
+        return (_jsx(IconPhotoOff, { size: THUMBNAIL_SIZE, stroke: 1.5, "aria-hidden": true, style: { flexShrink: 0, color: 'var(--mantine-color-dimmed)' } }));
+    }
+    return (_jsx("img", { src: editorImageSrc(src, baseUrl, { width: EDITOR_THUMBNAIL_WIDTHS.listRow }), alt: "", width: THUMBNAIL_SIZE, height: THUMBNAIL_SIZE, onError: () => setFailed(true), style: { objectFit: 'cover', borderRadius: 4, flexShrink: 0 } }));
+};
+/** Text on one side only; more than LONG_TEXT_LINES lines show COLLAPSED_LINES until asked. */
+const LongText = ({ text }) => {
+    const [expanded, setExpanded] = useState(false);
+    const firstNew = useRef(null);
+    useEffect(() => {
+        if (expanded)
+            firstNew.current?.focus();
+    }, [expanded]);
+    const lines = text.split('\n');
+    const long = lines.length > LONG_TEXT_LINES;
+    const collapsed = !expanded && long;
+    return (_jsxs(Stack, { gap: 4, align: "flex-start", children: [_jsx(Text, { size: "sm", style: TEXT_STYLE, children: !long ? (text) : (_jsxs(_Fragment, { children: [lines.slice(0, COLLAPSED_LINES).join('\n'), expanded && (_jsxs(_Fragment, { children: ['\n', _jsx("span", { ref: firstNew, tabIndex: -1, children: lines.slice(COLLAPSED_LINES).join('\n') })] }))] })) }), collapsed && (_jsxs(Button, { size: "compact-sm", variant: "subtle", onClick: () => setExpanded(true), children: ["Show all ", lines.length, " lines"] }))] }));
+};
+/** A value as the form would show it: titles for references, file names for images. */
+export const Value = ({ value, alt, }) => {
+    switch (value.kind) {
+        case 'empty':
+            return (_jsx(Text, { size: "sm", c: "dimmed", children: "Not set" }));
+        case 'text':
+            return _jsx(LongText, { text: value.text });
+        case 'number':
+            return _jsx(Text, { size: "sm", children: value.value.toLocaleString() });
+        case 'boolean':
+            return _jsx(Text, { size: "sm", children: value.value ? 'Yes' : 'No' });
+        case 'date':
+            return _jsx(DateValue, { value: value });
+        case 'select':
+            return _jsx(Text, { size: "sm", children: value.label });
+        case 'reference':
+            return value.title !== undefined ? (_jsx(Text, { size: "sm", children: value.title })) : (_jsx(Text, { size: "sm", c: "dimmed", children: "Entry unavailable" }));
+        case 'image':
+            return (_jsxs(Group, { gap: "xs", wrap: "nowrap", align: "flex-start", children: [_jsx(Thumbnail, { src: value.src }, value.src), _jsxs(Stack, { gap: 0, miw: 0, children: [_jsx(Text, { size: "sm", style: TEXT_STYLE, children: value.name }), value.alt && (_jsxs(Text, { size: "xs", style: TEXT_STYLE, children: [_jsxs(Text, { span: true, size: "xs", c: "dimmed", children: ["Alt text:", ' '] }), alt?.text.mode === 'words' ? (_jsx(MarkedText, { parts: alt.text.parts, side: alt.side, unit: "text" })) : (value.alt)] }))] })] }));
+        case 'position':
+            return (_jsxs(Text, { size: "sm", children: [ordinal(value.position), " of ", value.of] }));
+        case 'list':
+            return (_jsx(List, { size: "sm", spacing: 4, children: value.items.map((item, i) => (_jsx(List.Item, { children: _jsx(Value, { value: item }) }, i))) }));
+        case 'fields':
+            return (_jsx(Stack, { gap: 6, children: value.fields.map((field, i) => (_jsxs("div", { children: [_jsx(Text, { size: "xs", fw: 500, children: field.label }), _jsx(Value, { value: field.value })] }, i))) }));
+        case 'raw':
+            return (_jsx(Text, { size: "xs", ff: "monospace", style: TEXT_STYLE, children: value.text }));
+    }
+};
+/**
+ * A date in full, in the viewer's time zone: a comparison needs the value, so this is the one
+ * place the editor shows a date absolute first and relative after. A day has no relative form: it
+ * may be a future event, and a past one is not hours ago.
+ */
+export const DateValue = ({ value, text }) => (_jsxs(Stack, { gap: 0, children: [_jsx(Text, { size: "sm", style: TEXT_STYLE, children: text ?? value.text }), !value.dateOnly && (_jsx(Text, { size: "xs", c: "dimmed", children: formatRelativeTime(value.iso) }))] }));
+/**
+ * A drawer control that, given a `reason`, stays focusable but doesn't act, its Tooltip saying
+ * why (`data-disabled` keeps the Tooltip working on focus and touch).
+ */
+export const ReasonedButton = ({ reason, onClick, danger, ...props }) => (_jsx(Tooltip, { label: reason, disabled: !reason, multiline: true, maw: 280, position: "bottom-start", children: _jsx(Button, { size: "compact-sm", variant: "subtle", ...(danger && { color: 'red', c: 'var(--canopy-danger-text)' }), ...props, onClick: () => {
+            if (!reason)
+                onClick();
+        }, "data-disabled": reason ? true : undefined, "aria-disabled": reason ? true : undefined }) }));

package/dist/editor/conflict-cards.d.ts

@@ -0,0 +1,90 @@
+/**
+ * The cards "Show changes" shows for an entry's open conflicts, built from what
+ * `GET /:branch/conflicts/...entryPath` answers (api/merge-conflicts.ts): each place's three
+ * versions as the drawer shows values, and long text split into the regions both sides changed.
+ * Pure. Where a choice lands in the form value is `conflict-choices.ts`.
+ */
+import type { EntryConflictData } from '../api/merge-conflicts.js';
+import type { FieldConfig } from '../config/index.js';
+import type { FieldConflictKind } from '../merge/entry-merge.js';
+import { type TextConflictRegion } from '../merge/text-merge.js';
+import { type DataPathSegment, type DisplayValue, type TextDiff } from './entry-diff.js';
+type FormValue = Record<string, unknown>;
+interface CardBase {
+    /** Unique among the entry's cards: the conflict's key, and a region's number within it. */
+    id: string;
+    /** The record's key, which a save's `resolvedConflicts` sends back. */
+    key: string;
+    mergeSha: string;
+    /** Human labels from the entry down to the place: "Page sections › Hero › Heading". */
+    path: string[];
+}
+/** A value both sides changed: a field, a whole list item, or a value the drawer shows whole. */
+interface ValueConflictCard extends CardBase {
+    type: 'value';
+    conflict: FieldConflictKind;
+    /** A whole list item or block, which the choice keeps or removes. */
+    item: boolean;
+    before: DisplayValue;
+    latest: DisplayValue;
+    yours: DisplayValue;
+    /** Word or line marks from Before to the latest version, and from Before to yours. */
+    latestText?: TextDiff;
+    yoursText?: TextDiff;
+    /** The latest version's value here can't be found ({@link FieldConflict.latestPlaceable}). */
+    latestUnavailable?: true;
+}
+/** Lines of long text both sides changed, one card per region of a field. */
+interface RegionConflictCard extends CardBase {
+    type: 'region';
+    /** 0-based, among the field's regions. */
+    index: number;
+    count: number;
+    before: string;
+    latest: string;
+    yours: string;
+    latestText?: TextDiff;
+    yoursText?: TextDiff;
+}
+/** The entry was moved to different places on each side; the branch's place stands. */
+interface LocationConflictCard extends CardBase {
+    type: 'location';
+}
+export type ConflictCard = ValueConflictCard | RegionConflictCard | LocationConflictCard;
+/** One recorded conflict and what its choices act on. */
+export interface FieldConflict {
+    key: string;
+    mergeSha: string;
+    dataPath: DataPathSegment[];
+    item: boolean;
+    cards: ConflictCard[];
+    /** The latest version as a form value, which "Use latest version" takes from. */
+    latest?: FormValue;
+    /**
+     * The latest version was read and holds every list item on the place's path, other than the item
+     * a removal on its side took out, so its value there can be found and placed. It is keyed as the
+     * merge named the place along the base's own path ({@link alignedTo}), so this fails only where
+     * the record gives no such path, one that runs another way, or one whose merged key another of
+     * its items holds.
+     */
+    latestPlaceable: boolean;
+    /**
+     * Long text found again by region from its three versions: the text the merge left, and its
+     * regions, each holding your lines there. Absent when the text is one whole value.
+     */
+    text?: {
+        merged: string;
+        regions: TextConflictRegion[];
+    };
+}
+export interface EntryConflicts {
+    fields: FieldConflict[];
+    /** Versions the API couldn't show, so a field's cards may show less. */
+    incomplete: boolean;
+}
+/**
+ * The cards for one entry's open field conflicts. `bodyField` is the schema's body field on an
+ * md/mdx entry. Each version the cards compare is diffed once per pair, however many fields share it.
+ */
+export declare function buildEntryConflicts(data: EntryConflictData, fields: readonly FieldConfig[], bodyField: string | undefined, referenceTitle?: (id: string) => string | undefined, saved?: FormValue): EntryConflicts;
+export {};

package/dist/editor/conflict-cards.js

@@ -0,0 +1,279 @@
+/**
+ * The cards "Show changes" shows for an entry's open conflicts, built from what
+ * `GET /:branch/conflicts/...entryPath` answers (api/merge-conflicts.ts): each place's three
+ * versions as the drawer shows values, and long text split into the regions both sides changed.
+ * Pure. Where a choice lands in the form value is `conflict-choices.ts`.
+ */
+import equal from 'fast-deep-equal';
+import { LOCATION_CONFLICT_KEY } from '../merge/conflict-path.js';
+import { mergeText } from '../merge/text-merge.js';
+import { computeEntryDiff, displayWhole, textDiff, } from './entry-diff.js';
+import { flattenGroupFields } from '../utils/flatten-group-fields.js';
+import { humanizeName, schemaLabel } from './schema-label.js';
+import { formValueOfSide, valueAtChange } from './undo-change.js';
+import { ITEM_KEY } from '../item-keys.js';
+import { isPlainRecord } from '../validation/field-traversal.js';
+const EMPTY = { kind: 'empty' };
+/** The version a blob id names; undefined when it can't be shown. */
+const versionOf = (versions, sha) => {
+    if (sha === undefined)
+        return null;
+    const side = versions[sha];
+    return side === undefined || 'unavailable' in side ? undefined : side;
+};
+/**
+ * `version` with its list items along `from`, its own path to a conflict's place, keyed as `to`,
+ * the merged path, names them, so `to` finds the value in it: an item of a list a side left keyless
+ * reads there with a key of its own content (api/merge-conflicts.ts `EntryConflictField.sidePaths`).
+ * Unchanged where there is no `from` or it is `to`. Undefined, as a version that can't be shown,
+ * where the two paths don't run alike or a key `to` names is another item's in that list: the
+ * merged path would find that item there.
+ */
+const alignedTo = (version, from, to) => {
+    if (!version || !from || equal(from, to))
+        return version;
+    // A path one step short of an item names the list of a version without that item.
+    const last = to.at(-1);
+    const missing = from.length === to.length - 1 && last !== undefined && 'item' in last ? last.item : undefined;
+    if (missing === undefined && from.length !== to.length)
+        return undefined;
+    const data = structuredClone(version.data);
+    let node = data;
+    for (const [i, segment] of from.entries()) {
+        const target = to[i];
+        if ('field' in segment) {
+            if (!('field' in target) || target.field !== segment.field)
+                return undefined;
+            node = isPlainRecord(node) ? node[segment.field] : undefined;
+        }
+        else if ('blockData' in segment) {
+            if (!('blockData' in target))
+                return undefined;
+            node = isPlainRecord(node) ? (isPlainRecord(node.value) ? node.value : node) : undefined;
+        }
+        else {
+            if (!('item' in target) || !Array.isArray(node))
+                return undefined;
+            const keyed = (key) => node.find((x) => isPlainRecord(x) && x[ITEM_KEY] === key);
+            const item = keyed(segment.item);
+            if (!isPlainRecord(item))
+                return undefined;
+            if (target.item !== segment.item) {
+                if (keyed(target.item) !== undefined)
+                    return undefined;
+                item[ITEM_KEY] = target.item;
+            }
+            node = item;
+        }
+    }
+    if (missing !== undefined) {
+        // Another item there holding the key `to` names would be found as it: it takes another key.
+        if (!Array.isArray(node))
+            return undefined;
+        const other = node.find((x) => isPlainRecord(x) && x[ITEM_KEY] === missing);
+        if (isPlainRecord(other))
+            other[ITEM_KEY] = `${missing}~other`;
+    }
+    return { ...version, data };
+};
+/** A diff's changes by key, a whole entry missing on a side giving none. */
+const changesByKey = (fields, before, after, referenceTitle) => {
+    if (!before || !after)
+        return new Map();
+    const { changes } = computeEntryDiff({ fields, before, after, referenceTitle });
+    return new Map(changes.map((change) => [change.key, change]));
+};
+/**
+ * The schema field a data path ends at, and the labels of the fields on the way, for a conflict no
+ * change of the drawer names: one the merge compared whole, such as a list it had no schema for.
+ * A block's data has no one field set, so the walk stops there.
+ */
+const fieldAlong = (fields, dataPath) => {
+    let scope = fields;
+    let field;
+    const path = [];
+    for (const segment of dataPath) {
+        if ('field' in segment) {
+            field = scope && flattenGroupFields(scope).find((f) => f.name === segment.field);
+            path.push(field ? schemaLabel(field) : humanizeName(segment.field));
+            scope = field?.type === 'object' ? field.fields : undefined;
+        }
+        else if ('item' in segment) {
+            field = field && 'list' in field && field.list ? { ...field, list: false } : undefined;
+        }
+        else {
+            return { path };
+        }
+    }
+    return { field, path };
+};
+/** A string at `dataPath` in a version, as the form holds it. */
+const textAt = (version, dataPath, bodyField) => {
+    if (!version)
+        return version === null ? '' : undefined;
+    const value = valueAtChange(formValueOfSide(version), { dataPath }, bodyField);
+    return typeof value === 'string' ? value : value === undefined ? '' : undefined;
+};
+/**
+ * The cards for one entry's open field conflicts. `bodyField` is the schema's body field on an
+ * md/mdx entry. Each version the cards compare is diffed once per pair, however many fields share it.
+ */
+export function buildEntryConflicts(data, fields, bodyField, referenceTitle, saved) {
+    const diffs = new Map();
+    const diff = (from, to) => {
+        const id = `${from ?? '-'}>${to ?? '-'}`;
+        let found = diffs.get(id);
+        if (!found) {
+            found = changesByKey(fields, versionOf(data.versions, from), versionOf(data.versions, to), referenceTitle);
+            diffs.set(id, found);
+        }
+        return found;
+    };
+    let incomplete = false;
+    const out = data.fields.map((field) => {
+        const { ancestor, base, branch } = field.sides;
+        const read = {
+            before: versionOf(data.versions, ancestor),
+            latest: versionOf(data.versions, base),
+            yours: versionOf(data.versions, branch),
+        };
+        if (Object.values(read).some((v) => v === undefined))
+            incomplete = true;
+        // Each version keyed as the merge named this place, so the one data path finds it in all three.
+        const versions = {
+            before: alignedTo(read.before, field.sidePaths.ancestor, field.dataPath),
+            latest: alignedTo(read.latest, field.sidePaths.base, field.dataPath),
+            yours: alignedTo(read.yours, field.sidePaths.branch, field.dataPath),
+        };
+        const realigned = ['before', 'latest', 'yours'].some((v) => versions[v] !== read[v]);
+        if (Object.values(versions).some((v) => v === undefined))
+            incomplete = true;
+        const latest = versions.latest ? formValueOfSide(versions.latest) : undefined;
+        const latestPlaceable = !!latest &&
+            field.dataPath.every((segment, i) => !('item' in segment) ||
+                (field.item && field.kind === 'removed-on-base' && i === field.dataPath.length - 1) ||
+                valueAtChange(latest, { dataPath: field.dataPath.slice(0, i + 1) }, bodyField) !==
+                    undefined);
+        const common = {
+            key: field.key,
+            mergeSha: field.mergeSha,
+            dataPath: field.dataPath,
+            item: !!field.item,
+            latestPlaceable,
+            ...(latest && { latest }),
+        };
+        const card = { key: field.key, mergeSha: field.mergeSha };
+        if (field.key === LOCATION_CONFLICT_KEY) {
+            return { ...common, cards: [{ ...card, id: field.key, type: 'location', path: [] }] };
+        }
+        // A realigned version is this field's own, so its diffs are too.
+        const pair = (from, to, fromSha, toSha) => (realigned ? changesByKey(fields, from, to, referenceTitle) : diff(fromSha, toSha));
+        const toLatest = pair(versions.before, versions.latest, ancestor, base);
+        const toYours = pair(versions.before, versions.yours, ancestor, branch);
+        const between = pair(versions.latest, versions.yours, base, branch);
+        const named = toLatest.get(field.drawerKey) ?? toYours.get(field.drawerKey);
+        const along = fieldAlong(fields, field.dataPath);
+        const path = named?.path ?? between.get(field.drawerKey)?.path ?? along.path;
+        // Your saved value where a save since the merge changed it, which is what keeping yours keeps:
+        // the branch's version is only how it read at the merge.
+        const savedHere = saved && valueAtChange(saved, { dataPath: field.dataPath }, bodyField);
+        const branchHere = versions.yours &&
+            valueAtChange(formValueOfSide(versions.yours), { dataPath: field.dataPath }, bodyField);
+        const savedYours = saved && !equal(savedHere, branchHere)
+            ? displayWhole(along.field, savedHere, referenceTitle)
+            : undefined;
+        const savedMarks = (before) => savedYours && before.kind === 'text' && savedYours.kind === 'text'
+            ? textDiff(before.text, savedYours.text)
+            : undefined;
+        if (field.text) {
+            const texts = [versions.before, versions.latest, versions.yours].map((v) => textAt(v, field.dataPath, bodyField));
+            const [o, a, b] = texts;
+            const merged = latestPlaceable && o !== undefined && a !== undefined && b !== undefined
+                ? mergeText(o, a, b)
+                : undefined;
+            // Regions place their lines in the text the merge left, so they apply only while your saved
+            // text is that text: not once you saved since, nor where the merge kept your text whole.
+            const regionsApply = !!merged &&
+                merged.regions.length > 0 &&
+                (saved === undefined ||
+                    valueAtChange(saved, { dataPath: field.dataPath }, bodyField) === merged.text);
+            if (merged && regionsApply) {
+                return {
+                    ...common,
+                    text: { merged: merged.text, regions: merged.regions },
+                    cards: merged.regions.map((region, index) => ({
+                        ...card,
+                        id: `${field.key}#${index}`,
+                        type: 'region',
+                        path,
+                        index,
+                        count: merged.regions.length,
+                        before: region.ancestor,
+                        latest: region.base,
+                        yours: region.branch,
+                        latestText: textDiff(region.ancestor, region.base, true),
+                        yoursText: textDiff(region.ancestor, region.branch, true),
+                    })),
+                };
+            }
+        }
+        const fromLatest = toLatest.get(field.drawerKey);
+        const fromYours = toYours.get(field.drawerKey);
+        const across = between.get(field.drawerKey);
+        if (!fromLatest && !fromYours && !across) {
+            // No change of the drawer is at this place: the merge compared it whole, so it shows whole.
+            const whole = (version) => version
+                ? displayWhole(along.field, valueAtChange(formValueOfSide(version), { dataPath: field.dataPath }, bodyField), referenceTitle)
+                : EMPTY;
+            const [before, latestValue, yoursValue] = [
+                versions.before,
+                versions.latest,
+                versions.yours,
+            ].map(whole);
+            const marks = (to) => before.kind === 'text' && to.kind === 'text' ? textDiff(before.text, to.text) : undefined;
+            const latestText = marks(latestValue);
+            const yoursText = savedYours ? savedMarks(before) : marks(yoursValue);
+            return {
+                ...common,
+                cards: [
+                    {
+                        ...card,
+                        id: field.key,
+                        type: 'value',
+                        conflict: field.kind,
+                        item: !!field.item,
+                        path,
+                        before,
+                        latest: latestValue,
+                        ...(!latestPlaceable && { latestUnavailable: true }),
+                        yours: savedYours ?? yoursValue,
+                        ...(latestText && { latestText }),
+                        ...(yoursText && { yoursText }),
+                    },
+                ],
+            };
+        }
+        const before = fromLatest?.before ?? fromYours?.before ?? EMPTY;
+        const yoursText = savedYours ? savedMarks(before) : fromYours?.text;
+        return {
+            ...common,
+            cards: [
+                {
+                    ...card,
+                    id: field.key,
+                    type: 'value',
+                    conflict: field.kind,
+                    item: !!field.item,
+                    path,
+                    before,
+                    latest: fromLatest ? (fromLatest.after ?? EMPTY) : (across?.before ?? EMPTY),
+                    ...(!latestPlaceable && { latestUnavailable: true }),
+                    yours: savedYours ?? (fromYours ? (fromYours.after ?? EMPTY) : (across?.after ?? EMPTY)),
+                    ...(fromLatest?.text && { latestText: fromLatest.text }),
+                    ...(yoursText && { yoursText }),
+                },
+            ],
+        };
+    });
+    return { fields: out, incomplete };
+}

package/dist/editor/conflict-choices.d.ts

@@ -0,0 +1,60 @@
+/**
+ * What a choice on a conflict card does to the open entry's form value (conflict-cards.ts builds
+ * the cards). Pure. A choice is an unsaved edit: the save that writes it sends the conflict's key in
+ * `resolvedConflicts` (api/content.ts), which is what resolves it.
+ */
+import type { TextConflictRegion } from '../merge/text-merge.js';
+import type { FieldConflict } from './conflict-cards.js';
+import type { EntryChange } from './entry-diff.js';
+type FormValue = Record<string, unknown>;
+/** A region's choice: the latest version's lines, yours, or the latest's followed by yours. */
+export type RegionChoice = 'latest' | 'yours' | 'both';
+/**
+ * `latest`: the latest version's value, which for a removed one removes it. `yours`: your saved
+ * value as it stands. `edited`: what the form holds now, marked resolved after an edit. `regions`:
+ * long text chosen region by region, resolved once every region is chosen.
+ */
+export type FieldChoice = {
+    how: 'latest';
+} | {
+    how: 'yours';
+} | {
+    how: 'edited';
+} | {
+    how: 'regions';
+    regions: Readonly<Record<number, RegionChoice>>;
+};
+/** An entry's choices, by conflict key, each for the merge it was made on. */
+export type EntryChoices = Readonly<Record<string, {
+    mergeSha: string;
+    choice: FieldChoice;
+}>>;
+/** The change-shaped handle `undo-change.ts` places a value by. */
+export declare const placeOf: (field: Pick<FieldConflict, "key" | "dataPath" | "item">) => EntryChange;
+/** Whether a choice says everything its conflict needs. */
+export declare const isDecided: (field: FieldConflict, choice: FieldChoice | undefined) => boolean;
+/**
+ * The text the merge left with each region as `regions` chooses it. A region's lines sit where the
+ * merge put yours (`TextConflictRegion.line`), so regions are placed from the last up.
+ * @internal Exported for tests.
+ */
+export declare function textWithChoices(text: {
+    merged: string;
+    regions: readonly TextConflictRegion[];
+}, regions: Readonly<Record<number, RegionChoice>>): string;
+/**
+ * Whether the form still holds the conflict's place as the last choice (or, before any, your saved
+ * value) left it. False once it was edited by hand: a choice would then replace that edit.
+ */
+export declare function holdsChoice(current: FormValue, saved: FormValue, field: FieldConflict, choice: FieldChoice | undefined, bodyField: string | undefined): boolean;
+/**
+ * `current` with the latest version at the conflict's place; undefined when it can't be placed, as
+ * where the latest version couldn't be read or doesn't hold the items on the place's path
+ * ({@link FieldConflict.latestPlaceable}).
+ */
+export declare const withLatest: (current: FormValue, field: FieldConflict, bodyField: string | undefined) => FormValue | undefined;
+/** `current` with your saved value back at the conflict's place, as before any choice. */
+export declare const withYours: (current: FormValue, saved: FormValue, field: FieldConflict, bodyField: string | undefined) => FormValue | undefined;
+/** `current` with long text as `regions` chooses it. */
+export declare const withRegions: (current: FormValue, field: FieldConflict, regions: Readonly<Record<number, RegionChoice>>, bodyField: string | undefined) => FormValue | undefined;
+export {};