Calendar Invite Response Patterns

RSVP Preview

A static RSVP choice preview shows Design review, Maybe choice, Checking workload reply note, and Not sent status.

Program

RSVP previews should show the selected reply and note before any response is sent.

rsvp_choice_preview.html
Visuals: captured from real browser rendering
<section class="rsvp-preview" aria-labelledby="rsvp-preview-title"><h2 id="rsvp-preview-title">RSVP choice preview</h2><dl>
  <div><dt>Event</dt><dd>Design review</dd></div>
  <div><dt>Choice</dt><dd>Maybe</dd></div><div><dt>Reply note</dt><dd>Checking workload</dd></div>
  <div><dt>Status</dt><dd><span class="badge">Not sent</span></dd></div></dl>
  <p class="check">Learner check: the RSVP choice is visible before any reply is sent.</p>
  <p class="note">Static RSVP choice preview only; no calendar service, RSVP service, invite sending, mailbox access, scheduling engine, notification service, storage, cookie, route, API, network, script, event listener, form submit, input, radio control, checkbox, analytics, timer, object URL, download, service worker, account/session behavior, or live submission runs.</p></section>
<style>
  .rsvp-preview { display: grid; gap: 10px; max-width: 38rem; border: 1px solid #1d4ed8; padding: 12px; background: #eff6ff; }
  .rsvp-preview dl { display: grid; gap: 8px; margin: 0; }
  .rsvp-preview dl div { display: grid; grid-template-columns: 8rem 1fr; gap: 8px; }
  .rsvp-preview dt { color: #475569; }
  .rsvp-preview dd, .check, .note { margin: 0; }
  .badge { border-radius: 999px; background: #dbeafe; padding: 2px 8px; }
  .note { color: #475569; }
</style>

  1. Label the RSVP preview.

    The section is labelled by its visible heading.
    The section is labelled by its visible heading.

  2. Show event row.

    The event is exact pinned data.
    The event is exact pinned data.

  3. Show choice and reply note rows.

    The choice and reply note are exact pinned data.
    The choice and reply note are exact pinned data.

  4. Render not-sent status.

    The status badge says the reply is not sent.
    The status badge says the reply is not sent.

  5. Check RSVP readback.

    The check says the RSVP choice is visible before any reply is sent.
    The check says the RSVP choice is visible before any reply is sent.

  6. Check RSVP honesty.

    Event, choice, note, status, and no live submission.
    Event, choice, note, status, and no live submission.
step flow step(1) labels the source, step(2) shows the event, step(3) shows choice and reply note rows, step(4) shows not-sent status, step(5) checks the RSVP readback, and step(6) checks the honesty note.
RSVP readback The section heading names the RSVP choice preview surface.
RSVP rows Event, Choice, Reply note, and Status values are exact pinned data.
no live RSVP send The lesson should not imply calendar services, RSVP services, invite sending, mailbox access, scheduling engines, notification services, storage, cookies, routes, APIs, networks, scripts, event listeners, form submits, inputs, radio controls, checkboxes, analytics, timers, object URLs, downloads, service workers, account/session behavior, or live submissions.