return `<section class="conflict-file"><div class="conflict-file-heading"><div><p class="eyebrow">${escapeHtml(file.path)}</p><strong>Records included from both sides</strong></div><span class="muted">Different records are kept automatically. Only matching IDs need a choice.</span></div>${records.map((record) => { const unique = !record.base || !record.active; return `<article class="conflict-record ${unique ? "conflict-record-automatic" : ""}"><div class="conflict-record-title"><strong>${escapeHtml(record.base?.title || record.active?.title || record.id)}</strong><small>${unique ? "Included automatically" : escapeHtml(record.id)}</small></div><div class="conflict-sides"><div class="conflict-side ${record.base ? "" : "missing"}"><span class="pill">Base branch</span>${record.base ? `<strong>${escapeHtml(record.base.title)}</strong><p>${escapeHtml(record.base.detail)}</p>` : "<p>This record is not on the base branch.</p>"}</div><div class="conflict-side ${record.active ? "" : "missing"}"><span class="pill pending">Active PR</span>${record.active ? `<strong>${escapeHtml(record.active.title)}</strong><p>${escapeHtml(record.active.detail)}</p>` : "<p>This record is not in the active PR.</p>"}</div></div>${record.base && record.active ? `<div class="conflict-choice-group"><span>Which version should remain?</span><div class="conflict-choice-buttons"><button class="button button-quiet" type="button" data-conflict-choice data-path="${escapeHtml(file.path)}" data-record-id="${escapeHtml(record.id)}" data-conflict-choice="base">Keep base</button><button class="button button-quiet" type="button" data-conflict-choice data-path="${escapeHtml(file.path)}" data-record-id="${escapeHtml(record.id)}" data-conflict-choice="active">Keep active PR</button></div></div>` : "<p class=\"conflict-automatic-note\">This record is unique to one side, so it will be included without a choice.</p>"}</article>`; }).join("")}</section>`;