Order Cancel Summary - Everyday Interface Patterns

A static order cancellation summary shows OR-1842, Desk lamp, Cancel order action, and Review only status.

Program

Order cancellation summaries should show the order, item, and action before any order changes.

order_cancel_summary.html

Visuals: captured from real browser rendering

<section class="order-cancel" aria-labelledby="order-cancel-title"><h2 id="order-cancel-title">Order cancel summary</h2><dl>
  <div><dt>Order</dt><dd>OR-1842</dd></div>
  <div><dt>Item</dt><dd>Desk lamp</dd></div><div><dt>Action</dt><dd>Cancel order</dd></div>
  <div><dt>Status</dt><dd><span class="badge">Review only</span></dd></div></dl>
  <p class="check">Learner check: the cancel action is visible before any order changes.</p>
  <p class="note">Static order cancel summary only; no order mutation, fulfillment service, payment service, refund service, storage, route, API, network, script, event listener, form submit, analytics, timer, or live order cancellation runs.</p></section>
<style>
  .order-cancel { display: grid; gap: 10px; max-width: 38rem; border: 1px solid #1d4ed8; padding: 12px; background: #eff6ff; }
  .order-cancel dl { display: grid; gap: 8px; margin: 0; }
  .order-cancel dl div { display: grid; grid-template-columns: 8rem 1fr; gap: 8px; }
  .order-cancel dt { color: #475569; }
  .order-cancel dd, .check, .note { margin: 0; }
  .badge { border-radius: 999px; background: #dbeafe; padding: 2px 8px; }
  .note { color: #475569; }
</style>

Label the order cancel summary.
The section is labelled by its visible heading.
Show order row.
The order id is exact pinned data.
Show item and action rows.
The item and action are exact pinned data.
Render review-only status.
The status badge says this is review only.
Check order cancel readback.
The check says the cancel action is visible before any order changes.
Check order cancel honesty.
Order, item, action, status, and no live cancellation.

step flow step(1) labels the source, step(2) shows the order id, step(3) shows item and action rows, step(4) shows review-only status, step(5) checks the cancel readback, and step(6) checks the honesty note.

cancel readback The section heading names the order cancel summary surface.

order rows Order, Item, Action, and Status values are exact pinned data.

no live cancellation The lesson should not imply order mutations, fulfillment services, payment services, refund services, storage, routes, APIs, networks, scripts, event listeners, form submits, analytics, timers, or live order cancellations.