Reason Review - Everyday Interface Patterns

A static cancellation reason review shows Too expensive, Optional note, No contact selected, and Not submitted status.

Program

Cancellation reason reviews should show selected feedback without submitting surveys or retention events.

cancellation_reason_review.html

Visuals: captured from real browser rendering

<section class="reason-review" aria-labelledby="reason-review-title"><h2 id="reason-review-title">Cancellation reason review</h2><dl>
  <div><dt>Reason</dt><dd>Too expensive</dd></div>
  <div><dt>Note</dt><dd>Optional</dd></div><div><dt>Follow-up</dt><dd>No contact selected</dd></div>
  <div><dt>Status</dt><dd><span class="badge">Not submitted</span></dd></div></dl>
  <p class="check">Learner check: feedback is visible without submitting a survey.</p>
  <p class="note">Static reason review only; no survey submission, analytics event, account mutation, retention service, notification send, storage, route, API, network, script, form submit, analytics, timers, or live feedback runs.</p></section>
<style>
  .reason-review { display: grid; gap: 10px; max-width: 38rem; border: 1px solid #64748b; padding: 12px; }
  .reason-review dl { display: grid; gap: 8px; margin: 0; }
  .reason-review dl div { display: grid; grid-template-columns: 8rem 1fr; gap: 8px; }
  .reason-review dt { color: #475569; }
  .reason-review dd, .check, .note { margin: 0; }
  .badge { border-radius: 999px; background: #e2e8f0; padding: 2px 8px; }
  .note { color: #475569; }
</style>

Label the reason review.
The section is labelled by its visible heading.
Show reason row.
The reason is exact pinned data.
Show note and follow-up rows.
The note and follow-up are exact pinned data.
Render not-submitted status.
The status badge says feedback is not submitted.
Check reason readback.
The check says feedback is visible without submitting a survey.
Check reason honesty.
Reason, note, follow-up, status, and no live feedback.

step flow step(1) labels the source, step(2) shows the reason, step(3) shows note and follow-up, step(4) shows not-submitted status, step(5) checks the feedback readback, and step(6) checks the honesty note.

reason readback The section heading names the cancellation reason review surface.

reason rows Reason, Note, Follow-up, and Status values are exact pinned data.

no live feedback The lesson should not imply survey submissions, analytics events, account mutations, retention services, notification sends, storage, routes, APIs, networks, scripts, form submits, analytics, timers, or live feedback.